/* =========================================================
   LEX Design System — Design Tokens (Volume 24 · Phase A)
   ========================================================= */
:root{
  /* Color — Ink / Coal / Graphite / Muted */
  --ink:#242424;
  --coal:#343638;
  --graphite:#4a4d50;
  --muted:#6f7275;

  /* Color — Surfaces */
  --paper:#f5f5f2;
  --white:#ffffff;
  --line:#deded8;

  /* Color — Brand accents */
  --yellow:#f2c400;
  --orange:#ef7d00;

  /* Color — Feedback (used sparingly) */
  --success:#2f8f5b;
  --warning:#c98a00;
  --danger:#c0392b;

  /* Layout */
  --max:1280px;
  --r:14px;
  --r-sm:8px;
  --r-lg:22px;
  --header-h:78px;

  /* Typography */
  --font-base:Inter,"Segoe UI",Arial,sans-serif;
  --fs-display:clamp(40px,5.4vw,72px);
  --fs-h1:clamp(34px,4.4vw,56px);
  --fs-h2:clamp(28px,3.2vw,42px);
  --fs-h3:22px;
  --fs-body:17px;
  --fs-small:14px;
  --lh-tight:1.1;
  --lh-base:1.68;

  /* Spacing (base 8) */
  --sp-1:8px;
  --sp-2:16px;
  --sp-3:24px;
  --sp-4:32px;
  --sp-5:48px;
  --sp-6:64px;
  --sp-7:80px;
  --sp-8:96px;

  /* Motion */
  --ease:cubic-bezier(.4,.0,.2,1);
  --dur:.2s;

  /* Shadow */
  --shadow-sm:0 2px 10px rgba(36,36,36,.06);
  --shadow-md:0 10px 30px rgba(36,36,36,.10);
  --shadow-lg:0 18px 46px rgba(36,36,36,.14);
  --shadow-glow:0 10px 26px rgba(242,196,0,.35);
}