/* IDOMYOU — design tokens (www).
   Source unique des tailles, espacements, rayons, ombres et couleurs.
   À charger AVANT toutes les autres feuilles de style. */

/* Poppins auto-hébergée (aucun appel à Google Fonts). */
@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/poppins-400-latin-ext.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}
@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/poppins-400-latin.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:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/poppins-500-latin-ext.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}
@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/poppins-500-latin.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:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/poppins-600-latin-ext.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}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/poppins-600-latin.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:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/poppins-700-latin-ext.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}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/poppins-700-latin.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}

:root {
  /* ---------- Couleurs ---------- */
  --color-brand: #04dbab;          /* vert de marque : boutons, accents */
  --color-brand-strong: #03c298;   /* survol du bouton principal */
  --color-brand-soft: #d7f0e5;     /* menthe pâle : fonds de bloc */
  --color-brand-tint: #effcf8;     /* voile vert : pastilles, encadrés */
  --color-ink: #00525e;            /* titres, texte d'interface, fonds sombres */
  --color-ink-hover: #003f49;      /* survol du bouton plein Bleu Canard */
  --color-ink-strong: #0d3b42;     /* texte long (articles, mentions) */
  --color-ink-muted: #4a676c;      /* texte secondaire */
  --color-surface: #ffffff;
  --color-surface-muted: #f2f4f4;  /* sections grises */
  --color-surface-dark: var(--color-ink);
  --color-border: #dfe7e8;
  --color-border-strong: #9db4b7;  /* contours de champs */
  --color-on-dark: #ffffff;
  --color-on-dark-muted: rgba(255, 255, 255, .82);
  --color-on-brand: var(--color-ink);
  --color-focus: rgba(4, 219, 171, .45);

  /* ---------- Typographie ---------- */
  --font-sans: Poppins, sans-serif;

  /* Échelle fluide, bornes à 390 px et 1440 px */
  --text-display: clamp(2.25rem, 1.693rem + 2.286vw, 3.75rem);   /* 36 → 60 */
  --text-h1: clamp(2rem, 1.629rem + 1.524vw, 3rem);              /* 32 → 48 */
  --text-h2: clamp(1.625rem, 1.393rem + .952vw, 2.25rem);        /* 26 → 36 */
  --text-h3: clamp(1.25rem, 1.157rem + .381vw, 1.5rem);          /* 20 → 24 */
  --text-body-lg: clamp(1.0625rem, 1.039rem + .095vw, 1.125rem); /* 17 → 18 */
  --text-body: 1rem;                                             /* 16 */
  --text-small: .875rem;                                         /* 14 */
  --text-caption: .75rem;                                        /* 12, mentions légales uniquement */
  --text-price: 3.5rem;                                         /* 56, chiffre des cartes tarif */

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  --leading-heading: 1.15;
  --leading-snug: 1.35;   /* h3, libellés sur deux lignes */
  --leading-body: 1.6;

  /* ---------- Espacements (grille 4 / 8) ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  --section-y: var(--space-8);        /* 64 mobile */
  --card-pad: var(--space-5);         /* 24 mobile */
  --card-pad-lg: var(--space-5);      /* 24 mobile */
  --stack-gap: var(--space-4);        /* titre → texte */
  --stack-gap-lg: var(--space-5);     /* texte → boutons */

  /* ---------- Conteneur ---------- */
  --container: 1200px;
  --gutter: 16px;

  /* ---------- Rayons ---------- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* ---------- Ombres ---------- */
  --shadow-1: 0 4px 16px rgba(0, 82, 94, .08);
  --shadow-2: 0 18px 48px rgba(0, 82, 94, .12);
  --shadow-cta: 0 6px 16px rgba(0, 82, 94, .25);

  /* ---------- Composants ---------- */
  --button-height: 48px;
  --button-pad-x: var(--space-5);
  --button-min-width: 160px;
  --button-radius: var(--radius-md);
  --cta-height: 52px;              /* bouton principal sur fond vert */
  --cta-pad-x: 28px;
  --pill-height: 32px;
  --icon-size: 20px;
  --icon-gap: var(--space-3);
  --tap-min: 44px;
}

@media (min-width: 768px) {
  :root {
    --gutter: 24px;
  }
}

@media (min-width: 992px) {
  :root {
    --section-y: var(--space-9);   /* 96 */
    --card-pad: var(--space-6);    /* 32 */
    --card-pad-lg: 40px;
  }
}

@media (min-width: 1200px) {
  :root {
    --gutter: 32px;
  }
}
