:root{--bg:#120c2b;--bg2:#1d1440;--card:#1c1f4a;--line:#3a3f80;--gold:#ffd23f;--orange:#ff7b3a;--ink:#fff;--mute:#c4c9f5}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 50% -10%,#3b2766 0%,var(--bg2) 38%,var(--bg) 100%) fixed;color:var(--ink);font:500 17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--gold)}
.wrap{width:min(1080px,92vw);margin:0 auto}
header.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font:900 20px system-ui;letter-spacing:.04em}
.brand img{width:40px;height:40px;border-radius:10px}
.nav a.link{color:var(--mute);text-decoration:none;margin-left:18px;font-weight:700;font-size:15px}
.nav a.link:hover{color:#fff}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;padding:34px 0 56px}
.hero h1{margin:0;font:900 clamp(44px,8vw,84px)/.95 system-ui;letter-spacing:.02em;color:var(--gold);text-shadow:0 .06em 0 #b3361b,0 .12em 0 #6b1d0c,0 0 .5em #ff7b3a66}
.hero p.lead{font-size:clamp(18px,2.4vw,22px);color:var(--mute);margin:18px 0 26px;max-width:30em}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.5em;padding:.9em 1.6em;border-radius:16px;font:900 18px system-ui;letter-spacing:.06em;text-decoration:none;color:#fff;background:linear-gradient(#5b61b8,#3a3f86);box-shadow:0 .28em 0 #1b1e4f,0 .5em 1em #0007;transition:transform .08s,filter .12s}
.btn:hover{filter:brightness(1.12);transform:translateY(-2px)}
.btn.primary{font-size:22px;padding:1em 2em;background:linear-gradient(#ff9548,#e8421c);box-shadow:0 .28em 0 #8a2410,0 .5em 1.2em #0008,inset 0 .1em 0 #ffffff55}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.tag{padding:.3em .8em;border-radius:99px;background:#ffffff14;border:1.5px solid #ffffff26;font-weight:800;font-size:14px}
.phone{justify-self:center;width:min(300px,70vw);aspect-ratio:2/3;border-radius:28px;border:6px solid #fff;overflow:hidden;box-shadow:0 30px 70px #000a,0 0 90px #ff7b3a44;background:#000;transform:rotate(3deg)}
.phone video,.phone img{width:100%;height:100%;object-fit:cover;display:block}
section{padding:34px 0}
h2{font:900 clamp(26px,4vw,38px) system-ui;margin:0 0 18px;color:var(--gold);letter-spacing:.03em}
.grid{display:grid;gap:16px}
.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{background:linear-gradient(#1f2352,#161843);border:2px solid var(--line);border-radius:18px;padding:18px 18px 16px}
.card h3{margin:0 0 6px;font:800 19px system-ui}
.card p{margin:0;color:var(--mute);font-size:15.5px}
.ico{font-size:34px;line-height:1;margin-bottom:8px}
.shots{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.shots img{width:100%;border-radius:18px;border:4px solid #fff;box-shadow:0 14px 34px #0009;display:block}
.how{display:grid;grid-template-columns:1fr 1fr;gap:16px}
kbd{background:#ffffff1f;border:1.5px solid #ffffff44;border-bottom-width:3px;border-radius:7px;padding:.05em .5em;font:800 .92em ui-monospace,monospace}
.rides{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;text-align:center}
.ride{background:#ffffff10;border:2px solid var(--line);border-radius:16px;padding:14px 6px}
.ride b{display:block;font-size:34px;line-height:1.1}.ride span{font-weight:800;font-size:14px}.ride small{display:block;color:var(--mute);font-size:12.5px}
footer{padding:36px 0 46px;color:var(--mute);font-size:14.5px;border-top:1px solid #ffffff18;margin-top:30px}
footer .cols{display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between}
footer a{color:var(--mute)}footer a:hover{color:#fff}
.doc{max-width:760px;padding:10px 0 50px}.doc h1{font:900 clamp(30px,5vw,44px) system-ui;color:var(--gold);margin:10px 0 6px}.doc h2{font-size:22px;margin:30px 0 8px;color:#fff}.doc p,.doc li{color:var(--mute)}.doc .upd{color:#9aa0d8;font-size:14px}
@media(max-width:860px){.hero{grid-template-columns:1fr;text-align:center}.hero p.lead{margin-left:auto;margin-right:auto}.cta,.tags{justify-content:center}.g3,.g4{grid-template-columns:1fr 1fr}.shots{grid-template-columns:1fr 1fr}.how{grid-template-columns:1fr}.rides{grid-template-columns:repeat(3,1fr)}.nav a.link.hide{display:none}}
@media(max-width:520px){.g3,.g2,.g4{grid-template-columns:1fr}.rides{grid-template-columns:repeat(2,1fr)}}
