/* ============================================================
   MONTEGO ANIMATION SYSTEM
   ============================================================ */

/* --- Base Keyframes --- */
@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeSlideDown {
  from { opacity: 0; transform: translateY(-12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeSlideLeft {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0); }
}

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

@keyframes scalePop {
  0%   { transform: scale(0); }
  60%  { transform: scale(1.08); }
  80%  { transform: scale(0.96); }
  100% { transform: scale(1); }
}

@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-20px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes expandWidth {
  from { width: 0; }
  to   { width: 100%; }
}

@keyframes floatGentle {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(0, 53, 148, 0.4); }
  50%      { box-shadow: 0 0 0 10px rgba(0, 53, 148, 0); }
}

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

/* --- Utility Animation Classes --- */
.animate-fade-up {
  opacity: 0;
  animation: fadeSlideUp 0.45s ease-out forwards;
}

.animate-fade-down {
  opacity: 0;
  animation: fadeSlideDown 0.4s ease-out forwards;
}

.animate-fade-in {
  opacity: 0;
  animation: fadeIn 0.35s ease-out forwards;
}

.animate-fade-left {
  opacity: 0;
  animation: fadeSlideLeft 0.45s ease-out forwards;
}

.animate-scale-pop {
  animation: scalePop 0.4s ease-out both;
}

/* --- Stagger Delays --- */
.delay-1 { animation-delay: 0.05s; }
.delay-2 { animation-delay: 0.10s; }
.delay-3 { animation-delay: 0.15s; }
.delay-4 { animation-delay: 0.20s; }
.delay-5 { animation-delay: 0.25s; }
.delay-6 { animation-delay: 0.30s; }
.delay-7 { animation-delay: 0.35s; }
.delay-8 { animation-delay: 0.40s; }
.delay-9 { animation-delay: 0.45s; }
.delay-10 { animation-delay: 0.50s; }

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