/* [admax_logok] — végtelenített logó-sor: két azonos csoport, a sáv -50%-ig csúszik, majd ugrás nélkül újraindul; hoverre megáll.
   A logók szélességre méreteződnek, így a sáv magasságát a kép saját képaránya adja. */

.am-logos {
    position: relative;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}

.am-logos__track {
    display: flex;
    width: max-content;
    animation: am-logos-scroll var(--am-logo-dur, 36s) linear infinite;
    will-change: transform;
}

.am-logos:hover .am-logos__track {
    animation-play-state: paused;
}

/* Dupla sor: a második (Hirdetők) ellenkező irányba mozog. */
.am-logos-dual {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.am-logos.is-reverse .am-logos__track {
    animation-direction: reverse;
}

.am-logos__group {
    display: flex;
    align-items: center;
    flex: none;
    margin: 0;
    padding: 0;
    list-style: none;
}

.am-logos__item {
    flex: none;
    display: flex;
    align-items: center;
    padding: 0 calc(var(--am-logo-gap, 48px) / 2);
    margin: 0;
}

.am-logos__item::before {
    content: none;
}

.am-logos__img {
    display: block;
    width: var(--am-logo-w, 130px);
    max-width: none;
    height: auto;
    margin: 0;
    object-fit: contain;
    transition: filter 0.3s ease, opacity 0.3s ease;
}

.am-logos.is-mono .am-logos__img {
    filter: grayscale(1);
    opacity: 0.6;
}

.am-logos.is-mono .am-logos__item:hover .am-logos__img {
    filter: none;
    opacity: 1;
}

/* magassag="…" megadásakor fix magasság, a szélesség a képarányból jön. */
.am-logos.has-fixed-h .am-logos__item {
    height: var(--am-logo-h);
}

.am-logos.has-fixed-h .am-logos__img {
    width: auto;
    height: 100%;
    max-width: 180px;
}

@keyframes am-logos-scroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

@media (max-width: 767px) {
    .am-logos-dual {
        gap: 20px;
    }

    .am-logos__item {
        padding: 0 calc(var(--am-logo-gap, 48px) * 0.3);
    }

    .am-logos__img {
        width: calc(var(--am-logo-w, 130px) * 0.8);
    }

    .am-logos.has-fixed-h .am-logos__item {
        height: calc(var(--am-logo-h) * 0.8);
    }
}

@media (prefers-reduced-motion: reduce) {
    .am-logos {
        overflow-x: auto;
    }

    .am-logos__track {
        animation: none;
    }
}
