/* Only opacity/transform animate; layout and scrolling stay native. */
.hero-motion-layers { display:none; position:absolute; inset:0; pointer-events:none; }
.hero-visual { animation:none; }
.hero-visual.has-motion .hero-still { opacity:0; }
.hero-visual.has-motion .hero-motion-layers { display:block; }
.hero-motion-layers .hero-panel,.hero-motion-layers .hero-foreground { position:absolute; inset:0; width:100%; height:100%; }
.hero-motion-layers img { width:100%; height:100%; object-fit:contain; border-radius:0; mix-blend-mode:normal; }
.hero-panel { --enter-delay:0s; --float-time:6s; animation:panel-enter .85s var(--enter-delay) cubic-bezier(.2,.7,.2,1) both; }
.hero-panel img { animation:panel-float var(--float-time) ease-in-out infinite alternate; }
.panel-left { --enter-delay:.12s; --float-time:5.8s; }
.panel-center { --enter-delay:.4s; --float-time:6.7s; }
.panel-right { --enter-delay:.68s; --float-time:6.2s; }
.panel-left img { clip-path:inset(0 67% 0 0); }
.panel-center img { clip-path:inset(0 36% 0 33%); animation-delay:-2s; }
.panel-right img { clip-path:inset(0 0 0 64%); animation-delay:-4s; }
.hero-foreground { z-index:1; }
.hero-visual:not(.motion-playing) .hero-panel,.hero-visual:not(.motion-playing) .hero-panel img { animation-play-state:paused; }
.hero-motion-toggle { position:absolute; z-index:2; right:16px; bottom:4px; border:1px solid #d7e3f1; border-radius:99px; padding:8px 12px; background:#fffffff0; color:var(--muted); font:inherit; font-size:12px; cursor:pointer; }
.hero-motion-toggle:focus-visible { outline:2px solid var(--brand-deep); outline-offset:3px; }
[data-scroll-motion] { transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1); transition-delay:var(--reveal-delay,0ms); }
[data-scroll-motion].motion-pending { opacity:0; transform:translateY(20px); }
[data-scroll-motion]:focus-within { opacity:1; transform:none; transition-delay:0s; }
@keyframes panel-enter { from { opacity:0; transform:translateY(22px) scale(.98); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes panel-float { from { transform:translateY(0); } to { transform:translateY(-10px); } }
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  [data-scroll-motion].motion-pending { opacity:1; transform:none; }
  .hero-visual.has-motion .hero-still { opacity:1; }
  .hero-visual.has-motion .hero-motion-layers,.hero-motion-toggle { display:none; }
}