/* Layered 3D hero; existing content and navigation remain semantic HTML. */
.hero-3d .hero-inner{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.hero-3d .hero-inner>div:first-child{position:relative;z-index:2;min-width:0}
.hero-3d h1{font-size:clamp(26px,4.2vw,58px);line-height:1.3}
.hero-3d .scene-stage{position:relative;width:100%;min-width:0;isolation:isolate}
.scene-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}
.season-stage{height:480px;perspective:1000px}
.scene-logo{position:absolute;left:50%;top:48%;width:30%;height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 15px 28px #1ad3df60)}
.scene-chip{position:absolute;padding:10px 14px;font-size:13px;font-weight:700;background:#0a1f30e6;border:1px solid #59cad25c;border-radius:12px;box-shadow:0 15px 35px #0005;transform:translateY(var(--float,0px))}
.scene-chip small{display:block;color:#8cdbde;font-size:9px;letter-spacing:.18em;margin-bottom:5px}
.chip-one{left:5%;top:12%}.chip-two{right:0;top:49%}.chip-three{left:9%;bottom:6%}
.app-stage{padding:20px 0 5px;perspective:1000px}
.hero-3d .phone{animation:none;transform:rotateY(-22deg) rotateX(8deg) rotateZ(5deg);transform-style:preserve-3d;will-change:transform;background:linear-gradient(145deg,#779da9,#122533 19%,#091522 80%,#7a9bab);box-shadow:18px 30px 60px #0008,inset 0 0 0 2px #92b8c555}
.hero-3d .phone .screen{overflow:visible;transform-style:preserve-3d}
.hero-3d .phone .top{border-radius:32px 32px 0 0}
.hero-3d .phone .tabs{border-radius:0 0 32px 32px}
.hero-3d .phone .row{animation:none;opacity:1;transform:translateX(var(--spread,0px)) translateZ(var(--depth,0px));box-shadow:0 12px 20px #12384122}
.motion-toggle{position:absolute;right:24px;bottom:28px;z-index:5;border:1px solid #6bb3bb77;background:#102734;color:#f2ffff;border-radius:24px;padding:11px 18px;font:inherit;font-size:12px;cursor:pointer}
.motion-toggle:focus-visible{outline:3px solid #ffd580;outline-offset:4px}
html.motion-stopped *,html.motion-stopped *::before,html.motion-stopped *::after{animation-play-state:paused!important;transition:none!important}
/* Pause must never leave entry animation text hidden. */
html.motion-stopped .hero h1 .line>span{transform:none!important}
html.motion-stopped .phone .row,html.motion-stopped .reveal{opacity:1!important;transform:none!important}
@media(max-width:960px){.hero-3d .hero-inner{grid-template-columns:1fr}.hero-3d .hero-inner>div:first-child{max-width:680px}.season-stage{max-width:520px;height:430px;margin:auto}.app-stage{max-width:420px;margin:auto}.hero-3d h1{font-size:clamp(24px,6.2vw,52px)}}
@media(max-width:640px){.hero-3d .hero-inner{gap:25px;padding-top:65px;padding-bottom:105px}.season-stage{height:350px;max-width:360px}.scene-chip{font-size:11px;padding:9px 11px}.hero-3d .phone{width:240px;height:510px}.hero-3d .phone .row{font-size:12px}.motion-toggle{right:20px;bottom:22px}.hero-3d .lead{font-size:16px}}
@media(prefers-reduced-motion:reduce){.hero-3d .phone{transform:rotateY(-14deg) rotateX(5deg)}.scene-chip,.hero-3d .phone .row{transform:none!important}}
