/* Glitch effect using text layers */
.glitch {
    position: relative;
    display: inline-block;
    font-size: 2em;
    font-weight: bold;
    text-transform: uppercase;
}

.glitch span {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    color: #fff;
    background: transparent;
    overflow: hidden;
    animation: glitch-animation 0.5s infinite alternate;
}

.glitch span:nth-child(1) {
    left: 2px;
    text-shadow: -2px 0 red;
    animation-duration: 0.4s;
}

.glitch span:nth-child(3) {
    left: -2px;
    text-shadow: 2px 0 blue;
    animation-duration: 0.6s;
}

@keyframes glitch-animation {
    0% { clip-path: inset(0 0 80% 0); }
    20% { clip-path: inset(20% 0 60% 0); }
    40% { clip-path: inset(40% 0 40% 0); }
    60% { clip-path: inset(60% 0 20% 0); }
    80% { clip-path: inset(80% 0 0 0); }
    100% { clip-path: inset(0 0 80% 0); }
}