/* Reconciliation entre le balisage de Gutenberg et celui de la maquette.
   Chargee APRES cauris-v3.css, dont elle depend.

   ⭐ Les boutons ne sont plus repris ici : depuis le 29/10, le lien porte
   lui-meme la classe `btn` et ses variantes, posees au rendu par
   `boutons.php`. Toutes les regles des maquettes s appliquent donc telles
   quelles, y compris les regles CONTEXTUELLES que cette feuille ne pouvait
   pas connaitre (`.appel-integre .btn`, `.entete .btn`, `.tiroir .btn`…).

   ⛔ NE PAS Y REMETTRE DE REGLE DE BASE SUR `.wp-block-button__link` : elle
   pese plus lourd que `.appel-integre .btn` et reprendrait la main sur les
   affinages de contexte. */

body.cv3 .wp-block-button{display:inline-flex; max-width:100%}
body.cv3 .wp-block-buttons{display:flex; flex-wrap:wrap; gap:12px}

/* ⛔ La fleche du bouton est un <svg><use> dans la maquette, qu un
   core/button ne sait pas porter. Elle devient un pseudo-element masque :
   le bouton reste natif, donc modifiable au clic.
   ⭐ La classe est desormais sur le LIEN, plus sur l enveloppe. */
body.cv3 .wp-block-button__link.btn--fleche::after{
  content:""; width:18px; height:18px; flex:none;
  background:currentColor;
  -webkit-mask:var(--fleche) center / contain no-repeat;
          mask:var(--fleche) center / contain no-repeat;
  transition:transform .18s ease;
}
body.cv3 .wp-block-button__link.btn--fleche:hover::after{transform:translateX(3px)}
html.cv3{
  --fleche:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
}

/* ⭐ Sous WP 7.1 chaque paragraphe porte wp-block-paragraph : les regles de la
   maquette visent .rubrique et .chapo, qui restent posees par className. Rien
   a faire, mais la marge par defaut des blocs est a neutraliser. */
body.cv3 .wp-block-heading,
body.cv3 p.wp-block-paragraph{margin-block:0}

/* L enveloppe de Gutenberg ne doit pas brider les contenus : seule l enveloppe
   de page porte une largeur. Voir la regle client sur les titres. */
body.cv3 .wp-block-group__inner-container{max-width:none}

/* ⛔ Le voile du hero est reglable par ACF, mais la maquette le pose en dur.
   On le reecrit en fonction de --cv3-voile, en gardant les RAPPORTS entre les
   quatre arrets : a 0,64 le rendu est identique a la maquette validee. */
body.cv3 .hero{--cv3-voile:.74}
body.cv3 .hero::before{
  background:
    linear-gradient(90deg,
      rgba(7,8,12, var(--cv3-voile)) 0%,
      rgba(7,8,12, calc(var(--cv3-voile) * .78125)) 34%,
      rgba(7,8,12, calc(var(--cv3-voile) * .21875)) 62%,
      rgba(7,8,12, 0) 82%),
    linear-gradient(0deg,
      rgba(7,8,12, calc(var(--cv3-voile) * .703125)) 0%,
      rgba(7,8,12, 0) 32%);
}

/* ⛔ ACF enveloppe les InnerBlocks dans .acf-innerblocks-container. Cette
   couche casse les mises en page en grille ou en flex de la maquette, dont
   les enfants directs ne sont plus les bons. display:contents la rend
   transparente : les blocs redeviennent enfants directs de leur conteneur. */
body.cv3 .acf-innerblocks-container{display:contents}

/* Le gabarit v3 ne bride rien : seule l enveloppe de page porte une largeur. */
body.cv3 .cv3-main{max-width:none;margin:0;padding:0}

/* ---------- Entreprises cibles ---------- */

/* ⛔ core/image rend la legende en <figcaption> la ou la maquette posait
   <p class="quand">. Memes regles, autre balise. */
body.cv3 .scene-photo figcaption{
  position:absolute; left:28px; bottom:26px; z-index:1; margin:0;
  display:inline-flex; align-items:center; gap:9px;
  padding:10px 16px; border-radius:999px;
  background:rgba(255,255,255,.95); color:var(--roi);
  font:600 14.5px/1.2 var(--texte);
  box-shadow:0 8px 24px rgba(3,14,94,.3);
}
body.cv3 .scene-photo figcaption::before{
  content:""; width:9px; height:9px; border-radius:50%; background:var(--sphere);
}
/* core/image pose ses propres marges et une hauteur automatique */
body.cv3 .scene-photo{margin:0}
body.cv3 .scene-photo img{width:100%; height:100%; object-fit:cover}

