/* Mobile-only motion layer. Desktop layout and approved intro remain unchanged. */
@media (max-width:600px){
  body.mobile-motion-ready main section:not(.story-hero){
    --mobile-depth:0;
  }
  body.mobile-motion-ready .section .label,
  body.mobile-motion-ready .section .display,
  body.mobile-motion-ready .section .lead,
  body.mobile-motion-ready .section .bio,
  body.mobile-motion-ready .section .facts,
  body.mobile-motion-ready .section .spotify-wrap,
  body.mobile-motion-ready .section .work-intro,
  body.mobile-motion-ready .section .work-showcase,
  body.mobile-motion-ready .section .contact-copy,
  body.mobile-motion-ready .section .project-brief{
    opacity:0;
    transform:translate3d(0,26px,0) scale(.985);
    transition:opacity .72s ease,transform .9s cubic-bezier(.2,.72,.2,1);
    will-change:opacity,transform;
  }
  body.mobile-motion-ready .section.mobile-in-view .label,
  body.mobile-motion-ready .section.mobile-in-view .display,
  body.mobile-motion-ready .section.mobile-in-view .lead,
  body.mobile-motion-ready .section.mobile-in-view .bio,
  body.mobile-motion-ready .section.mobile-in-view .facts,
  body.mobile-motion-ready .section.mobile-in-view .spotify-wrap,
  body.mobile-motion-ready .section.mobile-in-view .work-intro,
  body.mobile-motion-ready .section.mobile-in-view .work-showcase,
  body.mobile-motion-ready .section.mobile-in-view .contact-copy,
  body.mobile-motion-ready .section.mobile-in-view .project-brief{
    opacity:1;transform:translate3d(0,0,0) scale(1)
  }
  body.mobile-motion-ready .section.mobile-in-view .display{transition-delay:.07s}
  body.mobile-motion-ready .section.mobile-in-view .lead,
  body.mobile-motion-ready .section.mobile-in-view .bio,
  body.mobile-motion-ready .section.mobile-in-view .work-intro,
  body.mobile-motion-ready .section.mobile-in-view .contact-copy{transition-delay:.14s}
  body.mobile-motion-ready .section.mobile-in-view .facts,
  body.mobile-motion-ready .section.mobile-in-view .spotify-wrap,
  body.mobile-motion-ready .section.mobile-in-view .project-brief{transition-delay:.2s}
  body.mobile-motion-ready .section.mobile-in-view .work-showcase{transition-delay:.28s}

  .story-stage{transform:translateZ(0)}
  .story-stage .board-surface{filter:saturate(calc(1 + var(--mobile-depth,0)*.12)) brightness(calc(.94 + var(--mobile-depth,0)*.08));}
  .story-hero .story-copy{transform:translate3d(0,calc((1 - var(--mobile-depth,0))*12px),0);transition:transform .12s linear}

  .notes{touch-action:pan-y pinch-zoom;transform:translateZ(0)}
  .note{backface-visibility:hidden;box-shadow:0 18px 42px rgba(53,43,5,.2)}
  .note.mobile-touching{filter:brightness(1.015);box-shadow:0 24px 54px rgba(53,43,5,.27)}
  .note-count:after{content:"  ·  swipe";font-size:11px;letter-spacing:.12em;color:#777d85}

  .work-viewport{touch-action:pan-y pinch-zoom;cursor:grab}
  .work-viewport.mobile-touching{cursor:grabbing}
  .work-track{transform:translate3d(var(--mobile-work-x,0),0,0);transition:opacity .2s ease,transform .34s cubic-bezier(.22,.8,.3,1)}
  .work-viewport.mobile-touching .work-track{transition:none}
  .work-showcase{box-shadow:0 16px 46px rgba(17,22,29,.08)}

  .spotify-wrap{transform-origin:center top}
  .contact{background-position:calc(50% + var(--contact-drift,0px)) center}
  .brief-submit{transition:transform .18s ease,filter .18s ease}
  .brief-submit:active{transform:scale(.975);filter:brightness(1.08)}
}

@media (max-width:600px) and (prefers-reduced-motion:reduce){
  body.mobile-motion-ready .section .label,
  body.mobile-motion-ready .section .display,
  body.mobile-motion-ready .section .lead,
  body.mobile-motion-ready .section .bio,
  body.mobile-motion-ready .section .facts,
  body.mobile-motion-ready .section .spotify-wrap,
  body.mobile-motion-ready .section .work-intro,
  body.mobile-motion-ready .section .work-showcase,
  body.mobile-motion-ready .section .contact-copy,
  body.mobile-motion-ready .section .project-brief{opacity:1;transform:none;transition:none}
  .story-stage .board-surface,.story-hero .story-copy,.brief-submit{transition:none}
}
