.hero-sky{position:absolute;top:0;left:0;right:0;height:clamp(240px,38vh,390px);z-index:0;pointer-events:none;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse 45% 80% at 53% 37%,#1a665548,transparent 84%);mask-image:linear-gradient(#000 0%,#000 69%,transparent 100%)}
.hero-sky:before{content:"";position:absolute;inset:0;opacity:.4;background:linear-gradient(90deg,#79cdb616 1px,transparent 1px),linear-gradient(#9cf9dc0d 1px,transparent 1px);background-size:56px 56px;transform:perspective(480px) rotateX(45deg) scale(1.35);transform-origin:top center;mask-image:linear-gradient(#000,transparent 85%)}
.hero-sky-grid{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;stroke:#98d6cb26;stroke-width:1}
.hero-sky-grid .sky-line{stroke:url(#sky-trace);stroke-width:1.7;stroke-dasharray:8 12;animation:sky-current 19s linear infinite}
.hero-sky-grid .sky-line-b{animation-duration:26s;animation-direction:reverse;opacity:.65}
.hero-sky-grid .sky-beacon{fill:#d0ff9a;stroke:none;filter:drop-shadow(0 0 8px #d0ff9a);animation:sky-beacon 3.5s ease-in-out infinite alternate}
.hero-sky-grid .sky-beacon-b{animation-delay:-1.6s}
.sky-unit{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;transform-style:preserve-3d;will-change:transform}
.sky-unit img{display:block;width:100%;height:auto;object-fit:contain;mix-blend-mode:screen;filter:brightness(1.06) contrast(1.15) drop-shadow(0 13px 21px #0e969d5b);mask-image:radial-gradient(ellipse 69% 67% at 50% 48%,#000 38%,transparent 100%)}
.sky-unit-caption{font:700 .62rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.17em;color:#a6f0dd;text-shadow:0 0 12px #041b1b;white-space:nowrap;margin-top:-16px}
.sky-unit-core{width:clamp(95px,11vw,168px);left:11%;top:36px;animation:core-float 8.5s ease-in-out infinite}
.sky-unit-air{width:clamp(250px,35vw,510px);left:50%;top:10px;translate:-50% 0;animation:air-float 11s ease-in-out infinite}
.sky-unit-air .sky-unit-caption{margin-top:-35px;color:#d0ff9a}
.sky-unit-ground{width:clamp(84px,12vw,156px);right:10%;top:25px;animation:ground-float 9s ease-in-out infinite}
.hero-sky-foot{position:absolute;right:2%;bottom:21px;color:#a3d6c6;font:700 .58rem ui-monospace,Consolas,monospace;letter-spacing:.17em}
@keyframes sky-current{to{stroke-dashoffset:-320}}
@keyframes sky-beacon{to{opacity:.25;filter:drop-shadow(0 0 2px #d0ff9a)}}
@keyframes core-float{50%{transform:translate3d(8px,-13px,0) rotateY(-5deg)}}
@keyframes air-float{25%{transform:translate3d(-13px,-12px,0) rotate(-2deg)}75%{transform:translate3d(14px,5px,0) rotate(2deg)}}
@keyframes ground-float{50%{transform:translate3d(-8px,-10px,0) rotateY(6deg)}}
@media(max-width:750px){.hero-sky{height:230px;opacity:.48;mask-image:linear-gradient(#000,transparent 100%)}.sky-unit-core,.sky-unit-ground,.sky-unit-caption,.hero-sky-foot{display:none}.sky-unit-air{width:clamp(220px,55vw,330px);left:auto;right:-8%;translate:none;top:18px}.hero .hero-content{position:relative;z-index:1}}
@media(prefers-reduced-motion:reduce){.hero-sky *, .hero-sky *:before, .hero-sky *:after{animation:none!important}}
