.logos-section { padding: 50px 0; overflow: hidden; }
.logos-label { text-align: center; font-size: 13px; color: var(--text-muted); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 30px; }

.logos-track {
    --logo-gap: 3rem;
    display: flex;
    gap: var(--logo-gap);
    overflow: hidden;
    width: 100%;
    position: relative;
}

.logos-inner {
    display: flex;
    gap: var(--logo-gap);
    align-items: center;
    flex-shrink: 0;
    width: max-content;
    will-change: transform;
    animation: scrollLogos 60s linear infinite; 
}

.logo-item {
    filter: grayscale(1) contrast(0.8) brightness(2);
    opacity: 0.6;
    transition: all 0.3s ease;
    max-height: 30px;
    object-fit: contain;
    flex: 0 0 auto;
}

.logo-item:hover {
    filter: saturate(1);
    opacity: 1;
    transform: scale(1.05);
}

.logos-track:hover .logos-inner {
    animation-play-state: paused;
}

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