/* ════════════════════════════════════════════════════
   LUMIÈRE — Design Tokens
   Soft pastel · storybook calm · generous breathing room
   ════════════════════════════════════════════════════ */

:root {
  /* ── Palette: linen, blue-grey & warm beige ───── */
  --paper:        #F5F1EA;   /* page background — linen */
  --paper-2:      #EDE7DC;   /* secondary surface */
  --surface:      #FFFFFF;   /* cards */

  --rose-50:      #EEF2F4;   /* (kept var names for compat) → cool linen */
  --rose-100:     #DDE4E8;
  --rose-200:     #B8C5CC;
  --rose-300:     #94A4AE;
  --rose-400:     #7A8B95;
  --rose-500:     #5F727D;   /* primary brand — slate blue-grey */
  --rose-600:     #4A5862;
  --rose-700:     #364048;

  --sage-50:      #F0EFE9;   /* warm beige tones */
  --sage-100:     #E3DDCE;
  --sage-300:     #B5A78C;
  --sage-500:     #8A7C62;

  --gold:         #C4A57B;   /* warm beige accent */
  --gold-soft:    #EAD9BD;

  /* Ink scale (warm dark, never pure black) */
  --ink-900:      #2A2018;
  --ink-700:      #4A3D2E;
  --ink-500:      #7A6B58;
  --ink-300:      #B5A892;
  --ink-200:      #D4C8B5;

  /* Lines */
  --line:         #ECE2D4;
  --line-2:       #D4C8B5;

  /* Shadows — soft, never harsh */
  --sh-xs:        0 1px 2px rgba(74, 61, 46, 0.04);
  --sh-sm:        0 4px 12px rgba(74, 61, 46, 0.06);
  --sh:           0 8px 24px rgba(74, 61, 46, 0.08);
  --sh-lg:        0 20px 50px -10px rgba(74, 61, 46, 0.14);
  --sh-rose:      0 12px 32px -8px rgba(95, 114, 125, 0.22);

  /* ── Typography ────────────────────────────────── */
  --font-ar:      'Thmanyah', system-ui, sans-serif;
  --font-en:      'Thmanyah', system-ui, sans-serif;
  --font-display: 'Thmanyah Display', 'Thmanyah', serif;

  /* Type scale */
  --fs-xs:    12px;
  --fs-sm:    13px;
  --fs-base:  15px;
  --fs-md:    17px;
  --fs-lg:    20px;
  --fs-xl:    26px;
  --fs-2xl:   34px;
  --fs-3xl:   46px;
  --fs-4xl:   64px;
  --fs-hero:  clamp(40px, 6vw, 88px);

  /* ── Spacing ────────────────────────────────── */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-7:  32px;
  --sp-8:  40px;
  --sp-9:  56px;
  --sp-10: 72px;
  --sp-11: 96px;
  --sp-12: 120px;

  /* ── Radius ────────────────────────────────── */
  --r-xs:  6px;
  --r-sm:  10px;
  --r-md:  14px;
  --r-lg:  20px;
  --r-xl:  28px;
  --r-2xl: 40px;
  --r-pill: 999px;

  /* ── Layout ────────────────────────────────── */
  --container: 1240px;
  --gutter:    24px;
  --side:      28px;

  /* ── Motion ────────────────────────────────── */
  --ease:      cubic-bezier(0.32, 0.72, 0, 1);
  --dur-fast:  180ms;
  --dur:       280ms;
  --dur-slow:  480ms;
}