/* Keyframe Animations */
@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
@keyframes wiggle {
  0%, 100% { transform: rotate(-5deg); }
  50% { transform: rotate(5deg); }
}
@keyframes beat {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.2); }
}
@keyframes swing {
  0% { transform: rotate(0deg); }
  50% { transform: rotate(10deg); }
  100% { transform: rotate(0deg); }
}
@keyframes flip {
  0% { transform: rotateY(0deg); }
  100% { transform: rotateY(360deg); }
}

/* Animation Classes */
.icon-animate-bounce { animation: bounce 2s infinite; }
.icon-animate-pulse { animation: pulse 2s infinite; }
.icon-animate-spin { animation: spin 3s linear infinite; }
.icon-animate-shake { animation: shake 1.5s infinite; }
.icon-animate-float { animation: float 3s ease-in-out infinite; }
.icon-animate-wiggle { animation: wiggle 2s infinite; }
.icon-animate-beat { animation: beat 1.5s infinite; }
.icon-animate-swing { animation: swing 2.5s infinite; }
.icon-animate-flip { animation: flip 4s infinite linear; }

/* Horizontal line between steps */
@keyframes grow-horizontal {
  0% { width: 0; opacity: 0; }
  100% { width: 40px; opacity: 1; }
}