/* ⛔ SANS SCRIPT, le contenu doit rester COMPLET : la bascule n existe pas
   encore, donc les deux profils s empilent et la premiere photo s affiche.
   Le script pose .js sur la scene et reprend la main. */
body.cv3 .scene:not(.js) .profils{display:block}
body.cv3 .scene:not(.js) .profil-b{
  opacity:1; visibility:visible; transform:none; margin-bottom:28px;
}
body.cv3 .scene:not(.js) .scene-photo:first-child{opacity:1}

/* La bascule est posee par le script a la fin de la tete. */
body.cv3 .cibles-tete .bascule{align-self:flex-end}

/* ---------- Frise des fonds ---------- */

/* ⛔ SANS SCRIPT, les onglets n existent pas : la feuille doit alors montrer
   TOUS les panneaux, sinon la page perd cinq recits sans rien dire. Le script
   pose .js sur la frise et reprend la main. */
body.cv3 .h4-frise:not(.js) .h4-panneaux{display:block}
body.cv3 .h4-frise:not(.js) .h4-panneau{
  opacity:1; visibility:visible; position:static; transform:none;
  margin-bottom:40px;
}

/* core/group rend .h4-frise et .h4-panneaux : les regles de la maquette les
   visent par leur classe, qui est bien posee. Rien d autre a faire. */

/* ---------- Marges injectees par Gutenberg ---------- */

/* ⛔⛔ WordPress pose `margin-block-start` sur TOUS les enfants d un groupe
   SAUF le premier. Dans une rangee de volets, le premier reste en place et
   les trois autres descendent de 24 px : le decalage ne vient ni de la
   maquette ni du bloc, mais de la mise en page automatique des groupes.
   Toute la mise en page v3 vient de la feuille de la maquette : on neutralise. */
body.cv3 :where(.is-layout-flow) > *,
body.cv3 :where(.is-layout-constrained) > *{margin-block-start:0; margin-block-end:0}

/* ---------- Plaques de logos ---------- */

/* ⛔ Pour un logo LARGE, c est la largeur de la plaque qui plafonne, pas la
   hauteur : BOA, de rapport 5,75, butait a 199 px de large et retombait a
   41 px de haut. On rend 16 px de marge laterale. Ecart assume par rapport a
   la maquette, a la demande du client du 29/10. */
body.cv3 .plaque{padding-left:14px; padding-right:14px}

/* ---------- Boutons : le reset du theme parent ---------- */

/* ⛔⛔ `reset.css` de hello-elementor pose
   `[type="button"]:hover{background-color:#CC3366}`, un ROSE.
   `.volet-bouton` est un <button type="button"> qui couvre toute la carte :
   au survol, la carte entiere virait au rose. Le meme piege que sur JDK.

   ⭐ On neutralise avec `:where()`, qui ne compte pas dans la specificite :
   la regle pese (0,2,0), juste assez pour battre le reset, et PAS assez pour
   ecraser les survols propres de la maquette, qui pesent (0,2,1). */
body.cv3 :where(button, [type="button"], [type="submit"], [type="reset"]),
body.cv3 :where(button, [type="button"], [type="submit"], [type="reset"]):hover,
body.cv3 :where(button, [type="button"], [type="submit"], [type="reset"]):focus{
  background-color:transparent;
  color:inherit;
  text-decoration:none;
  border-color:transparent;
}

/* ---------- L air entre la tete d une section et son contenu ---------- */

/* ⛔⛔ `display:contents` corrige la MISE EN PAGE mais ne change PAS l arbre :
   les selecteurs de voisinage le traversent toujours. La maquette espace par
   `.section .tete + *{margin-top:44px}` ; or `.tete` vit dans le conteneur
   d InnerBlocks, et son voisin n est donc plus le contenu de la section.
   Mesure du 29/10 : 0 px sous le titre des publications au lieu de 44, et
   64 px sous celui des generations, le `.lt` reprenant sa propre marge.

   ⭐ On recree l adjacence a travers le conteneur.

   ⛔⛔ ET ON LA POSE A POIDS NUL, par `:where()`. Au poids de la maquette
   (0,3,0) elle ecrase la marge PROPRE du voisin : mesure du 29/10, le total
   leve de la page des investisseurs, qui declare 14 px, en recevait 44, et la
   tete de section passait de 383 a 413 px. Ce n est pas une regle de mise en
   page, c est un DEFAUT : tout element qui declare sa marge doit la garder,
   donc le selecteur ne doit peser plus que lui. */
