/*
Theme Name:   R-Values Consulting
Theme URI:    https://www.rvaluesconsulting.com/
Description:  Thème enfant Divi. Direction artistique « premium » du 11/08/2026 (document Refonte du site web).
Author:       Quentin POLLET, QuinqComputerDev
Template:     Divi
Version:      2.1.0
Text Domain:  rvalues
*/

/* ════════════════════════════════════════════════════════════════
   PALETTE — document « Refonte du site web », § 1.1
   Répartition prescrite : 60 % ivoire/blanc, 25 % bleu pétrole,
   10 % vert sauge, 5 % terracotta réservé aux boutons d'action.

   ⚠️ Les noms de variables restent ceux de la version 1 : huit cents
   lignes en dépendent, et renommer n'aurait rien apporté. Seules les
   VALEURS changent. La correspondance est donnée en regard.

   ⚠️ Le terracotta prescrit #C97C4B ne tient que 3,01:1 sur ivoire et
   3,25:1 sous du texte blanc. Il ne peut donc pas porter de texte,
   alors que la charte en fait la couleur des boutons d'action. D'où
   deux valeurs : la prescrite pour l'ambiance, et une variante de même
   teinte (23°) et même saturation (54 %) assombrie à L=42 %, qui tient
   4,95:1 sous du blanc et 4,59:1 sur ivoire.
   ════════════════════════════════════════════════════════════════ */
:root{
  --rv-teal:#0B5563;        /* bleu pétrole profond, primaire — 7,82:1 sur ivoire */
  --rv-teal-clair:#0F6E80;  /* survol — 5,47:1, reste lisible */
  --rv-teal-nuit:#083F4A;   /* fonds sombres, pied de page — ivoire dessus : 10,71:1 */
  --rv-vert:#5C7A3F;        /* vert sauge profond — 4,52:1, porte du texte */
  --rv-vert-fonce:#4A6332;  /* sauge appuyé — 6,24:1 */
  --rv-encre:#2E3538;       /* graphite anthracite, texte — 11,59:1 */
  --rv-neutre:#FAF6EF;      /* ivoire chaud, fond principal */
  --rv-trait:#E8E2D6;       /* gris perle chaud, cartes et séparateurs */
  --rv-gris:#6A635C;        /* texte secondaire, gris chaud — 5,49:1 */

  --rv-terracotta:#C97C4B;      /* accent d'ambiance : fonds, filets, grands chiffres */
  --rv-terracotta-fort:#A55E31; /* le même quand il porte du texte : boutons, liens */

  --rv-serif:'Fraunces',Georgia,'Times New Roman',serif;
  --rv-sans:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
}

/* ────────── Typographie — document Refonte, § 1.2 ──────────
   Titres en serif éditoriale (Fraunces), texte courant en sans-serif
   claire (Inter). Les deux sont servies depuis ce serveur, jamais
   depuis Google : la mesure du 05/08 donne zéro hôte tiers avant
   consentement, et c'est l'argument RGPD le plus solide du dossier.
   Voir polices.css et le dossier polices/. */
body,
body .et_pb_module,
input, textarea, select, button{
  font-family:var(--rv-sans);
  color:var(--rv-encre);
  font-feature-settings:'cv05' 1, 'cv08' 1;  /* l et 1 distincts dans Inter */
}
h1,h2,h3,h4,h5,h6,
.et_pb_module h1,.et_pb_module h2,.et_pb_module h3,.et_pb_module h4{
  font-family:var(--rv-serif);
  font-weight:600;
  color:var(--rv-teal);
  letter-spacing:-.015em;
}

/* Fraunces est variable : « opsz » règle le contraste des pleins et des
   déliés. Élevé sur les grands titres, il donne le rendu éditorial ;
   laissé bas sur les petits, il garde la lisibilité. « SOFT » adoucit
   les angles, ce qui va avec le ton chaleureux demandé. */
h1{ font-variation-settings:'opsz' 120,'SOFT' 30,'WONK' 0; }
h2{ font-variation-settings:'opsz' 72,'SOFT' 24,'WONK' 0; }
h3,h4{ font-variation-settings:'opsz' 32,'SOFT' 18,'WONK' 0; }

/* Grands titres, beaucoup d'air, peu de tailles intermédiaires. */
h1{ font-size:clamp(2.3rem,1.5rem + 2.9vw,3.4rem); line-height:1.1; }
h2{ font-size:clamp(1.7rem,1.25rem + 1.7vw,2.35rem); line-height:1.18; }
h3{ font-size:clamp(1.22rem,1.06rem + .62vw,1.5rem); line-height:1.3; }
body{ font-size:clamp(1rem,.96rem + .2vw,1.1rem); line-height:1.68; }
.rv-legende{ font-size:.82rem; color:var(--rv-gris); line-height:1.5; }

/* ────────── Liens et boutons ────────── */
a{ color:var(--rv-teal); }
a:hover{ color:var(--rv-teal-nuit); }

.et_pb_button,
.et_pb_button:hover,
input[type=submit]{
  font-family:var(--rv-sans);
  font-weight:700;
  letter-spacing:.01em;
  border-radius:999px;          /* pilule, comme la maquette de la charte */
  border:0;
  padding:.85em 2em !important;
}
/* La charte réserve le terracotta aux boutons d'action : c'est les 5 %
   de la répartition 60/25/10/5. Le fond est la variante assombrie, la
   seule qui tienne 4,95:1 sous du texte blanc. */
.et_pb_button{
  background:var(--rv-terracotta-fort);
  color:#fff;
}
.et_pb_button:hover{ background:#8E4F28; color:#fff; }
/* Divi ajoute une flèche au survol, tirée de sa police d'icônes. Elle
   déplace le texte du bouton d'une dizaine de pixels et ne figure pas
   dans la charte : le bouton reste une pastille nette. */
.et_pb_button::after{ display:none !important; }
.et_pb_button:hover{ padding:.85em 2em !important; }
.et_pb_button:focus-visible,
a:focus-visible, button:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:3px solid var(--rv-teal);
  outline-offset:2px;
}
.rv-bouton-secondaire.et_pb_button{
  background:transparent;
  color:var(--rv-teal);
  box-shadow:inset 0 0 0 2px var(--rv-teal);
}
.rv-bouton-secondaire.et_pb_button:hover{ background:var(--rv-teal); color:#fff; }

/* Sur un fond pétrole, le bouton secondaire s'inverse : un contour
   sombre y serait invisible. */
.rv-hero-photo .rv-bouton-secondaire.et_pb_button,
.rv-sombre .rv-bouton-secondaire.et_pb_button{
  color:#fff; box-shadow:inset 0 0 0 2px rgba(255,255,255,.75);
}
.rv-hero-photo .rv-bouton-secondaire.et_pb_button:hover,
.rv-sombre .rv-bouton-secondaire.et_pb_button:hover{
  background:#fff; color:var(--rv-teal-nuit);
}

/* Lien de fin de section : un lien seul au milieu du blanc se voit mal. */
.rv-lien-fort{
  display:inline-flex; align-items:center; gap:.45rem;
  font-weight:600; text-decoration:none;
  border-bottom:2px solid currentColor; padding-bottom:.12rem;
}
/* Le caractere lui-meme. « 92 » ecrit depuis un script est lu comme
   un echappement octal :  devient un caractere de controle, et « 92 »
   s'affiche a l'ecran. */
.rv-lien-fort::after{ content:'→'; }
.rv-lien-fort:hover{ color:var(--rv-terracotta-fort); }

/* ────────── En-tête ──────────
   La charte impose 120 px de large au minimum à l'écran, sous peine de
   perdre la lisibilité du lettrage fin et de la signature manuscrite.
   Divi limite le logo en hauteur : on desserre. */
/* Le logo mesure 1573 x 639, soit un rapport de 2,46, avec TROIS niveaux
   de texte : le lettrage serif, la ligne « CONSULTING » très espacée, et
   la signature manuscrite. À 58 px de haut, « CONSULTING » faisait 4 px :
   illisible, et le logo paraissait flou alors qu'il était net.

   ⚠️ NE PAS forcer la hauteur du logo en CSS. Divi calcule la sienne en
   JavaScript à partir de « menu_height » et de « logo_height » (un
   POURCENTAGE), et repositionne la navigation en conséquence. Une hauteur
   imposée en CSS fait sortir le logo de son conteneur : il tombe sous le
   menu et chevauche le contenu. Le réglage se fait donc dans les options
   du thème, posées par le script 91-logo.php :
     menu_height 110, logo_height 78 %  → 86 px, soit 211 px de large
     minimized_menu_height 78            → 61 px, soit 150 px de large
   La charte impose 120 px de large au minimum : les deux états passent. */
#logo{ width:auto; max-width:none; }

/* ────────── Le menu ──────────
   Divi peint ses liens de menu en #2EA3F2, son bleu maison : 2,75:1 sur
   blanc, sous le seuil de 4,5:1. Le réglage « primary_nav_text_color » ne
   couvre ni l'élément courant, ni les sous-menus, ni le menu mobile.
   On reprend les cinq états à la main. */
#top-menu li a,
#et-secondary-nav li a,
.et_mobile_menu li a{
  color:var(--rv-encre) !important;   /* 14,58:1 */
  font-family:var(--rv-sans);
  opacity:1;
}
#top-menu li a:hover,
.et_mobile_menu li a:hover{ color:var(--rv-teal) !important; opacity:1; }

/* Page courante : le teal seul ne suffirait pas, la couleur ne doit
   jamais porter seule une information. Un filet la double. */
#top-menu li.current-menu-item > a,
#top-menu li.current_page_item > a,
#top-menu li.current-menu-ancestor > a{
  color:var(--rv-teal) !important;
  position:relative;
}
#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:''; position:absolute; left:0; right:0; bottom:-2px;
  height:2px; background:var(--rv-teal);
}
.et_mobile_menu li.current-menu-item > a,
.et_mobile_menu li.current_page_item > a{
  color:var(--rv-teal) !important; font-weight:700;
}

