/* ─────────────────────────────────────────────────────────────────────────────
   Animations — all @keyframes and motion utilities
───────────────────────────────────────────────────────────────────────────── */

/* ── Page enter ── */
@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Scale pop (success icon, modals) ── */
@keyframes popIn {
  0%   { opacity: 0; transform: scale(0.5); }
  70%  { transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1); }
}

/* ── Continuous rotation ── */
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ── Skeleton shimmer ── */
@keyframes shimmer {
  0%   { background-position:  200% 0; }
  100% { background-position: -200% 0; }
}

/* ── Soft pulse (for active states) ── */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.6; }
}

/* ── Slide up from bottom (used on sticky footer appear) ── */
@keyframes slideUp {
  from { opacity: 0; transform: translateY(100%); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Shake (invalid OTP) ── */
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20%       { transform: translateX(-6px); }
  40%       { transform: translateX(6px); }
  60%       { transform: translateX(-4px); }
  80%       { transform: translateX(4px); }
}

/* ── Utility classes ── */
.animate-shake  { animation: shake  0.4s ease both; }
.animate-pop-in { animation: popIn  0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) both; }
.animate-pulse  { animation: pulse  1.5s ease infinite; }

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