.elementor-26471 .elementor-element.elementor-element-53cb557{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}body.elementor-page-26471:not(.elementor-motion-effects-element-type-background), body.elementor-page-26471 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F5F0E4;}/* Start custom CSS for theme-post-content, class: .elementor-element-53cb557 *//* ============================================================
   PAGE PARENTE — Table des matières d'une partie
   ============================================================ */

/* ------------------------------------------------------------
   1. THÈMES PAR PARTIE
   La classe de thème doit être portée par le conteneur .partie.
   ------------------------------------------------------------ */

/* BLEU — Partie 1 */
.partie.pour-une-bifurcation-ecologique-et-sociale {
  --couleur-titre: var(--Bleu-Ciel-700-Marine, #004880);
  --fond-titre: var(--Bleu-Ciel-50, #E8F6FF);
  --bordure-titre: var(--Bleu-Ciel-700-Cobalt, #0078C2);
  --separateur: var(--Bleu-Ciel-500-Azur, #3AADEE);
}

/* ORANGE — Partie 2 */
.partie.une-economie-au-service-des-besoins {
  --couleur-titre: var(--Orange-700-Cuivre, #B04E00);
  --fond-titre: var(--Orange-50, #FFF1E6);
  --bordure-titre: var(--Orange-500, #F06B00);
  --separateur: var(--Orange-100-Abricot, #FFB87A);
}

/* VERT — Partie 3 */
.partie.mettre-en-securite-sociale {
  --couleur-titre: var(--Vert_500, #186842);
  --fond-titre: var(--Vert_50, #EDFBF3);
  --bordure-titre: var(--Vert-Alt-500-Base, #2B9A65);
  --separateur: var(--Vert-Alt-50-Fluo, #7AECB6);
}

/* JAUNE — Partie 4 */
.partie.le-gout-du-futur-aux-nouvelles-frontieres-de-l-humanite {
  --couleur-titre: var(--Jaune-900-Ocre, #6B5100);
  --fond-titre: var(--Jaune-50-Citron, #FFFBE6);
  --bordure-titre: var(--Jaune-700-Miel, #B88E00);
  --separateur: var(--Jaune-100-Soleil, #FFE566);
}

/* ROUGE — Partie 5 */
.partie.fonder-la-6e-republique {
  --couleur-titre: var(--Rouge-700-Carmin, #8F120A);
  --fond-titre: var(--Rouge-50-Rosee, #FDECEA);
  --bordure-titre: var(--Rouge-700-Carmin, #8F120A);
  --separateur: var(--Rouge-100-Corail, #F9A89E);
}

/* VIOLET — Partie 6 */
.partie.un-monde-ordonne {
  --couleur-titre: var(--Violet-700-Pourpre, #330068);
  --fond-titre: var(--Violet-50-Lavande, #EDE5FF);
  --bordure-titre: var(--Violet-900-Nuit, #1D003C);
  --separateur: var(--Violet-100-Lilas, #C9ADFF);
}

/* GRIS — Introduction */
.partie.introduction {
  --couleur-titre: var(--Cendres, #7A7264);
  --fond-titre: transparent;
  --bordure-titre: var(--Cendres, #7A7264);
  --separateur: var(--Cendres, #7A7264);
}

/* ------------------------------------------------------------
   2. BASE DE LA PAGE
   Ne cible plus tous les widgets de contenu Elementor.
   ------------------------------------------------------------ */

.partie {
  --ch-accent: var(--couleur-titre, var(--Noir, #212320));
  --ch-tint: var(--fond-titre, var(--Gris-clair, #F5F5F5));
  --ch-separator: var(--separateur, var(--Gris, #D9D9D9));

  /* Les bordures extérieures restent neutres dans la maquette */
  --ch-border: var(--Cendres, #7A7264);
  --ch-text: var(--texte, var(--Noir, #212320));
  --ch-surface: var(--Blanc-casse, #FFFCF4);
  --couleur-chapitre: var(--Terre, #3C3C3B);

  --ch-title-font: var(--TITRES, "Union Gothic"), sans-serif;
  --ch-body-font: "Stack Sans Text", var(--Textes, "Stack Sans"), sans-serif;

  display: flex;
  flex-direction: column;
  gap: var(--Space4, 32px);

  width: 100%;
  max-width: var(--Container-Encadre, 1096px);
  min-width: 0;
  margin-inline: auto;
  padding: 0;

  color: var(--ch-text);
  font-family: var(--ch-body-font);
  font-size: var(--Body-large, 18px);
  line-height: 1.5;
}

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

.partie > * {
  min-width: 0;
}

/* ------------------------------------------------------------
   3. RETOUR ET PARTAGE
   .partie-actions : classe facultative pour leur ligne commune.
   ------------------------------------------------------------ */

.partie .partie-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--Space2, 16px);
  padding-block: var(--Space1, 8px);
}

.ariane {
  margin: 0;
  padding: 0;
  display: none;
}

.partie .share {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--Space1, 8px);

  min-height: 56px;
  padding: var(--Space2, 16px) var(--Space3, 24px);

  font-family: var(--ch-body-font);
  font-weight: 700;
  font-size: var(--Buttons, 18px);
  line-height: 1.3;
  color: var(--ch-surface);
  text-decoration: none;

  background: var(--ch-accent);
  border: 0;
  border-radius: var(--Radius-10, 10px);
  cursor: pointer;
}

/* ------------------------------------------------------------
   4. EN-TÊTE DE PARTIE
   Sans fond ni bordure, contrairement à la version précédente.
   ------------------------------------------------------------ */

/* Si .chapitre est un conteneur d'en-tête */
.partie > .chapitre {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--Space2, 16px);
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

/* Fonctionne aussi si le h2 porte lui-même la classe .chapitre */
.partie > h2,
.partie > .chapitre h2 {
  margin: 0;
  padding: 0;
  margin-top: var(--Space2);
  font-family: var(--ch-title-font);
  font-weight: 700;
  font-size: var(--Space4);
  line-height: 1.2;
  text-transform: none;
  color: var(--ch-accent);
}

/* Icône au-dessus du titre */
.partie > .chapitre > .fa-slab,
.partie > h2 .fa-slab,
.partie > .chapitre h2 .fa-slab {
  display: block;
  flex-shrink: 0;
  width: fit-content;
  height: auto;
  font-size: var(--Space8);
  line-height: 1;
  color: var(--ch-accent);
}

.partie > h2 .fa-slab,
.partie > .chapitre h2 .fa-slab {
  margin-bottom: var(--Space2, 16px);
}

.partie h2 {
  margin: 0;
  padding: var(--Space2) var(--Space2) var(--Space2) var(--Space4);
  color: var(--ch-accent);
  background: var(--ch-tint);
  border: 1px solid var(--ch-border);
  border-radius: 10px 10px 0 0;
}

/* Introduction : intégrée à l'en-tête ou placée juste après */
.partie > .chapitre p,
.partie > p,
.partie > .wp-block-paragraph {
  margin: 0;
  font-family: var(--ch-body-font);
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 400;
  line-height: var(--Interlignage_150, 150%);
  color: var(--ch-text);
}

/* ------------------------------------------------------------
   5. TABLE DES MATIÈRES
   ------------------------------------------------------------ */

.partie nav.tdm {
  display: flex;
  flex-direction: column;
  gap: var(--Space4, 32px);

  width: 100%;
  margin: 0;
  padding: 0;

  background: transparent;
  border: 0;
  border-radius: 0;
}

/* Chaque carte de chapitre */
.partie nav.tdm .chapitre {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: var(--ch-surface);
  border: var(--Bordure, 1px) solid var(--ch-border);
  border-radius: var(--Radius-10, 10px);
  overflow: hidden;
}

/* Titre du chapitre : même fond que la carte */
.partie nav.tdm .chapitre h2 {
  margin: 0;
  padding: var(--Space2, 16px);
  font-family: var(--ch-title-font);
  font-weight: 700;
  font-size: var(--H5);
  line-height: var(--Interlignage_120, 120%);
  color: var(--ch-accent);
  background: var(--fond-titre);
  border: 0;
  border-bottom: var(--Bordure, 1px) solid var(--ch-separator);
}

.partie nav.tdm .chapitre h2 a {
  display: block;

  /* Rend toute la surface du titre cliquable */
  margin: calc(-1 * var(--Space2, 16px));
  padding: var(--Space2, 16px);
  font: inherit;
  color: inherit;
  text-decoration: none;
}

/* Liens de sections : Union Gothic, foncés, compacts */
.partie nav.tdm .chapitre > a {
  display: block;
  margin: 0;
  padding:
    var(--Space1, 8px)
    var(--Space2, 16px)
    var(--Space1, 8px)
    var(--Space3, 24px);

  font-family: var(--ch-title-font);
  font-weight: 700;
  font-size: var(--H6);
  line-height: var(--Interlignage_120, 120%);
  color: var(--couleur-chapitre);
  text-decoration: none;

  background: transparent;
  border: 0;
  overflow-wrap: break-word;
}

/* Un seul séparateur entre deux liens :
   évite la double bordure sous le h2 */
.partie nav.tdm .chapitre > a + a {
  border-top: var(--Bordure, 1px) solid var(--ch-separator);
}

.partie nav.tdm .chapitre h2 a:hover,
.partie nav.tdm .chapitre > a:hover {
  transform: translateY(2px);
}

/* ------------------------------------------------------------
   6. ÉVENTUELS BLOCS DE CONTENU (Introduction sous le titre)
   ------------------------------------------------------------ */

/* Raccord parfait quand la section d'intro suit le titre ou le bloc d'en-tête */
.partie > h2 + section:not(.tdm):not(.chapitre),
.partie > .chapitre + section:not(.tdm):not(.chapitre) {
  /* Annule le gap de 32px du conteneur parent */
  margin-top: calc(-1 * var(--Space4, 32px));

  /* Soude visuellement la section au h2 */
  border-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.partie > section:not(.tdm):not(.chapitre) {
  margin: 0;
  background-color: var(--Blanc-casse);
  padding: var(--Space2);
  border-radius: var(--Radius-10);
border: 1px solid var(--couleur-titre);
    
}

.partie > section:not(.tdm):not(.chapitre) p {
  margin: 0;
  font-family: var(--ch-body-font);
  font-size: var(--H6);
  line-height: 1.5;
  color: var(--ch-text);
}

.partie > section > :last-child {
  margin-bottom: 0;
}

/* ============================================================
   PAGE PARTIE — BOUTON « PARTIE SUIVANTE »
   ============================================================ */

/* Fonctionne si le lien est dans .partie ou juste après */
main.partie > a.next,
main.partie > a.next {
  --next-accent: var(--couleur-titre, var(--Noir, #212320));

  --next-icon-font:
    var(--fa-family-slab-duo, "Font Awesome 7 Slab Duo");

  --next-icon-size: 1.25em;

  display: inline-grid;
  grid-template-columns: auto var(--next-icon-size);
  grid-template-rows: auto;
  align-items: center;
  justify-content: center;
  column-gap: var(--Space1, 8px);

  align-self: flex-end;
  width: fit-content;
  max-width: 100%;
  min-height: 44px;
  margin: var(--Space2, 16px) 0 0 auto;
  padding: var(--Space1, 8px) var(--Space2, 16px);

  box-sizing: border-box;

  font-family:
    var(--Textes, "Stack Sans Text", "Stack Sans"), sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.3;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;

  color: var(--next-accent);
  background: transparent;
  border: 1px solid var(--next-accent);
  border-radius: var(--Radius-10, 10px);

  cursor: pointer;
  transition: transform 0.15s ease;
}

/* Deux calques de la flèche droite */
.partie a.next::before,
.partie a.next::after,
.partie + a.next::before,
.partie + a.next::after {
  content: "\f061";

  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: center;

  position: static;
  display: block;
  margin: 0;
  padding: 0;

  font-family: var(--next-icon-font) !important;
  font-weight: 400;
  font-style: normal;
  font-size: var(--next-icon-size);
  line-height: 1;

  color: currentColor;
  transform: none;
  pointer-events: none;
}

/* Calque principal */
.partie a.next::before,
main.partie > a.next::before {
  font-feature-settings: normal;
  opacity: 1;
}

/* Calque secondaire */
.partie a.next::after,
main.partie > a.next::after {
  font-feature-settings: "ss01";
  opacity: 0.25;
}

/* Slab Press Duo au survol et au focus clavier */
.partie a.next:is(:hover, :focus-visible),
main.partie > a.next:is(:hover, :focus-visible) {
  --next-icon-font:
    var(--fa-family-slab-press-duo, "Font Awesome 7 Slab Press Duo");

  color: var(--next-accent);
  text-decoration: none;
}

/* Déplacement au survol */
.partie a.next:hover,
main.partie > a.next:hover {
  transform: translateY(2px);
}

/* Focus clavier */
.partie a.next:focus-visible,
main.partie > a.next:focus-visible {
  outline: 2px solid var(--next-accent);
  outline-offset: 3px;
}

/* Mouvement réduit */
@media (prefers-reduced-motion: reduce) {
  .partie a.next,
  main.partie > a.next {
    transition: none;
  }

  .partie a.next:hover,
  .main.partie > a.next {
    transform: none;
  }
}

/* ============================================================
   PAGE PARTIE — ICÔNES SLAB DUO / SLAB PRESS DUO

   À ajouter après le CSS existant.
   Aucune modification du HTML.
   ============================================================ */


/* ------------------------------------------------------------
   1. VARIABLES
   ------------------------------------------------------------ */

.partie {
  --part-icon-duo:
    var(--fa-family-slab-duo, "Font Awesome 7 Slab Duo");

  --part-icon-press-duo:
    var(--fa-family-slab-press-duo, "Font Awesome 7 Slab Press Duo");

  --part-icon-secondary-opacity: 0.25;
}


/* ------------------------------------------------------------
   2. GLYPHES DES ICÔNES EXISTANTES
   ------------------------------------------------------------ */

/* Table des matières */
.partie .fa-list {
  --part-icon: "\f03a";
}

/* Partie 1 */
.partie .fa-leaf {
  --part-icon: "\f06c";
}

/* Partie 2 */
.partie .fa-credit-card {
  --part-icon: "\f09d";
}

/* Partie 3 */
.partie .fa-heart {
  --part-icon: "\f004";
}

/* Partie 4 */
.partie .fa-globe {
  --part-icon: "\f0ac";
}

/* Partie 5 */
.partie .fa-landmark {
  --part-icon: "\f66f";
}

/* Partie 6 */
.partie .fa-shield {
  --part-icon: "\f132";
}

/* Navigation */
.partie .fa-arrow-left {
  --part-icon: "\f060";
}

.partie .fa-arrow-right {
  --part-icon: "\f061";
}

/* Partage */
.partie :is(.fa-share-nodes, .fa-share-alt) {
  --part-icon: "\f1e0";
}


/* ------------------------------------------------------------
   3. ICÔNES NON INTERACTIVES : PRESS DUO PAR DÉFAUT
   ------------------------------------------------------------ */

.partie .fa-slab {
  --part-icon-family: var(--part-icon-press-duo);

  position: relative;
  flex-shrink: 0;

  font-style: normal;
  line-height: 1;
}

/* Les règles existantes conservent la taille et le display
   de la grande icône d'en-tête. */


/* ------------------------------------------------------------
   4. ICÔNES INTERACTIVES : DUO AU REPOS
   ------------------------------------------------------------ */

.partie :is(a, button) .fa-slab,
.partie :is(a, button).fa-slab {
  --part-icon-family: var(--part-icon-duo);
}


/* ------------------------------------------------------------
   5. DEUX CALQUES DES ICÔNES EXISTANTES
   ------------------------------------------------------------ */

.partie .fa-slab::before,
.partie .fa-slab::after {
  content: var(--part-icon);

  font-family: var(--part-icon-family) !important;
  font-weight: 400 !important;
  font-style: normal;
  font-size: inherit;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;

  color: currentColor;
  pointer-events: none;
}

/* Calque principal : réserve l'espace de l'icône */
.partie .fa-slab::before {
  position: relative;
  display: inline-block;

  font-feature-settings: normal;
  opacity: 1;
}

/* Calque secondaire : superposé */
.partie .fa-slab::after {
  position: absolute;
  inset: 0;
  display: block;

  font-feature-settings: "ss01";
  opacity: var(--part-icon-secondary-opacity);
}


/* ------------------------------------------------------------
   6. SURVOL ET FOCUS : PRESS DUO
   ------------------------------------------------------------ */

.partie :is(a, button):is(:hover, :focus-visible) .fa-slab,
.partie :is(a, button).fa-slab:is(:hover, :focus-visible) {
  --part-icon-family: var(--part-icon-press-duo);
}


/* ------------------------------------------------------------
   7. PARTAGER : ICÔNE GÉNÉRÉE SI AUCUNE ICÔNE N'EST PRÉSENTE

   Deux calques dans la même cellule de grille.
   Le texte occupe la cellule suivante.
   ------------------------------------------------------------ */

.partie .share:not(
  :has(.fa-slab, .fa-slab-duo, .fa-slab-press-duo, svg, i)
) {
  --part-share-family: var(--part-icon-duo);
  --part-share-size: 1.25em;

  display: inline-grid;
  grid-template-columns: var(--part-share-size) auto;
  grid-template-rows: auto;
  align-items: center;
  justify-content: center;
  column-gap: var(--Space1, 8px);
}

/* Propriétés communes */
.partie .share:not(
  :has(.fa-slab, .fa-slab-duo, .fa-slab-press-duo, svg, i)
)::before,
.partie .share:not(
  :has(.fa-slab, .fa-slab-duo, .fa-slab-press-duo, svg, i)
)::after {
  content: "\f1e0";

  grid-column: 1;
  grid-row: 1;
  align-self: center;
  justify-self: center;

  position: static;
  display: block;
  margin: 0;
  padding: 0;

  font-family: var(--part-share-family) !important;
  font-weight: 400;
  font-style: normal;
  font-size: var(--part-share-size);
  line-height: 1;

  color: currentColor;
  transform: none;
  pointer-events: none;
}

/* Calque principal */
.partie .share:not(
  :has(.fa-slab, .fa-slab-duo, .fa-slab-press-duo, svg, i)
)::before {
  font-feature-settings: normal;
  opacity: 1;
}

/* Calque secondaire */
.partie .share:not(
  :has(.fa-slab, .fa-slab-duo, .fa-slab-press-duo, svg, i)
)::after {
  font-feature-settings: "ss01";
  opacity: var(--part-icon-secondary-opacity);
}

/* Press Duo au survol / focus */
.partie .share:is(:hover, :focus-visible) {
  --part-share-family: var(--part-icon-press-duo);
}


/* ------------------------------------------------------------
   8. DÉPLACEMENT DES ÉLÉMENTS INTERACTIFS
   ------------------------------------------------------------ */

.partie .share,
.partie a.partie-suivante,
.partie .partie-suivante .elementor-button,
.partie nav.tdm .chapitre h2 a,
.partie nav.tdm .chapitre > a {
  transition:
    transform 0.15s ease,
    background-color 0.2s ease,
    color 0.2s ease;
}

.partie .share:hover,
.partie a.partie-suivante:hover,
.partie .partie-suivante .elementor-button:hover {
  transform: translateY(2px);
  text-decoration: none;
}


/* ------------------------------------------------------------
   9. FOCUS CLAVIER
   ------------------------------------------------------------ */

.partie a:focus-visible,
.partie button:focus-visible {
  outline: 2px solid var(--ch-accent);
  outline-offset: 3px;
}


/* ------------------------------------------------------------
   10. PRÉFÉRENCE DE MOUVEMENT RÉDUIT
   La bascule des icônes reste active, sans déplacement.
   ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  .partie a,
  .partie button {
    transition: none !important;
  }

  .partie .share:hover,
  .partie a.partie-suivante:hover,
  .partie .partie-suivante .elementor-button:hover,
  .partie nav.tdm .chapitre h2 a:hover,
  .partie nav.tdm .chapitre > a:hover {
    transform: none;
  }
}

/* ============================================================
   PAGE PARTIE — BOUTONS RETOUR / PARTAGER

   .partie-header est placé AVANT main.partie.
   Ce bloc fonctionne sans modification du HTML.
   ============================================================ */


/* ------------------------------------------------------------
   1. VARIABLES ET DISPOSITION
   ------------------------------------------------------------ */

.partie-header {
  --ph-accent: var(--Noir, #212320);
  --ph-light: var(--Blanc-casse, #FFFCF4);

  --ph-icon-duo:
    var(--fa-family-slab-duo, "Font Awesome 7 Slab Duo");

  --ph-icon-press-duo:
    var(--fa-family-slab-press-duo, "Font Awesome 7 Slab Press Duo");

  --ph-body-font:
    var(--Textes, "Stack Sans Text", "Stack Sans"), sans-serif;

  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--Space2, 16px);

  width: 100%;
  max-width: var(--Container-Encadre, 1096px);
  margin-inline: auto;
  margin-block: 0 var(--Space3, 24px);
  padding: 0;
}

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


/* ------------------------------------------------------------
   2. COULEUR DE LA PARTIE QUI SUIT LE HEADER
   ------------------------------------------------------------ */

/* Partie 1 */
.partie-header:has(
  ~ .partie.pour-une-bifurcation-ecologique-et-sociale
) {
  --ph-accent: var(--Bleu-Ciel-700-Marine, #004880);
}

/* Partie 2 */
.partie-header:has(
  ~ .partie.une-economie-au-service-des-besoins
) {
  --ph-accent: var(--Orange-700-Cuivre, #B04E00);
}

/* Partie 3 */
.partie-header:has(
  ~ .partie.mettre-en-securite-sociale
) {
  --ph-accent: var(--Vert_500, #186842);
}

/* Partie 4 */
.partie-header:has(
  ~ .partie.le-gout-du-futur-aux-nouvelles-frontieres-de-l-humanite
) {
  --ph-accent: var(--Jaune-900-Ocre, #6B5100);
}

/* Partie 5 */
.partie-header:has(
  ~ .partie.fonder-la-6e-republique
) {
  --ph-accent: var(--Rouge-700-Carmin, #8F120A);
}

/* Partie 6 */
.partie-header:has(
  ~ .partie.un-monde-ordonne
) {
  --ph-accent: var(--Violet-700-Pourpre, #330068);
}

/* Introduction */
.partie-header:has(
  ~ .partie.introduction
) {
  --ph-accent: var(--Cendres, #7A7264);
}


/* ------------------------------------------------------------
   3. STYLE COMMUN AUX BOUTONS
   ------------------------------------------------------------ */

.partie-header > a:is(.back, .share) {
  --ph-current-icon-font: var(--ph-icon-duo);
  --ph-icon-size: 1.25em;

  display: inline-grid;
  grid-template-columns: var(--ph-icon-size) auto;
  grid-template-rows: auto;
  align-items: center;
  justify-content: center;
  column-gap: var(--Space1, 8px);

  width: auto;
  min-height: 44px;
  margin: 0;
  padding: var(--Space1, 8px) var(--Space2, 16px);

  font-family: var(--ph-body-font);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.3;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;

  border: 1px solid transparent;
  border-radius: var(--Radius-10, 10px);
  box-shadow: none;
  cursor: pointer;

  transition:
    transform 0.15s ease,
    background-color 0.2s ease,
    color 0.2s ease;
}


/* ------------------------------------------------------------
   4. RETOUR ET PARTAGER
   ------------------------------------------------------------ */

.partie-header > a.back {
  --ph-icon: "\f060";

  color: var(--ph-accent);
  background: transparent;
}

.partie-header > a.share {
  --ph-icon: "\f1e0";

  min-height: 48px;

  color: var(--ph-light);
  background: var(--ph-accent);
  border-color: var(--ph-accent);
}


/* ------------------------------------------------------------
   5. ICÔNES DUOTONE : DEUX CALQUES SUPERPOSÉS
   ------------------------------------------------------------ */

.partie-header > a:is(.back, .share)::before,
.partie-header > a:is(.back, .share)::after {
  content: var(--ph-icon);

  grid-column: 1;
  grid-row: 1;
  align-self: center;
  justify-self: center;

  position: static;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;

  font-family: var(--ph-current-icon-font) !important;
  font-weight: 400;
  font-style: normal;
  font-size: var(--ph-icon-size);
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;

  color: currentColor;
  background: none;
  border: 0;
  transform: none;
  pointer-events: none;
}

/* Calque principal */
.partie-header > a:is(.back, .share)::before {
  font-feature-settings: normal;
  opacity: 1;
}

/* Calque secondaire */
.partie-header > a:is(.back, .share)::after {
  font-feature-settings: "ss01";
  opacity: 0.25;
}


/* ------------------------------------------------------------
   6. SURVOL ET FOCUS
   ------------------------------------------------------------ */

.partie-header > a:is(.back, .share):is(:hover, :focus-visible) {
  --ph-current-icon-font: var(--ph-icon-press-duo);
}

.partie-header > a:is(.back, .share):hover {
  transform: translateY(2px);
  text-decoration: none;
}

.partie-header > a:is(.back, .share):focus-visible {
  outline: 2px solid var(--ph-accent);
  outline-offset: 3px;
}


/* ------------------------------------------------------------
   7. MOUVEMENT RÉDUIT
   ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  .partie-header > a:is(.back, .share) {
    transition: none;
  }

  .partie-header > a:is(.back, .share):hover {
    transform: none;
  }
}

/* ------------------------------------------------------------
   MOBILE LARGE (à partir de 481px)
------------------------------------------------------------ */
@media (min-width: 481px) {
  /* Ajustements légers pour mobile large */
  .partie > h2 .fa-slab,
  .partie > .chapitre h2 .fa-slab {
    margin-bottom: var(--Space1, 8px);
  }
}

/* ------------------------------------------------------------
   TABLETTE VERTICALE (à partir de 768px)
------------------------------------------------------------ */
@media (min-width: 768px) {
  .partie > section:not(.tdm):not(.chapitre) {
    padding: var(--Space3, 24px);
  }

  .partie nav.tdm .chapitre h2 {
    font-size: var(--H5);
  }

  .partie nav.tdm .chapitre > a {
    font-size: var(--H6);
  }
}

/* ------------------------------------------------------------
   TABLETTE HORIZONTALE (à partir de 1025px)
------------------------------------------------------------ */
@media (min-width: 1025px) {
  .partie > section:not(.tdm):not(.chapitre) {
    padding: var(--Space3, 24px) var(--Space4, 32px);
  }

  .partie nav.tdm .chapitre h2 a:hover,
  .partie nav.tdm .chapitre > a:hover {
    transform: translateY(2px);
  }
}

/* ------------------------------------------------------------
   ORDINATEUR / DESKTOP (à partir de 1140px)
------------------------------------------------------------ */
@media (min-width: 1140px) {
  /* Largeur maximale déjà fixée par var(--Container-Encadre, 1096px) */
}


/* ============================================================
   PAGE PARTIE — IMPRESSION / EXPORT PDF
   À placer après toutes les autres règles.
   ============================================================ */

@media print {

  @page {
    size: A4 portrait;
    margin: 15mm;
  }


  /* ----------------------------------------------------------
     1. BASE DU DOCUMENT
     ---------------------------------------------------------- */

  html:has(main.partie),
  body:has(main.partie) {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;

    color: #000 !important;
    background: #fff !important;
  }

  body:has(main.partie) {
    margin: 0 !important;
    padding: 0 !important;
  }


  /* ----------------------------------------------------------
     2. ÉLÉMENTS À MASQUER
     ---------------------------------------------------------- */

  body:has(main.partie) .elementor-location-header,
  body:has(main.partie) .elementor-location-footer,
  body:has(main.partie) .elementor-popup-modal,
  body:has(main.partie) .dialog-widget-overlay,
  body:has(main.partie) #wpadminbar,

  /* Classe à ajouter aux éléments personnalisés à masquer */
  body:has(main.partie) .masquer-impression,

  /* Retour / Partager, placés avant le main */
  body:has(main.partie) .partie-header,

  /* Éventuelles autres actions */
  main.partie .partie-actions,
  main.partie .ariane,
  main.partie .share,
  main.partie a.next,
  main.partie a.partie-suivante,
  main.partie .partie-suivante,

  /* Éventuel doublon extérieur du bouton suivant */
  main.partie + a.next,

  /* Notification et boutons de copie éventuels */
  body:has(main.partie) .mesure-copy-notice,
  main.partie .mesure-copy-button {
    display: none !important;
  }


  /* ----------------------------------------------------------
     3. CONTENEURS ELEMENTOR QUI ENGLOBENT LA PARTIE

     Ne cible que les ancêtres contenant main.partie.
     Retire les contraintes de mise en page à l'écran.
     ---------------------------------------------------------- */

  body:has(main.partie) .elementor:has(main.partie),
  body:has(main.partie) .elementor-element:has(main.partie),
  body:has(main.partie) .e-con-inner:has(main.partie),
  body:has(main.partie) .elementor-container:has(main.partie),
  body:has(main.partie) .elementor-widget-wrap:has(main.partie),
  body:has(main.partie) .elementor-widget-container:has(main.partie) {
    display: block !important;
    position: static !important;
    float: none !important;

    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
    transform: none !important;
    contain: none !important;

    background: transparent !important;
    box-shadow: none !important;

    break-before: auto;
    break-after: auto;
    break-inside: auto;
  }


  /* ----------------------------------------------------------
     4. CONTENU PRINCIPAL
     ---------------------------------------------------------- */

  main.partie {
    display: block !important;
    position: static !important;
    float: none !important;

    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
    transform: none !important;

    color: #000 !important;
    background: #fff !important;
    border: 0 !important;

    font-family: Arial, sans-serif !important;
    font-size: 11pt !important;
    line-height: 1.45 !important;
  }

  main.partie *,
  main.partie *::before,
  main.partie *::after {
    box-shadow: none !important;
    text-shadow: none !important;
    animation: none !important;
    transition: none !important;
  }

  main.partie a {
    color: inherit !important;
    text-decoration: none !important;
    transform: none !important;
  }

  /* Évite les URL ajoutées automatiquement par le thème */
  main.partie a[href]::after {
    content: none !important;
  }

  /* Retire les icônes décoratives */
  main.partie .fa-slab {
    display: none !important;
  }


  /* ----------------------------------------------------------
     5. IDENTIFICATION DU DOCUMENT
     ---------------------------------------------------------- */

  main.partie::before {
    content: "L’Avenir en commun — Le programme de la Nouvelle France";

    display: block;
    margin: 0 0 5mm;
    padding: 0 0 3mm;

    color: #333;
    font-family: Arial, sans-serif;
    font-size: 9pt;
    font-weight: 400;
    line-height: 1.3;

    border-bottom: 0.5pt solid #999;

    break-inside: avoid;
    break-after: avoid;
  }


  /* ----------------------------------------------------------
     6. TITRE DE LA PARTIE
     ---------------------------------------------------------- */

  main.partie > .chapitre {
    display: block !important;

    margin: 0 0 5mm !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;

    break-inside: auto;
  }

  main.partie > h2,
  main.partie > .chapitre h2 {
    display: block !important;

    margin: 0 0 5mm !important;
    padding: 0 !important;

    color: #000 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;

    font-family: Arial, sans-serif !important;
    font-size: 21pt !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: none !important;

    break-inside: avoid;
    break-after: avoid;
  }


  /* ----------------------------------------------------------
     7. INTRODUCTION
     ---------------------------------------------------------- */

  main.partie > section:not(.tdm):not(.chapitre) {
    display: block !important;

    margin: 0 0 6mm !important;
    padding: 0 !important;

    color: #000 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;

    overflow: visible !important;
    break-inside: auto;
  }

  main.partie p,
  main.partie > section:not(.tdm):not(.chapitre) p,
  main.partie > .chapitre p {
    margin: 0 0 3mm !important;
    padding: 0 !important;

    color: #000 !important;
    font-family: Arial, sans-serif !important;
    font-size: 11pt !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;

    orphans: 3;
    widows: 3;
  }


  /* ----------------------------------------------------------
     8. SOMMAIRE DES CHAPITRES

     Ne pas masquer nav.tdm : c'est le contenu utile de la page.
     ---------------------------------------------------------- */

  main.partie nav.tdm {
    display: block !important;
    position: static !important;

    width: 100% !important;
    height: auto !important;
    margin: 6mm 0 0 !important;
    padding: 0 !important;

    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;

    break-inside: auto;
  }

  /* Carte de chapitre : autorise une coupure si elle est longue */
  main.partie nav.tdm .chapitre {
    display: block !important;

    margin: 0 0 6mm !important;
    padding: 0 !important;

    color: #000 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: visible !important;

    break-inside: auto;
  }

  /* Titre du chapitre */
  main.partie nav.tdm .chapitre h2 {
    display: block !important;

    margin: 0 0 2mm !important;
    padding: 0 0 2mm !important;

    color: #000 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 0.5pt solid #999 !important;
    border-radius: 0 !important;

    font-family: Arial, sans-serif !important;
    font-size: 13pt !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;

    break-inside: avoid;
    break-after: avoid;
  }

  /* Retire les marges négatives du lien de titre */
  main.partie nav.tdm .chapitre h2 a {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    font: inherit !important;
    color: inherit !important;
    background: transparent !important;
    border: 0 !important;

    transform: none !important;
  }

  /* Sections du chapitre */
  main.partie nav.tdm .chapitre > a {
    display: block !important;

    min-height: 0 !important;
    margin: 0 !important;
    padding: 1.5mm 0 1.5mm 4mm !important;

    color: #000 !important;
    background: transparent !important;
    border: 0 !important;

    font-family: Arial, sans-serif !important;
    font-size: 10.5pt !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;

    overflow-wrap: break-word;
    transform: none !important;

    break-inside: avoid;
  }


  /* ----------------------------------------------------------
     9. IMAGES ÉVENTUELLES
     ---------------------------------------------------------- */

  main.partie img {
    max-width: 100% !important;
    height: auto !important;
    break-inside: avoid;
  }
}



/* ============================================================
   PAGE D'UNE PARTIE — MODE CONTRASTE ÉLEVÉ
   Activé par html.contraste-eleve
   Écran uniquement : l'impression garde ses propres règles.
   ============================================================ */

@media screen {

  html.contraste-eleve body {
    background: #fff !important;
  }

  /* --- Palette générale --- */

  html.contraste-eleve :is(
    .elementor-26471,
    .elementor-26471 .elementor-element-5c6ad97d,
    .elementor-26471 main.partie
  ) {
    --ch-accent: #000 !important;
    --ch-text: #000 !important;
    --ch-border: #000 !important;
    --ch-separator: #000 !important;
    --ch-surface: #fff !important;
    --ch-tint: #f0f0f0 !important;
    --texte-secondaire: #000 !important;
    --ch-icon-secondary-opacity: 1 !important;
    --Body-large: 20px !important;

    color: #000 !important;
    background-color: #fff !important;
  }

  /* --- Typographie --- */

  html.contraste-eleve main.partie {
    letter-spacing: 0.01em;
    word-spacing: 0.08em;
    -webkit-hyphens: manual;
    -ms-hyphens: manual;
    hyphens: manual;
  }

  html.contraste-eleve main.partie p {
    line-height: 1.7;
  }

  /* --- En-tête : retour et partage --- */

  html.contraste-eleve .partie-header {
    color: #000 !important;
    background: #fff !important;
    border-bottom: 2px solid #000 !important;
  }

  html.contraste-eleve .partie-header a {
    color: #000 !important;
    background: #fff !important;
    border: 2px solid #000 !important;
    text-decoration: underline !important;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
  }

  html.contraste-eleve .partie-header a:is(:hover, :focus-visible, :active) {
    color: #fff !important;
    background: #000 !important;
  }

  /* --- Titre de la partie --- */

  html.contraste-eleve main.partie > h2 {
    color: #000 !important;
    background: #f0f0f0 !important;
    border-top: 2px solid #000 !important;
    border-bottom: 2px solid #000 !important;
    text-shadow: none !important;
    line-height: 1.4;
  }

  html.contraste-eleve main.partie > h2 .fa-slab {
    color: #000 !important;
    opacity: 1 !important;
  }

  /* --- Contenu rédactionnel --- */

  html.contraste-eleve main.partie,
  html.contraste-eleve main.partie section,
  html.contraste-eleve main.partie p {
    color: #000 !important;
    background-color: #fff !important;
  }

  html.contraste-eleve main.partie p a {
    color: #000 !important;
    text-decoration: underline !important;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
  }

  /* --- Table des matières des chapitres --- */

  html.contraste-eleve main.partie nav.tdm {
    color: #000 !important;
    background: #fff !important;
    border: 2px solid #000 !important;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre {
    color: #000 !important;
    background: #fff !important;
    border: 2px solid #000 !important;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre h2 {
    color: #000 !important;
    background: #f0f0f0 !important;
    border-top: 2px solid #000 !important;
    border-bottom: 2px solid #000 !important;
    line-height: 1.4;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre h2 a {
    color: #000 !important;
    background: transparent !important;
    font-size: 18px;
    font-weight: 700;
    text-decoration: underline !important;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre > a {
    display: block;
    color: #000 !important;
    background: #fff !important;
    border-bottom: 1px solid #000 !important;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.65;
    text-decoration: underline !important;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre > a:last-child {
    border-bottom: 0 !important;
  }

  html.contraste-eleve main.partie nav.tdm a:is(:hover, :focus-visible, :active) {
    color: #fff !important;
    background: #000 !important;
  }

  /* --- Navigation : partie suivante --- */

  html.contraste-eleve main.partie > a.next {
    color: #000 !important;
    background: #fff !important;
    border: 2px solid #000 !important;
    font-weight: 700;
    text-decoration: underline !important;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
  }

  html.contraste-eleve main.partie > a.next:is(:hover, :focus-visible, :active) {
    color: #fff !important;
    background: #000 !important;
  }

  /* --- Bloc Elementor : L'Avenir en commun --- */

  html.contraste-eleve .elementor-26471 .elementor-element-9222a73,
  html.contraste-eleve .elementor-26471 .elementor-element-9222a73 * {
    color: #000 !important;
    background-color: #fff !important;
    background-image: none !important;
    border-color: #000 !important;
  }

  html.contraste-eleve .elementor-26471 .elementor-element-9222a73 :is(h5, h6) {
    color: #000 !important;
    line-height: 1.35;
  }

  html.contraste-eleve .elementor-26471 .elementor-element-9222a73 img {
    background: none !important;
    filter: none !important;
    border: 2px solid #000 !important;
    box-shadow: none !important;
  }

  /* Bouton Table des matières */

  html.contraste-eleve .elementor-26471 .elementor-element-9222a73 .e-button-base {
    color: #000 !important;
    background: #fff !important;
    border: 2px solid #000 !important;
    padding: 8px;
  }

  html.contraste-eleve .elementor-26471 .elementor-element-9222a73 .e-button-base:is(:hover, :focus-visible) {
    color: #fff !important;
    background: #000 !important;
  }

  /* --- Images : conservation des couleurs --- */

  html.contraste-eleve .elementor-26471 img {
    filter: none !important;
  }

  /* --- Focus clavier --- */

  html.contraste-eleve .elementor-26471 :is(a, button):focus-visible {
    outline: 3px solid #000 !important;
    outline-offset: 4px !important;
  }
}


/* ============================================================
   BOUTON DE BASCULE : icône seule + infobulle
   Commun à toutes les pages
   ============================================================ */

html body button.btn-contraste {
  position: fixed;
  inset-block-end: 16px;
  inset-inline-start: 16px;
  z-index: 9999;

  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;

  font-size: 22px;
  line-height: 1;
  text-transform: none !important;
  letter-spacing: normal;

  color: #000 !important;
  background: #fff !important;
  border: 2px solid #000 !important;
  border-radius: 50%;
  box-shadow: 0 0 0 2px #fff, 0 2px 8px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

html body button.btn-contraste:is(:hover, :focus, :focus-visible, :active) {
  color: #000 !important;
  background: #fff !important;
  border-color: #000 !important;
}

html body button.btn-contraste::before {
  content: "\f042";
  font-family: var(--fa-family-slab, "Font Awesome 7 Slab") !important;
  font-weight: 400;
  font-style: normal;
  font-size: 22px;
  line-height: 1;
  color: #000;
}

html.contraste-eleve body button.btn-contraste {
  border-width: 4px !important;
}

html body button.btn-contraste::after {
  content: attr(data-tooltip);
  position: absolute;
  inset-inline-start: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  padding: 6px 10px;
  font: 600 14px/1.3 "Stack Sans Text", "Stack Sans", sans-serif;
  text-transform: none;
  white-space: nowrap;
  color: #fff;
  background: #000;
  border-radius: 6px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
}

html body button.btn-contraste:is(:hover, :focus-visible)::after {
  opacity: 1;
}

html body button.btn-contraste:focus-visible {
  outline: 3px solid #000;
  outline-offset: 4px;
}

/* ============================================================
   FINITIONS VISUELLES — PAGE D'UNE PARTIE
   À ajouter après le CSS du mode contraste élevé
   ============================================================ */

@media screen {

  /* --- Conteneur principal --- */

  html.contraste-eleve .elementor-26471 main.partie {
    border-radius: 12px;
    overflow: hidden;
  }

  /* --- Titre de la partie --- */

  html.contraste-eleve main.partie > h2 {
    padding: 28px 32px !important;
    border: 2px solid #000 !important;
    border-radius: 12px 12px 0 0;
    background: #ededed !important;
    margin-bottom: 0 !important;
  }

  html.contraste-eleve main.partie > h2 .fa-slab {
    margin-right: 12px;
  }

  /* --- Bloc de présentation / texte introductif --- */

  html.contraste-eleve main.partie > section {
    padding: 26px 32px !important;
    border: 1px solid #000 !important;
    border-top: 0 !important;
    border-radius: 0 0 12px 12px;
    background: #fff !important;
  }

  html.contraste-eleve main.partie > section p {
    margin: 0;
    line-height: 1.75;
  }

  /* --- En-tête Retour / Partager --- */

  html.contraste-eleve .partie-header {
    padding-bottom: 12px;
    margin-bottom: 24px;
    border-bottom: 2px solid #000 !important;
  }

  html.contraste-eleve .partie-header a {
    border-radius: 9px;
    padding: 10px 18px;
    transition: background-color 0.15s ease,
                color 0.15s ease;
  }

  /* --- Table des matières --- */

  html.contraste-eleve main.partie nav.tdm {
    border: 0 !important;
    background: transparent !important;
    display: flex;
    flex-direction: column;
    gap: 22px;
    margin-top: 32px;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre {
    border: 2px solid #000 !important;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: none !important;
    background: #fff !important;
  }

  /* Titre de chaque chapitre */

  html.contraste-eleve main.partie nav.tdm .chapitre h2 {
    margin: 0 !important;
    padding: 18px 24px !important;
    border: 0 !important;
    border-bottom: 2px solid #000 !important;
    background: #ededed !important;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre h2 a {
    text-decoration-thickness: 2px;
    text-underline-offset: 0.22em;
  }

  /* Liens des chapitres */

  html.contraste-eleve main.partie nav.tdm .chapitre > a {
    padding: 15px 24px !important;
    border: 0 !important;
    border-bottom: 1px solid #aaa !important;
    background: #fff !important;
    transition: background-color 0.15s ease,
                color 0.15s ease;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre > a:last-child {
    border-bottom: 0 !important;
  }

  html.contraste-eleve main.partie nav.tdm .chapitre > a:hover {
    background: #ededed !important;
    color: #000 !important;
  }

  /* --- Bouton Partie suivante --- */

  html.contraste-eleve main.partie > a.next {
    display: inline-block;
    margin-top: 28px;
    padding: 13px 22px;
    border-radius: 9px;
    transition: background-color 0.15s ease,
                color 0.15s ease;
  }

  /* --- Bloc supérieur Elementor --- */

  html.contraste-eleve .elementor-26471 .elementor-element-9222a73 {
    border: 1px solid #000 !important;
    border-radius: 12px !important;
  }

  html.contraste-eleve .elementor-26471 .elementor-element-9222a73 .e-button-base {
    border-radius: 8px !important;
    padding: 12px 18px !important;
  }

  /* --- Transitions réduites si demandé par le système --- */

  @media (prefers-reduced-motion: reduce) {
    html.contraste-eleve .partie-header a,
    html.contraste-eleve main.partie nav.tdm a,
    html.contraste-eleve main.partie > a.next {
      transition: none !important;
    }
  }
}


@media (prefers-reduced-motion: reduce) {
  html body button.btn-contraste::after {
    transition: none;
  }
}

@media print {
  .btn-contraste {
    display: none !important;
  }
}/* End custom CSS */