/* ══════════════════════════════════════════════════════════════════════
   CORRECTIONS  ·  17/08/2026
   ══════════════════════════════════════════════════════════════════════
   Quatre défauts signalés par Quentin, tous reproduits et mesurés avant
   correction. Chargé en dernier, après style.css et finition.css.
   ══════════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════════════
   1. FONDS DE SECTION : cadrés, centrés, jamais répétés
   ══════════════════════════════════════════════════════════════════════
   🔴 Mesuré au style CALCULÉ, pas dans la feuille :

       .rv-hero-photo   background-size:auto  position:0% 0%  repeat
       .rv-appel        background-size:auto  position:0% 0%  repeat

   Les shortcodes passent pourtant « background_size="cover" » et
   « background_position="center" » : Divi ne les applique pas. La photo
   démarrait donc en HAUT À GAUCHE à sa taille naturelle, et se RÉPÉTAIT
   pour combler : d'où la couture verticale visible sur la droite des
   bandeaux, et l'impression que rien n'est centré.

   Seul .rv-bandeau-chiffres était correct, parce que je l'avais forcé.
   On force donc partout, y compris sur les futures sections à photo.

   ⚠️ « background-attachment: fixed » est volontairement écarté : il
   provoque des saccades sur iOS et casse le cadrage sur mobile. */
/* ⚠️ Pas de « background-position » ici. Ce sélecteur d'attribut pèse
   plus lourd qu'une simple classe : posé avec !important, il écrasait le
   point de visée réglé plus bas pour chaque type de bandeau, et tout
   restait bêtement centré. Les deux propriétés qui n'ont pas d'exception
   sont seules à cet étage. */
.et_pb_section[class*="rv-"],
.rv-hero-photo,
.rv-appel,
.rv-bandeau-chiffres{
  background-repeat:no-repeat !important;
  background-size:cover !important;
}
/* Défaut, pour toute section à photo qui ne serait pas listée plus bas. */
.et_pb_section[class*="rv-"]{ background-position:center center; }

/* Le calque de rapprochement lent hérite du même cadrage. */
.rv-hero-photo::after{
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center center;
}

/* Point de visée par type de bandeau.
   Sur une photo de groupe, « center » coupe les visages en deux dès que
   la section est basse et large. Les regards se tiennent dans le tiers
   supérieur : on remonte le point de visée. */
.et_pb_section.rv-hero-photo,
.rv-hero-photo::after{ background-position:center 34% !important; }
.et_pb_section.rv-appel{ background-position:center 38% !important; }
.et_pb_section.rv-bandeau-chiffres{ background-position:center 42% !important; }

@media (max-width:900px){
  /* Plus l'écran est étroit, plus le recadrage est brutal : on resserre
     encore sur le haut, sinon il ne reste que des torses. */
  .et_pb_section.rv-hero-photo,
  .rv-hero-photo::after{ background-position:center 28% !important; }
  .et_pb_section.rv-appel{ background-position:center 32% !important; }
  .et_pb_section.rv-bandeau-chiffres{ background-position:center 36% !important; }
  .rv-split-media img,
  .rv-mosaique-c img,
  .rv-citation-media img{ object-position:center 28%; }
}

/* Les photos POSÉES (pas en fond) suivent la même règle : on ne coupe
   pas au milieu, on vise le tiers supérieur. */
.rv-split-media img,
.rv-mosaique-c img,
.rv-citation-media img{ object-position:center 32%; }

/* ══════════════════════════════════════════════════════════════════════
   2. MENU : le soulignement se battait avec le chevron de Divi
   ══════════════════════════════════════════════════════════════════════
   🔴 Mesuré : sur « Nos expertises » et « Ressources », le pseudo-élément
   « ::after » du lien fait 16 px de large et se pose à 105 px du bord.
   Ce n'est pas mon trait : c'est LE CHEVRON de Divi, qui signale un
   sous-menu, et qui vit lui aussi dans « ::after ». Mon soulignement
   écrasait donc le chevron sur l'entrée courante, et sur les autres il
   restait un moignon de 16 px pris pour un trait mal aligné.

   Deuxième défaut du même endroit : le lien d'une entrée à sous-menu
   porte 20 px de marge à droite pour loger le chevron. Un trait posé sur
   toute la largeur du lien débordait donc du texte de 20 px, et
   paraissait décalé vers la droite.

   La parade : ne plus toucher à « ::after ». Le trait est peint dans le
   FOND du lien, ce qui laisse le chevron tranquille et permet d'ajuster
   sa largeur au texte seul. */

