/* ===================================================================
   ANIMATIONS
   Scroll-reveal is class-driven: animations.js toggles `.is-visible`
   on `.reveal` elements via IntersectionObserver. Everything here is
   opacity/transform only, so it stays on the compositor thread and
   stays cheap. `prefers-reduced-motion` disables all of it.

   Progressive enhancement: `.reveal` only starts hidden once `main.js`
   has actually run and stamped `html.js-ready` (see js/main.js). If
   JavaScript never executes — disabled, blocked, or (notably) ES
   modules failing under a `file://` origin, which Chrome refuses to
   fetch — content simply renders normally instead of staying stuck
   at opacity: 0 forever.
   =================================================================== */

html.js-ready .reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--duration-slow) var(--ease-standard),
    transform var(--duration-slow) var(--ease-standard);
  will-change: opacity, transform;
}

html.js-ready .reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger children of a reveal group slightly for a more editorial feel */
.cards-grid .card.is-visible:nth-child(2) { transition-delay: 80ms; }
.cards-grid .card.is-visible:nth-child(3) { transition-delay: 160ms; }
.cards-grid .card.is-visible:nth-child(4) { transition-delay: 80ms; }
.cards-grid .card.is-visible:nth-child(5) { transition-delay: 160ms; }

.opportunities-grid .opportunity-card.is-visible:nth-child(2) { transition-delay: 80ms; }
.opportunities-grid .opportunity-card.is-visible:nth-child(3) { transition-delay: 160ms; }

.approach-item.is-visible:nth-child(2) { transition-delay: 60ms; }
.approach-item.is-visible:nth-child(3) { transition-delay: 120ms; }
.approach-item.is-visible:nth-child(4) { transition-delay: 180ms; }
.approach-item.is-visible:nth-child(5) { transition-delay: 240ms; }

@keyframes scrollCue {
  0% { transform: translateY(0); opacity: 0; }
  30% { opacity: 1; }
  100% { transform: translateY(34px); opacity: 0; }
}

/* Hero content enters once on load, independent of the scroll observer */
.hero-content > * {
  opacity: 0;
  transform: translateY(20px);
  animation: heroIn var(--duration-slow) var(--ease-standard) forwards;
}

.hero-content .eyebrow { animation-delay: 120ms; }
.hero-content .hero-headline { animation-delay: 240ms; }
.hero-content .hero-sub { animation-delay: 420ms; }
.hero-content .hero-actions { animation-delay: 560ms; }

@keyframes heroIn {
  to { opacity: 1; transform: translateY(0); }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .hero-content > * {
    animation: none;
    opacity: 1;
    transform: none;
  }

  .hero-slide {
    transition-duration: 1ms;
  }

  .hero-scroll-cue span {
    animation: none;
    opacity: 0.6;
  }

  * {
    animation-duration: 1ms !important;
    transition-duration: 1ms !important;
  }
}