/* Letreiro de marcas — full bleed, loop contínuo via CSS */

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

.letreiro {
  position: relative;
  height: 96px;
  overflow: hidden;
  box-sizing: border-box;
  background-image: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.4) 0px, rgba(255, 255, 255, 0) 1px, rgba(20, 26, 25, 0.028) 2px, rgba(20, 26, 25, 0) 3px), linear-gradient(180deg, #E3E6E3 0%, #D3D8D4 48%, #DBE0DC 100%);
  display: flex;
  align-items: center;
}

.letreiro__mask {
  padding: 0 var(--gutter);
  box-sizing: border-box;
  height: 100%;
  overflow: hidden;
  position: relative;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 9%, #000 91%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 9%, #000 91%, transparent 100%);
}

.letreiro__track {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 46px;
  width: max-content;
  /*
    Duração recalculada para preservar a VELOCIDADE (px/s), não o tempo de
    ciclo: 46s eram calibrados para 13 itens por grupo (2026-09). Auditoria
    de 2026-10-03 reconciliou catálogo×letreiro e o grupo passou a 30 itens
    — mesma largura de slot por item (--letreiro-slot-w), então a largura
    total do grupo escala linearmente com a contagem. 46s × (30/13) ≈ 106s
    mantém exatamente o mesmo deslocamento por segundo de antes; reduzir a
    duração de volta a 46s dobraria a velocidade aparente do letreiro.
  */
  animation: refresqc-marquee 106s linear infinite;
  will-change: transform;
}

.letreiro__group {
  display: contents;
}

.letreiro__item {
  width: var(--letreiro-slot-w);
  height: var(--letreiro-slot-h);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

.letreiro__logo {
  width: auto;
  max-width: 100%;
  display: block;
  object-fit: contain;
  object-position: center;
  transform: scale(var(--logo-scale, 1));
  transform-origin: center;
}

/*
  Classes ópticas oficiais — classificam a marca pela sua PROPORÇÃO VISUAL
  real (não pela largura/altura nominal do arquivo), para equalizar peso
  óptico entre logos compactas, horizontais e wordmarks longos. Os valores
  vêm dos tokens --logo-cap-* (tokens.css). A largura sempre fica limitada
  a 100% do slot (acima), então wordmarks muito longos naturalmente usam
  mais dessa largura antes de "baterem no teto" de altura.

  A altura é fixada (não max-height) para que ícones com arquivo nativo
  menor que o teto óptico da classe (ex.: um SVG exportado em baixa
  resolução aparente) sejam escalados PARA CIMA até o mesmo peso visual
  dos demais — seguro para SVGs (vetoriais) e, nesta auditoria, nenhum
  raster ficou abaixo do teto da sua classe, então nenhum raster é
  ampliado além do seu tamanho nativo. object-fit:contain garante que,
  nos wordmarks mais extremos (limitados pela largura do slot, não pela
  altura), a proporção real do logo nunca seja distorcida.
*/
.letreiro__logo--compact { height: var(--logo-cap-compact); }
.letreiro__logo--horizontal { height: var(--logo-cap-horizontal); }
.letreiro__logo--wordmark { height: var(--logo-cap-wordmark); }

/*
  Exceções pontuais de equilíbrio óptico (2ª passagem visual em 1440/1280px).
  Único local de ajuste fino via --logo-scale: nunca em estilo inline.
  Faixa permitida: 0.88–1.12. Nenhuma exceção ativa nesta rodada — os
  3 caps ópticos acima já produziram equilíbrio visual suficiente nos
  13 logos auditados (ver relatório da normalização do Letreiro).
*/

.letreiro__sep {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--accent);
  flex: none;
}

@media (prefers-reduced-motion: reduce) {
  .letreiro__track {
    animation: none;
  }
}