.hero{position:relative;min-height:calc(100svh - 90px);display:flex;flex-direction:column;justify-content:space-between;isolation:isolate}.hero-visual{position:absolute;inset:0;width:100%;height:100%;margin:0;border-radius:0;z-index:-2;will-change:transform}.hero-visual img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transform:none!important}.hero-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#031122d9 0%,#0311227a 48%,#03112215 80%),linear-gradient(0deg,#061321 0%,transparent 27%,#06132133 100%);pointer-events:none}.hero-copy{position:relative;z-index:2;width:100%;max-width:none;margin:0;padding:clamp(45px,8vh,100px) 5vw 160px}.hero h1{max-width:1050px;font-size:clamp(48px,6.6vw,102px);font-weight:600;text-shadow:0 3px 35px #03112240}.hero h1 span{color:#8cc8ff}.hero-bottom{display:block}.hero-bottom p{color:#d0deeb;font-size:17px}.hero-bottom .button{margin-top:26px}.hero-strip{position:relative;z-index:2;background:#071626b3;border-top:1px solid #ffffff1c;backdrop-filter:blur(10px)}.hero-data{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.trace-base{fill:none;stroke:#36c5ff;stroke-width:1.4;opacity:.32}.trace-flow{fill:none;stroke:#78e9ff;stroke-width:3;stroke-linecap:round;stroke-dasharray:65 1800;filter:drop-shadow(0 0 6px #00b9ff)}.trace-flow use{animation:station-data 7s linear infinite}.trace-flow use:nth-child(2){animation-delay:-2.7s;stroke:#77ffe3;animation-duration:8s}.trace-flow use:nth-child(3){animation-delay:-5s;stroke-width:2}.trace-nodes{fill:#a4f3ff;filter:drop-shadow(0 0 7px #26c9ff)}.trace-nodes circle{animation:data-pulse 3s ease-in-out infinite}.trace-nodes circle:nth-child(2n){animation-delay:-1.5s}.image-caption{z-index:2;bottom:82px;left:5vw;right:5vw;color:#c6e5fb;font-size:10px;letter-spacing:1.5px}.image-caption i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#6ce4ce;margin-right:8px;box-shadow:0 0 12px #6ce4ce}.motion-paused *{animation-play-state:paused!important}@keyframes station-data{to{stroke-dashoffset:-1865}}@keyframes data-pulse{50%{opacity:.35;r:3px}}@media(max-width:720px){.hero{min-height:calc(100svh - 74px)}.hero-copy{padding:50px 24px 180px}.hero h1{font-size:clamp(42px,10vw,65px);letter-spacing:-2px;margin:25px 0}.hero-bottom p{font-size:15px;max-width:340px}.hero-visual img{width:100%;left:0}.hero-visual:after{background:linear-gradient(180deg,#031122c9 0%,#0311229a 42%,#03112219 70%,#061321 100%)}.image-caption{left:24px;right:24px;bottom:105px;font-size:8px;letter-spacing:.8px}.hero-strip{gap:9px 20px;padding:18px 24px}.hero-data{opacity:.85}}@media(prefers-reduced-motion:reduce){html:not(.motion-enabled) .hero-visual{transform:none!important}html:not(.motion-enabled) .trace-flow use,html:not(.motion-enabled) .trace-nodes circle{animation:none}}

#start-motion{display:block;background:#071626a6;color:#c8e7ff;border:1px solid #6ab5df80;border-radius:30px;padding:9px 18px;margin-top:15px;font-size:12px}#start-motion[hidden]{display:none}

/* Short repeated packets avoid empty gaps; fixed SVG geometry avoids repaints from radius animation. */
.trace-flow{stroke-dasharray:32 100;stroke-width:3;filter:none}
.trace-flow use{animation:station-stream 1.15s linear infinite;will-change:stroke-dashoffset}
.trace-flow use:nth-child(2){animation-duration:.95s;animation-delay:-.4s}
.trace-flow use:nth-child(3){animation-duration:1.3s;animation-delay:-.8s}
.trace-nodes{filter:none}.trace-nodes circle{animation:trace-opacity 1.4s ease-in-out infinite}
@keyframes station-stream{from{stroke-dashoffset:0}to{stroke-dashoffset:-132}}
@keyframes trace-opacity{50%{opacity:.45}}
.hero-particles{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;contain:strict}.trace-flow,.trace-nodes{display:none}
