/* ==========================================================================
   Last One Standing — Animations
   Scroll-triggered reveals, hero entrance, micro-interactions.
   All motion respects prefers-reduced-motion.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Scroll-reveal system (driven by js/animations.js + IntersectionObserver)
   Usage: <div data-reveal> or <div data-reveal="left" data-reveal-delay="120">
   Hidden states apply only when JS is available (html.js set in <head>).
   -------------------------------------------------------------------------- */
html.js [data-reveal] {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.75s var(--ease, ease),
              transform 0.75s var(--ease, ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}

html.js [data-reveal="left"] {
  transform: translateX(-40px);
}

html.js [data-reveal="right"] {
  transform: translateX(40px);
}

html.js [data-reveal="zoom"] {
  transform: scale(0.94);
}

html.js [data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

/* Stagger children of a revealed group */
html.js [data-reveal-group] > * {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.65s var(--ease, ease),
              transform 0.65s var(--ease, ease);
}

html.js [data-reveal-group].is-visible > * {
  opacity: 1;
  transform: none;
}

html.js [data-reveal-group].is-visible > *:nth-child(1) { transition-delay: 0ms; }
html.js [data-reveal-group].is-visible > *:nth-child(2) { transition-delay: 90ms; }
html.js [data-reveal-group].is-visible > *:nth-child(3) { transition-delay: 180ms; }
html.js [data-reveal-group].is-visible > *:nth-child(4) { transition-delay: 270ms; }
html.js [data-reveal-group].is-visible > *:nth-child(5) { transition-delay: 360ms; }
html.js [data-reveal-group].is-visible > *:nth-child(6) { transition-delay: 450ms; }
html.js [data-reveal-group].is-visible > *:nth-child(7) { transition-delay: 540ms; }
html.js [data-reveal-group].is-visible > *:nth-child(8) { transition-delay: 630ms; }

/* --------------------------------------------------------------------------
   Hero entrance (plays once on page load)
   -------------------------------------------------------------------------- */
@keyframes hero-fade-up {
  from {
    opacity: 0;
    transform: translateY(36px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.hero__content > * {
  animation: hero-fade-up 0.9s var(--ease, ease) both;
}

.hero__content > *:nth-child(1) { animation-delay: 0.05s; }
.hero__content > *:nth-child(2) { animation-delay: 0.15s; }
.hero__content > *:nth-child(3) { animation-delay: 0.25s; }
.hero__content > *:nth-child(4) { animation-delay: 0.35s; }
.hero__content > *:nth-child(5) { animation-delay: 0.45s; }

/* --------------------------------------------------------------------------
   Subtle keyframe helpers
   -------------------------------------------------------------------------- */
@keyframes soft-pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.04); }
}

.countdown__cell--accent .countdown__value {
  animation: soft-pulse 1s var(--ease, ease) infinite;
}

/* --------------------------------------------------------------------------
   Reduced motion — disable everything, show content immediately
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  [data-reveal],
  [data-reveal-group] > * {
    opacity: 1 !important;
    transform: none !important;
  }
}