.nill-logo-scroller .marquee-container {
    --gap: var(--m-md);
    --duration: 40s;
    --scroll-start: 0;
    --scroll-end: calc(-100% - var(--gap));
    grid-area: 4/1/4/span 14;
    display: flex;
    overflow: hidden;
    user-select: none;
    gap: var(--gap);
    width: 100%;
    overflow: hidden;
}

.nill-logo-scroller .marquee-container .marquee-group {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--gap);
    width: max-content;
    animation: scroll-x var(--duration) linear infinite;
}

.nill-logo-scroller .marquee-container .icon-container {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    user-select: none;
    -webkit-user-drag: none;
    pointer-events: none;
}

@keyframes scroll-x {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(var(--scroll-end));
    }
}

@media (max-width: 767.98px) {    
    .nill-logo-scroller .marquee-container {
        --duration: 30s;
    }
}