.logo-marquee-55aff66c-wrapper {
    --lm-visible: 5;
    --lm-speed: 20s;
    --lm-gap: 20px;
    --lm-grayscale: 0%;
    --lm-saturate: 100%;
    --lm-blur: 0px;
    --lm-fade-color: #ffffff; /* Default fade color */
    display: flex;
    flex-direction: column;
    overflow: hidden;
    width: 100%;
    position: relative;
}

.logo-marquee-55aff66c-wrapper.has-fade::before,
.logo-marquee-55aff66c-wrapper.has-fade::after {
    content: "";
    position: absolute;
    top: 0;
    width: 15%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

.logo-marquee-55aff66c-wrapper.has-fade::before {
    left: 0;
    background: linear-gradient(to right, var(--lm-fade-color), transparent);
}

.logo-marquee-55aff66c-wrapper.has-fade::after {
    right: 0;
    background: linear-gradient(to left, var(--lm-fade-color), transparent);
}


.marquee-line {
    display: flex;
    overflow: hidden;
    user-select: none;
    gap: var(--lm-gap);
}

.marquee-line.pause-on-hover:hover .marquee-track {
    animation-play-state: paused;
}

.marquee-track {
    display: flex;
    flex-shrink: 0;
    /* FIX: Track must span at least 100% plus gap to prevent gap at the end */
    min-width: calc(100% + var(--lm-gap)); 
    gap: var(--lm-gap);
    justify-content: space-around;
}

.marquee-item {
    /* FIX: Calculate exact width needed based on visible items and gap */
    width: calc((100vw - (var(--lm-gap) * (var(--lm-visible) - 1))) / var(--lm-visible));
    max-width: calc((100% - (var(--lm-gap) * (var(--lm-visible) - 1))) / var(--lm-visible));
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    overflow: hidden;
}

.marquee-item img {
    max-width: 100%;
    max-height: 100%;
    height: auto;
    object-fit: contain;
    filter: grayscale(var(--lm-grayscale)) saturate(var(--lm-saturate)) blur(var(--lm-blur));
    transition: filter 0.3s ease;
}

.marquee-dir-left {
    animation: scroll-left var(--lm-speed) linear infinite;
}
.marquee-dir-right {
    animation: scroll-right var(--lm-speed) linear infinite;
}

@keyframes scroll-left {
    0% { transform: translateX(0); }
    100% { transform: translateX(calc(-100% - var(--lm-gap))); }
}

@keyframes scroll-right {
    0% { transform: translateX(calc(-100% - var(--lm-gap))); }
    100% { transform: translateX(0); }
}