/* ========== Logo Marquee ========== */
.ob-logo-marquee {
    --gap: 100px;
    --speed: 60s;
    position: relative;
    width: 100%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 12.5%, #000 87.5%, transparent 100%);
            mask-image: linear-gradient(to right, transparent 0%, #000 12.5%, #000 87.5%, transparent 100%);
}

.ob-marquee-track {
    display: flex;
    width: max-content;
    gap: var(--gap);
    will-change: transform;
    animation: ob-marquee var(--speed) linear infinite;
}

.ob-logo-marquee:hover .ob-marquee-track {
    animation-play-state: paused;
}

.ob-logos {
    display: flex;
    align-items: center;
    gap: var(--gap);
    margin: 0;
    padding: 0;
}

/* Strip Divi's default module margins so logos sit flush in the flex row */
.ob-logos > .et_pb_module {
    margin: 0 !important;
}

.ob-logo-item {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.ob-logos img {
    object-fit: contain;
}

@keyframes ob-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
    .ob-logo-marquee {
        --speed: 90s;
        -webkit-mask-image: none;
        mask-image: none;
    }
}

@media (max-width: 980px) {
    .ob-logo-marquee { --gap: 28px; --speed: 30s; }
}

@media (max-width: 480px) {
    .ob-logo-marquee { --gap: 18px; --speed: 25s; }
}