/* ============================================================
   La Danseraie — Design tokens
   Valeurs relevées directement sur la maquette Figma.
   Ne code pas de couleur "en dur" ailleurs : utilise ces variables.
   ============================================================ */

/* --- Typographie auto-hébergée (pas de Google Fonts : RGPD) --- */
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url('../fonts/figtree-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-display: swap;
  font-weight: 300 900;
  src: url('../fonts/figtree-latin-ext-wght-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* ---------- Couleurs ---------- */
  --c-turquoise:      #048B9A;  /* titres de section, "La Danseraie", labels TOUS NIVEAUX */
  --c-bleu-profond:   #00526A;  /* boutons pleins, fond du pied de page */
  --c-logo:           #006784;  /* logo danseuse */
  --c-vert:           #34BF91;  /* survol des boutons + bordure des dates au repos */
  --c-cyan:           #1ED2E6;  /* survol des dates, cercle du portrait */

  --c-texte:          #14181B;
  --c-texte-doux:     #3D474D;
  --c-blanc:          #FFFFFF;

  /* Dégradés des bandeaux tarifs / témoignages */
  --grad-clair:       #DCF3FA;
  --grad-fonce:       #AFDADF;
  --bg-bandeau:       linear-gradient(105deg, var(--grad-fonce) 0%, var(--grad-clair) 55%, var(--grad-fonce) 100%);
  --bg-hero:          linear-gradient(160deg, #FFFFFF 0%, #E6F6FC 100%);

  /* ---------- Typographie ----------
     Tailles relevées sur la maquette (base 1440 px exportée en 2x).
     clamp() = valeur mini pour mobile, valeur fluide, valeur maquette. */
  --font: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --t-h1:        clamp(2.5rem,   1.25rem + 5vw,    4.125rem);  /* 66px — La Danseraie */
  --t-hero-nom:  clamp(1.6rem,   1rem + 1.7vw,     2.5625rem); /* 41px — Emmanuelle Gorda */
  --t-hero-lead: clamp(1.125rem, 0.75rem + 1.1vw,  1.75rem);   /* 28px — accroche */
  --t-h2:        clamp(1.75rem,  1.1rem + 2vw,     2.4375rem); /* 39px — titres de section */
  --t-h3:        clamp(1.25rem,  0.95rem + 1.1vw,  1.75rem);   /* 28px — sous-titres */
  --t-corps:     1rem;                                          /* 16px */
  --t-note:      0.875rem;                                      /* 14px — notes de tarifs */
  --t-label:     clamp(1rem,     0.85rem + 0.5vw,  1.3125rem); /* 21px — TOUS NIVEAUX, niveaux */
  --t-nav:       1.0625rem;                                     /* 17px */

  --lh-titre: 1.15;
  --lh-corps: 1.375;   /* 22px sur 16px, comme la maquette */
  --ls-label: 0.02em;   /* interlettrage ajusté sur la largeur mesurée des labels */

  /* ---------- Rythme & formes ---------- */
  --pad-section: clamp(3.5rem, 7vw, 6.5rem);
  --hauteur-entete: 121px;   /* bandeau dégradé de la maquette */
  --largeur-max: 1290px;   /* conteneur mesuré sur la maquette */
  --gouttiere:   clamp(1.25rem, 5.2vw, 75px);

  --r-bouton: 999px;   /* boutons et champs : pilule */
  --r-carte:  16px;    /* cartes témoignages */
  --r-cellule: 10px;   /* cellules des tableaux tarifs */
  --r-date:    8px;    /* pastilles de dates */

  --ombre-carte: 0 4px 24px rgba(0, 82, 106, 0.10);
  --transition:  180ms ease;
}

/* Respecte le réglage système "réduire les animations" */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}