/* ============================================================
   Quem confia — título curto e uma faixa de logos em silhueta correndo
   de borda a borda. Para no hover; com "reduzir movimento", a faixa
   vira uma grade parada.
   ============================================================ */

.partners__head { margin-bottom: clamp(2rem, 5vw, 3.5rem); }

/* ── Faixa ───────────────────────────────────────────────── */

.marquee {
    --gap: clamp(2.5rem, 6vw, 4.5rem);
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.marquee__track {
    display: flex;
    width: max-content;
    animation: marquee 48s linear infinite;
}

/* O respiro do fim de cada grupo é o mesmo do meio: a emenda das duas
   cópias some. */
.marquee__group {
    display: flex;
    align-items: center;
    gap: var(--gap);
    padding-right: var(--gap);
}

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

@media (hover: hover) {
    .marquee:hover .marquee__track { animation-play-state: paused; }
}

/* ── Logo ────────────────────────────────────────────────── */

.partners__logo {
    display: grid;
    place-items: center;
    height: 48px;
    flex: none;
}

/* A medida fica no logo, nunca no quadro: logo horizontal não sai
   espremido numa caixa quadrada. */
.partners__logo img {
    width: auto;
    height: auto;
    max-width: 150px;
    max-height: 44px;
    object-fit: contain;
    filter: brightness(0);
    opacity: 0.55;
    transition: filter var(--dur-base) var(--ease-apple), opacity var(--dur-base) var(--ease-apple);
}

@media (hover: hover) {
    .partners__logo:hover img { filter: none; opacity: 1; }
}

.partners__logo:focus-visible img { filter: none; opacity: 1; }

.partners__segment {
    flex: none;
    font-family: var(--font-title);
    font-size: var(--fs-xl);
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--ink-muted);
}

@media (prefers-reduced-motion: reduce) {
    .marquee { -webkit-mask-image: none; mask-image: none; }
    .marquee__track {
        width: auto;
        animation: none;
    }
    .marquee__group {
        flex-wrap: wrap;
        justify-content: center;
        row-gap: var(--space-8);
        padding-inline: var(--gutter);
    }
    .marquee__group[aria-hidden] { display: none; }
}
