/* Slider Container */
.logoslider-container {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    padding: 20px 0;
    background: transparent; /* Falls gewünscht, Hintergrund anpassen */
}

/* Der Schienen-Container, der sich endlos bewegt */
.logoslider {
    display: flex;
    width: max-content; /* Wichtig: Passt sich an die Gesamtlänge aller Logos an */
    animation: marquee-scroll 25s linear infinite; /* 25s = Geschwindigkeit. Höherer Wert = langsamer */
}

/* CSS-Animation für den nahtlosen Loop */
@keyframes marquee-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%); /* Bewegt sich genau um die Hälfte (die Original-Logos) nach links */
    }
}

/* Einzelne Logo-Slides (Keine 3er-Spalten mehr) */
.logoslide {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 40px; /* Der Abstand zwischen den Logos */
    box-sizing: border-box;
}


.logoslide a {
    display: block;
}

/* Optimierung speziell für Logos */
.logoslide img {
    height: 25px; /* Einheitliche Höhe für alle Logos */
    width: auto;   /* Breite skaliert proportional, verzerrt nicht */
    object-fit: contain;
    opacity: 0.7;  /* Dezenter Logo-Look */
    transition: opacity 0.3s ease;
}

.logoslide img:hover {
    opacity: 1; /* Highlight beim Drüberfahren */
}