/* ─────────────────────────────────────────────────────────────────────────
   Faixa de parceiros — balance.ia.br

   Estrutura pensada para crescer: a lista é um flex-wrap, então basta
   acrescentar um <li> com o <img> do novo parceiro. Nada precisa mudar no
   CSS para 1, 3 ou 8 logos.

   ⚠️ Emblemas de parceria têm regras de uso próprias. Por isso os logos aqui
   NÃO recebem grayscale, opacidade reduzida nem qualquer filtro: várias
   marcas (a Esri entre elas) proíbem alteração do emblema. A harmonização
   entre marcas diferentes é feita só pela altura comum e pelo respiro.
   Use sempre a variante clara/reversed — o fundo aqui é escuro.
   ───────────────────────────────────────────────────────────────────────── */

.partners {
  border-top: 1px solid rgba(33, 150, 243, 0.08);
  padding: 28px 0 4px;
}

.partners-inner {
  max-width: var(--max-w, 1200px);
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 60px);
  display: flex;
  align-items: center;
  gap: clamp(20px, 4vw, 48px);
  flex-wrap: wrap;
}

.partners-label {
  font-family: var(--font-body, 'DM Sans', -apple-system, sans-serif);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--white-muted, #8b9bb5);
  flex-shrink: 0;
}

.partners-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: clamp(24px, 5vw, 56px);
  flex-wrap: wrap;
}

/* Respiro obrigatório ao redor do emblema, exigido pelos manuais de marca. */
.partners-list li {
  padding: 4px 0;
}

.partners-list img {
  display: block;
  height: 44px;
  width: auto;       /* preserva a proporção — nunca esticar um emblema */
  max-width: 100%;
}

@media (max-width: 600px) {
  .partners-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .partners-list img { height: 40px; }  /* piso de legibilidade do emblema */
}