/* ===== Ashal · Typography tokens ===== */
:root {
  --font-display: 'Baloo Bhaijaan 2', 'Tajawal', system-ui, sans-serif;
  --font-ui: 'Tajawal', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Display / heading scale (rounded heavy) */
  --type-hero: 800 clamp(40px, 6vw, 76px)/1.05 var(--font-display);
  --type-h1:   800 clamp(32px, 4vw, 52px)/1.1 var(--font-display);
  --type-h2:   700 clamp(26px, 3vw, 38px)/1.15 var(--font-display);
  --type-h3:   700 24px/1.2 var(--font-display);
  --type-title:700 19px/1.3 var(--font-display);

  /* Body / UI (Tajawal) */
  --type-lead:   500 20px/1.6 var(--font-ui);
  --type-body:   400 16px/1.7 var(--font-ui);
  --type-body-sm:400 14px/1.6 var(--font-ui);
  --type-label:  700 13px/1.2 var(--font-ui);
  --type-caption:500 12px/1.4 var(--font-ui);

  /* weights */
  --fw-regular: 400; /* @kind other */
  --fw-medium: 500; /* @kind other */
  --fw-bold: 700; /* @kind other */
  --fw-black: 800; /* @kind other */

  /* tracking — Latin labels only; Arabic should never be letter-spaced */
  --tracking-label: 0.06em; /* @kind other */
}