/* ⛔ ET ELLE NE VAUT QUE POUR UN ENFANT DIRECT DE L ENVELOPPE. Posee sur
   tout descendant, elle ajoutait 44 px a l encart de note du Fonds Cauris IV,
   qui suit le conteneur d InnerBlocks DANS une colonne de texte ayant deja
   son interligne : la colonne passait de 488 a 532 px. La regle recree
   l adjacence « tete de section puis contenu de section », pas n importe
   quelle adjacence a l interieur d un bloc. */
:where(body.cv3) :where(.section) > :where(.enveloppe) > :where(.acf-innerblocks-container) + :where(*){margin-top:44px}

/* Le message de retour du guichet investisseur. Il n est pas dans la
   maquette : celle-ci ne montre que le formulaire vierge, sans traitement.
   Pose ici et non dans la feuille de page, qui est regeneree. */
body.cv3 .sc-retour{
  margin:0 0 20px; padding:14px 18px; border-radius:var(--rayon);
  background:rgba(5,27,184,.06); border:1px solid rgba(5,27,184,.18);
  font:600 15px/1.5 var(--texte); color:var(--roi);
}

/* ⛔⛔ L ANIMATION D ENTREE DES HEROS NE DOIT JAMAIS POUVOIR EFFACER LE TEXTE.
   La maquette pose `.sc-entree{opacity:0;transform:translateY(18px);animation:…}`
   sans aucune condition. Mesure du 29/10 : volet au second plan, animations
   non jouees, le H1, le chapeau, le bouton ET la navigation du hero etaient
   a `opacity:0` au bout de trois secondes. Tout le haut de la page etait
   vide, et rien ne le signalait.

   Deux filets, sur le modele de `.anim-monte` :
   1. sans script, l etat de depart ne s applique pas du tout ;
   2. avec script, une classe posee au bout de six secondes revele quoi
      qu il arrive, animation jouee ou non.
   Poids (0,3,0), au-dessus de la regle portee de la maquette. */
html:not(.js-cv3-entree) body.cv3 .fc-entree,
html.cv3-entree-finie body.cv3 .fc-entree,
html:not(.js-cv3-entree) body.cv3 .mb-entree,
html.cv3-entree-finie body.cv3 .mb-entree,
html:not(.js-cv3-entree) body.cv3 .sc-entree,
html.cv3-entree-finie body.cv3 .sc-entree,
html:not(.js-cv3-entree) body.cv3 .pf-entree,
html.cv3-entree-finie body.cv3 .pf-entree{
  opacity:1; transform:none; animation:none;
}

/* Les retards de l entree du hero. ⭐ Ils sont poses par la feuille et non
   par un style en ligne : un attribut `style` sur un bloc coeur n est pas
   enregistre dans ses attributs, donc la premiere sauvegarde dans l editeur
   l effacerait. `display:contents` sur le conteneur d InnerBlocks ne change
   pas l arbre, donc `nth-child` compte bien les enfants poses. */
body.cv3 [class$="-hero-texte"] .acf-innerblocks-container > [class*="-entree"]:nth-child(1){--d:.15s}
body.cv3 [class$="-hero-texte"] .acf-innerblocks-container > [class*="-entree"]:nth-child(2){--d:.35s}
body.cv3 [class$="-hero-texte"] .acf-innerblocks-container > [class*="-entree"]:nth-child(3){--d:.5s}
body.cv3 .sc-hero-in > .sc-familles.sc-entree{--d:.7s}

/* ⛔⛔ L OR BRULE EST ILLISIBLE EN PETIT TEXTE SUR FOND CLAIR.
   Mesure du 29/10/2026 : `--or-brule` (#C0700C) sert de couleur de texte a
   sept endroits, 52 elements sur quatre pages plus le parcours, tous entre
   3,46 et 3,77 pour 4,5 exiges.

     .gv-principe-sur   sur #F3F5FB   12,5 px   3,46
     .pf-op--sortie .pf-sens sur #FFF6D6 13,5 px 3,49
     .h4-rang           sur #FFF      13 px     3,77
     .pc-ecran-num, .pc-champ i, .pc-groupe i, .pc-bascule i, .sc-champ i,
     .sc-groupe i       sur #FFF      12,5-13,5 px 3,77

   ⭐ On ne touche PAS au jeton : il sert aussi de fond et de degrade, ou il
   est juste. On en derive un jeton de TEXTE, meme teinte (33,3 deg) et meme
   saturation (0,882), clarte 0,400 -> 0,344, qui donne 4,74 sur la carte de
   principe, 4,77 sur le badge de sortie et 5,17 sur blanc.

   ⛔ La specificite est montee d un cran (`html.cv3 body.cv3`) parce que la
   feuille de page se charge APRES celle-ci : a specificite egale, c est elle
   qui gagnerait. */
