/* ==========================================================================
   Parceiros - faixa de logos em loop contínuo (padrão "infinite slider")
   Usado em: Default.aspx, SeuDinSolucao.aspx, SeuDinBeneficio.aspx, IndicarRH.aspx
   Markup: parceiros-bloco.inc (os logos ficam duplicados no HTML para o loop).

   Sem JavaScript: anima o trilho de 0 até uma cópia completa do grupo.
   Roda sempre, inclusive com prefers-reduced-motion: a faixa é o próprio
   conteúdo da seção (com as animações do Windows desligadas ela virava uma
   grade parada, e o pedido é o carrossel contínuo).
   ========================================================================== */

.sd-logos-parceiros {
    --sd-parc-gap: 56px;
    --sd-parc-dur: 80s;
    --sd-parc-alt: 64px;
    padding: 40px 0 24px;
    background: #fff;
    overflow: hidden;
}

.sd-logos-parceiros__cabeca {
    text-align: center;
    margin-bottom: 28px;
    padding: 0 16px;
}

.sd-logos-parceiros__cabeca p {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--sd-texto-suave, #6b6b7b);
}

.sd-logos-parceiros__faixa {
    overflow: hidden;
    width: 100%;
}

/* O trilho NÃO tem conteúdo pintado próprio (sem fundo/borda) e cada logo é a sua própria
   camada composta (translateZ). Sem isso o Safari do iOS criava UMA textura com a largura
   inteira do trilho (10-15 mil px), além do limite que ele pinta: os logos iam sumindo
   conforme o trilho deslizava e voltavam no reinício do loop. */
.sd-logos-parceiros__trilho {
    display: flex;
    align-items: center;
    gap: var(--sd-parc-gap);
    width: max-content;
    animation: sd-parc-desliza var(--sd-parc-dur) linear infinite;
}

/* Metade exata do trilho = um grupo + o gap que o separa da cópia. */
@keyframes sd-parc-desliza {
    from { transform: translateX(0); }
    to   { transform: translateX(calc(-50% - (var(--sd-parc-gap) / 2))); }
}

.sd-logos-parceiros__logo {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.sd-logos-parceiros__logo img {
    display: block;
    height: var(--sd-parc-alt);
    width: auto;
    max-width: 240px;
    object-fit: contain;
}

/* Logos "altos" (símbolo em cima do nome) ganham mais altura para não virar um pontinho. */
.sd-logos-parceiros__logo--alto img { height: calc(var(--sd-parc-alt) + 28px); }

@media (max-width: 640px) {
    .sd-logos-parceiros { --sd-parc-alt: 44px; --sd-parc-gap: 36px; --sd-parc-dur: 60s; padding-top: 30px; }
    .sd-logos-parceiros__logo img { max-width: 160px; }
    .sd-logos-parceiros__logo--alto img { height: calc(var(--sd-parc-alt) + 20px); }
}
