/* ============================================================
   variables.css — Design system Velours & Creme
   ============================================================ */

:root {
  /* ---- Couleurs principales ---- */
  --bordeaux:       #6B1A28;
  --bordeaux-deep:  #420F18;
  --bordeaux-light: #8A2A3A;
  --or:             #C8973A;
  --or-light:       #E5BE73;
  --or-deep:        #9F761F;
  --creme:          #F4EAD0;
  --creme-light:    #FAF5E9;
  --creme-deeper:   #EBDCB5;
  --texte:          #2C1A1E;
  --texte-doux:     #5A4248;
  --gris-doux:      #C9BFB0;

  /* ---- Couleurs fonctionnelles ---- */
  --rouge-erreur:   #C0392B;
  --vert-succes:    #4A6B3F;

  /* ---- Typographies ---- */
  --font-titre:     'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-corps:     'Lora', Georgia, 'Times New Roman', serif;
  --font-ui:        'Lora', Georgia, sans-serif;

  /* ---- Tailles de police (echelle musicale) ---- */
  --fs-xs:    0.85rem;   /* 13.6 px */
  --fs-sm:    0.95rem;   /* 15.2 px */
  --fs-base:  1.05rem;   /* 16.8 px */
  --fs-md:    1.2rem;    /* 19.2 px */
  --fs-lg:    1.5rem;    /* 24   px */
  --fs-xl:    2rem;      /* 32   px */
  --fs-2xl:   2.75rem;   /* 44   px */
  --fs-3xl:   4rem;      /* 64   px — hero */
  --fs-4xl:   5.5rem;    /* 88   px — hero desktop */

  /* ---- Espacements ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-8: 3rem;
  --space-10: 4rem;
  --space-12: 6rem;
  --space-16: 8rem;

  /* ---- Layout ---- */
  --max-width: 1240px;
  --max-width-text: 720px;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 18px;

  /* ---- Ombres ---- */
  --shadow-sm: 0 2px 6px rgba(66, 15, 24, 0.08);
  --shadow-md: 0 10px 30px rgba(66, 15, 24, 0.18);
  --shadow-lg: 0 30px 60px rgba(66, 15, 24, 0.32);

  /* ---- Transitions ---- */
  --t-fast:    180ms ease;
  --t-base:    320ms cubic-bezier(0.22, 1, 0.36, 1);
  --t-slow:    560ms cubic-bezier(0.22, 1, 0.36, 1);

  /* ---- Hauteur du header sticky (utilisee dans scroll-margin) ---- */
  --nav-height: 78px;
}

/* ============================================================
   Import Google Fonts (Playfair Display + Lora)
   ============================================================ */
/* charge dans le layout main.ejs via <link> pour eviter le @import */