
:root{--night:#0B0E22;--dusk:#151935;--moon:#F5E1B2;--lav:#A9A3EF;--text:#F1F0F9;--text2:#B6B7D0;--surf:rgba(255,255,255,.06);--stroke:rgba(255,255,255,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;color:var(--text);background:var(--night);line-height:1.6}
a{color:var(--moon)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:10;background:rgba(11,14,34,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--stroke)}
nav{display:flex;align-items:center;gap:18px;height:64px}
nav .brand{display:flex;align-items:center;gap:10px;font:800 22px Nunito,sans-serif;color:var(--text);text-decoration:none;margin-right:auto}
nav .brand img{width:36px;height:36px}nav .brand span{color:var(--moon)}
nav a.l{color:var(--text2);text-decoration:none;font-size:15px}nav a.l:hover{color:var(--text)}
.lang{border:1px solid var(--stroke);border-radius:99px;padding:4px 12px;text-decoration:none;font-size:14px}
.hero{background:radial-gradient(ellipse 90% 70% at 50% 0%,#363C86 0%,#1E2452 45%,var(--night) 85%);padding:70px 0 40px;text-align:center}
.hero img.logo{width:140px;height:140px}
h1{font:800 clamp(40px,7vw,72px)/1.05 Nunito,sans-serif;margin:16px 0 0;letter-spacing:-1px}h1 span{color:var(--moon)}
.hero p.tag{font-size:clamp(18px,2.4vw,23px);color:var(--text2);max-width:640px;margin:18px auto 0}
.pills{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}
.pill{border:1px solid var(--stroke);background:var(--surf);border-radius:99px;padding:8px 16px;font-size:15px}
.cta{display:inline-block;margin-top:30px;background:var(--moon);color:#1A182E;font-weight:700;padding:14px 28px;border-radius:99px;text-decoration:none}
.hero .banner{width:100%;max-width:920px;border-radius:24px;margin-top:44px;box-shadow:0 30px 80px rgba(0,0,0,.45)}
section{padding:64px 0}h2{font:800 clamp(30px,4.5vw,42px)/1.15 Nunito,sans-serif;margin:0 0 10px;text-align:center}
.lead{text-align:center;color:var(--text2);max-width:640px;margin:0 auto 34px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.feat{background:var(--surf);border:1px solid var(--stroke);border-radius:20px;padding:22px}
.feat b{display:block;font-size:18px;margin:8px 0 4px}.feat .i{font-size:28px}.feat p{margin:0;color:var(--text2);font-size:15px}
.shots{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 18px}
.shots img{height:min(560px,70vh);width:auto;border-radius:22px;scroll-snap-align:center;flex:none}
.videos{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
.videos figure{margin:0;text-align:center}.videos video{width:min(300px,80vw);border-radius:22px;background:#000;display:block}
.videos figcaption{color:var(--text2);font-size:14px;margin-top:8px}
.faq details{background:var(--surf);border:1px solid var(--stroke);border-radius:16px;padding:14px 18px;margin-bottom:10px}
.faq summary{cursor:pointer;font-weight:600}.faq p{color:var(--text2);margin:10px 0 0}
footer{border-top:1px solid var(--stroke);padding:30px 0;color:var(--text2);font-size:14px;text-align:center}
footer a{margin:0 8px}
@media(max-width:700px){nav{gap:12px}nav a.l{display:none}nav a.l.p{display:inline}nav .brand{font-size:19px}}
.doc{max-width:760px;margin:0 auto;padding:50px 20px 70px}.doc h1{font-size:clamp(32px,5vw,46px);text-align:left}
.doc h2{text-align:left;font-size:24px;margin:34px 0 8px}.doc p,.doc li{color:#D6D7EA}.doc .meta{color:var(--text2)}
