/* ============================================================
   YCS · tokens.css
   Design tokens — CSS variables utilisées partout
   Charger AVANT base.css, components.css, et les CSS de section
   ============================================================ */

:root {
  /* --- Neutrals / cream ------------------------------------ */
  --cream: #F7F3EC;
  --cream-2: #EFE9DD;
  --paper: #FFFFFF;
  --ink: #1A1F1D;
  --ink-soft: #3D4743;
  --muted: #6B7670;
  --line: #E4DDD0;
  --line-2: #D8CFBD;

  /* --- Teal (couleur de marque principale) ------------------ */
  --teal-900: #033B36;
  --teal-800: #0A4A44;
  --teal-700: #0F5952;
  --teal-600: #15685F;
  --teal-500: #2A837A;
  --teal-100: #DBEAE6;
  --teal-50:  #EBF2F0;

  /* --- Couleurs d'accent ----------------------------------- */
  --terra: #BD5A3D;
  --terra-dark: #9A4630;
  --terra-soft: #F4DCCF;

  --mustard: #C4933A;
  --mustard-soft: #F2E4C3;

  --plum: #6B3A4F;
  --plum-soft: #E8D5DD;

  --sage: #7E9279;
  --sage-soft: #DDE5D8;

  --rose: #B85264;
  --rose-soft: #F5D8DE;

  --slate: #47545B;
  --slate-soft: #DAE1E4;

  /* --- Rayons de bordure ----------------------------------- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  /* --- Ombres ---------------------------------------------- */
  --shadow-sm: 0 1px 2px rgba(10,20,15,0.04), 0 1px 3px rgba(10,20,15,0.02);
  --shadow-md: 0 4px 16px rgba(10,20,15,0.06), 0 2px 6px rgba(10,20,15,0.04);
  --shadow-lg: 0 12px 40px rgba(10,20,15,0.10), 0 4px 12px rgba(10,20,15,0.06);

  /* --- Transitions ----------------------------------------- */
  --t-fast: 160ms;
  --t-med: 280ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}