/* =============================================================================
   MathVaud, feuille de charte globale, version 1.4 (lot 3, 09.10.2026)
   Charte B « Cahier » : CLAUDE.md § 7 et SiteWeb-refonte-2026-10/E_charte/E_direction-B.md

   CHARGEMENT : une seule ligne, dans les deux emplacements <head> du « Site custom code »
   (visiteur et connecté) :
     <link rel="stylesheet" href="https://<hébergement>/mv-charte-1.4.css">
   Elle est aussi chargée dans le lecteur de cours et dans les leçons construites avec l'éditeur
   de LearnWorlds ; le contenu des leçons interactives importées n'est pas atteint.

   PORTÉE : ce qui est propre à la charte est enfermé sous la classe racine .mv-charte. La section 12
   reprend, à l'identique, les styles des embeds actuels qui vivaient dans l'emplacement
   « <style> Dynamic » (contrôlé le 09.10.2026 sur la page servie : les 38 couples sélecteur et
   déclarations, hors focus, sont identiques), chacune limitée par
   :not(.mv-charte *) pour ne jamais toucher un embed de la charte. Dynamic ne garde que la règle de
   focus globale, qui atteint aussi les leçons.

   ORDRE DU COLLAGE (cadrage du lot 3, § 2, préalable 4) : ligne <link> de la 1.4 dans les deux <head>,
   contrôle en visiteur et en connecté, PUIS Dynamic réduit à sa règle de focus. Retour arrière :
   restaurer Dynamic d'abord, puis, la 1.4 encore en place, remettre les anciens embeds et l'ancien
   code de la FAQ, et seulement ensuite la ligne de la 1.3 (la 1.3 ne connaît pas les composants
   du lot 3).

   NAVIGATEURS : ceux de 2021 et après (Chrome 88, Firefox 84, Safari 14.1). Toute la charte repose
   sur les propriétés personnalisées (var(), Safari 9.1 et plus) ; :not() avec un sélecteur complexe
   demande Chrome 88, Firefox 84, Safari 9. Un navigateur plus ancien ignore les règles de la
   section 12 (boutons des anciens embeds moins contrastés). :where() n'est pas utilisé.
   Sans :focus-visible (Safari 14.1 et 15.x), un anneau sur :focus prend le relais (section 7 bis).

   CONTRAT DES EMBEDS DE LA CHARTE (CLAUDE.md § 7) : n'utiliser que les classes de cette feuille,
   sans <style> local ; en zone sombre (.mv-sombre), seuls le texte, les titres, les liens, les
   annotations et les boutons ont une variante.

   v1.4 : composants du lot 3 (section 7 bis) ; barre du haut des visiteurs dès 991 px, prévue pour
   7 entrées avec « Blog » (section 10) ; menu téléphone, neutralisation d'une règle du thème
   (section 11) ; compatibilité des embeds actuels (section 12, reprise de Dynamic). « 0 Pages » et
   « 0:00 » ne sont pas traités ici (décision de Marc du 09.10.2026 : réglage de chaque section
   « Course contents »).
   v1.3 : section 4 ter (contrastes d'interface du chrome natif).
   v1.2 : section 4 bis (liens du thème hors charte).
   v1.1 : modificateurs de boutons effectifs, focus sombre, liens soulignés en zone sombre.

   VERSIONS : nom versionné. Toute modification = nouveau fichier et changement de la ligne <link>
   dans les deux <head>. Retour arrière : remettre l'ancienne ligne.

   Tailles en px : la racine du thème est à 10 px et les sections mettent font-size:0.
   ========================================================================== */

/* 1. Polices. COPIE DE LA MASTERCLASS CALCULATRICE (3 novembre 2026, lot 1, cadrage § 4.1) : sur le site, elles
   viennent du proxy de polices de mathvaud.ch par un @import ; ici, l'@import est remplacé par des @font-face qui
   pointent vers les fichiers servis par calculatrice.mathvaud.ch. Ce sont les fichiers mêmes que ce proxy sert
   (Source Sans Pro 2.045 et Source Serif Pro 3.001, licence OFL jointe), en 400, 400 italique, 600 et 700, pour les
   trois sous-ensembles que la v3 demandait vraiment : latin, latin-ext et grec (π, Σ). Les blocs sont ceux du proxy,
   seule l'adresse change ; `fabrique.py` y écrit le nom empreinté. Une seule autre différence : une règle du site,
   inutilisée ici, est retirée (section « Badge de niveau »). Le reste de la feuille est la 1.4 telle quelle :
   une évolution de la charte du site ne s'y reporte pas d'elle-même.
   Ce sont les familles réglées dans le thème (le thème ne propose pas Source Serif 4 ni
   Source Sans 3). Source Sans Pro n'a pas de graisse 500. */