/* On efface le soulignement en pseudo-élément là où il n'a rien à faire. */
#top-menu li.current-menu-item > a::after,
#top-menu li.current_page_item > a::after,
#top-menu li.current-menu-ancestor > a::after{
  content:normal;
  position:static;
  left:auto; right:auto; bottom:auto;
  width:auto; height:auto;
  background:none;
}

/* ⚠️ Et on REND SA GÉOMÉTRIE au chevron, explicitement.
   Ne pas se contenter de lui rendre « content » et « position » : la
   règle effacée ci-dessus posait « left:0; right:0 », qui restait en
   vigueur. Le chevron s'étirait alors sur toute la largeur du lien
   (mesuré : 121 px au lieu de 16), et le glyphe se retrouvait n'importe
   où. Toutes les propriétés géométriques doivent être redonnées, pas
   seulement celles qu'on croit avoir changées. */
#top-menu li.menu-item-has-children > a::after{
  content:'3' !important;              /* glyphe de la police d'icônes de Divi */
  font-family:'ETmodules' !important;
  font-size:16px !important;
  font-weight:normal !important;
  line-height:1 !important;
  position:absolute !important;
  left:auto !important;
  right:0 !important;
  top:6px !important;
  bottom:auto !important;
  width:auto !important;
  height:auto !important;
  background:none !important;
  color:inherit;
}

/* Le trait, peint dans le fond, ajusté au texte seul. */
#top-menu > li.current-menu-item > a,
#top-menu > li.current_page_item > a,
#top-menu > li.current-menu-ancestor > a{
  background-image:linear-gradient(var(--rv-teal), var(--rv-teal));
  background-repeat:no-repeat;
  background-position:left bottom;
  background-size:100% 2px;
  padding-bottom:.34rem;
}
/* Entrée à sous-menu : on retranche la place du chevron. */
#top-menu > li.menu-item-has-children.current-menu-item > a,
#top-menu > li.menu-item-has-children.current_page_item > a,
#top-menu > li.menu-item-has-children.current-menu-ancestor > a{
  background-size:calc(100% - 20px) 2px;
}

/* Survol : le trait se déploie depuis la gauche, sur toutes les entrées. */
#top-menu > li > a{
  background-image:linear-gradient(var(--rv-teal), var(--rv-teal));
  background-repeat:no-repeat;
  background-position:left bottom;
  background-size:0 2px;
  padding-bottom:.34rem;
  transition:background-size .32s var(--rv-courbe, ease), color .32s ease;
}
#top-menu > li > a:hover{ background-size:100% 2px; }
#top-menu > li.menu-item-has-children > a:hover{ background-size:calc(100% - 20px) 2px; }
@media (prefers-reduced-motion:reduce){
  #top-menu > li > a{ transition:none; }
}

/* ── Sous-menus ────────────────────────────────────────────────────────
   🔴 Le trait de l'entrée courante s'y affichait aussi, sur 230 px de
   large, et débordait du panneau. Dans un menu déroulant, un soulignement
   pleine largeur ne se lit pas comme « page courante » mais comme un
   séparateur mal placé. On le remplace par un repère à gauche, qui ne
   peut pas être confondu. */
#top-menu li ul.sub-menu > li > a{
  background-image:none !important;
  padding-bottom:6px !important;
  position:relative;
}
#top-menu li ul.sub-menu > li.current-menu-item > a,
#top-menu li ul.sub-menu > li.current_page_item > a,
#top-menu li ul.sub-menu > li.current-menu-ancestor > a{
  color:var(--rv-teal) !important;
  font-weight:700;
  background-color:rgba(11,85,99,.06) !important;
}
#top-menu li ul.sub-menu > li.current-menu-item > a::before,
#top-menu li ul.sub-menu > li.current_page_item > a::before,
#top-menu li ul.sub-menu > li.current-menu-ancestor > a::before{
  content:'';
  position:absolute; left:0; top:4px; bottom:4px;
  width:3px; border-radius:0 2px 2px 0;
  background:var(--rv-teal);
}

