/*
Theme Name: Expatriation Lucide
Theme URI: https://expatriationlucide.com
Author: Thomas Schaevers EI
Description: Thème bloc sur mesure d’Expatriation Lucide. Tout le contenu est composé de blocs natifs, modifiables dans l’éditeur de WordPress.
Version: 1.0.8
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: expatriation-lucide
*/

/* ==========================================================================
   Expatriation Lucide — feuille de style de la maquette
   Registre relevé sur la landing page « faire-le-point » :
   Inter seule, un bleu unique, fonds froids, panneaux blancs arrondis.
   ========================================================================== */

:root {
  --nuit: #06153D;
  --bleu: #005BFF;
  --bleu-survol: #0046C7;
  --bleu-pale: #EAF1FF;
  --bleu-voile: #DCE8FB;
  --blanc: #FFFFFF;
  --fond: #F8FAFD;
  --gris: #515856;
  --bordure: #E5EAF3;
  --bordure-2: #EAECED;

  --police: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  --conteneur: 1152px;
  --gouttiere: 32px;
  --r-panneau: 32px;
  --r-carte: 20px;
  --r-petit: 12px;
  --r-bouton: 8px;

  --ombre-photo: 0 40px 80px -40px rgba(6, 21, 61, .35);
}

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

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

body {
  margin: 0;
  font-family: var(--police);
  font-size: 18px;
  line-height: 1.6;
  color: var(--nuit);
  background: var(--blanc);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { display: block; max-width: 100%; height: auto; }

a { color: var(--bleu); text-decoration: none; }
a:hover { color: var(--bleu-survol); }

h1,
h2,
h3,
h4 {
  margin: 0;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.12;
  color: var(--nuit);
  hyphens: none;
  text-wrap: balance;
}

h1 { font-size: 48px; line-height: 1.08; }
h2 { font-size: 40px; }
h3 { font-size: 22px; line-height: 1.25; letter-spacing: -0.01em; }

p { margin: 0; text-wrap: pretty; }

mark { color: var(--bleu); }

.conteneur {
  width: 100%;
  max-width: calc(var(--conteneur) + 2 * var(--gouttiere));
  margin-inline: auto;
  padding-inline: var(--gouttiere);
}

.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* --------------------------------------------------------------------------
   Boutons — 8 px d'arrondi, graisse 500, comme la référence
   -------------------------------------------------------------------------- */

.boutons { display: flex; flex-wrap: wrap; gap: 14px; }
.boutons.centre { justify-content: center; }

.bouton > .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 14px 26px;
  border: 2px solid var(--bleu);
  border-radius: var(--r-bouton);
  background: var(--bleu);
  color: var(--blanc);
  font: 500 16px/1.3 var(--police);
  text-align: center;
  transition: background-color .2s, border-color .2s, color .2s;
}
.bouton > .wp-block-button__link:hover { background: var(--bleu-survol); border-color: var(--bleu-survol); color: var(--blanc); }

.bouton.contour > .wp-block-button__link { background: var(--blanc); color: var(--bleu); }
.bouton.contour > .wp-block-button__link:hover { background: var(--bleu-pale); color: var(--bleu-survol); border-color: var(--bleu-survol); }

.bouton.petit > .wp-block-button__link { min-height: 44px; padding: 10px 20px; font-size: 15px; }

.lien-fleche {
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 500; font-size: 16px;
}

/* --------------------------------------------------------------------------
   Pastilles, surtitres, icônes
   -------------------------------------------------------------------------- */

.surtitre {
  display: inline-block;
  margin-bottom: 18px;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .01em;
  color: var(--bleu);
}

.badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 14px;
  border-radius: var(--r-bouton);
  background: var(--bleu-pale);
  color: var(--bleu);
  font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   En-tête
   -------------------------------------------------------------------------- */

.entete {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  background: rgba(248, 250, 253, .92);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  backdrop-filter: saturate(1.4) blur(12px);
  border-bottom: 1px solid var(--bordure-2);
}

.entete .conteneur {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  min-height: 84px;
}

/* Logo : une seule image, remplaçable en un clic (bloc « Logo du site » dans WordPress) */

/* --------------------------------------------------------------------------
   Héros — bande bleu pâle à la carte du monde, photo à cheval
   -------------------------------------------------------------------------- */

.heros {
  position: relative;
  padding-top: 96px;
  background: var(--blanc);
  text-align: center;
  isolation: isolate;
}
.heros::before {
  content: "";
  position: absolute; inset: 0 0 260px 0; z-index: -1;
  background: var(--bleu-voile) url("assets/img/fond-carte-du-monde.jpg") center / cover no-repeat;
}

.heros .methode-mots {
  display: inline-flex; align-items: center; gap: 12px;
  margin-bottom: 26px;
  font-size: 17px; font-weight: 500; color: var(--bleu);
}
.heros .methode-mots i {
  width: 5px; height: 5px; border-radius: 50%; background: var(--bleu); opacity: .55;
}

.heros h1 { max-width: 880px; margin-inline: auto; }

.heros .chapo {
  max-width: 760px; margin: 24px auto 0;
  font-size: 20px; line-height: 1.55; color: var(--nuit);
}

.heros .boutons { margin-top: 36px; }

.heros .contexte {
  max-width: 640px; margin: 22px auto 0;
  font-size: 15px; line-height: 1.6; color: var(--gris);
}

.heros-visuel {
  position: relative;
  max-width: 1040px;
  margin: 64px auto 0;
}
.heros-visuel .photo img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--r-panneau);
  box-shadow: var(--ombre-photo);
}

.signature {
  position: absolute; left: -32px; bottom: 40px;
  display: flex; align-items: center; gap: 16px;
  max-width: 360px;
  padding: 18px 22px 18px 18px;
  background: var(--blanc);
  border: 1px solid var(--bordure);
  border-radius: var(--r-carte);
  box-shadow: 0 24px 48px -24px rgba(6, 21, 61, .28);
  text-align: left;
}
.signature img { width: 52px; height: 52px; mix-blend-mode: multiply; flex: none; }
.signature p { font-size: 16px; font-weight: 500; line-height: 1.4; color: var(--nuit); }

/* --------------------------------------------------------------------------
   Sections — rythme
   -------------------------------------------------------------------------- */

.section { padding-block: 128px; }
.section.fond { background: var(--fond); }
.section.serre { padding-block: 88px; }

.entete-section { max-width: 760px; margin: 0 auto 56px; text-align: center; }
.entete-section p { margin-top: 20px; font-size: 18px; color: var(--gris); }
.entete-section p.fort { color: var(--nuit); }

/* Pourquoi — colonne étroite, texte de lecture */

.pourquoi { text-align: center; }
.pourquoi .lecture { max-width: 1040px; margin-inline: auto; }
.pourquoi h2 mark { white-space: nowrap; }
.pourquoi h2 { margin-bottom: 40px; }
.pourquoi .intro { font-size: 18px; font-weight: 500; color: var(--gris); }

.enjeux {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
  max-width: 860px; margin: 36px auto;
  padding: 0; list-style: none;
}
.enjeux li {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 18px;
  border: 1px solid var(--bordure);
  border-radius: var(--r-petit);
  background: var(--blanc);
  font-size: 16px; font-weight: 500; color: var(--nuit);
}
.enjeux li::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--bleu);
}
.pourquoi .suite { font-size: 18px; color: var(--gris); }
.pourquoi .conclusion {
  max-width: 720px; margin: 28px auto 0;
  font-size: 20px; line-height: 1.55; font-weight: 500;
}

/* Méthode — six axes */

.methode h2 .point { color: var(--bleu); }

