@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");

:root{color-scheme:dark;--dark:#131417;--panel:#363b3f;--field:#272c30;--yellow:#f9c846;--white:#f7f7f8;--muted:#a7abad;font-family:Poppins,Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}
html{min-height:100%}
body{margin:0;min-width:320px;background:var(--dark);color:var(--white)}
button,input,textarea{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
a:hover,.text-link:hover{color:var(--yellow)}
.layout{display:grid;grid-template-columns:minmax(0,58.33%) minmax(0,41.67%);min-height:100vh}
.hero,.contact{display:flex;flex-direction:column;min-width:0}
.hero{background:var(--dark);justify-content:space-between}
.contact{background:var(--panel);justify-content:space-between}
.hero__main{width:min(100%,690px);margin:auto;padding:64px 28px 40px;text-align:center}
.brand{display:grid;place-items:center;width:230px;min-height:160px;margin:0 auto 22px}
.brand img{display:block;width:100%;height:auto;filter:brightness(0) invert(1)}
.badge{display:inline-block;margin:0 0 26px;padding:5px 17px;background:var(--yellow);border-radius:5px;color:#20252a;font-size:clamp(23px,2.65vw,35px);font-weight:700;line-height:1.35}
h1{max-width:660px;margin:0 auto 24px;font-size:clamp(38px,4.9vw,62px);font-weight:700;line-height:1.3;letter-spacing:-.025em}
.hero__description{margin:0 0 20px;font-size:20px;line-height:1.6}
.subscribe-form{display:flex;width:min(100%,426px);height:55px;margin:auto}
.subscribe-form input{width:100%;min-width:0;padding:0 17px;border:1px solid #30363b;border-radius:5px 0 0 5px;background:var(--field);color:var(--white);outline:none}
.subscribe-form button{flex:0 0 auto;padding:0 21px;border:0;border-radius:0 5px 5px 0;background:var(--yellow);color:#22272a;font-weight:600}
.subscribe-form button:hover,.contact-form button:hover{background:#ffd666}
input:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}
input::placeholder,textarea::placeholder{color:#93989b;opacity:1}
.hero__footer{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:70px;padding:12px 18px;font-size:15px}
.hero__links{display:flex;flex-wrap:wrap;gap:16px 36px;align-items:center}
.text-link{padding:0;border:0;background:transparent;color:inherit}
.social{display:flex;gap:16px;font-size:19px;font-weight:700}
.contact__main{width:min(100%,455px);margin:auto;padding:55px 24px 30px;text-align:center}
h2{margin:0 0 10px;font-size:28px;line-height:1.4}
.contact__description{margin:0 auto 24px;color:var(--muted);font-size:16px;line-height:1.85}
.contact-form{display:grid;gap:16px;text-align:left}
.field input,.field textarea{display:block;width:100%;padding:15px 17px;border:1px solid transparent;border-radius:5px;background:var(--field);color:var(--white);outline:none}
.field input{height:55px}
.field textarea{min-height:78px;resize:vertical}
.field input:focus,.field textarea:focus{border-color:var(--yellow)}
.contact-form button{min-height:55px;margin-top:7px;border:0;border-radius:5px;background:var(--yellow);color:#22272a;font-weight:600}
.copyright{min-height:70px;padding:21px 15px;text-align:center;font-size:13px}
.copyright span{color:var(--yellow)}
.notice{margin:0 0 15px;padding:10px 12px;border-radius:5px;background:#244237;color:#d4ffe8;text-align:left;font-size:13px}
.notice--error{background:#552c2c;color:#fff0f0}
.errorlist{margin:5px 0 0;padding:0;list-style:none;color:#ffe19b;font-size:12px;text-align:left}
.form-errors{width:min(100%,426px);margin:6px auto 0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.about-dialog{width:min(90vw,570px);padding:28px;border:1px solid #4b5156;border-radius:8px;background:var(--panel);color:var(--white);line-height:1.7}
.about-dialog::backdrop{background:#000b}
.about-dialog__header{display:flex;align-items:center;justify-content:space-between}
.about-dialog__header button{border:0;background:transparent;color:var(--white);font-size:30px}
@media(max-width:900px){.layout{grid-template-columns:1fr}.hero{min-height:660px}.contact{min-height:630px}.hero__main{padding-top:80px}.hero__footer{padding:20px 24px}h1{font-size:clamp(38px,7vw,62px)}}
@media(max-width:560px){.hero{min-height:660px}.hero__main{padding:55px 20px 30px}.brand{width:195px;min-height:135px}.badge{font-size:24px}h1{font-size:38px;line-height:1.25}.hero__description{font-size:17px}.hero__footer{flex-direction:column;align-items:center;gap:14px;font-size:13px}.hero__links{justify-content:center}.contact__main{padding:55px 20px}.copyright{font-size:12px}}