/* ============================================================
   PADRÃO KANNON — TOKENS
   Esta é a base do sistema. Copie este arquivo em qualquer
   projeto de cliente e troque APENAS o bloco "MARCA DO CLIENTE".
   Tudo o resto (neutros, tipo, espaço, raio) já está calibrado
   pra ficar bonito e legível em qualquer marca.
   ============================================================ */

:root {
  /* ----------------------------------------------------------
     1) MARCA DO CLIENTE  →  TROQUE SÓ AQUI
     --------------------------------------------------------- */

  /* Cor da marca. Use a cor do cliente, mas respeite as funções:
     --brand        cor de identidade (textos grandes, detalhes)
     --brand-strong fundo de botão (precisa de 4.5:1 com texto branco)
     --brand-soft   fundo de bloco/realce levíssimo
     --brand-ink    versão escura pra texto sobre fundo claro     */
  --brand:        oklch(0.58 0.13 45);   /* terracota (exemplo) */
  --brand-strong: oklch(0.50 0.13 42);   /* fundo do CTA        */
  --brand-soft:   oklch(0.95 0.03 55);   /* realce suave        */
  --brand-ink:    oklch(0.36 0.08 45);   /* texto na cor        */
  --on-brand:     #ffffff;               /* texto sobre o botão */

  /* Fonte de display (opcional). Body usa fonte de sistema = 0 download. */
  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-body:    ui-sans-serif, system-ui, -apple-system, "Segoe UI",
                  Roboto, Helvetica, Arial, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;


  /* ----------------------------------------------------------
     2) NEUTROS  (temperatura quente — combina com qualquer marca)
     Trocar a matiz (último número do oklch) p/ esfriar/esquentar.
     --------------------------------------------------------- */
  --paper:    oklch(0.987 0.004 85);   /* fundo principal      */
  --surface:  oklch(0.955 0.006 80);   /* bloco alternado      */
  --surface-2:oklch(0.925 0.008 80);   /* card sobre surface   */
  --line:     oklch(0.89 0.008 80);    /* divisórias/bordas    */

  --ink:      oklch(0.24 0.012 60);    /* texto principal      */
  --ink-soft: oklch(0.43 0.012 60);    /* texto secundário     */
  --ink-mute: oklch(0.56 0.010 60);    /* legendas/labels      */

  /* ----------------------------------------------------------
     3) TIPOGRAFIA — escala modular (razão 1.25), fluida
     --------------------------------------------------------- */
  --text-label: 0.78rem;                                  /* 12.5 */
  --text-sm:    0.875rem;                                 /* 14   */
  --text-base:  1.0625rem;                                /* 17   */
  --text-md:    1.25rem;                                  /* 20   */
  --text-lg:    clamp(1.4rem, 1.2rem + 0.9vw, 1.65rem);   /* 22-26 */
  --text-xl:    clamp(1.7rem, 1.3rem + 1.7vw, 2.2rem);    /* 27-35 */
  --text-2xl:   clamp(2.1rem, 1.5rem + 2.7vw, 3rem);      /* 33-48 */
  --text-3xl:   clamp(2.6rem, 1.6rem + 4.4vw, 4.25rem);   /* 41-68 */
  --text-4xl:   clamp(3rem, 1.5rem + 6.6vw, 5.75rem);     /* 48-92 */

  --leading-tight: 1.04;
  --leading-snug:  1.18;
  --leading-body:  1.6;
  --tracking-tight: -0.02em;
  --tracking-label: 0.14em;
  --measure: 64ch;          /* largura ideal de leitura */

  /* ----------------------------------------------------------
     4) ESPAÇO — base 8pt
     --------------------------------------------------------- */
  --sp-1: 0.25rem;  /* 4  */
  --sp-2: 0.5rem;   /* 8  */
  --sp-3: 0.75rem;  /* 12 */
  --sp-4: 1rem;     /* 16 */
  --sp-5: 1.5rem;   /* 24 */
  --sp-6: 2rem;     /* 32 */
  --sp-7: 3rem;     /* 48 */
  --sp-8: 4rem;     /* 64 */
  --sp-9: 6rem;     /* 96 */
  --sp-10: 8rem;    /* 128 */
  --section-y: clamp(3.5rem, 2rem + 7vw, 7rem); /* respiro de seção */

  /* ----------------------------------------------------------
     5) FORMA — raio, sombra, layout
     --------------------------------------------------------- */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-pill: 999px;

  /* Sombras com tinta quente, sutis (nunca cinza-azulado puro) */
  --shadow-sm: 0 1px 2px oklch(0.3 0.02 60 / 0.06),
               0 2px 6px oklch(0.3 0.02 60 / 0.05);
  --shadow-md: 0 4px 12px oklch(0.3 0.02 60 / 0.08),
               0 12px 32px oklch(0.3 0.02 60 / 0.07);

  --container: 1120px;
  --tap: 48px;            /* alvo mínimo de toque */

  --ring: 0 0 0 3px oklch(0.58 0.13 45 / 0.35); /* foco visível */
}