/* ===========================================
   ANIMATIONS.CSS — Motion (spec Microsoft IA)
   =========================================== */

/* ── Hero gradient shift ── */
@keyframes heroGradientShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ── Glow pulses (hero) ── */
@keyframes blueGlowPulse {
  0%, 100% { opacity: .6; transform: scale(1); }
  50%      { opacity: 1;  transform: scale(1.08); }
}
@keyframes purpleGlowPulse {
  0%, 100% { opacity: .5; transform: scale(1.05); }
  50%      { opacity: .9; transform: scale(1); }
}

/* ── Scroll-reveal ── */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity var(--duration-slower) var(--easing-decelerate),
    transform var(--duration-slower) var(--easing-decelerate);
}
[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger children */
[data-reveal-stagger] > [data-reveal] { transition-delay: 0ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(2)  { transition-delay: 60ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(3)  { transition-delay: 120ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(4)  { transition-delay: 180ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(5)  { transition-delay: 240ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(6)  { transition-delay: 300ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(7)  { transition-delay: 360ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(8)  { transition-delay: 420ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(9)  { transition-delay: 480ms; }
[data-reveal-stagger] > [data-reveal]:nth-child(10) { transition-delay: 540ms; }

/* ── Hero entrance ── */
@keyframes heroFadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
.hero-animate-1 { animation: heroFadeInUp var(--duration-slowest) var(--easing-decelerate) forwards; }
.hero-animate-2 { animation: heroFadeInUp var(--duration-slowest) var(--easing-decelerate) .15s forwards; opacity: 0; }
.hero-animate-3 { animation: heroFadeInUp var(--duration-slowest) var(--easing-decelerate) .3s  forwards; opacity: 0; }

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  [data-reveal] { opacity: 1; transform: none; }
}