/* =============================================
   AUTOEXPLAIN ANNIVERSARY — ANIMATIONS
   ============================================= */

@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

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

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

@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%       { transform: scale(1.05); opacity: 0.85; }
}

@keyframes pulseSlow {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.4; }
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@keyframes spinWheel {
  from { transform: rotate(0deg); }
  to   { transform: rotate(var(--spin-to, 720deg)); }
}

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

@keyframes countdownFlip {
  0%   { transform: rotateX(0deg); }
  50%  { transform: rotateX(-90deg); }
  51%  { transform: rotateX(90deg); }
  100% { transform: rotateX(0deg); }
}

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

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

@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.85); }
  to   { opacity: 1; transform: scale(1); }
}

/* Utility classes */
.animate-fade-in-up  { animation: fadeInUp 0.6s ease both; }
.animate-fade-in     { animation: fadeIn 0.5s ease both; }
.animate-pulse       { animation: pulse 2s ease-in-out infinite; }
.animate-pulse-slow  { animation: pulseSlow 2.5s ease-in-out infinite; }
.animate-spin        { animation: spin 1s linear infinite; }
.animate-float       { animation: float 3s ease-in-out infinite; }
.animate-scale-in    { animation: scaleIn 0.4s ease both; }
.animate-slide-down  { animation: slideDown 0.3s ease both; }

/* Countdown number */
.countdown-flip {
  display: inline-block;
  perspective: 200px;
}
.countdown-flip.flipping {
  animation: countdownFlip 0.4s ease-in-out;
}