/* ═══════════════════════════════════════════
   ANIMATIONS — El Escondido Cabalgatas
   Scroll-triggered Reveal Animations
   ═══════════════════════════════════════════ */

/* ─── Reveal Up ─── */
.reveal-up {
  opacity: 0;
  transform: translateY(40px);
  transition: 
    opacity var(--duration-slower) var(--ease-out),
    transform var(--duration-slower) var(--ease-out);
}

.reveal-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ─── Reveal Scale ─── */
.reveal-scale {
  opacity: 0;
  transform: scale(0.95);
  transition: 
    opacity var(--duration-slower) var(--ease-out),
    transform 1.2s var(--ease-out);
}

.reveal-scale.visible {
  opacity: 1;
  transform: scale(1);
}

/* ─── Stagger Delays ─── */
.delay-1 {
  transition-delay: 150ms;
}

.delay-2 {
  transition-delay: 300ms;
}

.delay-3 {
  transition-delay: 450ms;
}

.delay-4 {
  transition-delay: 600ms;
}

/* ─── Body Load Animation ─── */
body {
  animation: bodyFadeIn 1s var(--ease-out) both;
}

@keyframes bodyFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* ─── Reduced Motion ─── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal-up,
  .reveal-scale {
    opacity: 1;
    transform: none;
  }

  html {
    scroll-behavior: auto;
  }
}