/**
 * Bois de Faral — tokens de design bruts (refresh 2026-07)
 * Source : projet Claude Design 349e4d9e-8b2a-4b5b-8efe-4bffdeaecb95
 * (tokens/colors.css, tokens/typography.css, tokens/layout.css)
 *
 * ⚠️ Double source de vérité couleur : vert-olive / papier-chaud / ink / rouge-grange / ocre
 * existent À LA FOIS ici (rampe --green-*, --paper-*, --ink-*, --red-*, --ochre-*, consommée par
 * les primitives .bdf-*) ET comme slugs dans theme.json settings.color.palette (sélecteur
 * Gutenberg). Les deux valeurs sont identiques aujourd'hui — toute retouche de teinte doit
 * modifier les DEUX mécanismes ensemble, sinon le sélecteur de couleur Gutenberg et les
 * primitives .bdf-* divergent silencieusement.
 *
 * --font-display / --font-hand / --font-body référencent les presets theme.json
 * (gochi-hand, nunito) plutôt que de redéclarer les familles en dur, pour rester alignés
 * sans duplication.
 */
:root {
  /* ---------- Couleurs : rampe + alias sémantiques ---------- */
  --green-50:  #f4f6e8;
  --green-100: #e8ecc9;
  --green-200: #dbe1ac;
  --green-300: #c4c885; /* core brand green — leaf & wordmark, = slug theme.json vert-olive */
  --green-400: #aab063;
  --green-500: #8c934a; /* deeper foliage */
  --green-600: #6f7639;
  --green-700: #565c2d;
  --green-800: #3f4322;

  --ink-900: #322f2a; /* hand-drawn line colour, primary text, = slug theme.json ink */
  --ink-700: #4d4941;
  --ink-500: #726c60;
  --ink-300: #a8a193;
  --paper-0:  #ffffff;
  --paper-50: #fbf8f0; /* warm paper — default page surface, = slug theme.json papier-chaud */
  --paper-100:#f5f0e3;
  --paper-200:#ebe4d2;
  --paper-300:#ded4bd;

  --red-500:   #c03e0b; /* = slug theme.json rouge-grange */
  --red-600:   #9c3208;
  --ochre-400: #ebb844; /* = slug theme.json ocre */
  --ochre-500: #d89f28;
  --wood-500:  #8a5a22;
  --wood-400:  #b98a4b;

  --surface-page:    var(--paper-50);
  --surface-card:    var(--paper-0);
  --surface-sunk:    var(--paper-100);
  --surface-brand:   var(--green-300);
  --surface-brand-deep: var(--green-600);
  --surface-inverse: var(--ink-900);

  --text-body:    var(--ink-900);
  --text-muted:   var(--ink-500);
  --text-on-brand:var(--ink-900);
  --text-on-dark: var(--paper-50);
  --text-link:    var(--green-600);
  --text-link-hover: var(--green-700);

  --border-soft:  var(--paper-300);
  --border-ink:   var(--ink-900);

  /* Anneau de focus clavier (story 9.12) — source unique, consommée par primitives.css et
     hippocamp.css. Deux valeurs parce qu'aucune couleur unique ne tient les 3:1 de WCAG 1.4.11
     à la fois sur les surfaces crème et sur les fonds sombres du thème (--green-800 : green-700
     y tombe à 1,46:1). Toute retouche de teinte se fait ICI, pas dans les feuilles. */
  --focus-ring:         var(--green-700);
  --focus-ring-on-dark: var(--paper-50);

  --accent:        var(--green-500);
  --accent-warm:   var(--red-500);
  --accent-sun:    var(--ochre-400);

  --status-success: #6f7639;
  --status-warning: #d89f28;
  --status-danger:  #c03e0b;
  --status-info:    #6b8f8a;

  /* ---------- Typographie ---------- */
  --font-display: var(--wp--preset--font-family--gochi-hand);
  --font-hand:    var(--wp--preset--font-family--gochi-hand);
  --font-body:    var(--wp--preset--font-family--nunito);

  --text-2xs: 0.75rem; --text-xs: 0.8125rem; --text-sm: 0.9375rem;
  --text-md: 1.0625rem; /* base body */
  --text-lg: 1.25rem; --text-xl: 1.5rem; --text-2xl: 2rem;
  --text-3xl: 2.75rem; --text-4xl: 3.75rem; --text-5xl: 5rem; /* hero */

  --weight-normal: 400; --weight-medium: 500; --weight-semibold: 600;
  --weight-bold: 700; --weight-extrabold: 800;

  --leading-tight: 1.1; --leading-snug: 1.28; --leading-normal: 1.6; --leading-relaxed: 1.75;

  --tracking-tight: -0.01em; --tracking-normal: 0; --tracking-wide: 0.04em; --tracking-wider: 0.12em;

  /* ---------- Layout ---------- */
  --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: 4rem; --space-9: 6rem;

  --radius-sm: 8px; --radius-md: 14px; --radius-lg: 22px; --radius-xl: 32px;
  --radius-pill: 999px;
  --radius-blob: 42% 58% 60% 40% / 45% 45% 55% 55%;

  --border-w: 1.5px; --border-w-bold: 2.5px;

  --shadow-sm: 0 1px 2px rgba(50,47,42,0.08);
  --shadow-md: 0 4px 14px rgba(50,47,42,0.10);
  --shadow-lg: 0 12px 32px rgba(50,47,42,0.14);
  --shadow-brand: 0 8px 22px rgba(111,118,57,0.22);

  --ease-soft: cubic-bezier(0.33, 0.9, 0.42, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 140ms; --dur-base: 240ms; --dur-slow: 420ms;

  --container-max: 1180px; --container-narrow: 720px;
}
