/* =====================================================================
   CHARTE GRAPHIQUE — ILÉMA
   ---------------------------------------------------------------------
   C'EST LE SEUL FICHIER À MODIFIER pour changer les couleurs, l'or,
   les polices et les 4 univers. Tout le reste du thème s'y réfère.
   ===================================================================== */

:root {

  /* ---------- Charte IMPACT COURS : noir / doré / beige ---------- */
  --noir:         #111111;   /* fond noir — sections contraste (hero sombre, arcade) */
  --encre:        #16130F;   /* texte principal (quasi-noir chaud) */
  --encre-douce:  #45403A;   /* textes secondaires */
  --papier:       #FBF7EF;   /* fond principal (crème très clair) */
  --papier-alt:   #EDE4D3;   /* BEIGE — blocs explicatifs / sections alternées */
  --ligne:        rgba(22, 19, 15, .14);  /* filets, séparateurs */

  /* ---------- Accent de marque : OR (doré, interactif) ---------- */
  --or:           #C4A052;   /* accent principal — boutons, éléments interactifs */
  --or-profond:   #9E7C34;   /* survols, contrastes */
  --or-clair:     #EBDCB8;   /* fonds très légers, halos */

  /* ---------- Sémantique ---------- */
  --focus:        #1F3A63;   /* anneau de focus clavier (accessibilité) */
  --succes:       #1C4A44;

  /* ---------- Typographie ---------- */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-corps:   "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-data:    "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;

  /* Échelle typographique (fluide) */
  --pas-hero:   clamp(2.4rem, 1.4rem + 4.4vw, 4.5rem);
  --pas-h2:     clamp(1.8rem, 1.2rem + 2.4vw, 2.8rem);
  --pas-h3:     clamp(1.25rem, 1rem + 1vw, 1.6rem);
  --pas-corps:  1.05rem;
  --pas-petit:  0.86rem;

  /* ---------- Rythme & formes ---------- */
  --rayon:      14px;        /* arrondi standard */
  --rayon-sm:   8px;
  --gouttiere:  clamp(1rem, 0.6rem + 2vw, 2rem);
  --largeur-max: 1200px;
  --ombre:      0 18px 50px -24px rgba(20, 17, 14, .35);
  --ombre-douce: 0 8px 24px -16px rgba(20, 17, 14, .30);
  --transition: 320ms cubic-bezier(.22, .61, .36, 1);
}

/* =====================================================================
   LES 4 UNIVERS VISUELS
   Chaque univers redéfinit --uni-* . On applique la classe sur un bloc
   (ex : <section class="u-droit">) ou elle est posée automatiquement
   sur les cartes persona selon leur univers.
   ===================================================================== */

/* Droit — cabinets, tribunaux, bibliothèque (bordeaux/cuir) */
.u-droit {
  --uni:        #6B2737;
  --uni-clair:  #F3E7E9;
  --uni-contraste: #FCEFF1;
}

/* Finance · Assurance · Économie · Banque (vert-pétrole, confiance) */
.u-finance {
  --uni:        #1C4A44;
  --uni-clair:  #E4EFEC;
  --uni-contraste: #EEF6F3;
}

/* Académique international — campus anglo-saxon (bleu encre) */
.u-academique {
  --uni:        #1F3A63;
  --uni-clair:  #E6ECF5;
  --uni-contraste: #EFF3FA;
}

/* Centre d'examen — tests de langue (ambre, concentration/chrono) */
.u-examen {
  --uni:        #A85D1B;
  --uni-clair:  #F6E9D9;
  --uni-contraste: #FBF1E5;
}

/* Valeur par défaut si aucun univers n'est posé : l'or de marque */
:root {
  --uni:        var(--or);
  --uni-clair:  var(--or-clair);
  --uni-contraste: #FBF5EA;
}