.glitch {
    animation: glitch 500ms infinite;
}

/* https://web.dev/prefers-reduced-motion/#(bonus)-forcing-reduced-motion-on-all-websites */

@keyframes glitch {
    0% {
        text-shadow: 1.05em 0 0 rgba(255, 0, 0, 0.75),
        -1.05em -1.025em 0 rgba(0, 255, 0, 0.75),
        -1.025em 1.05em 0 rgba(0, 0, 255, 0.75);
    }
    14% {
        text-shadow: 1.05em 0 0 rgba(255, 0, 0, 0.75),
        -1.05em -1.025em 0 rgba(0, 255, 0, 0.75),
        -1.025em 1.05em 0 rgba(0, 0, 255, 0.75);
    }
    15% {
        text-shadow: -1.05em -1.025em 0 rgba(255, 0, 0, 0.75),
        1.025em 1.025em 0 rgba(0, 255, 0, 0.75),
        -1.05em -1.05em 0 rgba(0, 0, 255, 0.75);
    }
    49% {
        text-shadow: -1.05em -1.025em 0 rgba(255, 0, 0, 0.75),
        1.025em 1.025em 0 rgba(0, 255, 0, 0.75),
        -1.05em -1.05em 0 rgba(0, 0, 255, 0.75);
    }
    50% {
        text-shadow: 1.025em 1.05em 0 rgba(255, 0, 0, 0.75),
        1.05em 0 0 rgba(0, 255, 0, 0.75),
        0 -1.05em 0 rgba(0, 0, 255, 0.75);
    }
    99% {
        text-shadow: 1.025em 1.05em 0 rgba(255, 0, 0, 0.75),
        1.05em 0 0 rgba(0, 255, 0, 0.75),
        0 -1.05em 0 rgba(0, 0, 255, 0.75);
    }
    100% {
        text-shadow: -1.025em 0 0 rgba(255, 0, 0, 0.75),
        -1.025em -1.025em 0 rgba(0, 255, 0, 0.75),
        -1.025em -1.05em 0 rgba(0, 0, 255, 0.75);
    }
}

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