/* Menu mobile : même logique, repère à gauche plutôt que soulignement. */
.et_mobile_menu li.current-menu-item > a,
.et_mobile_menu li.current_page_item > a,
.et_mobile_menu li.current-menu-ancestor > a{
  color:var(--rv-teal) !important;
  font-weight:700;
  box-shadow:inset 3px 0 0 var(--rv-teal);
  padding-left:12px !important;
}

/* ══════════════════════════════════════════════════════════════════════
   3. JUSTIFICATION DE TOUS LES TEXTES
   ══════════════════════════════════════════════════════════════════════
   Demandé explicitement, pied de page et pages juridiques compris.

   ⚠️ La justification SEULE creuse des rivières dans les colonnes
   étroites : c'est pour cette raison que les cartes en avaient été
   exclues à la première version. La césure automatique est donc activée
   en même temps, et elle n'est pas optionnelle ici. Elle exige
   « lang="fr" » sur le document, qui est bien posé.

   Ce qui n'est JAMAIS justifié : les titres, les boutons, les libellés,
   les pastilles et les cellules de tableau. Justifier une ligne unique
   revient à l'étirer sur toute la largeur, ce qui la rend illisible. */
.et_pb_text_inner p,
.et_pb_text_inner li,
.rv-c p,
.rv-encadre p,
.rv-split-texte p,
.rv-points li,
.rv-reponse p,
.rv-etapes p,
.rv-cas p,
.entry-content p,
.entry-content li,
#main-footer .et_pb_widget p,
#main-footer .et_pb_widget div,
#footer-widgets .footer-widget p,
#footer-widgets .footer-widget div{
  /* 25/08/2026 : alignement à gauche partout, voir alignements.css. */
  text-align:left;
  hyphens:manual;
  -webkit-hyphens:manual;
  text-wrap:pretty;
}

/* Les exceptions, qui doivent le rester. */
h1, h2, h3, h4, h5, h6,
.rv-surtitre,
.rv-chiffre,
.rv-libelle,
.rv-legende.rv-centre,
.rv-centre p,
.rv-appel p,
.rv-bandeau-chiffres p,
.rv-tableau td,
.rv-tableau th,
.rv-tags li,
.rv-badges li,
.rv-mots-4r li,
.rv-mosaique figcaption,
.rv-temoignage figcaption,
.rv-citation figcaption,
.et_pb_button,
#top-menu li a,
.et_mobile_menu li a,
.rv-formulaire label,
.rv-formulaire .forminator-description{
  text-align:inherit;
  hyphens:none;
  -webkit-hyphens:none;
}
h1, h2, h3, h4, h5, h6{ text-align:left; }
.rv-centre h1, .rv-centre h2, .rv-centre h3,
.rv-appel h2, .rv-bandeau-chiffres h2{ text-align:center; }

/* ⚠️ Sous 480 px, la justification redevient nuisible : une colonne de
   moins de trente signes par ligne se troue quoi qu'on fasse, césure
   comprise. Le texte repasse au fil de l'eau. */
