/* One copy of each heading remains semantic and selectable. Phrase wrappers
   keep natural word wrapping and inherit the existing accent/italic treatment. */
.heading-phrase { display: inline-block; max-width: 100%; vertical-align: top; }
.hero-title-wrap h1>.heading-phrase { color: inherit; }
.opening .heading-accent { color: var(--muted); font-weight: 360; }

/* These are positions on the existing scroll timeline, not timed reveals.
   Copy stays legible from the first frame, finishes early, and rewinds exactly.
   No new animation loop, blur pass or animated layout/letter spacing is needed. */
html[data-story='ready'] [data-heading-motion] { transform: none; }
html[data-story='ready'] [data-heading-motion] em { transform: none; }
html[data-story='ready'] .heading-phrase {
  --heading-step: 0;
  --heading-travel: 16px;
  --heading-phase: clamp(0,calc(var(--scene-progress,0) * 2.4 - var(--heading-step) * .12),1);
  --heading-ease: calc(var(--heading-phase) * var(--heading-phase) * (3 - 2 * var(--heading-phase)));
  transform: translate3d(0,calc((1 - var(--heading-ease)) * var(--heading-travel)),0);
  opacity: calc(.84 + var(--heading-ease) * .16);
}
html[data-story='ready'] .hero-title-wrap .heading-phrase { opacity: 1; }
html[data-story='ready'] .heading-phrase[data-heading-step='1'] { --heading-step: 1; }
html[data-story='ready'] .heading-phrase[data-heading-step='2'] { --heading-step: 2; }
html[data-story='ready'] h3 .heading-phrase { --heading-travel: 6px; }

@media (max-width: 760px) {
  html[data-story='ready'] .heading-phrase { --heading-travel: 10px; }
  html[data-story='ready'] h3 .heading-phrase { --heading-travel: 4px; }
}
@media (max-width: 760px) and (max-height: 700px) {
  html[data-story='ready'] .concept-copy .heading-phrase { --heading-travel: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  html:not([data-motion-preference='full'])[data-story='ready'] .heading-phrase { transform: none; opacity: 1; }
}