.atmosphere-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
main{position:relative;z-index:1}.footer{position:relative;z-index:1}
.cloud-stage .orbit{display:block;left:3%;top:20%;width:94%;height:60%;border-color:#41679e;opacity:.55;animation:alpine-orbit-a 34s linear infinite;transform:rotate(-27deg)}
.cloud-stage .orbit-b{top:23%;opacity:.3;animation:alpine-orbit-b 43s linear infinite;transform:rotate(32deg)}
@keyframes alpine-orbit-a{from{transform:rotate(-27deg)}to{transform:rotate(333deg)}}
@keyframes alpine-orbit-b{from{transform:rotate(32deg)}to{transform:rotate(-328deg)}}
.hero-asleep .orbit{animation-play-state:paused}
.motion-off .atmosphere-canvas{visibility:hidden}
.flow-packet{fill:#a9ccff;stroke:#4387f5;stroke-width:1.5;pointer-events:none}
.control{position:relative;isolation:isolate}
.control::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 80% 40%,#1d3c694d,transparent 65%);pointer-events:none;z-index:-1}
.control-theatre{position:relative;perspective:1400px;transform-style:flat;padding:20px 0}
.control-theatre::before,.control-theatre::after{content:'';position:absolute;inset:20px 0;border-radius:14px;border:1px solid #3a557d;pointer-events:none;z-index:0;background:#172b49}
.control-theatre::before{transform:translate(15px,-12px) rotate(2deg)}
.control-theatre::after{transform:translate(-10px,14px) rotate(-2deg);background:#111f36}
.project-demo{position:relative;z-index:3;isolation:isolate;box-shadow:0 25px 50px -38px #000}
.start-steps li{isolation:isolate}
.start-steps li::before{content:'';position:absolute;inset:3px -20px;border-radius:12px;background:#112038;z-index:-1;opacity:0;transition:opacity .15s var(--ease-out);pointer-events:none}
@media(hover:hover) and (pointer:fine){.start-steps li:hover::before{opacity:1}}
.start-steps li:focus-within::before{opacity:1}
@media(max-width:700px){
 .cloud-stage .orbit{left:6%;top:18%;width:88%;height:64%;opacity:.45}.cloud-stage .orbit-b{opacity:.25}
 .control-theatre{padding:16px 0}.control-theatre::before,.control-theatre::after{inset:16px 0}
 .control-theatre::before{transform:translate(8px,-8px) rotate(1.5deg)}.control-theatre::after{transform:translate(-6px,8px) rotate(-1.5deg)}
 .start-steps li::before{inset:3px -8px}
}
@media(prefers-reduced-motion:reduce){.atmosphere-canvas{display:none}.orbit{animation:none!important}}
