:root { color-scheme:dark; --bg:#05060a; --panel:#0d111a; --line:#263247; --text:#f4f7ff; --muted:#8d97aa; --cyan:#20f6ff; --pink:#ff2bd6; --orange:#ff8a00; --yellow:#ffe04a; }
* { box-sizing:border-box; }
html { overflow-x:hidden; scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:radial-gradient(circle at 84% 8%,rgba(255,43,214,.12),transparent 30%),radial-gradient(circle at 12% 28%,rgba(32,246,255,.08),transparent 27%),var(--bg); font:16px/1.7 "Segoe UI",Arial,sans-serif; }
a { color:inherit; }
a:focus-visible { outline:3px solid var(--yellow); outline-offset:3px; }
.site-nav,main,.site-footer { width:min(1120px,calc(100% - 40px)); margin-inline:auto; }
.site-nav { display:flex; align-items:center; gap:22px; min-height:70px; border-bottom:1px solid var(--line); }
.site-nav>a:first-child { margin-right:auto; color:var(--cyan); font-weight:900; letter-spacing:.12em; text-decoration:none; }
.site-nav a:not(:first-child) { color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
.hero { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr); gap:60px; align-items:center; min-height:680px; padding:80px 0; }
.hero img { width:100%; height:auto; aspect-ratio:8/5; object-fit:contain; border:1px solid var(--line); border-radius:14px; box-shadow:0 30px 80px #000; }
.eyebrow { margin:0 0 12px; color:var(--orange); font-size:11px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:Impact,"Arial Black",sans-serif; text-transform:uppercase; }
h1 { margin-bottom:24px; font-size:clamp(50px,7vw,96px); line-height:.88; letter-spacing:.01em; text-shadow:-3px 0 var(--pink),3px 0 var(--cyan); }
h2 { margin-bottom:18px; font-size:clamp(34px,5vw,62px); line-height:.95; }
h3 { margin-bottom:10px; font-size:19px; text-transform:uppercase; }
.lede { max-width:720px; color:#b7c4d4; font-size:clamp(18px,2.2vw,24px); line-height:1.5; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.actions a { padding:13px 18px; border:1px solid #35506b; border-radius:7px; font-size:11px; font-weight:900; letter-spacing:.1em; text-decoration:none; }
.actions .primary { color:#081016; background:var(--yellow); border-color:#fff4a4; }
.toc { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 70px; padding:14px; background:rgba(13,17,26,.84); border:1px solid var(--line); border-radius:10px; }
.toc a { padding:8px 11px; color:#b6c8d8; font-size:11px; font-weight:800; text-decoration:none; }
.content { display:grid; gap:90px; padding-bottom:100px; }
.content>section { content-visibility:auto; contain-intrinsic-size:auto 520px; }
.split { display:grid; grid-template-columns:.75fr 1.25fr; gap:70px; align-items:start; }
.copy { color:#aebaca; }
.copy strong { color:#fff; }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.card { padding:24px; background:linear-gradient(145deg,#101a28,#070b12); border:1px solid var(--line); border-radius:10px; }
.card b { display:block; margin-bottom:18px; color:var(--cyan); font-size:11px; letter-spacing:.12em; }
.card p { margin:0; color:var(--muted); font-size:14px; }
.steps { display:grid; gap:1px; overflow:hidden; padding:1px; background:var(--line); border-radius:10px; counter-reset:steps; }
.steps article { display:grid; grid-template-columns:54px 1fr; gap:18px; padding:22px; background:#080d15; counter-increment:steps; }
.steps article::before { content:counter(steps,decimal-leading-zero); color:var(--orange); font-size:12px; font-weight:900; }
.steps p { margin:0; color:var(--muted); }
.feature-image { width:100%; border:1px solid var(--line); border-radius:12px; }
.callout { padding:30px; background:linear-gradient(120deg,rgba(32,246,255,.09),rgba(255,43,214,.07)); border:1px solid #33506a; border-radius:12px; }
.callout p:last-child { margin-bottom:0; }
.site-footer { display:flex; flex-wrap:wrap; gap:18px; padding:28px 0 44px; color:var(--muted); border-top:1px solid var(--line); font-size:11px; }
.site-footer span { margin-right:auto; color:var(--cyan); font-weight:900; }
@media (max-width:800px) { .site-nav a:not(:first-child):not(:last-child) { display:none; }.hero,.split { grid-template-columns:1fr; gap:32px; }.hero { min-height:0; padding:60px 0; }.hero img { order:-1; }.cards { grid-template-columns:1fr 1fr; }.content { gap:70px; } }
@media (max-width:520px) { .site-nav,main,.site-footer { width:min(100% - 24px,1120px); }.cards { grid-template-columns:1fr; }.steps article { grid-template-columns:36px 1fr; padding:18px 14px; }h1 { font-size:48px; }.site-footer span { width:100%; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { animation:none!important; scroll-behavior:auto!important; transition:none!important; } }