/**
 * Tokens do projeto. Gerado a partir do DESIGN.md.
 *
 * REGRA: nenhum hex, px de espaçamento ou família de fonte fora daqui.
 * Enquanto um valor estiver `??` no DESIGN.md, ele NÃO entra aqui — a seção
 * fica bloqueada até a extração do PSD (npm run psd:extrair).
 */

:root {
  /* ---- Motion (decidido: nível N2, ver CLAUDE.md) ---- */
  --dur-rapida: 150ms;
  --dur-media: 300ms;
  --dur-lenta: 600ms;
  --dur-ambiente: 9000ms;
  --ease-padrao: cubic-bezier(0.2, 0.6, 0.2, 1);
  --ease-saida: cubic-bezier(0.4, 0, 1, 1);
  --ease-ambiente: cubic-bezier(0.45, 0, 0.55, 1);
  /* Overshoot para entradas com "pop": ~6% e ~12% além do repouso. */
  --ease-pop: cubic-bezier(0.34, 1.36, 0.64, 1);
  --ease-pop-forte: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Deslocamento máximo do parallax de ponteiro (hero e box LULA 13) */
  --parallax-max: 10px;

  /* ---- Escala tipográfica do controle A+/A− ---- */
  --escala-fonte: 1;

  /* ---- Cores medidas no PSD (header) ---- */
  --cor-marca-primaria: #fd0000; /* vermelho do menu */
  --cor-marca-secundaria: #0034d2; /* azul — escolhido entre as 4 variantes */
  --cor-marca-terciaria: #ffd400; /* amarelo — escolhido entre as 3 variantes */
  --cor-fundo: #f2f0e9; /* creme da página e da barra do menu */
  --cor-superficie: #ffffff; /* campo de busca, cards */
  --cor-toolbar-fundo: #f5f5f5; /* faixa de acessibilidade */
  --cor-texto: #2e2e2e;
  --cor-texto-suave: #8a8a8a; /* ícones de rede e rótulo da toolbar */
  --cor-borda: #e6e6e6;
  --cor-foco: #0034d2;
  /* seções (medidas nas fatias do PSD) */
  --cor-verde: #00b923;
  --cor-card-programas: #a20301;
  --cor-card-comerciais: #037418;
  --cor-card-redes: #002493;
  --cor-painel-claro: #f0f0f0;
  --cor-rodape: #00279c;
  --cor-rodape-campo: #001e76;

  --cor-cta: #04aa1f; /* botão Seja porta-voz */
  --cor-cta-anel: #7bcd84;
  --cor-cta-texto: #ffffff;

  /* ---- Tipografia ----
   * Uma família só, do texto ao display: Gotham, auto-hospedada em
   * `compartilhado/fonts/` e declarada em `compartilhado/css/fontes.css`.
   * Substituiu Montserrat (corpo) e Transducer (display) em 11/08/2026 — o que
   * encerra a pendência #10, que esperava a licença de webfont da Transducer.
   *
   * Os dois tokens continuam separados de propósito: quem escreve CSS segue
   * distinguindo "isto é título" de "isto é corpo", e o dia em que voltar a
   * haver duas famílias não exige varrer o projeto inteiro.
   *
   * 12/08/2026 — a licença da Transducer chegou, e com ela um TERCEIRO papel:
   * display condensada. Não substitui a Gotham em nada do que já existe; entra
   * onde o PSD desenha condensado (manchete de banner, "SUPER APPS"). Quem
   * pedir `--fonte-display` sem o webfont carregado cai na Gotham, que é mais
   * larga — por isso todo uso precisa caber sem depender da condensação.
   *
   * Ainda em 12/08 (revisão V4 da /mobilizacao) entrou o QUARTO papel:
   * `--fonte-display-texto`, a Transducer de largura NORMAL no corte Regular.
   * É a fonte de corpo dos cartões daquele layout — não é condensada, então não
   * serve de substituta da anterior, e vice-versa.
   */
  --fonte-titulo: 'Gotham', system-ui, sans-serif;
  --fonte-texto: 'Gotham', system-ui, sans-serif;
  --fonte-display: 'Transducer Condensed', 'Gotham', system-ui, sans-serif;
  --fonte-display-texto: 'Transducer', 'Gotham', system-ui, sans-serif;

  /* ---- Grade ----
   * Conteúdo do PSD vai de x=141 a x=1698 (1557px). Arredondado para 1560 e
   * centralizado — o PSD tinha margens assimétricas (141 vs 222).
   */
  --container-max: 1560px;
  --gutter: clamp(1rem, 4vw, 2rem);

  /* ---- Espaçamento (base 8) ---- */
  --espaco-1: 0.25rem;
  --espaco-2: 0.5rem;
  --espaco-3: 1rem;
  --espaco-4: 1.5rem;
  --espaco-5: 2rem;
  --espaco-6: 3rem;
  --espaco-7: 4rem;
  --espaco-8: 6rem;

  --raio-s: 4px;
  --raio-m: 8px;
  --raio-g: 16px;
  /* cards das vitrines e painéis do Fez e Fará (desvio do PSD, que usa
     cantos retos — ver a tabela no fim do DESIGN.md) */
  --raio-xg: 20px;

  /* ---- PENDENTE ----
   * --cor-marca-secundaria (azul) e --cor-marca-terciaria (amarelo):
   * escolher entre as variantes listadas no DESIGN.md.
   * --sombra-card, escala tipográfica consolidada, breakpoints das demais
   * seções — entram quando cada seção for implementada.
   */
}

/* Os valores casam com ESCALAS em useAcessibilidade.ts, que grava o
   multiplicador em data-escala — não o índice. Mudou lá, muda aqui. */
:root[data-escala='0.9'] { --escala-fonte: 0.9; }
:root[data-escala='1'] { --escala-fonte: 1; }
:root[data-escala='1.15'] { --escala-fonte: 1.15; }
:root[data-escala='1.3'] { --escala-fonte: 1.3; }

/* Tema escuro — derivado por nós; o PSD não tem. Contrastes conferidos:
   #F2F0E9 sobre #14130F = 15.6:1. Ver docs/pendencias.md #5. */
:root[data-theme='dark'] {
  color-scheme: dark;
  --cor-fundo: #14130f;
  --cor-toolbar-fundo: #1c1b17;
  --cor-superficie: #24231e;
  --cor-texto: #f2f0e9;
  --cor-texto-suave: #a5a29a;
  --cor-borda: #35332c;
  --cor-marca-primaria: #ff4d4a; /* #FD0000 reprova sobre fundo escuro */
  --cor-foco: #7ea2ff;
}

/* Alto contraste vence o tema escuro. */
:root[data-contraste='alto'] {
  --cor-fundo: #000;
  --cor-texto: #fff;
  --cor-superficie: #000;
  --cor-borda: #fff;
  --cor-foco: #ff0;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-rapida: 1ms;
    --dur-media: 1ms;
    --dur-lenta: 1ms;
    --dur-ambiente: 1ms;
    --parallax-max: 0px;
  }
}