/* Marquee Text Block */
.marquee {
    --gap: 0.75rem;
    display: flex;
    overflow: hidden;
    user-select: none;
    gap: var(--gap);
}

.marquee__content {
    flex-shrink: 0;
    display: flex;
    justify-content: space-around;
    min-width: 100%;
    gap: var(--gap);
    animation-name: marquee_text_scroll;
    animation-play-state: running;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@keyframes marquee_text_scroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-100% - var(--gap)));
    }
}

/* Pause animation when reduced-motion is set */
@media (prefers-reduced-motion: reduce) {
    .marquee__content {
        animation-play-state: paused !important;
    }
}