.axes {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
  margin: 0; padding: 0; list-style: none;
  counter-reset: axe;
}
.axe {
  position: relative;
  padding: 32px 30px 34px;
  background: var(--blanc);
  border: 1px solid var(--bordure);
  border-radius: var(--r-carte);
  counter-increment: axe;
  transition: border-color .2s, transform .2s;
}
.axe:hover { border-color: #C9D8F5; transform: translateY(-2px); }
.axe { text-align: center; }
.axe .tete { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-bottom: 14px; }
.axe .numero { font-size: 14px; font-weight: 600; color: var(--bleu); letter-spacing: .04em; }
.axe h3 { margin-bottom: 10px; }
.axe p { font-size: 16px; line-height: 1.6; color: var(--gris); }

.section-cta { margin-top: 48px; text-align: center; }

/* À qui — deux colonnes, alignée à gauche */

.cible {
  display: grid; grid-template-columns: 5fr 6fr; gap: 72px; align-items: start;
}
.cible .texte { position: sticky; top: 132px; }
.cible h2 { margin-bottom: 24px; }
.cible .texte p { font-size: 18px; color: var(--gris); }
.cible .texte .boutons { margin-top: 32px; }

.situations { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.situations li {
  display: flex; align-items: center; gap: 20px;
  padding: 22px 26px;
  background: var(--blanc);
  border: 1px solid var(--bordure);
  border-radius: var(--r-carte);
  font-size: 17px; line-height: 1.5; color: var(--nuit);
}

/* Offres */

.offres {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: stretch;
}
.offre {
  display: flex; flex-direction: column;
  padding: 14px 14px 30px;
  background: var(--blanc);
  border: 1px solid var(--bordure);
  border-radius: var(--r-panneau);
}
.offre .visuel img {
  width: 100%; aspect-ratio: 16 / 10; object-fit: cover;
  border-radius: var(--r-carte);
}
.offre .corps { display: flex; flex-direction: column; flex: 1; padding: 26px 16px 0; }
.offre h3 { font-size: 26px; text-align: center; }
.offre .prix,
.offre .pitch { text-align: center; }
.offre .prix { margin-top: 8px; font-size: 22px; font-weight: 600; color: var(--bleu); letter-spacing: -0.01em; }
.offre .prix em { font-size: 15px; font-weight: 500; }
.offre .pitch { margin-top: 14px; font-size: 16px; line-height: 1.55; color: var(--gris); }
.offre .inclus-titre {
  margin: 24px 0 12px; padding-top: 22px; border-top: 1px solid var(--bordure);
  font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--nuit);
}
.inclus { display: grid; gap: 10px; margin: 0 0 28px; padding: 0; list-style: none; }
.inclus li { display: flex; gap: 12px; font-size: 15.5px; line-height: 1.45; color: var(--nuit); }

.offre.mise-en-avant { border-color: var(--bleu); box-shadow: 0 0 0 1px var(--bleu); }
.offre .etiquette {
  position: absolute; top: 28px; left: 28px;
}
.offre { position: relative; }

/* Webinaire — grand panneau blanc encarté */

.panneau {
  background: var(--blanc);
  border: 1px solid var(--bordure);
  border-radius: var(--r-panneau);
  overflow: hidden;
}

.webinaire {
  display: grid; grid-template-columns: 1fr 1fr; align-items: stretch;
}
.webinaire .media { position: relative; min-height: 100%; }
.webinaire .media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%;
}
.webinaire .contenu { padding: 64px 60px; }
.webinaire h2 { margin: 22px 0 20px; font-size: 38px; }
.webinaire .contenu > p { font-size: 18px; color: var(--gris); }

.infos {
  display: grid; gap: 12px; margin: 30px 0 34px; padding: 0; list-style: none;
}
.infos li { display: flex; align-items: center; gap: 14px; font-size: 16px; font-weight: 500; color: var(--nuit); }

/* Test gratuit — bande bleu pâle, écho du héros */

.test {
  position: relative; isolation: isolate;
  background: var(--bleu-voile) url("assets/img/fond-carte-du-monde.jpg") center / cover no-repeat;
}
.test-grille {
  display: grid; grid-template-columns: 6fr 5fr; gap: 64px; align-items: center;
}
.test h2 { margin-bottom: 22px; }
.test .texte > p { font-size: 19px; color: var(--nuit); }
.test .boutons { margin-top: 32px; }
.test .texte > p.mention { margin-top: 18px; max-width: 520px; font-size: 14px; line-height: 1.55; color: var(--gris); }

.apercu {
  padding: 32px 32px 28px;
  background: var(--blanc);
  border: 1px solid var(--bordure);
  border-radius: var(--r-panneau);
  box-shadow: 0 40px 80px -48px rgba(6, 21, 61, .4);
}
.apercu-tete { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 22px; }
.apercu-tete strong { font-size: 17px; font-weight: 600; }
.apercu-tete span { font-size: 13px; color: var(--gris); }
.jauges { display: grid; gap: 15px; margin: 0; padding: 0; list-style: none; }
.jauges li { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; font-size: 15px; font-weight: 500; }
.jauges .barre { grid-column: 1 / -1; height: 8px; border-radius: 4px; background: var(--bleu-pale); overflow: hidden; }
.jauges .barre i { display: block; height: 100%; border-radius: inherit; background: var(--bleu); }
.jauges .etat { font-size: 13px; font-weight: 500; color: var(--gris); }
.apercu-pied {
  display: flex; align-items: center; gap: 10px;
  margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--bordure);
  font-size: 14px; color: var(--gris);
}

/* À propos — panneau blanc, photo + texte */

.apropos {
  display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: center;
  padding: 48px;
}
.apropos .portrait img {
  width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%;
  border-radius: var(--r-carte);
}
.apropos h2 { margin: 0 0 24px; }
.apropos .texte p { font-size: 18px; color: var(--nuit); }
.apropos .texte p + p { margin-top: 16px; }
.apropos .texte mark { font-weight: 600; }
.apropos .boutons { margin-top: 32px; }

.chiffres {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
  margin: 28px 0 0; padding: 0; list-style: none;
}
.chiffres li {
  padding: 16px 14px;
  border: 1px solid var(--bordure); border-radius: var(--r-petit);
  background: var(--fond);
}
.chiffres strong { display: block; font-size: 24px; font-weight: 600; color: var(--bleu); letter-spacing: -0.02em; line-height: 1.1; }
.chiffres span { display: block; margin-top: 4px; font-size: 13px; line-height: 1.35; color: var(--gris); }

/* Bandeau final */

.final { text-align: center; }
.final h2 { max-width: 760px; margin: 0 auto 18px; }
.final p { max-width: 620px; margin: 0 auto; color: var(--gris); }
.final .boutons { margin-top: 32px; }

/* --------------------------------------------------------------------------
   Pages internes — composants complémentaires
   -------------------------------------------------------------------------- */

/* Héros de page sans photo : la bande carte du monde occupe toute la hauteur */
.heros.sans-visuel { padding-bottom: 104px; }
.heros.sans-visuel::before { bottom: 0; }
.heros .badge { margin-bottom: 22px; }
.heros .surtitre { margin-bottom: 16px; }

.infos-ligne {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px;
  margin: 28px 0 0; padding: 0; list-style: none;
}
.infos-ligne li { display: inline-flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 500; color: var(--nuit); }

.note-cta { max-width: 560px; margin: 16px auto 0; font-size: 14px; line-height: 1.55; color: var(--gris); }

/* À propos — biographie */
.bio { display: grid; grid-template-columns: 7fr 5fr; gap: 72px; align-items: start; }
.bio .texte p { font-size: 18px; line-height: 1.7; color: var(--nuit); }
.bio .texte p + p { margin-top: 18px; }
.bio .texte .secondaire { color: var(--gris); }
.bio .texte mark { font-weight: 600; }
.bio .texte .chute { margin-top: 28px; padding-left: 20px; border-left: 3px solid var(--bleu); font-size: 20px; font-weight: 600; color: var(--bleu); }
.bio .colonne-photo { position: sticky; top: 124px; }
.bio .portrait img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%; border-radius: var(--r-panneau); }
.bio .chiffres { margin-top: 16px; grid-template-columns: repeat(2, 1fr); }

/* Ce que je fais / ce que je ne fais pas */
.role { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.role .carte {
  padding: 40px 40px 44px;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-panneau);
}
.role h3 { margin-bottom: 24px; font-size: 24px; }
.liste-coches { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.liste-coches li { display: flex; gap: 14px; align-items: flex-start; font-size: 17px; line-height: 1.5; color: var(--nuit); }
.liste-coches.non li { color: var(--gris); }
.role-note { max-width: 760px; margin: 40px auto 0; text-align: center; font-size: 17px; color: var(--gris); }

/* Méthode — les trois temps */
.temps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; padding: 0; list-style: none; }
.temps .item {
  padding: 36px 32px 38px; text-align: center;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-carte);
}
.temps .numero { display: block; margin-bottom: 14px; font-size: 40px; font-weight: 600; line-height: 1; letter-spacing: -0.02em; color: var(--bleu); }
.temps h3 { margin-bottom: 12px; font-size: 26px; }
.temps p { font-size: 16px; line-height: 1.6; color: var(--gris); }

