/* ============================================================
   JIHOLABO · TYPOGRAPHY TOKENS
   Source: Brand Guidelines 2026 · p.06 "Typographie"
   Typeface: Poppins (Light 300 / Regular 400 / Medium 500 / Bold 700)
   Brand scale: H1 48 · H2 32 · H3 22 · Body 15 · Légende 11 (+1 tracking)
   ============================================================ */
:root {
  /* ---- Families ---- */
  --font-sans: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'SFMono-Regular', 'Menlo', 'Consolas', monospace;

  /* ---- Weights ---- */
  --fw-light:   300; /* @kind font */
  --fw-regular: 400; /* @kind font */
  --fw-medium:  500; /* @kind font */
  --fw-semibold:600; /* @kind font */
  --fw-bold:    700; /* @kind font */

  /* ---- Brand type scale (px, faithful to guidelines) ---- */
  --fs-h1:    48px;
  --fs-h2:    32px;
  --fs-h3:    22px;
  --fs-lg:    18px;
  --fs-body:  15px;   /* brand body size */
  --fs-sm:    13px;
  --fs-label: 11px;   /* Légende / Donnée */

  /* ---- Line heights ---- */
  --lh-tight:   1.1; /* @kind font */
  --lh-heading: 1.2; /* @kind font */
  --lh-snug:    1.4; /* @kind font */
  --lh-body:    1.6; /* @kind font */

  /* ---- Letter spacing ---- */
  --ls-tight:  -0.02em; /* @kind font */
  --ls-normal: 0; /* @kind font */
  --ls-label:  0.08em;  /* @kind font */

  /* ============================================================
     SEMANTIC TYPE ALIASES
     ============================================================ */
  --text-h1-weight: var(--fw-bold); /* @kind font */
  --text-h2-weight: var(--fw-bold); /* @kind font */
  --text-h3-weight: var(--fw-medium); /* @kind font */
  --text-body-weight: var(--fw-regular); /* @kind font */
  --text-label-weight: var(--fw-medium); /* @kind font */
}

/* ---- Optional utility classes (consumers may use or ignore) ---- */
.jiho-h1 { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-h1); line-height: var(--lh-heading); letter-spacing: var(--ls-tight); color: var(--text-strong); }
.jiho-h2 { font-family: var(--font-display); font-weight: var(--fw-bold); font-size: var(--fs-h2); line-height: var(--lh-heading); letter-spacing: var(--ls-tight); color: var(--text-strong); }
.jiho-h3 { font-family: var(--font-display); font-weight: var(--fw-medium); font-size: var(--fs-h3); line-height: var(--lh-snug); color: var(--text-strong); }
.jiho-body { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text-body); }
.jiho-label { font-family: var(--font-sans); font-weight: var(--fw-medium); font-size: var(--fs-label); line-height: 1.3; letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--text-muted); }