html.cv3{--or-texte:#A05D0A}
html.cv3 body.cv3 .gv-principe-sur,
html.cv3 body.cv3 .h4-rang,
html.cv3 body.cv3 .pf-op--sortie .pf-sens,
html.cv3 body.cv3 .pc-ecran-num,
html.cv3 body.cv3 .pc-champ i,
html.cv3 body.cv3 .pc-groupe i,
html.cv3 body.cv3 .pc-bascule i,
html.cv3 body.cv3 .sc-champ i,
html.cv3 body.cv3 .sc-groupe i{color:var(--or-texte)}

/* ⛔⛔ LE REPLI EN UNE COLONNE DE L INTRODUCTION NE S APPLIQUAIT JAMAIS.
   La feuille de la maquette declare `.ac-intro` DEUX FOIS sans media : une
   fois en 6fr/5fr (bloc de l accelerateur), une fois en 8fr/4fr (bloc de la
   gouvernance). Le repli `@media (max-width:960px){.ac-intro{1fr}}` vient du
   premier bloc, donc AVANT la seconde declaration : a specificite egale,
   c est la derniere qui gagne, media ou pas.

   Mesure du 29/10/2026 a 360 px, sur la maquette comme sur la page : la
   grille reste a deux colonnes, la colonne de droite tombe a 95 px, et
   `.ac-source` (151 px au minimum) sort a 397 px pour 360 de large, soit
   37 px de debordement et une barre de defilement horizontale.

   ⭐ On retablit l intention du systeme, celle qu applique la page
   Accelerateur avec la meme classe : une colonne sous 960 px. La page
   Gouvernance se lit donc en une colonne la ou la maquette en montrait deux,
   entre 360 et 960 px. Au-dela de 960 px, rien ne change. */
@media (max-width:960px){
	html.cv3 body.cv3 .ac-intro{grid-template-columns:minmax(0,1fr)}
}


/* ⛔⛔ LES CINQ ETAPES DE LA PAGE DES CRITERES NE SONT PAS DES RUBRIQUES.
   Elles nomment les cinq ecrans du parcours, qui porte DEJA ces huit titres
   dans sa fenetre : « Votre entreprise », « Vos chiffres », « Votre besoin »,
   « Votre projet », « Vous contacter ». Les laisser en `h3` des deux cotes
   faisait cinq titres de niveau 3 en double DANS la page.

   ⭐ Ce sont les titres de la PAGE qui cedent, pas ceux du parcours : dans
   une fenetre de formulaire aussi longue, les titres servent a naviguer
   d un ecran a l autre, et ils sont la cible de `aria-labelledby` de chaque
   ecran. Sur la page, une etape de procedure n est pas une section du
   document : meme raisonnement que les verifications du guichet.

   La balise devient donc `b`, et cette regle lui rend l aspect que
   `.nc-etape h3` donnait. */
html.cv3 body.cv3 .nc-etape b{
  display:block; margin-top:10px;
  font:600 18px/1.3 var(--titre); color:var(--encre);
}


/* ⛔⛔ LA MAQUETTE DE CONTACT N A PAS D ACCUSE A L ECRAN. Le moteur, lui,
   renvoie le visiteur sur la page avec `?cc=ok`, `champs`, `email`, `jeton`
   ou `bloque`, et `cauris_contact_notice()` rend la phrase correspondante.
   Sans regle, elle sortait en paragraphe nu au milieu du formulaire : apres
   un envoi reussi, le visiteur ne voyait AUCUNE confirmation lisible.

   ⭐ Les deux encres sont celles de l ancienne feuille, mesurees : 7,79:1
   pour le vert sur son fond, 7,94:1 pour le rouge sur le sien. Le rayon et
   la fonte viennent des jetons v3. */
html.cv3 body.cv3 .ct-notice{
  padding:15px 18px; border-radius:var(--rayon);
  font:400 14.5px/1.6 var(--texte);
}
html.cv3 body.cv3 .ct-notice.est-bien{background:#EDF7EF;border:1px solid #BFDEC7;color:#1E5631}
html.cv3 body.cv3 .ct-notice.est-mal{background:#FBF0F0;border:1px solid #E7C4C4;color:#8A2525}


/* ⛔⛔ LE SOCLE v3 EST FAIT POUR DES BLOCS, PAS POUR DE LA PROSE.
   `body.cv3 a{color:inherit;text-decoration:none}` et
   `body.cv3 ul,body.cv3 ol{padding:0;list-style:none}` sont justes pour une
   page montee en blocs, ou chaque lien et chaque liste portent leur classe.
   Dans le corps d un article, ils effacent TOUT : les 43 liens du corpus
   deviennent du texte noir qu aucun signe ne distingue, et les 22 listes
   (75 puces) perdent leurs marqueurs et leur retrait.

   ⛔ La maquette de l article ne le montrait pas : son exemple ne contient
   que des `h2` et des `p`. Le corpus reel, lui, porte 33 `h3`, 22 `ul`,
   1 `ol`, 2 tableaux, 10 `em`, 1 `cite` et 1 `sup`.

   ⭐ Ces regles rendent a la prose ce que le socle lui retire, dans les
   jetons de la v3 et sous `.at-texte` seulement : aucune page a blocs n est
   touchee. Le lien est a 11,32:1 sur blanc. */
html.cv3 body.cv3 .at-texte a{
  color:var(--roi); text-decoration:underline; text-underline-offset:3px;
  text-decoration-thickness:1px; transition:color .2s ease;
}
html.cv3 body.cv3 .at-texte a:hover{color:var(--roi-vif)}
html.cv3 body.cv3 .at-texte > h3{
  margin:38px 0 16px; font:600 21px/1.35 var(--titre); color:var(--encre);
  scroll-margin-top:calc(var(--entete) + 28px);
}
html.cv3 body.cv3 .at-texte > ul,
html.cv3 body.cv3 .at-texte > ol{
  margin:0 0 24px; padding-left:24px; display:block;
}
html.cv3 body.cv3 .at-texte > ul{list-style:disc}
html.cv3 body.cv3 .at-texte > ol{list-style:decimal}
html.cv3 body.cv3 .at-texte li{margin:0 0 10px; padding-left:4px}
html.cv3 body.cv3 .at-texte li::marker{color:var(--roi)}
html.cv3 body.cv3 .at-texte li > ul,
html.cv3 body.cv3 .at-texte li > ol{margin:10px 0 0; padding-left:22px; list-style:circle}
html.cv3 body.cv3 .at-texte em, html.cv3 body.cv3 .at-texte i{font-style:italic}
html.cv3 body.cv3 .at-texte cite{font-style:italic; color:var(--ardoise)}
html.cv3 body.cv3 .at-texte sup{font-size:.72em; vertical-align:super; line-height:0}
html.cv3 body.cv3 .at-texte blockquote{
  margin:32px 0; padding:4px 0 4px 22px; border-left:3px solid var(--or);
  font-size:1.03em; color:var(--encre);
}
html.cv3 body.cv3 .at-texte table{
  width:100%; margin:0 0 28px; border-collapse:collapse; font-size:16px; line-height:1.55;
}
html.cv3 body.cv3 .at-texte th,
html.cv3 body.cv3 .at-texte td{
  padding:11px 14px; border:1px solid var(--filet); text-align:left;
  vertical-align:top; overflow-wrap:anywhere;
}
html.cv3 body.cv3 .at-texte thead th{background:var(--toile); color:var(--encre); font-weight:600}
html.cv3 body.cv3 .at-texte figure{margin:0 0 28px}
html.cv3 body.cv3 .at-texte img{height:auto; border-radius:var(--rayon)}


/* ⛔ « Dans cet article » EST UNE ETIQUETTE, PAS UN TITRE DE DOCUMENT.
   La maquette la pose en `h2`, a 13 px en capitales, dans le volet de
   navigation de l article. En `h2` elle faisait un titre de niveau 2
   IDENTIQUE sur les soixante-sept articles du site : le client demande
   qu aucun Hn ne se repete, ni dans la page ni entre les pages.

   ⭐ La balise devient `b`, et cette regle lui rend l aspect que
   `.at-sommaire-boite summary h2` donnait. Dans un `summary` en `flex`,
   un `b` et un `h2` font la meme boite : la geometrie ne bouge pas.
   Meme raisonnement que les cinq etapes de la page des criteres. */
html.cv3 body.cv3 .at-sommaire-boite summary b{
  font:600 13px/1.3 var(--titre); letter-spacing:.06em;
  text-transform:uppercase; color:var(--ardoise);
}
