/* ==========================================================================
   Optivalue.ai — point d'entrée du système de design
   --------------------------------------------------------------------------
   RÉÉCRIT le 27/07/2026, session « refonte du style global ».

   Les valeurs ne vivent plus ici. Ce fichier ne fait qu'assembler la source
   de vérité, qui est design-system/. Toute modification de token se fait dans
   design-system/tokens/, jamais dans une feuille de finition ni dans une page.

   Chargement des polices — trois familles au lieu de quatre :
     · Funnel Display — titrage, charte p.19-20
     · Inter          — labeur, charte p.19-20
     · IBM Plex Mono  — appareil de preuve, extension de charte (PP-1),
                        validée le 27/07/2026
   RETIRÉES : Figtree et DM Sans, déclarées comme substituts sanctionnés par
   la charte mais jamais rendues — deux requêtes de police pour rien.
   ========================================================================== */




/* Tokens — trois niveaux : primitif → sémantique → composant. */
@import "../../design-system/tokens/01-primitives.css";
@import "../../design-system/tokens/02-semantic.css";
@import "../../design-system/tokens/03-components.css";

/* Composants partagés. */
@import "../../design-system/components.css";

/* ⚠ ORDRE OBLIGATOIRE — corrigé le 10/09/2026
   Les @font-face sont placés APRÈS tous les @import, et non à la place de
   l'ancien @import Google. La règle CSS est stricte : un @import situé après
   une autre règle est purement IGNORÉ par le navigateur.

   En posant les @font-face en tête, j'avais désactivé les quatre @import qui
   suivaient — donc les trois feuilles de tokens ET components.css. Le site
   s'affichait sans aucun style. Aucun contrôle de syntaxe ne le voit : le
   fichier est parfaitement valide, c'est l'ORDRE qui est faux.

   Toute règle ajoutée à cette feuille doit rester sous les @import. */

/* ==========================================================================
   POLICES AUTO-HÉBERGÉES — 10/09/2026
   ==========================================================================
   L'@import vers fonts.googleapis.com est retiré. Deux raisons, dans l'ordre
   d'importance :

   1. JURIDIQUE. Chaque visiteur envoyait son adresse IP à Google. Le tribunal
      de Munich a jugé ce point en 2022, et le site ouvre une version allemande.
      Sur un site qui vend l'hébergement souverain, la contradiction se voyait.

   2. PERFORMANCE. Un @import est le pire endroit pour une police : le
      navigateur devait télécharger et lire CETTE feuille avant de découvrir
      qu'il lui fallait encore contacter Google, puis un second domaine pour
      les fichiers. Trois allers-retours avant le premier caractère.

   Les fichiers sont sous-ensemblés aux écritures réellement employées :
   latin de base et étendu, ponctuation générale, exposants, devises, flèches
   et opérateurs mathématiques. Vérifié caractère par caractère sur les 183
   pages — aucune écriture non latine n'y figure.

       Inter          854 Ko → 159 Ko
       IBM Plex Mono  263 Ko →  45 Ko  (deux graisses)
       Funnel Display  52 Ko →  19 Ko

   Funnel Display et Inter sont des polices VARIABLES : un seul fichier couvre
   toute la plage de graisses. La feuille en demandait douze au total et n'en
   rendait que huit ; la question ne se pose plus.
   ========================================================================== */

@font-face {
  font-family: 'Funnel Display';
  src: url('../fonts/funnel-display-var.woff2') format('woff2-variations'),
       url('../fonts/funnel-display-var.woff2') format('woff2');
  font-weight: 300 800;
  font-style: normal;
  /* `swap` : le texte s'affiche immédiatement dans la police de repli, puis
     bascule. Le contraire — `block` — laisse une page blanche jusqu'à trois
     secondes sur réseau lent. */
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter-var.woff2') format('woff2-variations'),
       url('../fonts/inter-var.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}


/* --------------------------------------------------------------------------
   Base — rend une page conforme à la marque sans dicter sa mise en page.
   -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--ov-bg);
  color: var(--ov-text);
  font-family: var(--ov-font-body);
  font-weight: var(--ov-body-regular);
  font-size: var(--ov-text-md);
  line-height: var(--ov-leading-normal);
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ov-font-display);
  font-weight: var(--ov-display-regular);
  letter-spacing: var(--ov-tracking-tight);
  line-height: var(--ov-leading-tight);
}

a { color: var(--ov-accent-deep); }
a:hover { color: var(--ov-text); }

img, svg, video { max-width: 100%; height: auto; }

summary::-webkit-details-marker { display: none; }