/* ==========================================================================
   tokens.css  ·  Forlegacy
   ÚNICO arquivo que você precisa editar para mudar cor, fonte ou espaçamento
   do site inteiro. Nenhum valor de cor ou fonte aparece em site.css nem em
   qualquer página: tudo lá dentro aponta para uma variável definida aqui.
   ========================================================================== */

:root{

  /* ---- 1. COR ------------------------------------------------------------
     Troque estes seis valores e o site inteiro muda de identidade.          */

  --c-bg:        #ffffff;   /* fundo da página                              */
  --c-ink:       #0e1216;   /* texto principal                              */
  --c-muted:     #5c6771;   /* texto secundário, legendas, rótulos          */
  --c-rule:      #e1e6e2;   /* linhas, bordas, filetes                      */
  --c-band:      #eff4f0;   /* fundo de blocos destacados (resumo, código)  */
  --c-accent:    #0f5c5a;   /* links e o estado "normal" nos gráficos       */
  --c-signal:    #9d1b52;   /* numeração, ênfase e o estado "anômalo"       */

  /* derivadas: normalmente não precisam de ajuste */
  --c-accent-hover: var(--c-signal);
  --c-focus:        var(--c-signal);
  --c-inverse:      var(--c-bg);

  /* ---- 2. TIPOGRAFIA -----------------------------------------------------
     Três papéis. Troque a primeira família de cada pilha para trocar a voz
     do site. As pilhas de reserva mantêm a página legível antes das fontes
     externas carregarem, o que evita o salto de layout.                     */

  --f-display: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --f-body:    "Newsreader", "Iowan Old Style", Georgia, serif;
  --f-mono:    "Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --fs-base:    1.125rem;   /* corpo do texto                               */
  --fs-small:   0.875rem;
  --fs-micro:   0.72rem;    /* rótulos em monoespaçada                      */
  --fs-h1:      clamp(2rem, 4.6vw, 3.4rem);
  --fs-h2:      clamp(1.35rem, 2.4vw, 1.6rem);
  --fs-hero:    clamp(2.4rem, 6.5vw, 4.6rem);

  --lh-tight:   1.08;
  --lh-normal:  1.6;
  --lh-loose:   1.7;

  --ls-micro:   0.14em;     /* espaçamento das versaletes em monoespaçada   */
  --ls-display: -0.018em;

  --fw-body:    400;
  --fw-semi:    600;
  --fw-bold:    700;

  /* ---- 3. MEDIDA E ESPAÇO ------------------------------------------------ */

  --w-page:     68rem;      /* largura total do conteúdo                    */
  --w-measure:  44rem;      /* largura da linha de texto                    */
  --w-note:     17rem;      /* largura da nota lateral                      */

  --sp-1: 0.35rem;
  --sp-2: 0.7rem;
  --sp-3: 1.1rem;
  --sp-4: 1.8rem;
  --sp-5: 2.8rem;
  --sp-6: 3.6rem;
  --sp-7: 5rem;

  --radius: 2px;

  /* ---- 4. PONTO DE QUEBRA ------------------------------------------------
     Usado apenas como referência; media queries em site.css repetem o valor
     porque a especificação de CSS não aceita variável dentro de @media.     */
  --bp-wide: 60rem;
}

/* Modo escuro opcional. Está desligado por padrão, já que o site é branco.
   Para ativar, remova o comentário do bloco inteiro.

@media (prefers-color-scheme: dark){
  :root{
    --c-bg:#0e1216; --c-ink:#e8eae6; --c-muted:#98a3ab;
    --c-rule:#242c31; --c-band:#18211e;
    --c-accent:#5fbfb2; --c-signal:#e8709f;
  }
}
*/
