.mmdb-search-marquee {
    --mmdb-search-marquee-item-size:
        clamp(110px, 12vw, 170px);

    --mmdb-search-marquee-gap:
        clamp(18px, 2vw, 32px);

    width: 100%;

    overflow: hidden;
}

.mmdb-search-marquee__viewport {
    width: 100%;

    overflow: hidden;

    -webkit-mask-image:
        linear-gradient(
            to right,
            transparent 0,
            #000 clamp(20px, 4vw, 64px),
            #000 calc(100% - clamp(20px, 4vw, 64px)),
            transparent 100%
        );

    mask-image:
        linear-gradient(
            to right,
            transparent 0,
            #000 clamp(20px, 4vw, 64px),
            #000 calc(100% - clamp(20px, 4vw, 64px)),
            transparent 100%
        );
}

.mmdb-search-marquee__track {
    display: flex;

    width: max-content;

    animation:
        mmdb-search-marquee-scroll
        var(--mmdb-search-marquee-duration, 28s)
        linear
        infinite;

    will-change: transform;
}

.mmdb-search-marquee__group {
    display: flex;

    gap: var(--mmdb-search-marquee-gap);

    padding-right:
        var(--mmdb-search-marquee-gap);
}

.mmdb-search-marquee__item {
    display: grid;

    width:
        var(--mmdb-search-marquee-item-size);

    flex:
        0 0
        var(--mmdb-search-marquee-item-size);

    text-decoration: none;

    transition:
        opacity 0.15s ease,
        transform 0.15s ease;

    opacity: 0.82;
}

.mmdb-search-marquee__item:hover,
.mmdb-search-marquee__item:focus-visible {
    opacity: 1;

    transform: scale(1.035);

    outline: none;
}

.mmdb-search-marquee__logo-frame {
    display: grid;

    width: 100%;

    aspect-ratio: 1 / 1;

    place-items: center;

    overflow: visible;
}

.mmdb-search-marquee__logo {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
}



.mmdb-search-marquee:hover
.mmdb-search-marquee__track,
.mmdb-search-marquee:focus-within
.mmdb-search-marquee__track {
    animation-play-state: paused;
}

@keyframes mmdb-search-marquee-scroll {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(-50%, 0, 0);
    }
}

@media (max-width: 640px) {
    .mmdb-search-marquee {
        --mmdb-search-marquee-item-size:
            clamp(96px, 30vw, 132px);

        --mmdb-search-marquee-gap:
            clamp(14px, 4vw, 20px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .mmdb-search-marquee__viewport {
        overflow-x: auto;

        -webkit-mask-image: none;
        mask-image: none;

        scrollbar-width: thin;
    }

    .mmdb-search-marquee__track {
        animation: none;
    }

    .mmdb-search-marquee__group[aria-hidden="true"] {
        display: none;
    }
}


.mmdb-search-marquee--width-full {
    width: 100%;
    max-width: none;
}

.mmdb-search-marquee--width-max {
    width: min(
        100%,
        var(--site-content-max-width)
    );

    margin-left: auto;
    margin-right: auto;
}