/* =============================================================
   Jundo Partner-Marquee (Startseite)
   Mobile First | reine CSS-Animation, kein JS

   Logo-Reihe wird im Shortcode zweimal gerendert (siehe
   inc/partner-cpt.php); die Animation läuft bis -50% und beginnt dann
   nahtlos von vorn – Standard-Endlos-Marquee-Technik.
   ============================================================= */

.jundo-partners-marquee {
    width: 100%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 48px, #000 calc(100% - 48px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, #000 48px, #000 calc(100% - 48px), transparent 100%);
}

.jundo-partners-marquee-track {
    display: flex;
    align-items: center;
    width: max-content;
    gap: var(--wp--preset--spacing--xx-large);
    padding: var(--wp--preset--spacing--medium) 0;
    animation: jundo-marquee-scroll var(--jundo-marquee-duration, 30s) linear infinite;
}

.jundo-partners-marquee:hover .jundo-partners-marquee-track {
    animation-play-state: paused;
}

@keyframes jundo-marquee-scroll {
    to { transform: translateX(-50%); }
}

/* Zu wenige Partner, um die Endlos-Illusion zu tragen (siehe
   inc/partner-cpt.php, $is_static) – ruhige, zentrierte Reihe statt
   Animation, keine verdoppelten Logos im Markup. */
.jundo-partners-marquee--static {
    -webkit-mask-image: none;
    mask-image: none;
}

.jundo-partners-marquee--static .jundo-partners-marquee-track {
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    animation: none;
}

@media (prefers-reduced-motion: reduce) {
    .jundo-partners-marquee-track {
        animation: none;
    }
    .jundo-partners-marquee {
        overflow-x: auto;
    }
}

.jundo-partner-logo {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}

.jundo-partner-logo a {
    display: block;
}

.jundo-partner-logo img {
    height: 48px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
    filter: grayscale(1);
    opacity: .7;
    transition: filter .2s ease, opacity .2s ease;
}

.jundo-partner-logo a:hover img,
.jundo-partner-logo a:focus-visible img {
    filter: grayscale(0);
    opacity: 1;
}

.jundo-partner-logo-fallback {
    display: flex;
    align-items: center;
    height: 48px;
    font-family: var(--wp--preset--font-family--oswald);
    font-weight: 700;
    font-size: 1.1em;
    color: var(--wp--preset--color--foreground-light);
    white-space: nowrap;
}

.jundo-partner-caption {
    font-size: .75em;
    color: var(--wp--preset--color--foreground-light);
    margin: 0;
    white-space: nowrap;
}

@media (min-width: 769px) {
    .jundo-partner-logo img {
        height: 56px;
        max-width: 200px;
    }
}