/* =========================================================
   FLEUR SAUVAGE — Design tokens
   Variables globales : couleurs, typographie, espacements,
   ombres, rayons, transitions. Toute personnalisation visuelle
   du site doit passer par ce fichier.
   ========================================================= */

:root {
  /* --- Couleurs de marque --- */
  --color-forest-900: #14261c;
  --color-forest-700: #1f3d2c;
  --color-forest-600: #2b4d38;
  --color-moss-500: #4a6b52;
  --color-moss-400: #5f8168;
  --color-sage-300: #8fa693;
  --color-sage-200: #b7c8bc;
  --color-cream-100: #faf8f3;
  --color-cream-050: #fffdf8;
  --color-sand-200: #ede6d6;
  --color-sand-300: #ddd2b8;
  --color-honey-400: #e8c468;
  --color-honey-500: #d9ab3c;

  /* --- Couleurs fonctionnelles --- */
  --color-ink: #22291f;
  --color-ink-soft: #4b5548;
  --color-line: #e2ded1;
  --color-line-strong: #c9c2ab;
  --color-white: #ffffff;

  --color-danger-bg: #fbe9e7;
  --color-danger-border: #d98a7a;
  --color-danger-text: #8a3a2a;

  --color-info-bg: #eef3ea;
  --color-info-border: #a9c1ad;
  --color-info-text: #2b4d38;

  --color-protected-bg: #f3ecd9;
  --color-protected-border: #d9ab3c;
  --color-protected-text: #6b5017;

  /* --- Typographie --- */
  --font-display: "Playfair Display", "Georgia", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --fs-display-xl: clamp(2.4rem, 1.8rem + 2.6vw, 4rem);
  --fs-display-l: clamp(2rem, 1.6rem + 1.8vw, 3rem);
  --fs-display-m: clamp(1.6rem, 1.4rem + 1vw, 2.2rem);
  --fs-display-s: clamp(1.3rem, 1.2rem + 0.5vw, 1.6rem);
  --fs-lead: 1.25rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.9rem;
  --fs-micro: 0.78rem;

  --lh-tight: 1.15;
  --lh-heading: 1.3;
  --lh-body: 1.7;

  --content-max: 72ch;
  --wrap-max: 1240px;

  /* --- Espacements --- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1rem;
  --space-m: 1.5rem;
  --space-l: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 8rem;

  /* --- Rayons & ombres --- */
  --radius-s: 6px;
  --radius-m: 12px;
  --radius-l: 20px;
  --radius-pill: 999px;

  --shadow-s: 0 1px 3px rgba(20, 38, 28, 0.08);
  --shadow-m: 0 8px 24px rgba(20, 38, 28, 0.10);
  --shadow-l: 0 20px 48px rgba(20, 38, 28, 0.14);

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 150ms;
  --dur-base: 250ms;
  --dur-slow: 450ms;

  --header-h: 76px;
}
