/* ─────────────────────────────────────────────────────────
   HWG · DESIGN TOKENS  (v3 — espelhando o Figma)
   ───────────────────────────────────────────────────────── */

:root {
  /* CORES — extraídas do Figma */
  --hwg-ink:        #10161E;
  --hwg-amber:      #E07228;
  --hwg-forest:     #2B6645;
  --hwg-paper:      #FFFFFF;
  --hwg-soft:       #F2F0EB;
  --hwg-black:      #000000;

  /* CORES auxiliares */
  --hwg-on-ink:     #EDEAE2;
  --hwg-on-ink-2:   rgba(237, 234, 226, 0.14);
  --hwg-on-ink-3:   rgba(237, 234, 226, 0.6);
  --hwg-line:       #000000;
  --hwg-line-soft:  rgba(0, 0, 0, 0.4);

  /* TIPOGRAFIA */
  --ff-sans:  "DM Sans", "Helvetica Neue", Arial, sans-serif;
  --ff-serif: "DM Serif Text", "Georgia", "Times New Roman", serif;

  /* TIPOGRAFIA — escalas exatas do Figma (fluido com clamp) */
  --t-h1:        clamp(2.6rem, 1.6rem + 5.2vw, 4.7rem);   /* 75.453px @ 1490 */
  --t-h1-cta:    clamp(2.8rem, 1.7rem + 6vw, 5.3rem);     /* 85px @ 1490 */
  --t-h2:        clamp(2.5rem, 1.6rem + 5vw, 4.55rem);    /* 72.951px @ 1490 */
  --t-h3:        clamp(2.4rem, 1.5rem + 5vw, 4.375rem);   /* 70px @ 1490 */
  --t-lede:      clamp(1.05rem, 0.9rem + 0.9vw, 1.815rem); /* 29-30px */
  --t-method-sub: clamp(0.95rem, 0.85rem + 0.5vw, 1.5625rem); /* 25px */
  --t-cta:       clamp(1rem, 0.95rem + 0.2vw, 1.25rem);   /* 20px */
  --t-body:      clamp(0.95rem, 0.9rem + 0.2vw, 1.0625rem); /* 17px */
  --t-eyebrow:   clamp(0.72rem, 0.68rem + 0.18vw, 0.85rem);
  --t-micro:     clamp(0.68rem, 0.65rem + 0.1vw, 0.78rem);

  /* PESOS */
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semi:    600;
  --fw-bold:    700;
  --fw-black:   900;

  /* TRACKING */
  --tr-tight:   -0.03em;
  --tr-snug:    -0.015em;
  --tr-display: 0.2em;

  /* LEADING */
  --lh-display: 0.96;
  --lh-tight:   1.04;
  --lh-snug:    1.18;
  --lh-body:    1.55;

  /* ESPAÇAMENTO */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 6rem;
  --sp-10: 8rem;
  --sp-11: 12rem;

  /* LAYOUT — gutter generoso como no Figma (56-97px) */
  --container-max: 1490px;
  --gutter: clamp(1.5rem, 4vw, 5.75rem);
  --header-h: 96px;

  /* MOTION */
  --ease-out-soft:   cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-strong: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 200ms;
  --dur-base: 420ms;
  --dur-slow: 780ms;

  /* RULES */
  --rule:      1px solid var(--hwg-black);
  --rule-soft: 1px solid var(--hwg-line-soft);

  /* Z */
  --z-header:  100;
  --z-overlay: 200;
}