/* greek */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("source-sans-pro-greek-400-italic.ae28ebb8.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("source-sans-pro-latin-ext-400-italic.bc177e6a.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("source-sans-pro-latin-400-italic.4caf5e66.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("source-sans-pro-greek-400-normal.e19ebf91.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("source-sans-pro-latin-ext-400-normal.6bcddc1c.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("source-sans-pro-latin-400-normal.fb7b366b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("source-sans-pro-greek-600-normal.50ce7ec7.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("source-sans-pro-latin-ext-600-normal.14bb0735.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("source-sans-pro-latin-600-normal.a2fe8240.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("source-sans-pro-greek-700-normal.e1a5d300.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("source-sans-pro-latin-ext-700-normal.3fbcbab6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("source-sans-pro-latin-700-normal.45c6a514.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("source-serif-pro-greek-400-italic.b5a52096.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("source-serif-pro-latin-ext-400-italic.0aed55ae.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("source-serif-pro-latin-400-italic.3ad6dfdc.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("source-serif-pro-greek-400-normal.56f326c5.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("source-serif-pro-latin-ext-400-normal.762cebd2.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("source-serif-pro-latin-400-normal.69c961b3.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("source-serif-pro-greek-600-normal.ee630501.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("source-serif-pro-latin-ext-600-normal.f06e0b80.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("source-serif-pro-latin-600-normal.6ab6c92f.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* greek */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("source-serif-pro-greek-700-normal.02b61fba.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* latin-ext */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("source-serif-pro-latin-ext-700-normal.61314e0d.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Source Serif Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("source-serif-pro-latin-700-normal.b26634b4.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* 2. Jetons ------------------------------------------------------------------ */
:root {
  /* Encre et papier */
  --mv-encre: #102A43;
  --mv-encre-2: #3E5368;
  --mv-encre-3: #56677A;
  --mv-nuit: #0C4A6E;
  --mv-papier: #FBFAF6;
  --mv-feuille: #FFFFFF;
  --mv-papier-2: #F3F0E7;
  --mv-filet: #E2DED3;
  --mv-filet-champ: #7F8A96;
  --mv-quadrillage: rgba(12, 74, 110, 0.08);

  /* Une seule couleur d'action */
  --mv-action: #0369A1;
  --mv-action-survol: #075985;
  --mv-sur-action: #FFFFFF;

  /* Les gestes de correction */
  --mv-surligneur: #FFE45E;
  --mv-surligneur-doux: #FFF4B8;
  --mv-correction: #B42318;
  --mv-correction-doux: #FDECEA;
  --mv-verif: #1A7346;
  --mv-verif-doux: #E7F3EC;

  /* Pied et focus */
  --mv-pied-fond: #102A43;
  --mv-pied-texte: #D5DEE7;
  --mv-pied-texte-2: #A9B8C6;
  --mv-focus: #102A43;
  --mv-focus-sombre: #FFE45E;

  /* Catégories du blog */
  --mv-cat-examens: #0C4A6E;    --mv-cat-examens-teinte: #E6EEF4;
  --mv-cat-comprendre: #276749; --mv-cat-comprendre-teinte: #E7F1EA;
  --mv-cat-methode: #9C4A0F;    --mv-cat-methode-teinte: #F6EADF;
  --mv-cat-systeme: #5B3A8E;    --mv-cat-systeme-teinte: #EEE8F6;
  --mv-cat-parents: #1D6461;    --mv-cat-parents-teinte: #E3F0EF;

  /* Tuiles de la famille (icônes seulement) */
  --mv-tuile-mathvaud: #0C4A6E;
  --mv-tuile-douze: #12615A;
  --mv-tuile-quatre: #0369A1;

  /* Polices */
  --mv-police-titre: "Source Serif Pro", "Source Serif 4", Georgia, "Times New Roman", serif;
  --mv-police-texte: "Source Sans Pro", "Source Sans 3", "Helvetica Neue", Arial, sans-serif;

  /* Échelle typographique, bureau */
  --mv-t-heros: 56px;      --mv-i-heros: 1.08;
  --mv-t-h1: 44px;         --mv-i-h1: 1.12;
  --mv-t-h2: 36px;         --mv-i-h2: 1.18;
  --mv-t-h3: 26px;         --mv-i-h3: 1.25;
  --mv-t-h4: 21px;         --mv-i-h4: 1.3;
  --mv-t-chapeau: 21px;    --mv-i-chapeau: 1.5;
  --mv-t-corps: 18px;      --mv-i-corps: 1.6;
  --mv-t-petit: 15px;      --mv-i-petit: 1.5;
  --mv-t-surtitre: 14px;
  --mv-t-annotation: 20px;
  --mv-t-prix: 46px;
  --mv-t-bouton: 17px;

  /* Espacements, grille de 4 */
  --mv-e-1: 4px;  --mv-e-2: 8px;  --mv-e-3: 12px; --mv-e-4: 16px; --mv-e-5: 24px;
  --mv-e-6: 32px; --mv-e-7: 48px; --mv-e-8: 64px; --mv-e-9: 96px;
  --mv-largeur: 1200px;
  --mv-colonne-texte: 680px;
  --mv-gouttiere: 24px;

  /* Rayons */
  --mv-r-1: 4px;
  --mv-r-2: 6px;
  --mv-r-3: 8px;

  /* Ombres */
  --mv-ombre-feuille: 0 1px 2px rgba(16, 42, 67, 0.06), 0 6px 18px -8px rgba(16, 42, 67, 0.18);
  --mv-ombre-posee: 0 2px 4px rgba(16, 42, 67, 0.06), 0 18px 40px -16px rgba(16, 42, 67, 0.28);

  /* Motifs */
  --mv-motif-quadrillage: linear-gradient(var(--mv-quadrillage) 1px, transparent 1px),
                          linear-gradient(90deg, var(--mv-quadrillage) 1px, transparent 1px);
  --mv-motif-quadrillage-pas: 20px 20px;
  --mv-motif-surligne: linear-gradient(transparent 58%, var(--mv-surligneur) 58%,
                                       var(--mv-surligneur) 92%, transparent 92%);
}

@media (max-width: 640px) {
  :root {
    --mv-t-heros: 34px; --mv-t-h1: 32px; --mv-t-h2: 28px; --mv-t-h3: 22px; --mv-t-h4: 19px;
    --mv-t-chapeau: 18px; --mv-t-corps: 17px; --mv-t-petit: 15px; --mv-t-surtitre: 14px;
    --mv-t-annotation: 18px; --mv-t-prix: 40px; --mv-t-bouton: 17px;
    --mv-gouttiere: 16px; --mv-e-9: 64px;
  }
}

/* 3. Socle de tout embed de la charte : <div class="mv-charte"> --------------- */
.mv-charte {
  font-family: var(--mv-police-texte);
  font-size: var(--mv-t-corps);
  line-height: var(--mv-i-corps);
  font-weight: 400;
  color: var(--mv-encre);
  text-align: left;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.mv-charte *, .mv-charte *::before, .mv-charte *::after { box-sizing: border-box; }
/* contre le font-size:0 que le thème pose autour des embeds */
.mv-charte p, .mv-charte li, .mv-charte td, .mv-charte th, .mv-charte dd, .mv-charte dt,
.mv-charte blockquote, .mv-charte figcaption, .mv-charte label { font-size: inherit; }
.mv-charte p { margin: 0 0 var(--mv-e-4); }
.mv-charte ul, .mv-charte ol { margin: 0 0 var(--mv-e-4); padding-left: 1.3em; }
.mv-charte li { margin: 0 0 var(--mv-e-2); }
.mv-charte strong, .mv-charte b { font-weight: 700; }
.mv-charte img, .mv-charte svg { max-width: 100%; height: auto; }

.mv-charte h1, .mv-charte h2, .mv-charte h3, .mv-charte h4 {
  font-family: var(--mv-police-titre);
  font-weight: 600;
  color: var(--mv-encre);
  letter-spacing: -0.01em;
  margin: 0 0 var(--mv-e-4);
  text-align: left;
  text-transform: none;
}
.mv-charte h1 { font-size: var(--mv-t-h1); line-height: var(--mv-i-h1); }
.mv-charte h2 { font-size: var(--mv-t-h2); line-height: var(--mv-i-h2); }
.mv-charte h3 { font-size: var(--mv-t-h3); line-height: var(--mv-i-h3); }
.mv-charte h4 { font-size: var(--mv-t-h4); line-height: var(--mv-i-h4); }
.mv-charte .mv-heros { font-size: var(--mv-t-heros); line-height: var(--mv-i-heros); letter-spacing: -0.015em; }
.mv-charte .mv-chapeau { font-size: var(--mv-t-chapeau); line-height: var(--mv-i-chapeau); color: var(--mv-encre-2); }
.mv-charte .mv-petit { font-size: var(--mv-t-petit); line-height: var(--mv-i-petit); }
.mv-charte .mv-legende { font-size: var(--mv-t-surtitre); line-height: 1.45; color: var(--mv-encre-3); }
.mv-charte .mv-surtitre {
  display: block;
  font-size: var(--mv-t-surtitre); font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--mv-encre-3); margin: 0 0 var(--mv-e-2);
}

/* Mise en page */
.mv-charte .mv-conteneur { max-width: var(--mv-largeur); margin: 0 auto; padding: 0 var(--mv-gouttiere); }
.mv-charte .mv-colonne-texte { max-width: var(--mv-colonne-texte); }
.mv-charte .mv-section { padding: var(--mv-e-8) 0; }
.mv-charte .mv-section--papier-2 { background: var(--mv-papier-2); }
.mv-charte .mv-grille { display: grid; gap: var(--mv-e-5); grid-template-columns: repeat(var(--mv-colonnes, 3), minmax(0, 1fr)); }
.mv-charte .mv-grille--2 { --mv-colonnes: 2; }
.mv-charte .mv-grille--4 { --mv-colonnes: 4; }
@media (max-width: 900px) { .mv-charte .mv-grille, .mv-charte .mv-grille--4 { --mv-colonnes: 2; } }
@media (max-width: 640px) {
  .mv-charte .mv-grille, .mv-charte .mv-grille--2, .mv-charte .mv-grille--4 { --mv-colonnes: 1; }
  .mv-charte .mv-section { padding: var(--mv-e-7) 0; }
}

/* 4. Liens : neutralise la règle du thème (#pageContainer a:not(...) { color:#0064D1 }) -- */
#pageContainer .mv-charte a:not(.mv-btn),
.mv-charte a:not(.mv-btn) {
  color: var(--mv-action) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
#pageContainer .mv-charte a:not(.mv-btn):hover,
.mv-charte a:not(.mv-btn):hover {
  color: var(--mv-encre) !important;
  background: var(--mv-surligneur-doux);
}
/* Zone sombre : liens blancs, toujours soulignés (un lien dans un paragraphe doit se distinguer
   du texte autrement que par la couleur ; décision de Marc du 08.10.2026). Survol : trait épaissi. */
#pageContainer .mv-charte .mv-sombre a:not(.mv-btn),
.mv-charte .mv-sombre a:not(.mv-btn) {
  color: #FFFFFF !important; text-decoration: underline !important;
  text-decoration-thickness: 1px; text-underline-offset: 3px; background: transparent;
}
#pageContainer .mv-charte .mv-sombre a:not(.mv-btn):hover,
.mv-charte .mv-sombre a:not(.mv-btn):hover {
  color: #FFFFFF !important; text-decoration: underline !important;
  text-decoration-thickness: 2px; background: transparent;
}

/* 4 bis. Liens du thème hors charte (v1.2, contrôle en ligne du 08.10.2026) --------------
   Même sélecteur que la règle de liens écrite par le thème jusqu'au 08.10 (spécificité 2,1,1),
   pour passer devant « .lw-page #pageContainer .learnworlds-section:not(.lw-topbar) a:not(...)
   { color:inherit } » de pages.css (1,4,1). Sans !important : les règles de la charte (section 4)
   et les correctifs de boutons de l'emplacement Dynamic, en !important, restent prioritaires. */
#pageContainer a:not(.card-link, #pageContainer .lw-topbar-option-link, #pageContainer .lw-sidebar-option-link, #pageContainer .learnworlds-button, #pageContainer .mobile-nav-menu-link, #pageContainer .lw-event-card, #pageContainer .social-incontext, #pageContainer .msg-content-name-link, #pageContainer .teal-60, #pageContainer .grey2, #pageContainer .lw-blog-card-txt, #pageContainer .fc-event) {
  color: #0369A1;
}

/* 4 ter. Chrome natif : deux contrastes d'interface (v1.3, contrôle en ligne du 08.10.2026) ------
   Seuil : 3:1 pour le contour d'un composant d'interface (WCAG 1.4.11).
   a) Champs des formulaires natifs : fenêtres d'inscription (.loginForm2), de connexion
      (.js-signin-input) et de mot de passe (#passwordResetInitForm, #passwordResetForm), formulaire
      d'achat des pages produit (.js-payment-component). Le thème leur donne un fond Light #F3F0E7
      et une bordure de la même couleur : 1,14:1 contre la fenêtre, 1,09:1 contre le papier.
      Bordure au jeton --mv-filet-champ #7F8A96 : 3,51:1 contre la fenêtre (blanc mesuré au pixel),
      3,36:1 contre le papier #FBFAF6, 3,08:1 contre le fond du champ. Le focus garde l'anneau de
      « <style> Dynamic » (3 px #1D4ED8). Envoi d'un formulaire vide (08.10) : LearnWorlds ne colore
      pas la bordure en erreur, la règle ne masque donc rien. Remplissage automatique et champ
      désactivé : non vérifiés.
   b) Icône du menu téléphone (trois barres) : #B4B4B4 sur papier #FBFAF6, 1,99:1. Barres encre
      #102A43, 14,02:1. La troisième barre est une ombre de ::before ; à l'ouverture, LearnWorlds met
      .hamburger-open sur un parent et efface l'ombre pour dessiner la croix : la dernière règle
      rétablit explicitement cet effacement, à une spécificité supérieure (review du 08.10). */
.loginForm2 input.learnworlds-input-solid-light,
input.js-signin-input.learnworlds-input-solid-light,
#passwordResetInitForm input.learnworlds-input-solid-light,
#passwordResetForm input.learnworlds-input-solid-light,
.js-payment-component input.learnworlds-input-solid-light {
  border-color: var(--mv-filet-champ);
}
.lw-topbar .lw-topbar-hamburger-button:not([class*="ham-light"]):not([class*="ham-narrow"])::before,
.lw-topbar .lw-topbar-hamburger-button:not([class*="ham-light"]):not([class*="ham-narrow"])::after {
  background-color: var(--mv-encre);
}
.lw-topbar .lw-topbar-hamburger-button:not([class*="ham-light"]):not([class*="ham-narrow"])::before {
  box-shadow: 0 20px 0 0 var(--mv-encre);
}
.lw-topbar .hamburger-open .lw-topbar-hamburger-button:not([class*="ham-light"]):not([class*="ham-narrow"])::before {
  box-shadow: 0 0 0 0 transparent;
}

/* 5. Boutons ------------------------------------------------------------------ */
.mv-charte button, .mv-charte input, .mv-charte select, .mv-charte textarea {
  font-family: inherit; font-size: inherit; line-height: inherit; color: inherit;
}
#pageContainer .mv-charte .mv-btn, .mv-charte .mv-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--mv-e-2);
  min-height: 48px; padding: 14px 22px; border-radius: var(--mv-r-2);
  font-family: var(--mv-police-texte); font-size: var(--mv-t-bouton); font-weight: 600;
  line-height: 1.2; white-space: nowrap; cursor: pointer;
  text-decoration: none !important; background-image: none;
  -webkit-appearance: none; appearance: none;
}
#pageContainer .mv-charte .mv-btn--principal, .mv-charte .mv-btn--principal,
#pageContainer .mv-charte .mv-btn--principal:visited, .mv-charte .mv-btn--principal:visited {
  background-color: var(--mv-action) !important; color: var(--mv-sur-action) !important; border: 0 !important;
}
#pageContainer .mv-charte .mv-btn--principal:hover, .mv-charte .mv-btn--principal:hover {
  background-color: var(--mv-action-survol) !important; color: var(--mv-sur-action) !important;
}
#pageContainer .mv-charte .mv-btn--secondaire, .mv-charte .mv-btn--secondaire,
#pageContainer .mv-charte .mv-btn--secondaire:visited, .mv-charte .mv-btn--secondaire:visited {
  background-color: transparent !important; color: var(--mv-encre) !important; border: 1.5px solid var(--mv-encre) !important;
}
#pageContainer .mv-charte .mv-btn--secondaire:hover, .mv-charte .mv-btn--secondaire:hover {
  background-color: var(--mv-surligneur-doux) !important; color: var(--mv-encre) !important;
}
#pageContainer .mv-charte .mv-sombre .mv-btn--secondaire, .mv-charte .mv-sombre .mv-btn--secondaire,
#pageContainer .mv-charte .mv-sombre .mv-btn--secondaire:visited, .mv-charte .mv-sombre .mv-btn--secondaire:visited {
  color: #FFFFFF !important; border-color: var(--mv-pied-texte) !important;
}
#pageContainer .mv-charte .mv-sombre .mv-btn--secondaire:hover, .mv-charte .mv-sombre .mv-btn--secondaire:hover {
  background-color: var(--mv-surligneur-doux) !important; color: var(--mv-encre) !important;
}
/* Modificateurs : même spécificité que la règle de base, placés après elle */
#pageContainer .mv-charte .mv-btn--heros, .mv-charte .mv-btn--heros { min-height: 52px; font-size: 18px; padding: 15px 26px; }
@media (max-width: 640px) {
  #pageContainer .mv-charte .mv-btn--pleine, .mv-charte .mv-btn--pleine { width: 100%; white-space: normal; }
}

/* 6. Focus visible ----------------------------------------------------------- */
.mv-charte a:focus-visible, .mv-charte button:focus-visible, .mv-charte [role="button"]:focus-visible,
.mv-charte input:focus-visible, .mv-charte select:focus-visible, .mv-charte textarea:focus-visible,
.mv-charte summary:focus-visible {
  outline: 3px solid var(--mv-focus) !important; outline-offset: 2px !important;
}
.mv-charte .mv-sombre a:focus-visible, .mv-charte .mv-sombre button:focus-visible,
.mv-charte .mv-sombre [role="button"]:focus-visible, .mv-charte .mv-sombre input:focus-visible,
.mv-charte .mv-sombre select:focus-visible, .mv-charte .mv-sombre textarea:focus-visible,
.mv-charte .mv-sombre summary:focus-visible {
  outline-color: var(--mv-focus-sombre) !important;
}

/* 7. Composants -------------------------------------------------------------- */

/* Carte « feuille » */
.mv-charte .mv-feuille {
  background: var(--mv-feuille); border: 1px solid var(--mv-filet); border-radius: var(--mv-r-2);
  box-shadow: var(--mv-ombre-feuille); padding: 32px 36px;
}
.mv-charte .mv-feuille > :last-child { margin-bottom: 0; }
@media (max-width: 640px) { .mv-charte .mv-feuille { padding: 20px; } }

/* Encadrés : piège, astuce, vérification */
.mv-charte .mv-encadre {
  border-left: 4px solid var(--mv-encre); border-radius: 0 var(--mv-r-2) var(--mv-r-2) 0;
  padding: var(--mv-e-4) var(--mv-e-5); margin: 0 0 var(--mv-e-5); color: var(--mv-encre);
}
.mv-charte .mv-encadre > :last-child { margin-bottom: 0; }
.mv-charte .mv-encadre__titre {
  display: flex; align-items: center; gap: var(--mv-e-2);
  font-size: var(--mv-t-surtitre); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  margin: 0 0 var(--mv-e-2);
}
.mv-charte .mv-encadre__titre svg { width: 20px; height: 20px; flex: none; }
.mv-charte .mv-encadre--piege { background: var(--mv-correction-doux); border-left-color: var(--mv-correction); }
.mv-charte .mv-encadre--piege .mv-encadre__titre { color: var(--mv-correction); }
.mv-charte .mv-encadre--astuce { background: var(--mv-surligneur-doux); border-left-color: var(--mv-encre); }
.mv-charte .mv-encadre--astuce .mv-encadre__titre { color: var(--mv-encre); }
.mv-charte .mv-encadre--verif { background: var(--mv-verif-doux); border-left-color: var(--mv-verif); }
.mv-charte .mv-encadre--verif .mv-encadre__titre { color: var(--mv-verif); }

/* Badge de niveau. La copie de la masterclass retire ici la règle d'un second badge du site, qu'aucun écran de l'app
   n'emploie et dont le nom est un mot que l'app ne dit jamais (cadrage § 3). */
.mv-charte .mv-niveau {
  display: inline-flex; align-items: baseline; gap: 6px;
  background: var(--mv-feuille); border: 1.5px solid var(--mv-encre); border-radius: var(--mv-r-1);
  padding: 4px 10px; color: var(--mv-encre); line-height: 1.2;
}
.mv-charte .mv-niveau__annee { font-family: var(--mv-police-titre); font-weight: 700; font-size: 19px; }
.mv-charte .mv-niveau__complement { font-size: 14px; }

/* Liste à coches (inclus, garanties) */
.mv-charte .mv-coches { list-style: none; padding: 0; margin: 0 0 var(--mv-e-4); }
.mv-charte .mv-coches li { position: relative; padding-left: 30px; }
.mv-charte .mv-coches li::before {
  content: ""; position: absolute; left: 2px; top: 0.35em; width: 16px; height: 9px;
  border-left: 3px solid var(--mv-verif); border-bottom: 3px solid var(--mv-verif);
  transform: rotate(-45deg); transform-origin: 50% 50%;
}

/* Carte de prix */
.mv-charte .mv-prix { display: flex; flex-direction: column; gap: var(--mv-e-3); }
.mv-charte .mv-prix--avant { border: 1.5px solid var(--mv-encre); }
.mv-charte .mv-prix__montant {
  font-family: var(--mv-police-titre); font-weight: 700; font-size: var(--mv-t-prix); line-height: 1;
  font-variant-numeric: tabular-nums; color: var(--mv-encre);
}
.mv-charte .mv-prix__devise { font-family: var(--mv-police-texte); font-size: 18px; font-weight: 600; margin-left: 6px; }
.mv-charte .mv-prix__conditions { font-size: var(--mv-t-petit); color: var(--mv-encre-2); }

/* Carte d'article */
.mv-charte .mv-article { background: var(--mv-feuille); border: 1px solid var(--mv-filet); border-radius: var(--mv-r-2); overflow: hidden; }
.mv-charte .mv-article__cover { position: relative; aspect-ratio: 16 / 9; background: var(--mv-papier-2); }
.mv-charte .mv-article__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mv-charte .mv-article__categorie {
  position: absolute; left: 0; top: 0; color: #FFFFFF; background: var(--mv-cat-examens);
  font-size: 14px; font-weight: 700; padding: 4px 10px; border-radius: 0 0 var(--mv-r-1) 0;
}
.mv-charte .mv-article__corps { padding: var(--mv-e-5); }
.mv-charte .mv-article__titre { font-family: var(--mv-police-titre); font-weight: 600; font-size: 21px; line-height: 1.3; margin: 0 0 var(--mv-e-2); }
.mv-charte .mv-article__chapeau { font-size: 16px; color: var(--mv-encre-2); margin: 0 0 var(--mv-e-3); }
.mv-charte .mv-article__signature { font-size: 14px; color: var(--mv-encre-3); }
.mv-charte .mv-cat--comprendre { background: var(--mv-cat-comprendre); }
.mv-charte .mv-cat--methode { background: var(--mv-cat-methode); }
.mv-charte .mv-cat--systeme { background: var(--mv-cat-systeme); }
.mv-charte .mv-cat--parents { background: var(--mv-cat-parents); }

/* Capture posée comme une feuille, photo, vidéo */
.mv-charte .mv-capture {
  background: var(--mv-feuille); border: 1px solid var(--mv-filet); border-radius: var(--mv-r-1);
  box-shadow: var(--mv-ombre-posee); overflow: hidden;
}
.mv-charte .mv-capture img { display: block; width: 100%; height: auto; }
.mv-charte .mv-capture--inclinee { transform: rotate(-1.5deg); }
.mv-charte .mv-photo { border-radius: var(--mv-r-2); background: var(--mv-papier-2); overflow: hidden; }
.mv-charte .mv-photo img { display: block; width: 100%; height: auto; }
.mv-charte .mv-video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--mv-r-2); overflow: hidden; background: var(--mv-encre); }
.mv-charte .mv-video iframe, .mv-charte .mv-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Icônes SVG en ligne, trait 1,75 px, couleur du texte */
.mv-charte .mv-icone { width: 24px; height: 24px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }

/* Zones sombres (bandeau nuit, pied propre à un embed) */
.mv-charte .mv-sombre { background: var(--mv-encre); color: var(--mv-pied-texte); }
.mv-charte .mv-sombre h1, .mv-charte .mv-sombre h2, .mv-charte .mv-sombre h3, .mv-charte .mv-sombre h4 { color: #FFFFFF; }
.mv-charte .mv-sombre .mv-chapeau, .mv-charte .mv-sombre .mv-legende, .mv-charte .mv-sombre .mv-surtitre { color: var(--mv-pied-texte); }

/* 7 bis. Composants ajoutés au lot 3 (v1.4, 09.10.2026) ------------------------------
   Pour les pages de la vitrine recollées au lot 3 : accueil, /rentree, /courses, /cantons, /about,
   méthode, fondements, FAQ, contact, masterclass, ECR 8, examens de 11e, Bilan. Même contrat que les
   autres composants : sous .mv-charte, tailles en px, aucune couleur hors jetons. */

/* Sections : fond blanc (bande des repères) et marges réduites */
.mv-charte .mv-section--feuille { background: var(--mv-feuille); border-top: 1px solid var(--mv-filet); border-bottom: 1px solid var(--mv-filet); }
.mv-charte .mv-section--serree { padding: var(--mv-e-6) 0; }
.mv-charte .mv-section > .mv-conteneur > :last-child,
.mv-charte .mv-colonne-texte > :last-child { margin-bottom: 0; }

/* Deux colonnes : texte et visuel (héros, Marc). Une seule colonne sous 900 px. */
.mv-charte .mv-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mv-e-7); align-items: center; }
.mv-charte .mv-duo--portrait { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); align-items: start; }
@media (max-width: 900px) {
  .mv-charte .mv-duo, .mv-charte .mv-duo--portrait { grid-template-columns: minmax(0, 1fr); gap: var(--mv-e-6); }
  .mv-charte .mv-duo--portrait .mv-photo { max-width: 260px; }
}

/* Paire de captures de téléphone posées comme des feuilles ; la seconde un peu plus bas */
.mv-charte .mv-paire { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mv-e-5); align-items: start; max-width: 520px; }
.mv-charte .mv-paire > :nth-child(2) { margin-top: var(--mv-e-7); }
.mv-charte .mv-paire + .mv-legende, .mv-charte .mv-capture + .mv-legende, .mv-charte .mv-feuille + .mv-legende { margin-top: var(--mv-e-4); }
@media (max-width: 640px) { .mv-charte .mv-paire { gap: var(--mv-e-4); } .mv-charte .mv-paire > :nth-child(2) { margin-top: var(--mv-e-6); } }
.mv-charte .mv-capture--seule { max-width: 300px; }

