/* ========== ANIMATIONS ========== */
/* All @keyframes definitions */

@keyframes gradientPulse {

    0%,
    100% {
        opacity: 0.8;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.1);
    }
}

@keyframes float {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }

    25% {
        transform: translate(30px, -30px) scale(1.05);
    }

    50% {
        transform: translate(-20px, 20px) scale(0.95);
    }

    75% {
        transform: translate(-30px, -20px) scale(1.02);
    }
}

@keyframes logoFloat {

    0%,
    100% {
        transform: translateY(0) rotateX(0deg);
    }

    25% {
        transform: translateY(-5px) rotateX(2deg);
    }

    50% {
        transform: translateY(0) rotateX(0deg);
    }

    75% {
        transform: translateY(-3px) rotateX(-1deg);
    }
}

@keyframes glowPulse {

    0%,
    100% {
        filter: drop-shadow(0 0 30px rgba(138, 100, 255, 0.5)) drop-shadow(0 0 60px rgba(255, 100, 180, 0.3)) drop-shadow(0 0 90px rgba(138, 100, 255, 0.2));
    }

    50% {
        filter: drop-shadow(0 0 50px rgba(138, 100, 255, 0.8)) drop-shadow(0 0 100px rgba(255, 100, 180, 0.5)) drop-shadow(0 0 150px rgba(138, 100, 255, 0.4));
    }
}

@keyframes shimmer {

    0%,
    100% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }
}

@keyframes letterGlitch {

    0%,
    90%,
    100% {
        transform: translateX(0);
        text-shadow: none;
    }

    92% {
        transform: translateX(-3px);
        text-shadow: 3px 0 rgba(255, 0, 100, 0.5), -3px 0 rgba(0, 255, 255, 0.5);
    }

    94% {
        transform: translateX(3px);
        text-shadow: -3px 0 rgba(255, 0, 100, 0.5), 3px 0 rgba(0, 255, 255, 0.5);
    }

    96% {
        transform: translateX(-2px);
        text-shadow: 2px 0 rgba(255, 0, 100, 0.3), -2px 0 rgba(0, 255, 255, 0.3);
    }

    98% {
        transform: translateX(2px);
        text-shadow: -2px 0 rgba(255, 0, 100, 0.3), 2px 0 rgba(0, 255, 255, 0.3);
    }
}

@keyframes letterGlitchIntense {

    0%,
    100% {
        transform: translateX(0) skewX(0deg);
        text-shadow: none;
    }

    25% {
        transform: translateX(-4px) skewX(-2deg);
        text-shadow: 4px 0 rgba(255, 0, 100, 0.7), -4px 0 rgba(0, 255, 255, 0.7);
    }

    50% {
        transform: translateX(4px) skewX(2deg);
        text-shadow: -4px 0 rgba(255, 0, 100, 0.7), 4px 0 rgba(0, 255, 255, 0.7);
    }

    75% {
        transform: translateX(-2px) skewX(-1deg);
        text-shadow: 2px 0 rgba(255, 0, 100, 0.5), -2px 0 rgba(0, 255, 255, 0.5);
    }
}

@keyframes wordGlow {

    0%,
    100% {
        text-shadow: 0 0 20px rgba(255, 100, 180, 0.5);
        opacity: 0.95;
    }

    50% {
        text-shadow: 0 0 40px rgba(255, 100, 180, 0.8), 0 0 60px rgba(138, 100, 255, 0.5);
        opacity: 1;
    }
}

@keyframes glitch1 {

    0%,
    100% {
        transform: translateX(0);
    }

    20% {
        transform: translateX(-3px);
    }

    40% {
        transform: translateX(3px);
    }

    60% {
        transform: translateX(-2px);
    }

    80% {
        transform: translateX(2px);
    }
}

@keyframes glitch2 {

    0%,
    100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(2px);
    }

    50% {
        transform: translateX(-3px);
    }

    75% {
        transform: translateX(1px);
    }
}

@keyframes underlineExpand {
    to {
        width: 120%;
    }
}

@keyframes sparkle {

    0%,
    100% {
        opacity: 0;
        transform: scale(0) rotate(0deg);
    }

    50% {
        opacity: 1;
        transform: scale(1) rotate(180deg);
    }
}

@keyframes bounce {

    0%,
    100% {
        transform: translateX(-50%) translateY(0);
    }

    50% {
        transform: translateX(-50%) translateY(10px);
    }
}

@keyframes philosophyPulse {

    0%,
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.8;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 1;
    }
}

@keyframes manifestoShine {
    0% {
        left: -100%;
    }

    50%,
    100% {
        left: 100%;
    }
}

@keyframes quoteGradient {

    0%,
    100% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }
}

@keyframes iconFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}

@keyframes eventsBgPulse {

    0%,
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.8;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.2);
        opacity: 1;
    }
}

@keyframes eventGlowFloat {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(30px, -20px) scale(1.1);
    }
}

@keyframes dotPulse {

    0%,
    100% {
        box-shadow: 0 0 20px rgba(138, 100, 255, 0.6);
    }

    50% {
        box-shadow: 0 0 35px rgba(138, 100, 255, 0.9), 0 0 60px rgba(255, 100, 180, 0.4);
    }
}

@keyframes shimmerBorder {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

@keyframes eventModalGradient {

    0%,
    100% {
        opacity: 0.8;
    }

    50% {
        opacity: 1;
    }
}

@keyframes eventPatternFloat {

    0%,
    100% {
        transform: scale(1) rotate(0deg);
    }

    50% {
        transform: scale(1.1) rotate(3deg);
    }
}

@keyframes eventIconPulse {

    0%,
    100% {
        transform: scale(1);
        opacity: 0.4;
    }

    50% {
        transform: scale(1.1);
        opacity: 0.6;
    }
}

@keyframes dateBadgeGlow {

    0%,
    100% {
        box-shadow: 0 10px 30px rgba(138, 100, 255, 0.4), 0 0 40px rgba(138, 100, 255, 0.2);
    }

    50% {
        box-shadow: 0 15px 40px rgba(138, 100, 255, 0.6), 0 0 60px rgba(138, 100, 255, 0.3);
    }
}

@keyframes eventTitleGradient {

    0%,
    100% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }
}

/* Supporter Modal Icon Float - redefined with different name to avoid conflict */
@keyframes supporterIconFloat {

    0%,
    100% {
        transform: translateY(0) rotate(-5deg);
    }

    50% {
        transform: translateY(-10px) rotate(5deg);
    }
}