/* ═══════════════════════════════════════════════════════════════════
   Gene Control 360 — AS CORES E OS TAMANHOS, NUM LUGAR SÓ
   (v256 · handoff de design 10, subida 9)
   ═══════════════════════════════════════════════════════════════════

   POR QUE ESTE ARQUIVO EXISTE

   A plataforma tem CINCO camadas de estilo. A quinta é o <style> próprio de
   cada página pública — `calculadora.php`, `demo.php` e `manual.php` — e ela
   é a que mais custa comercialmente: **é o que o cliente vê ANTES de comprar**.

   Essas três páginas nunca leram os valores da plataforma. Cada uma repetia a
   paleta por conta, e o cinza azulado que a rodada de design aposentou em 2026
   continuava vivo lá: 32 usos de #64748B na calculadora, 16 no manual.
   O resultado é a página que VENDE a plataforma estar numa cor diferente da
   plataforma que ela vende.

   Este arquivo tem SÓ o :root. É carregado pelas três páginas públicas E pelo
   style.css, então existe um valor só para cada cor.

   ⚠️ REGRA: mudou uma cor da marca? Muda AQUI, e em nenhum outro lugar.
   ⚠️ Cor de TEXTO de elemento que aparece nos dois temas sai de
      --txt/--dk/--mg/--lg/--gray. Os --n* servem para fundo, borda e texto
      sobre fundo claro FIXO — eles NÃO mudam no tema escuro (v250).
   ═══════════════════════════════════════════════════════════════════ */

:root {
  /* ── A marca ── */
  --dk:    #1B3A34;   /* verde escuro */
  --mg:    #2D5A50;   /* verde médio */
  --lg:    #4A8C7A;   /* verde claro */
  --slm:   #E8A598;   /* salmão — o acento, use com parcimônia */
  --slm2:  #F0C4BA;
  --bg:    #F4F6F4;
  --white: #FFFFFF;

  /* ── Cores de significado ── */
  --red:   #C0392B;
  --org:   #E67E22;
  --grn:   #27AE60;
  --blu:   #2980B9;
  --gold:  #B8860B;

  --radius: 12px;
  --shadow: 0 2px 12px rgba(0,0,0,.08);

  /* ── Neutros VERDES ───────────────────────────────────────────────
     Os cinzas antigos (#64748B, #E2E8F0) eram do Tailwind slate, puxados
     para o azul. Ao lado do verde da Gene ficavam frios. Estes são os
     mesmos tons de cinza, mas com o verde da marca por dentro. */
  --n50:  #FAFBFA;
  --n100: #F1F4F2;
  --n200: #E3E9E5;   /* bordas e divisores */
  --n300: #C7D2CC;   /* borda de botão secundário */
  --n400: #8C9E97;   /* texto apagado (NÃO passa em contraste como texto) */
  --n500: #5C6E68;   /* texto de apoio — 5,4:1 no branco */
  --n700: #33443E;   /* texto secundário forte */
  --n900: #1B2A26;   /* texto principal */

  /* ── Tamanhos — 7 degraus, e só ────────────────────────────────────
     O projeto tinha 22 tamanhos de fonte diferentes, cada tela com o seu.
     Texto novo usa UM destes. */
  --fs-12: 12px;   /* legenda, metadado, rodapé */
  --fs-13: 13px;   /* apoio, subtítulo, base legal */
  --fs-15: 15px;   /* CORPO — linha de tabela, texto corrido */
  --fs-17: 17px;   /* destaque, título de cartão */
  --fs-22: 22px;   /* número/indicador */
  --fs-26: 26px;   /* título de tela (serifada) */
  --fs-38: 38px;   /* capa: login, calculadora (serifada) */
}