/* ==========================================================================
   Animation primitives — the shared motion vocabulary for the whole site.
   Defined once here; not every keyframe below is wired into a section yet,
   but future sections should reuse these classes rather than writing new
   ones. Two easing curves only — see tokens.css. Never mix them.
   ========================================================================== */

/* Reveal — the base building block for scroll/load entrances, used site-wide */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition:
    opacity var(--duration-reveal) var(--ease-entrance),
    transform var(--duration-reveal) var(--ease-entrance);
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 { transition-delay: 0.08s; }
.reveal-delay-2 { transition-delay: 0.16s; }
.reveal-delay-3 { transition-delay: 0.24s; }
.reveal-delay-4 { transition-delay: 0.32s; }

/* Ambient photo zoom — hero now; reusable on any future full-bleed photo.
   The translate reads from --parallax-x/-y (set by main.js on mousemove,
   defaulting to 0) so a cursor-driven parallax can combine with the zoom
   instead of a second transform declaration silently overriding it. */
@keyframes ambient-zoom {
  from { transform: scale(1) translate(var(--parallax-x, 0px), var(--parallax-y, 0px)); }
  to   { transform: scale(1.06) translate(var(--parallax-x, 0px), var(--parallax-y, 0px)); }
}
.ambient-zoom {
  animation: ambient-zoom var(--duration-ambient) var(--ease-entrance) forwards;
  transition: transform 0.3s var(--ease-response);
}

/* Marquee — trust bar today; CSS-only, seamless via duplicated markup */
@keyframes marquee-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.marquee-track {
  /* Slower, calmer pace — reads as a deliberate proof strip, not a stock ticker. */
  animation: marquee-scroll 46s linear infinite;
}
.marquee:hover .marquee-track,
.marquee:focus-within .marquee-track {
  animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .ambient-zoom { animation: none; }
  /* Without the scroll animation, showing both copies of .marquee-content
     side by side would read as the same list accidentally repeated —
     collapse back to the single real (non-aria-hidden) copy. */
  .marquee-track { animation: none; }
  .marquee-content[aria-hidden="true"] { display: none; }
}