/**
 * Design tokens + polices — thème enfancemusique
 * Police : Gotham (self-hébergée, reprise du thème PrestaShop de la prod).
 */

/* ⚠️ Les Gotham .woff ET .ttf sont défectueux SOUS WINDOWS (DirectWrite) : le « i »
   minuscule perd son point → « i » ≡ « l ». Seul l'OTF (contours CFF) est fiable
   (c'est ce que charge la prod). On base donc toute la famille "Gotham" sur l'OTF Book ;
   le gras est synthétisé par le navigateur à partir de cet OTF (donc « i » pointé lui aussi). */
@font-face { font-family:"Gotham"; font-style:normal; font-weight:400; font-display:swap;
  src:url("../fonts/Gotham-Book.otf?v=3") format("opentype"); }

:root {
  /* — Couleurs de marque — */
  --c-primary:      #0292db;   /* bleu Enfance et Musique (couleur principale) */
  --c-primary-dark: #0277b5;   /* bleu foncé (survol) */
  --c-primary-ink:  #0a6ea3;   /* bleu texte sur fond clair */
  --c-cyan:         #01caf0;   /* cyan : accent secondaire, à utiliser avec parcimonie */
  --c-ink:          #3c3c3c;   /* texte principal */
  --c-muted:        #6f7477;   /* texte secondaire */
  --c-line:         #e4e9ee;   /* filets / bordures */
  --c-bg:           #ffffff;
  --c-bg-soft:      #eef5fb;   /* fond doux teinté bleu */
  --c-bg-alt:       #f6f8f9;

  /* — Palette ludique (couleurs du logo) — */
  --c-yellow: #ffcf1a;
  --c-green:  #88c540;
  --c-red:    #f2504d;
  --c-blue:   #0292db;
  --c-purple: #8e6bb0;

  /* — Typographie — */
  --font-sans: "Gotham", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --fs-xs: .8125rem;
  --fs-sm: .9rem;
  --fs-base: 1rem;
  --fs-lg: 1.15rem;
  --fs-h3: 1.4rem;
  --fs-h2: clamp(1.5rem, 1.1rem + 1.6vw, 2rem);
  --fs-h1: clamp(1.9rem, 1.3rem + 2.6vw, 2.9rem);
  --lh: 1.6;
  --lh-tight: 1.2;

  /* — Rayons / ombres — */
  --radius-sm: 9px;
  --radius: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 3px rgba(20,50,62,.08);
  --shadow-md: 0 8px 24px rgba(20,50,62,.10);
  --shadow-lg: 0 18px 48px rgba(20,50,62,.14);

  /* — Layout — */
  --container: 1200px;
  --container-narrow: 760px;
  --gap: 1.5rem;
  --space: 1rem;

  --t: .2s ease;
}