/* Sous-menus : fond blanc, texte encre, largeur lisible. */
#top-menu li ul.sub-menu{ border-top-color:var(--rv-teal); }
#top-menu li ul.sub-menu a{ color:var(--rv-encre) !important; width:230px; }
#top-menu li ul.sub-menu a:hover{ background:var(--rv-neutre); color:var(--rv-teal) !important; }

/* Le champ de recherche de l'en-tête, aux couleurs du site. */
.et-search-field{ color:var(--rv-encre) !important; font-family:var(--rv-sans); }
.et-search-field::placeholder{ color:var(--rv-gris); opacity:1; }

/* Pied de page. */
#footer-bottom{ background:var(--rv-encre) !important; }
#footer-info{ float:none; text-align:center; padding:4px 0; color:#A9B4B0; font-size:.86rem; }
#footer-info a{ color:#E2E8E5; text-decoration:none; }
#footer-info a:hover{ color:#fff; text-decoration:underline; }
#footer-info span{ margin:0 .3em; }

/* ────────── Bandeau d'accueil ──────────
   Les formes organiques de la maquette de la charte (diapositive 10),
   redessinees en SVG et repeintes a la palette officielle : masses
   organiques, palme guyanaise, courbes fines et trame de points.
   Le fichier vit dans le theme, il se modifie sans toucher au CSS. */
