/* ==========================================================
   MOUSTIQUE | Design tokens
   Sources : code de production de www.moustique.be (styles.css?d=831)
   relevé le 10 octobre 2026, maquettes Figma « Moustique UI - UX »
   (frames Moustique uniquement) et fichier Sketch (logo vectoriel).
   ========================================================== */

:root {
  /* ---------- Marque ---------- */
  --mq-rouge:          #E30613; /* couleur principale : logo, liens, signatures, box */
  --mq-jaune:          #FFED00; /* couleur secondaire : insecte du logo, theme-color, bandeau, abonnement */
  --mq-noir:           #000000; /* titres, texte, étiquettes de rubrique */
  --mq-blanc:          #FFFFFF;

  /* ---------- Nuances (site) ---------- */
  --mq-rouge-light:    #FF1010; /* « Notre sélection » */
  --mq-rouge-dark:     #C40511; /* survol */
  --mq-rouge-darker:   #92040D;
  --mq-rouge-vif:      #FA3542;
  --mq-jaune-dark:     #E0D000; /* badge « article offert », survol */
  --mq-jaune-light:    #FFF02D;

  /* ---------- Neutres ---------- */
  --mq-encre:          #111111;
  --mq-gris:           #666666; /* dates, métadonnées */
  --mq-gris-clair:     #B3B3B3;
  --mq-gris-mid:       #999999;
  --mq-gris-ligne:     #E3E0E0; /* séparateurs */
  --mq-surface:        #F2F2F2;
  --mq-gris-ui:        #E0E0E0;

  /* ---------- Rubriques (variables Arc --section-color-primary) ---------- */
  --mq-epoque:         #F50000; /* Notre époque : infos, enquêtes, explications, humour */
  --mq-culture:        #007FFF; /* Culture : musique, cinéma, livres */
  --mq-ecrans:         #FF7F00; /* Télévision, streaming */
  --mq-sortir:         #46C846; /* Sortir, tendances, food, bien-être, week-end */
  --mq-dossiers:       #FFED00; /* dossiers du moment (pastilles du menu) */

  /* ---------- Typographie ---------- */
  --mq-font-title: "Domine", Georgia, serif;                      /* 600 · 700 */
  --mq-font-base:  "Funnel Sans", Arial, "Trebuchet MS", sans-serif; /* 400 · 500 · 600 · 700 */

  /* ---------- Layout et formes ---------- */
  --mq-container-md: 992px;
  --mq-container-lg: 1120px;
  /* breakpoints : 480 / 768 / 992 / 1024 / 1200 px (min-width) */
  --mq-radius:        0.25rem;
  --mq-radius-pill:   9999px;  /* menu, bouton S'abonner */
  --mq-tag-strip:     5px;     /* liseré de couleur à gauche des étiquettes de rubrique */
  --mq-shadow-button: 0 1px 1px 0 rgba(0,0,0,.22), 0 3px 4px 0 hsla(0,0%,40%,.21);
}