/* Editorial motion language: the story enters as a contact sheet, not a card grid. */
:root {
  --story-ease: cubic-bezier(.16, 1, .3, 1);
  --story-fast: 480ms;
  --story-base: 720ms;
  --story-slow: 920ms;
}

@media (prefers-reduced-motion: no-preference) {
  .motion-ready .story-reveal {
    transition:
      opacity var(--story-base) ease,
      transform var(--story-slow) var(--story-ease),
      clip-path var(--story-slow) var(--story-ease);
    transition-delay: var(--story-delay, 0ms);
    will-change: opacity, transform, clip-path;
  }

  .motion-ready .story-reveal:not(.is-visible) {
    opacity: 0;
    transform: translate3d(var(--story-x, 0), 44px, 0);
    clip-path: inset(10% 0 0 0);
  }

  .motion-ready .story-reveal[data-story-kind="line"]:not(.is-visible) {
    transform: translate3d(0, 24px, 0);
    clip-path: inset(0 100% 0 0);
  }

  .motion-ready .story-reveal[data-story-kind="media"]:not(.is-visible) {
    transform: translate3d(0, 0, 0) scale(.985);
    clip-path: inset(0 0 100% 0);
  }

  .motion-ready .story-reveal.is-visible {
    will-change: auto;
  }

  .motion-ready .story-reveal .project-media img,
  .motion-ready .story-reveal.journal-card figure img,
  .motion-ready .story-reveal.journal-hero__portrait img {
    transition: transform 1100ms var(--story-ease), filter 700ms var(--story-ease);
  }

  .motion-ready .story-reveal:not(.is-visible) .project-media img,
  .motion-ready .story-reveal.journal-card:not(.is-visible) figure img,
  .motion-ready .story-reveal.journal-hero__portrait:not(.is-visible) img {
    transform: scale(1.075);
  }

  .motion-ready:not(.page-arrived) .story-page-copy {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    clip-path: inset(0 0 22% 0);
  }

  .motion-ready:not(.page-arrived) .story-page-media {
    opacity: 0;
    transform: scale(1.018);
    clip-path: inset(0 0 100% 0);
  }

  .story-page-copy,
  .story-page-media {
    transition:
      opacity 620ms ease,
      transform 1050ms var(--story-ease),
      clip-path 1050ms var(--story-ease);
  }

  .story-page-media { transition-delay: 110ms; }

  .motion-ready:not(.page-arrived) .shell-nav,
  .motion-ready:not(.page-arrived) .site-nav,
  .motion-ready:not(.page-arrived) .global-nav {
    opacity: 0;
    transform: translate3d(0, -14px, 0);
  }

  .shell-nav,
  .site-nav,
  .global-nav {
    transition: opacity var(--story-fast) ease, transform var(--story-base) var(--story-ease);
  }
}

@media (max-width: 700px) and (prefers-reduced-motion: no-preference) {
  .motion-ready .story-reveal:not(.is-visible) {
    --story-x: 0 !important;
    transform: translate3d(0, 28px, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .story-reveal,
  .story-page-copy,
  .story-page-media {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    transition: none !important;
  }
}