/* Rangée de boutons ou de liens d'action */
.mv-charte .mv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--mv-e-3) var(--mv-e-5); margin: var(--mv-e-5) 0 var(--mv-e-4); }
.mv-charte .mv-actions > * { margin: 0; }
/* Lien d'action seul dans une rangée : cible tactile de 44 px (review du code, 09.10.2026) */
.mv-charte .mv-actions > a:not(.mv-btn) { display: inline-flex; align-items: center; min-height: 44px; }
/* Espace au-dessus d'un bloc de texte ou d'une grille (ne change pas son affichage) */
.mv-charte .mv-espace-haut { margin-top: var(--mv-e-5); }

/* Repères chiffrés (bande sous le héros) */
.mv-charte .mv-repere { margin: 0; }
.mv-charte .mv-repere__chiffre { display: block; font-family: var(--mv-police-titre); font-weight: 600; font-size: var(--mv-t-h4); line-height: 1.25; color: var(--mv-encre); margin-bottom: var(--mv-e-1); }
.mv-charte .mv-repere__texte { display: block; font-size: var(--mv-t-petit); line-height: var(--mv-i-petit); color: var(--mv-encre-2); }

/* Étapes à lettre ou à chiffre (STOP-V, les six temps, les quatre étapes du pack) */
.mv-charte .mv-etapes { list-style: none; padding: 0; margin: 0 0 var(--mv-e-5); }
.mv-charte .mv-etapes > li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: var(--mv-e-3); align-items: start; padding: var(--mv-e-3) 0; margin: 0; border-top: 1px solid var(--mv-filet); }
.mv-charte .mv-etapes > li:last-child { border-bottom: 1px solid var(--mv-filet); }
.mv-charte .mv-etapes__lettre {
  display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  border: 1.5px solid var(--mv-encre); border-radius: var(--mv-r-1); background: var(--mv-feuille);
  font-family: var(--mv-police-titre); font-weight: 700; font-size: 17px; line-height: 1; color: var(--mv-encre);
}
.mv-charte .mv-etapes > li > div > :last-child { margin-bottom: 0; }

