/* ── Keyframes ── */
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

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

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

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

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

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.5; }
}

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

@keyframes twc-pulse {
  0%, 100% { opacity: 1;   transform: scale(1); }
  50%       { opacity: 0.5; transform: scale(0.92); }
}

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

@keyframes ripple {
  to { transform: scale(4); opacity: 0; }
}

/* ── Utility Classes ── */
.animate-fade-in     { animation: fadeIn 300ms ease forwards; }
.animate-fade-in-up  { animation: fadeInUp 350ms ease forwards; }
.animate-scale-in    { animation: scaleIn 250ms ease forwards; }
.animate-slide-right { animation: slideInRight 300ms ease forwards; }
.animate-pulse       { animation: pulse 2s ease infinite; }
.animate-spin        { animation: spin 1s linear infinite; }

/* Stagger children */
.stagger > * { opacity: 0; animation: fadeInUp 350ms ease forwards; }
.stagger > *:nth-child(1)  { animation-delay: 0ms; }
.stagger > *:nth-child(2)  { animation-delay: 60ms; }
.stagger > *:nth-child(3)  { animation-delay: 120ms; }
.stagger > *:nth-child(4)  { animation-delay: 180ms; }
.stagger > *:nth-child(5)  { animation-delay: 240ms; }
.stagger > *:nth-child(6)  { animation-delay: 300ms; }
.stagger > *:nth-child(7)  { animation-delay: 360ms; }
.stagger > *:nth-child(8)  { animation-delay: 420ms; }

/* Page transition */
.view.active {
  animation: fadeInUp 300ms ease forwards;
}

/* Number counter animation */
.stat-value { animation: countUp 400ms ease forwards; }

/* Hover lift */
.hover-lift { transition: transform var(--transition-fast), box-shadow var(--transition-fast); }
.hover-lift:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }

/* Ripple effect on buttons */
.btn { overflow: hidden; }
.ripple-effect {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,0.3);
  transform: scale(0);
  animation: ripple 600ms linear;
  pointer-events: none;
}

/* Glow pulse for highlight cards */
@keyframes glowPulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--accent-glow); }
  50%       { box-shadow: 0 0 20px 4px var(--accent-glow); }
}

.glow-pulse { animation: glowPulse 3s ease infinite; }

/* Smooth number transitions */
.num-transition {
  display: inline-block;
  transition: all var(--transition-base);
}