/* Système de design — palette calée sur la photo réelle du restaurant
   (bardage bois cèdre, toit et huisseries sombres, végétation, jardin).
   Toutes les valeurs de la charte vivent ici : modifier un ton se fait
   à un seul endroit. */

:root {
  /* Bois (bardage du chalet) — couleur dominante */
  --wood-900: #3d2712;
  --wood-700: #8b5a2e;
  --wood-600: #a9703e;
  --wood-500: #bc8148;
  --wood-400: #d2a06b;
  --wood-200: #edd9b8;
  --wood-100: #f6ecdc;

  /* Accent — bois brûlé/ambré, plus saturé, réservé aux CTA */
  --accent-600: #be5a1e;
  --accent-500: #d06b28;

  /* Feuillage (arbres et arbustes autour du chalet) */
  --leaf-900: #26331b;
  --leaf-700: #43592c;
  --leaf-500: #6f8f49;
  --leaf-300: #a8c182;
  --leaf-200: #dce6c9;

  /* Charbon (toit et huisseries sombres) */
  --charcoal-900: #221c16;
  --charcoal-600: #5c5142;

  /* Pierre (bacs à plantes en béton, neutres chauds) */
  --stone-50: #f3f1e6;
  --stone-100: #e9e4d2;
  --stone-300: #d6cfb9;

  /* Couleurs sémantiques */
  --color-bg: var(--stone-50);
  --color-surface: #fffefa;
  --color-surface-alt: var(--leaf-200);
  --color-text: var(--charcoal-900);
  --color-text-muted: var(--charcoal-600);
  --color-brand: var(--wood-600);
  --color-brand-dark: var(--leaf-900);
  --color-accent: var(--accent-600);
  --color-accent-soft: var(--wood-100);
  --color-border: var(--stone-300);
  --color-on-brand: #fffefa;

  /* Typographie */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Nunito Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-brand: "Fredericka the Great", "Fraunces", Georgia, serif;

  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1.0625rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 2rem;
  --text-3xl: 2.75rem;
  --text-4xl: 3.6rem;

  /* Échelle d'espacement */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;

  /* Formes */
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 32px;
  --radius-blob: 63% 37% 54% 46% / 43% 37% 63% 57%;

  --shadow-soft: 0 20px 45px -20px rgba(34, 28, 22, 0.4);
  --shadow-card: 0 10px 28px -12px rgba(34, 28, 22, 0.22);

  --container-width: 1120px;
  --ease-organic: cubic-bezier(0.22, 1, 0.36, 1);
}