/* Citation signée */
.mv-charte .mv-citation { margin: var(--mv-e-5) 0; padding: 0 0 0 var(--mv-e-5); border-left: 3px solid var(--mv-surligneur); }
.mv-charte .mv-citation p { font-family: var(--mv-police-titre); font-style: italic; font-size: var(--mv-t-annotation); line-height: 1.5; color: var(--mv-encre-2); margin: 0 0 var(--mv-e-2); }
.mv-charte .mv-citation__auteur { font-size: var(--mv-t-petit); color: var(--mv-encre-3); }

/* Questions et réponses, petits titres de carte : corps h4, la hiérarchie reste celle de la balise */
.mv-charte h2.mv-question, .mv-charte h3.mv-question { font-size: var(--mv-t-h4); line-height: var(--mv-i-h4); margin: var(--mv-e-6) 0 var(--mv-e-2); }
.mv-charte h2 + .mv-question, .mv-charte .mv-surtitre + .mv-question { margin-top: 0; }

/* Tableaux : texte à gauche, filets, défilement horizontal sur téléphone si besoin */
.mv-charte .mv-tableau { overflow-x: auto; margin: 0 0 var(--mv-e-5); -webkit-overflow-scrolling: touch; }
.mv-charte table { width: 100%; border-collapse: collapse; font-size: var(--mv-t-petit); line-height: var(--mv-i-petit); }
.mv-charte th, .mv-charte td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--mv-filet); }
.mv-charte th { font-weight: 700; color: var(--mv-encre); background: var(--mv-papier-2); }
.mv-charte caption { text-align: left; font-size: var(--mv-t-surtitre); color: var(--mv-encre-3); padding: 0 0 var(--mv-e-2); }

