/*
 * Tokens — herdados do xg-core, não inventados aqui.
 *
 * O --marca declarado abaixo é apenas a queda para quando o plugin está
 * desligado. Com o plugin ativo, inc/enqueue.php injeta a cor configurada
 * pela academia e sobrescreve esta linha. Nenhum outro arquivo do tema pode
 * escrever um hex de marca: se precisar da cor, usa a variável.
 *
 * Projeto Gerado pelo Prompt Mestre do Desenvolvedor e Vibe Coder Dante Testa — www.dantetesta.com.br
 * Valoar — valoar.com.br
 */

:root {
  /* --- Marca ---
     Três tokens, não um, e cada um tem um trabalho.

       --marca         a cor exata da marca. Título grande, borda, ícone,
                       preenchimento decorativo. Tudo que responde ao piso
                       de 3:1 do critério 1.4.11.
       --marca-texto   variante para texto e botão sobre superfície CLARA.
       --marca-escuro  variante para texto pequeno sobre a banda ESCURA.

     Por que três: cor de marca saturada quase nunca cumpre 4,5:1 nos dois
     fundos. O vermelho do Xavier Gym (#EF2721) dá 4,21:1 no branco e
     4,00:1 no carvão — passa em manchete, reprova em botão.

     As variantes NÃO são chumbadas. inc/cor.php as calcula a partir da cor
     cadastrada pela academia, mantendo matiz e saturação e caminhando só na
     luminosidade até cruzar o piso. Os valores abaixo são a queda para
     quando o plugin está desligado. */
  --marca: #EF2721;
  --marca-texto: #EB1711;
  --marca-escuro: #F1433E;

  --carvao: #1B1D21;
  --fundo: #F3F4F6;
  --cartao: #FFFFFF;
  --fraco: #6B7079;
  --linha: #E4E6EB;
  --linha-forte: #D2D5DC;
  --ok: #2F8557;
  --erro: #C4453C;

  /* --- Banda escura ---
     Todos os pares abaixo foram medidos contra #1B1D21. [VERIFICADO]

       --banda-ink     #F3F4F6  15,34:1  texto principal
       --banda-fraco   #8E949E   5,53:1  texto de apoio (passa AA)
       --marca-escuro  #F1433E   4,51:1  texto pequeno com a cor da marca
       --marca         #EF2721   4,00:1  SÓ manchete, borda e ícone
       --banda-borda   #6B7079   3,39:1  borda de campo e de cartão clicável
       --banda-linha   #33373E   1,41:1  filete DECORATIVO, só isso

     Três armadilhas que os números evitam:

     1. O --fraco do sistema dá 3,39:1 aqui. Passa como borda (1.4.11 pede
        3:1) e REPROVA como texto (1.4.3 pede 4,5:1). Por isso ele aparece
        como --banda-borda e nunca como cor de texto na banda.

     2. O --banda-linha não chega a 3:1. Enquanto for separador decorativo,
        está dentro da norma. No dia em que virar borda de input ou de card
        clicável, passa a ser componente de interface e reprova — nesse caso
        o token certo é --banda-borda.

     3. O --marca cru dá 4,00:1 aqui: passa o piso de 3:1 de manchete e de
        componente, e REPROVA os 4,5:1 de texto corrido. Rótulo pequeno na
        banda escura usa --marca-escuro. Se você está escrevendo
        color: var(--marca) num texto abaixo de 24px, está errado. */
  --banda-bg: var(--carvao);
  --banda-ink: var(--fundo);
  --banda-fraco: #8E949E;
  --banda-borda: var(--fraco);
  --banda-linha: #33373E;

  /* --- Tipografia --- */
  --f-titulo: "Big Shoulders Display", "Bahnschrift", "Archivo Narrow", "Arial Narrow", Impact, sans-serif;
  --f-corpo: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-num: "IBM Plex Mono", "Cascadia Mono", Consolas, ui-monospace, monospace;

  /* --- Escala tipográfica ---
     Manchete trava em clamp para nunca passar de 3 linhas no hero. */
  --t-hero: clamp(3rem, 8.5vw, 6.4rem);
  --t-secao: clamp(2rem, 4.4vw, 3.4rem);
  --t-sub: clamp(1.25rem, 2.1vw, 1.7rem);
  --t-corpo: 1.0625rem;
  --t-apoio: 0.9375rem;
  --t-rotulo: 0.72rem;

  /* --- Ritmo vertical --- */
  --e-1: 6px;
  --e-2: 12px;
  --e-3: 20px;
  --e-4: 32px;
  --e-5: 52px;
  --e-6: 80px;
  --faixa-y: clamp(64px, 9vw, 118px);

  /* --- Formas --- */
  --r-cartao: 10px;
  --r-btn: 8px;
  --r-campo: 8px;
  --sombra: 0 1px 2px rgba(27, 29, 33, .05), 0 1px 3px rgba(27, 29, 33, .04);
  --sombra-alta: 0 4px 12px rgba(27, 29, 33, .08), 0 2px 4px rgba(27, 29, 33, .04);

  /* --- Medidas --- */
  --largura: 1140px;
  --medida: 66ch;

  /* --- Movimento --- */
  --tempo: 220ms;
  --curva: cubic-bezier(.2, .7, .3, 1);
}