/* ==========================================================================
   ANIMATIONS — keyframes + orchestrated scroll-reveal system.
   Reveals are driven by an IntersectionObserver in main.js which toggles
   [data-reveal] -> .is-in. Stagger via --reveal-i (set in markup or JS).
   ========================================================================== */

@keyframes scrollPulse {
  0%   { transform: translateY(-100%); }
  60%  { transform: translateY(0%); }
  100% { transform: translateY(100%); }
}

@keyframes heroZoom {
  from { transform: scale(1.16); }
  to   { transform: scale(1.05); }
}

@keyframes floatUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* --- Hero entrance (orchestrated) ----------------------------------------- */
.hero__media img { animation: heroZoom 2.4s var(--ease-out) forwards; }

.hero [data-hero] {
  opacity: 0;
  transform: translateY(22px);
  animation: floatUp 0.9s var(--ease-out) forwards;
  animation-delay: calc(0.25s + var(--hero-i, 0) * 0.12s);
}

/* --- Scroll reveal --------------------------------------------------------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition:
    opacity var(--dur-slow) var(--ease-out),
    transform var(--dur-slow) var(--ease-out);
  transition-delay: calc(var(--reveal-i, 0) * 0.08s);
}
[data-reveal="left"]  { transform: translateX(-28px); }
[data-reveal="right"] { transform: translateX(28px); }
[data-reveal="scale"] { transform: scale(0.96); }

[data-reveal].is-in {
  opacity: 1;
  transform: none;
}

/* Counters hold space to avoid layout shift while animating */
[data-count] { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
  .hero__media img,
  .hero [data-hero],
  [data-reveal] {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .hero__scroll i::after { animation: none; }
}