/* Méthode — axes détaillés, cartes horizontales */
.axes-liste { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 0; padding: 0; list-style: none; }
.axes-liste .item {
  display: flex; gap: 24px; align-items: flex-start;
  padding: 30px 32px;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-carte);
}
.axes-liste .numero { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; letter-spacing: .04em; color: var(--bleu); }
.axes-liste h3 { margin-bottom: 8px; }
.axes-liste p { font-size: 16px; line-height: 1.6; color: var(--gris); }

/* Encart de positionnement */
.encart {
  max-width: 920px; margin-inline: auto; padding: 56px 64px; text-align: center;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-panneau);
}
.encart h2 { margin-bottom: 20px; font-size: 34px; }
.encart p { font-size: 18px; color: var(--gris); }
.encart p + p { margin-top: 14px; }
.encart p.fort { color: var(--nuit); font-weight: 500; }

/* Accompagnements — offre détaillée */
.offres-detail { display: grid; gap: 28px; }
.offre-detail {
  display: grid; grid-template-columns: 5fr 7fr; gap: 0;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-panneau);
  overflow: hidden;
}
.offre-detail .tete-offre { display: flex; flex-direction: column; padding: 16px 16px 36px; border-right: 1px solid var(--bordure); text-align: center; }
.offre-detail .visuel img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--r-carte); }
.offre-detail .niveau { margin-top: 26px; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gris); }
.offre-detail h2 { margin-top: 6px; font-size: 32px; }
.offre-detail .prix { margin-top: 8px; font-size: 26px; font-weight: 600; color: var(--bleu); letter-spacing: -0.01em; }
.offre-detail .prix em { font-size: 15px; font-weight: 500; }
.offre-detail .corps-offre { padding: 44px 48px; }
.offre-detail .bloc + .bloc { margin-top: 26px; }
.offre-detail .bloc h3 {
  margin-bottom: 8px;
  font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--bleu);
}
.offre-detail .bloc p { font-size: 17px; line-height: 1.6; color: var(--nuit); }
.offre-detail .inclus { grid-template-columns: 1fr 1fr; gap: 10px 24px; margin: 0; }

.reassurance {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  max-width: 760px; margin: 40px auto 0; text-align: left;
  font-size: 16px; color: var(--gris);
}

/* Déroulé de l'accompagnement */
.etapes { max-width: 880px; margin: 0 auto; padding: 24px 48px; list-style: none; }
.etapes .item { display: grid; grid-template-columns: 64px 1fr; gap: 8px 16px; padding: 24px 0; }
.etapes .item + .item { border-top: 1px solid var(--bordure); }
.etapes .numero { grid-row: span 2; font-size: 28px; font-weight: 600; line-height: 1.1; color: var(--bleu); letter-spacing: -0.02em; }
.etapes h3 { font-size: 20px; }
.etapes p { font-size: 16px; line-height: 1.6; color: var(--gris); }

/* Questions fréquentes */
.faq { max-width: 880px; margin: 0 auto; padding: 16px 48px; }
.faq details { border-bottom: 1px solid var(--bordure); }
.faq details:last-child { border-bottom: 0; }
.faq summary {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 24px 0; cursor: pointer; list-style: none;
  font-size: 18px; font-weight: 600; color: var(--nuit);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; flex: none; width: 12px; height: 12px; margin-right: 4px;
  border-right: 2px solid var(--bleu); border-bottom: 2px solid var(--bleu);
  transform: translateY(-3px) rotate(45deg); transition: transform .2s;
}
.faq details[open] summary::after { transform: translateY(3px) rotate(-135deg); }
.faq details > div { padding: 0 0 24px; }
.faq details p { font-size: 17px; line-height: 1.65; color: var(--gris); }
.faq details p + p { margin-top: 10px; }

/* Contact */
.contact-grille { display: grid; grid-template-columns: 7fr 5fr; gap: 24px; align-items: stretch; }
.carte-contact {
  display: flex; flex-direction: column; align-items: flex-start;
  padding: 44px 44px 46px;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-panneau);
}
.carte-contact h2 { margin-bottom: 14px; font-size: 30px; }
.carte-contact p { font-size: 17px; color: var(--gris); }
.carte-contact.principale { border-color: var(--bleu); box-shadow: 0 0 0 1px var(--bleu); }

.reseaux-ligne { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 0; padding: 0; list-style: none; }
.reseaux-ligne a {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 20px; border: 1px solid var(--bordure); border-radius: var(--r-petit);
  background: var(--blanc); font-size: 16px; font-weight: 500;
}

/* Bloc photo + texte (pages internes) */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.duo .photo-duo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-panneau); }
.duo h2 { margin-bottom: 20px; }
.duo .texte > p { font-size: 18px; color: var(--gris); }
.duo .texte > p + p { margin-top: 14px; }
.duo .boutons { margin-top: 30px; }

/* Intervenant (webinaire) */
.intervenant { display: grid; grid-template-columns: 280px 1fr; gap: 48px; align-items: center; max-width: 920px; margin-inline: auto; padding: 32px; }
.intervenant .portrait img { width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 25%; border-radius: var(--r-carte); }
.intervenant h2 { margin-bottom: 14px; font-size: 34px; }
.intervenant .texte p { font-size: 18px; color: var(--gris); margin-bottom: 20px; }
.intervenant .texte mark { font-weight: 600; }

/* Contact — interlocuteur */
.avatar { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.avatar img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 30%; }
.avatar strong { display: block; font-size: 17px; font-weight: 600; color: var(--nuit); }
.avatar span { display: block; font-size: 14px; color: var(--gris); }

/* À propos — Thaïlande */
.duo.thailande { grid-template-columns: 5fr 7fr; align-items: center; }
.photo-legende { position: relative; margin: 0; }
.duo.thailande .photo-duo img { aspect-ratio: 4 / 5; object-position: 50% 30%; }
.photo-legende figcaption {
  position: absolute; left: 20px; bottom: 20px;
  padding: 8px 14px; border-radius: var(--r-bouton);
  background: var(--blanc); border: 1px solid var(--bordure);
  font-size: 14px; font-weight: 500; color: var(--nuit);
}
.duo .texte > p.fonce { color: var(--nuit); }
.duo .texte .chute { margin-top: 24px; padding-left: 20px; border-left: 3px solid var(--bleu); font-size: 20px; font-weight: 600; color: var(--bleu); }

/* Pages légales */
.texte-legal { max-width: 800px; margin-inline: auto; }
.texte-legal .maj { margin-bottom: 40px; font-size: 15px; color: var(--gris); }
.texte-legal h2 { margin: 48px 0 16px; font-size: 26px; }
.texte-legal h2:first-of-type { margin-top: 0; }
.texte-legal h3 { margin: 28px 0 10px; font-size: 19px; }
.texte-legal p,
.texte-legal li { font-size: 17px; line-height: 1.7; color: var(--nuit); }
.texte-legal p + p { margin-top: 12px; }
.texte-legal ul { margin: 12px 0; padding-left: 22px; }
.texte-legal li + li { margin-top: 6px; }
.texte-legal .a-completer { padding: 2px 8px; border-radius: 6px; background: #FFF4D6; color: #6B4E00; font-weight: 600; }
.texte-legal .cadre {
  margin: 20px 0; padding: 22px 26px;
  background: var(--fond); border: 1px solid var(--bordure); border-radius: var(--r-petit);
}
.texte-legal table { width: 100%; margin: 16px 0; border-collapse: collapse; font-size: 15.5px; }
.texte-legal th,
.texte-legal td { padding: 12px 14px; border: 1px solid var(--bordure); text-align: left; vertical-align: top; line-height: 1.5; }
.texte-legal th { background: var(--fond); font-weight: 600; }

/* --------------------------------------------------------------------------
   Navigation — sous-menu Accompagnements
   -------------------------------------------------------------------------- */
/* zone de passage entre le lien et le panneau, pour que le survol ne se rompe pas */

/* Ancres des offres : ne pas passer sous l'en-tête collant */
[id] { scroll-margin-top: 110px; }

/* --------------------------------------------------------------------------
   Méthode — variante A : liste éditoriale
   -------------------------------------------------------------------------- */

.piliers-liste { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start; }
.piliers-liste .colonne { position: sticky; top: 128px; }
.piliers-liste h2 { margin-bottom: 22px; font-size: 36px; }
.piliers-liste .colonne > p { max-width: 440px; font-size: 18px; color: var(--gris); }
.piliers-liste .visuel-methode img {
  width: 100%; aspect-ratio: 5 / 4; object-fit: cover; margin-top: 36px;
  border-radius: var(--r-panneau);
}
.piliers-liste .lien-fleche { margin-top: 28px; }
.liste-piliers { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--bordure); }
.liste-piliers .item { padding: 30px 0 32px; border-bottom: 1px solid var(--bordure); }
.liste-piliers h3 { display: flex; align-items: baseline; gap: 14px; margin-bottom: 10px; font-size: 22px; }
h3 > mark {
  flex: none; font-size: 14px; font-weight: 500; letter-spacing: .02em; color: var(--bleu);
  font-variant-numeric: tabular-nums;
}
.liste-piliers p { max-width: 560px; font-size: 17px; line-height: 1.65; color: var(--gris); }