@media (max-width:480px){
  .et_pb_text_inner p,
  .et_pb_text_inner li,
  .rv-c p,
  .rv-split-texte p,
  .entry-content p,
  #main-footer .et_pb_widget p{
    text-align:left;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   4. PAGE CONTACT ET FORMULAIRE
   ══════════════════════════════════════════════════════════════════════
   Le formulaire sortait tel que Forminator le peint : champs gris
   remplis, bordures épaisses, libellés minuscules et collés, cases à
   cocher désalignées, bouton perdu en bas à gauche. Sur un site de
   conseil, le formulaire EST la conversion : c'est le dernier endroit
   où laisser un rendu par défaut. */

.rv-contact{ align-items:stretch; }
.rv-contact-form{ flex:1.25 1 26rem; }
.rv-contact-infos{ flex:1 1 19rem; }
.rv-contact-intro{ color:var(--rv-gris); max-width:34rem; }

/* Le formulaire vit dans une carte, comme les encadrés d'à côté :
   sans elle, la colonne de gauche flottait dans le blanc. */
.rv-formulaire{
  background:#fff;
  border-radius:1.2rem;
  padding:1.9rem 1.9rem 1.5rem;
  box-shadow:inset 0 0 0 1px rgba(11,85,99,.10), var(--rv-ombre-douce);
  margin-top:1.4rem;
}

/* ── Champs ─────────────────────────────────────────────────────────── */
.rv-formulaire .forminator-input,
.rv-formulaire .forminator-textarea,
.rv-formulaire select,
.rv-formulaire .forminator-select2 .select2-selection{
  background:#FDFCFA !important;
  border:1px solid var(--rv-trait) !important;
  border-radius:.7rem !important;
  padding:.78rem .95rem !important;
  font-size:.96rem !important;
  color:var(--rv-encre) !important;
  box-shadow:none !important;
  transition:border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
  min-height:auto !important;
}
.rv-formulaire .forminator-textarea{ min-height:9.5rem !important; resize:vertical; }

/* ⚠️ L'anneau de focus n'est PAS décoratif : sans lui, une personne qui
   navigue au clavier ne sait plus où elle est. Il double la couleur par
   une épaisseur, pour rester perceptible sans distinguer les teintes. */
.rv-formulaire .forminator-input:focus,
.rv-formulaire .forminator-textarea:focus,
.rv-formulaire select:focus{
  border-color:var(--rv-teal) !important;
  box-shadow:0 0 0 3px rgba(11,85,99,.16) !important;
  background:#fff !important;
  outline:none !important;
}

/* ── Libellés ───────────────────────────────────────────────────────── */
.rv-formulaire .forminator-label{
  font-size:.84rem !important;
  font-weight:600 !important;
  letter-spacing:.01em;
  color:var(--rv-encre) !important;
  margin-bottom:.4rem !important;
  display:block;
}
.rv-formulaire .forminator-required{ color:#A8342A !important; margin-left:.15rem; }
.rv-formulaire .forminator-description{
  margin-top:.34rem !important;
  font-size:.82rem !important;
  line-height:1.4;
}

/* Espacement régulier entre les champs : Forminator alterne 10 et 30 px
   selon le type, ce qui donne une colonne bancale. */
.rv-formulaire .forminator-row{ margin-bottom:1.15rem !important; }
.rv-formulaire .forminator-row:last-of-type{ margin-bottom:0 !important; }

/* Sur large, les champs courts se mettent deux par deux plutôt que
   d'étirer une colonne de six champs sur toute la hauteur. */
@media (min-width:640px){
  .rv-formulaire .forminator-row.forminator-grouped{
    display:grid; grid-template-columns:1fr 1fr; gap:0 1.1rem;
  }
}

/* ── Cases à cocher ─────────────────────────────────────────────────── */
.rv-formulaire .forminator-checkbox,
.rv-formulaire .forminator-radio{
  display:flex !important;
  align-items:flex-start;
  gap:.7rem;
  line-height:1.45;
  padding:.55rem .75rem;
  border-radius:.6rem;
  transition:background-color .25s ease;
}
.rv-formulaire .forminator-checkbox:hover,
.rv-formulaire .forminator-radio:hover{ background:rgba(11,85,99,.04); }
.rv-formulaire .forminator-checkbox-box,
.rv-formulaire .forminator-radio-bullet{
  flex:0 0 auto;
  margin-top:.12rem !important;
  border-color:var(--rv-gris) !important;
}
.rv-formulaire .forminator-checkbox-label,
.rv-formulaire .forminator-radio-label{ font-size:.92rem; }

/* ── Bouton ─────────────────────────────────────────────────────────── */
.rv-formulaire .forminator-button-submit{
  border-radius:999px !important;
  padding:.9rem 2rem !important;
  font-size:1rem !important;
  font-weight:600 !important;
  width:auto !important;
  transition:transform .3s var(--rv-courbe, ease), box-shadow .3s ease, background-color .3s ease;
}
.rv-formulaire .forminator-button-submit:hover{
  box-shadow:0 14px 30px -12px rgba(11,85,99,.55);
}
.rv-formulaire .forminator-button-submit:active{ transform:scale(.975); }
.rv-formulaire .forminator-response-message{ border-radius:.7rem !important; }

/* ── Colonne de droite ──────────────────────────────────────────────── */
.rv-contact-infos .rv-encadre{ border-radius:1.2rem; }
.rv-contact-infos .rv-coord a{ font-weight:600; }

/* ── « Où nous trouver » ────────────────────────────────────────────── */
/* Le tracé de la Guyane occupait presque la moitié de la largeur et se
   lisait comme une forme abstraite. Réduit, il redevient un repère. */
.rv-bloc-guyane{ align-items:center; gap:2.6rem; }
.rv-carte-guyane{ width:clamp(6rem,10vw,8.5rem); }
.rv-bloc-guyane > div:last-child{ flex:1 1 22rem; }

@media (max-width:900px){
  .rv-formulaire{ padding:1.4rem 1.2rem 1.1rem; }
  .rv-bloc-guyane{ gap:1.6rem; }
}

/* ══════════════════════════════════════════════════════════════════════
   5. POINT DE VISÉE, PHOTO PAR PHOTO
   ══════════════════════════════════════════════════════════════════════
   Choisis sur planche contact : chaque photo recadrée au format réel du
   bandeau, à cinq hauteurs, puis lues côte à côte.
   Reproductible : scripts/120-cadrage-photos.py

   Un réglage unique était impossible. Sur « audit-organisation », 25 %
   coupe déjà le front de la personne ; sur « formation-formatrice », il
   faut descendre à 50 % pour voir autre chose qu'un mur blanc. Les deux
   photos sont pourtant dans le même site, sur des sections identiques.

   Ces règles l'emportent sur les valeurs par défaut posées plus haut :
   même poids de sélecteur, déclarées après. */
.et_pb_section.rv-ph-audit-organisation-analyse-documents{ background-position:center 10% !important; }
.et_pb_section.rv-ph-bilan-competences-entretien{         background-position:center 22% !important; }
.et_pb_section.rv-ph-enquete-administrative-dossier{      background-position:center 42% !important; }
.et_pb_section.rv-ph-entretien-individuel-bureau{         background-position:center 12% !important; }
.et_pb_section.rv-ph-equipe-conseil-rh-reunion{           background-position:center 20% !important; }
.et_pb_section.rv-ph-espace-travail-partage{              background-position:center 26% !important; }
.et_pb_section.rv-ph-formation-atelier-petit-groupe{      background-position:center 24% !important; }
.et_pb_section.rv-ph-formation-formatrice-stagiaires{     background-position:center 50% !important; }
.et_pb_section.rv-ph-formation-grand-groupe-assemblee{    background-position:center 30% !important; }
.et_pb_section.rv-ph-poignee-main-confiance{              background-position:center 20% !important; }
.et_pb_section.rv-ph-restitution-audit-petit-comite{      background-position:center 24% !important; }
.et_pb_section.rv-ph-reunion-rh-indicateurs-tableau{      background-position:center 30% !important; }
.et_pb_section.rv-ph-vae-travail-dossier-ordinateur{      background-position:center 28% !important; }

/* Le calque de rapprochement lent du bandeau doit viser au même endroit,
   sinon il glisse par-dessus la photo peinte et le doublon se voit. */
.rv-ph-audit-organisation-analyse-documents::after{ background-position:center 10% !important; }
.rv-ph-bilan-competences-entretien::after{          background-position:center 22% !important; }
.rv-ph-enquete-administrative-dossier::after{       background-position:center 42% !important; }
.rv-ph-entretien-individuel-bureau::after{          background-position:center 12% !important; }
.rv-ph-equipe-conseil-rh-reunion::after{            background-position:center 20% !important; }
.rv-ph-espace-travail-partage::after{               background-position:center 26% !important; }
.rv-ph-formation-atelier-petit-groupe::after{       background-position:center 24% !important; }
.rv-ph-formation-formatrice-stagiaires::after{      background-position:center 50% !important; }
.rv-ph-formation-grand-groupe-assemblee::after{     background-position:center 30% !important; }
.rv-ph-poignee-main-confiance::after{               background-position:center 20% !important; }
.rv-ph-restitution-audit-petit-comite::after{       background-position:center 24% !important; }
.rv-ph-reunion-rh-indicateurs-tableau::after{       background-position:center 30% !important; }
.rv-ph-vae-travail-dossier-ordinateur::after{       background-position:center 28% !important; }

/* ⚠️ Sur écran étroit, le bandeau devient presque carré : le recadrage
   se fait alors en LARGEUR, plus en hauteur, et le point de visée
   vertical n'a plus d'effet. Ce qui compte là est de ne pas trop
   grandir la photo : une hauteur minimale plus basse garde le cadrage
   proche de l'original. */
@media (max-width:600px){
  .rv-hero-photo{ min-height:22rem; }
}

/* ══════════════════════════════════════════════════════════════════════
   6. BANDEAU PHOTO AU TÉLÉPHONE
   ══════════════════════════════════════════════════════════════════════
   🔴 Deux défauts vus en capture à 390 px, invisibles pour tout contrôle
   automatique : il lit des couleurs déclarées, pas le pixel affiché.

   1. LE VOILE ÉTAIT COUPÉ À 160 px. Le bandeau photo porte les DEUX
      classes « rv-hero » et « rv-hero-photo ». Or une règle mobile
      destinée au bandeau SOBRE enferme « .rv-hero::before » dans une
      bande haute de 160 px, pour que le décor en SVG ne passe pas
      derrière le titre. Même spécificité que « .rv-hero-photo::before »,
      donc « inset » et « height » l'emportaient : le dégradé de
      lisibilité s'arrêtait au tiers de la hauteur, et le titre blanc
      finissait sur une photo en plein jour. Illisible.

   2. Le titre et le chapeau touchaient les deux bords de l'écran, la
      rangée du bandeau ayant ses marges horizontales remises à zéro. */
@media (max-width:980px){
  .rv-hero-photo::before{
    inset:0 !important;
    height:auto !important;
    background:linear-gradient(180deg,
      rgba(8,63,74,.86) 0%, rgba(8,63,74,.80) 45%, rgba(8,63,74,.90) 100%) !important;
  }
  /* La marge haute servait à dégager le décor du bandeau sobre : sur le
     bandeau photo, elle ne fait que creuser un vide. */
  .rv-hero-photo{ padding-top:0 !important; }
  .rv-hero-photo .et_pb_row,
  .rv-hero-sobre .et_pb_row{
    padding-left:22px !important;
    padding-right:22px !important;
    width:100% !important;
    max-width:100% !important;
  }
  .rv-hero-photo .rv-chapo{ max-width:none; }
}

/* ── La liste déroulante ────────────────────────────────────────────────
   🔴 Trois heures de perdues évitées en inspectant le DOM plutôt qu'en
   tâtonnant. Le « <select> » du formulaire est MASQUÉ : Forminator monte
   Select2 par-dessus, et l'élément réellement visible est
   « span.select2-selection--single », gris #EDEDED, bordure #777771,
   coins carrés. Habiller « select » n'avait donc aucun effet, et ma
   première tentative peignait le CONTENEUR externe, ce qui donnait une
   boîte dans une boîte et deux chevrons. */
.rv-formulaire .select2-container,
.rv-formulaire .select2.forminator-select{
  background:none !important;
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  width:100% !important;
}
.rv-formulaire .select2-selection,
.rv-formulaire .select2-selection--single{
  background:#FDFCFA !important;
  border:1px solid var(--rv-trait) !important;
  border-radius:.7rem !important;
  height:auto !important;
  min-height:3rem;
  display:flex !important;
  align-items:center;
  padding:.15rem .5rem .15rem .35rem !important;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.rv-formulaire .select2-container--open .select2-selection,
.rv-formulaire .select2-selection:focus{
  border-color:var(--rv-teal) !important;
  box-shadow:0 0 0 3px rgba(11,85,99,.16) !important;
}
.rv-formulaire .select2-selection__rendered{
  color:var(--rv-encre) !important;
  font-size:.96rem !important;
  line-height:1.5 !important;
  padding-left:.6rem !important;
}
/* Le chevron est celui de Select2 : on le recolore, on n'en ajoute pas. */
.rv-formulaire .select2-selection__arrow b{ border-top-color:var(--rv-gris) !important; }
.rv-formulaire .select2-dropdown{
  border-color:var(--rv-trait) !important;
  border-radius:.7rem !important;
  overflow:hidden;
  box-shadow:var(--rv-ombre-douce);
}
.rv-formulaire .select2-results__option--highlighted{
  background:var(--rv-teal) !important; color:#fff !important;
}

/* ══════════════════════════════════════════════════════════════════════
   7. CENTRAGE : « text-align-last » annulait le centrage
   ══════════════════════════════════════════════════════════════════════
   🔴 LE défaut que trois contrôles successifs avaient manqué.

   Mesuré sur les pixels du rendu en ligne, section d'appel de la FAQ,
   largeur 1440 (centre = 720) :

       titre       centre 719   ✓
       sous-titre  centre 565   ✘  154 px trop à gauche
       bouton      centre 719   ✓

   Le paragraphe avait pourtant sa BOÎTE parfaitement centrée
   (margin 208px / 208px, max-width 736px) et « text-align: center ».
   Contradiction apparente, cause réelle : « style.css » pose
   « text-align-last: left » sur les paragraphes justifiés, pour que la
   dernière ligne d'un texte justifié ne s'étire pas. Or un paragraphe
   d'UNE SEULE LIGNE est entièrement sa dernière ligne : il partait donc
   à gauche, malgré le centrage.

   ⚠️ Pourquoi mes contrôles ne l'ont pas vu : ils mesuraient la position
   de la BOÎTE de l'élément, qui était juste, et lisaient « text-align »,
   qui valait bien « center ». Il faut mesurer l'étendue réelle des
   LIGNES DE TEXTE (Range.getClientRects) pour que le défaut apparaisse.

   Centrer un texte exige donc TOUJOURS les deux propriétés. */
.rv-centre,
.rv-centre p,
.rv-centre li,
.rv-appel p,
.rv-appel h2,
.rv-bandeau-chiffres p,
.rv-bandeau-chiffres h2,
.rv-legende.rv-centre,
.rv-confiance,
.rv-compteur,
.rv-temoignage figcaption,
.rv-mosaique figcaption.rv-centre{
  text-align:center !important;
  text-align-last:auto !important;
}
/* Et réciproquement : là où l'on justifie, la dernière ligne reste à
   gauche, ce qui est le comportement voulu. On le redit explicitement
   pour que la règle ci-dessus ne déborde pas. */
.rv-split-texte p,
.rv-c p,
.entry-content p{ text-align-last:auto; }

/* ══════════════════════════════════════════════════════════════════════
   8. ICÔNES EN LIGNE DES COORDONNÉES
   ══════════════════════════════════════════════════════════════════════
   🔴 La classe « rv-icone-inline » était posée dans le PHP mais
   n'existait NULLE PART dans les feuilles de style. Les icônes du bloc
   de coordonnées héritaient donc de « .rv-icone », prévu pour les
   grandes icônes de cartes :

       display:block              → l'icône passait au-dessus du texte
                                    au lieu de se placer devant lui
       color: var(--rv-teal)      → du pétrole #0B5563 sur un fond
                                    pétrole nuit : invisible

   Une classe inventée et jamais déclarée ne produit aucune erreur : elle
   ne fait simplement rien, et l'élément garde l'habillage du dessus. */
.rv-icone-inline{
  display:inline-block;
  width:1.15rem;
  height:1.15rem;
  flex:0 0 auto;
  color:currentColor;
  opacity:.9;
}
/* Sur fond sombre, la couleur du texte est claire : l'icône suit, mais
   on la teinte de l'ambre du site pour qu'elle se distingue du texte. */
.rv-sombre .rv-icone-inline,
.rv-encadre-petrole .rv-icone-inline{ color:#E9C9A6; opacity:1; }

/* La ligne de coordonnées devient une rangée : l'icône et le texte sont
   alors centrés l'un sur l'autre quelle que soit la taille de police,
   ce qu'un « vertical-align » ne garantit jamais tout à fait. */
p.rv-coord{
  display:flex;
  align-items:center;
  gap:.7rem;
  text-align:left !important;
  text-align-last:auto !important;
}
p.rv-coord a{ text-decoration:none; }
p.rv-coord a:hover{ text-decoration:underline; }