/* ============================================================
   VERIDIS ENERGIE — Design Tokens
   Maison professionnelle. Artisanat + jeunesse. Refined.
   ============================================================ */

:root {
  /* ---- VERT BRAND (sapin profond, mûr) ---- */
  --green:           #0e6e3a;   /* vert sapin signature */
  --green-deep:      #053620;   /* vert très profond */
  --green-darker:    #021e10;   /* vert nuit */
  --green-accent:    #18a04a;   /* vert vif, utilisé avec parcimonie */
  --green-light:     #ecf4ee;   /* vert tilleul (fonds doux) */

  /* ---- ACCENT CUIVRE (touche artisanat) ---- */
  --copper:          #b5734a;   /* cuivre profond */
  --copper-soft:     #d4a07a;   /* cuivre clair */
  --copper-light:    #f4e8db;   /* fond cuivre pâle */

  /* ---- NEUTRES (écrins du contenu) ---- */
  --ink:             #0d100d;   /* presque noir */
  --ink-soft:        #2a3530;   /* gris très foncé pour texte */
  --ink-muted:       #6a7670;   /* gris moyen */
  --ink-faint:       #aab2ac;   /* gris clair */
  --line:            #e5e8e3;   /* lignes */
  --line-soft:       #f1f3ef;   /* lignes très claires */
  --cream:           #fafaf5;   /* crème (fond chaleureux) */
  --cream-deep:      #f4f3eb;   /* crème plus saturé */
  --bg:              #fbfbf8;   /* fond principal */
  --white:           #ffffff;

  /* ---- TYPOGRAPHIE (2 polices, droites) ---- */
  --font-display:    'Outfit', -apple-system, 'SF Pro Display', system-ui, sans-serif;
  --font-body:       'DM Sans', -apple-system, 'SF Pro Text', system-ui, sans-serif;

  /* Échelle resserrée (style éditorial, plus rien d'oversize) */
  --fs-xs:           0.75rem;     /* 12px */
  --fs-sm:           0.8125rem;   /* 13px */
  --fs-base:         0.9375rem;   /* 15px */
  --fs-md:           1rem;        /* 16px */
  --fs-lg:           1.0625rem;   /* 17px */
  --fs-xl:           1.1875rem;   /* 19px */
  --fs-2xl:          1.4375rem;   /* 23px */
  --fs-3xl:          clamp(1.625rem, 2.5vw, 2rem);     /* 26-32px */
  --fs-4xl:          clamp(2rem, 3.4vw, 2.625rem);     /* 32-42px */
  --fs-hero:         clamp(2.125rem, 3.8vw, 3.125rem); /* 34-50px max */

  /* Graisses */
  --fw-regular:      400;
  --fw-medium:       500;
  --fw-semi:         600;
  --fw-bold:         700;
  --fw-black:        800;

  /* Line heights */
  --lh-tight:        1.05;
  --lh-snug:         1.15;
  --lh-normal:       1.45;
  --lh-relaxed:      1.6;

  /* ---- ESPACEMENTS (généreux, respiration) ---- */
  --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:         5rem;
  --space-9:         7rem;
  --space-10:        10rem;

  /* ---- RAYONS (doux, discrets) ---- */
  --r-sm:            4px;
  --r-md:            8px;
  --r-lg:            14px;
  --r-xl:            20px;
  --r-2xl:           28px;
  --r-full:          9999px;

  /* ---- OMBRES (douces, presque invisibles) ---- */
  --shadow-xs:       0 1px 2px rgba(13, 16, 13, 0.04);
  --shadow-sm:       0 2px 8px rgba(13, 16, 13, 0.05);
  --shadow-md:       0 8px 24px rgba(13, 16, 13, 0.07);
  --shadow-lg:       0 16px 40px rgba(13, 16, 13, 0.1);

  /* ---- TRANSITIONS ---- */
  --ease-out:        cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:     cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast:   180ms;
  --duration-base:   320ms;
  --duration-slow:   600ms;

  /* ---- LAYOUT ---- */
  --container-sm:    640px;
  --container-md:    840px;
  --container-lg:    1140px;
  --container-xl:    1280px;
  --gutter:          clamp(1.25rem, 4vw, 2rem);

  /* ---- Z-INDEX ---- */
  --z-base:          1;
  --z-content:       10;
  --z-header:        100;
  --z-overlay:       500;
}