:root { color-scheme: dark; background:#070b18; color:#f6f4ef; font-family:Arial,Helvetica,sans-serif; }
* { box-sizing:border-box; }
body { margin:0; }
.hero { position:relative; width:100%; height:100svh; min-height:420px; overflow:hidden; isolation:isolate; background:#070b18; }
.hero__landscape,.hero__motion,.hero__shade { position:absolute; inset:0; width:100%; height:100%; }
.hero__landscape { object-fit:cover; object-position:center; }
.hero__motion { opacity:0; pointer-events:none; }
.hero__motion.ready { opacity:1; }
.hero__shade { pointer-events:none; background:linear-gradient(180deg,rgba(7,11,24,.25),transparent 24%,transparent 70%,rgba(7,11,24,.3)); }
.hero__circuits { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.circuit-bank { fill:none; stroke-linejoin:round; stroke-linecap:round; }
.circuit-bank--left { stroke:url(#trace-left); }
.circuit-bank--right { stroke:url(#trace-right); }
.circuit-base { stroke-width:2.5; opacity:.65; }
.circuit-bloom { stroke-width:6; opacity:.5; filter:url(#trace-glow); }
.circuit-flow { stroke-width:3.5; }
.circuit-flow use { stroke-dasharray:26 340; animation:signal-travel 5s linear infinite; }
.circuit-bank--left .circuit-flow { stroke:#b5ffff; }
.circuit-bank--right .circuit-flow { stroke:#fff0ac; }
.circuit-flow .trace-delay { animation-delay:-1.7s; }
.circuit-flow .trace-delay-more { animation-delay:-3.4s; }
.circuit-bank--right .circuit-flow use { animation-duration:5.8s; }
.circuit-nodes { stroke-width:3; fill:#070b18; filter:drop-shadow(0 0 7px currentColor); }
.circuit-bank--left .circuit-nodes { color:#00e5ff; }
.circuit-bank--right .circuit-nodes { color:#ff7a18; }
.hero[data-motion-paused="true"] .circuit-flow use { animation-play-state:paused; }
@keyframes signal-travel { from { stroke-dashoffset:366; } to { stroke-dashoffset:0; } }
.hero__identity { position:absolute; left:50%; top:47%; width:min(960px,94vw); transform:translate(-50%,-50%); text-align:center; }
h1 { margin:0; line-height:0; }
.hero__wordmark { display:block; width:min(650px,70vw); margin:auto; height:auto; filter:drop-shadow(0 8px 16px rgba(0,0,0,.8)); }
.hero__tagline { display:flex; justify-content:center; gap:.28em; margin:24px 0 0; padding:0; color:#f6f4ef; font-family:Impact,'DIN Condensed','Arial Narrow',sans-serif; font-size:clamp(29px,4.7vw,68px); font-weight:400; text-transform:uppercase; letter-spacing:.025em; line-height:1.15; text-shadow:0 3px 3px #070b18,0 0 24px #070b18,0 0 40px #070b18; }
.hero__tagline span { white-space:nowrap; }
.hero__tagline span:first-child { color:#00e5ff; }
.hero__tagline span:last-child { color:#ffe23b; }
.motion-toggle { position:absolute; right:clamp(18px,3vw,46px); bottom:max(24px,env(safe-area-inset-bottom)); display:flex; gap:10px; align-items:center; border:1px solid rgba(246,244,239,.36); border-radius:999px; background:rgba(7,11,24,.8); color:#f6f4ef; padding:12px 18px; font:500 13px/1.2 Arial,Helvetica,sans-serif; cursor:pointer; backdrop-filter:blur(8px); }
.motion-toggle[hidden] { display:none; }
.motion-toggle:hover { border-color:#00e5ff; }
.motion-toggle:focus-visible { outline:3px solid #00e5ff; outline-offset:5px; }
.motion-toggle__icon { width:12px; font-size:16px; text-align:center; }
@media(max-width:600px) { .hero__identity { width:96vw; top:45%; } .hero__wordmark { width:94vw; } .hero__tagline { margin-top:24px; font-size:clamp(27px,7.3vw,43px); gap:.2em; letter-spacing:0; } .hero__landscape { object-position:center; } .motion-toggle { padding:11px 14px; } }
@media(max-height:550px) and (min-width:601px) { .hero__identity { top:45%; } .hero__wordmark { width:min(450px,68vh); } .hero__tagline { font-size:32px; margin-top:8px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; } }