@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

.animate-scroll {
    animation: scroll-left 30s linear infinite;
}

.pause-on-hover:hover .animate-scroll {
    animation-play-state: paused;
}

/* Gradient mask for smooth fade out at edges */
.mask-gradient-x {
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}