/* ==========================================================
   Design tokens : sable, terre cuite, bleu nuit
   ========================================================== */
:root {
  /* Couleurs de base */
  --sand-50:  #FAF5EC;
  --sand-100: #F3E9DA;
  --sand-200: #E6D3B8;
  --sand-300: #D6BD99;
  --clay-500: #B5532E;
  --clay-600: #9A4424;
  --clay-700: #7E3719;
  --night-900: #0C1729;
  --night-800: #12233D;
  --night-700: #1C3253;
  --brass-400: #D9AE5F;
  --brass-500: #C9973F;
  --ink:      #1E1A16;
  --earth:    #6B5A48;
  --wa-green: #1F7A4D;
  --wa-green-dark: #17603C;
  --danger:   #A12A1E;

  /* Rôles sémantiques */
  --bg:            var(--sand-100);
  --bg-alt:        var(--sand-50);
  --surface:       #FFFDF9;
  --text:          var(--ink);
  --text-muted:    var(--earth);
  --line:          rgba(30, 26, 22, 0.14);
  --accent:        var(--clay-500);
  --accent-hover:  var(--clay-600);
  --on-accent:     #FFFFFF;
  --dark:          var(--night-800);
  --on-dark:       var(--sand-50);
  --on-dark-muted: rgba(250, 245, 236, 0.74);
  --ornament:      var(--brass-500);
  --focus:         var(--clay-500);

  /* Typographie */
  --font-display: "Cormorant Garamond", "Times New Roman", serif;
  --font-body:    "Jost", "Segoe UI", system-ui, sans-serif;
  --display-weight: 500;
  --lh-body: 1.6;
  --tracking-eyebrow: 0.22em;

  --fs-xs:   0.8125rem;
  --fs-sm:   0.9375rem;
  --fs-base: 1.0625rem;
  --fs-lg:   1.25rem;
  --fs-xl:   clamp(1.5rem, 1.2rem + 1vw, 2rem);
  --fs-2xl:  clamp(2rem, 1.4rem + 2.4vw, 3.25rem);
  --fs-3xl:  clamp(2.75rem, 1.6rem + 4.6vw, 5.5rem);

  /* Espacements (densité aérée) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6rem;
  --section-y: clamp(4.5rem, 3rem + 6vw, 8.5rem);
  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2.5rem);
  --container: 1240px;

  /* Formes et ombres */
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-arch: 999px 999px 0 0;
  --shadow-soft: 0 1px 2px rgba(30, 26, 22, 0.05), 0 12px 32px -12px rgba(30, 26, 22, 0.18);
  --shadow-lift: 0 2px 4px rgba(30, 26, 22, 0.06), 0 24px 48px -16px rgba(30, 26, 22, 0.28);

  /* Mouvement */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 180ms;
  --dur-base: 280ms;
  --dur-slow: 450ms;
}

/* Arabe : Amiri pour les titres, IBM Plex Sans Arabic pour le texte */
html[lang="ar"] {
  --font-display: "Amiri", "Traditional Arabic", serif;
  --font-body:    "IBM Plex Sans Arabic", "Segoe UI", Tahoma, sans-serif;
  --display-weight: 700;
  --lh-body: 1.85;
  --tracking-eyebrow: 0;
  --fs-3xl: clamp(2.4rem, 1.5rem + 3.8vw, 4.6rem);
}
