/* ================================
   ANIMATIONS & KEYFRAMES
   ================================ */

/* Logo breathing animation */
@keyframes logo-breathe {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.025);
  }
}

.logo-animated {
  animation: logo-breathe 6s ease-in-out infinite;
  transition: transform 0.3s ease;
  display: inline-block;
}

/* Soft pulsing glow (red) */
@keyframes soft-pulse {
  0%, 100% {
    text-shadow: 0 0 5px #f44747, 0 0 10px #f44747, 0 0 20px #f44747;
  }
  50% {
    text-shadow: 0 0 8px #f44747, 0 0 14px #f44747, 0 0 28px #f44747;
  }
}

.glow-red-slow {
  animation: soft-pulse 3.6s ease-in-out infinite;
}

/* Floating animation for GIFs */
@keyframes float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
}

.animate-float {
  animation: float 3s ease-in-out infinite;
}

/* Fade in animation */
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in {
  animation: fade-in 0.8s ease-out;
}

/* Stagger children animation */
.stagger-children > * {
  opacity: 0;
  animation: fade-in 0.6s ease-out forwards;
}

.stagger-children > *:nth-child(1) { animation-delay: 0.1s; }
.stagger-children > *:nth-child(2) { animation-delay: 0.2s; }
.stagger-children > *:nth-child(3) { animation-delay: 0.3s; }
.stagger-children > *:nth-child(4) { animation-delay: 0.4s; }
.stagger-children > *:nth-child(5) { animation-delay: 0.5s; }
.stagger-children > *:nth-child(6) { animation-delay: 0.6s; }
.stagger-children > *:nth-child(7) { animation-delay: 0.7s; }
.stagger-children > *:nth-child(8) { animation-delay: 0.8s; }
.stagger-children > *:nth-child(9) { animation-delay: 0.9s; }
.stagger-children > *:nth-child(10) { animation-delay: 1s; }
.stagger-children > *:nth-child(11) { animation-delay: 1.1s; }

/* Fade up animation */
.fade-up {
  opacity: 0;
  animation: fade-in 0.6s ease-out forwards;
}

/* Scale pulse for hover effects */
@keyframes scale-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}