/* Tableau qui défile sur téléphone : la zone reçoit le focus clavier (tabindex="0" dans l'embed) */
.mv-charte .mv-tableau:focus-visible { outline: 3px solid var(--mv-focus) !important; outline-offset: 2px !important; }

/* Navigateurs sans :focus-visible (Safari 14.1 et 15.x) : anneau sur :focus, embeds de la charte seulement */
@supports not selector(:focus-visible) {
  .mv-charte a:focus, .mv-charte button:focus, .mv-charte [role="button"]:focus, .mv-charte .mv-tableau:focus {
    outline: 3px solid #102A43 !important; outline-offset: 2px !important;
  }
  .mv-charte .mv-sombre a:focus, .mv-charte .mv-sombre button:focus { outline-color: #FFE45E !important; }
}

/* Références bibliographiques */
.mv-charte .mv-references { list-style: none; padding: 0; margin: 0; font-size: var(--mv-t-petit); line-height: var(--mv-i-petit); }
.mv-charte .mv-references li { padding-left: 24px; text-indent: -24px; margin: 0 0 var(--mv-e-3); }

/* Tuile d'application (Douze, Quatre) et icône en tête de carte */
.mv-charte .mv-tuile { display: block; width: 48px; height: 48px; margin: 0 0 var(--mv-e-3); }

/* Annotation posée comme une note de correcteur, sur sa propre ligne */
.mv-charte p.mv-annotation { margin: 0 0 var(--mv-e-3); }
.mv-charte .mv-feuille > .mv-question:first-child { margin-top: 0; }

/* 8. Motifs : à doser (CLAUDE.md § 7) ------------------------------------------ */
.mv-charte .mv-surligne {
  background-image: var(--mv-motif-surligne); padding: 0 0.12em;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.mv-charte .mv-quadrille {
  background-color: var(--mv-papier); background-image: var(--mv-motif-quadrillage);
  background-size: var(--mv-motif-quadrillage-pas);
}
.mv-charte .mv-annotation {
  font-family: var(--mv-police-titre); font-style: italic; font-weight: 400;
  font-size: var(--mv-t-annotation); color: var(--mv-action);
}
.mv-charte .mv-sombre .mv-annotation { color: #FFFFFF; }

/* 9. Chrome LearnWorlds : filets de sécurité, si un réglage du thème ne prend pas -- */
/* Menu de la barre du haut (réglé « Fira Sans » sans être chargé : serif système) */
.lw-topbar-option-link { font-family: var(--mv-police-texte) !important; }
/* Bandeau cookies de LearnWorlds (.dataProtectionSettings, sur la couleur « Dark » du thème) :
   fond blanc, texte encre, liens et boutons bleu d'action (les boutons suivent la couleur de marque).
   Balisage relevé le 08.10.2026 : texte en p et span, deux liens a.dataProtectionSettingsDescr-link,
   deux <button class="dataProtectionSettings-btn learnworlds-button"> sans span intérieur :
   les règles ci-dessous n'atteignent pas les boutons. */
.dataProtectionSettings { box-shadow: 0 -2px 14px rgba(16, 42, 67, 0.16); }
.dataProtectionSettings-row.lw-dark-bg { background-color: #FFFFFF !important; color: var(--mv-encre) !important; }
.dataProtectionSettings-row.lw-dark-bg p, .dataProtectionSettings-row.lw-dark-bg span,
.dataProtectionSettings-row.lw-dark-bg label, .dataProtectionSettings-row.lw-dark-bg .learnworlds-icon { color: var(--mv-encre) !important; }
.dataProtectionSettings-row.lw-dark-bg a { color: var(--mv-action) !important; text-decoration: underline !important; }

/* Pied de page réglé sur la couleur « Dark » (#102A43) : liens et icônes clairs */
.lw-footer.lw-dark-bg a:not(.learnworlds-button),
.lw-footer.lw-dark-bg a:not(.learnworlds-button) * { color: var(--mv-pied-texte) !important; }
.lw-footer.lw-dark-bg a:not(.learnworlds-button):hover,
.lw-footer.lw-dark-bg a:not(.learnworlds-button):hover * { color: #FFFFFF !important; }
.lw-footer.lw-dark-bg a:focus-visible { outline: 3px solid var(--mv-focus-sombre) !important; outline-offset: 2px !important; }

/* 10. Barre du haut, plein format dès 991 px (v1.4, 09.10.2026) -------------------
   Constat (09.10.2026) : de 991 px (fin de la barre compacte de LearnWorlds) à 1200 px environ, le
   bouton « Essayer gratuitement » sort de l'écran à droite ou colle à son bord ; avec une 7e entrée
   « Blog », jusque vers 1330 à 1355 px selon la barre de défilement. Cause : chaque colonne de la
   barre et le menu central ajoutent 25 px de remplissage de chaque côté, et la barre ne rétrécit
   pas (étiquettes sur une ligne). On retire ces remplissages intérieurs puis, par paliers, on
   resserre les écarts ; les étiquettes du menu ne passent à 15 px qu'en dessous de 1023 px.
   Aucune entrée masquée. Réglé pour 7 entrées (avec « Blog ») : une 8e entrée ou des libellés plus
   longs demandent une nouvelle mesure. Vaut aussi pour la barre connecté (même structure, non
   vérifiée faute de connexion). Classes natives relevées le 09.10.2026. */

/* a) Dès 991 px (aligné aussi au-delà de 1366 px, décision de Marc du 09.10.2026) : plus de remplissage intérieur. Restent 25 px aux deux bords de la barre et
      24 px entre le logo, le menu et la colonne de droite. Les entrées gardent leurs 28 px. */
@media (min-width: 991px) {
  .lw-topbar .lw-cols > .col.lw-topbar-logo-col { padding-right: 0 !important; }
  .lw-topbar .lw-cols > .col:not(.lw-topbar-logo-col) { margin-left: 24px !important; padding-left: 0 !important; }
  .lw-topbar .lw-cols > .col:not(.lw-topbar-logo-col):not(:last-child) { padding-right: 0 !important; }
  .lw-topbar .lw-cols > .col .lw-topbar-menu-wrapper { padding-left: 0 !important; padding-right: 0 !important; }
}

/* b) De 991 à 1169 px (la barre n'a plus ses 1170 px) : bords à 16 px, 16 px entre les colonnes et
      entre « Connexion » et le bouton. L'écart entre deux entrées suit la largeur de la fenêtre :
      16 px à 1023 px, 22 px à 1065 px, 28 px (valeur d'origine) dès 1107 px. */
@media (min-width: 991px) and (max-width: 1169.9px) {
  .lw-topbar .lw-cols > .col.lw-topbar-logo-col { padding-left: 16px !important; }
  .lw-topbar .lw-cols > .col:last-child { padding-right: 16px !important; }
  .lw-topbar .lw-cols > .col:not(.lw-topbar-logo-col) { margin-left: 16px !important; }
  .lw-topbar .lw-cols > .col:nth-child(2) ul.lw-topbar-options > li.lw-topbar-option {
    margin-left: 8px !important; margin-right: 8px !important; /* repli sans clamp() (review du code) */
    margin-left: clamp(8px, calc((100vw - 911px) / 14), 14px) !important;
    margin-right: clamp(8px, calc((100vw - 911px) / 14), 14px) !important;
  }
  .lw-topbar .lw-cols > .col:last-child ul.lw-topbar-options > li.lw-topbar-option:not(:last-child) { margin-right: 16px !important; }
}

/* c) De 991 à 1022 px : étiquettes du menu central à 15 px (au lieu de 16), 16 px entre deux
      entrées, 12 px entre les colonnes et entre « Connexion » et le bouton. « Connexion » et le
      bouton gardent leurs 17 px. */
@media (min-width: 991px) and (max-width: 1022.9px) {
  .lw-topbar .lw-cols > .col:not(.lw-topbar-logo-col) { margin-left: 12px !important; }
  .lw-topbar .lw-cols > .col:nth-child(2) ul.lw-topbar-options > li.lw-topbar-option { margin-left: 8px !important; margin-right: 8px !important; }
  .lw-topbar .lw-cols > .col:nth-child(2) ul.lw-topbar-options > li.lw-topbar-option > .lw-topbar-option-link { font-size: 15px !important; }
  .lw-topbar .lw-cols > .col:last-child ul.lw-topbar-options > li.lw-topbar-option:not(:last-child) { margin-right: 12px !important; }
}

/* 11. Menu téléphone : neutralise une règle du thème LearnWorlds (v1.4, 09.10.2026) ---------------
   Le thème (bloc <style> en ligne, après « generic colors for old pages ») contient :
     @media (pointer: fine) and (max-device-width: 768px) { a span { display:none } a:hover span { display:inline-block } }
   Elle vise les appareils à petit écran (768 px de large au plus) avec souris ou stylet. Dans la
   barre, elle n'atteint que les libellés du menu téléphone, des <span> sans classe placés dans
   a.mobile-nav-menu-link : 14 entrées sur 17 (Tous les cours, 7H à 11H, Votre canton, ECR 8,
   Examens 11e, Gratuit, Tarifs, Méthode, À propos, Essayer gratuitement) deviennent des liens
   vides de 0 px, impossibles à voir, à survoler ou à toucher. Restent visibles « Les cours » et
   « Épreuves » (texte hors span), « Connexion » (div) et les chevrons (span.chevron, inline-flex).
   Les libellés de la barre pleine (span.lw-topbar-option-link-lbl) ne sont pas touchés : leur
   règle de classe passe devant. On rend aux libellés leur affichage normal, mesuré sans la règle :
   inline ; et inline-block là où la règle « haute densité » du thème (-webkit-min-device-pixel-ratio
   1.77) s'applique déjà aujourd'hui. Spécificité 0,4,2 : passe devant a span (0,0,2) et a:hover span
   (0,1,2), sans !important. */
@media (pointer: fine) and (max-device-width: 768px) {
  .lw-topbar .mobile-nav-menu a.mobile-nav-menu-link > span:not([class]) { display: inline; }
  @media screen and (-webkit-min-device-pixel-ratio: 1.77) {
    .lw-topbar .mobile-nav-menu a.mobile-nav-menu-link > span:not([class]) { display: inline-block; }
  }
}

/* 12. Compatibilité des embeds actuels (à retirer au fil du lot 4, règle par règle) ------------
   Reprise de l'emplacement « <style> Dynamic (css) » du 08.10.2026 (ancien bloc + correctif
   A1 v1.1), avec une seule différence : chaque règle exclut les éléments placés sous
   .mv-charte, pour ne jamais toucher un embed de la nouvelle charte.
   La règle de focus globale (a:focus-visible...) reste dans « <style> Dynamic », parce que
   cet emplacement atteint aussi les leçons. */

.mv-hero-cta:not(.mv-charte *), .mv-pricing-cta:not(.mv-charte *), .mv-ribbon:not(.mv-charte *) {
  background-color: #B45309 !important; color: #fff !important;
}
.mv-hero-badge:not(.mv-charte *), .mv-panel-badge.mv-badge-orange:not(.mv-charte *) { color: #92400E !important; }
.mv-art-body:not(.mv-charte *) { text-align: left; }

/* Boutons principaux orange : fond brun, texte blanc */
#pageContainer a.mv-btn:not(.mv-charte *),
#pageContainer a.hero-cta:not(.mv-charte *),
#pageContainer a.mvp-cta-1:not(.mv-charte *) {
  background-color: #B45309 !important; color: #FFFFFF !important; text-decoration: none !important; }
#pageContainer a.mv-btn:not(.mv-charte *):hover,
#pageContainer a.hero-cta:not(.mv-charte *):hover,
#pageContainer a.mvp-cta-1:not(.mv-charte *):hover { background-color: #92400E !important; }

/* Bouton e-mail de /contact */
#pageContainer a.mv-email-btn:not(.mv-charte *) {
  background-color: #0369A1 !important; color: #FFFFFF !important; text-decoration: none !important; }
#pageContainer a.mv-email-btn:not(.mv-charte *):hover { background-color: #075985 !important; }

/* Bouton de téléchargement (article cahier ECR) */
#pageContainer a.mv-dl-btn:not(.mv-charte *) {
  background-color: #047857 !important; color: #FFFFFF !important; text-decoration: none !important; }
#pageContainer a.mv-dl-btn:not(.mv-charte *):hover { background-color: #065F46 !important; }

/* Boutons secondaires */
#pageContainer a.mv-btn-ghost:not(.mv-charte *),
#pageContainer a.mvp-cta-2:not(.mv-charte *),
#pageContainer a.mv-hero-cta[style*="background: #fff"]:not(.mv-charte *) {
  background-color: #FFFFFF !important; color: #0369A1 !important; border: 2px solid #0369A1 !important; text-decoration: none !important; }
#pageContainer a.mv-btn-ghost:not(.mv-charte *):hover,
#pageContainer a.mvp-cta-2:not(.mv-charte *):hover,
#pageContainer a.mv-hero-cta[style*="background: #fff"]:not(.mv-charte *):hover { background-color: #E0F2FE !important; }

/* Bouton violet « Pack Examens 11e » de /courses */
#pageContainer a.mv-cs-cta.mv-cs-cta-purple:not(.mv-charte *) { background-color: #6D28D9 !important; }
#pageContainer a.mv-cs-cta.mv-cs-cta-purple:not(.mv-charte *):hover { background-color: #5B21B6 !important; }

/* Pas de soulignement sur les autres boutons d'embed */
#pageContainer a.mv-hero-cta:not(.mv-charte *),
#pageContainer a.mv-pricing-cta:not(.mv-charte *),
#pageContainer a.mv-cs-cta:not(.mv-charte *),
#pageContainer a.mvd-cta:not(.mv-charte *) { text-decoration: none !important; }

/* Focus clavier visible sur ces boutons */
#pageContainer a.mv-btn:not(.mv-charte *):focus-visible, #pageContainer a.hero-cta:not(.mv-charte *):focus-visible,
#pageContainer a.mvp-cta-1:not(.mv-charte *):focus-visible, #pageContainer a.mvp-cta-2:not(.mv-charte *):focus-visible,
#pageContainer a.mv-email-btn:not(.mv-charte *):focus-visible, #pageContainer a.mv-dl-btn:not(.mv-charte *):focus-visible,
#pageContainer a.mv-btn-ghost:not(.mv-charte *):focus-visible, #pageContainer a.mv-hero-cta:not(.mv-charte *):focus-visible,
#pageContainer a.mv-pricing-cta:not(.mv-charte *):focus-visible, #pageContainer a.mv-cs-cta:not(.mv-charte *):focus-visible {
  outline: 3px solid #0C4A6E !important; outline-offset: 3px !important; }

/* fin de mv-charte-1.4.css */
