/* Jetons de couleur et de typographie.
 *
 * Palette tirée du logo : bleu #29338f et violet #522973. Les deux passent
 * largement AA sur blanc, ils servent donc directement aux liens et aux
 * boutons. En mode sombre, ils sont éclaircis (le logo a sa propre version).
 *
 * Polices : Comfortaa (titres, l'arrondi du logo — déjà celle de l'ancien site)
 * et Montserrat (texte), toutes deux OFL 1.1, auto-hébergées.
 *
 * Vérifié par scripts/verifier-contrastes.py (WCAG AA), en clair et en sombre.
 */
@font-face {
  font-family: "Montserrat";
  src: url("/assets/fonts/montserrat-var.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Comfortaa";
  src: url("/assets/fonts/comfortaa-var.woff2") format("woff2");
  font-weight: 300 700;
  font-display: swap;
}

:root {
  --fond: #ffffff;
  --fond-doux: #f5f4fa;
  --fond-appuye: #ebe8f4;
  --encre: #22203a;
  --encre-douce: #4a4762;
  --encre-tenue: #5c5973;
  --accent: #29338f;
  --accent-appuye: #522973;
  --sur-accent: #ffffff;
  --bleu: #29338f;
  --violet: #522973;
  --focus: #29338f;
  --trait: #e3e0ee;
  --bordure-controle: #7d7994;
  --ombre: 0 1px 2px rgb(34 32 58 / 6%), 0 10px 28px rgb(41 51 143 / 8%);

  --police: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --police-titre: "Comfortaa", "Montserrat", system-ui, sans-serif;
  --rayon: 14px;
  --rayon-grand: 24px;
  --entete: 4.25rem;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fond: #14132a;
    --fond-doux: #1c1b37;
    --fond-appuye: #282647;
    --encre: #f1f0f8;
    --encre-douce: #cdcae0;
    --encre-tenue: #b3b0c9;
    --accent: #aab3ff;
    --accent-appuye: #d4b6f2;
    --sur-accent: #14132a;
    --bleu: #aab3ff;
    --violet: #d4b6f2;
    --focus: #aab3ff;
    --trait: #33305a;
    --bordure-controle: #8f8baa;
    --ombre: 0 1px 2px rgb(0 0 0 / 30%), 0 10px 28px rgb(0 0 0 / 35%);
    color-scheme: dark;
  }
}