/* --------------------------------------------------------------------------
   Méthode — variante B : photo et cartes compactes
   -------------------------------------------------------------------------- */

.piliers-photo { position: relative; }
.piliers-photo .bandeau img {
  width: 100%; aspect-ratio: 21 / 8; object-fit: cover; object-position: 50% 45%;
  border-radius: var(--r-panneau);
}
.cartes-piliers {
  position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin: -96px 40px 0; padding: 0; list-style: none;
}
.cartes-piliers .item {
  padding: 30px 30px 32px;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-carte);
}
.cartes-piliers h3 { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; font-size: 20px; }
.cartes-piliers p { font-size: 16px; line-height: 1.6; color: var(--gris); }

/* Page de comparaison des variantes */

/* --------------------------------------------------------------------------
   Accueil — aperçu des accompagnements, échange direct
   -------------------------------------------------------------------------- */

.apercu-offres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 0; padding: 0; list-style: none; }
.apercu-offres .item {
  display: flex; flex-direction: column;
  padding: 14px 14px 28px;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-panneau);
}
.apercu-offres img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--r-carte); }
.apercu-offres .corps { display: flex; flex-direction: column; flex: 1; padding: 24px 14px 0; }
.apercu-offres h3 { font-size: 24px; }
.apercu-offres .prix { margin-top: 6px; font-size: 19px; font-weight: 600; color: var(--bleu); }
.apercu-offres .prix em { font-size: 14px; font-weight: 500; }
.apercu-offres p.pitch { margin: 12px 0 22px; font-size: 16px; line-height: 1.55; color: var(--gris); }
.apercu-offres .lien-fleche { margin-top: auto; }

.parler { display: grid; grid-template-columns: 300px 1fr; gap: 56px; align-items: center; max-width: 980px; margin-inline: auto; padding: 32px; }
.parler .portrait img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 18%; border-radius: var(--r-carte); }
.parler h2 { margin-bottom: 16px; font-size: 36px; }
.parler .texte > p { font-size: 18px; color: var(--gris); }
.parler .signature-texte { margin-top: 18px; font-size: 15px; color: var(--nuit); }
.parler .signature-texte strong { font-weight: 600; }
.parler .boutons { margin-top: 28px; align-items: center; gap: 24px; }

/* --------------------------------------------------------------------------
   Encadré test gratuit (fin de page, fin d'article)
   -------------------------------------------------------------------------- */

.fin-test {
  max-width: 920px; margin-inline: auto; padding: 56px 64px; text-align: center;
  background: var(--blanc) url("assets/img/fond-carte-du-monde.jpg") center / cover no-repeat;
  border: 1px solid var(--bordure); border-radius: var(--r-panneau);
}
.fin-test h2 { margin: 20px auto 16px; max-width: 680px; font-size: 34px; }
.fin-test p { max-width: 620px; margin-inline: auto; font-size: 18px; color: var(--nuit); }
.fin-test .boutons { margin-top: 30px; }
.fin-test .secondaire { margin-top: 22px; font-size: 15px; color: var(--gris); }
.fin-test .secondaire a { font-weight: 500; }

/* --------------------------------------------------------------------------
   Page Test gratuit — bloc pleine largeur
   -------------------------------------------------------------------------- */

.test-plein { text-align: center; }
.test-plein h1 { max-width: 900px; margin: 0 auto; }
.test-plein .chapo { max-width: 760px; margin: 24px auto 0; font-size: 20px; line-height: 1.55; color: var(--gris); }
.test-plein .boutons { margin-top: 36px; }
.test-plein .bouton > .wp-block-button__link { min-height: 58px; padding-inline: 34px; font-size: 17px; }
.test-plein .details {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px;
  margin: 28px 0 0; padding: 0; list-style: none;
  font-size: 15px; font-weight: 500; color: var(--nuit);
}
.test-plein .details li { display: inline-flex; align-items: center; gap: 8px; }
.test-plein .note-cta { margin-top: 22px; }
.apercu.centre { max-width: 640px; margin-inline: auto; }

/* --------------------------------------------------------------------------
   Contact — formulaire
   -------------------------------------------------------------------------- */

.contact-formulaire { display: grid; grid-template-columns: 7fr 5fr; gap: 32px; align-items: start; }
.formulaire {
  display: grid; grid-template-columns: 1fr 1fr; gap: 20px 20px;
  padding: 44px;
  background: var(--blanc); border: 1px solid var(--bordure); border-radius: var(--r-panneau);
}
.formulaire h2 { grid-column: 1 / -1; font-size: 28px; }
.formulaire .intro { grid-column: 1 / -1; margin-top: -8px; font-size: 16px; color: var(--gris); }
.champ { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.champ.large { grid-column: 1 / -1; }
.champ label { font-size: 14px; font-weight: 600; color: var(--nuit); }
.champ input,
.champ select,
.champ textarea {
  width: 100%; padding: 13px 14px;
  border: 1px solid var(--bordure); border-radius: var(--r-bouton);
  background: var(--blanc); color: var(--nuit);
  font: 400 16px/1.4 var(--police);
  transition: border-color .15s, box-shadow .15s;
}
.champ select {
  appearance: none; -webkit-appearance: none; padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 18px;
}
.champ textarea { min-height: 150px; resize: vertical; }
.champ input:focus,
.champ select:focus,
.champ textarea:focus { outline: none; border-color: var(--bleu); box-shadow: 0 0 0 3px var(--bleu-pale); }
.consentement { grid-column: 1 / -1; display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.5; color: var(--gris); }
.consentement input { width: 18px; height: 18px; margin-top: 2px; flex: none; accent-color: var(--bleu); }
.formulaire .envoi { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.formulaire .bouton > .wp-block-button__link { border: 0; cursor: pointer; }
.message-envoi { font-size: 15px; font-weight: 500; color: var(--bleu); }

.colonne-contact { display: grid; gap: 20px; }
.colonne-contact .carte-contact { padding: 34px 32px 36px; }
.colonne-contact .carte-contact h2 { font-size: 24px; }
.colonne-contact .carte-contact p { font-size: 16px; }
.colonne-contact .reseaux-ligne { justify-content: flex-start; margin-top: 18px; }

/* --------------------------------------------------------------------------
   Blog — liste et article
   -------------------------------------------------------------------------- */

.categories { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 28px 0 0; padding: 0; list-style: none; }
.categories a {
  display: inline-block; padding: 8px 14px;
  border: 1px solid var(--bordure); border-radius: var(--r-bouton);
  background: var(--blanc); font-size: 14px; font-weight: 500; color: var(--nuit);
}
.categories a:hover,
.categories a[aria-current="page"] { border-color: var(--bleu); color: var(--bleu); }

.grille-articles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin: 0; padding: 0; list-style: none; }
.carte-article { display: flex; flex-direction: column; min-width: 0; }
.carte-article .vignette { display: block; overflow: hidden; border-radius: var(--r-carte); }
.carte-article .vignette img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .4s; }
.carte-article:hover .vignette img { transform: scale(1.03); }
.meta-article { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 20px; font-size: 14px; color: var(--gris); }
.meta-article .categorie { font-weight: 600; color: var(--bleu); }
.meta-article .point { width: 3px; height: 3px; border-radius: 50%; background: var(--gris); opacity: .6; }
.carte-article h2,
.carte-article h3 { margin-top: 10px; font-size: 22px; line-height: 1.3; }
.carte-article h2 a,
.carte-article h3 a { color: var(--nuit); }
.carte-article h2 a:hover,
.carte-article h3 a:hover { color: var(--bleu); }
.carte-article p { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--gris); }
.carte-article .lien-fleche { margin-top: 16px; }

.article-tete { max-width: 820px; margin-inline: auto; text-align: center; }
.article-tete .meta-article { justify-content: center; margin: 0 0 20px; }
.article-tete h1 { font-size: 46px; }
.article-tete .chapo { max-width: 720px; margin: 22px auto 0; font-size: 20px; line-height: 1.55; color: var(--gris); }
.article-image { max-width: 1040px; margin: 56px auto 0; }
.article-image img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--r-panneau); }