.rv-hero{
  position:relative;
  overflow:hidden;
  background:#fff;
}
.rv-hero::before{
  content:'';
  position:absolute; inset:0;
  background-image:url(//www.rvaluesconsulting.com/wp-content/themes/rvalues/assets/decor-hero.svg);
  background-repeat:no-repeat;
  background-position:right center;
  background-size:auto 100%;
  pointer-events:none;
}
.rv-hero > .et_pb_row{ position:relative; z-index:1; }

@media (max-width:980px){
  /* ⚠️ Vu en capture, pas en mesure : les formes passaient DERRIERE le
     titre et le chapeau. Le controle automatique ne pouvait pas le voir,
     il lit la couleur de fond CSS, pas le pixel reellement affiche.
     On enferme le decor dans une bande haute : le texte revient sur
     blanc, la signature visuelle reste. */
  .rv-hero::before{
    inset:0 0 auto 0;
    height:160px;
    background-position:right -30px top -14px;
    background-size:auto 250px;
  }
  .rv-hero{ padding-top:140px !important; }
}

/* ────────── Blocs de la maquette ────────── */
.rv-neutre{ background:var(--rv-neutre); }

/* Section sur fond sombre. Sans cette règle, le texte hérite du graphite
   posé sur .et_pb_module et tombe à 1,9:1 sur le pétrole nuit. */
.rv-sombre .et_pb_text_inner,
.rv-sombre .et_pb_text_inner p,
.rv-sombre .et_pb_text_inner li{ color:#DDE5E2; }   /* 9,0:1 sur le pétrole nuit */
.rv-sombre .et_pb_text_inner h1,
.rv-sombre .et_pb_text_inner h2,
.rv-sombre .et_pb_text_inner h3{ color:#FFFFFF; }
.rv-sombre .et_pb_text_inner a{ color:#E9C9A6; }
.rv-sombre .rv-legende{ color:#BCC7C3; }

/* Chiffres clés. Le teal officiel remplace le turquoise de la maquette,
   qui tombait à 2,72:1 sur le fond crème. */
.rv-chiffre{
  font-family:var(--rv-serif);
  font-weight:700;
  font-size:clamp(2.6rem,2rem + 2.6vw,3.6rem);
  line-height:1;
  color:var(--rv-teal);
}
.rv-chiffre .u{ font-size:.42em; margin-left:.12em; }

/* Chiffre en attente : visible comme gabarit, impossible à confondre avec
   une vraie valeur. Les indicateurs Qualiopi ne s'inventent pas. */
.rv-chiffre.rv-attente{
  color:#C8CFCB;
  position:relative;
}
.rv-chiffre.rv-attente::after{
  content:'à fournir';
  position:absolute; left:0; bottom:-.35em;
  font-family:var(--rv-sans); font-size:.22em; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:#A55E31;
}

/* Cartes de même hauteur sur une rangée.
   Divi met les colonnes en float : on repasse la rangée en grille, sinon
   la carte la plus courte flotte et la rangée paraît bancale. */
@media (min-width:981px){
  /* ⚠️ Deux essais avant celui-ci, tous deux mesurés :
       « repeat(3,1fr) » était figé, une rangée de deux cartes n'occupait
       que les deux premiers tiers ;
       « repeat(auto-fit, minmax(230px,1fr)) » n'a effacé qu'UNE piste vide
       sur deux (grille calculée : 365 365 365 0), donc toujours un vide.
     Le flex est déterministe ici : chaque carte réclame 230 px puis se
     partage le reste. Deux cartes prennent la moitié, trois le tiers,
     quatre le quart, sans dépendre d'un calcul de pistes. */
  .et_pb_row:has(> .rv-carte){
    display:flex;
    flex-wrap:wrap;
    gap:28px;
  }
  .et_pb_row:has(> .rv-carte) > .rv-carte{
    flex:1 1 230px;
    width:auto !important; margin:0 !important; float:none !important;
    display:flex; flex-direction:column;
  }
  /* Le bouton se colle en bas quelle que soit la longueur du texte. */
  .rv-carte .et_pb_button_module_wrapper{ margin-top:auto; padding-top:1.2rem; }
}

/* Cartes d'expertise : coin coloré, ombre douce, hauteur égalisée. */
.rv-carte{
  background:#fff;
  border-radius:14px;
  box-shadow:0 2px 4px rgba(46,53,56,.05), 0 12px 28px rgba(46,53,56,.07);
  overflow:hidden;
  height:100%;
}
.rv-carte .et_pb_module{ margin-bottom:0; }

/* ────────── Gabarit des pages d'expertise ────────── */

/* ⚠️ Supprimé après relecture : un dégradé en diagonale à 105° coupait
   la page en deux et se lisait comme un défaut de rendu, pas comme une
   intention. Les pages d'expertise emploient désormais le même bandeau
   que le reste du site, décor compris. La classe reste déclarée pour
   qu'une page ancienne ne perde pas sa bordure. */
.rv-bandeau-page{
  position:relative;
  border-bottom:1px solid var(--rv-trait);
  background:#fff;
}

/* Encadré « Pour qui », en vis-à-vis du texte principal. */
.rv-encadre{
  background:var(--rv-neutre);
  border-left:3px solid var(--rv-teal);
  border-radius:0 10px 10px 0;
  padding:1.6rem 1.6rem 1.2rem !important;
}
.rv-encadre h3{ margin-top:0; }

/* Les trois étapes, numérotées.
   ⚠️ Version précédente rejetée sur capture : le chiffre à 28 % d'opacité
   passait pour un défaut d'affichage, et le trait pointillé, calé en
   pourcentage de la colonne, flottait au-dessus du numéro au lieu de le
   relier au suivant. Le numéro est maintenant cerclé et pleinement
   contrasté, le trait part du bord de la pastille. */
.rv-etape{ position:relative; padding-top:.2rem; }
.rv-numero{
  margin:0 0 .8rem;
  line-height:1;
}
.rv-numero span{
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:50%;
  background:var(--rv-teal); color:#fff;      /* 5,47:1 */
  font-family:var(--rv-serif); font-weight:700; font-size:1.35rem;
  position:relative; z-index:1;
}
.rv-etape h3{ margin-top:0; font-size:1.08rem; }
.rv-etape p:not(.rv-numero){ margin-bottom:0; }

@media (min-width:981px){
  /* ⚠️ Un trait par étape, filé vers la droite, dépassait la troisième
     pastille : la ligne du deuxième pas courait jusqu'au bord de la
     rangée. Un seul trait porté par la rangée règle le problème, calé
     exactement d'un centre de pastille à l'autre.

     Colonne 1_3 = 29,6667 % de la rangée, gouttière = 5,5 %.
     Un pas vaut donc 35,1667 %, et deux pas 70,3334 %. La pastille fait
     48 px : son centre est à 24 px du bord de la colonne. */
  .rv-etapes-rangee{ position:relative; }
  .rv-etapes-rangee::before{
    content:''; position:absolute;
    top:24px; left:24px; width:70.3334%;
    border-top:2px dotted var(--rv-teal); opacity:.40;
    z-index:0;
  }
  .rv-etape{ z-index:1; }
}

/* Filet de section, repris de la signature visuelle de la charte. */
.rv-filet::before{
  content:''; display:block; width:56px; height:3px; border-radius:2px;
  background:var(--rv-teal); margin:0 auto 1.1rem;
}

/* Citation de témoignage. */
.rv-temoignage{
  background:var(--rv-neutre);
  border-radius:16px;
  padding:clamp(1.6rem,1rem + 2vw,2.8rem);
}
.rv-temoignage blockquote{
  font-family:var(--rv-serif);
  font-style:italic;
  font-size:clamp(1.05rem,.98rem + .4vw,1.28rem);
  line-height:1.55;
  border:0; margin:0; padding:0;
}
.rv-pastille{                     /* initiales, jamais un portrait */
  width:56px; height:56px; border-radius:50%;
  background:var(--rv-teal); color:#fff;
  font-family:var(--rv-serif); font-weight:700; font-size:1.15rem;
  display:flex; align-items:center; justify-content:center;
}

/* ────────── Accessibilité ──────────
   Garde-fou : deux verts vifs traînent dans d'anciens contenus, le
   #74AB1B de la charte 1 (2,77:1) et le #7FCA32 du site en production
   (2,2:1). Aucun ne porte de texte lisible. Cette règle les rattrape si
   quelqu'un les applique en style direct depuis le constructeur. */
.et_pb_text_inner [style*="#74AB1B" i],
.et_pb_text_inner [style*="#7FCA32" i],
.et_pb_text_inner [style*="#00AFC7" i]{ color:var(--rv-vert-fonce) !important; }

.rv-lien-evitement{
  position:absolute; left:-9999px; top:0; z-index:100000;
  background:var(--rv-encre); color:#fff; padding:.7em 1.2em; border-radius:0 0 8px 0;
}
.rv-lien-evitement:focus{ left:0; color:#fff; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

/* ════════════════════════════════════════════════════════════════
   Pages de texte long : légales, FAQ, Qualiopi, articles
   ════════════════════════════════════════════════════════════════ */

/* Bandeau raccourci, pour les pages qui n'ouvrent pas sur une promesse. */
.rv-hero-court{ padding-top:76px !important; padding-bottom:56px !important; }
.rv-hero-court h1{ font-size:clamp(1.85rem,1.35rem + 1.8vw,2.4rem); }

/* Longueur de ligne lisible. Au-delà de 70 signes l'œil perd la ligne
   suivante, et un texte légal se lit déjà mal. */
.rv-texte-legal .et_pb_text_inner{ max-width:none; }
.rv-texte-legal p,
.rv-texte-legal li{ max-width:68ch; }
.rv-texte-legal h2{ margin-top:2.6rem; }
.rv-texte-legal h2:first-child{ margin-top:0; }
.rv-texte-legal h3{ margin-top:1.7rem; font-size:1.12rem; }
.rv-texte-legal ul{ padding-left:1.2rem; }
.rv-texte-legal li{ margin-bottom:.45rem; }

/* Sommaire ancré. Utile au lecteur, et il donne à Google les sous-titres
   de la page sous forme de liens. */
.rv-sommaire{
  background:var(--rv-neutre); border-left:4px solid var(--rv-teal);
  padding:1.2rem 1.4rem; margin-bottom:2.4rem; border-radius:0 10px 10px 0;
}
.rv-sommaire p{ margin:0 0 .5rem; }
.rv-sommaire ul{ margin:0; padding-left:1.1rem; columns:2; column-gap:2rem; }
.rv-sommaire li{ margin-bottom:.3rem; break-inside:avoid; }
@media (max-width:600px){ .rv-sommaire ul{ columns:1; } }

/* La cible d'une ancre ne doit pas se coller au bord haut de la fenêtre. */
[id]{ scroll-margin-top:96px; }

/* Tableaux : lisibles au doigt, et jamais plus larges que l'écran. */
.rv-tableau{
  width:100%; border-collapse:collapse; margin:1.4rem 0 2rem;
  font-size:.95rem; display:block; overflow-x:auto;
}
.rv-tableau th,
.rv-tableau td{
  border:1px solid #E0D9CB; padding:.65rem .8rem;
  text-align:left; vertical-align:top;
}
.rv-tableau thead th{ background:var(--rv-teal); color:#fff; font-weight:700; }
.rv-tableau tbody tr:nth-child(even){ background:var(--rv-neutre); }

/* Au téléphone, le tableau devient une pile d'étiquettes : plus de
   défilement horizontal, et chaque cellule garde son intitulé. */
@media (max-width:640px){
  .rv-tableau,
  .rv-tableau thead,
  .rv-tableau tbody,
  .rv-tableau tr,
  .rv-tableau td{ display:block; width:100%; }
  .rv-tableau thead{ display:none; }
  .rv-tableau tr{
    border:1px solid #E0D9CB; border-radius:8px;
    margin-bottom:1rem; overflow:hidden;
  }
  .rv-tableau td{ border:0; border-bottom:1px solid #EFEAE0; }
  .rv-tableau td:last-child{ border-bottom:0; }
  .rv-tableau td::before{
    content:attr(data-col); display:block;
    font-weight:700; color:var(--rv-encre); font-size:.78rem;
    text-transform:uppercase; letter-spacing:.04em; margin-bottom:.15rem;
  }
}

/* Valeur que la cliente doit fournir. Rouge et encadrée : impossible de
   la laisser partir en production sans la voir. */
.rv-attendu{
  display:inline-block; background:#FDECEC; color:#A32020;
  border:1px dashed #D46A6A; border-radius:4px;
  padding:.05em .45em; font-size:.86em; font-weight:700;
}

/* Un bouton qui a l'apparence d'un lien : réouvre le bandeau de
   consentement sans casser la lecture du paragraphe. */
.rv-lien-bouton{
  background:none; border:0; padding:0; font:inherit;
  color:var(--rv-teal); text-decoration:underline; cursor:pointer;
}
.rv-lien-bouton:hover{ color:var(--rv-encre); }

/* ════════════════════════════════════════════════════════════════
   Blocs de page : coordonnées, études de cas, jalons, FAQ
   ════════════════════════════════════════════════════════════════ */

/* Largeur de contenu commune aux gabarits maison (blog, 404, recherche).
   Divi utilise 1180 px : on s'aligne dessus pour éviter la marche. */
.rv-largeur{ max-width:1180px; margin-left:auto; margin-right:auto; padding-left:24px; padding-right:24px; }

/* Étiquette de rubrique : petite capitale teal, au-dessus d'un titre. */
.rv-etiquette{
  font-size:.78rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--rv-teal); margin-bottom:.35rem;
}
.rv-etiquette a{ color:inherit; text-decoration:none; }
.rv-etiquette a:hover{ text-decoration:underline; }

/* Chapeau : le paragraphe d'attaque, un cran au-dessus du corps. */
.rv-chapo{ font-size:1.14rem; line-height:1.66; color:var(--rv-encre); }

/* ────────── Carte de coordonnées, page Contact ────────── */
.rv-carte-coord{ align-self:start; }
.rv-coord h2{ margin-top:0; font-size:1.35rem; }
.rv-coord h3{ margin-top:1.6rem; font-size:1.05rem; }
.rv-coord-ligne{ margin-bottom:.9rem; }
.rv-coord-etiq{
  display:block; font-size:.76rem; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color:var(--rv-gris);
}

/* ────────── Formulaires Forminator, repeints à la charte ────────── */
.rv-formulaire .forminator-button-submit{
  background:var(--rv-teal) !important; border-radius:999px !important;
  border:0 !important; padding:.85em 2.2em !important;
  font-family:var(--rv-sans) !important; font-weight:700 !important;
}
.rv-formulaire .forminator-button-submit:hover{ background:#083F4A !important; }
.rv-formulaire .forminator-label{ color:var(--rv-encre) !important; font-family:var(--rv-sans) !important; }
.rv-formulaire .forminator-input,
.rv-formulaire .forminator-textarea{ border-radius:8px !important; font-family:var(--rv-sans) !important; }
.rv-formulaire .forminator-input:focus,
.rv-formulaire .forminator-textarea:focus{ border-color:var(--rv-teal) !important; }
/* L'astérisque de champ obligatoire doit garder un contraste suffisant :
   le rouge par défaut de Forminator est trop clair sur blanc. */
.rv-formulaire .forminator-required{ color:#B3261E !important; }

/* ────────── Études de cas ────────── */
.rv-cas + .rv-cas{ margin-top:3rem; }
.rv-cas h2{ margin-top:.2rem; }
.rv-cas-grille{ display:grid; gap:1.6rem; grid-template-columns:1fr; margin-top:1.4rem; }
@media (min-width:820px){ .rv-cas-grille{ grid-template-columns:repeat(3,1fr); } }
.rv-cas-grille h3{ margin-top:0; font-size:1.02rem; }
.rv-cas-citation{
  margin:1.8rem 0 0; padding:1.1rem 1.4rem;
  border-left:4px solid var(--rv-vert); background:var(--rv-neutre);
  font-style:italic; border-radius:0 10px 10px 0;
}

/* ────────── Jalons et listes à coches ────────── */
.rv-jalons{ list-style:none; padding-left:0; }
.rv-jalons li{
  padding-left:1.6rem; position:relative; margin-bottom:.85rem;
  border-left:2px solid #DED7C8; padding-bottom:.4rem;
}
.rv-jalons li::before{
  content:""; position:absolute; left:-7px; top:.45em;
  width:12px; height:12px; border-radius:50%;
  background:var(--rv-teal); border:2px solid #fff;
}
.rv-liste-coches{ list-style:none; padding-left:0; }
.rv-liste-coches li{ padding-left:1.7rem; position:relative; margin-bottom:.6rem; }
.rv-liste-coches li::before{
  content:""; position:absolute; left:0; top:.42em;
  width:.7rem; height:.38rem; border-left:2.5px solid var(--rv-vert-fonce);
  border-bottom:2.5px solid var(--rv-vert-fonce); transform:rotate(-45deg);
}

/* ────────── Fondatrice : pastille, jamais un portrait ────────── */
.rv-portrait{ display:flex; gap:1.4rem; align-items:flex-start; }
.rv-portrait .rv-pastille{ flex:0 0 auto; }
.rv-portrait h2{ margin-top:0; }

/* ────────── Numéro de critère Qualiopi ────────── */
.rv-numero-critere{
  font-family:var(--rv-serif); font-weight:700; font-size:2rem;
  line-height:1; color:var(--rv-teal); margin-bottom:.4rem;
}

/* ────────── FAQ : details natifs, aucun JavaScript ────────── */
.rv-faq h2{ margin-top:2.8rem; }
.rv-faq h2:first-child{ margin-top:0; }
.rv-question{
  border:1px solid #E4DDD0; border-radius:10px;
  margin-bottom:.7rem; background:#fff; overflow:hidden;
}
.rv-question[open]{ border-color:var(--rv-teal); }
.rv-question summary{
  cursor:pointer; padding:1rem 3rem 1rem 1.2rem; position:relative;
  font-family:var(--rv-sans); font-weight:700; color:var(--rv-encre);
  list-style:none; line-height:1.45;
}
.rv-question summary::-webkit-details-marker{ display:none; }
.rv-question summary:hover{ background:var(--rv-neutre); }
.rv-question summary:focus-visible{ outline:3px solid var(--rv-teal); outline-offset:-3px; }
/* Le chevron : deux traits, pas une image. */
.rv-question summary::after{
  content:""; position:absolute; right:1.3rem; top:1.35em;
  width:.55rem; height:.55rem;
  border-right:2.5px solid var(--rv-teal); border-bottom:2.5px solid var(--rv-teal);
  transform:rotate(45deg) translateY(-25%); transition:transform .18s;
}
.rv-question[open] summary::after{ transform:rotate(-135deg) translateY(-25%); }
.rv-reponse{ padding:0 1.2rem 1.1rem; }
.rv-reponse p:last-child{ margin-bottom:0; }
.rv-reponse p{ max-width:68ch; }

/* ════════════════════════════════════════════════════════════════
   Le blog : liste, article, archives
   ════════════════════════════════════════════════════════════════ */

.rv-bandeau-liste{
  background:var(--rv-neutre); padding:64px 0 44px;
  border-bottom:1px solid #E8E2D6;
}
.rv-bandeau-liste h1{ margin:.2rem 0 .6rem; }
.rv-bandeau-liste p{ color:var(--rv-gris); max-width:64ch; margin:0; }

.rv-zone-liste{ padding-top:44px; padding-bottom:60px; }

/* Filtres de rubrique. Défilement horizontal assumé au téléphone :
   c'est le seul cas où il vaut mieux qu'un retour à la ligne. */
.rv-filtres{ padding-top:26px; }
.rv-filtres ul{
  list-style:none; margin:0; padding:0 0 4px;
  display:flex; gap:.5rem; overflow-x:auto; scrollbar-width:thin;
}
.rv-filtres li{ flex:0 0 auto; }
.rv-filtres a{
  display:block; padding:.42em 1em; border-radius:999px;
  border:1px solid #D8D0C0; color:var(--rv-gris);
  text-decoration:none; font-size:.92rem; white-space:nowrap;
}
.rv-filtres a:hover{ border-color:var(--rv-teal); color:var(--rv-teal); }
.rv-filtres a[aria-current]{ background:var(--rv-teal); border-color:var(--rv-teal); color:#fff; }

/* Grille d'articles : une colonne au téléphone, deux à la tablette,
   trois au-delà. Les cartes s'égalisent par la grille elle-même. */
.rv-grille-articles{ display:grid; gap:1.8rem; grid-template-columns:1fr; }
@media (min-width:640px){ .rv-grille-articles{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .rv-grille-articles{ grid-template-columns:repeat(3,1fr); } }

.rv-carte-article{
  display:flex; flex-direction:column;
  background:#fff; border:1px solid #E8E2D6; border-radius:14px;
  overflow:hidden; transition:box-shadow .18s, transform .18s;
}
.rv-carte-article:hover{ box-shadow:0 10px 26px rgba(46,53,56,.10); transform:translateY(-2px); }
.rv-carte-article-image{ display:block; aspect-ratio:16/10; overflow:hidden; background:var(--rv-neutre); }
.rv-carte-article-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.rv-carte-article-vide{
  display:block; width:100%; height:100%;
  background:linear-gradient(135deg,var(--rv-teal) 0%,#0F6E80 55%,var(--rv-vert) 160%);
  opacity:.16;
}
.rv-carte-article-corps{ padding:1.2rem 1.3rem 1.4rem; display:flex; flex-direction:column; flex:1; }
.rv-carte-article-titre{ font-size:1.15rem; line-height:1.32; margin:.1rem 0 .5rem; }
.rv-carte-article-titre a{ color:var(--rv-encre); text-decoration:none; }
.rv-carte-article-titre a:hover{ color:var(--rv-teal); }
.rv-carte-article-extrait{ color:var(--rv-gris); font-size:.96rem; margin-bottom:1rem; }
.rv-carte-article-corps .rv-legende{ margin-top:auto; margin-bottom:0; }

/* Pagination. */
.rv-pagination{ margin-top:2.6rem; }
.rv-pagination ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.4rem; }
.rv-pagination a,
.rv-pagination span{
  display:block; min-width:2.5rem; text-align:center;
  padding:.5em .8em; border-radius:8px; border:1px solid #D8D0C0;
  color:var(--rv-gris); text-decoration:none;
}
.rv-pagination a:hover{ border-color:var(--rv-teal); color:var(--rv-teal); }
.rv-pagination .current{ background:var(--rv-teal); border-color:var(--rv-teal); color:#fff; }

/* ────────── Un article ────────── */
.rv-article-tete{ padding-top:44px; padding-bottom:8px; max-width:820px; }
.rv-article-tete h1{ margin:.3rem 0 .7rem; }
.rv-article-image{ margin:1.8rem auto; max-width:900px; }
.rv-article-image img{ width:100%; height:auto; border-radius:14px; display:block; }
.rv-article-image figcaption{ margin-top:.5rem; text-align:center; }

.rv-article-corps{ max-width:720px; padding-bottom:1rem; font-size:1.06rem; line-height:1.75; }
.rv-article-corps h2{ margin-top:2.4rem; }
.rv-article-corps h3{ margin-top:1.8rem; }
.rv-article-corps img{ max-width:100%; height:auto; border-radius:10px; }
.rv-article-corps blockquote{
  margin:1.8rem 0; padding:1.1rem 1.5rem;
  border-left:4px solid var(--rv-teal); background:var(--rv-neutre);
  border-radius:0 10px 10px 0; font-style:italic;
}
.rv-article-corps ul,
.rv-article-corps ol{ padding-left:1.3rem; }
.rv-article-corps li{ margin-bottom:.5rem; }

.rv-article-etiquettes{ max-width:720px; padding-bottom:.6rem; }
.rv-article-etiquettes a{
  display:inline-block; margin:.15rem .25rem .15rem 0;
  padding:.25em .8em; border-radius:999px; background:var(--rv-neutre);
  color:var(--rv-gris); font-size:.86rem; text-decoration:none;
}
.rv-article-etiquettes a:hover{ background:var(--rv-teal); color:#fff; }

.rv-article-auteur{
  max-width:720px; display:flex; gap:1.1rem; align-items:flex-start;
  margin:2.2rem auto 0; padding:1.4rem 1.5rem;
  background:var(--rv-neutre); border-radius:14px;
}
.rv-article-auteur p{ margin:0 0 .35rem; }
.rv-article-auteur p:last-child{ margin-bottom:0; font-size:.96rem; color:var(--rv-gris); }

.rv-fil{ font-size:.86rem; color:var(--rv-gris); margin-bottom:.5rem; }
.rv-fil a{ color:var(--rv-gris); }

.rv-lies{ padding:56px 0 10px; border-top:1px solid #E8E2D6; margin-top:56px; }
.rv-lies h2{ margin-bottom:1.4rem; }

/* Bandeau d'appel des gabarits maison : même rendu que sa version Divi. */
.rv-appel{ background:var(--rv-neutre); padding:60px 0; text-align:center; }
.rv-appel h2{ margin:0 0 .5rem; }
.rv-appel p{ color:var(--rv-gris); margin:0 0 1.6rem; }
.rv-bouton{
  display:inline-block; background:var(--rv-teal); color:#fff;
  padding:.85em 2.4em; border-radius:999px;
  font-family:var(--rv-sans); font-weight:700; text-decoration:none;
}
.rv-bouton:hover{ background:#083F4A; color:#fff; }

/* Champ de recherche. */
.rv-recherche{ margin:1.4rem 0 2rem; max-width:520px; }
.rv-recherche label{ display:block; font-weight:700; margin-bottom:.35rem; color:var(--rv-encre); }
.rv-recherche div{ display:flex; gap:.5rem; }
.rv-recherche input{
  flex:1; padding:.7em .9em; border:1px solid #CCC4B4;
  border-radius:8px; font-family:var(--rv-sans); font-size:1rem;
}
.rv-recherche input:focus{ outline:2px solid var(--rv-teal); outline-offset:1px; border-color:var(--rv-teal); }
.rv-recherche button{
  background:var(--rv-teal); color:#fff; border:0; border-radius:8px;
  padding:.7em 1.4em; font-family:var(--rv-sans); font-weight:700; cursor:pointer;
}
.rv-recherche button:hover{ background:#083F4A; }

/* Visible au clavier, partout. Divi ne le garantit pas. */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{ outline:3px solid var(--rv-teal); outline-offset:2px; }

/* ════════════════════════════════════════════════════════════════
   Pied de page à quatre colonnes
   ════════════════════════════════════════════════════════════════ */

#main-footer{ background:var(--rv-teal-nuit); }
#footer-widgets{ padding:52px 0 22px; }
#footer-widgets .footer-widget{ margin-bottom:26px !important; padding-bottom:0 !important; }
/* ⚠️ Divi peint les titres de widget avec sa couleur d'accent, en CSS
   généré à la volée et plus spécifique que ce fichier. Le pétrole
   sur le pied de page tombe à 1,3:1 : illisible. L'option
   « widget_header_color » ne suffit pas à le reprendre. */
/* Divi nomme ces titres `.title`, pas `.widgettitle` : le sélecteur qui
   agit est celui sur la balise nue. Depuis le 26/08/2026 ils sont en h2
   (voir functions.php), les deux balises restent visées pour que le
   pied ne change pas d'allure si le filtre saute. */
#footer-widgets .footer-widget h4,
#footer-widgets .footer-widget h2{
  font-family:var(--rv-serif); font-weight:700; font-size:1.05rem;
  color:#FFFFFF !important;          /* 15,4:1 sur le pétrole nuit */
  margin-bottom:.9rem; letter-spacing:0;
}
#footer-widgets .footer-widget,
#footer-widgets .footer-widget p,
#footer-widgets .footer-widget li{
  color:#DDE5E2;                      /* 9,0:1 sur le pétrole nuit */
  font-size:.94rem; line-height:1.6;
}
#footer-widgets .footer-widget ul{ list-style:none; margin:0; padding:0; }
#footer-widgets .footer-widget li{ margin-bottom:.42rem; }
#footer-widgets .footer-widget a{
  color:#EDF2F0;                      /* 10,2:1 sur le pétrole nuit */
  text-decoration:none;
}
#footer-widgets .footer-widget a:hover{ color:#fff; text-decoration:underline; }
.rv-pied-coord{ margin-bottom:.9rem !important; }
#footer-widgets .rv-legende{ color:#B6C2BE; font-size:.82rem; }

/* Le rouge de « à fournir » ne tient pas sur fond sombre : on l'inverse
   pour rester lisible sans perdre le signal d'alerte. */
#footer-widgets .rv-attendu,
.rv-sombre .rv-attendu{
  background:#4A1414; color:#FFC9C9; border-color:#8A4444;
}

/* Barre du bas : les mentions légales, pas les crédits d'Elegant Themes. */
#footer-bottom{ padding:14px 0; }

/* ────────── Page « Nos expertises » ────────── */
.rv-sous-pages{ list-style:none; padding:0; margin:.7rem 0 .9rem; }
.rv-sous-pages li{ margin-bottom:.3rem; padding-left:.9rem; position:relative; font-size:.95rem; }
.rv-sous-pages li::before{
  content:''; position:absolute; left:0; top:.62em;
  width:5px; height:5px; border-radius:50%; background:var(--rv-vert-fonce);
}
.rv-lien-fleche{ font-weight:700; text-decoration:none; }
.rv-lien-fleche::after{ content:' \2192'; }
.rv-lien-fleche:hover{ text-decoration:underline; }

/* Les titres de carte restent des liens sobres : le survol change la
   couleur, il ne souligne pas tout le bloc. */
.rv-carte h3 a{ color:var(--rv-encre); text-decoration:none; }
.rv-carte h3 a:hover{ color:var(--rv-teal); }

/* ════════════════════════════════════════════════════════════════
   Reprise de la maquette de la charte, et corrections de relecture
   ════════════════════════════════════════════════════════════════ */

/* ────────── 1. Les doubles puces ──────────
   ⚠️ Divi applique « list-style-type: disc » avec une spécificité plus
   forte que le thème enfant. Nos listes affichaient DEUX marqueurs : la
   puce de Divi et le rond dessiné en ::before. Le « list-style:none »
   simple ne suffit pas, il faut le forcer. */
.rv-sous-pages,
.rv-liste-coches,
.rv-jalons,
.rv-sommaire ul,
#footer-widgets .footer-widget ul{
  list-style:none !important;
  list-style-type:none !important;
}
.rv-sous-pages li,
.rv-liste-coches li,
.rv-jalons li,
#footer-widgets .footer-widget li{
  list-style:none !important;
  list-style-type:none !important;
}
/* Divi pose aussi une puce sur les listes de widgets par ::before. */
#footer-widgets .footer-widget li::before{ content:none !important; }

/* ────────── 2. Justification ──────────
   Le texte courant est justifié, avec césure : sans elle, le français
   fabrique des rivières blanches sur des colonnes étroites.
   Restent alignés à gauche : les titres, les légendes, les cellules de
   tableau, les listes courtes et tout ce qui est déjà centré. */
/* ⚠️ Justifier PARTOUT a été essayé, et rejeté sur capture : dans une
   colonne à trois, une ligne de sept mots s'étire en rivières blanches
   (« Nous   écrire,   la   réponse   arrive   sous   48   heures »).
   La justification ne s'applique donc qu'aux colonnes pleine largeur et
   au corps des articles, là où la ligne est assez longue pour que la
   césure travaille. Les cartes restent alignées à gauche. */
.et_pb_column_4_4 .et_pb_text_inner p,
.et_pb_column_3_5 .et_pb_text_inner p,
.rv-reponse p,
.rv-article-corps p,
.et_pb_post_content p,
.rv-texte-legal li{
  /* 25/08/2026 : la cliente demande de ne justifier nulle part. La règle
     reste, vidée de sa justification : ses sélecteurs servent encore à
     poser la césure manuelle et le rythme de ligne. */
  text-align:left;
  -webkit-hyphens:manual;
  hyphens:manual;
}
/* Les cartes et les colonnes étroites : jamais de justification. */
.rv-carte p,
.rv-cas-grille p,
.et_pb_column_1_3 p,
.et_pb_column_1_4 p,
.et_pb_column_1_2 p,
.et_pb_column_2_5 p{ text-align:left; hyphens:manual; }
.et_pb_text_inner h1,
.et_pb_text_inner h2,
.et_pb_text_inner h3,
.et_pb_text_inner h4,
.rv-legende,
.rv-etiquette,
.rv-coord-ligne,
.rv-tableau td,
.rv-tableau th,
.rv-sous-pages li,
.rv-liste-coches li,
.rv-jalons li,
.rv-carte-article-extrait,
#footer-widgets .footer-widget p,
#footer-widgets .footer-widget li{
  text-align:left;
  hyphens:manual;
}
[style*="text-align: center"] p,
.et_pb_text_align_center p,
.rv-appel p,
.et_pb_text_align_center .et_pb_text_inner p{ text-align:center; }

/* Une colonne étroite justifiée devient illisible : sous 480 px, retour
   à l'alignement à gauche. */
@media (max-width:480px){
  .et_pb_text_inner p,
  .rv-reponse p,
  .rv-article-corps p{ text-align:left; }
}

/* ────────── 3. Cartes : le coin coloré de la maquette ──────────
   La maquette pose une forme de feuille dans un angle, teal ou verte
   selon la carte, et une masse claire en bas. Repris ici en CSS pur. */
.rv-carte{ position:relative; overflow:hidden; }
.rv-carte::before{
  content:''; position:absolute; top:0; left:0;
  width:78px; height:78px;
  background:var(--rv-teal);
  border-bottom-right-radius:78px;
  opacity:.16;
  pointer-events:none;
}
.rv-carte::after{
  content:''; position:absolute; right:-30px; bottom:-40px;
  width:150px; height:120px;
  background:var(--rv-vert);
  border-radius:60% 40% 45% 55%;
  opacity:.10;
  pointer-events:none;
}
/* Une carte sur deux prend le vert en angle : c'est l'alternance de la
   maquette, obtenue sans classe supplémentaire. */
.rv-carte:nth-child(even)::before{ background:var(--rv-vert); opacity:.20; }
.rv-carte:nth-child(even)::after{ background:var(--rv-teal); opacity:.09; }
.rv-carte > .et_pb_module{ position:relative; z-index:1; }

/* Le lien « Découvrir » se colle en bas, quelle que soit la hauteur du
   texte au-dessus : sinon il flotte au milieu des cartes courtes. */
@media (min-width:981px){
  .rv-carte .et_pb_text,
  .rv-carte .et_pb_text_inner{ display:flex; flex-direction:column; height:100%; }
  .rv-carte .et_pb_text_inner > *:last-child{ margin-top:auto; margin-bottom:0; }
}

/* ────────── 4. Chiffres clés : les filets de la maquette ────────── */
@media (min-width:981px){
  .rv-chiffres .et_pb_column + .et_pb_column{
    border-left:1px solid #E0D9CB;
    padding-left:34px;
  }
}
.rv-chiffres .et_pb_text_inner p:not(.rv-chiffre){ text-align:left; }

/* ────────── 5. Témoignage : les guillemets de la maquette ────────── */
.rv-temoignage{ position:relative; }
.rv-temoignage::before{
  content:'\201C';
  position:absolute; left:14px; top:-14px;
  font-family:var(--rv-serif); font-size:6rem; line-height:1;
  color:var(--rv-teal); opacity:.22;
  pointer-events:none;
}
.rv-temoignage blockquote{ text-align:left; }

/* ────────── 6. Le filet teal de bas de page ──────────
   La maquette termine sur une bande teal pleine largeur. */
#footer-bottom{ border-top:5px solid var(--rv-teal); }

/* ────────── 7. Logo blanc dans le pied de page ────────── */
.rv-pied-logo{ margin-bottom:1.1rem; }
.rv-pied-logo img{ width:180px; height:auto; display:block; }

/* ────────── 8. Icônes des cartes d'expertise ──────────
   Traits fins aux couleurs officielles, jamais un aplat. */
.rv-icone{
  display:block; width:46px; height:46px; margin-bottom:.9rem;
  color:var(--rv-teal);
}
.rv-carte:nth-child(even) .rv-icone{ color:var(--rv-vert-fonce); }

/* ────────── 9. Séparateur de section, la vague de la charte ────────── */
.rv-vague{ display:block; width:190px; height:auto; margin:0 auto 1.2rem; opacity:.9; }

/* ══════════════════════════════════════════════════════════════════
   BLOCS DE LA VERSION 2 — dossier final du 14/08/2026
   Grilles de cartes, étapes numérotées, compteurs, témoignages,
   encadrés, accordéon, bandeau d'appel. Tous en CSS pur : rien de ce
   qui suit ne dépend de la mise en page à colonnes de Divi.
   ══════════════════════════════════════════════════════════════════ */

/* ────────── Bandeau de tête avec photo ──────────
   Le voile est posé ici, pas dans Divi : un dégradé réglé dans le
   constructeur se retrouve écrit dans chacune des vingt-deux pages, et
   le corriger demanderait de toutes les rouvrir.
   Opacités choisies pour que du blanc reste au-dessus de 4,5:1 même sur
   la zone la plus claire des photos fournies. */
.rv-hero-photo{ position:relative; overflow:hidden; }
.rv-hero-photo::before{
  content:''; position:absolute; inset:0; z-index:0;
  background:linear-gradient(100deg,
    rgba(8,63,74,.93) 0%, rgba(8,63,74,.88) 42%,
    rgba(8,63,74,.66) 72%, rgba(8,63,74,.52) 100%);
}
.rv-hero-photo > .et_pb_row{ position:relative; z-index:1; }
.rv-hero-photo .et_pb_row{
  padding-top:clamp(72px,10vw,132px) !important;
  padding-bottom:clamp(64px,9vw,116px) !important;
}
.rv-hero-photo .et_pb_column{ max-width:44rem; }
.rv-hero-photo h1,
.rv-hero-photo .et_pb_text_inner h1{ color:#FFFFFF; }
.rv-hero-photo .rv-chapo,
.rv-hero-photo .et_pb_text_inner p{ color:#F1EDE5; }

/* Les deux boutons du bandeau se posent côte à côte. Divi les empile
   dans des conteneurs séparés : on les remet en ligne. */
.rv-hero .et_pb_button_module_wrapper{ display:inline-block; margin:1.4rem .8rem 0 0; }

.rv-hero-sobre{ background:var(--rv-neutre); }
.rv-hero-sobre .et_pb_column{ max-width:46rem; }

.rv-chapo{ font-size:1.16rem; line-height:1.62; }

/* ────────── Grille de cartes ──────────
   Flex plutôt que grid : mesuré sur un autre dossier, « auto-fit » avec
   « minmax » n'efface qu'une piste vide sur deux dans Chromium, et la
   dernière rangée d'une grille incomplète se retrouve étirée. Le flex
   avec une base fixe est déterministe quel que soit le nombre de cartes. */
.rv-grille{ display:flex; flex-wrap:wrap; gap:1.6rem; }
/* ⚠️ « flex:1 1 15rem » laissait la derniere rangee s'etirer : six cartes
   se rangeaient en 4 + 2, les deux dernieres deux fois plus larges. Une
   base calculee sur la fraction exacte, sans grow, donne 3 + 3 ; la
   largeur minimale declenche le repli sur les ecrans etroits. */
.rv-grille > .rv-c{
  display:flex; flex-direction:column;
  flex:0 1 calc((100% - 3.2rem) / 3); min-width:15rem;
}
.rv-grille-2 > .rv-c{ flex-basis:calc((100% - 1.6rem) / 2); min-width:18rem; }
.rv-grille-4 > .rv-c{ flex-basis:calc((100% - 4.8rem) / 4); min-width:12rem; }

.rv-c{
  background:#FFFFFF;
  border:1px solid var(--rv-trait);
  border-radius:14px;
  padding:1.7rem 1.5rem 1.6rem;
  transition:transform .18s ease, box-shadow .18s ease;
}
/* « Effet de soulèvement au survol », demandé pour la grille des
   expertises et celle des 4R. */
.rv-c:hover{ transform:translateY(-3px); box-shadow:0 12px 28px rgba(46,53,56,.09); }
@media (prefers-reduced-motion:reduce){
  .rv-c, .rv-c:hover{ transition:none; transform:none; }
}
.rv-c h3{ margin:.9rem 0 .5rem; font-size:1.2rem; }
.rv-c h3 a{ color:inherit; text-decoration:none; }
.rv-c h3 a:hover{ color:var(--rv-terracotta-fort); }
/* Pas de justification dans une carte : sur une colonne de trois mots,
   elle fabrique des rivieres blanches et coupe « strate-gie ». */
.rv-c p,
.rv-temoignage p,
.rv-etapes p,
.rv-compteur .rv-libelle,
.rv-tags li,
.rv-badges li{ text-align:left !important; hyphens:manual !important; }
.rv-c p{ margin:0; color:var(--rv-gris); font-size:.98rem; line-height:1.6; }
.rv-c p:last-child{ margin-bottom:0; }

.rv-icone{ width:2.4rem; height:2.4rem; color:var(--rv-teal); display:block; }
.rv-c:nth-child(3n+2) .rv-icone{ color:var(--rv-vert); }
.rv-c:nth-child(3n+3) .rv-icone{ color:var(--rv-terracotta-fort); }

/* Sur fond ivoire, la carte blanche doit rester visible. */
.rv-fond-neutre .rv-c{ box-shadow:0 1px 2px rgba(46,53,56,.04); }

/* ────────── Étapes numérotées ──────────
   Les trois phases du bilan, les cinq de la VAE. Le trait qui relie les
   pastilles est tracé sur le conteneur, pas sur chaque étape : posé sur
   les éléments, il dépassait après le dernier. */
.rv-etapes{
  list-style:none; margin:2rem 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:1.6rem; position:relative;
}
.rv-etapes > li{
  flex:1 1 13rem; position:relative; padding-top:.2rem;
}
.rv-etapes .rv-num{
  display:flex; align-items:center; justify-content:center;
  width:2.9rem; height:2.9rem; border-radius:50%;
  background:var(--rv-teal); color:#FFFFFF;
  font-family:var(--rv-serif); font-size:1.24rem; font-weight:600;
  position:relative; z-index:1;
}
.rv-etapes h3{ margin:.9rem 0 .4rem; font-size:1.1rem; }
.rv-etapes p{ margin:0; color:var(--rv-gris); font-size:.97rem; }
@media (min-width:820px){
  .rv-etapes::before{
    content:''; position:absolute; top:1.45rem; left:1.45rem; right:1.45rem;
    border-top:2px dotted var(--rv-teal); opacity:.34; z-index:0;
  }
}

/* ────────── Indicateurs chiffrés ────────── */
.rv-compteurs{
  display:flex; flex-wrap:wrap; gap:1.4rem; margin:1.8rem 0 0;
}
.rv-compteur{
  flex:1 1 11rem; text-align:center;
  padding:1.5rem 1rem; border-radius:14px;
  background:#FFFFFF; border:1px solid var(--rv-trait);
}
.rv-chiffre{
  display:block; font-family:var(--rv-serif); font-weight:600;
  font-size:clamp(2.1rem,1.4rem + 2.2vw,2.9rem); line-height:1;
  color:var(--rv-terracotta-fort); font-variation-settings:'opsz' 120;
}
.rv-libelle{
  display:block; margin-top:.6rem; font-size:.92rem;
  color:var(--rv-gris); line-height:1.45;
}
.rv-compteur-vide{ background:var(--rv-neutre); border-style:dashed; }
.rv-compteur-vide .rv-chiffre{ font-size:1rem; }

/* ────────── Témoignages ──────────
   Pastille à initiales et jamais de portrait : l'accord photo des
   personnes citées n'est pas obtenu. */
.rv-temoignages{ display:flex; flex-wrap:wrap; gap:1.6rem; margin-top:2rem; }
.rv-temoignage{
  flex:1 1 18rem; margin:0; padding:1.8rem 1.6rem 1.5rem;
  background:rgba(201,124,75,.09);
  border:1px solid rgba(201,124,75,.28);
  border-radius:14px; position:relative;
}
.rv-pastille{
  display:flex; align-items:center; justify-content:center;
  width:3rem; height:3rem; border-radius:50%;
  background:var(--rv-teal); color:#FFFFFF;
  font-family:var(--rv-serif); font-weight:600; font-size:1.06rem;
  letter-spacing:.02em; margin-bottom:1rem;
}
.rv-temoignage blockquote{ margin:0; padding:0; border:0; }
.rv-temoignage blockquote p{
  font-family:var(--rv-serif); font-style:italic;
  font-size:1.06rem; line-height:1.58; color:var(--rv-encre);
  margin:0 0 1rem;
}
.rv-temoignage blockquote p::before{ content:'\201C'; }
.rv-temoignage blockquote p::after{ content:'\201D'; }
.rv-temoignage figcaption{ font-size:.92rem; line-height:1.4; }
.rv-temoignage figcaption b{ display:block; color:var(--rv-encre); }
.rv-temoignage figcaption span{ color:var(--rv-gris); }

/* ────────── Encadrés ────────── */
.rv-encadre{
  border-radius:14px; padding:1.8rem 1.7rem;
  background:var(--rv-neutre); border:1px solid var(--rv-trait);
  margin:1.8rem 0;
}
.rv-encadre > :last-child{ margin-bottom:0; }
.rv-encadre h3{ margin-top:0; }
.rv-encadre-terracotta{
  background:rgba(201,124,75,.10); border-color:rgba(201,124,75,.32);
}
.rv-encadre-petrole{
  background:var(--rv-teal-nuit); border-color:var(--rv-teal-nuit);
}
.rv-encadre-petrole,
.rv-encadre-petrole p,
.rv-encadre-petrole li{ color:#DDE5E2; }
.rv-encadre-petrole h3{ color:#FFFFFF; }
.rv-encadre-petrole a{ color:#E9C9A6; }

/* Le montant, en gros caractères, dans l'encadré de financement. */
.rv-montant{
  display:block; font-family:var(--rv-serif); font-weight:600;
  font-size:clamp(1.9rem,1.3rem + 2vw,2.6rem); line-height:1.1;
  color:var(--rv-terracotta-fort); margin:.2rem 0 .6rem;
}

/* ────────── Accordéon ──────────
   En <details> natif : il s'ouvre sans JavaScript, se cherche avec la
   fonction de recherche du navigateur, et s'imprime déplié. */
.rv-faq details{
  border:1px solid var(--rv-trait); border-radius:12px;
  background:#FFFFFF; margin-bottom:.8rem; overflow:hidden;
}
.rv-faq summary{
  cursor:pointer; padding:1.05rem 3rem 1.05rem 1.3rem;
  position:relative; list-style:none;
}
.rv-faq summary::-webkit-details-marker{ display:none; }
.rv-faq summary h3,
.rv-faq summary h4{
  display:inline; margin:0; font-size:1.06rem; line-height:1.4;
  color:var(--rv-teal);
}
.rv-faq summary::after{
  content:''; position:absolute; right:1.3rem; top:1.35rem;
  width:.65rem; height:.65rem; border-right:2px solid var(--rv-teal);
  border-bottom:2px solid var(--rv-teal); transform:rotate(45deg);
  transition:transform .18s ease;
}
.rv-faq details[open] summary::after{ transform:rotate(-135deg); top:1.6rem; }
.rv-faq summary:hover{ background:var(--rv-neutre); }
.rv-faq summary:focus-visible{ outline:3px solid var(--rv-teal); outline-offset:-3px; }
.rv-faq .rv-reponse{ padding:0 1.3rem 1.2rem; }
.rv-faq .rv-reponse > :last-child{ margin-bottom:0; }

/* ────────── Bandeau d'appel à l'action ────────── */
.rv-appel{ position:relative; overflow:hidden; background:var(--rv-teal-nuit); }
.rv-appel::before{
  content:''; position:absolute; inset:0; z-index:0;
  background:linear-gradient(90deg, rgba(8,63,74,.94), rgba(8,63,74,.80));
}
.rv-appel > .et_pb_row{ position:relative; z-index:1; }
.rv-appel h2{ color:#FFFFFF; }
.rv-appel p{ color:#E2E8E5; max-width:40rem; margin-left:auto; margin-right:auto; }

/* ────────── Les 4R en grande typographie ────────── */
.rv-mots-4r{
  display:flex; flex-wrap:wrap; gap:.4rem 1.6rem;
  list-style:none; margin:1.6rem 0 0; padding:0;
  font-family:var(--rv-serif); font-weight:600;
  font-size:clamp(1.5rem,1.1rem + 1.6vw,2.1rem); line-height:1.25;
}
.rv-mots-4r li:nth-child(4n+1){ color:var(--rv-teal); }
.rv-mots-4r li:nth-child(4n+2){ color:var(--rv-vert); }
.rv-mots-4r li:nth-child(4n+3){ color:var(--rv-terracotta-fort); }
.rv-mots-4r li:nth-child(4n+4){ color:var(--rv-teal-clair); }

/* ────────── Badges de compétences et étiquettes de modules ────────── */
.rv-badges{ display:flex; flex-wrap:wrap; gap:.6rem; list-style:none; margin:1.4rem 0 0; padding:0; }
.rv-badges li{
  border:1px solid var(--rv-teal); color:var(--rv-teal);
  border-radius:999px; padding:.42em 1em; font-size:.93rem; font-weight:500;
}
.rv-tags{ display:flex; flex-wrap:wrap; gap:.45rem; list-style:none; margin:.9rem 0 0; padding:0; }
.rv-tags li{
  background:var(--rv-neutre); border:1px solid var(--rv-trait);
  color:var(--rv-gris); border-radius:6px; padding:.28em .7em; font-size:.86rem;
}

/* ────────── Carte de la Guyane ────────── */
.rv-bloc-guyane{ display:flex; flex-wrap:wrap; gap:2.2rem; align-items:center; }
.rv-bloc-guyane > div{ flex:1 1 20rem; }
.rv-carte-guyane{ width:clamp(8rem,18vw,12.5rem); height:auto; color:var(--rv-teal); }

/* ────────── Bandeau de confiance ────────── */
.rv-confiance{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:1.4rem 2.6rem; margin-top:1.6rem;
}
.rv-confiance img{ max-height:3.4rem; width:auto; filter:grayscale(1); opacity:.72; transition:filter .2s, opacity .2s; }
.rv-confiance img:hover{ filter:grayscale(0); opacity:1; }

/* ────────── Divers ────────── */
.rv-centre{ text-align:center; }
.rv-centre p{ margin-left:auto; margin-right:auto; }
.rv-fond-neutre{ background:var(--rv-neutre); }

/* Un « à fournir » doit se voir de loin en relecture. */
.rv-manque{
  display:inline-block; background:#FDECEC; color:#A32020;
  border:1px dashed #D46A6A; border-radius:4px;
  padding:.1em .5em; font-size:.86em; font-weight:600;
  font-family:var(--rv-sans); font-style:normal;
}

/* ────────── Bouton WhatsApp flottant ──────────
   Demandé par le dossier final. Il reste au-dessus du contenu sans le
   masquer, et s'écarte du bord sur les écrans étroits. */
.rv-whatsapp{
  position:fixed; right:1.1rem; bottom:1.1rem; z-index:9000;
  display:flex; align-items:center; gap:.55rem;
  background:#17703D; color:#FFFFFF;      /* 6,14:1 sous du blanc */
  border-radius:999px; padding:.72rem 1.1rem;
  font-weight:600; font-size:.95rem; text-decoration:none;
  box-shadow:0 6px 20px rgba(46,53,56,.22);
}
.rv-whatsapp:hover{ background:#0F5C31; color:#FFFFFF; }
.rv-whatsapp svg{ width:1.35rem; height:1.35rem; flex:none; }
@media (max-width:600px){
  .rv-whatsapp span{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .rv-whatsapp{ padding:.85rem; }
}
@media print{ .rv-whatsapp{ display:none; } }

/* ────────── Corrections mesurées à la relecture ──────────
   Divi pose « text-align » sur .et_pb_text_inner : une classe de section
   ne redresse donc rien. Il faut viser l'intérieur du module. */
.rv-centre .et_pb_text_inner,
.rv-centre .et_pb_text_inner h1,
.rv-centre .et_pb_text_inner h2,
.rv-centre .et_pb_text_inner h3,
.rv-centre .et_pb_text_inner p{ text-align:center !important; }
.rv-centre .et_pb_text_inner p{ max-width:46rem; margin-left:auto; margin-right:auto; }

/* Le chapeau du bandeau ne se justifie pas : sur quatre lignes larges,
   la justification y creuse des blancs entre les mots. */
.rv-hero .et_pb_text_inner p,
.rv-chapo{ text-align:left !important; hyphens:manual !important; }

/* « Photo en plein écran » : le bandeau doit tenir la hauteur, pas se
   réduire à une bande de 250 px. */
.rv-hero-photo{ min-height:clamp(24rem,44vh,32rem); display:flex; align-items:center; }
.rv-hero-photo > .et_pb_row{ width:100%; }

/* ────────── Étapes : deux corrections mesurées ──────────
   1. Divi impose « list-style: decimal » sur les <ol> du contenu avec une
      spécificité supérieure à celle du thème enfant. Sans !important, le
      « 1. » natif s'affiche AU-DESSUS de la pastille, et décale tout.
      Même piège que les puces doubles des listes.
   2. Le trait pointillé passait devant les pastilles : il lui faut un
      z-index négatif, et aux pastilles un fond opaque. */
.rv-etapes{ list-style:none !important; }
.rv-etapes > li{
  list-style:none !important;
  margin-left:0 !important; padding-left:0 !important;
}
.rv-etapes > li::marker{ content:none; }
@media (min-width:820px){
  .rv-etapes::before{ z-index:0; }
}
.rv-etapes .rv-num{ z-index:1; box-shadow:0 0 0 .5rem #FFFFFF; }
.rv-fond-neutre .rv-etapes .rv-num{ box-shadow:0 0 0 .5rem var(--rv-neutre); }

/* Un titre qui suit un paragraphe a besoin de respirer. */
.et_pb_text_inner p + h2,
.et_pb_text_inner ul + h2,
.et_pb_text_inner div + h2{ margin-top:2.8rem; }
.et_pb_text_inner p + h3,
.et_pb_text_inner div + h3{ margin-top:2rem; }

/* ────────── Blocs ajoutés avec les pages métier ────────── */

/* Icône seule en tête de sous-page. */
.rv-icone-titre .rv-icone{ width:3.2rem; height:3.2rem; margin-bottom:1.2rem; }

/* Étude de cas : l'icône et le titre sur la même ligne. */
.rv-cas-tete{ display:flex; align-items:center; gap:1rem; }
.rv-cas-tete .rv-icone{ width:2.6rem; height:2.6rem; flex:none; }
.rv-cas-tete h2{ margin:0; }
.rv-cas > p{ max-width:52rem; }
.rv-temoignage-large{ max-width:52rem; margin-top:1.6rem; }

/* Contact : le formulaire et les coordonnées côte à côte. */
.rv-contact{ display:flex; flex-wrap:wrap; gap:2.4rem; align-items:flex-start; }
.rv-contact-form{ flex:1 1 24rem; }
.rv-contact-infos{ flex:1 1 18rem; }
.rv-contact-infos .rv-encadre:first-child{ margin-top:0; }
.rv-coord{ display:flex; align-items:center; gap:.7rem; }
.rv-icone-inline{ width:1.3rem; height:1.3rem; flex:none; }

/* Une seule colonne au téléphone, l'ordre reste le bon. */
@media (max-width:640px){
  .rv-contact{ gap:1.6rem; }
  .rv-bloc-guyane{ gap:1.4rem; }
}

/* ────────── Bandeau sobre, version 2 ──────────
   Le decor de la version 1 (masses organiques vert lime et cyan clair,
   palme) appartenait a l'ancienne charte. La nouvelle direction est
   « premium, rassurant, chaleureux » : un aplat ivoire, un filet
   terracotta, rien de plus. */
.rv-hero-sobre::before{ background-image:none !important; }
.rv-hero-sobre{
  background:var(--rv-neutre);
  border-bottom:3px solid var(--rv-terracotta);
}
.rv-hero-sobre::after{
  content:''; position:absolute; inset:auto -6rem -8rem auto;
  width:28rem; height:28rem; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(11,85,99,.09), rgba(11,85,99,0) 70%);
  pointer-events:none;
}
@media (max-width:980px){ .rv-hero-sobre::after{ width:18rem; height:18rem; } }

/* La carte n'a pas besoin de la moitie de la largeur. */
.rv-bloc-guyane > div:first-child{ flex:0 0 auto; }

/* ────────── Corrections de la recette du 14/08 ────────── */

/* Le formulaire Forminator pose des marges négatives sur ses rangées :
   21 px de débordement horizontal sous 640 px. */
.rv-formulaire .forminator-row{ margin-left:0 !important; margin-right:0 !important; }
.rv-formulaire .forminator-col{ padding-left:0 !important; padding-right:0 !important; }
.rv-formulaire form{ max-width:100%; overflow-x:hidden; }

/* Le marqueur « à fournir » est du texte, pas une pastille décorative. */
.rv-manque{ color:#8C1616; border-color:#B85454; }

/* ⚠️ Débordement de 21 px au téléphone, mesuré sur la page Contact.
   Un élément flex a « min-width: auto » par défaut : il refuse de
   descendre sous la largeur de son contenu, et le formulaire Forminator
   est large. Sa base de 24 rem l'emportait donc sur les 312 px
   disponibles. « min-width: 0 » l'autorise à se réduire. */
.rv-contact > *,
.rv-bloc-guyane > *,
.rv-grille > *,
.rv-compteurs > *,
.rv-temoignages > *,
.rv-etapes > li{ min-width:0; }
.rv-contact-form{ flex:1 1 24rem; min-width:0; }
.rv-formulaire, .rv-formulaire form, .rv-formulaire .forminator-row{ max-width:100%; }

/* Forminator peint ses descriptions de champ en #777771, soit 4,18:1 sur
   l'ivoire : sous le seuil, et c'est justement le texte qui explique à
   quoi sert le champ. On reprend la couleur de texte secondaire du site,
   qui tient 5,49:1. */
.rv-formulaire .forminator-description,
.rv-formulaire .forminator-label,
.rv-formulaire .forminator-required{ color:var(--rv-gris) !important; }
.rv-formulaire .forminator-description{ font-size:.86rem !important; }

/* ⚠️ Troisieme occurrence du meme piege : Divi impose « list-style » sur
   les <ul> du contenu avec une specificite superieure a celle du theme
   enfant. Toute liste qui n'est pas une liste a puces doit le dire avec
   !important, sinon la puce s'ajoute a la mise en forme voulue. */
.rv-mots-4r,
.rv-mots-4r li,
.rv-badges,
.rv-badges li,
.rv-tags,
.rv-tags li,
.rv-etapes,
.rv-etapes li{ list-style:none !important; }
.rv-mots-4r li::marker,
.rv-badges li::marker,
.rv-tags li::marker{ content:none; }