/* farpa-ds-core · core/tokens.css · v1.0 · 2026-05-02
   origem: AI/tokens.css @ Wave 19 Onda D3.6 · 2026-05-02 · não-editar-sem-PR
   ==========================================================================
   TOKENS ABSTRATOS DO CORE — escala universal · ZERO valor de cor.
   Cada produto OBRIGATORIAMENTE define cor/tipografia/sombra em
   <produto>/ds/tokens-produto.css. Esse arquivo é read-only no produto.

   Cobre: spacing · type scale · line-height · measure · radius · motion
          duration · easing · z-index · focus ring offset · logo size.
   NÃO cobre: cor, font-family, shadow (todos com valor de cor implícito).

   Ordem de load esperada (replica AI/index.html:24-34):
     1. ds/core/tokens.css           ← ESTE ARQUIVO
     2. ds/tokens-produto.css        ← define --accent, --text-1..4, --bg-N etc.
     3. ds/core/base.css
     4. ds/core/a11y.css
     5. ds/core/themes-hc.css
     6. ds/themes-produto.css        (opcional · temas próprios do produto)
     7. ds/components-core/logo.css
     8. ds/components-core/toggle-hc.css
     9. ds/components/<produto>.css

   Spec canônica: farpa-reengenharia/02-design-system/01-tokens-e-temas.md v3.0.0
*/

:root {

  /* ================================================================== */
  /* SPACING — escala harmônica base 4px                                 */
  /* ================================================================== */
  --sp-1:    0.25rem;   /* 4px  */
  --sp-2:    0.5rem;    /* 8px  */
  --sp-3:    0.75rem;   /* 12px */
  --sp-4:    1rem;      /* 16px */
  --sp-5:    1.25rem;   /* 20px */
  --sp-6:    1.5rem;    /* 24px */
  --sp-8:    2rem;      /* 32px */
  --sp-10:   2.5rem;    /* 40px */
  --sp-12:   3rem;      /* 48px */
  --sp-16:   4rem;      /* 64px */
  --sp-20:   5rem;      /* 80px */
  --sp-24:   6rem;      /* 96px */
  --sp-32:   8rem;      /* 128px */

  /* ================================================================== */
  /* ESCALA TIPOGRÁFICA — 9 steps                                        */
  /* (font-family declarado em tokens-produto.css)                       */
  /* ================================================================== */
  --fs-xs:    0.75rem;   /* 12px */
  --fs-sm:    0.875rem;  /* 14px */
  --fs-base:  1rem;      /* 16px */
  --fs-md:    1.125rem;  /* 18px */
  --fs-lg:    1.25rem;   /* 20px */
  --fs-xl:    1.5rem;    /* 24px */
  --fs-2xl:   2rem;      /* 32px */
  --fs-3xl:   3rem;      /* 48px */
  --fs-4xl:   4.5rem;    /* 72px */

  /* ================================================================== */
  /* LINE-HEIGHT                                                          */
  /* ================================================================== */
  --lh-tight:    1.15;
  --lh-heading:  1.2;
  --lh-body:     1.65;   /* PT-BR padrão (descendentes acentuados)        */
  --lh-body-en:  1.6;    /* EN                                            */

  /* ================================================================== */
  /* MEASURE — largura máxima editorial em ch                            */
  /* ================================================================== */
  --measure-ptbr:  65ch;
  --measure-en:    70ch;
  --measure:       var(--measure-ptbr);

  /* ================================================================== */
  /* GRID                                                                 */
  /* ================================================================== */
  --max-width:        1200px;
  --padding-inline:   1.5rem;       /* 24px */
  --col-editorial:    65ch;
  --col-marginalia:   200px;
  --gap-editorial:    3rem;         /* 48px */

  /* ================================================================== */
  /* LAYOUT — header / content / form                                    */
  /* ================================================================== */
  --header-height:           64px;
  --header-height-mobile:    56px;
  --header-height-collapsed: 48px;  /* mobile após scroll-down */
  --content-max-w:           1200px;
  --prose-max-w:             680px; /* ~70ch · editorial */
  --form-max-w:              560px;

  /* ================================================================== */
  /* RAIOS                                                                */
  /* ================================================================== */
  --r-sm:    3px;
  --r-md:    6px;
  --r-lg:    10px;
  --r-xl:    16px;
  --r-pill:  999px;

  /* ================================================================== */
  /* MOTION — 5 durações (zeradas via reduced-motion abaixo)             */
  /* ================================================================== */
  --dur-instant:    80ms;
  --dur-fast:       160ms;
  --dur-base:       240ms;
  --dur-slow:       400ms;
  --dur-deliberate: 600ms;

  /* ================================================================== */
  /* EASING                                                               */
  /* ================================================================== */
  --ease-out:    cubic-bezier(0.0, 0.0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0.0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-linear: linear;

  /* ================================================================== */
  /* Z-INDEX semântico                                                    */
  /* ================================================================== */
  --z-base:    0;
  --z-above:   10;
  --z-header:  30;
  --z-popover: 40;
  --z-overlay: 100;
  --z-modal:   200;
  --z-toast:   300;
  --z-skip:    400;

  /* ================================================================== */
  /* FOCUS RING — offset/width neutros (cor em tokens-produto.css)       */
  /* ================================================================== */
  --focus-ring-offset: 2px;
  --focus-ring-width:  2px;

  /* ================================================================== */
  /* LOGO sizes (produto pode override)                                  */
  /* ================================================================== */
  --logo-mark-size:  32px;
  --logo-gap:        var(--sp-2);
}

/* ================================================================== */
/* REDUCED MOTION — zero todas as durações                              */
/* ================================================================== */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-instant:    0ms;
    --dur-fast:       0ms;
    --dur-base:       0ms;
    --dur-slow:       0ms;
    --dur-deliberate: 0ms;
  }
}
