/* Verification Flow — animations + keyframes only */
/* All layout/colors/spacing stays in Tailwind classes */

/* Floating dot animation for decorative backgrounds */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

/* Emerald pulse glow for active OTP box */
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(52, 215, 155, 0.3); }
  50% { box-shadow: 0 0 0 6px rgba(52, 215, 155, 0); }
}

/* === Success screen celebrations === */

/* Logo + checkmark scale-in with bounce */
@keyframes success-bounce-in {
  0% { transform: scale(0); opacity: 0; }
  50% { transform: scale(1.12); opacity: 1; }
  70% { transform: scale(0.96); }
  100% { transform: scale(1); opacity: 1; }
}

/* Fade up — heading, subtitle, cards with stagger */
@keyframes success-fade-up {
  from { transform: translateY(16px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* Checkmark badge pop */
@keyframes badge-pop {
  0% { transform: scale(0) rotate(-30deg); opacity: 0; }
  60% { transform: scale(1.15) rotate(5deg); opacity: 1; }
  100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

/* Success animation utility classes */
.animate-success-bounce {
  animation: success-bounce-in 600ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  opacity: 0;
}

.animate-success-fade-up {
  animation: success-fade-up 500ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
  opacity: 0;
}

.animate-badge-pop {
  animation: badge-pop 400ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  animation-delay: 400ms;
  opacity: 0;
}