@keyframes cardIn {
    from {
        opacity: 0;
        transform: translateY(16px) scale(0.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes glowPulse {
    0%,
    100% {
        box-shadow: 0 0 0 rgba(255, 47, 138, 0);
    }

    50% {
        box-shadow: 0 18px 45px rgba(255, 47, 138, 0.13);
    }
}

@keyframes logoSpin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes wordGlitchCycle {
    0% {
        opacity: 0;
        clip-path: inset(0 0 0 0);
        filter: none;
        transform: translate(0, 4px) skewX(0) scale(0.99);
        text-shadow: none;
    }

    2% {
        opacity: 0.50;
        transform: translate(0, 2px) skewX(0) scale(0.995);
    }

    4%,
    8% {
        opacity: 1;
        clip-path: inset(0 0 0 0);
        filter: none;
        transform: translate(0, 0) skewX(0) scale(1);
        text-shadow: none;
    }

    9.5% {
        opacity: 1;
        clip-path: inset(8% 0 10% 0);
        filter: saturate(1.22) contrast(1.08);
        transform: translate(-0.8px, 0.6px) skewX(-2.5deg) scale(1);
        text-shadow: 1.4px 0 rgba(0, 213, 255, 0.8), -1.4px 0 rgba(255, 47, 138, 0.8);
    }

    11% {
        opacity: 1;
        clip-path: inset(0 0 38% 0);
        transform: translate(1px, -0.5px) skewX(3deg) scale(1.005);
        text-shadow: -1.4px 0 rgba(0, 213, 255, 0.75), 1.4px 0 rgba(255, 47, 138, 0.75);
    }

    12.5% {
        opacity: 0.75;
        clip-path: inset(22% 0 18% 0);
        filter: blur(0.3px);
        transform: translate(0, 1px) skewX(0) scale(0.995);
        text-shadow: 0.8px 0 rgba(0, 213, 255, 0.45), -0.8px 0 rgba(255, 47, 138, 0.45);
    }

    13.5% {
        opacity: 0;
        clip-path: inset(48% 0 48% 0);
        filter: blur(0.5px);
        transform: translate(0, 3px) scaleY(0.55);
        text-shadow: 2.5px 0 rgba(255, 47, 138, 0.7), -2.5px 0 rgba(0, 213, 255, 0.7);
    }

    13.51%,
    100% {
        opacity: 0;
        clip-path: inset(0 0 0 0);
        filter: none;
        transform: translate(0, 0) skewX(0) scale(1);
        text-shadow: none;
    }
}

@keyframes programSwipe {
    0% {
        opacity: 0;
        transform: translateX(44px) scale(0.985);
        filter: blur(1px);
    }

    6%,
    22% {
        opacity: 1;
        transform: translateX(0) scale(1);
        filter: blur(0);
    }

    28% {
        opacity: 0;
        transform: translateX(-36px) scale(0.99);
        filter: blur(0.7px);
    }

    28.01%,
    100% {
        opacity: 0;
        transform: translateX(44px) scale(0.985);
        filter: blur(1px);
    }
}

@keyframes navHoverGlitch {
    0%,
    100% {
        filter: none;
        transform: translate(0, 0) skewX(0);
    }

    25% {
        filter: saturate(1.35);
        transform: translate(-1px, 0.5px) skewX(-6deg);
    }

    50% {
        filter: contrast(1.2);
        transform: translate(1px, -0.5px) skewX(5deg);
    }

    75% {
        filter: saturate(1.2);
        transform: translate(-0.5px, 0) skewX(-3deg);
    }
}

.card-pop {
    animation: cardIn 620ms ease both;
}

.delay-1 {
    animation-delay: 90ms;
}

.delay-2 {
    animation-delay: 170ms;
}

.glow-border {
    animation: glowPulse 4s ease-in-out infinite;
}

.glitch-title {
    animation: none;
}

.orbit-logo {
    animation: logoSpin 18s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
    }

    .glitch-word span:first-child {
        opacity: 1 !important;
    }

    .program-slide:first-child {
        opacity: 1 !important;
        transform: none !important;
    }

}