/* ================================================ */
/* ANIMATIONS                                       */
/* Contains all @keyframes definitions and classes  */
/* that apply animations.                           */
/* ================================================ */

/* General Fade Up Animation */
@keyframes fadeUp {
  from { transform: translateY(10px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* Delayed animations */
.animate-delay-1 { animation: fadeUp 0.6s both; }
.animate-delay-2 { animation: fadeUp 0.7s 0.06s both; }
.animate-delay-3 { animation: fadeUp 0.75s 0.12s both; }

/* Neon Pulse Animation (for logos and membership section) */
@keyframes pulseNeon {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 8px var(--neon), 0 0 16px var(--neon);
  }
  50% {
    transform: scale(1.08);
    box-shadow: 0 0 16px var(--neon), 0 0 32px var(--neon);
  }
}

.neon-logo {
  filter: drop-shadow(0 0 5px rgba(138,43,226,0.7))
         drop-shadow(0 0 5px rgba(0,255,255,0.7));
  transition: all 0.3s ease;
}

.neon-logo:hover {
  filter: drop-shadow(0 0 10px rgba(138,43,226,0.9))
         drop-shadow(0 0 10px rgba(0,255,255,0.9));
  transform: scale(1.03);
}

/* Animation for glowing elements (used in membership section) */
@keyframes neonPulse {
  from { box-shadow: 0 0 20px rgba(138,43,226,0.4), 0 0 40px rgba(0,255,255,0.2); }
  to { box-shadow: 0 0 25px rgba(138,43,226,0.6), 0 0 50px rgba(0,255,255,0.4); }
}

/* Gradient flowing effect (for membership section border) */
@keyframes gradientFlow {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

/* Floating animation for header orbs */
@keyframes floatOrbs {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-15px);
    }
}

.header-container::before,
.header-container::after {
    animation: floatOrbs 7s ease-in-out infinite alternate;
}

/* -------------------------
   SHOOTING STAR ANIMATION
   ------------------------- */
.shooting-star {
  position: fixed;
  top: -50px;
  left: -100px;
  width: 250px; /* Tail length */
  height: 6px; /* Core thickness */
  background: linear-gradient(90deg, white, limegreen, transparent);
  border-radius: 50%;
  opacity: 0;
  transform: rotate(45deg);
  box-shadow: 0 0 20px rgba(144, 238, 144, 0.8), /* Aura glow */
              0 0 40px rgba(144, 238, 144, 0.5);
  animation: shoot 6s ease-in-out infinite;
}

/* Shooting animation */
@keyframes shoot {
  0% {
    transform: translate(-100px, -100px) rotate(45deg);
    opacity: 1;
  }
  15% {
    transform: translate(600px, 600px) rotate(45deg);
    opacity: 1;
  }
  25% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

/* Animation for loading spinner */
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Animation for scroll hint */
@keyframes pulseHint {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}