.article-corps { max-width: 720px; margin-inline: auto; }
.article-corps > * + * { margin-top: 20px; }
.article-corps p,
.article-corps li { font-size: 18px; line-height: 1.75; color: var(--nuit); }
.article-corps h2 { margin-top: 52px; font-size: 30px; }
.article-corps h3 { margin-top: 36px; font-size: 22px; }
.article-corps ul,
.article-corps ol { padding-left: 24px; }
.article-corps li + li { margin-top: 8px; }
.article-corps blockquote {
  margin: 36px 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--bleu);
  font-size: 21px; line-height: 1.55; font-weight: 500; color: var(--nuit);
}
.article-corps .encadre {
  padding: 24px 28px; background: var(--fond); border: 1px solid var(--bordure); border-radius: var(--r-petit);
}
.article-corps .encadre p { font-size: 16px; color: var(--gris); }

.auteur {
  display: flex; gap: 20px; align-items: center; max-width: 720px; margin: 56px auto 0;
  padding-top: 32px; border-top: 1px solid var(--bordure);
}
.auteur img { width: 72px; height: 72px; flex: none; border-radius: 50%; object-fit: cover; object-position: 50% 25%; }
.auteur strong { display: block; font-size: 17px; font-weight: 600; color: var(--nuit); }
.auteur p { font-size: 15px; line-height: 1.55; color: var(--gris); }

/* --------------------------------------------------------------------------
   Pied de page
   -------------------------------------------------------------------------- */

.pied {
  background: var(--fond);
  border-top: 1px solid var(--bordure-2);
  color: var(--gris);
  font-size: 15px;
}
.pied .grille {
  display: grid; grid-template-columns: 4fr 2fr 3fr 2fr; gap: 48px;
  padding-block: 72px 48px;
}
.pied p { line-height: 1.65; }
.pied h4 {
  margin-bottom: 16px;
  font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--nuit);
}
.pied ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.pied a { color: var(--bleu); }
.pied a:hover { color: var(--bleu-survol); text-decoration: underline; text-underline-offset: 3px; }
.reseaux a { display: inline-flex; align-items: center; gap: 10px; }
.pied .avertissement {
  padding-block: 24px;
  border-top: 1px solid var(--bordure-2);
  font-size: 13.5px; line-height: 1.6;
}
.pied .bas {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px;
  padding-block: 0 32px;
  font-size: 13.5px;
}

/* --------------------------------------------------------------------------
   Adaptatif
   -------------------------------------------------------------------------- */



@media (max-width: 1024px) {
  .axes,
.offres { grid-template-columns: repeat(2, 1fr); }
  .offres .offre:last-child { grid-column: 1 / -1; }
  .cible { grid-template-columns: 1fr; gap: 40px; }
  .cible .texte { position: static; }
  .webinaire { grid-template-columns: 1fr; }
  .webinaire .media { min-height: 0; aspect-ratio: 16 / 9; }
  .test-grille { grid-template-columns: 1fr; gap: 48px; }
  .apropos { grid-template-columns: 1fr 1fr; gap: 40px; padding: 32px; }
  .chiffres { grid-template-columns: repeat(2, 1fr); }
  .pied .grille { grid-template-columns: 1fr 1fr; }
  .signature { left: 24px; bottom: 24px; }
}

@media (max-width: 1024px) {
  .bio { grid-template-columns: 1fr; gap: 40px; }
  .bio .colonne-photo { position: static; max-width: 460px; }
  .temps { grid-template-columns: 1fr; }
  .axes-liste { grid-template-columns: 1fr; }
  .offre-detail { grid-template-columns: 1fr; }
  .offre-detail .tete-offre { border-right: 0; border-bottom: 1px solid var(--bordure); }
  .contact-grille,
.duo,
.duo.thailande { grid-template-columns: 1fr; gap: 32px; }
  .piliers-liste { gap: 48px; }
  .cartes-piliers { grid-template-columns: repeat(2, 1fr); margin: -64px 20px 0; }
  .apercu-offres,
.grille-articles { grid-template-columns: repeat(2, 1fr); }
  .contact-formulaire { grid-template-columns: 1fr; }
  .parler { grid-template-columns: 220px 1fr; gap: 36px; }
  .duo.thailande .photo-legende { max-width: 460px; }
  .intervenant { grid-template-columns: 200px 1fr; gap: 32px; }
}

@media (max-width: 768px) {
  :root { --gouttiere: 20px; }
  .heros.sans-visuel { padding-bottom: 72px; }
  .role { grid-template-columns: 1fr; }
  .role .carte,
.carte-contact { padding: 30px 24px 32px; }
  .encart { padding: 40px 24px; }
  .encart h2 { font-size: 28px; }
  .axes-liste .item { flex-direction: column; gap: 16px; padding: 26px 22px; }
  .offre-detail .corps-offre { padding: 30px 24px; }
  .offre-detail .inclus { grid-template-columns: 1fr; }
  .etapes,
.faq { padding: 8px 22px; }
  .etapes .item { grid-template-columns: 48px 1fr; }
  .texte-legal h2 { font-size: 23px; }
  .texte-legal table { display: block; overflow-x: auto; }
  .intervenant { grid-template-columns: 1fr; padding: 16px 16px 28px; gap: 24px; }
  .intervenant .texte { padding-inline: 8px; }
  .intervenant .portrait img { aspect-ratio: 4 / 3; }
  .piliers-photo .bandeau img { aspect-ratio: 4 / 3; }
  .cartes-piliers { grid-template-columns: 1fr; margin: -48px 12px 0; }
  .apercu-offres,
.grille-articles { grid-template-columns: 1fr; }
  .parler { grid-template-columns: 1fr; padding: 16px 16px 28px; gap: 24px; }
  .parler .texte { padding-inline: 8px; }
  .parler .portrait img { aspect-ratio: 4 / 3; object-position: 50% 22%; }
  .parler h2,
.fin-test h2 { font-size: 28px; }
  .fin-test { padding: 40px 22px; }
  .formulaire { grid-template-columns: 1fr; padding: 28px 22px; }
  .test-plein .chapo,
.article-tete .chapo { font-size: 18px; }
  .article-tete h1 { font-size: 34px; }
  .article-corps p,
.article-corps li { font-size: 17px; }
  .article-corps h2 { font-size: 25px; }
  body { font-size: 17px; }
  h1 { font-size: 36px; }
  h2 { font-size: 30px; }
  .entete .conteneur { min-height: 72px; }
  .section { padding-block: 88px; }
  .section.serre { padding-block: 64px; }
  .entete-section { margin-bottom: 40px; }
  .heros { padding-top: 64px; }
  .heros::before { bottom: 120px; }
  .heros .chapo { font-size: 18px; }
  .heros-visuel { margin-top: 48px; }
  .heros-visuel .photo img { border-radius: var(--r-carte); aspect-ratio: 4 / 3; }
  .signature { position: relative; left: auto; bottom: auto; margin: -36px 16px 0; max-width: none; }
  .pourquoi .intro { font-size: 20px; }
  .axes,
.offres { grid-template-columns: 1fr; }
  .offres .offre:last-child { grid-column: auto; }
  .webinaire .contenu { padding: 36px 24px; }
  .webinaire h2 { font-size: 30px; }
  .apropos { grid-template-columns: 1fr; padding: 16px 16px 32px; }
  .apropos .texte { padding-inline: 8px; }
  .apercu { padding: 24px 22px; }
  .pied .grille { grid-template-columns: 1fr; gap: 36px; padding-block: 56px 36px; }
  .boutons .bouton > .wp-block-button__link { width: 100%; }
  .situations li { padding: 18px 18px; gap: 16px; font-size: 16px; }
}

/* Focus clavier visible, dans la couleur de la marque */
:focus-visible { outline: 2px solid var(--bleu); outline-offset: 3px; border-radius: 4px; }
.bouton > .wp-block-button__link:focus-visible { border-radius: var(--r-bouton); }

/* Héros : un bouton principal, un lien secondaire */
.heros-actions { align-items: center; gap: 18px 32px; }
@media (max-width: 768px) { .heros-actions .lien-fleche { margin-inline: auto; } }

/* Blog : « À lire aussi » sur deux colonnes */
.grille-articles.deux { grid-template-columns: repeat(2, 1fr); max-width: 880px; margin-inline: auto; }
@media (max-width: 768px) { .grille-articles.deux { grid-template-columns: 1fr; } }

