/* --------------------------------------------------
   Design Tokens — variables.css
   --------------------------------------------------
   • Palette sombre (site noir & or rust)
   • Palette sable « boho » (section chaleureuse)
   • Stacks typographiques
   • Échelle d’espacements, rayons, z-index, timing
--------------------------------------------------*/

:root {
  /* PALETTE SOMBRE */
  --color-bg: #0e0e0e;
  --color-surface: #1a1a1a;
  --color-text: #eaeaea;
  --color-muted: #a1a1a1;
  --color-accent: #cc9763;
  --color-wood: #cc9763;
  /* doré rust */
  --color-accent-alt: #5b8d8c;
  /* teal désaturé */

  /* PALETTE SABLE / BOHO */
  --color-sand: #c9a78d;
  /* fond chaud section About */
  --color-sand-dark: #b8997f;
  /* variante plus sombre */
  --color-text-dark: #1a1a1a;
  /* texte sur fond sable */
  --color-line-light: #f0e9e4;
  /* crème pour les “scribbles” */

  /* TYPOGRAPHIE */
  --font-display: 'Mrs Saint Delafield', cursive;
  /*--font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;*/
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-base-size: 16px;
  --line-height-base: 1.6;

  /* ESPACEMENTS (échelle 8 px) */
  --space-xxs: 0.25rem;
  /* 4 px */
  --space-xs: 0.5rem;
  /* 8 px */
  --space-sm: 1rem;
  /* 16 px */
  --space-md: 1.5rem;
  /* 24 px */
  --space-lg: 2rem;
  /* 32 px */
  --space-xl: 3rem;
  /* 48 px */

  /* RAYONS */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;

  /* Z-INDEX */
  --z-dropdown: 800;
  --z-overlay: 900;
  --z-fixed: 1000;

  /* ANIMATIONS */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-medium: 300ms;
}

/* Pré-hook thème clair (si besoin un jour) */
:root[data-theme='light'] {
  --color-bg: #fafafa;
  --color-surface: #ffffff;
  --color-text: #1a1a1a;
  --color-muted: #666666;
}