/* Scroll-linked movement uses native scrolling and runs only on scroll/resize. */
.motion-story{display:none}
@media(prefers-reduced-motion:no-preference){
  .cinematic .hero-copy{animation:hero-arrive 1.15s cubic-bezier(.16,1,.3,1) both}
  .cinematic .hero-visual{animation:visual-arrive 1.6s cubic-bezier(.16,1,.3,1) both}
  .cinematic .hero{--hero-shift:0px;--hero-turn:0deg}
  .cinematic .code-mark{animation:none;transform:translateY(var(--hero-shift)) rotate(var(--hero-turn));transition:none}
  .cinematic .orbit-one{transform:rotate(calc(-30deg + var(--hero-turn))) scaleY(.72)}
  .cinematic .orbit-two{transform:rotate(calc(52deg - var(--hero-turn))) scaleY(.72)}
  .cinematic .motion-story{display:block;position:relative;height:175svh;background:radial-gradient(ellipse at 80% 40%,#253c8528,transparent 60%);border-bottom:1px solid var(--line)}
  .story-stage{position:sticky;top:98px;height:calc(100svh - 98px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;overflow:hidden}
  .story-caption,.story-footnote{font-size:12px;letter-spacing:2px;color:var(--muted)}
  .story-words{display:flex;flex-direction:column;margin:25px 0;line-height:1.04;font-family:var(--heading);font-size:clamp(64px,10vw,145px);font-weight:600;letter-spacing:-.065em;width:100%}
  .story-words>span{color:#454c60;transform:translateX(var(--slide,0px));background:linear-gradient(90deg,#ecf0ff var(--ink,0%),#454c60 var(--ink,0%));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
  .story-words>span:nth-child(2){margin-left:20%}
  .story-words>span:nth-child(3){margin-left:42%;background-image:linear-gradient(90deg,#859cff var(--ink,0%),#454c60 var(--ink,0%))}
  .story-track{width:100%;height:1px;background:#ffffff15;margin:12px 0 24px}
  .story-track>span{display:block;height:2px;background:var(--blue);transform:scaleX(var(--story-progress,0));transform-origin:left}
  .cinematic .paint-heading{background:linear-gradient(100deg,#f1f2f6 var(--heading-ink,0%),#777f95 var(--heading-ink,0%));background-clip:text;-webkit-background-clip:text;color:transparent}
  .cinematic .paint-heading span{color:inherit}
  .cinematic .motion-ready .reveal{transform:translateY(48px)}
  .cinematic.motion-ready .reveal{transform:translateY(48px);transition-duration:1s}
  .cinematic.motion-ready .reveal.visible{transform:none}
  .cinematic .project-art img,.cinematic .otoogram-visual img{translate:0 var(--image-shift,0px)}
  .cinematic .project-card .project-art{clip-path:inset(var(--card-inset,0%) 0 0 0 round 5px)}
  .cinematic .otoogram-project{transform-origin:50% 100%;scale:var(--card-scale,1);box-shadow:0 28px 70px #0004}
  .cinematic .timeline{position:relative}
  .cinematic .timeline:after{content:'';position:absolute;width:2px;left:-1px;top:0;height:100%;background:linear-gradient(var(--blue),#4066ff);transform:scaleY(var(--timeline-fill,0));transform-origin:top;pointer-events:none}
  @media(min-width:1000px){.cinematic .experience>div:first-child{position:sticky;top:145px;align-self:start}.cinematic .projects>.section-heading{margin-bottom:70px}.cinematic .otoogram-project{min-height:390px;margin-bottom:64px}}
  @media(max-width:760px){.cinematic .motion-story{height:140svh}.story-stage{top:76px;height:calc(100svh - 76px)}.story-words{font-size:clamp(65px,18vw,108px);margin:40px 0}.story-caption,.story-footnote{font-size:10px;letter-spacing:1.4px}.cinematic .otoogram-project{scale:1}.cinematic.motion-ready .reveal{transform:translateY(24px)}.cinematic.motion-ready .reveal.visible{transform:none}}
}
@keyframes hero-arrive{from{opacity:0;transform:translateY(45px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes visual-arrive{from{opacity:0;transform:scale(.78) rotate(-8deg)}to{opacity:1;transform:none}}