/* Méthode : deux colonnes jusqu'à la largeur d'une tablette */
@media (max-width: 860px) {
  .piliers-liste { grid-template-columns: 1fr; gap: 40px; }
  .piliers-liste .colonne { position: static; }
  .piliers-liste .visuel-methode img { aspect-ratio: 16 / 9; }
  .piliers-liste h2 { font-size: 30px; }
}

/* Accueil : bouton du test sous la grande photo */
.heros-cta { display: flex; justify-content: center; margin-top: 48px; }
@media (max-width: 768px) { .heros-cta { margin-top: 32px; } .heros-cta .bouton > .wp-block-button__link { width: 100%; } }

/* Rappel du test gratuit, juste avant le pied de page (toutes les pages) */
.bandeau-test { padding-block: 72px; background: var(--blanc); border-top: 1px solid var(--bordure-2); }
.bandeau-test-carte {
  display: flex; align-items: center; justify-content: space-between; gap: 32px;
  padding: 36px 44px;
  background: var(--fond); border: 1px solid var(--bordure); border-radius: var(--r-carte);
}
.bandeau-test-carte .texte { min-width: 0; }
.bandeau-test-carte h2 { font-size: 24px; line-height: 1.25; }
.bandeau-test-carte p { max-width: 640px; margin-top: 8px; font-size: 16px; line-height: 1.6; color: var(--gris); }
@media (max-width: 768px) {
  .bandeau-test { padding-block: 48px; }
  .bandeau-test-carte { flex-direction: column; align-items: stretch; padding: 28px 22px; gap: 20px; }
  .bandeau-test-carte h2 { font-size: 21px; }
}

/* Accueil — section Méthode : titre centré sur une ligne, puis deux colonnes */
.methode-tete { max-width: none; margin-bottom: 64px; }
.titre-methode { white-space: nowrap; font-size: clamp(18px, 5vw, 40px); }
.piliers-liste .colonne > .lien-fleche { margin-top: 24px; }
@media (max-width: 768px) { .methode-tete { margin-bottom: 40px; } }

/* --- Icônes (générées depuis les symboles de la maquette) --- */
:root {
  --ic-activite: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='18' height='13' rx='2.2'/%3E%3Cpath d='M9 7V5.6C9 4.7 9.7 4 10.6 4h2.8c.9 0 1.6.7 1.6 1.6V7'/%3E%3Cpath d='M3 12.5h18'/%3E%3Cpath d='M10.5 12.5v1.6h3v-1.6'/%3E%3C/svg%3E");
  --ic-bouclier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7.5 3v5.5c0 4.6-3.2 8.3-7.5 9.5-4.3-1.2-7.5-4.9-7.5-9.5V6z'/%3E%3Cpath d='M8.8 12.2l2.2 2.2 4.2-4.4'/%3E%3C/svg%3E");
  --ic-boussole: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.6 8.4l-2.1 5.1-5.1 2.1 2.1-5.1z'/%3E%3C/svg%3E");
  --ic-calendrier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='2.2'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E");
  --ic-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  --ic-coche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E");
  --ic-croix: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E");
  --ic-ecran: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='12' rx='2'/%3E%3Cpath d='M8 20h8M12 16v4'/%3E%3C/svg%3E");
  --ic-euro: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.6 8.7a4.6 4.6 0 1 0 0 6.6'/%3E%3Cpath d='M7.4 10.8h5.4M7.4 13.2h5.4'/%3E%3C/svg%3E");
  --ic-facebook: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 8.5h2.5V5H14c-2.2 0-3.5 1.6-3.5 3.6V11H8v3.4h2.5V21H14v-6.6h2.4l.6-3.4h-3V9.2c0-.4.3-.7.7-.7z'/%3E%3C/svg%3E");
  --ic-famille: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3 20c0-3.3 2.7-6 6-6s6 2.7 6 6'/%3E%3Ccircle cx='17.2' cy='9.4' r='2.4'/%3E%3Cpath d='M16.4 14.3c2.6.4 4.6 2.7 4.6 5.7'/%3E%3C/svg%3E");
  --ic-fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
  --ic-horizon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17.5h18'/%3E%3Cpath d='M6.5 17.5a5.5 5.5 0 0 1 11 0'/%3E%3Cpath d='M12 6.5V4.5M5.9 9.4 4.5 8M18.1 9.4 19.5 8'/%3E%3Cpath d='M8 21h8'/%3E%3C/svg%3E");
  --ic-horloge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3.2 2'/%3E%3C/svg%3E");
  --ic-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5.5M12 7.6v.1'/%3E%3C/svg%3E");
  --ic-instagram: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='3.5' width='17' height='17' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.2' cy='6.8' r='.6'/%3E%3C/svg%3E");
  --ic-loupe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M20 20l-4.4-4.4'/%3E%3C/svg%3E");
  --ic-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.2'/%3E%3Cpath d='M3.5 6.5l8.5 6 8.5-6'/%3E%3C/svg%3E");
  --ic-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E");
  --ic-trajet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='5.5' cy='18' r='2'/%3E%3Ccircle cx='18.5' cy='6' r='2'/%3E%3Cpath d='M7.5 18H15a3 3 0 0 0 0-6H9a3 3 0 0 1 0-6h7.5'/%3E%3C/svg%3E");
  --ic-youtube: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='5.5' width='19' height='13' rx='4'/%3E%3Cpath d='M10.2 9.3v5.4l4.6-2.7z'/%3E%3C/svg%3E");
  --ic-coche-blanc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E");
  --ic-coche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005BFF' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E");
  --ic-croix-gris: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23515856' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E");
  --m-fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
}
.ic-activite { --icone: var(--ic-activite); }
.ic-bouclier { --icone: var(--ic-bouclier); }
.ic-boussole { --icone: var(--ic-boussole); }
.ic-euro { --icone: var(--ic-euro); }
.ic-famille { --icone: var(--ic-famille); }
.ic-horizon { --icone: var(--ic-horizon); }
.ic-horloge { --icone: var(--ic-horloge); }
.ic-info { --icone: var(--ic-info); }
.ic-loupe { --icone: var(--ic-loupe); }
.ic-trajet { --icone: var(--ic-trajet); }
.infos-ligne li:nth-child(1) { --icone: var(--ic-ecran); }
.infos-ligne li:nth-child(2) { --icone: var(--ic-horloge); }
.infos-ligne li:nth-child(3) { --icone: var(--ic-calendrier); }

/* ==========================================================================
   ADAPTATIONS WORDPRESS
   La feuille ci-dessus est celle de la maquette, transposée aux blocs natifs.
   Ce qui suit règle les différences de balisage entre la maquette et les blocs
   (WordPress imprime le CSS des blocs APRÈS ce fichier : toute surcharge d'un
   style de bloc doit être plus spécifique, pas seulement plus tardive).
   ========================================================================== */

/* --- Espacement automatique de Gutenberg : coupé dans theme.json (blockGap 0)
       et, en filet de sécurité, ici à spécificité nulle. ------------------- */
:where(.wp-block-group) > :where(*),
:where(.wp-block-buttons),
:where(.wp-site-blocks) > :where(*) { margin-block: 0; }
body figure.wp-block-image,
body .wp-block-post-featured-image { margin: 0; }
body figure.wp-block-image figcaption { margin: 0; }

/* --- Utilitaires (anciens styles en ligne de la maquette) --------------- */
.section.serre.pt-24 { padding-top: 24px; }
h2.mt-22.mt-22 { margin-top: 22px; }
.wp-block-buttons.mt-32.mt-32 { margin-top: 32px; }

/* --- En-tête : collant au niveau de la zone de modèle ------------------- */
header.wp-block-template-part {
  position: sticky;
  top: var(--wp-admin--admin-bar--height, 0px);
  z-index: 50;
}
.entete { position: relative; top: auto; z-index: 0; }
/* Le flou de fond passe sur un calque : un filtre sur l'en-tête lui-même
   enfermerait le panneau du menu mobile (position: fixed) dans sa hauteur. */
.entete {
  background: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.entete::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: rgba(248, 250, 253, .92);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  backdrop-filter: saturate(1.4) blur(12px);
}
.entete .wp-block-site-logo { flex: none; line-height: 0; }
.entete .wp-block-site-logo img,
.pied .wp-block-site-logo img { width: auto; height: 52px; mix-blend-mode: multiply; }
.pied .wp-block-site-logo { margin-bottom: 20px; line-height: 0; }

