/* Both opening shots share a stage; its parent supplies the scroll distance. */
@media (prefers-reduced-motion: no-preference) {
  .motion .opening-reel { position: relative; height: 190svh; }
  .motion .reel-stage { position: sticky; top: 0; height: 100svh; overflow: hidden; background: #090b09; }
  .motion .reel-stage > .hero,
  .motion .reel-stage > .chair { position: absolute; inset: 0; height: 100%; min-height: 0; isolation: isolate; }
  .motion .reel-stage .hero-sticky { position: relative; height: 100%; }
  .motion .reel-stage > .chair { opacity: var(--chair-opacity, 0); }
  .motion .reel-stage .chair .scene-picture { clip-path: none; }
  .motion .reel-stage .chair .scene-picture img { transform: scale(var(--chair-scale, 1)); }
  .motion .reel-stage .chair .scene-copy { opacity: var(--chair-copy, 0); transform: none; }
  .motion .reel-stage .chair::after { display: none; }
  .motion .reel-stage::after {
    content: ""; position: absolute; inset: 0; background: #090b09;
    opacity: var(--reel-shade, 0); pointer-events: none; z-index: 3;
  }
  .motion .hero-sticky::after,
  .motion .scene::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #090b09;
    opacity: var(--cut-shade, 0);
    pointer-events: none;
  }
  .motion .scene { background: #10120e; }
  .motion .scene-picture {
    inset: 0;
    transform: none;
    clip-path: inset(0 var(--shot-aperture, 0%));
  }
  .motion .scene-picture img { transform: scale(var(--shot-scale, 1)); }
}