/* --- Navigation principale (bloc Navigation) ---------------------------- */
nav.nav-principale { --nav-gap: 22px; font-size: 15px; }
nav.nav-principale .wp-block-navigation__container { gap: var(--nav-gap); align-items: center; }
nav.nav-principale .wp-block-navigation-item__content {
  position: relative;
  color: var(--nuit);
  font-weight: 500;
  white-space: nowrap;
  text-decoration: none;
}
nav.nav-principale .wp-block-navigation-item__content:hover { color: var(--bleu); }
nav.nav-principale .current-menu-item > .wp-block-navigation-item__content { color: var(--bleu); }
nav.nav-principale .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -8px; height: 2px; border-radius: 2px; background: var(--bleu);
}
nav.nav-principale .is-menu-open .current-menu-item > .wp-block-navigation-item__content::after { display: none; }

/* Sous-menu Accompagnements */
nav.nav-principale .wp-block-navigation__submenu-icon { width: 14px; height: 14px; margin-left: 4px; color: var(--nuit); }
nav.nav-principale .wp-block-navigation__submenu-icon svg { width: 12px; height: 12px; stroke-width: 2px; }
nav.nav-principale .wp-block-navigation__submenu-container {
  top: calc(100% + 14px);
  left: -18px;
  padding: 10px !important;
  background: var(--blanc) !important;
  border: 1px solid var(--bordure) !important;
  border-radius: var(--r-petit);
  box-shadow: 0 24px 48px -24px rgba(6, 21, 61, .28);
}
nav.nav-principale .wp-block-navigation__submenu-container::before {
  content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px;
}
nav.nav-principale .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 10px 12px; border-radius: 8px; font-size: 15px;
}
nav.nav-principale .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--fond); }

/* Bouton « Faire le test gratuit » de l'en-tête */
nav.nav-principale .nav-cta > .wp-block-navigation-item__content {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 10px 20px; margin-left: 8px;
  border: 2px solid var(--bleu); border-radius: var(--r-bouton);
  background: var(--bleu); color: var(--blanc);
  transition: background-color .2s, border-color .2s;
}
nav.nav-principale .nav-cta > .wp-block-navigation-item__content:hover {
  background: var(--bleu-survol); border-color: var(--bleu-survol); color: var(--blanc);
}

/* Bouton d'ouverture du menu (mobile et tablette) */
nav.nav-principale .wp-block-navigation__responsive-container-open {
  width: 46px; height: 46px; padding: 0;
  align-items: center; justify-content: center;
  border: 1px solid var(--bordure); border-radius: var(--r-bouton);
  background: var(--blanc); color: var(--nuit);
}
nav.nav-principale .wp-block-navigation__responsive-container-open svg { width: 24px; height: 24px; }

/* Grand écran : le menu s'affiche en ligne, sans bouton d'ouverture */
@media (min-width: 1201px) {
  nav.nav-principale .wp-block-navigation__responsive-container-open { display: none; }
  nav.nav-principale .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: block; position: static; inset: auto; width: auto; height: auto;
    padding: 0; background: none; z-index: auto;
  }
  nav.nav-principale .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-close { display: none; }
}

/* Panneau ouvert (≤ 1200 px) : blanc, liens empilés, sous-menu déplié */
nav.nav-principale .wp-block-navigation__responsive-container.is-menu-open {
  padding: 20px var(--gouttiere) 32px !important;
  background-color: var(--blanc) !important;
  color: var(--nuit) !important;
}
nav.nav-principale .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 56px; }
nav.nav-principale .is-menu-open .wp-block-navigation__container {
  gap: 0; align-items: stretch !important; width: 100%;
}
nav.nav-principale .is-menu-open .wp-block-navigation-item { width: 100%; align-items: stretch !important; }
nav.nav-principale .is-menu-open .wp-block-navigation-item__content {
  display: block; width: 100%; padding: 14px 0 !important;
  border-bottom: 1px solid var(--bordure-2); font-size: 17px;
}
nav.nav-principale .is-menu-open .wp-block-navigation__submenu-icon { display: none; }
nav.nav-principale .is-menu-open .wp-block-navigation__submenu-container {
  padding: 0 0 6px 16px !important; border: 0 !important; box-shadow: none; background: none !important;
}
nav.nav-principale .is-menu-open .wp-block-navigation__submenu-container::before { display: none; }
nav.nav-principale .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 11px 0 !important; border-radius: 0; font-size: 16px; color: var(--gris);
}
nav.nav-principale .is-menu-open .nav-cta > .wp-block-navigation-item__content {
  margin: 20px 0 0; text-align: center; border-bottom: 2px solid var(--bleu); color: var(--blanc);
  display: flex; padding: 12px 20px !important;
}
nav.nav-principale .wp-block-navigation__responsive-container-close { top: 20px; right: var(--gouttiere); }
nav.nav-principale .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }

/* --- Étiquettes (surtitre, badge) : des <span> dans la maquette, des
       paragraphes ici. On rétablit leur style face aux règles « .x p ». --- */
:root p.surtitre {
  margin: 0 0 18px; max-width: none;
  font-size: 15px; font-weight: 500; line-height: 1.6; letter-spacing: .01em; color: var(--bleu);
}
:root .heros p.surtitre { margin-bottom: 16px; }
:root p.badge {
  margin: 0; max-width: none;
  font-size: 13px; font-weight: 600; line-height: 1.6; letter-spacing: .08em; color: var(--bleu);
}
:root .heros p.badge { margin-bottom: 22px; }
/* Lien fléché : un <a> dans la maquette, un paragraphe ici — pas de marge basse héritée */
:root p.lien-fleche { margin-bottom: 0; max-width: none; }

/* --- Accents de couleur (format natif « Couleur du texte ») -------------- */
mark.has-inline-color { background-color: transparent; padding: 0; }
.bio mark, .apropos mark, .intervenant mark { font-weight: 600; }

/* --- Prix : « TTC » en italique natif, affiché droit et plus petit ------- */
.prix em { font-style: normal; font-size: 15px; font-weight: 500; }
.apercu-offres .prix em { font-size: 14px; }

/* --- Boutons (bloc Boutons) --------------------------------------------- */
body .wp-block-buttons { gap: 14px; }
.wp-block-button.bouton > .wp-block-button__link { height: auto; text-decoration: none; }
.offre-detail .tete-offre > .wp-block-buttons { margin-top: 26px; justify-content: center; }
.carte-contact > .wp-block-buttons { margin-top: auto; }
.colonne-contact .carte-contact > .wp-block-buttons { margin-top: 22px; }
.bandeau-test-carte > .wp-block-buttons { flex: none; }
.heros-cta { justify-content: center; }

/* Lien fléché : paragraphe, bouton « lien » ou « Lire la suite » */
.lien-fleche a,
a.lien-fleche,
.wp-block-button.lien-fleche > .wp-block-button__link {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 0; padding: 0; border: 0; border-radius: 0; background: none;
  color: var(--bleu); font-weight: 500; font-size: 16px; text-decoration: none;
}
.wp-block-button.lien-fleche > .wp-block-button__link:hover,
.lien-fleche a:hover, a.lien-fleche:hover { background: none; color: var(--bleu-survol); }
.lien-fleche a::after,
a.lien-fleche::after,
.wp-block-button.lien-fleche > .wp-block-button__link::after {
  content: ""; flex: none; width: 18px; height: 18px;
  background-color: currentColor;
  -webkit-mask: var(--m-fleche) center / contain no-repeat;
  mask: var(--m-fleche) center / contain no-repeat;
  transition: transform .2s;
}
.lien-fleche a:hover::after, a.lien-fleche:hover::after,
.wp-block-button.lien-fleche > .wp-block-button__link:hover::after { transform: translateX(3px); }

/* --- Icônes : pseudo-éléments (aucun SVG dans le contenu éditable) ------- */
.axe .tete::before,
.axes-liste .item::before,
.encart::before {
  content: ""; flex: none; display: block;
  width: 64px; height: 64px; border-radius: 50%;
  background: var(--bleu-pale) var(--icone) center / 30px no-repeat;
}
.encart::before { margin: 0 auto 24px; }
.infos-ligne li::before {
  content: ""; flex: none; width: 36px; height: 36px; border-radius: 50%;
  background: var(--blanc) var(--icone) center / 18px no-repeat;
}
.situations li::before {
  content: ""; flex: none; width: 36px; height: 36px; border-radius: 50%;
  background: var(--nuit) var(--ic-coche-blanc) center / 18px no-repeat;
}
.inclus li::before {
  content: ""; flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%;
  background: var(--nuit) var(--ic-coche-blanc) center / 12px no-repeat;
}
.liste-coches li::before {
  content: ""; flex: none; width: 26px; height: 26px; margin-top: -1px; border-radius: 50%;
  background: var(--nuit) var(--ic-coche-blanc) center / 16px no-repeat;
}
.liste-coches.non li::before {
  background: var(--fond) var(--ic-croix-gris) center / 16px no-repeat;
  border: 1px solid var(--bordure);
}
.test-plein .details li::before {
  content: ""; flex: none; width: 18px; height: 18px;
  background: var(--ic-coche) center / contain no-repeat;
}
.apercu-pied::before,
.reassurance::before {
  content: ""; flex: none; width: 18px; height: 18px;
  background: var(--ic-bouclier) center / contain no-repeat;
}
.reassurance::before { width: 24px; height: 24px; }

/* --- Aperçu « Vos 6 piliers » ------------------------------------------- */
.apercu-tete { font-size: 13px; color: var(--gris); }
.apercu-tete strong { color: var(--nuit); }
.jauges li strong { font-size: 13px; font-weight: 500; color: var(--gris); }
.jauges li::after {
  content: ""; grid-column: 1 / -1; height: 8px; border-radius: 4px;
  background: linear-gradient(90deg, var(--bleu) var(--niveau), var(--bleu-pale) var(--niveau));
}
.jauges li:nth-child(1) { --niveau: 86%; }
.jauges li:nth-child(2) { --niveau: 52%; }
.jauges li:nth-child(3) { --niveau: 78%; }
.jauges li:nth-child(4) { --niveau: 34%; }
.jauges li:nth-child(5) { --niveau: 58%; }
.jauges li:nth-child(6) { --niveau: 46%; }

/* --- Chiffres, signature, avatar, auteur --------------------------------- */
.chiffres li { font-size: 13px; line-height: 1.35; color: var(--gris); }
.chiffres strong { margin-bottom: 4px; }
.signature > figure,
.avatar > figure,
.auteur > figure { flex: none; }
.avatar p { font-size: 14px; line-height: 1.5; color: var(--gris); }
.auteur strong { display: block; font-size: 17px; font-weight: 600; color: var(--nuit); }

/* --- Questions fréquentes (bloc Détails) --------------------------------- */
.faq .wp-block-details summary { display: flex; }
.faq .wp-block-details > p:last-child { padding-bottom: 24px; }

/* --- Tableaux des pages légales (bloc Tableau) --------------------------- */
.texte-legal .wp-block-table { margin: 16px 0; overflow-x: auto; }
.texte-legal .wp-block-table table { width: 100%; margin: 0; border-collapse: collapse; font-size: 15.5px; }
.texte-legal .wp-block-table thead { border-bottom: 0; }
.texte-legal .wp-block-table th,
.texte-legal .wp-block-table td {
  padding: 12px 14px; border: 1px solid var(--bordure);
  text-align: left; vertical-align: top; line-height: 1.5; font-size: 15.5px;
}
.texte-legal .wp-block-table th { background: var(--fond); font-weight: 600; }

/* --- Citation dans les articles (bloc Citation) -------------------------- */
.article-corps .wp-block-quote p { font-size: inherit; line-height: inherit; font-weight: inherit; color: inherit; }
body .article-corps > * + * { margin-top: 20px; }
body .article-corps > h2 { margin-top: 52px; }
body .article-corps > h3 { margin-top: 36px; }
body .article-corps > .wp-block-quote { margin: 36px 0; }

/* --- Liens sociaux (bloc Icônes de réseaux sociaux) ---------------------- */
.wp-block-social-links.is-style-logos-only.reseaux .wp-social-link,
.wp-block-social-links.is-style-logos-only.reseaux-ligne .wp-social-link { color: var(--bleu); background: none; }
.wp-block-social-links.reseaux { display: grid; gap: 10px; margin: 0; padding: 0; }
.wp-block-social-links.reseaux .wp-social-link a { display: inline-flex; align-items: center; gap: 10px; padding: 0; font-size: 15px; line-height: 1.6; }
.wp-block-social-links.reseaux .wp-social-link svg { width: 18px; height: 18px; }
.wp-block-social-links.reseaux .wp-social-link span.wp-block-social-link-label { margin: 0; padding: 0; font-size: 15px; }
.wp-block-social-links.reseaux-ligne { gap: 12px; }
.wp-block-social-links.reseaux-ligne .wp-social-link {
  border: 1px solid var(--bordure); border-radius: var(--r-petit); background: var(--blanc);
}
.wp-block-social-links.reseaux-ligne .wp-social-link a {
  display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px; font-size: 16px; font-weight: 500; line-height: 1.6;
}
.wp-block-social-links.reseaux-ligne .wp-social-link svg { width: 20px; height: 20px; }
.wp-block-social-links.reseaux-ligne .wp-social-link span.wp-block-social-link-label { margin: 0; padding: 0; font-size: 16px; }

/* --- Formulaire de contact (Contact Form 7) ----------------------------- */
.formulaire > .wpcf7 { grid-column: 1 / -1; }
.formulaire .wpcf7-form { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.formulaire .hidden-fields-container { display: none; }
.formulaire .wpcf7-form-control-wrap { display: block; }
.formulaire .wpcf7-textarea, .formulaire .wpcf7-select, .formulaire .wpcf7-text, .formulaire .wpcf7-email { display: block; }
.formulaire .champ.large, .formulaire .consentement, .formulaire .envoi { grid-column: 1 / -1; }
.formulaire .consentement .wpcf7-list-item { margin: 0; }
.formulaire .consentement label { display: flex; gap: 12px; align-items: flex-start; }
.formulaire .wpcf7-submit {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; padding: 14px 26px; cursor: pointer;
  border: 2px solid var(--bleu); border-radius: var(--r-bouton);
  background: var(--bleu); color: var(--blanc); font: 500 16px/1.3 var(--police);
  transition: background-color .2s, border-color .2s;
}
.formulaire .wpcf7-submit:hover { background: var(--bleu-survol); border-color: var(--bleu-survol); }
.formulaire .wpcf7-spinner { margin: 0 0 0 12px; }
.formulaire .wpcf7-not-valid-tip { margin-top: 6px; font-size: 13px; color: #B42318; }
.formulaire .wpcf7-response-output {
  grid-column: 1 / -1; margin: 0 !important; padding: 12px 16px !important;
  border-radius: var(--r-bouton); font-size: 15px;
}

/* --- Blog (blocs Requête, Catégories, Date…) ----------------------------- */
.grille-articles > li { min-width: 0; margin: 0; }
.carte-article .vignette { margin: 0; overflow: hidden; border-radius: var(--r-carte); }
.carte-article .vignette a { display: block; }
.meta-article > * { margin: 0; }
.meta-article > * + *::before {
  content: ""; display: inline-block; width: 3px; height: 3px; margin-right: 10px;
  border-radius: 50%; background: var(--gris); opacity: .6; vertical-align: middle;
}
.meta-article .categorie a { font-weight: 600; color: var(--bleu); text-decoration: none; }
.carte-article .wp-block-post-title { margin-top: 10px; }
.carte-article .wp-block-post-title a { display: inline; }
.carte-article .wp-block-post-excerpt { margin-top: 0; }
.carte-article .wp-block-post-excerpt__excerpt { margin-top: 10px; }
.carte-article .wp-block-read-more { margin-top: 16px; }
.categories li { margin: 0; }
.categories .current-cat a { border-color: var(--bleu); color: var(--bleu); }
.pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin-top: 56px; }
.pagination a, .pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px;
  border: 1px solid var(--bordure); border-radius: var(--r-bouton); font-size: 15px; font-weight: 500;
}
.pagination .page-numbers.current { border-color: var(--bleu); background: var(--bleu); color: var(--blanc); }
body .article-image { max-width: 1040px; margin: 56px auto 0; }
.article-tete .wp-block-post-title { font-size: 46px; }
.article-tete .chapo p { margin: 0; }

/* --- Bloc « contenu seul » : rien ne déborde ----------------------------- */
.wp-block-post-content { overflow-wrap: break-word; }

/* --- Adaptatif ----------------------------------------------------------- */
@media (max-width: 768px) {
  .entete .wp-block-site-logo img { height: 44px; }
  .formulaire .wpcf7-form { grid-template-columns: 1fr; }
  .wp-block-buttons.boutons > .wp-block-button,
  .heros-cta > .wp-block-button,
  .bandeau-test-carte .wp-block-button,
  .bandeau-test-carte .wp-block-button__link { width: 100%; }
  .article-tete .wp-block-post-title { font-size: 34px; }
}
