/* Celesta v2 - sections de l'accueil (bibliotheque .cvh reutilisable). Angles droits partout. */

/* ============================================================================
   CHARTE DE TITRES - socle du site (2026-08-20, validee par le client)
   L echelle elle-meme est portee par theme.json (styles.elements.h1..h6) :
   elle vaut donc AUSSI dans l editeur Gutenberg, et s applique partout ou
   aucune classe ne surcharge.

   Ce bloc n ajoute que ce que theme.json ne sait pas faire, et il est ecrit
   en `:where()` - specificite ZERO - pour que TOUTE regle existante des kits
   continue de gagner. Poser la charte ne change donc rien la ou une section
   s est deja reglee ; le rattrapage des kits se fera page par page, mesure.

   Reference d echelle (1366px) : H1 62 · H2 42 · H3 28 · H4 22 · H5 18 · H6 14
   Reference d echelle  (390px) : H1 32 · H2 24 · H3 20 · H4 17 · H5 15 · H6 12,5
   ============================================================================ */
:root {
	--cv2-t1: clamp(32px, 4.6vw, 62px);
	--cv2-t2: clamp(24px, 3.07vw, 42px);
	--cv2-t3: clamp(20px, 2.05vw, 28px);
	--cv2-t4: clamp(17px, 1.61vw, 22px);
	--cv2-t5: clamp(15px, 1.32vw, 18px);
	--cv2-t6: clamp(12.5px, 1.02vw, 14px);
	/* couleur d accent des titres : le bleu de marque tombe a 2,82 de contraste
	   sur le fond nuit, le ciel clair est mesure a 7,29 */
	--cv2-titre-accent: #56B5EB;
}

/* TITRE DE VIGNETTE : un titre de carte compacte prend le CRAN INFERIEUR de la
   charte, tout en gardant son niveau semantique (un H3 de vignette reste un H3
   pour Google et les lecteurs d ecran, mais s affiche a la taille d un H4).
   Mesure qui l a impose (2026-08-20) : dans une vignette de realisation large de
   390px, un titre de 58 caracteres a 28px occupait 3 lignes et 105px de haut. */
:root { --cv2-t-vignette: clamp(19px, 1.61vw, 22px); }
/* meme plafond que le H4 (22px), mais plancher releve a 19px : en mobile la carte
   occupe toute la largeur, et a 17px le titre ne se detachait plus du texte de la
   carte (14,5px) - rapport 1,17, insuffisant. A 19px le rapport remonte a 1,31. */

/* Aucun mot ne sort de sa colonne (mesure : « pyrotechnique » a 32px deborde
   de 24px d une colonne de 222px). */
:where(h1, h2, h3, h4, h5, h6) {
	overflow-wrap: break-word;
}

/* Espacement sous le titre, constant par niveau. Specificite zero : le blockGap
   du coeur et les marges des kits gagnent tant qu ils sont en place. */
:where(.wp-site-blocks h1) { margin-block: 0 20px; }
:where(.wp-site-blocks h2) { margin-block: 0 18px; }
:where(.wp-site-blocks h3) { margin-block: 0 14px; }
:where(.wp-site-blocks h4),
:where(.wp-site-blocks h5),
:where(.wp-site-blocks h6) { margin-block: 0 10px; }

body.home { background: var(--cv2-nuit); }

/* Neutraliser le blockGap du coeur sur les sections racine ((0,3,0) > (0,2,0)) */
.wp-site-blocks .wp-block-post-content > .cvh-sec,
.wp-site-blocks .wp-block-post-content > .cvh-hero,
.wp-site-blocks .wp-block-post-content > .cvh-drones { margin-block: 0; }
body.home .wp-block-post-content { margin-block-start: 0; }
body.home main { margin-block-start: 0; }

/* ------- Boutons (recette Celesta : degrade, angles droits) ------- */
.cvh-hero .wp-block-button__link,
.cvh-sec .wp-block-button__link,
.cvh-drones .wp-block-button__link {
	background: var(--cv2-degrade-bouton);
	color: var(--cv2-blanc);
	border-radius: 0;
	border: 0;
	font-family: Montserrat, ui-sans-serif, system-ui, sans-serif;
	font-size: 14.5px;
	font-weight: 600;
	letter-spacing: 0.03em;
	line-height: 1;
	padding: 15px 26px;
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.cvh-hero .wp-block-button__link:hover,
.cvh-sec .wp-block-button__link:hover { box-shadow: 0 8px 24px rgba(12, 103, 222, 0.45); transform: translateY(-1px); }
.cvh-hero .is-style-outline .wp-block-button__link,
.cvh-sec .is-style-outline .wp-block-button__link {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.55);
	color: var(--cv2-blanc);
}
.cvh-hero .is-style-outline .wp-block-button__link:hover { border-color: var(--cv2-ciel); box-shadow: none; }
.cvh-hero .wp-block-button__link { text-transform: uppercase; font-size: 15px; }

/* ------- Heros video ------- */
.cvh-hero { position: relative; }
.cvh-hero .wp-block-cover__inner-container {
	max-width: 1420px;
	margin-inline: auto;
	box-sizing: border-box;
	padding: clamp(140px, 22vh, 200px) clamp(20px, 5vw, 80px) clamp(48px, 9vh, 90px);
}
.cvh-hero h1 {
	font-size: var(--cv2-t1);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.01em;
	color: var(--cv2-blanc);
	margin: 0 0 22px;
	max-width: none;
}
.cvh-hero p { font-size: clamp(15.5px, 1.35vw, 18px); line-height: 1.65; color: rgba(255, 255, 255, 0.85); max-width: 740px; margin: 0 0 34px; }
.cvh-hero .wp-block-buttons { gap: 14px; }

/* ------- Section generique ------- */
.cvh-sec { color: #F3F3F3; }
.cvh-sec--abysse { background: var(--cv2-abysse); }
.cvh-sec--nuit { background: var(--cv2-nuit); }
/* --noir se superpose a --abysse (fond noir prod du 2026-08-18) pour conserver les coutures abysse+abysse existantes ; a refactorer si d'autres sections passent au noir */
.cvh-sec--noir { background: #000000; }
/* bleu nuit profond fourni par le client (2026-08-18) : entre l abysse et le nuit, plus bleute */
.cvh-sec--profond { background: #0D124F; }
.cvh-int {
	max-width: 1420px;
	margin-inline: auto;
	box-sizing: border-box;
	padding: clamp(64px, 8vw, 104px) clamp(20px, 3.2vw, 32px);
}
.cvh-sec + .cvh-sec--abysse .cvh-int, .cvh-sec--abysse + .cvh-sec--abysse .cvh-int { padding-top: 0; }
/* La frontiere de couleur abysse->noir rend la couture visible : la section noire reprend son air normal (prod : 106px au-dessus du titre). APRES la couture, meme specificite (0,3,0) : l'ordre tranche */
.cvh-sec--abysse + .cvh-sec--noir .cvh-int { padding-top: clamp(64px, 8vw, 104px); }

/* Titres de section + trait d'accent 150px */
.cvh-titre {
	font-size: var(--cv2-t2);
	font-weight: 700;
	line-height: 1.14;
	color: var(--cv2-blanc);
	text-align: center;
	margin: 0 0 18px;
}
.cvh-titre::after {
	content: '';
	display: block;
	width: 150px;
	height: 2px;
	margin: 22px auto 0;
	background: var(--cv2-degrade);
}
.cvh-titre--gauche { text-align: left; }
.cvh-titre--gauche::after { margin-left: 0; }
.cvh-sstitre {
	font-size: var(--cv2-t2);
	font-weight: 700;
	line-height: 1.14;
	color: var(--cv2-blanc);
	text-align: center;
	margin: 0 0 16px;
}
.cvh-sstitre::after {
	content: '';
	display: block;
	width: 150px;
	height: 2px;
	margin: 22px auto 0;
	background: var(--cv2-degrade);
}
.cvh-intro { text-align: center; max-width: 820px; margin: 0 auto 42px; color: rgba(255, 255, 255, 0.75); font-size: 16px; line-height: 1.7; }

/* ------- Disciplines : rangees numerotees 01-05 (parite prod, mesures du 2026-08-18) ------- */
@font-face {
	font-family: 'Montserrat Alternates';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/montserrat-alternates-700-latin.woff2') format('woff2');
}
.cvh-int.cvh-int--disc { padding: 60px; }
.cvh-disc-titre {
	font-size: var(--cv2-t2);
	font-weight: 700;
	line-height: 1.14;
	text-align: left;
	color: var(--cv2-blanc);
}
.cvh-disc-titre::after {
	content: '';
	display: block;
	width: 150px;
	height: 2px;
	margin-top: 65px;
	background: var(--cv2-degrade);
}
/* Accents degrades des titres (parite prod : degrade 90deg bleu->ciel decoupe dans le texte, repli bleu) */
.cvh-hero mark, .cvh-sec mark, .cvh-drones mark {
	background-image: var(--cv2-degrade-titre);
	background-color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: var(--cv2-bleu);
}
.cvh-disc-liste { display: flex; flex-direction: column; gap: 20px; }
.cvh-disc-item {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 20px;
	border-bottom: 1px solid rgba(86, 181, 235, 0.33);
}
.cvh-disc-num {
	width: 14%;
	min-width: 0;
	box-sizing: border-box;
	padding: 10px;
	font-family: 'Montserrat Alternates', Montserrat, ui-sans-serif, system-ui, sans-serif;
	font-size: 70px;
	font-weight: 700;
	line-height: 1;
	color: rgba(7, 12, 61, 0.32);
	-webkit-text-stroke: 1px var(--cv2-ciel);
}
.cvh-disc-txt {
	width: 40%;
	flex-grow: 1;
	flex-shrink: 0;
	box-sizing: border-box;
	padding: 10px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: flex-start;
}
.cvh-disc-txt h3 { font-size: var(--cv2-t3); font-weight: 700; line-height: 1.25; color: var(--cv2-blanc); }
.cvh-disc-txt p { font-size: 15px; line-height: 1.7; color: #CCCCCC; }
.cvh-disc-txt p.cvh-disc-cta { line-height: 1; }
.cvh-disc-cta {
	width: 57%;
	box-sizing: border-box;
	padding: 10px;
	border: 1px solid var(--cv2-bleu);
}
.cvh-disc-cta:hover { border-color: var(--cv2-blanc); }
.cvh-disc-cta a { color: var(--cv2-accent); font-size: 16px; font-weight: 400; text-transform: uppercase; text-decoration: none; }
.cvh-disc-cta a:hover, .cvh-disc-cta a:focus { color: var(--cv2-blanc); }
.cvh-disc-img {
	width: 40%;
	flex-grow: 1;
	flex-shrink: 0;
	box-sizing: border-box;
	padding: 10px;
	margin: 0;
	text-align: center;
}
.cvh-disc-img img { width: 75%; height: 245px; object-fit: cover; object-position: center center; display: inline-block; }
/* blockGap du coeur : zero marge dans les rangees, puis les marges voulues en (0,3,0)+ declarees apres */
.wp-site-blocks .cvh-int--disc > *,
.wp-site-blocks .cvh-disc-liste > *,
.wp-site-blocks .cvh-disc-item > *,
.wp-site-blocks .cvh-disc-txt > * { margin-block: 0; }
.wp-site-blocks .cvh-int--disc > .cvh-disc-titre { margin: 0 0 35px; } /* trait a 65px sous le texte + 35px avant la liste = 168px au total, geometrie prod conservee */
.wp-site-blocks .cvh-disc-item .cvh-disc-txt > p { margin-block-end: 14.4px; }
.wp-site-blocks .cvh-disc-item .cvh-disc-txt > .cvh-disc-cta { margin-block-end: 0; }
@media (max-width: 767px) {
	.cvh-int.cvh-int--disc { padding: 50px; }
	.cvh-disc-item { flex-wrap: wrap; padding: 0; }
	.cvh-disc-num, .cvh-disc-txt, .cvh-disc-img { width: 100%; flex-grow: 0; flex-shrink: 1; }
	.cvh-disc-cta { width: 222px; max-width: 100%; }
	.cvh-disc-img img { width: 100%; }
}

/* ------- Cartes (base reutilisable : publics 6) ------- */
.cvh-carte {
	display: flex;
	flex-direction: column;
	background: rgba(12, 103, 222, 0.07);
	border: 1px solid var(--cv2-trait);
	transition: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}
.cvh-carte:hover { border-color: rgba(86, 181, 235, 0.5); transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35); }
.cvh-carte h3 { font-size: 17.5px; font-weight: 600; color: var(--cv2-blanc); margin: 18px 18px 10px; line-height: 1.3; }
.cvh-carte p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.68); margin: 0 18px 12px; }
.cvh-carte .cvh-lien { margin-top: auto; padding: 0 18px 18px; }
.cvh-lien a { color: var(--cv2-ciel); font-size: 13.5px; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(86, 181, 235, 0.45); padding-bottom: 2px; transition: color 0.15s ease, border-color 0.15s ease; }
.cvh-lien a:hover { color: var(--cv2-blanc); border-color: var(--cv2-blanc); }

/* ------- Bande logos (marquee) ------- */
.cvh-logos { overflow: hidden; margin: 40px 0 70px; display: flex; flex-direction: column; gap: 34px; }
.cvh-logos__piste { display: flex; align-items: center; width: max-content; animation: cvh-defile 92s linear infinite; }
.cvh-logos__piste--inverse { animation-direction: reverse; }
.cvh-logos__piste:hover { animation-play-state: paused; }
.cvh-logos__piste figure { margin: 0 124px 0 0; flex: 0 0 auto; }
.cvh-logos__piste img { height: 100px; width: auto; display: block; opacity: 0.85; filter: brightness(0) invert(1); }
@keyframes cvh-defile {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

/* ------- Colonnes recit / texte long ------- */
.cvh-colonnes { gap: 56px; }
.cvh-prose { max-width: 880px; margin-inline: auto; }
.cvh-prose p, .cvh-colonnes p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.78); }
.cvh-liste { list-style: none; margin: 8px 0 26px; padding: 0; }
.cvh-liste li {
	position: relative;
	padding: 10px 0 10px 26px;
	font-size: 15px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.82);
	border-bottom: 1px solid rgba(86, 181, 235, 0.14);
}
.cvh-liste li::before { content: ''; position: absolute; left: 0; top: 19px; width: 12px; height: 2px; background: var(--cv2-ciel); }

/* Recit : grand visuel + module verre chevauchant (liquid glass, tendances 2026 — demande client du 2026-08-18) */
.cvh-colonnes > .wp-block-column { box-sizing: border-box; } /* les colonnes core sont en content-box : le padding du module fausserait le 50/50 */
@media (min-width: 782px) {
	/* !important face au flex-basis inline des colonnes ; scope desktop pour laisser le coeur empiler en mobile */
	.cvh-colonnes > .wp-block-column { flex: 0 0 calc(50% - 28px) !important; }
}
.wp-site-blocks .cvh-colonnes--recit .wp-block-buttons, .wp-site-blocks .cvh-colonnes--creation .wp-block-buttons { margin-block: 30px 0; }
@media (min-width: 782px) {
	/* le bandeau de verre remonte de 48px : la colonne de gauche reserve cette hauteur,
	   sinon le bouton passe dessous et le flou le transforme en tache (mesure : recouvrement de 40px). */
	.cvh-colonnes--recit > .wp-block-column:first-child { padding-bottom: 64px; }
}
.cvh-colonnes--recit .cvh-titre, .cvh-colonnes--creation .cvh-titre { font-size: var(--cv2-t2); } /* meme taille que .cvh-sstitre (demande client) */
.cvh-recit-scene { position: relative; min-height: 420px; }
.cvh-recit-visuel {
	margin: 0;
	/* absolue : le visuel epouse la hauteur de sa colonne, sinon le bandeau ne mord plus rien
	   des que la colonne de texte devient plus haute que l image (mesure : -8px). */
	position: absolute;
	inset: 0;
	overflow: hidden;
	transform: perspective(1200px) rotateY(-5deg);
	transform-origin: right center;
	transition: transform 0.8s cubic-bezier(0.2, 0.6, 0.2, 1);
}
.cvh-recit-scene:hover .cvh-recit-visuel { transform: perspective(1200px) rotateY(0deg); }
.cvh-recit-visuel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cvh-recit-visuel::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.30), rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.55) 94%);
	pointer-events: none;
}
.cvh-recit-module {
	position: relative;
	z-index: 2;
	margin: -48px 0 0; /* morsure < vide sous le bouton (62px depuis la reduction du titre) : le CTA reste degage */
	padding: 32px 38px 36px;
	background: rgba(7, 12, 61, 0.42);
	-webkit-backdrop-filter: blur(16px) saturate(1.35);
	backdrop-filter: blur(16px) saturate(1.35);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow: 0 30px 70px rgba(0, 0, 0, 0.55);
	transition: transform 0.45s ease, box-shadow 0.45s ease;
}
.cvh-recit-module::before { content: ''; position: absolute; top: 0; left: 0; width: 150px; height: 2px; background: var(--cv2-degrade); }
.cvh-recit-module:hover { transform: translateY(-6px); box-shadow: 0 42px 90px rgba(0, 0, 0, 0.65); }
@supports not (backdrop-filter: blur(1px)) {
	.cvh-recit-module { background: rgba(7, 12, 61, 0.93); }
}
.cvh-recit-module .cvh-liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; margin: 0; }
.cvh-recit-module .cvh-liste li { padding: 18px 0 0; border-bottom: 0; font-size: 15px; line-height: 1.7; transition: color 0.3s ease; }
.cvh-recit-module .cvh-liste li:hover { color: #FFFFFF; }
.cvh-recit-module .cvh-liste li::before { width: 30px; height: 2px; top: 0; background: var(--cv2-degrade); transition: width 0.3s ease; }
.cvh-recit-module .cvh-liste li:hover::before { width: 46px; }
/* Creation sur mesure : miroir du recit (image gauche, texte droite) */
.wp-site-blocks .cvh-int > .cvh-colonnes--creation { margin-block-start: 96px; }
.cvh-creation-scene { position: relative; }
.cvh-creation-visuel {
	margin: 0;
	position: absolute; /* remplit la colonne : affleure le texte quelle que soit sa hauteur (un height:100% se resout en ratio naturel, paye) */
	inset: 0;
	overflow: hidden;
	transform: perspective(1200px) rotateY(5deg);
	transform-origin: left center;
	transition: transform 0.8s cubic-bezier(0.2, 0.6, 0.2, 1);
}
.cvh-creation-scene:hover .cvh-creation-visuel { transform: perspective(1200px) rotateY(0deg); }
.cvh-creation-visuel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cvh-creation-visuel::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.30), rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.55) 94%);
	pointer-events: none;
}
/* revelation au defilement : classes posees par accueil.js, rien n'est masque sans JS */
/* ⛔ L etat de repos ne masque PLUS rien. Avant : `.cvh-anim { opacity: 0 }` en permanence,
   revele par `.cvh-vu` -> tout contenu dont la revelation n arrivait pas restait INVISIBLE
   (constate en production par le client sur le diptyque). Desormais le masquage n existe
   qu a l interieur de l animation, jouee par `.cvh-vu` avec fill-mode BACKWARDS : sans
   revelation, le contenu s affiche normalement. */
@keyframes cvhMonte {
	from { opacity: 0; transform: translateY(14px); }
	to { opacity: 1; transform: none; }
}
.cvh-anim { opacity: 1; transform: none; }
/* Amplitude ramenee de 28 a 14px et sortie en easeOutQuint : le mouvement se pose
   au lieu de s arreter net. Avec le rang recalcule par groupe dans accueil.js,
   l entree redevient une cascade reguliere. */
.cvh-anim.cvh-vu { animation: cvhMonte 0.78s cubic-bezier(0.22, 1, 0.36, 1) backwards; }
@media (max-width: 781px) {
	.cvh-recit-scene { min-height: 0; }
	.cvh-recit-visuel { position: static; transform: none; }
	.cvh-recit-scene:hover .cvh-recit-visuel { transform: none; }
	.cvh-recit-visuel img { height: 340px; }
	.cvh-recit-module { margin: -40px 0 0; padding: 24px 22px 26px; }
	.cvh-recit-module .cvh-liste { grid-template-columns: 1fr; gap: 22px; }
	.cvh-creation-visuel { position: static; transform: none; }
	.cvh-creation-scene:hover .cvh-creation-visuel { transform: none; }
	.cvh-creation-visuel img { height: 340px; }
	.wp-site-blocks .cvh-int > .cvh-colonnes--creation { margin-block-start: 64px; }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-recit-visuel, .cvh-creation-visuel, .cvh-recit-module, .cvh-recit-module .cvh-liste li::before { transition: none !important; transform: none !important; }
	.cvh-anim { opacity: 1 !important; transform: none !important; }
}

/* ------- PALETTE DES EFFETS : en-tete asymetrique, 5 matieres, exergue, exigences ------- */
.cvh-entete {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 0.82fr);
	gap: clamp(28px, 4vw, 64px);
	align-items: end;
}
.cvh-entete__chapo { font-size: var(--cv2-t5); line-height: 1.66; color: rgba(255, 255, 255, 0.76); padding-bottom: 8px; }
.cvh-matieres { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.wp-site-blocks .cvh-int > .cvh-matieres { margin-block-start: 54px; }
.cvh-matiere {
	position: relative;
	overflow: hidden;
	min-height: 320px;
	padding: 26px 20px 22px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	border: 1px solid var(--cv2-trait);
	/* filet degrade en tete qui s etire sur toute la largeur au survol */
	background-color: rgba(12, 103, 222, 0.06);
	background-image: var(--cv2-degrade);
	background-repeat: no-repeat;
	background-position: top left;
	background-size: 44px 2px;
	transition: background-size 0.5s cubic-bezier(0.2, 0.6, 0.2, 1), transform 0.4s cubic-bezier(0.2, 0.6, 0.2, 1), border-color 0.4s ease, background-color 0.4s ease;
}
.cvh-matiere:hover {
	background-size: 100% 2px;
	background-color: rgba(12, 103, 222, 0.12);
	border-color: rgba(86, 181, 235, 0.45);
	transform: translateY(-6px);
}
/* halo qui chauffe par le bas */
.cvh-matiere::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -46%;
	width: 160%;
	height: 88%;
	transform: translateX(-50%);
	background: radial-gradient(50% 50% at 50% 50%, rgba(86, 181, 235, 0.30), rgba(86, 181, 235, 0) 70%);
	z-index: 1;
	opacity: 0.42;
	transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.2, 0.6, 0.2, 1);
	pointer-events: none;
}
.cvh-matiere:hover::after { opacity: 1; transform: translateX(-50%) translateY(-16px); }
/* image de fond : la matiere se montre, elle ne se symbolise plus (demande client) */
.cvh-matiere__img { position: absolute; inset: 2px 0 0 0; z-index: 0; margin: 0; overflow: hidden; }
.cvh-matiere__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.7s cubic-bezier(0.2, 0.6, 0.2, 1); }
.cvh-matiere:hover .cvh-matiere__img img { transform: scale(1.07); }
.cvh-matiere__img::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.34) 0%, rgba(0, 0, 0, 0.10) 30%, rgba(0, 0, 0, 0.62) 72%, rgba(0, 0, 0, 0.62) 100%);
	transition: opacity 0.5s ease;
}
.cvh-matiere:hover .cvh-matiere__img::after { opacity: 0.88; }
/* effet miroir : un reflet oblique balaie la carte au survol */
.cvh-matiere::before {
	content: '';
	position: absolute;
	top: -10%;
	bottom: -10%;
	left: 0;
	width: 55%;
	z-index: 2;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.14) 42%, rgba(255, 255, 255, 0.40) 50%, rgba(255, 255, 255, 0.14) 58%, rgba(255, 255, 255, 0) 100%);
	transform: translateX(-180%) skewX(-14deg);
	transition: transform 0.95s cubic-bezier(0.22, 0.61, 0.36, 1);
	pointer-events: none;
}
.cvh-matiere:hover::before { transform: translateX(340%) skewX(-14deg); }
.cvh-matiere__titre { font-size: 16px; font-weight: 600; line-height: 1.3; color: var(--cv2-blanc); position: relative; z-index: 3; }
.cvh-matiere__texte { font-size: 13px; line-height: 1.55; color: rgba(255, 255, 255, 0.82); position: relative; z-index: 3; }
/* blockGap du coeur : il posait 19,2px sur les tuiles 2 a 5 (decalees et rognees de 19px) */
.wp-site-blocks .cvh-matieres > *,
.wp-site-blocks .cvh-matiere > *,
.wp-site-blocks .cvh-entete > *,
.wp-site-blocks .cvh-exergue > *,
.wp-site-blocks .cvh-exigences > * { margin-block: 0; }
.wp-site-blocks .cvh-matiere > .cvh-matiere__texte { margin-block-start: 8px; }
/* exergue : filet degrade a gauche */
.cvh-exergue {
	max-width: 980px;
	padding-left: 30px;
	border-left: 2px solid transparent;
	border-image: linear-gradient(180deg, var(--cv2-bleu), var(--cv2-ciel)) 1;
}
.wp-site-blocks .cvh-int > .cvh-exergue { margin-block-start: 58px; }
.cvh-exergue__phrase { font-size: clamp(19px, 1.9vw, 24px); font-weight: 600; line-height: 1.45; color: var(--cv2-blanc); }
.cvh-exergue__suite { font-size: 15.5px; line-height: 1.78; color: rgba(255, 255, 255, 0.74); }
.wp-site-blocks .cvh-exergue > .cvh-exergue__suite { margin-block-start: 16px; }
/* exigences : trois mots en ligne, relies par un filet */
.cvh-exigences { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 26px; }
.wp-site-blocks .cvh-int > .cvh-exigences { margin-block-start: 44px; }
.cvh-exigence {
	position: relative;
	padding-right: 26px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
}
.cvh-exigence::after { content: ''; position: absolute; right: 0; top: 50%; width: 14px; height: 1px; background: rgba(86, 181, 235, 0.5); }
.cvh-exigence:nth-of-type(3) { padding-right: 0; }
.cvh-exigence:nth-of-type(3)::after { display: none; }
.cvh-exigences__note { flex: 1 1 280px; font-size: 14px; line-height: 1.6; color: rgba(255, 255, 255, 0.6); }
@media (max-width: 1024px) {
	.cvh-entete { grid-template-columns: 1fr; align-items: start; }
	.cvh-matieres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.cvh-matieres { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.cvh-matiere { min-height: 240px; padding: 22px 16px 18px; }
}

/* ------- Grilles dynamiques (realisations / publications) ------- */
.cvh-req { margin-top: 46px; }
.cvh-req .wp-block-post-template.is-layout-grid { gap: 22px; }
/* CARTE DE VERRE - composant de reference, reutilisable sur tout le site (2026-08-18) :
   image immersive + voile degrade + halo au curseur + panneau de verre en profondeur 3D. */
.cvh-realcarte {
	position: relative;
	min-height: 470px;
	overflow: hidden;
	border: 1px solid var(--cv2-trait);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	isolation: isolate;
	transform: perspective(1100px) rotateX(var(--cvh-rx, 0deg)) rotateY(var(--cvh-ry, 0deg));
	transform-style: preserve-3d;
	transition: transform 0.5s cubic-bezier(0.2, 0.6, 0.2, 1), border-color 0.4s ease, box-shadow 0.5s ease;
}
.cvh-realcarte:hover { border-color: rgba(86, 181, 235, 0.45); box-shadow: 0 34px 70px rgba(0, 0, 0, 0.5); }
.cvh-realcarte .wp-block-post-featured-image { position: absolute; inset: 0; margin: 0; z-index: 0; }
.cvh-realcarte .wp-block-post-featured-image a, .cvh-realcarte .wp-block-post-featured-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cvh-realcarte .wp-block-post-featured-image img { transition: transform 0.8s cubic-bezier(0.2, 0.6, 0.2, 1); }
.cvh-realcarte:hover .wp-block-post-featured-image img { transform: scale(1.06); }
/* voile : nuit en tete pour asseoir le badge, abysse dense en pied, halo bleu de marque */
.cvh-realcarte::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		radial-gradient(120% 78% at 50% 116%, rgba(12, 103, 222, 0.34), rgba(12, 103, 222, 0) 62%),
		linear-gradient(180deg, rgba(0, 0, 0, 0.44) 0%, rgba(0, 0, 0, 0.06) 34%, rgba(0, 0, 0, 0.88) 78%, rgba(0, 0, 0, 0.96) 100%);
	pointer-events: none;
}
/* halo qui suit le curseur (variables posees par accueil.js) */
.cvh-realcarte::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
	background: radial-gradient(240px circle at var(--cvh-mx, 50%) var(--cvh-my, 0%), rgba(86, 181, 235, 0.20), rgba(86, 181, 235, 0) 68%);
	opacity: 0;
	transition: opacity 0.4s ease;
	pointer-events: none;
}
.cvh-realcarte:hover::before { opacity: 1; }
/* panneau de verre en avant-plan */
.cvh-realcarte__contenu {
	position: relative;
	z-index: 3;
	margin: 14px;
	padding: 22px 20px 18px;
	background-color: rgba(7, 12, 61, 0.38); /* allege a la demande du client : l image se devine a travers le verre */
	/* voile interne : le verre se densifie vers le bas, la ou vivent extrait et lien (contraste MESURE) */
	background-image: linear-gradient(180deg, rgba(7, 12, 61, 0) 26%, rgba(7, 12, 61, 0.50) 100%);
	-webkit-backdrop-filter: blur(12px) saturate(1.25);
	backdrop-filter: blur(12px) saturate(1.25);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.42);
	transform: translateZ(30px);
	transition: transform 0.45s cubic-bezier(0.2, 0.6, 0.2, 1), background-color 0.4s ease;
}
/* (0,3,0) : le coeur impose margin-block-end:0 aux enfants de groupe et mangeait la marge basse du panneau */
.wp-site-blocks .cvh-realcarte > .cvh-realcarte__contenu { margin: 14px; }
.cvh-realcarte__contenu::before { content: ''; position: absolute; top: 0; left: 0; width: 90px; height: 2px; background: var(--cv2-degrade); }
.cvh-realcarte:hover .cvh-realcarte__contenu { transform: translateZ(30px) translateY(-8px); background-color: rgba(7, 12, 61, 0.62); }
@supports not (backdrop-filter: blur(1px)) {
	.cvh-realcarte__contenu { background: rgba(7, 12, 61, 0.92); }
}
/* badge en verre, en chevauchement sur le bord du panneau */
.cvh-badge, .cvh-badge a {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cv2-blanc); /* MESURE : le ciel sur la pastille bleue ne donnait que 3.37 */
	text-decoration: none;
}
.cvh-badge {
	position: absolute;
	top: -15px;
	left: 18px;
	margin: 0;
	padding: 6px 11px;
	border: 1px solid rgba(86, 181, 235, 0.45);
	background: rgba(47, 60, 209, 0.88); /* bleu adouci (demande client) : teinte plus profonde que le bleu vif, contraste MESURE */
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	transition: background-color 0.35s ease, border-color 0.35s ease;
}
.cvh-realcarte:hover .cvh-badge { background: rgba(12, 103, 222, 0.92); border-color: rgba(86, 181, 235, 0.85); }
.cvh-realcarte h3 { font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.3; margin: 0 0 10px; }
.cvh-realcarte h3 a { color: var(--cv2-blanc); text-decoration: none; transition: color 0.3s ease; }
.cvh-realcarte h3 a:hover { color: var(--cv2-ciel); }
/* L IMAGE PRIME (demande client) : au repos le panneau ne montre que pastille, titre et lien ;
   l accroche se deplie au survol ou au focus clavier. Au tactile elle reste lisible. */
.cvh-realcarte .wp-block-post-excerpt {
	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	margin: 0;
	font-size: 15px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.78);
	transition: grid-template-rows 0.45s cubic-bezier(0.2, 0.6, 0.2, 1), opacity 0.35s ease, margin-top 0.45s ease;
}
.cvh-realcarte .wp-block-post-excerpt > * { overflow: hidden; margin: 0; }
.cvh-realcarte:hover .wp-block-post-excerpt,
.cvh-realcarte:focus-within .wp-block-post-excerpt { grid-template-rows: 1fr; opacity: 1; margin-top: 10px; }
@media (hover: none) {
	.cvh-realcarte .wp-block-post-excerpt { grid-template-rows: 1fr; opacity: 1; margin-top: 10px; }
}
/* lien d action (bloc natif read-more), toujours visible - deux classes : le coeur stylise les liens */
.cvh-realcarte .wp-block-read-more {
	position: relative;
	display: inline-block;
	color: var(--cv2-ciel);
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
	/* cible tactile de 44px : padding compense par des marges negatives */
	margin: 10px 0 -13px;
	padding: 13px 24px 13px 0;
	transition: color 0.3s ease;
}
.cvh-realcarte .wp-block-read-more::after {
	content: '';
	position: absolute;
	right: 6px;
	top: 50%;
	width: 7px;
	height: 7px;
	border-right: 1.6px solid currentColor;
	border-bottom: 1.6px solid currentColor;
	transform: translateY(-60%) rotate(-45deg);
	transition: right 0.3s ease;
}
.cvh-realcarte .wp-block-read-more:hover { color: var(--cv2-blanc); }
.cvh-realcarte .wp-block-read-more:hover::after { right: 0; }
/* ------- CARTE EDITORIALE (articles) : image en bandeau, ligne de meta, titre qui se souligne ------- */
.cvh-artcarte {
	display: flex;
	flex-direction: column;
	height: 100%; /* les cellules de la grille sont egales : la carte doit les remplir */
	box-sizing: border-box;
	background: rgba(12, 103, 222, 0.05);
	border: 1px solid var(--cv2-trait);
	overflow: hidden;
	transition: transform 0.4s cubic-bezier(0.2, 0.6, 0.2, 1), border-color 0.4s ease, box-shadow 0.4s ease;
}
.cvh-artcarte:hover { transform: translateY(-6px); border-color: rgba(86, 181, 235, 0.45); box-shadow: 0 22px 50px rgba(0, 0, 0, 0.45); }
.cvh-artcarte__img { margin: 0; overflow: hidden; }
.cvh-artcarte__img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; transition: transform 0.8s cubic-bezier(0.2, 0.6, 0.2, 1); }
.cvh-artcarte:hover .cvh-artcarte__img img { transform: scale(1.06); }
.cvh-artcarte__corps { display: flex; flex-direction: column; flex: 1; padding: 22px 22px 24px; }
.wp-site-blocks .cvh-artcarte > *,
.wp-site-blocks .cvh-artcarte__corps > *,
.wp-site-blocks .cvh-artcarte__meta > * { margin-block: 0; }
.cvh-artcarte__meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cvh-artcarte__cat, .cvh-artcarte__cat a { font-size: 11.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cv2-ciel); text-decoration: none; }
.cvh-artcarte__cat a:hover { color: var(--cv2-blanc); }
.cvh-artcarte__date { position: relative; padding-left: 15px; font-size: 12px; color: rgba(255, 255, 255, 0.58); }
.cvh-artcarte__date::before { content: ''; position: absolute; left: 0; top: 50%; width: 7px; height: 1px; background: rgba(255, 255, 255, 0.4); }
.cvh-artcarte h3 { font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.3; }
.wp-site-blocks .cvh-artcarte__corps > h3 { margin-block-start: 13px; }
/* signature de la carte article : le titre se souligne progressivement (geste de lecture) */
.cvh-artcarte h3 a {
	color: var(--cv2-blanc);
	text-decoration: none;
	background-image: var(--cv2-degrade);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 2px;
	padding-bottom: 3px;
	transition: background-size 0.5s cubic-bezier(0.2, 0.6, 0.2, 1);
}
.cvh-artcarte:hover h3 a, .cvh-artcarte h3 a:focus-visible { background-size: 100% 2px; }
.cvh-artcarte .wp-block-post-excerpt { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.72); }
.wp-site-blocks .cvh-artcarte__corps > .wp-block-post-excerpt { margin-block-start: 11px; }
.cvh-artcarte .wp-block-read-more {
	position: relative;
	align-self: flex-start;
	padding: 13px 24px 13px 0;
	color: var(--cv2-ciel);
	font-size: 13.5px;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.3s ease;
}
/* (0,3,0) : la parade blockGap ci-dessus annulerait le margin-top:auto qui colle le lien en pied */
.wp-site-blocks .cvh-artcarte__corps > .wp-block-read-more { margin-block: auto 0; margin-block-end: -13px; }
.cvh-artcarte .wp-block-read-more::after {
	content: '';
	position: absolute;
	right: 6px;
	top: 50%;
	width: 7px;
	height: 7px;
	border-right: 1.6px solid currentColor;
	border-bottom: 1.6px solid currentColor;
	transform: translateY(-60%) rotate(-45deg);
	transition: right 0.3s ease;
}
.cvh-artcarte .wp-block-read-more:hover { color: var(--cv2-blanc); }
.cvh-artcarte .wp-block-read-more:hover::after { right: 0; }
.cvh-centre { justify-content: center; margin-top: 44px; }

/* ------- SCENE AERIENNE (drones) : essaim lumineux, trajectoire, verre et pastilles en escalier ------- */
.cvh-drones { position: relative; overflow: hidden; }
.cvh-drones .wp-block-cover__inner-container {
	max-width: 1420px;
	margin-inline: auto;
	box-sizing: border-box;
	padding: clamp(84px, 9vw, 130px) clamp(20px, 3.2vw, 32px);
	position: relative;
	z-index: 3;
}
/* voile directionnel : dense a gauche pour porter le texte, la photo respire a droite */
.cvh-drones::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(100deg, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.46) 44%, rgba(0, 0, 0, 0.16) 68%, rgba(0, 0, 0, 0.52) 100%);
	pointer-events: none;
}
/* essaim de drones : points lumineux qui respirent */
.cvh-drones::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
	background-image:
		radial-gradient(2.5px 2.5px at 9% 26%, rgba(86, 181, 235, 0.95), transparent 62%),
		radial-gradient(2px 2px at 17% 61%, rgba(255, 255, 255, 0.8), transparent 62%),
		radial-gradient(1.5px 1.5px at 26% 18%, rgba(86, 181, 235, 0.75), transparent 62%),
		radial-gradient(2px 2px at 34% 78%, rgba(255, 255, 255, 0.6), transparent 62%),
		radial-gradient(2.5px 2.5px at 46% 12%, rgba(86, 181, 235, 0.85), transparent 62%),
		radial-gradient(1.5px 1.5px at 53% 52%, rgba(255, 255, 255, 0.55), transparent 62%),
		radial-gradient(2px 2px at 62% 84%, rgba(86, 181, 235, 0.8), transparent 62%),
		radial-gradient(2.5px 2.5px at 71% 30%, rgba(255, 255, 255, 0.7), transparent 62%),
		radial-gradient(1.5px 1.5px at 78% 66%, rgba(86, 181, 235, 0.7), transparent 62%),
		radial-gradient(2px 2px at 86% 20%, rgba(255, 255, 255, 0.65), transparent 62%),
		radial-gradient(2.5px 2.5px at 92% 74%, rgba(86, 181, 235, 0.9), transparent 62%),
		radial-gradient(1.5px 1.5px at 41% 40%, rgba(255, 255, 255, 0.5), transparent 62%);
	animation: cvh-essaim 7s ease-in-out infinite alternate;
	pointer-events: none;
}
@keyframes cvh-essaim { from { opacity: 0.42; } to { opacity: 1; } }
.cvh-drones__grille {
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
	gap: clamp(40px, 5vw, 84px);
	align-items: center;
}
.wp-site-blocks .cvh-drones__grille > *,
.wp-site-blocks .cvh-drones__col > *,
.wp-site-blocks .cvh-drones__verre > *,
.wp-site-blocks .cvh-drones__marqueurs > *,
.wp-site-blocks .cvh-marqueur > * { margin-block: 0; }
/* sur-titre : filet degrade puis capitales espacees */
.cvh-surtitre {
	display: flex;
	align-items: center;
	gap: 14px;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	margin: 0 0 18px;
}
.cvh-surtitre::before { content: ''; width: 34px; height: 2px; background: var(--cv2-degrade); flex: 0 0 auto; }
/* le titre chevauche le panneau de verre et deborde a sa gauche */
.cvh-drones__titre {
	position: relative;
	z-index: 2;
	font-size: var(--cv2-t2);
	font-weight: 700;
	line-height: 1.14;
	color: var(--cv2-blanc);
	text-align: left;
	margin: 0 0 -30px;
	padding-right: 6%;
	text-shadow: 0 2px 24px rgba(0, 2, 30, 0.55);
}
/* marges voulues REDECLAREES en (0,3,0) apres la parade blockGap, sinon elles sont annulees */
.wp-site-blocks .cvh-drones__col > .cvh-surtitre { margin-block-end: 18px; }
.wp-site-blocks .cvh-drones__col > .cvh-drones__titre { margin-block-end: -30px; }
.wp-site-blocks .cvh-drones__col > .cvh-drones__verre { margin: 0 0 0 48px; }
.cvh-drones__verre {
	position: relative;
	padding: 56px 34px 32px;
	background: rgba(7, 12, 61, 0.34);
	-webkit-backdrop-filter: blur(12px) saturate(1.25);
	backdrop-filter: blur(12px) saturate(1.25);
	border: 1px solid rgba(255, 255, 255, 0.13);
	box-shadow: 0 26px 60px rgba(0, 0, 0, 0.45);
}
.cvh-drones__verre::before { content: ''; position: absolute; top: 0; left: 0; width: 110px; height: 2px; background: var(--cv2-degrade); }
@supports not (backdrop-filter: blur(1px)) {
	.cvh-drones__verre { background: rgba(7, 12, 61, 0.88); }
}
.cvh-drones__verre p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.86); }
.wp-site-blocks .cvh-drones__verre > p + p { margin-block-start: 18px; }
/* colonne des pastilles : trajectoire lumineuse + escalier */
.cvh-drones__marqueurs { position: relative; display: flex; flex-direction: column; gap: 18px; }
.cvh-drones__marqueurs::before {
	content: '';
	position: absolute;
	left: -34px;
	top: 4%;
	bottom: 4%;
	width: 1px;
	background: linear-gradient(180deg, transparent, rgba(86, 181, 235, 0.5) 20%, rgba(12, 103, 222, 0.5) 80%, transparent);
}
.cvh-drones__marqueurs::after {
	content: '';
	position: absolute;
	left: -36px;
	width: 5px;
	height: 5px;
	background: var(--cv2-ciel);
	box-shadow: 0 0 12px 3px rgba(86, 181, 235, 0.75);
	animation: cvh-vol 7s ease-in-out infinite alternate;
}
@keyframes cvh-vol { from { top: 6%; } to { top: 88%; } }
.cvh-marqueur {
	position: relative;
	padding: 17px 22px 17px 62px;
	background: rgba(7, 12, 61, 0.30);
	-webkit-backdrop-filter: blur(10px) saturate(1.2);
	backdrop-filter: blur(10px) saturate(1.2);
	border: 1px solid rgba(255, 255, 255, 0.12);
	transition: transform 0.4s cubic-bezier(0.2, 0.6, 0.2, 1), background-color 0.4s ease, border-color 0.4s ease;
}
.cvh-marqueur:nth-child(2) { margin-left: 32px; }
.cvh-marqueur:nth-child(3) { margin-left: 64px; }
.cvh-marqueur:hover { transform: translateX(-8px); background: rgba(12, 103, 222, 0.22); border-color: rgba(86, 181, 235, 0.45); }
.cvh-marqueur::before {
	content: '';
	position: absolute;
	left: 22px;
	top: 19px;
	width: 24px;
	height: 24px;
	background: var(--cv2-ciel);
	-webkit-mask: var(--cvh-picto) center / 24px 24px no-repeat;
	mask: var(--cvh-picto) center / 24px 24px no-repeat;
	transition: background-color 0.4s ease;
}
.cvh-marqueur:hover::before { background: var(--cv2-blanc); }
/* pictos dessines sur mesure : un trace distinct par pastille (variables au contact de la regle) */
.cvh-marqueur--silence { --cvh-picto: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9.5v5h3.2L12 18.5v-13L7.2 9.5H4z'/%3E%3Cpath d='M16.2 9.4l5 5.2M21.2 9.4l-5 5.2'/%3E%3C/svg%3E"); }
.cvh-marqueur--precision { --cvh-picto: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='7.2'/%3E%3Ccircle cx='12' cy='12' r='2.6'/%3E%3Cpath d='M12 1.6v3.2M12 19.2v3.2M1.6 12h3.2M19.2 12h3.2'/%3E%3C/svg%3E"); }
.cvh-marqueur--patrimoine { --cvh-picto: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.2 9.6L12 4.2l8.8 5.4'/%3E%3Cpath d='M6 10.4v7.8M10 10.4v7.8M14 10.4v7.8M18 10.4v7.8'/%3E%3Cpath d='M3.6 18.8h16.8'/%3E%3C/svg%3E"); }
.cvh-marqueur__titre { font-size: 15.5px; font-weight: 600; color: var(--cv2-blanc); line-height: 1.3; }
.cvh-marqueur__texte { font-size: 13.5px; line-height: 1.55; color: rgba(255, 255, 255, 0.74); }
.wp-site-blocks .cvh-marqueur > .cvh-marqueur__texte { margin-block-start: 5px; }
@media (max-width: 1024px) {
	.cvh-drones__grille { grid-template-columns: 1fr; gap: 44px; }
	.cvh-drones__marqueurs::before, .cvh-drones__marqueurs::after { display: none; }
	.cvh-marqueur:nth-child(2), .cvh-marqueur:nth-child(3) { margin-left: 0; }
	.wp-site-blocks .cvh-drones__col > .cvh-drones__verre { margin-left: 0; }
	.wp-site-blocks .cvh-drones__col > .cvh-drones__titre { margin-block-end: -24px; } /* (0,3,0) : sinon la redeclaration desktop l emporte */
	.cvh-drones__titre { padding-right: 0; }
}
@media (max-width: 781px) {
	.cvh-drones__verre { padding: 46px 22px 26px; }
	.cvh-marqueur { padding: 15px 18px 15px 56px; }
}

/* ------- PROTOCOLE : la methode en trois temps, jalonnee par une ligne de progression ------- */
.cvh-entete__aparte { display: flex; flex-direction: column; align-items: flex-start; gap: 22px; }
.wp-site-blocks .cvh-entete__aparte > * { margin-block: 0; }
.cvh-protocole {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(28px, 3.4vw, 52px);
	padding-top: 46px;
}
.wp-site-blocks .cvh-int > .cvh-protocole { margin-block-start: 64px; }
.wp-site-blocks .cvh-protocole > *,
.wp-site-blocks .cvh-etape > * { margin-block: 0; }
/* la ligne relie les trois temps */
.cvh-protocole::before {
	content: '';
	position: absolute;
	top: 6px;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, var(--cv2-bleu), var(--cv2-ciel) 55%, rgba(86, 181, 235, 0.15));
}
.cvh-etape { position: relative; }
/* noeud pose sur la ligne, il s allume au survol */
.cvh-etape::before {
	content: '';
	position: absolute;
	top: -46px;
	left: 0;
	width: 13px;
	height: 13px;
	box-sizing: border-box;
	background: var(--cv2-abysse);
	border: 2px solid var(--cv2-ciel);
	transition: background-color 0.35s ease, box-shadow 0.35s ease;
}
.cvh-etape:hover::before { background: var(--cv2-ciel); box-shadow: 0 0 0 6px rgba(86, 181, 235, 0.16); }
.cvh-etape__num { font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--cv2-ciel); }
.cvh-etape__titre {
	position: relative;
	font-size: var(--cv2-t-vignette);
	font-weight: 700;
	line-height: 1.3;
	color: var(--cv2-blanc);
	padding-bottom: 14px;
}
.cvh-etape__titre::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 28px;
	height: 2px;
	background: var(--cv2-degrade);
	transition: width 0.45s cubic-bezier(0.2, 0.6, 0.2, 1);
}
.cvh-etape:hover .cvh-etape__titre::after { width: 100%; }
.cvh-etape__texte { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.76); }
.wp-site-blocks .cvh-etape > .cvh-etape__titre { margin-block: 12px 0; }
.wp-site-blocks .cvh-etape > .cvh-etape__texte { margin-block-start: 14px; }
@media (max-width: 900px) {
	/* la progression bascule a la verticale */
	.cvh-protocole { grid-template-columns: 1fr; gap: 34px; padding-top: 0; padding-left: 32px; }
	.cvh-protocole::before { top: 6px; bottom: 6px; left: 6px; right: auto; width: 1px; height: auto; background: linear-gradient(180deg, var(--cv2-bleu), var(--cv2-ciel) 55%, rgba(86, 181, 235, 0.15)); }
	.cvh-etape::before { top: 3px; left: -32px; }
}

/* ------- Cartes publics (6) ------- */
/* ------- PUBLICS : le DAMIER de la production (4 colonnes jointives, une case sur deux) ------- */
.cvh-publics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
.wp-site-blocks .cvh-int > .cvh-publics { margin-block-start: 46px; }
.wp-site-blocks .cvh-publics > * { margin-block: 0; }
/* damier texte / photo comme en production : les 12 elements se placent d eux-memes */
.cvh-public-img { position: relative; margin: 0; overflow: hidden; }
.cvh-public-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.7s cubic-bezier(0.2, 0.6, 0.2, 1); }
.cvh-public-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.42)); transition: opacity 0.5s ease; pointer-events: none; }
.cvh-public-img:hover img { transform: scale(1.06); }
.cvh-public-img:hover::after { opacity: 0.6; }
.cvh-publics .cvh-carte {
	background: #000000;
	border: 0.8px solid rgba(86, 181, 235, 0.33);
	padding: 20px;
	justify-content: space-evenly;
	transition: border-color 0.35s ease, background-color 0.35s ease, transform 0.35s ease;
}
.cvh-publics .cvh-carte:hover { border-color: rgba(86, 181, 235, 0.62); background: #05070f; transform: translateY(-4px); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.5); }
.cvh-publics .cvh-carte h3 { margin: 0 0 12px; font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.3; }
.cvh-publics .cvh-carte p { margin: 0 0 16px; font-size: 15px; line-height: 1.7; color: #CCCCCC; }
.cvh-publics .cvh-carte .cvh-lien { padding: 0; }
.cvh-publics .cvh-lien a { color: var(--cv2-blanc); border-bottom-color: rgba(255, 255, 255, 0.45); }
.cvh-publics .cvh-lien a:hover { color: var(--cv2-ciel); border-bottom-color: var(--cv2-ciel); }
/* le damier prod laisse une demi largeur vide en tablette : ici les cartes se resserrent */
@media (max-width: 1200px) {
	.cvh-publics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cvh-public-img { min-height: 220px; }
}
@media (max-width: 640px) {
	/* en colonne unique, les photos du damier alourdiraient la lecture : seules les cartes restent */
	.cvh-publics { grid-template-columns: 1fr; }
	.cvh-public-img { display: none; }
}

/* ------- Medaillons demarche ------- */
.cvh-medaillons { gap: 40px; margin: 46px 0 10px; }
.cvh-medaillons .wp-block-column { display: flex; flex-direction: column; align-items: center; text-align: center; }
.cvh-medaillon { margin: 0 0 18px; width: 112px; height: 112px; border: 1px solid rgba(86, 181, 235, 0.45); background: rgba(86, 181, 235, 0.06); border-radius: 50%; display: grid; place-items: center; }
.cvh-medaillon img { width: 52px; height: 52px; }
.cvh-medaillons p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.78); max-width: 330px; }

/* ------- FAQ ------- */
.cvh-faq { gap: 64px; }
.cvh-faq .cvh-titre--gauche { margin-bottom: 20px; }
.cvh-faq p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.72); }

/* Rendre leur largeur aux conteneurs internes : TT25 contraint les enfants de groupe a contentSize 645px ((0,3,0) > (0,2,0)) */
.wp-site-blocks .cvh-sec > .cvh-int,
.wp-site-blocks .cvh-int > * { max-width: none; }
.wp-site-blocks .cvh-sec > .cvh-int { max-width: 1420px; margin-inline: auto; }
.wp-site-blocks .cvh-int > .cvh-prose { max-width: 880px; margin-inline: auto; }

/* ------- Responsive ------- */
/* Le nombre de fiches varie avec la taxonomie (une discipline peut n en avoir
   qu une ou deux) : la grille s adapte pour ne JAMAIS laisser de rangee
   incomplete, motif C15bis. Ecrit en :has() donc generique, jamais pour le
   nombre du jour. */
/* C15ter : bornee des DEUX cotes. Sa specificite (0,5,0) bat la regle
   mobile (0,3,0) : sans le min-width, deux fiches restaient sur deux colonnes
   a 390 px - mesure : des cartes de 164 px de large. */
@media (min-width: 641px) {
	@supports selector(:has(*)) {
		.cvh-req .wp-block-post-template.is-layout-grid:has(> :last-child:nth-child(1)) { grid-template-columns: minmax(0, 1fr) !important; }
		.cvh-req .wp-block-post-template.is-layout-grid:has(> :last-child:nth-child(2)) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	}
}
@media (min-width: 641px) and (max-width: 1024px) {
	.cvh-req .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	/* C13 : a deux colonnes, un nombre IMPAIR de fiches laisse une rangee incomplete.
	   Mesure a 768 : 363px de vide avec 3 fiches. La derniere s etale alors sur la largeur. */
	.cvh-req .wp-block-post-template.is-layout-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
	.cvh-req .wp-block-post-template.is-layout-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 781px) {
	.cvh-colonnes, .cvh-etapes, .cvh-medaillons, .cvh-faq { gap: 28px; }
	.cvh-logos__piste figure { margin-right: 56px; }
	.cvh-logos__piste img { height: 64px; }
	/* mobile : carte plus haute, titre resserre et accroche a 2 lignes pour que l image garde la vedette */
	.cvh-realcarte { min-height: 480px; transform: none; }
	.cvh-realcarte .wp-block-post-excerpt > * { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
	.wp-site-blocks .cvh-realcarte > .cvh-realcarte__contenu { margin: 10px; } /* (0,3,0) : sinon la regle desktop de meme portee l emporte */
	.cvh-realcarte__contenu { padding: 24px 18px 18px; transform: none; }
	.cvh-realcarte:hover .cvh-realcarte__contenu { transform: translateY(-4px); }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-logos__piste { animation: none; }
	.cvh-carte, .cvh-realcarte .wp-block-post-featured-image img { transition: none !important; }
	.cvh-realcarte, .cvh-realcarte__contenu { transition: none !important; transform: none !important; }
	.cvh-realcarte::before { display: none; }
	.cvh-drones::after, .cvh-drones__marqueurs::after { animation: none !important; }
	.cvh-marqueur { transition: none !important; }
	.cvh-matiere, .cvh-matiere::after { transition: none !important; transform: none !important; }
	.cvh-matiere__img img, .cvh-matiere::before { transition: none !important; transform: none !important; }
	.cvh-etape::before, .cvh-etape__titre::after { transition: none !important; }
	.cvh-artcarte, .cvh-artcarte__img img, .cvh-artcarte h3 a { transition: none !important; transform: none !important; }
}

/* ================= PAGES INTERIEURES REFONDUES (gabarit page-refonte) ================= */
/* fond sombre et heros colle au menu partout ou la bibliotheque cvh est employee */
body:has(.cvh-sec), body:has(.cvh-hero) { background: var(--cv2-nuit); }
body:has(.cvh-sec) main, body:has(.cvh-hero) main { margin-block-start: 0; }
body:has(.cvh-sec) .wp-block-post-content { margin-block-start: 0; }
.wp-site-blocks .wp-block-post-content > .cvh-bandeau { margin-block: 0; }

/* ------- Heros de page interieure ------- */
.cvh-hero--page .wp-block-cover__inner-container { padding: clamp(118px, 17vh, 168px) clamp(20px, 5vw, 80px) clamp(56px, 9vh, 92px); }
.cvh-hero__titre { font-size: var(--cv2-t1); font-weight: 800; line-height: 1.08; color: var(--cv2-blanc); max-width: none; }
.cvh-hero--page p { font-size: clamp(15.5px, 1.35vw, 18px); line-height: 1.7; color: rgba(255, 255, 255, 0.86); max-width: 730px; }
.wp-site-blocks .cvh-hero--page .wp-block-cover__inner-container > * { margin-block: 0; }
.wp-site-blocks .cvh-hero--page .wp-block-cover__inner-container > p { margin-block: 20px 30px; }
.wp-site-blocks .cvh-hero--page .wp-block-cover__inner-container > .cvh-gages { margin-block-start: 34px; }
.cvh-hero__actions { gap: 14px; }

/* ------- Gages : liste horizontale a losange degrade ------- */
.cvh-gages { list-style: none; display: flex; flex-wrap: wrap; gap: 12px 26px; padding: 0; margin: 0; }
.cvh-gages li { position: relative; padding-left: 20px; font-size: 13.5px; font-weight: 600; letter-spacing: 0.03em; color: rgba(255, 255, 255, 0.88); }
.cvh-gages li::before { content: ''; position: absolute; left: 0; top: 50%; width: 8px; height: 8px; transform: translateY(-50%) rotate(45deg); background: var(--cv2-degrade); }

/* ------- Les cinq langages ------- */
.cvh-langages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.wp-site-blocks .cvh-int > .cvh-langages { margin-block-start: 52px; }
.wp-site-blocks .cvh-langages > *, .wp-site-blocks .cvh-langage > * { margin-block: 0; }
.cvh-langage {
	display: flex;
	flex-direction: column;
	padding: 30px 28px 28px;
	background: rgba(12, 103, 222, 0.06);
	border: 1px solid var(--cv2-trait);
	transition: border-color 0.35s ease, background-color 0.35s ease, transform 0.35s cubic-bezier(0.2, 0.6, 0.2, 1);
}
.cvh-langage:hover { border-color: rgba(86, 181, 235, 0.45); background: rgba(12, 103, 222, 0.11); transform: translateY(-4px); }
.cvh-langage:nth-child(5) { grid-column: 1 / -1; }
/* (0,2,0) : la regle generique .cvh-langage p (0,1,1) ecrasait taille et couleur */
.cvh-langage p.cvh-langage__sur { font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cv2-ciel); }
.cvh-langage__titre { font-size: var(--cv2-t3); font-weight: 700; line-height: 1.25; color: var(--cv2-blanc); }
.wp-site-blocks .cvh-langage > .cvh-langage__titre { margin-block: 10px 14px; }
.cvh-langage p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.78); }
.wp-site-blocks .cvh-langage > p + p { margin-block-start: 14px; }
.cvh-langage p.cvh-langage__note { font-size: 12.5px; line-height: 1.6; color: rgba(255, 255, 255, 0.62); padding-top: 14px; margin-top: auto; border-top: 1px solid rgba(86, 181, 235, 0.16); }
.wp-site-blocks .cvh-langage > .cvh-langage__note { margin-block-start: auto; }

/* ------- Protocole en grille (six etapes, sans la ligne continue) ------- */
.cvh-protocole--grille { grid-template-columns: repeat(3, minmax(0, 1fr)); padding-top: 0; row-gap: 46px; }
.cvh-protocole--grille::before { display: none; }
.cvh-protocole--grille .cvh-etape::before { display: none; }

/* ------- Bandeau image avec panneau de verre ------- */
.cvh-bandeau .wp-block-cover__inner-container { max-width: 1420px; margin-inline: auto; box-sizing: border-box; padding: clamp(76px, 9vw, 118px) clamp(20px, 3.2vw, 32px); }
.cvh-bandeau__panneau {
	position: relative;
	max-width: 730px;
	padding: 40px 38px 38px;
	background: rgba(7, 12, 61, 0.52);
	-webkit-backdrop-filter: blur(14px) saturate(1.25);
	backdrop-filter: blur(14px) saturate(1.25);
	border: 1px solid rgba(255, 255, 255, 0.13);
	box-shadow: 0 26px 60px rgba(0, 0, 0, 0.45);
}
.cvh-bandeau__panneau::before { content: ''; position: absolute; top: 0; left: 0; width: 110px; height: 2px; background: var(--cv2-degrade); }
@supports not (backdrop-filter: blur(1px)) { .cvh-bandeau__panneau { background: rgba(7, 12, 61, 0.93); } }
.cvh-bandeau__panneau--centre { margin-inline: auto; text-align: center; }
.cvh-bandeau__panneau--centre .cvh-gages, .cvh-bandeau__panneau--centre .wp-block-buttons { justify-content: center; }
.cvh-bandeau__panneau--centre::before { left: 50%; transform: translateX(-50%); }
.cvh-bandeau__titre { font-size: var(--cv2-t2); font-weight: 700; line-height: 1.14; color: var(--cv2-blanc); }
.cvh-bandeau p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.85); }
.wp-site-blocks .cvh-bandeau__panneau > * { margin-block: 0; }
.wp-site-blocks .cvh-bandeau__panneau > p { margin-block-start: 16px; }
.wp-site-blocks .cvh-bandeau__panneau > .cvh-liste,
.wp-site-blocks .cvh-bandeau__panneau > .wp-block-buttons,
.wp-site-blocks .cvh-bandeau__panneau > .cvh-gages { margin-block-start: 26px; }

/* ------- Preuves (badges de conformite) ------- */
.cvh-preuves { display: flex; flex-wrap: wrap; gap: 12px; }
.wp-site-blocks .cvh-int > .cvh-preuves { margin-block-start: 44px; }
.wp-site-blocks .cvh-preuves > * { margin-block: 0; }
.cvh-preuve {
	padding: 11px 17px;
	border: 1px solid rgba(86, 181, 235, 0.33);
	background: rgba(12, 103, 222, 0.10);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	transition: border-color 0.3s ease, background-color 0.3s ease;
}
.cvh-preuve:hover { border-color: rgba(86, 181, 235, 0.6); background: rgba(12, 103, 222, 0.18); }

@media (max-width: 1024px) {
	.cvh-protocole--grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 781px) {
	.cvh-langages { grid-template-columns: 1fr; }
	.cvh-langage { padding: 24px 20px 22px; }
	.cvh-protocole--grille { grid-template-columns: 1fr; padding-left: 0; }
	.cvh-bandeau__panneau { padding: 30px 22px 26px; }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-langage, .cvh-preuve { transition: none !important; transform: none !important; }
}

/* ================= KIT COLLECTIVITES - PARITE PRODUCTION (2026-08-20) ================= */
/* Portage du kit .cel-coll-* de la production sur la bibliotheque .cvh. Scope : .cvh-coll,
   pose sur chaque section racine de la page. Aucune regle ne fuit vers l accueil ni vers
   les pages soeurs. Reutilisable pour les 3 autres pages Collectivites (130, 132, 134). */

/* --- Rythme des sections : 96px haut/bas (prod), et on annule la couture de l accueil --- */
.cvh-coll > .cvh-int { padding: clamp(56px, 7vw, 96px) clamp(18px, 2vw, 24px); }
.cvh-sec.cvh-coll + .cvh-sec.cvh-coll > .cvh-int { padding-top: clamp(56px, 7vw, 96px); }

/* ============================================================================
   KIT .cvc-* - PAGE MERE COLLECTIVITES (126), 2026-08-20
   Tete de silo : annonce les 4 pages filles et convertit le decideur.
   Toutes les tailles de titre viennent de la charte (--cv2-t1..t6, t-vignette).
   Neutralisation blockGap sur CHAQUE conteneur multi-enfants, grilles comprises.
   ============================================================================ */
.cvc { position: relative; overflow: hidden; }
.cvc::before {
	content: ""; position: absolute; inset: -20% -10%; z-index: 0; pointer-events: none;
	background:
		radial-gradient(46% 38% at 18% 12%, rgba(12, 103, 222, 0.30), transparent 68%),
		radial-gradient(40% 34% at 84% 6%, rgba(86, 181, 235, 0.16), transparent 70%);
	animation: cvbMesh 26s ease-in-out infinite alternate;
}
.cvc > .cvh-int { position: relative; z-index: 1; }

/* ---------- neutralisation blockGap ---------- */
.wp-site-blocks .cvc > *,
.wp-site-blocks .cvc-tete > *, .wp-site-blocks .cvc-annee > *, .wp-site-blocks .cvc-temps > *,
.wp-site-blocks .cvc-temps__corps > *, .wp-site-blocks .cvc-metiers > *, .wp-site-blocks .cvc-metier > *,
.wp-site-blocks .cvc-etapes > *, .wp-site-blocks .cvc-etape > *, .wp-site-blocks .cvc-budget > *,
.wp-site-blocks .cvc-paliers > *, .wp-site-blocks .cvc-palier > *, .wp-site-blocks .cvc-charge > *,
.wp-site-blocks .cvc-conf > *, .wp-site-blocks .cvc-conf__grille > *, .wp-site-blocks .cvc-repli > *,
.wp-site-blocks .cvc-repli__txt > *, .wp-site-blocks .cvc-reals > *, .wp-site-blocks .cvc-real > *,
.wp-site-blocks .cvc-real__corps > *, .wp-site-blocks .cvc-conformite > * { margin-block: 0; }
.wp-site-blocks .cvc .cvc-charge__liste li, .wp-site-blocks .cvc .cvc-conformite li { margin-block: 0; }

/* ---------- surtitre, titre, chapo ---------- */
.cvc p.cvc-sur {
	display: inline-flex; align-items: center; gap: 12px; align-self: flex-start;
	padding: 9px 16px 9px 13px;
	font-size: var(--cv2-t6); font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #DCDDEF;
	background: linear-gradient(135deg, rgba(86, 181, 235, 0.16), rgba(12, 103, 222, 0.08));
	border: 1px solid rgba(86, 181, 235, 0.34);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.cvc p.cvc-sur::before {
	content: ""; display: block; flex: 0 0 auto; width: 7px; height: 7px;
	background: var(--cv2-degrade); box-shadow: 0 0 12px rgba(86, 181, 235, 0.9);
	animation: cvbPuls 2.8s ease-in-out infinite;
}
.wp-site-blocks .cvc .cvh-int > p.cvc-sur, .wp-site-blocks .cvc .cvc-tete > p.cvc-sur { margin-block: 0 24px; }
.cvc .cvc-titre { font-size: var(--cv2-t2); font-weight: 700; line-height: 1.14; text-align: left; }
.cvc .cvc-titre mark { background: var(--cv2-degrade-titre); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: #56B5EB; }
.cvc .cvc-titre::after {
	content: ""; display: block; width: 88px; height: 3px; margin: 20px 0 0; background: var(--cv2-degrade);
}
.wp-site-blocks .cvc .cvh-int > .cvc-titre, .wp-site-blocks .cvc .cvc-tete > .cvc-titre { margin-block: 0 18px; }
.cvc p.cvc-chapo { font-size: var(--cv2-t5); line-height: 1.66; color: #CED0EB; max-width: 88ch; }
.wp-site-blocks .cvc .cvh-int > p.cvc-chapo, .wp-site-blocks .cvc .cvc-tete > p.cvc-chapo { margin-block: 0 0; }

/* ---------- bandeau des villes clientes ---------- */
.cvc-conf { padding: 46px 0 44px; background: var(--cv2-marine, #0D124F); border-block: 1px solid rgba(86, 181, 235, 0.16); }
.cvc-conf__intro { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.wp-site-blocks .cvc-conf > .cvc-conf__intro { margin-block: 0 30px; }
.cvc p.cvc-conf__lib { font-size: var(--cv2-t6); font-weight: 700; letter-spacing: 0.19em; text-transform: uppercase; color: #DCDDEF; }
.cvc p.cvc-conf__note { font-size: 13.5px; color: #9FA2CC; }
.cvc-conf__grille { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; background: rgba(86, 181, 235, 0.14); }
.cvc-conf__grille figure {
	margin: 0; display: flex; align-items: center; justify-content: center;
	padding: 22px 14px; background: var(--cv2-abysse, #00021E);
}
.cvc-conf__grille img {
	display: block; height: 58px; width: auto; max-width: 100%; opacity: 0.82;
	filter: brightness(0) invert(1); transition: opacity 0.4s ease, transform 0.4s ease;
}
.cvc-conf__grille figure:hover img { opacity: 1; transform: scale(1.06); }

/* ---------- l annee en quatre temps ---------- */
.cvc-annee { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; position: relative; }
.cvc-annee::before {
	content: ""; position: absolute; left: 0; right: 0; top: 126px; height: 1px; z-index: 0;
	background: linear-gradient(90deg, rgba(86, 181, 235, 0), rgba(86, 181, 235, .5) 10%, rgba(86, 181, 235, .5) 90%, rgba(86, 181, 235, 0));
}
.wp-site-blocks .cvc .cvh-int > .cvc-annee { margin-block: 56px 0; }
.cvc-temps {
	position: relative; z-index: 1; display: flex; flex-direction: column;
	border: 1px solid rgba(86, 181, 235, 0.22);
	background: linear-gradient(168deg, rgba(86, 181, 235, 0.09), rgba(0, 2, 30, 0.5));
	-webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
	transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.45s ease, box-shadow 0.45s ease;
}
.cvc-temps:hover { transform: translateY(-8px); border-color: rgba(86, 181, 235, 0.62); box-shadow: 0 34px 64px rgba(0, 2, 30, 0.66); }
.cvc p.cvc-temps__quand {
	position: absolute; top: -14px; left: 22px; z-index: 2; padding: 6px 13px; background: var(--cv2-nuit);
	border: 1px solid rgba(86, 181, 235, 0.45); font-size: var(--cv2-t6); font-weight: 800;
	letter-spacing: 0.16em; text-transform: uppercase; color: #DCDDEF;
}
.cvc .cvc-temps__img { position: relative; height: 200px; overflow: hidden; margin: 0; }
.cvc .cvc-temps__img img {
	display: block; width: 100%; height: 100%; object-fit: cover;
	transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cvc-temps:hover .cvc-temps__img img { transform: scale(1.07); }
.cvc .cvc-temps__img::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, .14) 46%, rgba(0, 0, 0, 0.62));
}
.cvc-temps__corps { display: flex; flex-direction: column; flex: 1 1 auto; padding: 22px 24px 24px; }
.cvc .cvc-temps__titre { font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.3; color: #FFFFFF; text-align: left; }
.cvc .cvc-temps__titre::after { content: none; }
.wp-site-blocks .cvc .cvc-temps__corps > .cvc-temps__titre { margin-block: 0 12px; }
.cvc p.cvc-temps__txt { font-size: 15px; line-height: 1.7; color: #C7C9E6; }
.cvc p.cvc-temps__lien {
	display: flex; align-items: center; gap: 10px; padding-top: 20px;
	font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #56B5EB;
}
.wp-site-blocks .cvc .cvc-temps__corps > p.cvc-temps__lien { margin-block: auto 0; }
.cvc p.cvc-temps__lien a { text-decoration: none; color: inherit; }
/* le lien couvre toute la carte, sans sortir le titre du flux editable */
.cvc p.cvc-temps__lien a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.cvc p.cvc-temps__lien::after {
	content: ""; flex: 1 1 auto; height: 1px;
	background: linear-gradient(90deg, rgba(86, 181, 235, .5), transparent);
}

/* ---------- trois metiers ---------- */
.cvc-metiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.wp-site-blocks .cvc .cvh-int > .cvc-metiers { margin-block: 48px 0; }
.cvc-metier {
	position: relative; padding: 28px; border: 1px solid rgba(86, 181, 235, 0.2);
	background: linear-gradient(165deg, rgba(86, 181, 235, 0.07), rgba(0, 2, 30, 0.4));
}
/* pictos retires a la demande du client (2026-08-20) : le titre ouvre la carte */
.cvc .cvc-metier__titre { font-size: var(--cv2-t3); font-weight: 700; line-height: 1.25; text-align: left; }
.cvc .cvc-metier__titre::after { content: none; }
.wp-site-blocks .cvc .cvc-metier > .cvc-metier__titre { margin-block: 0 12px; }
.cvc p.cvc-metier__txt { font-size: 15px; line-height: 1.7; color: #C7C9E6; }

/* ---------- deroule du projet ---------- */
.cvc-etapes { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; position: relative; }
.cvc-etapes::before {
	content: ""; position: absolute; left: 0; right: 0; top: 22px; height: 1px;
	background: linear-gradient(90deg, rgba(86, 181, 235, 0), rgba(86, 181, 235, .45) 8%, rgba(86, 181, 235, .45) 92%, rgba(86, 181, 235, 0));
}
.wp-site-blocks .cvc .cvh-int > .cvc-etapes { margin-block: 48px 0; }
.cvc-etape { position: relative; padding-top: 56px; }
.cvc p.cvc-etape__num {
	position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; background: var(--cv2-nuit); border: 1px solid rgba(86, 181, 235, 0.45);
	font-size: 15px; font-weight: 800; font-variant-numeric: tabular-nums; color: #FFFFFF;
}
.cvc p.cvc-etape__num strong {
	font-weight: 800; background: linear-gradient(90deg, #56B5EB, #DCDDEF);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.cvc .cvc-etape__titre { font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.3; text-align: left; }
.cvc .cvc-etape__titre::after { content: none; }
.wp-site-blocks .cvc .cvc-etape > .cvc-etape__titre { margin-block: 0 10px; }
.cvc p.cvc-etape__txt { font-size: 15px; line-height: 1.7; color: #C7C9E6; }

/* ---------- budget ---------- */
.cvc-budget { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: center; }
.cvc-budget__col { display: flex; flex-direction: column; min-width: 0; }
.cvc-paliers {
	display: flex; flex-direction: column; border: 1px solid rgba(86, 181, 235, 0.28);
	background-color: #050A2A;
	background-image: linear-gradient(158deg, rgba(86, 181, 235, 0.15), rgba(0, 2, 30, 0.5));
}
.cvc-palier { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 22px 28px; }
.cvc-palier + .cvc-palier { border-top: 1px solid rgba(255, 255, 255, 0.09); }
.cvc p.cvc-palier__lib { font-size: 14px; font-weight: 600; color: #EDEEFB; line-height: 1.4; }
.cvc p.cvc-palier__val { flex: 0 0 auto; font-size: var(--cv2-t4); font-weight: 700; color: #FFFFFF; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cvc-palier--drones { background: linear-gradient(120deg, rgba(86, 181, 235, 0.14), rgba(12, 103, 222, 0.05)); border-top: 1px solid rgba(86, 181, 235, 0.3); }
.cvc-palier--drones p.cvc-palier__val {
	font-size: var(--cv2-t3); font-weight: 800;
	background: linear-gradient(90deg, #56B5EB, #F3F4F9);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.cvc p.cvc-source {
	position: relative; padding: 22px 0 0 34px; font-size: 13.5px; line-height: 1.62; color: #9FA2CC;
	border-top: 1px solid rgba(86, 181, 235, 0.22);
}
.wp-site-blocks .cvc .cvc-budget__col > p.cvc-source { margin-block: 26px 0; }
.cvc p.cvc-source::before {
	content: ""; position: absolute; left: 0; top: 24px; width: 20px; height: 20px; background: no-repeat center/contain
	url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A4A8DB' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v6M12 7.6v.9'/%3E%3C/svg%3E");
}
.cvc p.cvc-source a { color: #56B5EB; font-weight: 600; }

/* ---------- prise en charge ---------- */
.cvc-charge { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 52px; align-items: stretch; }
.wp-site-blocks .cvc .cvh-int > .cvc-charge { margin-block: 44px 0; }
.cvc .cvc-charge__liste {
	display: grid; grid-template-columns: 1fr 1fr; gap: 2px; margin: 0; padding: 0; list-style: none;
	background: rgba(86, 181, 235, 0.16);
}
.cvc .cvc-charge__liste li {
	display: flex; gap: 14px; padding: 22px 24px; background: var(--cv2-nuit);
	font-size: 15px; line-height: 1.7; color: #E3E5F9;
}
.cvc .cvc-charge__liste li::before {
	content: ""; flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; background: no-repeat center/contain
	url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BCBFE4' stroke-width='2.2'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E");
}
.cvc-conformite {
	display: flex; flex-direction: column; padding: 30px 30px 24px; border: 1px solid rgba(86, 181, 235, 0.3);
	background: linear-gradient(160deg, rgba(86, 181, 235, 0.13), rgba(0, 2, 30, 0.55));
}
.cvc p.cvc-conformite__titre {
	font-size: var(--cv2-t6); font-weight: 700; letter-spacing: 0.19em; text-transform: uppercase; color: #FFFFFF;
	padding-bottom: 18px; border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}
.cvc .cvc-conformite ul { display: flex; flex-direction: column; flex: 1 1 auto; margin: 0; padding: 0; list-style: none; }
.cvc .cvc-conformite li {flex: 1 1 0; display: flex; align-items: center; gap: 13px; padding: 14px 0; font-size: 15px; font-weight: 600; color: #EDEEFB; line-height: 1.7;}
.cvc .cvc-conformite li + li { border-top: 1px solid rgba(255, 255, 255, 0.07); }
.cvc .cvc-conformite li::before { content: ""; flex: 0 0 auto; width: 8px; height: 8px; background: var(--cv2-degrade); }

/* ---------- repli sans flamme ---------- */
.cvc-repli { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); border: 1px solid rgba(86, 181, 235, 0.28); }
.cvc .cvc-repli__img { position: relative; min-height: 280px; overflow: hidden; margin: 0; }
.cvc .cvc-repli__img img { display: block; width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.cvc .cvc-repli__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0.62)); }
.cvc-repli__txt { padding: 40px 40px 42px; background: linear-gradient(160deg, rgba(86, 181, 235, 0.10), rgba(0, 2, 30, 0.5)); }
.cvc .cvc-repli__titre { font-size: var(--cv2-t2); font-weight: 700; line-height: 1.14; text-align: left; }
.cvc .cvc-repli__titre::after { content: none; }
.wp-site-blocks .cvc .cvc-repli__txt > .cvc-repli__titre { margin-block: 0 16px; }
.cvc .cvc-repli__txt p { font-size: 15px; line-height: 1.7; color: #CED0EB; }

/* ---------- realisations ---------- */
.cvc-reals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.wp-site-blocks .cvc .cvh-int > .cvc-reals { margin-block: 44px 0; }
.cvc-real {
	position: relative; display: flex; flex-direction: column; overflow: hidden;
	border: 1px solid rgba(86, 181, 235, 0.2); background: rgba(0, 2, 30, 0.42);
	transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.45s ease, box-shadow 0.45s ease;
}
.cvc-real:hover { transform: translateY(-6px); border-color: rgba(86, 181, 235, 0.6); box-shadow: 0 28px 56px rgba(0, 2, 30, 0.6); }
.cvc .cvc-real__img { position: relative; height: 210px; overflow: hidden; margin: 0; }
.cvc .cvc-real__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1); }
.cvc-real:hover .cvc-real__img img { transform: scale(1.07); }
.cvc .cvc-real__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(0, 0, 0, 0.62)); }
.cvc-real__corps { display: flex; flex-direction: column; flex: 1 1 auto; padding: 22px 24px 24px; }
.cvc .cvc-real__titre { font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.3; color: #FFFFFF; text-align: left; }
.cvc .cvc-real__titre::after { content: none; }
.wp-site-blocks .cvc .cvc-real__corps > .cvc-real__titre { margin-block: 0 14px; }
.cvc p.cvc-real__lien {
	display: flex; align-items: center; gap: 10px;
	font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #56B5EB;
}
.wp-site-blocks .cvc .cvc-real__corps > p.cvc-real__lien { margin-block: auto 0; }
.cvc p.cvc-real__lien a { text-decoration: none; color: inherit; }
.cvc p.cvc-real__lien a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.cvc p.cvc-real__lien::after { content: ""; flex: 1 1 auto; height: 1px; background: linear-gradient(90deg, rgba(86, 181, 235, .5), transparent); }

@media (prefers-reduced-motion: reduce) {
	.cvc::before, .cvc p.cvc-sur::before { animation: none !important; }
	.cvc-temps, .cvc-real, .cvc .cvc-temps__img img, .cvc .cvc-real__img img, .cvc-conf__grille img { transition: none !important; }
	.cvc-temps:hover, .cvc-real:hover { transform: none; }
}
@media (max-width: 1180px) {
	.cvc-annee { grid-template-columns: 1fr 1fr; }
	.cvc-annee::before { display: none; }
	.cvc-conf__grille { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.cvc-metiers { grid-template-columns: 1fr; gap: 20px; }
	.cvc-etapes { grid-template-columns: 1fr 1fr; gap: 30px 20px; }
	.cvc-etapes::before { display: none; }
	.cvc-budget { grid-template-columns: 1fr; gap: 38px; }
	.cvc-charge { grid-template-columns: 1fr; gap: 32px; }
	.cvc-repli { grid-template-columns: 1fr; }
	.cvc .cvc-repli__img { min-height: 200px; }
	.cvc-reals { grid-template-columns: 1fr; gap: 22px; }
}
@media (max-width: 760px) {
	.cvc-annee { grid-template-columns: 1fr; gap: 34px; }
	.cvc-conf__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cvc-conf__grille img { height: 48px; }
	.cvc-etapes { grid-template-columns: 1fr; gap: 26px; }
	.cvc .cvc-charge__liste { grid-template-columns: 1fr; }
	.cvc-repli__txt { padding: 28px 24px 30px; }
}

/* ============================================================================
   PAGE COLLECTIVITES - ce qui reste apres l alignement des regles generiques
   (etape 3, 2026-08-20). Le pont de l etape 2 est SUPPRIME : les selecteurs
   generiques pointent desormais eux-memes vers --cv2-t1..t3.

   Seule exception, et c est une regle de CONTEXTE, pas un rattrapage :
   `.cvh-etape__titre` vaut la taille de vignette parce que, sur l ACCUEIL, les
   etapes tiennent dans un conteneur de 398px. Sur cette page la frise est large
   de 720px : le titre y reprend sa taille de H3 plein.
   ============================================================================ */
.cvh-coll .cvh-frise .cvh-etape__titre {
	font-size: var(--cv2-t3);
	font-weight: 700;
	line-height: 1.25;
}

/* --- Titres de section : 22px, capitales, centres, queue en degrade, trait 150px --- */
.cvh-coll .cvh-titre,
.cvh-coll .cvh-hero__titre,
.cvh-coll .cvh-bandeau__titre {
	letter-spacing: 0;
	text-align: center;
	color: var(--cv2-blanc);
	max-width: none;
	margin-inline: auto;
}
.cvh-coll .cvh-titre::after,
.cvh-coll .cvh-hero__titre::after,
.cvh-coll .cvh-bandeau__titre::after {
	content: '';
	display: block;
	width: 150px;
	height: 1px;
	margin: 22px auto 0;
	background: var(--cv2-bleu);
}
/* la queue du titre en degrade : le mark de Gutenberg sert de support */
.cvh-coll .cvh-titre mark,
.cvh-coll .cvh-hero__titre mark,
.cvh-coll .cvh-bandeau__titre mark {
	background: var(--cv2-degrade-titre);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}

/* --- Chapeaux --- */
.cvh-coll .cvh-prose,
.cvh-coll.cvh-bandeau p,
.cvh-coll.cvh-hero--page p {
	max-width: 820px;
	margin-inline: auto;
	text-align: center;
}
.cvh-coll .cvh-prose p,
.cvh-coll.cvh-bandeau p,
.cvh-coll.cvh-hero--page p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.74); }
.wp-site-blocks .cvh-coll .cvh-prose > p + p { margin-block-start: 16px; }

/* --- Heros de page : 90vh, contenu ancre en bas et centre --- */
.cvh-coll.cvh-hero--page { min-height: 90vh; }
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
	text-align: center;
	max-width: 1090px;
	margin-inline: auto;
	padding: clamp(120px, 16vh, 170px) clamp(18px, 2vw, 24px) clamp(48px, 7vh, 74px);
}
.cvh-coll .cvh-hero__titre { max-width: none; }
.cvh-coll.cvh-hero--page p { max-width: 900px; }
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > * { margin-block: 0; }
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > p { margin-block-start: 22px; }
.wp-site-blocks .cvh-coll .cvh-hero__actions { margin-block-start: 28px; justify-content: center; }

/* --- Pastilles de reassurance (chips du heros) --- */
.cvh-coll .cvh-gages--chips { justify-content: center; gap: 10px; }
.wp-site-blocks .cvh-coll .cvh-gages--chips { margin-block-start: 28px; }
.cvh-coll .cvh-gages--chips li {
	background: rgba(7, 12, 61, 0.5);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(86, 181, 235, 0.3);
	padding: 8px 16px 8px 36px;
	font-size: 13px;
	font-weight: 400;
	color: var(--cv2-blanc);
}
.cvh-coll .cvh-gages--chips li::before,
.cvh-coll .cvh-gages--trust li::before,
.cvh-coll .cvh-preuve::before,
.cvh-coll .cvh-liste--pills li::before {
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23B9BDE2'%3E%3Cpath d='M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zM227.3 387.3l184-184c6.2-6.2 6.2-16.4 0-22.6l-22.6-22.6c-6.2-6.2-16.4-6.2-22.6 0L216 308.1l-70.1-70.1c-6.2-6.2-16.4-6.2-22.6 0l-22.6 22.6c-6.2 6.2-6.2 16.4 0 22.6l104 104c6.2 6.2 16.4 6.2 22.6 0z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	border-radius: 0;
}
.cvh-coll .cvh-gages--chips li::before { left: 16px; width: 13px; height: 13px; }

/* --- Gages de la bande d appel : ligne simple, sans boite --- */
.cvh-coll .cvh-gages--trust { justify-content: center; gap: 12px 22px; }
.cvh-coll .cvh-gages--trust li {padding-left: 21px; font-size: 15px; font-weight: 400; color: rgba(255, 255, 255, 0.82); line-height: 1.7;}
.cvh-coll .cvh-gages--trust li::before { left: 0; width: 15px; height: 15px; }

/* --- Cinq langages : cartes du kit prod (fond bleute, bordure ciel, titre ciel) --- */
.cvh-coll .cvh-langage {
	background: rgba(12, 103, 222, 0.06);
	border: 1px solid rgba(86, 181, 235, 0.18);
	padding: 34px 32px;
}
.cvh-coll .cvh-langage:hover { background: rgba(12, 103, 222, 0.1); border-color: rgba(86, 181, 235, 0.32); transform: none; }
.cvh-coll .cvh-langage p.cvh-langage__sur { font-size: 12px; letter-spacing: 0.16em; color: #B9BDE2; }
.cvh-coll .cvh-langage__titre { color: var(--cv2-ciel); }
.cvh-coll .cvh-langage p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.72); }
.cvh-coll .cvh-langage p.cvh-langage__note { font-size: 13px; color: rgba(255, 255, 255, 0.58); }
.cvh-coll .cvh-langages { max-width: 1160px; margin-inline: auto; gap: 24px; }

/* --- Protocole : frise verticale a pastilles rondes (kit prod) --- */
.cvh-coll .cvh-frise {
	position: relative;
	display: block;
	max-width: 720px;
	width: 100%;
	margin-inline: auto;
	padding: 0;
	grid-template-columns: none;
}
.wp-site-blocks .cvh-coll .cvh-int > .cvh-frise { margin-block-start: 38px; }
.wp-site-blocks .cvh-coll .cvh-frise > * { margin-block: 0; }
.cvh-coll .cvh-frise::before {
	content: '';
	position: absolute;
	left: 28px;
	top: 28px;
	bottom: 28px;
	right: auto;
	width: 2px;
	height: auto;
	background: linear-gradient(180deg, var(--cv2-ciel), var(--cv2-bleu));
	opacity: 0.4;
}
.cvh-coll .cvh-frise .cvh-etape {
	display: grid;
	grid-template-columns: 58px 1fr;
	column-gap: 24px;
	row-gap: 6px;
	align-items: start;
	padding: 16px 0;
}
.cvh-coll .cvh-frise .cvh-etape::before { display: none; }
.wp-site-blocks .cvh-coll .cvh-frise .cvh-etape > * { margin-block: 0; }
.cvh-coll .cvh-frise .cvh-etape__num {
	grid-column: 1;
	grid-row: 1 / span 2;
	position: relative;
	z-index: 1;
	width: 58px;
	height: 58px;
	box-sizing: border-box;
	border-radius: 50%;
	background: var(--cv2-abysse);
	border: 1px solid rgba(86, 181, 235, 0.5);
	color: #B9BDE2;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 0;
	text-transform: none;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: border-color 0.35s ease, box-shadow 0.35s ease;
}
.cvh-coll .cvh-frise .cvh-etape:hover .cvh-etape__num { border-color: var(--cv2-ciel); box-shadow: 0 0 0 5px rgba(86, 181, 235, 0.14); }
.cvh-coll .cvh-frise .cvh-etape__titre {
	grid-column: 2;
	grid-row: 1;
	color: var(--cv2-blanc);
	padding-bottom: 0;
	align-self: end;
}
.cvh-coll .cvh-frise .cvh-etape__titre::after { display: none; }
.cvh-coll .cvh-frise .cvh-etape__texte {
	grid-column: 2;
	grid-row: 2;
	font-size: 15px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.66);
}

/* --- Bandes en image : pleine hauteur, contenu centre, sans panneau de verre --- */
.cvh-coll.cvh-bandeau { min-height: 100vh; display: flex; align-items: center; }
.cvh-coll.cvh-bandeau .wp-block-cover__inner-container { padding: clamp(56px, 7vw, 96px) clamp(18px, 2vw, 24px); }
.cvh-coll .cvh-bandeau__panneau--nu {
	background: none;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	border: 0;
	box-shadow: none;
	padding: 0;
	max-width: 880px;
	margin-inline: auto;
	text-align: center;
}
.cvh-coll .cvh-bandeau__panneau--nu::before { display: none; }
.wp-site-blocks .cvh-coll .cvh-bandeau__panneau--nu > * { margin-block: 0; }
.wp-site-blocks .cvh-coll .cvh-bandeau__panneau--nu > p { margin-block-start: 22px; }
.wp-site-blocks .cvh-coll .cvh-bandeau__panneau--nu > .cvh-liste,
.wp-site-blocks .cvh-coll .cvh-bandeau__panneau--nu > .cvh-gages,
.wp-site-blocks .cvh-coll .cvh-bandeau__panneau--nu > .wp-block-buttons { margin-block-start: 26px; }
.cvh-coll .cvh-bandeau__panneau--nu .wp-block-buttons { justify-content: center; }

/* --- Pills de l orchestration --- */
.cvh-coll .cvh-liste--pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 0; }
.cvh-coll .cvh-liste--pills li {
	position: relative;
	background: rgba(12, 103, 222, 0.16);
	border: 1px solid rgba(86, 181, 235, 0.32);
	border-bottom: 1px solid rgba(86, 181, 235, 0.32);
	padding: 8px 16px 8px 36px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--cv2-blanc);
}
.cvh-coll .cvh-liste--pills li::before { left: 16px; width: 13px; height: 13px; top: 50%; }

/* --- Pourquoi : deux cartes bordees + badges de conformite --- */
.cvh-coll .cvh-cartes2 { max-width: 1040px; margin-inline: auto; gap: 24px; }
.wp-site-blocks .cvh-coll .cvh-int > .cvh-cartes2 { margin-block-start: 36px; }
.cvh-coll .cvh-cartes2 > .wp-block-column {
	box-sizing: border-box;
	background: rgba(12, 103, 222, 0.06);
	border: 1px solid rgba(86, 181, 235, 0.18);
	padding: 34px 32px;
}
.wp-site-blocks .cvh-coll .cvh-cartes2 > .wp-block-column > * { margin-block: 0; }
.wp-site-blocks .cvh-coll .cvh-cartes2 > .wp-block-column > p { margin-block-start: 14px; }
.cvh-coll .cvh-cartes2 h3 { color: var(--cv2-ciel); }
.cvh-coll .cvh-cartes2 p { font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.72); }
.cvh-coll .cvh-preuves { justify-content: center; gap: 14px; max-width: 1040px; margin-inline: auto; }
.wp-site-blocks .cvh-coll .cvh-int > .cvh-preuves { margin-block-start: 32px; }
.cvh-coll .cvh-preuve {
	position: relative;
	background: rgba(12, 103, 222, 0.06);
	border: 1px solid rgba(86, 181, 235, 0.2);
	padding: 12px 18px 12px 44px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: rgba(255, 255, 255, 0.86);
}
.cvh-coll .cvh-preuve::before { left: 18px; width: 18px; height: 18px; }
.cvh-coll .cvh-preuve:hover { border-color: rgba(86, 181, 235, 0.45); background: rgba(12, 103, 222, 0.12); }

/* --- Boutons --- */
/* le selecteur de base vise .cvh-hero/.cvh-sec/.cvh-drones : les boutons places dans un
   .cvh-bandeau n heritaient d AUCUN style (ni degrade, ni capitales, hauteur differente).
   On reprend ici la recette complete, a la mesure de la prod : 15px, capitales, 12px 24px. */
.cvh-coll .wp-block-button__link {
	background: var(--cv2-degrade-bouton);
	color: var(--cv2-blanc);
	border: 0;
	border-radius: 0;
	font-family: Montserrat, ui-sans-serif, system-ui, sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	padding: 12px 24px;
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.cvh-coll .wp-block-button__link:hover { box-shadow: 0 8px 24px rgba(12, 103, 222, 0.45); transform: translateY(-1px); }
/* variante contour : padding reduit d 1px pour compenser la bordure et garder la meme hauteur */
.cvh-coll .is-style-outline .wp-block-button__link {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.55);
	padding: 11px 23px;
}
.cvh-coll .is-style-outline .wp-block-button__link:hover { border-color: var(--cv2-ciel); box-shadow: none; }

/* --- Paliers --- */
@media (max-width: 1024px) {
	.cvh-coll .cvh-langages { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
	.cvh-coll .cvh-cartes2 { flex-wrap: wrap; }
	.cvh-coll .cvh-cartes2 > .wp-block-column { flex-basis: 100% !important; }
}
@media (max-width: 767px) {
	.cvh-coll > .cvh-int { padding: 56px 18px; }
	.cvh-coll.cvh-hero--page { min-height: 78vh; }
	.cvh-coll.cvh-bandeau { min-height: auto; }
	.cvh-coll.cvh-bandeau .wp-block-cover__inner-container { padding: 72px 18px; }
	.cvh-coll .cvh-frise::before { left: 21px; }
	.cvh-coll .cvh-frise .cvh-etape { grid-template-columns: 44px 1fr; column-gap: 16px; }
	.cvh-coll .cvh-frise .cvh-etape__num { width: 44px; height: 44px; font-size: 16px; }
	.cvh-coll .cvh-langage, .cvh-coll .cvh-cartes2 > .wp-block-column { padding: 26px 22px; }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-coll .cvh-langage, .cvh-coll .cvh-preuve, .cvh-coll .cvh-frise .cvh-etape__num { transition: none !important; }
}

/* --- Opacite exacte des voiles (Gutenberg ne propose que des paliers de 10) --- */
.cvh-coll.cvh-hero--page > .wp-block-cover__background { opacity: 0.55; }
.cvh-coll.cvh-bandeau:not(.cvh-bandeau--cta) > .wp-block-cover__background { opacity: 0.39; }

/* --- Ajustements de parite dictes par la mesure du rendu prod (2026-08-20) --- */
/* frise : conteneur 10px + gouttiere 20px, rangee de 131px (prod : 6 x 131 + 5 x 20 + 20 = 906) */
.cvh-coll .cvh-frise { display: flex; flex-direction: column; row-gap: 20px; padding: 10px 0; }
.cvh-coll .cvh-frise .cvh-etape { min-height: 131px; box-sizing: border-box; align-content: center; }
/* badges : la prod les affiche SANS picto, 12px 18px, hauteur 40px -> les 5 tiennent sur une rangee */
.cvh-coll .cvh-preuve { padding: 12px 18px; line-height: 16px; letter-spacing: 0; }
.cvh-coll .cvh-preuve::before { display: none; }
/* corps de texte : la prod est a 16px partout (chapeaux, cartes, etapes, panneaux) */
.cvh-coll .cvh-cartes2 p { font-size: 15px; line-height: 1.7; }
.wp-site-blocks .cvh-coll .cvh-cartes2 > .wp-block-column > p { margin-block-start: 20px; }
.cvh-coll .cvh-frise .cvh-etape__texte { font-size: 15px; line-height: 1.7; }
.cvh-coll .cvh-langage p { font-size: 15px; line-height: 1.7; }
.cvh-coll .cvh-langage p.cvh-langage__note { font-size: 13px; line-height: 1.6; }

/* =========== LOT DU 2026-08-20 (retours client) =========== */

/* 1. AIR DU HEROS.
   ⛔ La neutralisation `... .wp-block-cover__inner-container > * { margin-block: 0 }` vaut (0,4,0)
   et ecrasait les marges ecrites en (0,3,0) : il n y avait 0px entre le chapeau, les boutons et
   les pastilles. Reecrit ici en (0,5,0). Prod mesuree : 24px puis 52px. */
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-hero__actions { margin-block-start: 30px; }
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-gages--chips { margin-block-start: 52px; }

/* 2. BOUTONS DE MEME LARGEUR (demande client) */
.cvh-coll .wp-block-button__link { min-width: 250px; text-align: center; box-sizing: border-box; }
@media (max-width: 520px) {
	.cvh-coll .wp-block-buttons > .wp-block-button { width: 100%; }
	.cvh-coll .wp-block-button__link { min-width: 0; width: 100%; }
}

/* 3. CINQ LANGAGES : rangees image + texte alternees (composition .f14discsec de la prod) */
.cvh-coll .cvh-langages { display: block; max-width: 1160px; margin-inline: auto; }
.wp-site-blocks .cvh-coll .cvh-int > .cvh-langages { margin-block-start: 38px; }
.wp-site-blocks .cvh-coll .cvh-langages > * { margin-block: 0; }
.cvh-coll .cvh-rangee {
	display: grid;
	grid-template-columns: 1fr 1.05fr;
	gap: 50px;
	align-items: center;
	padding: 46px 0;
}
.cvh-coll .cvh-rangee > * { box-sizing: border-box; }
.cvh-coll .cvh-rangee + .cvh-rangee { border-top: 1px solid rgba(86, 181, 235, 0.12); }
.cvh-coll .cvh-rangee--inverse > .cvh-rangee__media { order: 2; }
.cvh-coll .cvh-rangee__media {
	position: relative;
	min-height: 370px;
	padding: 0;
	background: none;
	border: 1px solid rgba(86, 181, 235, 0.22);
	box-shadow: 0 26px 52px rgba(0, 0, 0, 0.42);
	overflow: hidden;
}
/* piege : height:100% sur une figure se resout en ratio naturel -> ancrage absolu */
.cvh-coll .cvh-rangee__img { position: absolute; inset: 0; margin: 0; }
.cvh-coll .cvh-rangee__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* dans une rangee, la colonne de texte n est plus une carte : ecrin nu comme en prod */
.cvh-coll .cvh-rangee > .cvh-langage { background: none; border: 0; padding: 0; }
.cvh-coll .cvh-rangee > .cvh-langage:hover { background: none; border: 0; transform: none; }
.wp-site-blocks .cvh-coll .cvh-rangee > .cvh-langage > * { margin-block: 0; }
.wp-site-blocks .cvh-coll .cvh-rangee > .cvh-langage > .cvh-langage__titre { margin-block: 16px 14px; }
.wp-site-blocks .cvh-coll .cvh-rangee > .cvh-langage > p + p { margin-block-start: 14px; }
.wp-site-blocks .cvh-coll .cvh-rangee > .cvh-langage > .cvh-langage__note { margin-block-start: 22px; }
/* sur-titre : tiret degrade de 30px, comme .cel-eyebrow de la prod */
.cvh-coll .cvh-langage p.cvh-langage__sur {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
}
.cvh-coll .cvh-langage p.cvh-langage__sur::before { content: ''; flex: 0 0 30px; width: 30px; height: 1px; background: var(--cv2-degrade); }
.cvh-coll .cvh-langage__titre { text-align: left; color: var(--cv2-blanc); }
.cvh-coll .cvh-langage__titre mark { background: var(--cv2-degrade-titre); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.cvh-coll .cvh-langage p.cvh-langage__note { padding-top: 16px; border-top: 1px solid rgba(86, 181, 235, 0.16); color: rgba(255, 255, 255, 0.58); }
@media (max-width: 900px) {
	.cvh-coll .cvh-rangee { grid-template-columns: 1fr; gap: 22px; padding: 32px 0; }
	.cvh-coll .cvh-rangee--inverse > .cvh-rangee__media { order: 0; }
	.cvh-coll .cvh-rangee__media { min-height: 240px; }
}

/* --- ONGLETS (demande client du 2026-08-20) : composition de la production.
   La barre est posee par accueil.js ; sans JS les 5 panneaux restent empiles et lisibles,
   et ils sont de toute facon TOUS dans le HTML (masques en CSS, donc indexes). --- */
.cvh-coll .cvh-rangee__onglet { display: none; }
.cvh-coll .cvh-langages--onglets { max-width: 1090px; }
.cvh-coll .cvh-onglets { position: relative; display: flex; flex-wrap: wrap; gap: 10px; }
/* curseur glissant : c est LUI qui porte le fond de l onglet actif, d ou l effet de glisse */
.cvh-coll .cvh-onglets__curseur {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	pointer-events: none;
	background: var(--cv2-degrade-bouton);
	box-shadow: 0 12px 28px rgba(12, 103, 222, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.22);
	opacity: 0;
}
/* la transition n est armee qu APRES le premier placement, sinon le curseur glisse depuis 0,0 */
.cvh-coll .cvh-onglets__curseur--pret {
	opacity: 1;
	transition: transform 0.52s cubic-bezier(0.65, 0.05, 0.15, 1), width 0.52s cubic-bezier(0.65, 0.05, 0.15, 1), height 0.3s ease, opacity 0.3s ease;
}
/* ⛔ la barre est enfant direct de .cvh-langages, dont la neutralisation `> * { margin-block: 0 }`
   vaut (0,3,0) : l ecart de 35px doit etre reecrit AU-DESSUS, sinon il tombe a 0. */
.wp-site-blocks .cvh-coll .cvh-langages > .cvh-onglets { margin-block: 0 35px; }
/* onglets en verre (glassmorphism) : le fond de l actif est porte par le curseur */
.cvh-coll .cvh-onglet {
	-webkit-appearance: none;
	appearance: none;
	position: relative;
	z-index: 1;
	background: rgba(7, 12, 61, 0.55);
	-webkit-backdrop-filter: blur(10px) saturate(1.2);
	backdrop-filter: blur(10px) saturate(1.2);
	border: 1px solid rgba(86, 181, 235, 0.33);
	border-radius: 0;
	color: rgba(255, 255, 255, 0.86);
	font-family: Montserrat, ui-sans-serif, system-ui, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	padding: 15px 35px;
	cursor: pointer;
	transition: color 0.3s ease, border-color 0.35s ease, background-color 0.35s ease, transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.35s ease;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cvh-coll .cvh-onglet { background: rgba(7, 12, 61, 0.92); }
}
.cvh-coll .cvh-onglet:hover {
	color: var(--cv2-blanc);
	border-color: rgba(86, 181, 235, 0.75);
	background: rgba(12, 103, 222, 0.24);
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(0, 2, 30, 0.42);
}
/* actif : transparent, pour laisser voir le degrade du curseur qui vient se placer dessous */
.cvh-coll .cvh-onglet[aria-selected="true"] {
	background: transparent;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	border-color: transparent;
	color: var(--cv2-blanc);
	/* pas de changement de graisse : il elargirait le bouton et le curseur glissant,
	   place avant le reflow, ne le couvrirait plus exactement (5px mesures). */
	transform: none;
	box-shadow: none;
}
/* ⛔ le cadre blanc signale par le client = l anneau de focus natif. On le remplace par un halo
   ciel : supprimer l indicateur sans rien mettre serait une regression d accessibilite. */
.cvh-coll .cvh-onglet:focus { outline: none; }
.cvh-coll .cvh-onglet:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(86, 181, 235, 0.9), 0 0 0 7px rgba(86, 181, 235, 0.2);
}
/* ⛔ l attribut [hidden] du navigateur (display:none, feuille UA) est battu par le display:grid
   de la regle auteur ci-dessus : il faut le redeclarer cote auteur, sinon rien ne se masque. */
.cvh-coll .cvh-langages--onglets .cvh-rangee[hidden] { display: none; }
.cvh-coll .cvh-langages--onglets .cvh-rangee {
	display: flex;
	align-items: stretch;
	gap: 0;
	padding: 0;
	border-top: 0;
}
.cvh-coll .cvh-langages--onglets .cvh-rangee + .cvh-rangee { border-top: 0; }
.cvh-coll .cvh-langages--onglets .cvh-rangee__media {
	flex: 0 0 45%;
	padding: 0;
	border: 1px solid rgba(86, 181, 235, 0.33);
	box-shadow: none;
}
.cvh-coll .cvh-langages--onglets .cvh-rangee > .cvh-langage {
	flex: 1 1 55%;
	min-width: 0;
	padding: 48px;
	border: 1px solid rgba(86, 181, 235, 0.33);
	border-left: 0;
}
@media (max-width: 900px) {
	.cvh-coll .cvh-langages--onglets .cvh-rangee { flex-direction: column; }
	.cvh-coll .cvh-langages--onglets .cvh-rangee__media { flex: 0 0 auto; min-height: 240px; }
	.cvh-coll .cvh-langages--onglets .cvh-rangee > .cvh-langage { padding: 30px 24px; border-left: 1px solid rgba(86, 181, 235, 0.33); border-top: 0; }
	.cvh-coll .cvh-onglet { padding: 12px 20px; font-size: 15px; }
}

/* ====================================================================
   HEROS - composition « ancrage cinematographique » (arbitrage client 2026-08-20)
   Degrade de revelation · H1 ample · gages en ligne fine · apparition en cascade.
   ==================================================================== */

/* --- 1. Traitement de l image : le voile PLAT a 55 % est remplace par un degrade vertical.
   Le bloc cover pose sa couleur et son opacite EN STYLE INLINE : le !important est ici le seul
   moyen de les reprendre sans quitter le bloc natif (regle partagee par les 3 heros du silo Collectivites). */
.cvh-coll.cvh-hero--page > .wp-block-cover__background {
	opacity: 1 !important;
	background-color: transparent !important;
	/* Deux couches : un halo elliptique qui assombrit SOUS la colonne de texte (la photo reste
	   lisible sur les cotes et en haut), puis le degrade vertical de fondu vers l abysse.
	   Valeurs dictees par l echantillonnage du pire pixel au canvas, pas au jugement. */
	/* Voile NOIR, halo remonte sous la colonne de texte (demande client 2026-08-20 :
	   "un voile noir moins couvrant pour laisser bien voir l image de fond").
	   L ancien voile etait en abysse rgba(0,2,30) : un bleu nuit, pas un noir.
	   Couverture moyenne mesuree 67,4% -> 57%, H1 8,63 -> 5,61, chapo 13,71 -> 7,24. */
	background-image:
		radial-gradient(ellipse 92% 78% at 50% 50%,
			rgba(0, 0, 0, 0.58) 0%,
			rgba(0, 0, 0, 0.24) 58%,
			rgba(0, 0, 0, 0) 100%),
		linear-gradient(180deg,
			rgba(0, 0, 0, 0.06) 0%,
			rgba(0, 0, 0, 0.12) 22%,
			rgba(0, 0, 0, 0.28) 46%,
			rgba(0, 0, 0, 0.56) 74%,
			rgba(0, 0, 0, 0.86) 100%) !important;
}

/* --- 2. Colonne de composition : 940px, ancree au tiers bas --- */
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container {
	max-width: 940px;
	padding: clamp(130px, 18vh, 190px) clamp(18px, 2vw, 24px) clamp(66px, 9vh, 104px);
}

/* --- 3. Surtitre encadre de filets.
   La regle generale des chapeaux `.cvh-coll.cvh-hero--page p` vaut (0,2,1) et battait
   `.cvh-coll .cvh-hero__sur` (0,2,0) : le surtitre ressortait a 16px blanc. D ou p.classe. */
.cvh-coll.cvh-hero--page p.cvh-hero__sur {
	display: inline-flex;
	align-items: center;
	gap: 18px;
	align-self: center;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	/* mesure au canvas : le ciel plafonne a 2,18 de contraste a cette hauteur (seuil 4,5).
	   Le ciel reste sur les filets ; le mot passe en blanc -> 8,5. */
	color: var(--cv2-blanc);
	max-width: none;
	text-align: center;
}
.cvh-coll.cvh-hero--page p.cvh-hero__sur::before,
.cvh-coll.cvh-hero--page p.cvh-hero__sur::after { content: ''; height: 1px; flex: 0 0 46px; }
.cvh-coll.cvh-hero--page p.cvh-hero__sur::before { background: linear-gradient(90deg, rgba(86, 181, 235, 0), var(--cv2-ciel)); }
.cvh-coll.cvh-hero--page p.cvh-hero__sur::after { background: linear-gradient(90deg, var(--cv2-ciel), rgba(86, 181, 235, 0)); }

/* --- 4. Titre ample. Le trait sous le titre est retire DANS LE HEROS : le surtitre porte
   deja ses filets, deux traits a trois lignes d ecart faisaient doublon. --- */
.cvh-coll .cvh-hero__titre {
	letter-spacing: -0.005em;
	max-width: none;
}
.cvh-coll .cvh-hero__titre::after { display: none; }

/* --- 5. Chapeau --- */
.cvh-coll.cvh-hero--page p:not(.cvh-hero__sur) {
	max-width: 760px;
	font-size: clamp(15.5px, 1.25vw, 17px);
	line-height: 1.72;
	color: rgba(255, 255, 255, 0.8);
}

/* --- 6. Rythme vertical. La neutralisation `> * { margin-block: 0 }` vaut (0,4,0) :
   chaque marge est reecrite en (0,5,0), sinon elle retombe a zero (piege paye 3 fois). --- */
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-hero__titre { margin-block-start: 26px; }
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > p { margin-block-start: 22px; }
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-hero__sur { margin-block-start: 0; }
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-hero__actions { margin-block-start: 36px; }
.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-gages--ligne { margin-block-start: 46px; }

/* --- 7. Gages en ligne fine : plus de boites, des filets verticaux --- */
/* une SEULE ligne : la bande sort de la boite de 940px du heros et se dimensionne
   en fluide pour ne jamais depasser le viewport. En dessous de 900px elle empile. */
.cvh-coll .cvh-gages--ligne {
	--gg-pl: clamp(26px, 2.75vw, 38px);
	--gg-pr: clamp(12px, 1.5vw, 20px);
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 0;
	max-width: calc(100vw - 40px);
}
.cvh-coll .cvh-gages--ligne li {
	position: relative;
	flex: 0 0 auto;
	white-space: nowrap;
	padding: 2px var(--gg-pr) 2px var(--gg-pl);
	font-size: clamp(11.5px, 1.02vw, 13.5px);
	font-weight: 500;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.82);
	background: none;
	border: 0;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}
.cvh-coll .cvh-gages--ligne li + li { border-left: 1px solid rgba(86, 181, 235, 0.26); }
.cvh-coll .cvh-gages--ligne li::before {
	content: '';
	position: absolute;
	left: calc(var(--gg-pl) - 19px);
	top: 50%;
	transform: translateY(-50%);
	width: 13px;
	height: 13px;
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23B9BDE2'%3E%3Cpath d='M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zM227.3 387.3l184-184c6.2-6.2 6.2-16.4 0-22.6l-22.6-22.6c-6.2-6.2-16.4-6.2-22.6 0L216 308.1l-70.1-70.1c-6.2-6.2-16.4-6.2-22.6 0l-22.6 22.6c-6.2 6.2-6.2 16.4 0 22.6l104 104c6.2 6.2 16.4 6.2 22.6 0z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	border-radius: 0;
}
.cvh-coll .cvh-gages--ligne li:first-child { padding-left: 18px; }
.cvh-coll .cvh-gages--ligne li:first-child::before { left: 0; }

/* --- 8. Apparition en cascade. L etat de repos reste opacity:1 et l animation part de
   `from` grace a fill-mode BACKWARDS : si les animations sont coupees (reglage systeme,
   sonde de mesure, navigateur ancien), le contenu reste VISIBLE. --- */
@keyframes cvhHeroLever {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: none; }
}
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container > * {
	animation: cvhHeroLever 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) backwards;
}
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container > *:nth-child(1) { animation-delay: 0.08s; }
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container > *:nth-child(2) { animation-delay: 0.2s; }
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container > *:nth-child(3) { animation-delay: 0.32s; }
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container > *:nth-child(4) { animation-delay: 0.44s; }
.cvh-coll.cvh-hero--page .wp-block-cover__inner-container > *:nth-child(5) { animation-delay: 0.56s; }

@media (max-width: 900px) {
	.cvh-coll .cvh-gages--ligne { flex-wrap: wrap; flex-direction: column; align-items: center; gap: 12px; width: auto; max-width: 100%; }
	.cvh-coll .cvh-gages--ligne li { padding: 0 0 0 22px; font-size: 13.5px; white-space: normal; }
	.cvh-coll .cvh-gages--ligne li + li { border-left: 0; }
	.cvh-coll .cvh-gages--ligne li::before { left: 0; }
	.cvh-coll.cvh-hero--page p.cvh-hero__sur { gap: 12px; letter-spacing: 0.24em; }
	.cvh-coll.cvh-hero--page p.cvh-hero__sur::before, .cvh-coll.cvh-hero--page p.cvh-hero__sur::after { flex-basis: 26px; }
	/* le heros montait a 1031px sur iPhone : on resserre l enveloppe et le rythme */
	.cvh-coll.cvh-hero--page .wp-block-cover__inner-container { padding: 116px 18px 58px; }
	.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-hero__titre { margin-block-start: 18px; }
	.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > p { margin-block-start: 18px; }
	.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-hero__actions { margin-block-start: 28px; }
	.wp-site-blocks .cvh-coll.cvh-hero--page .wp-block-cover__inner-container > .cvh-gages--ligne { margin-block-start: 32px; }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-coll.cvh-hero--page .wp-block-cover__inner-container > * { animation: none; }
}

/* --- Panneau : entree animee (fondu + glissement decale image/texte) --- */
@keyframes cvhPanEntre { from { opacity: 0; } to { opacity: 1; } }
@keyframes cvhMediaEntre { from { opacity: 0; transform: translateX(-26px) scale(1.03); } to { opacity: 1; transform: none; } }
@keyframes cvhTexteEntre { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }
/* fill-mode BACKWARDS partout : si l animation ne joue pas, le contenu reste visible */
.cvh-coll .cvh-rangee--entre { animation: cvhPanEntre 0.5s ease backwards; }
.cvh-coll .cvh-rangee--entre > .cvh-rangee__media { animation: cvhMediaEntre 0.72s cubic-bezier(0.22, 0.61, 0.36, 1) 0.05s backwards; }
.cvh-coll .cvh-rangee--entre > .cvh-langage { animation: cvhTexteEntre 0.72s cubic-bezier(0.22, 0.61, 0.36, 1) 0.16s backwards; }
/* voile leger sur le visuel + zoom lent au survol du panneau */
.cvh-coll .cvh-langages--onglets .cvh-rangee__media::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(152deg, rgba(86, 181, 235, 0.12) 0%, rgba(0, 0, 0, 0) 44%, rgba(0, 0, 0, 0.44) 100%);
}
.cvh-coll .cvh-rangee__img img { transition: transform 1.25s cubic-bezier(0.2, 0.6, 0.2, 1); }
.cvh-coll .cvh-langages--onglets .cvh-rangee:hover .cvh-rangee__img img { transform: scale(1.06); }
/* le panneau se souleve tres legerement au survol (profondeur) */
.cvh-coll .cvh-langages--onglets .cvh-rangee { transition: box-shadow 0.45s ease; }
.cvh-coll .cvh-langages--onglets .cvh-rangee:hover { box-shadow: 0 26px 60px rgba(0, 2, 30, 0.5); }
@media (prefers-reduced-motion: reduce) {
	.cvh-coll .cvh-onglets__curseur, .cvh-coll .cvh-onglet, .cvh-coll .cvh-rangee__img img, .cvh-coll .cvh-langages--onglets .cvh-rangee { transition: none !important; }
	.cvh-coll .cvh-rangee--entre, .cvh-coll .cvh-rangee--entre > * { animation: none !important; }
	.cvh-coll .cvh-onglet:hover { transform: none; }
	.cvh-coll .cvh-langages--onglets .cvh-rangee:hover .cvh-rangee__img img { transform: none; }
}

/* ====================================================================
   SECTION ORCHESTRATION - cartes de verre en chevauchement (arbitrage client 2026-08-20)
   ==================================================================== */
/* voile : la photo dsc04602 est la plus claire du site, 39 % ne suffisait pas
   (titre 2,60 / chapeau 2,60 / pastilles 2,61 mesures au canvas). Halo centre + degrade. */
.cvh-coll.cvh-bandeau--orch > .wp-block-cover__background {
	opacity: 1 !important;
	background-color: transparent !important;
	background-image:
		radial-gradient(ellipse 78% 66% at 50% 44%, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.42) 58%, rgba(0, 0, 0, 0.1) 100%),
		linear-gradient(180deg, rgba(0, 0, 0, 0.62) 0%, rgba(0, 0, 0, 0.48) 34%, rgba(0, 0, 0, 0.62) 72%, rgba(0, 0, 0, 0.9) 100%) !important;
}
/* le cover doit laisser deborder les cartes (le coeur pose overflow:hidden) */
.cvh-coll.cvh-bandeau--orch { overflow: visible; align-items: stretch; position: relative; z-index: 2; }
.cvh-coll.cvh-bandeau--orch .wp-block-cover__inner-container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* on reserve la hauteur des cartes, qui sont posees en absolu sur le bord bas.
	   Mesure : elles remontent de 30px dans la section, 48px de reserve suffisent et
	   evitent de tasser le panneau vers le haut (349px de vide sous le CTA sinon). */
	padding-bottom: calc(clamp(56px, 7vw, 96px) + 48px);
}
/* rangee de cartes : elle mord sur la section suivante */
.cvh-coll .cvh-cartes3 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	/* ⛔ en flex centre, une marge negative ne fait PAS deborder : le centrage l absorbe
	   (mesure : -165px de debordement au lieu de +104). Ancrage absolu sur le bord bas. */
	position: absolute;
	left: 50%;
	bottom: -104px;
	transform: translateX(-50%);
	width: min(1180px, calc(100% - 48px));
}
.wp-site-blocks .cvh-coll .cvh-cartes3 { margin-block: 0; }
.wp-site-blocks .cvh-coll .cvh-cartes3 > * { margin-block: 0; }
.cvh-coll .cvh-carte3 {
	position: relative;
	box-sizing: border-box;
	padding: 30px 28px 30px 62px;
	background: rgba(7, 12, 61, 0.58);
	-webkit-backdrop-filter: blur(16px) saturate(1.3);
	backdrop-filter: blur(16px) saturate(1.3);
	border: 1px solid rgba(86, 181, 235, 0.28);
	box-shadow: 0 28px 64px rgba(0, 2, 30, 0.55);
	transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.45s ease, box-shadow 0.45s ease, background-color 0.45s ease;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cvh-coll .cvh-carte3 { background: rgba(7, 12, 61, 0.94); }
}
/* liseré dégradé en tête de carte, il se deploie au survol */
.cvh-coll .cvh-carte3::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 74px;
	height: 2px;
	background: var(--cv2-degrade);
	transition: width 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cvh-coll .cvh-carte3::before {
	content: '';
	position: absolute;
	left: 28px;
	top: 32px;
	width: 18px;
	height: 18px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23B9BDE2'%3E%3Cpath d='M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zM227.3 387.3l184-184c6.2-6.2 6.2-16.4 0-22.6l-22.6-22.6c-6.2-6.2-16.4-6.2-22.6 0L216 308.1l-70.1-70.1c-6.2-6.2-16.4-6.2-22.6 0l-22.6 22.6c-6.2 6.2-6.2 16.4 0 22.6l104 104c6.2 6.2 16.4 6.2 22.6 0z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
}
.cvh-coll .cvh-carte3 p { margin: 0; font-size: 15px; font-weight: 500; line-height: 1.7; color: rgba(255, 255, 255, 0.9); }
.cvh-coll .cvh-carte3:hover { transform: translateY(-8px); border-color: rgba(86, 181, 235, 0.6); background: rgba(12, 103, 222, 0.24); box-shadow: 0 38px 76px rgba(0, 2, 30, 0.62); }
.cvh-coll .cvh-carte3:hover::after { width: 100%; }
/* la section suivante recule pour laisser passer les cartes */
.cvh-bandeau--orch + .cvh-sec.cvh-coll > .cvh-int { padding-top: calc(clamp(56px, 7vw, 96px) + 104px); }
/* revelation au defilement : montee avec redressement 3D (classes posees par accueil.js) */
.cvh-coll .cvh-carte3.cvh-anim { opacity: 0; transform: perspective(900px) rotateX(9deg) translateY(38px); }
.cvh-coll .cvh-carte3.cvh-anim.cvh-vu { opacity: 1; transform: none; transition: opacity 0.75s ease, transform 0.85s cubic-bezier(0.22, 0.61, 0.36, 1); }
@media (max-width: 980px) {
	/* ⛔ en absolu, les cartes empilees remontaient dans la section des que celle-ci perdait sa
	   hauteur fixe : elles recouvraient le bouton de 143px a 375. Sous 980px, retour au flux. */
	.cvh-coll.cvh-bandeau--orch { min-height: auto; }
	/* padding bas a zero : les cartes touchent le bord du cover, et c est la section suivante
	   qui remonte pour creer le chevauchement */
	.cvh-coll.cvh-bandeau--orch .wp-block-cover__inner-container { padding-bottom: 0; }
	.cvh-coll .cvh-cartes3 {
		position: static;
		transform: none;
		grid-template-columns: 1fr;
		gap: 16px;
		width: 100%;
		max-width: 620px;
		margin-inline: auto;
	}
	.wp-site-blocks .cvh-coll .cvh-cartes3 { margin-block: 44px 0; }
	/* le cover se retrecit d autant que la marge negative : c est la SECTION SUIVANTE
	   qu on fait remonter pour obtenir le chevauchement (mesure : -2px sinon). */
	.wp-site-blocks .cvh-bandeau--orch + .cvh-sec.cvh-coll { margin-block-start: -72px; }
	.cvh-bandeau--orch + .cvh-sec.cvh-coll > .cvh-int { padding-top: calc(clamp(56px, 7vw, 96px) + 72px); }
	.cvh-coll .cvh-carte3 { padding: 22px 22px 22px 56px; }
	.cvh-coll .cvh-carte3::before { top: 24px; }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-coll .cvh-carte3 { transition: none !important; }
	.cvh-coll .cvh-carte3:hover { transform: none; }
}

/* ====================================================================
   SECTION ORCHESTRATION v2 - DIPTYQUE a colonnes egales (client 2026-08-20)
   ⛔ Aucune hauteur imposee : la hauteur vient du TEXTE, la photo s etire dessus.
   Zero vide possible par construction. La photo garde ses couleurs (aucun voile).
   ==================================================================== */
.cvh-coll .cvh-dip {
	display: grid;
	grid-template-columns: 1.04fr 1fr;
	gap: 0;
	align-items: stretch;
}
.wp-site-blocks .cvh-coll .cvh-dip > * { margin-block: 0; }
.cvh-coll .cvh-dip__texte {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(38px, 4vw, 62px) clamp(28px, 3.4vw, 58px);
	background: var(--cv2-nuit);
	border: 1px solid rgba(86, 181, 235, 0.18);
	border-right: 0;
}
.cvh-coll .cvh-dip__media {
	position: relative;
	box-sizing: border-box;
	padding: 0;
	overflow: hidden;
	border: 1px solid rgba(86, 181, 235, 0.18);
	border-left: 0;
}
/* piege : height:100% sur une figure se resout en ratio naturel -> ancrage absolu */
.cvh-coll .cvh-dip__img { position: absolute; inset: 0; margin: 0; }
.cvh-coll .cvh-dip__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s cubic-bezier(0.2, 0.6, 0.2, 1); }
.cvh-coll .cvh-dip:hover .cvh-dip__img img { transform: scale(1.05); }
/* filet degrade a la jointure, il se deploie de haut en bas a la revelation */
.cvh-coll .cvh-dip__media::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 2px;
	z-index: 2;
	background: linear-gradient(180deg, var(--cv2-ciel), var(--cv2-bleu) 62%, rgba(12, 103, 222, 0));
	transform: scaleY(0);
	transform-origin: top;
	transition: transform 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) 0.25s;
}
.cvh-coll .cvh-dip__media.cvh-vu::before, .cvh-coll .cvh-dip__media:not(.cvh-anim)::before { transform: scaleY(1); }
/* typographie de la colonne texte */
.cvh-coll p.cvh-dip__sur {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	align-self: flex-start;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.26em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
}
.cvh-coll p.cvh-dip__sur::before { content: ''; flex: 0 0 34px; height: 1px; background: var(--cv2-degrade); }
.cvh-coll .cvh-dip__titre {
	text-align: left;
	color: var(--cv2-blanc);
	max-width: none;
}
.cvh-coll .cvh-dip__titre mark { background: var(--cv2-degrade-titre); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.cvh-coll .cvh-dip__titre::after { content: ''; display: block; width: 92px; height: 1px; margin: 18px 0 0; background: var(--cv2-bleu); }
.cvh-coll .cvh-dip__texte > p:not(.cvh-dip__sur) { font-size: 16px; line-height: 1.75; color: rgba(255, 255, 255, 0.74); max-width: none; text-align: left; }
/* liste de points : coche ciel, filets de separation */
.cvh-coll .cvh-dip__points { list-style: none; margin: 0; padding: 0; }
.cvh-coll .cvh-dip__points li {
	position: relative;
	margin-block: 0;
	padding: 13px 0 13px 32px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.88);
	border-top: 1px solid rgba(86, 181, 235, 0.16);
}
.cvh-coll .cvh-dip__points li:last-child { border-bottom: 1px solid rgba(86, 181, 235, 0.16); }
.cvh-coll .cvh-dip__points li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 16px;
	width: 15px;
	height: 15px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23B9BDE2'%3E%3Cpath d='M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zM227.3 387.3l184-184c6.2-6.2 6.2-16.4 0-22.6l-22.6-22.6c-6.2-6.2-16.4-6.2-22.6 0L216 308.1l-70.1-70.1c-6.2-6.2-16.4-6.2-22.6 0l-22.6 22.6c-6.2 6.2-6.2 16.4 0 22.6l104 104c6.2 6.2 16.4 6.2 22.6 0z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
}
/* rythme vertical : la neutralisation ci-dessus vaut (0,3,0), on redeclare en (0,4,0) */
.wp-site-blocks .cvh-coll .cvh-dip__texte > * { margin-block: 0; }
.wp-site-blocks .cvh-coll .cvh-dip__texte > .cvh-dip__titre { margin-block-start: 18px; }
.wp-site-blocks .cvh-coll .cvh-dip__texte > p:not(.cvh-dip__sur) { margin-block-start: 22px; }
.wp-site-blocks .cvh-coll .cvh-dip__texte > .cvh-dip__points { margin-block-start: 28px; }
.wp-site-blocks .cvh-coll .cvh-dip__texte > .wp-block-buttons { margin-block-start: 32px; }
/* Revelation : la photo se devoile par un masque qui glisse.
   ⛔ L etat de repos ne masque RIEN. Auparavant `.cvh-anim` posait `clip-path: inset(0 0 100% 0)` :
   si `.cvh-vu` n arrivait jamais (observateur muet, cible jamais intersectee, onglet en arriere-plan
   au chargement), l image restait invisible POUR TOUJOURS. C est exactement ce que le client a vu.
   Desormais le masque n existe que DANS l animation, declenchee par `.cvh-vu` : sans elle, l image
   s affiche normalement. Une animation ne doit jamais pouvoir supprimer un contenu. */
@keyframes cvhDevoileMedia {
	from { clip-path: inset(0 0 100% 0); }
	to { clip-path: inset(0 0 0 0); }
}
.cvh-coll .cvh-dip__media.cvh-anim { opacity: 1; transform: none; clip-path: none; }
.cvh-coll .cvh-dip__media.cvh-anim.cvh-vu { animation: cvhDevoileMedia 1s cubic-bezier(0.22, 0.61, 0.36, 1) backwards; }
@media (max-width: 900px) {
	.cvh-coll .cvh-dip { grid-template-columns: 1fr; }
	.cvh-coll .cvh-dip__media { order: -1; min-height: 320px; border: 1px solid rgba(86, 181, 235, 0.18); border-bottom: 0; }
	.cvh-coll .cvh-dip__texte { border: 1px solid rgba(86, 181, 235, 0.18); border-top: 0; padding: 32px 24px 36px; }
	.cvh-coll .cvh-dip__media::before { left: 0; right: 0; top: auto; bottom: 0; width: auto; height: 2px; background: linear-gradient(90deg, var(--cv2-ciel), var(--cv2-bleu) 62%, rgba(12, 103, 222, 0)); transform: scaleX(0); transform-origin: left; }
	.cvh-coll .cvh-dip__media.cvh-vu::before, .cvh-coll .cvh-dip__media:not(.cvh-anim)::before { transform: scaleX(1); }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-coll .cvh-dip__img img, .cvh-coll .cvh-dip__media::before { transition: none !important; }
	.cvh-coll .cvh-dip:hover .cvh-dip__img img { transform: none; }
	.cvh-coll .cvh-dip__media.cvh-anim { clip-path: none; }
}

/* ====================================================================
   SECTION « POURQUOI » v2 - atouts numerotes + panneau de conformite (client 2026-08-20)
   Motif : 83px de vide mesures au bas de la carte de droite (colonnes egalisees,
   textes de longueurs inegales) + deux paves de 12 et 9 lignes.
   ==================================================================== */
.cvh-coll .cvh-atouts {
	display: grid;
	grid-template-columns: 1.9fr 1fr;
	gap: clamp(26px, 2.6vw, 44px);
	align-items: stretch;
	max-width: 1180px;
	margin-inline: auto;
}
.wp-site-blocks .cvh-coll .cvh-int > .cvh-atouts { margin-block-start: 44px; }
.wp-site-blocks .cvh-coll .cvh-atouts > * { margin-block: 0; }
/* colonne de gauche : les deux atouts l un sous l autre */
.cvh-coll .cvh-atouts__liste { box-sizing: border-box; padding: 0; display: flex; flex-direction: column; gap: clamp(26px, 2.4vw, 38px); }
.wp-site-blocks .cvh-coll .cvh-atouts__liste > * { margin-block: 0; }
.cvh-coll .cvh-atout {
	position: relative;
	padding: 30px 32px 32px 84px;
	background: rgba(12, 103, 222, 0.06);
	border: 1px solid rgba(86, 181, 235, 0.18);
	transition: border-color 0.4s ease, background-color 0.4s ease, transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cvh-coll .cvh-atout:hover { border-color: rgba(86, 181, 235, 0.42); background: rgba(12, 103, 222, 0.1); transform: translateX(4px); }
.wp-site-blocks .cvh-coll .cvh-atout > * { margin-block: 0; }
/* numero : pose dans la gouttiere de gauche, avec son filet degrade */
.cvh-coll p.cvh-atout__num {
	position: absolute;
	left: 32px;
	top: 32px;
	margin: 0;
	font-size: 22px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 0.02em;
	/* le degrade de marque commence a #0C67DE, dont le contraste sur l abysse tombe a 2,82
	   (seuil 3 pour du gras de 22px). Le numero est peint en ciel ; le degrade bleu reste
	   sur le filet decoratif ci-dessous, qui n est pas du texte. */
	background: linear-gradient(135deg, var(--cv2-ciel), #C5C8E6);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
.cvh-coll p.cvh-atout__num::after { content: ''; position: absolute; left: 2px; top: 32px; width: 26px; height: 1px; background: var(--cv2-degrade); }
.cvh-coll .cvh-atout__titre { color: var(--cv2-ciel); }
.cvh-coll .cvh-atout p:not(.cvh-atout__num) { font-size: 15.5px; line-height: 1.72; color: rgba(255, 255, 255, 0.74); }
.wp-site-blocks .cvh-coll .cvh-atout > p:not(.cvh-atout__num) { margin-block-start: 14px; }
/* colonne de droite : panneau de verre, items repartis sur TOUTE la hauteur -> zero vide */
.cvh-coll .cvh-conformite {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	padding: 30px 26px 32px;
	background: rgba(7, 12, 61, 0.55);
	-webkit-backdrop-filter: blur(14px) saturate(1.25);
	backdrop-filter: blur(14px) saturate(1.25);
	border: 1px solid rgba(86, 181, 235, 0.26);
	box-shadow: 0 24px 56px rgba(0, 2, 30, 0.42);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cvh-coll .cvh-conformite { background: rgba(7, 12, 61, 0.94); }
}
.wp-site-blocks .cvh-coll .cvh-conformite > * { margin-block: 0; }
.cvh-coll p.cvh-conformite__titre {
	flex: 0 0 auto;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	padding-bottom: 18px;
	border-bottom: 1px solid rgba(86, 181, 235, 0.26);
}
/* `space-between` repartissait l espace ENTRE des items de hauteurs inegales : les filets
   tombaient a des intervalles differents (defaut signale par le client). Parade : chaque
   item prend la MEME part de hauteur (flex: 1 1 0) et centre son texte -> filets reguliers,
   et la colonne reste remplie de haut en bas. */
.cvh-coll .cvh-conformite__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	/* le bloc liste du coeur pose une gouttiere de 8px : elle decentrait les filets
	   (12px sous le texte du dessus, 20px au-dessus du suivant) */
	gap: 0;
	min-height: 0;
}
.cvh-coll .cvh-conformite__liste li {
	position: relative;
	/* le coeur pose `:root :where(.wp-block-list li){margin-top:.5rem}` : 8px qui decentraient
	   les filets. Neutralise ici en (0,2,0). */
	margin-block: 0;
	flex: 1 1 0;
	display: flex;
	align-items: center;
	min-height: 56px;
	padding: 12px 0 12px 30px;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.88);
	border-bottom: 1px solid rgba(86, 181, 235, 0.14);
}
.cvh-coll .cvh-conformite__liste li:last-child { border-bottom: 0; }
.cvh-coll .cvh-conformite__liste li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 15px;
	height: 15px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%23B9BDE2'%3E%3Cpath d='M504 256c0 137-111 248-248 248S8 393 8 256 119 8 256 8s248 111 248 248zM227.3 387.3l184-184c6.2-6.2 6.2-16.4 0-22.6l-22.6-22.6c-6.2-6.2-16.4-6.2-22.6 0L216 308.1l-70.1-70.1c-6.2-6.2-16.4-6.2-22.6 0l-22.6 22.6c-6.2 6.2-6.2 16.4 0 22.6l104 104c6.2 6.2 16.4 6.2 22.6 0z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
}
@media (max-width: 900px) {
	.cvh-coll .cvh-atouts { grid-template-columns: 1fr; gap: 22px; }
	.cvh-coll .cvh-atout { padding: 24px 22px 26px 68px; }
	.cvh-coll p.cvh-atout__num { left: 22px; top: 26px; }
	.cvh-coll .cvh-conformite { padding: 26px 22px 28px; }
	.cvh-coll .cvh-conformite__liste { gap: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.cvh-coll .cvh-atout { transition: none !important; }
	.cvh-coll .cvh-atout:hover { transform: none; }
}

/* ============================================================================
   KIT .cvb-* - « Budget et organisation d un 14 juillet en commune » (page 128)
   Conventions : neutralisation blockGap en (0,3,0), redeclaration des marges en
   (0,4,0) ou plus - jamais l inverse. Angles droits. Aucune couleur de marque en
   texte sur fond sombre (le degrade va sur les filets et les pictos).
   ============================================================================ */

/* ---------- Section ---------- */
.cvb { position: relative; overflow: hidden; }
.cvb::before {
	content: ""; position: absolute; inset: -20% -10%; z-index: 0; pointer-events: none;
	background:
		radial-gradient(46% 38% at 18% 12%, rgba(12, 103, 222, 0.34), transparent 68%),
		radial-gradient(40% 34% at 84% 4%, rgba(86, 181, 235, 0.20), transparent 70%),
		radial-gradient(52% 44% at 72% 96%, rgba(12, 103, 222, 0.20), transparent 72%);
	animation: cvbMesh 26s ease-in-out infinite alternate;
}
.cvb::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	opacity: 0.5; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
}
@keyframes cvbMesh {
	from { transform: translate3d(0, 0, 0) scale(1); }
	to   { transform: translate3d(-2.5%, 1.5%, 0) scale(1.06); }
}
.cvb > .cvh-int, .cvb > .cvb-bande { position: relative; z-index: 1; }

/* (0,6,0) : la couture `.cvh-sec.cvh-coll + .cvh-sec.cvh-coll > .cvh-int` vaut (0,5,0) */
.wp-site-blocks .cvh-sec.cvh-coll.cvb > .cvh-int.cvb-int-a { padding-bottom: 88px; }
.wp-site-blocks .cvh-sec.cvh-coll.cvb > .cvh-int.cvb-int-b { padding-top: 0; }

/* ---------- Neutralisation du blockGap du coeur, puis redeclarations ---------- */
.wp-site-blocks .cvb > * { margin-block: 0; }
.wp-site-blocks .cvb-tete > *, .wp-site-blocks .cvb-frise > *,
.wp-site-blocks .cvb-tete__col > *, .wp-site-blocks .cvb-baro > *,
.wp-site-blocks .cvb-baro__tete > *, .wp-site-blocks .cvb-baro__rails > *,
.wp-site-blocks .cvb-jauge > *, .wp-site-blocks .cvb-jauge__tete > *,
.wp-site-blocks .cvb-baro__axe > *, .wp-site-blocks .cvb-baro__pied > *,
.wp-site-blocks .cvb-carte > *, .wp-site-blocks .cvb-cle > *,
.wp-site-blocks .cvb-note > *, .wp-site-blocks .cvb-note__bas > * { margin-block: 0; }
.wp-site-blocks .cvb .cvb-note__jetons li { margin-block: 0; }

.wp-site-blocks .cvh-coll .cvh-int > .cvb-tete  { margin-block: 0 88px; }
.wp-site-blocks .cvh-coll .cvh-int > .cvb-frise { margin-block: -30px 0; }
.wp-site-blocks .cvh-coll .cvh-int > .cvb-note  { margin-block: 56px 0; }

/* ---------- Rangee A : en-tete et barometre ---------- */
.cvb .cvb-tete {
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
	gap: 64px; align-items: stretch;
}
.cvb .cvb-tete__col { display: flex; flex-direction: column; min-width: 0; }

.cvb p.cvb-eyebrow {
	display: inline-flex; align-items: center; gap: 12px; align-self: flex-start;
	padding: 9px 16px 9px 13px;
	font-size: 11.5px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #DCDDEF;
	background: linear-gradient(135deg, rgba(86, 181, 235, 0.16), rgba(12, 103, 222, 0.08));
	border: 1px solid rgba(86, 181, 235, 0.34);
	-webkit-backdrop-filter: blur(10px) saturate(150%); backdrop-filter: blur(10px) saturate(150%);
}
.cvb p.cvb-eyebrow::before {
	content: ""; display: block; flex: 0 0 auto; width: 7px; height: 7px;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	box-shadow: 0 0 12px rgba(86, 181, 235, 0.9);
	animation: cvbPuls 2.8s ease-in-out infinite;
}
@keyframes cvbPuls { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.45; transform: scale(0.72); } }
.wp-site-blocks .cvb .cvb-tete__col > p.cvb-eyebrow { margin-block: 0 26px; }

.cvb .cvb-titre {
	letter-spacing: -0.01em; color: #FFFFFF; text-align: left;
}
.cvb .cvb-titre::after {
	content: ""; display: block; width: 88px; height: 3px; margin: 22px 0 0;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
}
.wp-site-blocks .cvb .cvb-tete__col > .cvb-titre { margin-block: 0 22px; }

.cvb p.cvb-chapo { font-size: var(--cv2-t5); line-height: 1.66; color: #CED0EB; }
.wp-site-blocks .cvb .cvb-tete__col > p.cvb-chapo { margin-block: 0 34px; }

/* repere de delai, ancre en bas de colonne : le pied est occupe quelle que soit la hauteur */
.cvb .cvb-cle {
	display: flex; align-items: center; gap: 18px;
	padding-top: 26px; border-top: 1px solid rgba(86, 181, 235, 0.22);
}
.wp-site-blocks .cvb .cvb-tete__col > .cvb-cle { margin-block: auto 0; }
.cvb p.cvb-cle__nb {
	flex: 0 0 auto; font-size: 34px; font-weight: 800; line-height: 1; letter-spacing: -0.02em;
	background: linear-gradient(90deg, #56B5EB, #F3F4F9);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.cvb p.cvb-cle__txt { font-size: 13.5px; line-height: 1.55; color: #CED0EB; }
.cvb p.cvb-cle__txt strong {
	display: block; margin-bottom: 5px;
	font-size: 11.5px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: #56B5EB;
}

/* ---------- Le barometre ---------- */
.cvb .cvb-baro {
	position: relative; display: flex; flex-direction: column; min-width: 0;
	margin-bottom: -34px; padding: 34px 36px 30px;
	border: 1px solid rgba(86, 181, 235, 0.30);
	background-color: #050A2A;
	background-image:
		linear-gradient(158deg, rgba(86, 181, 235, 0.17), rgba(7, 12, 61, 0.35) 46%, rgba(0, 2, 30, 0.55)),
		radial-gradient(90% 70% at 88% 6%, rgba(12, 103, 222, 0.30), transparent 70%);
	-webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%);
	box-shadow: 0 26px 70px rgba(0, 2, 30, 0.62);
}
.cvb .cvb-baro::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(203, 206, 242, 0.85), transparent);
}
.cvb .cvb-baro::after {
	content: ""; position: absolute; left: 0; top: 0; width: 40%; height: 58%; pointer-events: none;
	background: linear-gradient(150deg, rgba(255, 255, 255, 0.09), transparent 62%);
}
.cvb .cvb-baro__tete {
	display: flex; align-items: baseline; justify-content: space-between; gap: 20px; flex-wrap: wrap;
	padding-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}
.wp-site-blocks .cvb .cvb-baro > .cvb-baro__tete { margin-block: 0 8px; }
.cvb p.cvb-baro__titre { font-size: 13px; font-weight: 700; letter-spacing: 0.19em; text-transform: uppercase; color: #FFFFFF; }
.cvb p.cvb-baro__unite { font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: #56B5EB; }

.cvb .cvb-baro__rails { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; padding-top: 6px; }
.cvb .cvb-baro__rails::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 26px; pointer-events: none;
	background-image:
		linear-gradient(90deg, transparent calc(31.25% - 1px), rgba(255, 255, 255, 0.12) 31.25%, transparent calc(31.25% + 1px)),
		linear-gradient(90deg, transparent calc(62.5% - 1px), rgba(255, 255, 255, 0.12) 62.5%, transparent calc(62.5% + 1px)),
		linear-gradient(90deg, transparent calc(93.75% - 1px), rgba(255, 255, 255, 0.12) 93.75%, transparent calc(93.75% + 1px));
}
.cvb .cvb-jauge { position: relative; flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; padding: 15px 0; }
.cvb .cvb-jauge + .cvb-jauge { border-top: 1px solid rgba(255, 255, 255, 0.07); }
.cvb .cvb-jauge__tete { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; }
.cvb p.cvb-jauge__lib { font-size: 14px; font-weight: 600; line-height: 1.4; color: #EDEEFB; }
.cvb p.cvb-jauge__val { flex: 0 0 auto; font-size: 15.5px; font-weight: 700; color: #FFFFFF; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* le rail est un core/separator : le coeur le stylise, d ou (0,3,0) et des valeurs explicites */
.wp-site-blocks .cvb .cvb-jauge__rail {
	position: relative; width: 100%; height: 13px; opacity: 1;
	border: 1px solid rgba(255, 255, 255, 0.09);
	background: rgba(255, 255, 255, 0.075);
}
.wp-site-blocks .cvb .cvb-jauge > .cvb-jauge__rail { margin-block: 11px 0; }
.cvb .cvb-jauge__rail::before {
	content: ""; position: absolute; top: -1px; bottom: -1px;
	left: var(--cvb-d); width: calc(var(--cvb-f) - var(--cvb-d));
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	box-shadow: 0 0 22px rgba(86, 181, 235, 0.45);
	transform-origin: left center; transform: scaleX(1);
}
.cvb .cvb-jauge__rail::after {
	content: ""; position: absolute; top: -1px; bottom: -1px; left: calc(var(--cvb-f) - 2px); width: 2px;
	background: #F3F4F9; box-shadow: 0 0 10px rgba(243, 244, 253, 0.9);
}
/* Grille de budget UNIQUE sur tout le site (client, 2026-08-24) :
   2 500-5 000 / 5 000-20 000 / 20 000-50 000 euros. Axe 0-50 000, lineaire.
   Les variantes .cvb--fin et .cvb--ceremonie sont supprimees : une seule
   grille, donc un seul jeu de bornes. Le modificateur --ouvert aussi : le
   troisieme palier est desormais FERME a 50 000, il n a plus de fin ouverte. */
.cvb .cvb-jauge:nth-of-type(1) .cvb-jauge__rail { --cvb-d: 5%;  --cvb-f: 10%; }
.cvb .cvb-jauge:nth-of-type(2) .cvb-jauge__rail { --cvb-d: 10%; --cvb-f: 40%; }
.cvb .cvb-jauge:nth-of-type(3) .cvb-jauge__rail { --cvb-d: 40%; --cvb-f: 100%; }

@media (min-width: 1181px) { .cvb .cvb-jauge { flex: 1 1 0; min-height: 82px; } }

/* L axe porte trois graduations : 0, la moitie, le maximum. space-between
   aligne les BORDS, pas les centres : la graduation mediane tombait a 42,3%
   au lieu de 50% (24px de decalage a 390, 45px a 1366). On la sort du flux et
   on la centre exactement ; les deux autres restent collees aux extremites. */
.cvb .cvb-baro__axe { display: flex; justify-content: space-between; position: relative; }
.cvb .cvb-baro__axe p:nth-child(2) { position: absolute; left: 50%; transform: translateX(-50%); }
.wp-site-blocks .cvb .cvb-baro__rails > .cvb-baro__axe { margin-block: 10px 0; }
.cvb .cvb-baro__axe p { font-size: 11px; font-weight: 600; letter-spacing: 0.09em; color: #B5B8DD; font-variant-numeric: tabular-nums; }

.cvb .cvb-baro__pied {
	display: flex; align-items: center; gap: 16px; padding: 16px 18px;
	border: 1px solid rgba(86, 181, 235, 0.30);
	background: linear-gradient(120deg, rgba(86, 181, 235, 0.14), rgba(12, 103, 222, 0.05));
}
.wp-site-blocks .cvb .cvb-baro > .cvb-baro__pied { margin-block: 20px 0; }
.cvb p.cvb-baro__pied-txt { font-size: 13.5px; line-height: 1.55; color: #E3E5F9; }
.cvb p.cvb-baro__pied-txt strong { color: #FFFFFF; font-weight: 700; }
.cvb p.cvb-baro__x {flex: 0 0 auto; margin-left: auto; font-size: 15px; font-weight: 800; letter-spacing: -0.02em;
	background: linear-gradient(90deg, #56B5EB, #F3F4F9);
	-webkit-background-clip: text; background-clip: text; color: transparent; line-height: 1.7;}

/* ---------- Bande-horizon : la photo, aucun texte par-dessus ---------- */
.cvb .cvb-bande { position: relative; height: 280px; overflow: hidden; }
.cvb .cvb-bande img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
.cvb .cvb-bande::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background:
		linear-gradient(180deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.22) 30%, rgba(0, 0, 0, 0.26) 62%, rgba(0, 0, 0, 0.90) 100%),
		linear-gradient(90deg, rgba(0, 0, 0, 0.72), transparent 26%, transparent 74%, rgba(0, 0, 0, 0.72));
}
.cvb .cvb-bande::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; z-index: 2;
	background-image:
		linear-gradient(90deg, transparent, #F3F4F9, transparent),
		linear-gradient(90deg, rgba(86, 181, 235, 0), rgba(86, 181, 235, 0.75) 18%, rgba(86, 181, 235, 0.75) 82%, rgba(86, 181, 235, 0));
	background-size: 220px 2px, 100% 2px;
	background-repeat: no-repeat, no-repeat;
	background-position: -220px 0, 0 0;
	animation: cvbCourse 7s linear infinite;
}
@keyframes cvbCourse { from { background-position: -220px 0, 0 0; } to { background-position: 100% 0, 0 0; } }

/* ---------- Rangee B : la frise des trois reperes ---------- */
.cvb .cvb-frise { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.cvb .cvb-carte {
	position: relative; z-index: 1; display: flex; flex-direction: column; min-width: 0;
	padding: 58px 30px 28px;
	border: 1px solid rgba(86, 181, 235, 0.22);
	background: linear-gradient(165deg, rgba(86, 181, 235, 0.085), rgba(0, 2, 30, 0.42));
	-webkit-backdrop-filter: blur(12px) saturate(140%); backdrop-filter: blur(12px) saturate(140%);
	transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.45s ease, box-shadow 0.45s ease;
}
.cvb .cvb-carte::before {
	content: ""; position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity 0.45s ease;
	background: radial-gradient(280px circle at var(--cvh-mx, 50%) var(--cvh-my, 0%), rgba(86, 181, 235, 0.20), transparent 70%);
}
.cvb .cvb-carte:hover { transform: translateY(-6px); border-color: rgba(86, 181, 235, 0.62); box-shadow: 0 30px 60px rgba(0, 2, 30, 0.6); }
.cvb .cvb-carte:hover::before { opacity: 1; }

.cvb p.cvb-carte__num {
	position: absolute; top: -19px; left: 28px; display: inline-flex; align-items: center; gap: 10px;
	padding: 6px 14px; background: #070C3D; border: 1px solid rgba(86, 181, 235, 0.42);
	font-size: 15px; font-weight: 800; letter-spacing: 0.06em; font-variant-numeric: tabular-nums; color: #FFFFFF;
}
.cvb p.cvb-carte__num strong {
	font-weight: 800;
	background: linear-gradient(90deg, #56B5EB, #DCDDEF);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.cvb p.cvb-carte__num::before { content: ""; display: block; flex: 0 0 auto; width: 17px; height: 17px; background: no-repeat center/contain; }
.cvb .cvb-carte:nth-of-type(1) p.cvb-carte__num::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BCBFE4' stroke-width='1.6'%3E%3Cpath d='M3 7h18v10H3zM3 10h18M7 14h3'/%3E%3C/svg%3E"); }
.cvb .cvb-carte:nth-of-type(2) p.cvb-carte__num::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BCBFE4' stroke-width='1.6'%3E%3Cpath d='M4 6h16v14H4zM4 10h16M8 3v4M16 3v4M12 14h4'/%3E%3C/svg%3E"); }
.cvb .cvb-carte:nth-of-type(3) p.cvb-carte__num::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BCBFE4' stroke-width='1.6'%3E%3Cpath d='M12 3.5c2.4 3 4.6 5.2 4.6 8.2a4.6 4.6 0 1 1-9.2 0c0-3 2.2-5.2 4.6-8.2z'/%3E%3Cpath d='M4 20l16-16'/%3E%3C/svg%3E"); }

.cvb .cvb-carte__titre { color: #FFFFFF; text-align: left; }
.wp-site-blocks .cvb .cvb-carte > .cvb-carte__titre { margin-block: 0 14px; }
.cvb .cvb-carte__titre::after { content: none; }
.cvb p.cvb-carte__txt { font-size: 15px; line-height: 1.7; color: #C7C9E6; }
.cvb p.cvb-carte__pied {
	display: flex; align-items: center; gap: 11px; padding-top: 22px;
	font-size: 11.5px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: #56B5EB;
}
.wp-site-blocks .cvb .cvb-carte > p.cvb-carte__pied { margin-block: auto 0; }
.cvb p.cvb-carte__pied::after { content: ""; display: block; flex: 1 1 auto; height: 1px; background: linear-gradient(90deg, rgba(86, 181, 235, 0.55), transparent); }

/* ---------- Note de source : mention et facteurs en jetons ---------- */
.cvb .cvb-note {
	position: relative; padding: 30px 34px 32px;
	border: 1px solid rgba(86, 181, 235, 0.26);
	background: linear-gradient(150deg, rgba(86, 181, 235, 0.11), rgba(0, 2, 30, 0.42));
	-webkit-backdrop-filter: blur(12px) saturate(140%); backdrop-filter: blur(12px) saturate(140%);
}
.cvb .cvb-note::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(203, 206, 242, 0.8), transparent);
}
.cvb p.cvb-note__phrase { position: relative; padding-left: 38px; font-size: 15px; line-height: 1.7; color: #EDEEFB; }
.cvb p.cvb-note__phrase strong { color: #FFFFFF; font-weight: 700; }
.cvb p.cvb-note__phrase::before {
	content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px;
	background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A4A8DB' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v6M12 7.6v.9'/%3E%3C/svg%3E");
}
.wp-site-blocks .cvb .cvb-note > p.cvb-note__phrase { margin-block: 0 22px; }
.cvb .cvb-note__bas {
	display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
	padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.cvb p.cvb-note__intro { flex: 0 0 auto; font-size: 11.5px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: #56B5EB; }
.cvb .cvb-note__jetons { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; flex: 1 1 320px; }
.cvb .cvb-note__jetons li {
	padding: 8px 14px; font-size: 13px; font-weight: 600; color: #E3E5F9;
	border: 1px solid rgba(86, 181, 235, 0.30); background: rgba(86, 181, 235, 0.07);
	transition: border-color 0.35s ease, background-color 0.35s ease, transform 0.35s ease;
}
.cvb .cvb-note__jetons li:hover { border-color: rgba(86, 181, 235, 0.7); background: rgba(86, 181, 235, 0.15); transform: translateY(-2px); }

/* ---------- Revelation : l etat de repos ne masque RIEN ---------- */
@keyframes cvbBarre { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.cvb .cvb-baro.cvh-vu .cvb-jauge__rail::before { animation: cvbBarre 1.05s cubic-bezier(0.22, 0.61, 0.36, 1) backwards; }
.cvb .cvb-baro.cvh-vu .cvb-jauge:nth-of-type(2) .cvb-jauge__rail::before { animation-delay: 0.13s; }
.cvb .cvb-baro.cvh-vu .cvb-jauge:nth-of-type(3) .cvb-jauge__rail::before { animation-delay: 0.26s; }

@media (prefers-reduced-motion: reduce) {
	.cvb::before, .cvb p.cvb-eyebrow::before, .cvb .cvb-bande::after,
	.cvb .cvb-baro.cvh-vu .cvb-jauge__rail::before { animation: none !important; }
	.cvb .cvb-carte, .cvb .cvb-note__jetons li { transition: none !important; }
	.cvb .cvb-carte:hover { transform: none; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cvb .cvb-carte { background: linear-gradient(165deg, rgba(86, 181, 235, 0.10), rgba(0, 2, 30, 0.92)); }
	.cvb .cvb-note { background: linear-gradient(150deg, rgba(86, 181, 235, 0.11), rgba(0, 2, 30, 0.92)); }
}

/* ---------- Tablette ---------- */
@media (max-width: 1180px) {
	.cvb .cvb-tete { grid-template-columns: 1fr; gap: 44px; }
	.cvb .cvb-baro { margin-bottom: 0; }
	.cvb .cvb-bande { height: 225px; }
	.wp-site-blocks .cvh-coll .cvh-int > .cvb-tete { margin-block: 0 64px; }
	.cvb .cvb-frise { grid-template-columns: 1fr; gap: 38px; }
	.cvb .cvb-carte {
		display: grid; grid-template-columns: minmax(0, 268px) minmax(0, 1fr);
		column-gap: 38px; grid-template-areas: "n x" "t x" "p x"; align-content: start;
		padding: 46px 28px 28px;
	}
	.cvb p.cvb-carte__num {
		position: static; grid-area: n; flex-direction: column; align-items: flex-start; gap: 16px;
		padding: 0; border: 0; background: none; font-size: 32px; letter-spacing: 0.02em;
	}
	.wp-site-blocks .cvb .cvb-carte > p.cvb-carte__num { margin-block: 0 22px; }
	.cvb p.cvb-carte__num::before { width: 54px; height: 54px; }
	.cvb .cvb-carte__titre { grid-area: t; }
	.wp-site-blocks .cvb .cvb-carte > .cvb-carte__titre { margin-block: 0; }
	.cvb p.cvb-carte__txt { grid-area: x; }
	.cvb p.cvb-carte__pied { grid-area: p; align-self: start; padding-top: 0; }
	.wp-site-blocks .cvb .cvb-carte > p.cvb-carte__pied { margin-block: 22px 0; }
	.cvb .cvb-note { padding: 24px 22px 26px; }
	.wp-site-blocks .cvh-coll .cvh-int > .cvb-note { margin-block: 48px 0; }
	.cvb .cvb-note__bas { gap: 14px; }
	.wp-site-blocks .cvh-sec.cvh-coll.cvb > .cvh-int.cvb-int-a { padding-bottom: 64px; }
}

/* ---------- Mobile ---------- */
@media (max-width: 760px) {
	.cvb p.cvb-chapo { font-size: 15.5px; }
	.cvb p.cvb-cle__nb { font-size: 30px; }
	.cvb .cvb-baro { padding: 26px 20px 22px; }
	.cvb .cvb-jauge__tete { flex-direction: column; align-items: flex-start; gap: 5px; }
	.cvb p.cvb-jauge__val { font-size: 15px; }
	.cvb .cvb-baro__axe p { font-size: 10px; }
	.cvb .cvb-baro__pied { flex-wrap: wrap; gap: 12px; }
	.cvb p.cvb-baro__x { margin-left: 0; }
	.cvb .cvb-bande { height: 172px; }
	.cvb .cvb-frise { grid-template-columns: 1fr; gap: 40px; }
	.cvb .cvb-carte { display: flex; grid-template-columns: none; padding: 50px 22px 24px; }
	.cvb p.cvb-carte__num {
		position: absolute; top: -19px; left: 22px; flex-direction: row; align-items: center; gap: 10px;
		padding: 6px 14px; border: 1px solid rgba(86, 181, 235, 0.42); background: #070C3D;
		font-size: 15px; letter-spacing: 0.06em;
	}
	.wp-site-blocks .cvb .cvb-carte > p.cvb-carte__num { margin-block: 0; }
	.cvb p.cvb-carte__num::before { width: 17px; height: 17px; }
	.wp-site-blocks .cvb .cvb-carte > .cvb-carte__titre { margin-block: 0 14px; }
	.cvb p.cvb-carte__pied { align-self: auto; padding-top: 22px; }
	.wp-site-blocks .cvb .cvb-carte > p.cvb-carte__pied { margin-block: auto 0; }
	.cvb p.cvb-note__phrase {font-size: 15px; line-height: 1.7;}
	.cvb .cvb-note__jetons { flex-basis: 100%; }
	.wp-site-blocks .cvh-coll .cvh-int > .cvb-note { margin-block: 40px 0; }
}

/* ============================================================================
   BANDEAU DES VILLES CLIENTES - DEFILEMENT CONTINU (2026-08-20)
   Demande client : le meme defilement que sur la page d accueil.
   Le markup Gutenberg n est PAS modifie : accueil.js deplace les figures
   existantes dans deux pistes et pose la classe --defile. Sans JS, ou en
   prefers-reduced-motion, la grille d origine reste affichee telle quelle.
   Le pas de repetition est porte par une MARGE de figure et non par un gap
   de piste : translateX(-50%) tombe alors exactement sur une figure, sans
   le saut d un demi-ecart au bouclage.
   ============================================================================ */
.cvc-conf__grille--defile {
	display: flex;
	flex-direction: column;
	gap: 38px;
	overflow: hidden;
	background: none;
	padding: 20px 0;
}
.cvc-conf__piste {
	display: flex;
	align-items: center;
	width: max-content;
	animation: cvh-defile 78s linear infinite;
	will-change: transform;
}
.cvc-conf__piste--inverse { animation-direction: reverse; }
.cvc-conf__grille--defile:hover .cvc-conf__piste { animation-play-state: paused; }
.cvc-conf__grille--defile figure {
	display: block;
	flex: 0 0 auto;
	margin: 0 118px 0 0;
	padding: 0;
	background: none;
}
.cvc-conf__grille--defile img { height: 112px; width: auto; max-width: none; opacity: 0.88; }
.cvc-conf__grille--defile figure:hover img { opacity: 1; transform: none; }
@media (max-width: 1180px) {
	.cvc-conf__grille--defile figure { margin-right: 96px; }
	.cvc-conf__grille--defile img { height: 96px; }
}
@media (max-width: 760px) {
	.cvc-conf__grille--defile { gap: 28px; }
	.cvc-conf__grille--defile figure { margin-right: 68px; }
	.cvc-conf__grille--defile img { height: 74px; }
}
@media (prefers-reduced-motion: reduce) {
	.cvc-conf__piste { animation: none !important; }
}

/* ============================================================================
   BAROMETRE DE LA PAGE FIN D ANNEE (130) - 2026-08-20
   Les bornes des jauges sont portées par le CSS, pas par le contenu : une page
   dont les montants different doit donc redeclarer ses pourcentages, sinon les
   barres ne correspondent plus aux libelles. Axe 0 a 37 000 EUR.
   2 000-5 000 / 5 000-12 000 / 12 000-35 000 et au-dela.
   ============================================================================ */

/* ============================================================================
   KIT .cvf-* - BENTO DES RENDEZ-VOUS DE DECEMBRE (page 130), 2026-08-20
   Fusion de deux sections en une seule composition, a la demande du client.
   La tuile photo occupe DEUX rangees : sa hauteur est dictee par la colonne
   voisine et l image est en position absolue -> aucun vide structurellement
   possible (motif C2). Les jetons sont pousses en bas par `margin-block: auto`
   -> une tuile plus courte que sa voisine ne se creuse pas au milieu (C3).
   ============================================================================ */
.cvf { position: relative; overflow: hidden; }
.cvf::before {
	content: ""; position: absolute; inset: -15% -8%; z-index: 0; pointer-events: none;
	background:
		radial-gradient(42% 34% at 78% 8%, rgba(12, 103, 222, 0.26), transparent 70%),
		radial-gradient(38% 30% at 12% 92%, rgba(86, 181, 235, 0.14), transparent 72%);
}
.cvf > .cvh-int { position: relative; z-index: 1; }

/* --- neutralisation blockGap : TOUT conteneur a plusieurs enfants, grilles comprises --- */
.wp-site-blocks .cvf-bento > *,
.wp-site-blocks .cvf-tuile > *,
.wp-site-blocks .cvf-tuile__panneau > * { margin-block: 0; }
.wp-site-blocks .cvf .cvf-jetons li { margin-block: 0; }

.cvf-bento {
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
	gap: 20px;
	align-items: stretch;
}
.wp-site-blocks .cvh-coll .cvh-int > .cvf-bento { margin-block: 46px 0; }

/* --- la tuile de verre --- */
.cvf-tuile {
	position: relative; display: flex; flex-direction: column; overflow: hidden;
	padding: 30px 32px;
	background: linear-gradient(158deg, rgba(86, 181, 235, 0.10), rgba(0, 2, 30, 0.55));
	border: 1px solid rgba(86, 181, 235, 0.20);
	-webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
	transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.5s ease, box-shadow 0.5s ease;
}
.cvf-tuile::before {
	content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; z-index: 2;
	background: var(--cv2-degrade);
	transform: scaleX(0.16); transform-origin: left;
	transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cvf-tuile:hover { transform: translateY(-6px); border-color: rgba(86, 181, 235, 0.55); box-shadow: 0 32px 62px rgba(0, 2, 30, 0.62); }
.cvf-tuile:hover::before { transform: scaleX(1); }

/* --- la tuile photo --- */
.cvf-tuile--photo { grid-row: span 2; padding: 0; justify-content: flex-end; background: #00021E; }
.cvf .cvf-tuile__img { position: absolute; inset: 0; margin: 0; z-index: 0; }
.cvf .cvf-tuile__img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 64% 58%; transition: transform 1.1s cubic-bezier(0.22, 0.61, 0.36, 1); }
.cvf-tuile--photo:hover .cvf-tuile__img img { transform: scale(1.055); }
.cvf .cvf-tuile__img::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.10) 0%, rgba(0, 0, 0, 0.42) 46%, rgba(0, 0, 0, 0.62) 100%);
}
.cvf-tuile__panneau {
	position: relative; z-index: 1; margin: 0; padding: 28px 32px 30px;
	background: linear-gradient(180deg, rgba(0, 2, 30, 0.90), rgba(0, 2, 30, 0.97));
	-webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
	border-top: 1px solid rgba(86, 181, 235, 0.22);
}

/* --- typographie --- */
.cvf p.cvf-tuile__quand {
	display: inline-flex; align-items: center; gap: 11px;
	font-size: var(--cv2-t6); font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #DCDDEF;
}
.cvf p.cvf-tuile__quand::before { content: ""; flex: 0 0 auto; width: 22px; height: 2px; background: var(--cv2-degrade); }
.cvf .cvf-tuile__titre { font-size: var(--cv2-t3); font-weight: 700; line-height: 1.24; color: #FFFFFF; text-align: left; }
.cvf .cvf-tuile__titre::after { content: none; }
.cvf .cvf-tuile__titre mark { background: var(--cv2-degrade-titre); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: #56B5EB; }
.wp-site-blocks .cvf .cvf-tuile > .cvf-tuile__titre,
.wp-site-blocks .cvf .cvf-tuile__panneau > .cvf-tuile__titre { margin-block: 14px 14px; }
.cvf .cvf-tuile p { font-size: 15px; line-height: 1.7; color: #CED0EB; }
.wp-site-blocks .cvf .cvf-tuile > p + p,
.wp-site-blocks .cvf .cvf-tuile__panneau > p + p { margin-block-start: 13px; }

/* --- jetons ancres en bas --- */
.cvf .cvf-jetons { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0; }
.wp-site-blocks .cvf .cvf-tuile > .cvf-jetons,
.wp-site-blocks .cvf .cvf-tuile__panneau > .cvf-jetons { margin-block: auto 0; padding-top: 22px; }
.cvf .cvf-jetons li {
	padding: 7px 13px; font-size: 12px; font-weight: 600; letter-spacing: 0.03em; color: #E3E5F9;
	background: rgba(86, 181, 235, 0.09); border: 1px solid rgba(86, 181, 235, 0.24);
}

@media (max-width: 1180px) {
	.cvf-bento { grid-template-columns: 1fr 1fr; }
	.cvf-tuile--photo { grid-row: auto; grid-column: 1 / -1; justify-content: flex-start; }
	.cvf .cvf-tuile__img { position: relative; inset: auto; height: 260px; }
	.cvf .cvf-tuile__img::after { background: linear-gradient(180deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.5)); }
	.cvf-tuile__panneau { background: none; -webkit-backdrop-filter: none; backdrop-filter: none; border-top: 0; }
}
@media (max-width: 760px) {
	.cvf-bento { grid-template-columns: 1fr; }
	.cvf-tuile { padding: 26px 22px; }
	.cvf-tuile--photo { padding: 0; }
	.cvf-tuile__panneau { padding: 24px 22px 26px; }
	.cvf .cvf-tuile__img { height: 210px; }
}
@media (prefers-reduced-motion: reduce) {
	.cvf-tuile, .cvf .cvf-tuile__img img, .cvf-tuile::before { transition: none !important; }
	.cvf-tuile:hover { transform: none; }
	.cvf-tuile--photo:hover .cvf-tuile__img img { transform: none; }
}

/* ⛔ `.cvf .cvf-tuile p` vaut (0,2,1), exactement comme `.cvf p.cvf-tuile__quand`,
   et gagne parce qu il vient apres : l avant-titre sortait a 14,5px EN CAPITALES,
   au-dessus du plafond H6 de la charte, et dans la couleur du corps de texte.
   Redeclaration en (0,3,1), qui passe devant sans ambiguite. */
.cvf .cvf-tuile p.cvf-tuile__quand,
.cvf .cvf-tuile__panneau p.cvf-tuile__quand {
	display: flex; align-items: center; gap: 11px;
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #DCDDEF;
}

/* ============================================================================
   REFLET DE VITRE SUR LES CARTES .cvc-metier - 2026-08-20
   Demande client : un effet miroir tres raffine. Le parti pris n est PAS un
   reflet duplique sous la carte (qui date et cree un vide), mais une SURFACE
   POLIE : arete haute eclairee, bande speculaire diagonale visible AU REPOS,
   et glissement lent du reflet au survol, comme si le regard se deplacait le
   long de la vitre. La bande passe DERRIERE le texte : contraste intact.
   ============================================================================ */
.cvc-metier {
	overflow: hidden;
	background:
		linear-gradient(152deg, rgba(255, 255, 255, 0.055) 0%, rgba(255, 255, 255, 0.012) 34%, rgba(0, 2, 30, 0.30) 100%),
		linear-gradient(165deg, rgba(86, 181, 235, 0.07), rgba(0, 2, 30, 0.4));
	box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.06), inset -1px -1px 0 rgba(0, 0, 0, 0.22);
	transition: border-color 0.55s ease, box-shadow 0.55s ease, transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}
/* l arete haute : le filet de lumiere que renvoie une vitre polie */
.cvc-metier::before {
	content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; z-index: 1; pointer-events: none;
	background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.30) 18%, rgba(219, 221, 245, 0.85) 50%, rgba(255, 255, 255, 0.26) 82%, transparent 100%);
}
/* la bande speculaire : large, tres pale, presente au repos, elle glisse au survol */
.cvc-metier::after {
	content: ""; position: absolute; top: -40%; bottom: -40%; left: -30%; width: 46%; z-index: 1; pointer-events: none;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.05) 38%, rgba(255, 255, 255, 0.10) 50%, rgba(255, 255, 255, 0.04) 62%, rgba(255, 255, 255, 0) 100%);
	transform: translateX(52%) rotate(9deg);
	transition: transform 1.15s cubic-bezier(0.22, 0.61, 0.36, 1);
}
/* le contenu repasse devant le reflet */
.cvc-metier > * { position: relative; z-index: 2; }
.cvc-metier:hover {
	border-color: rgba(86, 181, 235, 0.46);
	box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.10), inset -1px -1px 0 rgba(0, 0, 0, 0.22), 0 26px 52px rgba(0, 2, 30, 0.5);
	transform: translateY(-4px);
}
.cvc-metier:hover::after { transform: translateX(196%) rotate(9deg); }
@media (prefers-reduced-motion: reduce) {
	.cvc-metier, .cvc-metier::after { transition: none !important; }
	.cvc-metier:hover { transform: none; }
	.cvc-metier:hover::after { transform: translateX(52%) rotate(9deg); }
}

/* ============================================================================
   BANDE ENTRE LE HEROS ET LE BANDEAU DE LOGOS - 2026-08-20
   Le blockGap du coeur posait 19px de margin-top sur .cvc-conf : le fond du
   BODY (nuit #070C3D) se voyait en bande saturee sous le heros. Le defaut
   existait depuis le debut mais restait INVISIBLE tant que le voile du heros
   finissait lui aussi en nuit ; le passage au voile noir l a revele.
   Neutralisation de toutes les sections RACINE du silo, pour qu il ne revienne
   pas. Liste explicite : `.wp-block-post-content > *` casserait les ~50 pages
   encore en contenu plat, dont les enfants racine sont des paragraphes.
   ============================================================================ */
.wp-site-blocks .wp-block-post-content > .cvc-conf,
.wp-site-blocks .wp-block-post-content > .cvh-sec,
.wp-site-blocks .wp-block-post-content > .cvh-hero,
.wp-site-blocks .wp-block-post-content > .cvh-bandeau { margin-block: 0; }

/* Logos du bandeau agrandis a la demande du client (3e passe : 58 -> 90 -> 112 -> 132) */
.cvc-conf__grille--defile img { height: 132px; }
.cvc-conf__grille--defile figure { margin-right: 124px; }
.cvc-conf__grille--defile { gap: 40px; }
@media (max-width: 1180px) {
	.cvc-conf__grille--defile img { height: 114px; }
	.cvc-conf__grille--defile figure { margin-right: 104px; }
}
@media (max-width: 760px) {
	.cvc-conf__grille--defile { gap: 30px; }
	.cvc-conf__grille--defile img { height: 86px; }
	.cvc-conf__grille--defile figure { margin-right: 74px; }
}

/* ============================================================================
   KIT .cvk-* - PAGE CONTACT A ONGLETS PAR CIBLE (page 182), 2026-08-20
   Cinq profils, un jeu de champs par profil, un consentement puis le bouton.
   Colonne de droite : telephone, e-mail, adresse, et le deroule apres envoi.

   ⭐ Le basculement des groupes est CSS pur (`:has()` sur des boutons radio) :
   la page reste utilisable sans JavaScript. Si `:has()` n est pas compris, les
   cinq groupes restent AFFICHES - jamais masques : le formulaire fonctionne
   quand meme, et le serveur ne lit que les champs du profil choisi.
   ⛔ `required` n est pose que sur les champs TOUJOURS visibles : un champ
   obligatoire masque bloque l envoi sur une erreur que le visiteur ne voit pas.
   ============================================================================ */

/* ---------- neutralisation blockGap ---------- */
.wp-site-blocks .cvk-cadre > *,
.wp-site-blocks .cvk-aside > *,
.wp-site-blocks .cvk-carte > * { margin-block: 0; }

/* ---------- la grille de la page ---------- */
.cvk-cadre {
	display: grid;
	grid-template-columns: minmax(0, 1.62fr) minmax(0, 0.88fr);
	gap: 30px;
	align-items: start;
}
.wp-site-blocks .cvh-coll .cvh-int > .cvk-cadre { margin-block: 50px 0; }

/* ---------- le panneau du formulaire ---------- */
.cvk {
	position: relative;
	padding: 38px 40px 40px;
	background:
		linear-gradient(154deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.011) 32%, rgba(0, 2, 30, 0.34) 100%),
		linear-gradient(165deg, rgba(86, 181, 235, 0.08), rgba(0, 2, 30, 0.46));
	border: 1px solid rgba(86, 181, 235, 0.22);
	box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.06), inset -1px -1px 0 rgba(0, 0, 0, 0.22);
	-webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
	overflow: hidden;
}
.cvk::before {
	content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; z-index: 2; pointer-events: none;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.28) 16%, rgba(219, 221, 245, 0.85) 50%, rgba(255, 255, 255, 0.24) 84%, transparent);
}
.cvk > * { position: relative; z-index: 1; }

/* ---------- la barre d onglets ---------- */
.cvk-onglets {
	position: relative;
	display: flex;
	gap: 4px;
	padding: 5px;
	background: rgba(0, 2, 30, 0.52);
	border: 1px solid rgba(86, 181, 235, 0.2);
}
.cvk-onglet__radio { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); border: 0; }
.cvk-onglet {
	position: relative; z-index: 1;
	flex: 1 1 0; min-width: 0;
	display: flex; align-items: center; justify-content: center; text-align: center;
	padding: 13px 10px;
	font-size: 13px; font-weight: 600; letter-spacing: 0.04em; line-height: 1.25;
	color: rgba(255, 255, 255, 0.72);
	cursor: pointer;
	transition: color 0.35s ease;
}
.cvk-onglet:hover { color: var(--cv2-blanc, #FFF); }
.cvk-onglet__radio:checked + .cvk-onglet { color: var(--cv2-blanc, #FFF); }
/* repli sans le curseur glissant : l onglet actif porte lui-meme son fond */
.cvk-onglet__radio:checked + .cvk-onglet::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: var(--cv2-degrade-bouton);
}
.cvk-onglet__radio:focus-visible + .cvk-onglet {
	box-shadow: 0 0 0 2px rgba(86, 181, 235, 0.95), 0 0 0 7px rgba(86, 181, 235, 0.22);
}
/* curseur glissant : cinq onglets de largeur egale, donc un simple multiple de 100% */
.cvk-onglets__curseur {
	position: absolute; top: 5px; bottom: 5px; left: 5px;
	width: calc((100% - 10px - 16px) / 5);
	background: var(--cv2-degrade-bouton);
	transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
	pointer-events: none;
	display: none;
}
.cvk-onglets:has(.cvk-onglet__radio:checked) .cvk-onglets__curseur { display: block; }
.cvk-onglets:has(.cvk-onglet__radio:checked) .cvk-onglet__radio:checked + .cvk-onglet::before { content: none; }
.cvk-onglets:has(#cvk-ong-collectivite:checked) .cvk-onglets__curseur { transform: translateX(0); }
.cvk-onglets:has(#cvk-ong-entreprise:checked) .cvk-onglets__curseur { transform: translateX(calc(100% + 4px)); }
.cvk-onglets:has(#cvk-ong-culture:checked) .cvk-onglets__curseur { transform: translateX(calc(200% + 8px)); }
.cvk-onglets:has(#cvk-ong-administration:checked) .cvk-onglets__curseur { transform: translateX(calc(300% + 12px)); }
.cvk-onglets:has(#cvk-ong-autre:checked) .cvk-onglets__curseur { transform: translateX(calc(400% + 16px)); }

/* ---------- les groupes de champs ---------- */
.cvk-groupe { display: block; border: 0; margin: 0; padding: 0; min-width: 0; }
.cvk-form:has(.cvk-onglet__radio:checked) .cvk-groupe { display: none; }
.cvk-form:has(#cvk-ong-collectivite:checked) .cvk-groupe[data-cible="collectivite"],
.cvk-form:has(#cvk-ong-entreprise:checked) .cvk-groupe[data-cible="entreprise"],
.cvk-form:has(#cvk-ong-culture:checked) .cvk-groupe[data-cible="culture"],
.cvk-form:has(#cvk-ong-administration:checked) .cvk-groupe[data-cible="administration"],
.cvk-form:has(#cvk-ong-autre:checked) .cvk-groupe[data-cible="autre"] { display: block; }
.cvk-groupe[hidden] { display: none; }

.cvk-groupe__titre,
.cvk .cvk-commun__titre {
	display: block; float: none; width: auto; padding: 0;
	margin: 30px 0 18px;
	font-size: var(--cv2-t6, 14px); font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #DCDDEF;
}
.cvk .cvk-commun__titre { margin-top: 34px; padding-top: 26px; border-top: 1px solid rgba(86, 181, 235, 0.16); }

/* ---------- champs ---------- */
.cvk-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; }
.cvk .cvk-champ { margin: 0; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.cvk .cvk-champ--large { grid-column: 1 / -1; }
.cvk .cvk-champ label {
	font-size: 13px; font-weight: 600; letter-spacing: 0.02em; color: #E3E5F9;
}
.cvk .cvk-aide { font-weight: 400; color: #9FA2CC; letter-spacing: 0; }
.cvk .cvk-obl { color: #56B5EB; }
.cvk input[type="text"], .cvk input[type="email"], .cvk input[type="tel"], .cvk select, .cvk textarea {
	width: 100%; box-sizing: border-box;
	padding: 12px 14px;
	font-family: inherit; font-size: 14.5px; line-height: 1.5; color: var(--cv2-blanc, #FFF);
	background: rgba(0, 2, 30, 0.55);
	border: 1px solid rgba(86, 181, 235, 0.26);
	border-radius: 0;
	transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
	-webkit-appearance: none; appearance: none;
}
.cvk textarea { resize: vertical; min-height: 128px; }
.cvk select {
	padding-right: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23BCBFE4' stroke-width='2'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 13px center; background-size: 15px;
}
.cvk input::placeholder, .cvk textarea::placeholder { color: #7C8CA8; }
.cvk input:hover, .cvk select:hover, .cvk textarea:hover { border-color: rgba(86, 181, 235, 0.45); }
.cvk input:focus, .cvk select:focus, .cvk textarea:focus {
	outline: none;
	border-color: var(--cv2-ciel, #56B5EB);
	background: rgba(0, 2, 30, 0.72);
	box-shadow: 0 0 0 3px rgba(86, 181, 235, 0.18);
}
/* le pot de miel : hors ecran, jamais display:none (certains robots le detectent) */
.cvk-piege { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* ---------- consentement ---------- */
.cvk-optin {
	display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 13px; align-items: start;
	margin: 26px 0 0; padding: 18px 20px;
	background: rgba(86, 181, 235, 0.06);
	border: 1px solid rgba(86, 181, 235, 0.2);
}
.cvk-optin input[type="checkbox"] {
	width: 20px; height: 20px; margin: 1px 0 0; flex: 0 0 auto;
	-webkit-appearance: none; appearance: none;
	background: rgba(0, 2, 30, 0.7);
	border: 1px solid rgba(86, 181, 235, 0.5);
	cursor: pointer; position: relative;
}
.cvk-optin input[type="checkbox"]:checked { background: var(--cv2-degrade); border-color: transparent; }
.cvk-optin input[type="checkbox"]:checked::after {
	content: ""; position: absolute; left: 6px; top: 2px; width: 5px; height: 10px;
	border: solid #FFF; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.cvk-optin input[type="checkbox"]:focus-visible { box-shadow: 0 0 0 3px rgba(86, 181, 235, 0.35); outline: none; }
.cvk-optin label { font-size: 12.5px; line-height: 1.65; color: #C7C9E6; cursor: pointer; }
.cvk-optin a { color: #56B5EB; }

/* ---------- envoi ---------- */
.cvk-envoi { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin-top: 26px; }
.cvk .cvk-bouton {
	flex: 0 0 auto;
	padding: 15px 34px;
	font-family: inherit; font-size: 14.5px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--cv2-blanc, #FFF);
	background: var(--cv2-degrade-bouton);
	border: 0; border-radius: 0; cursor: pointer;
	transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.35s ease, filter 0.35s ease;
}
.cvk .cvk-bouton:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(12, 103, 222, 0.36); filter: brightness(1.06); }
.cvk .cvk-bouton:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(86, 181, 235, 0.95), 0 0 0 8px rgba(86, 181, 235, 0.22); }
.cvk p.cvk-envoi__note { margin: 0; font-size: 12.5px; color: #9FA2CC; }

/* ---------- messages ---------- */
.cvk-message { padding: 18px 22px; margin: 0 0 26px; border-left: 3px solid; }
.cvk-message--ok { background: rgba(86, 181, 235, 0.1); border-color: var(--cv2-ciel, #56B5EB); }
.cvk-message--err { background: rgba(231, 54, 78, 0.12); border-color: #E7364E; }
.cvk p.cvk-message__titre { margin: 0 0 6px; font-size: 15px; font-weight: 700; color: #FFF; }
.cvk-message p { margin: 0; font-size: 15px; line-height: 1.7; color: #CED0EB; }

/* ---------- colonne des coordonnees ---------- */
.cvk-aside { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 118px; }
.cvk-carte {
	position: relative; overflow: hidden;
	padding: 26px 28px 28px;
	background: linear-gradient(158deg, rgba(86, 181, 235, 0.09), rgba(0, 2, 30, 0.5));
	border: 1px solid rgba(86, 181, 235, 0.2);
	transition: border-color 0.45s ease, transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cvk-carte:hover { border-color: rgba(86, 181, 235, 0.46); transform: translateY(-3px); }
.cvk-carte::before {
	content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
	background: var(--cv2-degrade); transform: scaleX(0.2); transform-origin: left;
	transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cvk-carte:hover::before { transform: scaleX(1); }
.cvk p.cvk-carte__sur,
.cvk-aside p.cvk-carte__sur {
	margin: 0 0 14px;
	font-size: var(--cv2-t6, 14px); font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #DCDDEF;
}
.cvk-aside .cvk-carte__val { margin: 0; font-size: clamp(19px, 1.75vw, 24px); font-weight: 700; line-height: 1.25; color: #FFF; }
.cvk-aside .cvk-carte__val a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(86, 181, 235, 0.45); transition: border-color 0.3s ease, color 0.3s ease; }
.cvk-aside .cvk-carte__val a:hover { color: #56B5EB; border-color: #56B5EB; }
.cvk-aside p.cvk-carte__txt { margin: 10px 0 0; font-size: 15px; line-height: 1.7; color: #B2B5D7; }
.cvk-aside .cvk-carte + .cvk-carte { margin: 0; }
.cvk-aside .cvk-etapes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.cvk-aside .cvk-etapes li {
	position: relative; margin: 0; padding: 12px 0 12px 26px;
	font-size: 13.5px; line-height: 1.6; color: #CED0EB;
}
.cvk-aside .cvk-etapes li + li { border-top: 1px solid rgba(255, 255, 255, 0.07); }
.cvk-aside .cvk-etapes li::before {
	content: ""; position: absolute; left: 0; top: 19px; width: 8px; height: 8px; background: var(--cv2-degrade);
}

@media (max-width: 1180px) {
	.cvk-cadre { grid-template-columns: 1fr; gap: 24px; }
	.cvk-aside { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
	.cvk-aside .cvk-carte:last-child { grid-column: 1 / -1; }
	.cvk { padding: 32px 30px 34px; }
}
@media (max-width: 900px) {
	.cvk-onglets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cvk-onglets__curseur { display: none !important; }
	.cvk-onglets:has(.cvk-onglet__radio:checked) .cvk-onglet__radio:checked + .cvk-onglet::before { content: ""; }
	.cvk-onglet:last-of-type { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
	.cvk-aside { grid-template-columns: 1fr; }
	.cvk { padding: 26px 20px 28px; }
	.cvk-grille { grid-template-columns: 1fr; }
	.cvk-carte { padding: 22px 20px 24px; }
	.cvk .cvk-bouton { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
	.cvk-onglets__curseur, .cvk-carte, .cvk-carte::before, .cvk .cvk-bouton,
	.cvk input, .cvk select, .cvk textarea, .cvk-onglet { transition: none !important; }
	.cvk-carte:hover, .cvk .cvk-bouton:hover { transform: none; }
}

/* ============================================================================
   KIT REALISATIONS (.cvr) - page 180, 2026-08-20
   Grille filtrable de 23 fiches + reperes chiffres + portes vers les disciplines.

   ANTI-VIDE PAR CONSTRUCTION (regle client, cf. C13) :
   la grille compte SIX colonnes de base. Une carte occupe 2 colonnes (3 par
   rangee). Quand un filtre laisse un reste, les dernieres cartes s elargissent :
   reste 2 -> span 3 (deux cartes par rangee), reste 1 -> span 6 (pleine largeur,
   composition horizontale). Aucun etat du filtre ne peut donc produire de trou.
   Le rendu serveur pose l etat a 3 colonnes ; accueil.js recalcule sur le
   nombre REEL de colonnes (2 en tablette, 1 en mobile) et apres chaque filtrage.

   TAILLE DES TITRES : le H3 vaut la taille de vignette dans une carte etroite
   (~390px) et reprend --cv2-t3 en format demi (~710px) et large (~1420px).
   C est une regle de CONTEXTE, la meme exception que .cvh-etape__titre.
   ============================================================================ */

.cvr { display: block; }

/* ---------- Neutralisation du blockGap du coeur, puis redeclarations ---------- */
.wp-site-blocks .cvr > *,
.wp-site-blocks .cvr-filtres > *,
.wp-site-blocks .cvr-grille > *,
.wp-site-blocks .cvr-carte > *,
.wp-site-blocks .cvr-carte__vue > *,
.wp-site-blocks .cvr-carte__corps > *,
.wp-site-blocks .cvr-carte__jetons > *,
.wp-site-blocks .cvr-reperes > *,
.wp-site-blocks .cvr-repere > *,
.wp-site-blocks .cvr-portes > *,
.wp-site-blocks .cvr-porte > * { margin-block: 0; }

/* ---------- Barre de filtres ---------- */
.cvr .cvr-filtres {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
	gap: 10px; margin-block: 0 14px; padding: 0;
}
.cvr .cvr-filtre {
	position: relative; display: inline-flex; align-items: center; gap: 9px;
	min-height: 44px; padding: 12px 18px;
	background: rgba(255, 255, 255, .045);
	border: 1px solid rgba(255, 255, 255, .17);
	color: #E3E5F7; font-family: Montserrat, sans-serif; font-size: 13.5px;
	font-weight: 600; line-height: 1; letter-spacing: .02em;
	cursor: pointer; border-radius: 0; -webkit-appearance: none; appearance: none;
	transition: background .25s ease, border-color .25s ease, color .25s ease, transform .25s ease;
}
.cvr .cvr-filtre::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	transform: scaleX(0); transform-origin: left center; transition: transform .32s ease;
}
.cvr .cvr-filtre:hover { background: rgba(255, 255, 255, .09); border-color: rgba(86, 181, 235, .5); color: #fff; transform: translateY(-2px); }
.cvr .cvr-filtre:hover::after { transform: scaleX(1); }
.cvr .cvr-filtre:focus { outline: none; }
.cvr .cvr-filtre:focus-visible { outline: none; box-shadow: 0 0 0 2px rgba(86, 181, 235, .9), 0 0 0 7px rgba(86, 181, 235, .2); }
.cvr .cvr-filtre--actif { background: rgba(47, 60, 209, .92); border-color: rgba(86, 181, 235, .66); color: #fff; }
.cvr .cvr-filtre--actif::after { transform: scaleX(1); }
.cvr .cvr-filtre__n {
	font-size: 11.5px; font-weight: 700; letter-spacing: .06em;
	color: #C9CBE8; padding-left: 9px; border-left: 1px solid rgba(255, 255, 255, .2);
}
.cvr .cvr-filtre--actif .cvr-filtre__n { color: rgba(255, 255, 255, .88); border-left-color: rgba(255, 255, 255, .34); }

/* ---------- Compteur d etat ---------- */
.cvr p.cvr-etat {
	margin-block: 0 30px; text-align: center;
	font-family: Montserrat, sans-serif; font-size: 12.5px; font-weight: 600;
	line-height: 1.4; letter-spacing: .14em; text-transform: uppercase; color: #9DA1CC;
}

/* ---------- La grille ---------- */
.cvr .cvr-grille {
	display: grid; grid-template-columns: repeat(6, 1fr); gap: 22px;
	list-style: none; margin: 0; padding: 0;
}
.cvr .cvr-grille > .cvr-item { grid-column: span 2; min-width: 0; }
.cvr .cvr-grille > .cvr-item--demi { grid-column: span 3; }
.cvr .cvr-grille > .cvr-item--large { grid-column: span 6; }
/* A10 : la feuille UA perd face a une regle auteur ; on redeclare explicitement */
.cvr .cvr-grille > .cvr-item[hidden] { display: none; }

/* Entree des cartes apres filtrage. L etat de repos ne masque RIEN (B2) :
   si l animation ne joue pas, la carte reste visible. */
@keyframes cvrParait { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.cvr .cvr-item { opacity: 1; }
.cvr .cvr-item--entre { animation: cvrParait .42s cubic-bezier(.2, .7, .3, 1) backwards; }

/* ---------- La carte ---------- */
.cvr .cvr-carte {
	position: relative; display: flex; flex-direction: column; height: 100%;
	box-sizing: border-box; overflow: hidden;
	background: linear-gradient(180deg, rgba(12, 22, 62, .58), rgba(0, 4, 31, .88));
	border: 1px solid rgba(255, 255, 255, .10);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
	transition: transform .45s cubic-bezier(.2, .7, .3, 1), border-color .45s ease, box-shadow .45s ease;
}
/* Arete haute eclairee (surface polie, motif C12) */
.cvr .cvr-carte::before {
	content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; z-index: 3; pointer-events: none;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5) 30%, rgba(190, 194, 239, .78) 56%, transparent);
	opacity: .5; transition: opacity .45s ease;
}
/* Bande speculaire VISIBLE AU REPOS, qui glisse au survol.
   z-index 1 : elle passe DERRIERE le corps de texte (z-index 2), le contraste
   est donc intact par construction. */
.cvr .cvr-carte::after {
	content: ""; position: absolute; top: -22%; bottom: -22%; left: 0; width: 46%;
	z-index: 1; pointer-events: none;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .10) 48%, transparent);
	transform: translateX(52%) rotate(9deg); transition: transform 1.15s ease;
}
.cvr .cvr-carte:hover, .cvr .cvr-carte:focus-within {
	transform: translateY(-6px); border-color: rgba(86, 181, 235, .38);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 18px 40px rgba(0, 2, 20, .55);
}
.cvr .cvr-carte:hover::before, .cvr .cvr-carte:focus-within::before { opacity: 1; }
.cvr .cvr-carte:hover::after, .cvr .cvr-carte:focus-within::after { transform: translateX(196%) rotate(9deg); }

/* ---------- L image et son voile ---------- */
.cvr .cvr-carte__vue { position: relative; overflow: hidden; flex: 0 0 auto; aspect-ratio: 16 / 10; }
.cvr .cvr-carte__vue .cvr-carte__img {
	position: absolute; inset: 0; width: 100%; height: 100%; display: block;
	object-fit: cover; transform: scale(1.01);
	transition: transform .9s cubic-bezier(.2, .7, .3, 1);
}
/* La signature de la page : le voile se LEVE sur la realisation au survol. */
.cvr .cvr-carte__vue::after {
	content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background: linear-gradient(180deg, rgba(0, 0, 0, .34) 0%, rgba(0, 0, 0, .12) 44%, rgba(0, 0, 0, .74) 100%);
	opacity: 1; transition: opacity .5s ease;
}
.cvr .cvr-carte:hover .cvr-carte__img, .cvr .cvr-carte:focus-within .cvr-carte__img { transform: scale(1.07); }
.cvr .cvr-carte:hover .cvr-carte__vue::after, .cvr .cvr-carte:focus-within .cvr-carte__vue::after { opacity: .58; }

.cvr .cvr-carte__jetons { position: absolute; z-index: 2; left: 14px; bottom: 13px; display: flex; flex-wrap: wrap; gap: 6px; }
.cvr .cvr-carte__jetons .cvr-jeton {
	display: inline-block; padding: 6px 10px; background: rgba(47, 60, 209, .9); color: #fff;
	font-family: Montserrat, sans-serif; font-size: 11.5px; font-weight: 700;
	line-height: 1; letter-spacing: .13em; text-transform: uppercase;
}

/* ---------- Le corps ---------- */
.cvr .cvr-carte__corps {
	position: relative; z-index: 2; display: flex; flex-direction: column;
	flex: 1 1 auto; padding: 20px 20px 22px;
}
.cvr .cvr-carte__corps p.cvr-carte__lieu {
	margin-block: 0 9px; font-family: Montserrat, sans-serif; font-size: 11.5px;
	font-weight: 700; line-height: 1.3; letter-spacing: .16em; text-transform: uppercase; color: #56B5EB;
}
.cvr .cvr-carte__corps h3.cvr-carte__titre {
	margin-block: 0 10px; font-size: var(--cv2-t-vignette); font-weight: 700;
	line-height: 1.25; color: #fff; text-transform: none; overflow-wrap: break-word;
}
.cvr .cvr-carte__corps h3.cvr-carte__titre a { color: inherit; text-decoration: none; }
/* Le lien couvre la carte entiere sans sortir du composant (motif page mere). */
.cvr .cvr-carte__corps h3.cvr-carte__titre a::after { content: ""; position: absolute; inset: 0; z-index: 4; }
.cvr .cvr-carte__corps h3.cvr-carte__titre a:focus { outline: none; }
.cvr .cvr-carte__corps h3.cvr-carte__titre a:focus-visible::after { box-shadow: inset 0 0 0 2px rgba(86, 181, 235, .95); }
.cvr .cvr-carte__corps p.cvr-carte__txt {
	margin-block: 0 16px; font-family: Montserrat, sans-serif; font-size: 15px;
	font-weight: 400; line-height: 1.7; color: #CFD1EA;
}
/* La neutralisation ci-dessus vaut (0,3,0) : cette redeclaration vaut (0,3,1) et gagne. */
.cvr .cvr-carte__corps p.cvr-carte__aller {
	margin-block: auto 0; display: flex; align-items: center; gap: 10px;
	font-family: Montserrat, sans-serif; font-size: 12.5px; font-weight: 700;
	line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: #56B5EB;
}
.cvr .cvr-carte__corps p.cvr-carte__aller::after {
	content: ""; width: 22px; height: 1px; flex: 0 0 auto;
	background: linear-gradient(90deg, #0C67DE, #56B5EB); transition: width .35s ease;
}
.cvr .cvr-carte:hover .cvr-carte__corps p.cvr-carte__aller::after,
.cvr .cvr-carte:focus-within .cvr-carte__corps p.cvr-carte__aller::after { width: 40px; }

/* ---------- Format demi (710px) : le titre reprend sa taille de H3 plein ---------- */
.cvr .cvr-item--demi .cvr-carte__corps h3.cvr-carte__titre { font-size: var(--cv2-t3); }
.cvr .cvr-item--demi .cvr-carte__vue { aspect-ratio: 16 / 9; }
.cvr .cvr-item--demi .cvr-carte__corps { padding: 26px 26px 28px; }

/* ---------- Format large : composition HORIZONTALE (motif C2, zero vide) ---------- */
.cvr .cvr-item--large .cvr-carte { display: grid; grid-template-columns: .46fr .54fr; align-items: stretch; }
.cvr .cvr-item--large .cvr-carte__vue { aspect-ratio: auto; height: 100%; min-height: 320px; }
.cvr .cvr-item--large .cvr-carte__corps { padding: 36px 40px 38px; justify-content: center; }
.cvr .cvr-item--large .cvr-carte__corps h3.cvr-carte__titre { font-size: var(--cv2-t3); }
.cvr .cvr-item--large .cvr-carte__corps p.cvr-carte__txt {font-size: 15px; margin-block: 0 20px; line-height: 1.7;}
.cvr .cvr-item--large .cvr-carte__corps p.cvr-carte__aller { margin-block: 0; }

/* ---------- Reperes chiffres (heros) ---------- */
.cvr-reperes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; list-style: none; margin: 0; padding: 0; }
.cvr-reperes .cvr-repere {
	display: flex; flex-direction: column; gap: 7px; padding: 4px 0 4px 16px;
	border-left: 2px solid transparent;
	border-image: linear-gradient(180deg, #0C67DE, #56B5EB) 1;
}
.cvr-reperes .cvr-repere__n {
	font-family: Montserrat, sans-serif; font-size: clamp(27px, 2.5vw, 36px);
	font-weight: 800; line-height: 1; color: #fff;
}
.cvr-reperes .cvr-repere__l {
	font-family: Montserrat, sans-serif; font-size: 12px; font-weight: 600;
	line-height: 1.4; letter-spacing: .11em; text-transform: uppercase; color: #BCC0EA;
}

/* ---------- Portes vers les disciplines (5 entrees, aucune rangee incomplete) ---------- */
.cvr-portes { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; list-style: none; margin: 0; padding: 0; }
.cvr-portes > .cvr-porte { grid-column: span 2; }
/* Resorption GENERIQUE, valable quel que soit le nombre d entrees (5 aujourd hui) :
   - reste 1 sur 3 colonnes -> la derniere prend la rangee entiere ;
   - reste 2 sur 3 colonnes -> les deux dernieres se partagent la rangee.
   Ajouter ou retirer une discipline ne peut donc pas creer de rangee incomplete. */
.cvr-portes > .cvr-porte:last-child:nth-child(3n + 1) { grid-column: span 6; }
.cvr-portes > .cvr-porte:nth-last-child(2):nth-child(3n + 1),
.cvr-portes > .cvr-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvr-porte { grid-column: span 3; }
.cvr-portes .cvr-porte {
	position: relative; display: flex; flex-direction: column; gap: 10px;
	padding: 26px 24px 26px; box-sizing: border-box;
	background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .11);
	transition: transform .4s ease, border-color .4s ease, background .4s ease;
}
.cvr-portes .cvr-porte::before {
	content: ""; position: absolute; inset: 0 auto 0 0; width: 2px;
	background: linear-gradient(180deg, #0C67DE, #56B5EB);
	transform: scaleY(.28); transform-origin: top center; transition: transform .45s ease;
}
.cvr-portes .cvr-porte:hover { transform: translateY(-5px); border-color: rgba(86, 181, 235, .4); background: rgba(255, 255, 255, .07); }
.cvr-portes .cvr-porte:hover::before { transform: scaleY(1); }
.cvr-portes .cvr-porte h3.cvr-porte__titre {
	margin-block: 0; font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.25;
	color: #fff; text-transform: none; overflow-wrap: break-word;
}
.cvr-portes .cvr-porte h3.cvr-porte__titre a { color: inherit; text-decoration: none; }
.cvr-portes .cvr-porte h3.cvr-porte__titre a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.cvr-portes .cvr-porte h3.cvr-porte__titre a:focus { outline: none; }
.cvr-portes .cvr-porte h3.cvr-porte__titre a:focus-visible::after { box-shadow: inset 0 0 0 2px rgba(86, 181, 235, .95); }
.cvr-portes .cvr-porte p.cvr-porte__txt {
	margin-block: 0; font-family: Montserrat, sans-serif; font-size: 15px;
	font-weight: 400; line-height: 1.7; color: #CFD1EA;
}
.cvr-portes .cvr-porte p.cvr-porte__n {
	margin-block: 0; font-family: Montserrat, sans-serif; font-size: 11.5px; font-weight: 700;
	line-height: 1; letter-spacing: .15em; text-transform: uppercase; color: #56B5EB;
}

/* ---------- Tablette : deux colonnes ---------- */
@media (max-width: 1099px) {
	.cvr .cvr-grille { grid-template-columns: repeat(2, 1fr); gap: 20px; }
	.cvr .cvr-grille > .cvr-item { grid-column: span 1; }
	.cvr .cvr-grille > .cvr-item--demi { grid-column: span 1; }
	.cvr .cvr-grille > .cvr-item--large { grid-column: span 2; }
	.cvr .cvr-item--demi .cvr-carte__corps h3.cvr-carte__titre { font-size: var(--cv2-t-vignette); }
	.cvr .cvr-item--demi .cvr-carte__vue { aspect-ratio: 16 / 10; }
	.cvr .cvr-item--demi .cvr-carte__corps { padding: 20px 20px 22px; }
	.cvr-portes { grid-template-columns: repeat(2, 1fr); }
	.cvr-portes > .cvr-porte,
	.cvr-portes > .cvr-porte:last-child:nth-child(3n + 1),
	.cvr-portes > .cvr-porte:nth-last-child(2):nth-child(3n + 1),
	.cvr-portes > .cvr-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvr-porte { grid-column: span 1; }
	/* Sur deux colonnes, un nombre impair laisse la derniere seule : elle prend la rangee. */
	.cvr-portes > .cvr-porte:last-child:nth-child(odd) { grid-column: span 2; }
}
@media (max-width: 900px) {
	.cvr-reperes { grid-template-columns: repeat(2, 1fr); gap: 14px; }
}
/* Sous 820px la carte large repasse en composition verticale. */
@media (max-width: 820px) {
	.cvr .cvr-item--large .cvr-carte { grid-template-columns: 1fr; }
	.cvr .cvr-item--large .cvr-carte__vue { aspect-ratio: 16 / 10; height: auto; min-height: 0; }
	.cvr .cvr-item--large .cvr-carte__corps { padding: 20px 20px 22px; }
	.cvr .cvr-item--large .cvr-carte__corps h3.cvr-carte__titre { font-size: var(--cv2-t-vignette); }
	.cvr .cvr-item--large .cvr-carte__corps p.cvr-carte__txt {font-size: 15px; margin-block: 0 16px; line-height: 1.7;}
	.cvr .cvr-item--large .cvr-carte__corps p.cvr-carte__aller { margin-block: auto 0; }
}
/* ---------- Mobile : une colonne ---------- */
@media (max-width: 699px) {
	.cvr .cvr-grille { grid-template-columns: 1fr; gap: 18px; }
	.cvr .cvr-grille > .cvr-item,
	.cvr .cvr-grille > .cvr-item--demi,
	.cvr .cvr-grille > .cvr-item--large { grid-column: span 1; }
	.cvr .cvr-filtres { gap: 8px; margin-block: 0 12px; }
	.cvr .cvr-filtre { padding: 11px 14px; font-size: 12.5px; }
	.cvr p.cvr-etat { margin-block: 0 22px; font-size: 11.5px; }
	.cvr-portes { grid-template-columns: 1fr; }
	/* Ecrit a la MEME specificite (0,4,0) que la regle tablette, sinon celle-ci
	   la battrait malgre l ordre des media queries (piege A4). */
	.cvr-portes > .cvr-porte,
	.cvr-portes > .cvr-porte:last-child:nth-child(odd),
	.cvr-portes > .cvr-porte:last-child:nth-child(3n + 1),
	.cvr-portes > .cvr-porte:nth-last-child(2):nth-child(3n + 1),
	.cvr-portes > .cvr-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvr-porte { grid-column: span 1; }
	.cvr-portes .cvr-porte { padding: 22px 20px; }
}

/* ---------- Mouvement reduit ---------- */
@media (prefers-reduced-motion: reduce) {
	.cvr .cvr-carte, .cvr .cvr-carte::before, .cvr .cvr-carte::after,
	.cvr .cvr-carte__img, .cvr .cvr-carte__vue::after, .cvr .cvr-filtre,
	.cvr .cvr-filtre::after, .cvr .cvr-carte__corps p.cvr-carte__aller::after,
	.cvr-portes .cvr-porte, .cvr-portes .cvr-porte::before { transition: none !important; }
	.cvr .cvr-item--entre { animation: none !important; }
	.cvr .cvr-carte:hover, .cvr .cvr-carte:focus-within,
	.cvr-portes .cvr-porte:hover { transform: none; }
	.cvr .cvr-carte:hover .cvr-carte__img, .cvr .cvr-carte:focus-within .cvr-carte__img { transform: scale(1.01); }
	.cvr .cvr-carte::after { transform: translateX(52%) rotate(9deg) !important; }
}

/* ---------- Heros de la page Realisations : troisieme couche de voile ----------
   La photo porte des gerbes tres lumineuses en travers de la zone du titre :
   au canvas, toutes couches composees, le H1 tombait a 2,33 et le surtitre a 4,09.
   Cinq variantes ont ete simulees sur la photo reelle ; retenue, une bande calee
   sur le texte (0,36 de 18% a 66%) qui remonte le H1 a 5,22 et le surtitre a 8,03
   pour la moindre perte d image (luminance moyenne 38 -> 26).
   SCOPEE : les trois autres heros du silo gardent leur voile inchange. */
.cvr-hero.cvh-coll.cvh-hero--page > .wp-block-cover__background {
	background-image:
		linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .36) 18%, rgba(0, 0, 0, .36) 66%, rgba(0, 0, 0, 0) 100%),
		radial-gradient(92% 78%, rgba(0, 0, 0, .58) 0%, rgba(0, 0, 0, .24) 58%, rgba(0, 0, 0, 0) 100%),
		linear-gradient(180deg, rgba(0, 0, 0, .06) 0%, rgba(0, 0, 0, .12) 22%, rgba(0, 0, 0, .28) 46%, rgba(0, 0, 0, .56) 74%, rgba(0, 0, 0, .86) 100%) !important;
}

/* ---------- Bandeau d appel de la page Realisations ----------
   La fusee de drones occupe le centre de l image, exactement sous le texte :
   au canvas, titre et texte tombaient a 4,04 et 4,03. Le voile passe de 0,50 a
   0,58 (titre 5,39, texte 5,36) ; la photo est deja tres sombre, la perte est
   negligeable. Gutenberg ne propose que des paliers de 10, d ou cette regle. */
.cvr-bandeau.cvh-bandeau--cta.cvh-coll > .wp-block-cover__background { opacity: .58; }

/* ============================================================================
   KIT 404 ET RECHERCHE (.cv4) - 2026-08-20
   Deux gabarits du theme enfant : templates/404.html et templates/search.html.

   Ces deux pages sont celles ou le VIDE guette le plus : elles sont courtes par
   nature. La parade est de leur donner un contenu utile - un champ de recherche
   et les six entrees du site - plutot que d etirer une page presque nue.
   Les portes reutilisent le kit .cvr-portes, dont la resorption interdit toute
   rangee incomplete quel que soit le nombre d entrees.
   ============================================================================ */

/* ---------- Neutralisation du blockGap du coeur, puis redeclarations ---------- */
.wp-site-blocks .cv4-actions > *,
.wp-site-blocks .cv4-res > *,
.wp-site-blocks .cv4-res__liste > *,
.wp-site-blocks .cv4-res__item > * { margin-block: 0; }

/* ---------- Titre et chapo (rendus par le shortcode sur la recherche) ---------- */
.cv4-titre {
	margin-block: 0 18px; font-size: var(--cv2-t1); font-weight: 800;
	line-height: 1.08; color: #fff; text-transform: none; overflow-wrap: break-word;
}
.cv4-titre .cv4-titre__terme { color: #56B5EB; }
.cv4-titre .cv4-titre__terme::before { content: "\00ab\00a0"; }
.cv4-titre .cv4-titre__terme::after { content: "\00a0\00bb"; }
.wp-site-blocks p.cv4-chapo {
	margin-block: 0 26px; max-width: 1040px;
	font-family: Montserrat, sans-serif; font-size: var(--cv2-t5); font-weight: 400;
	line-height: 1.66; color: rgba(255, 255, 255, .82);
}

/* ---------- Le champ de recherche (bloc natif core/search) ---------- */
.cv4-recherche { max-width: 620px; margin-block: 0; }
.cv4-recherche .wp-block-search__label {
	display: block; margin-block: 0 10px;
	font-family: Montserrat, sans-serif; font-size: 12.5px; font-weight: 700;
	line-height: 1; letter-spacing: .16em; text-transform: uppercase; color: #56B5EB;
}
.cv4-recherche .wp-block-search__inside-wrapper {
	display: flex; gap: 0; border: 1px solid rgba(255, 255, 255, .22);
	background: rgba(255, 255, 255, .05); padding: 0; border-radius: 0;
	transition: border-color .3s ease, background .3s ease;
}
.cv4-recherche .wp-block-search__inside-wrapper:focus-within {
	border-color: rgba(86, 181, 235, .75); background: rgba(255, 255, 255, .08);
}
.cv4-recherche input.wp-block-search__input {
	flex: 1 1 auto; min-width: 0; min-height: 54px; padding: 14px 18px;
	background: transparent; border: 0; border-radius: 0; color: #fff;
	font-family: Montserrat, sans-serif; font-size: 15.5px; line-height: 1.4;
}
.cv4-recherche input.wp-block-search__input::placeholder { color: rgba(255, 255, 255, .52); }
.cv4-recherche input.wp-block-search__input:focus { outline: none; box-shadow: none; }
.cv4-recherche .wp-block-search__button {
	flex: 0 0 auto; margin: 0; min-height: 54px; padding: 14px 26px;
	background: rgba(47, 60, 209, .95); border: 0; border-radius: 0; color: #fff;
	font-family: Montserrat, sans-serif; font-size: 12.5px; font-weight: 700;
	line-height: 1; letter-spacing: .14em; text-transform: uppercase; cursor: pointer;
	transition: background .3s ease;
}
.cv4-recherche .wp-block-search__button:hover { background: rgba(12, 103, 222, .98); }
.cv4-recherche .wp-block-search__button:focus { outline: none; }
.cv4-recherche .wp-block-search__button:focus-visible {
	outline: none; box-shadow: 0 0 0 2px rgba(86, 181, 235, .9), 0 0 0 7px rgba(86, 181, 235, .2);
}

/* ---------- Ligne d actions sous la recherche ---------- */
.cv4-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-block: 26px 0; }
.cv4-actions p.cv4-retour { margin-block: 0; }
.cv4-actions p.cv4-retour a {
	display: inline-flex; align-items: center; gap: 10px; min-height: 44px;
	font-family: Montserrat, sans-serif; font-size: 12.5px; font-weight: 700;
	line-height: 1; letter-spacing: .14em; text-transform: uppercase;
	color: #56B5EB; text-decoration: none;
}
.cv4-actions p.cv4-retour a::before {
	content: ""; width: 26px; height: 1px; flex: 0 0 auto;
	background: linear-gradient(90deg, #56B5EB, #0C67DE); transition: width .35s ease;
}
.cv4-actions p.cv4-retour a:hover::before { width: 42px; }

/* ---------- Liste des resultats de recherche ----------
   Une LISTE verticale pleine largeur, jamais une grille : aucune rangee
   incomplete n est alors possible, quel que soit le nombre de resultats. */
.cv4-res .cv4-res__liste { display: flex; flex-direction: column; gap: 0; list-style: none; margin: 0; padding: 0; }
.cv4-res .cv4-res__liste > li {
	position: relative; margin: 0; padding: 26px 24px 28px;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	background: rgba(255, 255, 255, .02);
	transition: background .3s ease, padding-left .3s ease;
}
.cv4-res .cv4-res__liste > li:first-child { border-top: 1px solid rgba(255, 255, 255, .1); }
.cv4-res .cv4-res__liste > li::before {
	content: ""; position: absolute; inset: 0 auto 0 0; width: 2px;
	background: linear-gradient(180deg, #0C67DE, #56B5EB);
	transform: scaleY(0); transform-origin: top center; transition: transform .4s ease;
}
.cv4-res .cv4-res__liste > li:hover { background: rgba(255, 255, 255, .055); padding-left: 30px; }
.cv4-res .cv4-res__liste > li:hover::before { transform: scaleY(1); }
.cv4-res h3.cv4-res__titre { margin-block: 0 10px; font-size: var(--cv2-t3); font-weight: 700; line-height: 1.25; color: #fff; text-transform: none; overflow-wrap: break-word; }
.cv4-res h3.cv4-res__titre a { color: inherit; text-decoration: none; }
.cv4-res h3.cv4-res__titre a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.cv4-res h3.cv4-res__titre a:focus { outline: none; }
.cv4-res h3.cv4-res__titre a:focus-visible::after { box-shadow: inset 0 0 0 2px rgba(86, 181, 235, .95); }
.cv4-res p.cv4-res__txt {
	margin-block: 0; max-width: 900px;
	font-family: Montserrat, sans-serif; font-size: 15px; font-weight: 400;
	line-height: 1.7; color: #CFD1EA;
}
.cv4-res .wp-block-query-pagination {
	display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
	margin-block: 34px 0; font-family: Montserrat, sans-serif; font-size: 13.5px; font-weight: 700;
}
.cv4-res .wp-block-query-pagination a { color: #56B5EB; text-decoration: none; }
.cv4-res .wp-block-query-pagination a:hover { color: #fff; }
.cv4-res .wp-block-query-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 44px; min-height: 44px; padding: 0 12px;
	border: 1px solid rgba(255, 255, 255, .16); color: #E3E5F7;
}
.cv4-res .wp-block-query-pagination .page-numbers.current { background: rgba(47, 60, 209, .92); border-color: rgba(86, 181, 235, .6); color: #fff; }

/* ---------- Paliers ---------- */
@media (max-width: 780px) {
	.cv4-recherche .wp-block-search__inside-wrapper { flex-wrap: wrap; }
	.cv4-recherche input.wp-block-search__input { flex: 1 1 100%; }
	.cv4-recherche .wp-block-search__button { flex: 1 1 100%; }
	.wp-site-blocks p.cv4-chapo {font-size: var(--cv2-t5); margin-block: 0 22px; line-height: 1.66;}
	.cv4-res .cv4-res__liste > li { padding: 22px 18px 24px; }
	.cv4-res .cv4-res__liste > li:hover { padding-left: 22px; }
}

/* ---------- Mouvement reduit ---------- */
@media (prefers-reduced-motion: reduce) {
	.cv4-recherche .wp-block-search__inside-wrapper, .cv4-recherche .wp-block-search__button,
	.cv4-res .cv4-res__liste > li, .cv4-res .cv4-res__liste > li::before,
	.cv4-actions p.cv4-retour a::before { transition: none !important; }
	.cv4-res .cv4-res__liste > li:hover { padding-left: 24px; }
}

/* ---------- cv4-correctifs : deux defauts mesures sur le rendu ----------
   1. blockGap, HUITIEME recidive. Dans les gabarits 404 et recherche les
      sections sont enfants directs de <main>, pas d un post-content : la
      parade posee pour les pages ne les couvrait pas, et le fond du body se
      voyait dans un trou de 19px entre le heros et la section. Neutralise par
      une LISTE EXPLICITE de classes de section, et scope a ces deux gabarits.
   2. Le bloc natif de recherche se dimensionne sur son contenu : il sortait a
      381px au lieu des 620px prevus. */
body.error404 .wp-site-blocks main > .cvh-hero,
body.error404 .wp-site-blocks main > .cvh-sec,
body.search .wp-site-blocks main > .cvh-hero,
body.search .wp-site-blocks main > .cvh-sec { margin-block: 0; }
.cvh-hero .cv4-recherche, .cvh-int .cv4-recherche { width: 100%; max-width: 620px; }

/* ---------- Heros des gabarits 404 et recherche : couche de lisibilite ----------
   L image est pourtant tres sombre, mais la lune de drones passe derriere le
   texte : au canvas, H1 3,62, surtitre 4,32 et libelle de recherche 4,31.
   Quatre valeurs simulees ; 0,20 suffit a tout passer (H1 5,29, surtitre 6,17,
   libelle 5,55) en ne coutant que 1,4 point de luminance sur la moitie haute :
   la lune, qui est le sujet, reste intacte. */
.cv4-hero.cvh-coll.cvh-hero--page > .wp-block-cover__background {
	background-image:
		linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .20) 26%, rgba(0, 0, 0, .20) 100%),
		radial-gradient(92% 78%, rgba(0, 0, 0, .58) 0%, rgba(0, 0, 0, .24) 58%, rgba(0, 0, 0, 0) 100%),
		linear-gradient(180deg, rgba(0, 0, 0, .06) 0%, rgba(0, 0, 0, .12) 22%, rgba(0, 0, 0, .28) 46%, rgba(0, 0, 0, .56) 74%, rgba(0, 0, 0, .86) 100%) !important;
}

/* ---------- cv4-extrait-correctif ----------
   core/post-excerpt rend un DIV qui contient un P : la regle ecrite pour un
   p.cv4-res__txt ne matchait pas, et l extrait sortait a 22px en blanc casse.
   On vise donc le conteneur ET son paragraphe interne. */
.cv4-res .cv4-res__liste .cv4-res__txt,
.cv4-res .cv4-res__liste .cv4-res__txt p {
	margin-block: 0; max-width: 900px;
	font-family: Montserrat, sans-serif; font-size: 15px; font-weight: 400;
	line-height: 1.7; color: #CFD1EA;
}
.cv4-res .cv4-res__liste .cv4-res__txt .wp-block-post-excerpt__more-text { margin-block: 10px 0; }

/* ============================================================================
   FICHE DE REALISATION - maquette B "galerie dominante" (v3, 2026-08-21)

   Recadrage client : le heros doit tenir ENTIEREMENT dans le viewport, la
   plaque pleine largeur devient une CARTE CARREE a droite, et le recit cesse
   d etre une colonne centree entouree de vide : deux colonnes, celle de gauche
   collante (slider + partage), l image intercalee des le premier paragraphe.

   Trois principes de fabrication :
   1. le heros est une boite FERMEE - plus aucun chevauchement, et sa typo cede
      sur les ecrans courts (media queries sur la HAUTEUR, pas la largeur) ;
   2. le bandeau collant vit dans une colonne etiree : c est son ENFANT qui est
      sticky, sinon il n aurait aucune course ;
   3. la mosaique du milieu reste dans la colonne de lecture, la mosaique FINALE
      prend toute la largeur. Faire deborder celle du milieu obligerait le
      bandeau collant a passer dessous.
   ============================================================================ */

body.cvs-fiche { --cvs-t1: clamp(34px, 4.9vw, 72px); --cvs-flanc: 31%; background: #000; }
body.cvs-fiche .wp-site-blocks main { margin-block-start: 0; }

/* ---------- Neutralisation du blockGap du coeur ---------- */
body.cvs-fiche .wp-site-blocks main > *,
.wp-site-blocks .cvs-hero__int > *,
.wp-site-blocks .cvs-hero__bas > *,
.wp-site-blocks .cvs-hero__texte > *,
.wp-site-blocks .cvs-carte > *,
.wp-site-blocks .cvs-corps__grille > *,
.wp-site-blocks .cvs-flanc__collant > *,
.wp-site-blocks .cvs-gal > *,
.wp-site-blocks .cvs-int > *,
.wp-site-blocks .cvs-suite__grille > * { margin-block: 0; }

/* ---------- Sections ---------- */
.cvs-sec { position: relative; z-index: 1; padding-block: clamp(70px, 7vw, 112px); }
.cvs-sec--noir { background: #000; }
.cvs-sec--profond { background: #0D124F; }
.cvs-sec + .cvs-sec::before {
	content: ""; position: absolute; left: 50%; top: 0; transform: translateX(-50%);
	width: min(1420px, calc(100% - 48px)); height: 1px;
	background: linear-gradient(90deg, rgba(86, 181, 235, 0), rgba(86, 181, 235, .3) 50%, rgba(86, 181, 235, 0));
}
.cvs-int { width: 100%; max-width: 1420px; margin-inline: auto; padding-inline: 24px; box-sizing: border-box; }

/* ============================ LE HEROS ============================ */
/* Boite fermee : hauteur du viewport, contenu reparti entre haut et bas.
   Rien ne depasse, rien ne chevauche. */
.cvs-hero {
	position: relative; z-index: 2; display: flex; flex-direction: column;
	/* Le header du site est en position sticky : il OCCUPE le flux, donc 100vh
	   faisait deborder le heros d exactement sa hauteur (114px mesures) et la
	   carte de reperes sortait de l ecran. accueil.js publie la hauteur reelle
	   du header dans --cvs-header et la met a jour au redimensionnement. */
	min-height: calc(100vh - var(--cvs-header, 0px));
	min-height: calc(100svh - var(--cvs-header, 0px));
	overflow: hidden; background: #000;
}
.cvs-hero .cvs-hero__cadre { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.cvs-hero .cvs-hero__img {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; object-position: 50% 44%; display: block;
}
/* Valeurs mesurees sur les 23 photos (GD, cadrage cover reproduit) : le titre
   ne descend jamais sous 4,5 et le coeur de l image reste intact. */
.cvs-hero .cvs-hero__degrade {
	position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(180deg, rgba(0, 0, 0, .30) 0%, rgba(0, 0, 0, .06) 14%, rgba(0, 0, 0, .02) 30%, rgba(0, 0, 0, .34) 46%, rgba(0, 0, 0, .78) 64%, rgba(0, 0, 0, .96) 82%, #000 100%);
}
.cvs-hero .cvs-hero__lueur {
	position: absolute; left: 0; right: 0; bottom: -90px; height: 240px; z-index: 1;
	background-size: cover; background-position: 50% 92%; pointer-events: none;
	filter: blur(64px) saturate(1.55); opacity: .42;
	-webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0) 100%);
	mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0) 100%);
}
.cvs-hero .cvs-hero__int {
	position: relative; z-index: 3; display: flex; flex-direction: column;
	justify-content: space-between; flex: 1 1 auto;
	width: 100%; max-width: 1420px; margin-inline: auto;
	padding: 128px 24px 52px; box-sizing: border-box;
}
.cvs-hero .cvs-hero__bas {
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 32px; width: 100%;
}
.cvs-hero .cvs-hero__texte { flex: 1 1 auto; min-width: 0; }

/* Fil d Ariane : il vit sur le haut de la photo, la ou le degrade est faible.
   Il porte donc sa propre plaque, calculee pour tenir sur un pixel blanc pur. */
.cvs-hero .cvs-fil {
	align-self: flex-start; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px;
	padding: 10px 16px; background: rgba(0, 0, 0, .70);
	border: 1px solid rgba(255, 255, 255, .14);
	-webkit-backdrop-filter: blur(10px) saturate(1.3); backdrop-filter: blur(10px) saturate(1.3);
	font-family: Montserrat, sans-serif; font-size: 11.5px; font-weight: 700;
	line-height: 1.4; letter-spacing: .16em; text-transform: uppercase;
}
.cvs-hero .cvs-fil a { color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .4); }
.cvs-hero .cvs-fil a:hover { border-bottom-color: #fff; }
.cvs-hero .cvs-fil span { color: rgba(255, 255, 255, .62); }
.cvs-hero .cvs-fil .cvs-fil__ici { max-width: 44ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.cvs-hero p.cvs-hero__sur {
	display: inline-flex; align-items: center; gap: 14px; margin-block: 0 16px;
	font-family: Montserrat, sans-serif; font-size: 12px; font-weight: 700;
	line-height: 1; letter-spacing: .22em; text-transform: uppercase; color: #fff;
}
.cvs-hero p.cvs-hero__sur::before { content: ""; width: 48px; height: 1px; background: linear-gradient(90deg, rgba(86, 181, 235, 0), var(--cv2-ciel)); }
.cvs-hero h1.cvs-hero__titre {
	margin-block: 0; max-width: none;
	font-size: var(--cvs-t1); font-weight: 800; line-height: 1.04;
	letter-spacing: -.015em; color: #fff; text-transform: none; overflow-wrap: break-word;
	text-shadow: 0 12px 60px rgba(0, 0, 0, .5);
}

/* La carte CARREE de reperes, en bas a droite du viewport. */
.cvs-hero .cvs-carte {
	flex: 0 0 auto; width: clamp(198px, 17.5vw, 248px); aspect-ratio: 1 / 1;
	display: flex; flex-direction: column; justify-content: center; gap: 16px;
	padding: 22px; box-sizing: border-box;
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(255, 255, 255, .17);
	box-shadow: 0 24px 64px rgba(0, 0, 0, .5);
	-webkit-backdrop-filter: blur(18px) saturate(1.5); backdrop-filter: blur(18px) saturate(1.5);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cvs-hero .cvs-carte { background: rgba(4, 8, 34, .92); }
}
.cvs-carte .cvs-carte__item { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cvs-carte .cvs-carte__cle {
	font-family: Montserrat, sans-serif; font-size: 10.5px; font-weight: 700;
	line-height: 1; letter-spacing: .18em; text-transform: uppercase; color: #56B5EB;
}
.cvs-carte .cvs-carte__val {
	font-family: Montserrat, sans-serif; font-size: 15px; font-weight: 600;
	line-height: 1.3; color: #fff; overflow-wrap: break-word;
}

/* Ecrans COURTS : c est la hauteur qui contraint, pas la largeur. La typo et
   les marges cedent pour que tout tienne dans le viewport. */
@media (max-height: 860px) {
	body.cvs-fiche { --cvs-t1: clamp(30px, 3.9vw, 56px); }
	.cvs-hero .cvs-hero__int { padding: 112px 24px 40px; }
	.cvs-hero .cvs-carte { width: clamp(176px, 15.5vw, 214px); padding: 18px; gap: 12px; }
}
@media (max-height: 720px) {
	body.cvs-fiche { --cvs-t1: clamp(27px, 3.2vw, 44px); }
	.cvs-hero .cvs-hero__int { padding: 100px 24px 32px; }
	.cvs-hero .cvs-hero__sur { margin-block: 0 10px; }
	.cvs-hero .cvs-carte { width: clamp(160px, 14vw, 188px); padding: 15px; gap: 9px; }
	.cvs-carte .cvs-carte__val { font-size: 13.5px; }
}

/* ============================ LE CORPS ============================ */
.cvs-corps .cvs-corps__grille {
	display: grid; grid-template-columns: var(--cvs-flanc) minmax(0, 1fr); gap: clamp(30px, 3.6vw, 56px);
}
/* La colonne s etire (align-items par defaut) : c est ce qui donne sa course
   au bandeau collant. C est l ENFANT qui est sticky, jamais la colonne. */
.cvs-corps .cvs-flanc { position: relative; min-width: 0; }
.cvs-corps .cvs-flanc__collant { position: sticky; top: 108px; display: flex; flex-direction: column; gap: 22px; }

/* ---------- Le slider de trois images ---------- */
.cvs-slider { position: relative; }
.cvs-slider .cvs-slider__piste {
	position: relative; list-style: none; margin: 0; padding: 0;
	aspect-ratio: 4 / 3; overflow: hidden; background: #05070F;
	border: 1px solid rgba(255, 255, 255, .1);
}
.cvs-slider .cvs-slider__vue {
	position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden;
	transition: opacity .5s ease, visibility .5s;
}
/* Sans JavaScript, la premiere vue reste visible : la colonne n est jamais vide.
   ATTENTION : `:first-child` pese comme une classe, donc cette regle (0,3,0)
   BAT la classe --actif (0,2,0) et figerait la vue 1. Le JS pose --js sur le
   slider, ce qui rend la main a la vue active a specificite egale, plus bas. */
.cvs-slider .cvs-slider__vue:first-child { opacity: 1; visibility: visible; }
.cvs-slider--js .cvs-slider__vue:first-child { opacity: 0; visibility: hidden; }
/* (0,3,0) comme la regle de repli ci-dessus, et ecrite apres : `:first-child`
   pese comme une classe, une simple `.cvs-slider--js .--actif` (0,2,0) perdait. */
.cvs-slider--js .cvs-slider__vue.cvs-slider__vue--actif { opacity: 1; visibility: visible; }
.cvs-slider .cvs-slider__bouton {
	display: block; width: 100%; height: 100%; padding: 0; margin: 0; border: 0;
	background: none; cursor: zoom-in; position: relative;
}
.cvs-slider .cvs-slider__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cvs-slider .cvs-slider__bouton:focus { outline: none; }
.cvs-slider .cvs-slider__bouton:focus-visible { outline: none; box-shadow: inset 0 0 0 2px rgba(190, 194, 239, .95); }
.cvs-slider .cvs-slider__barre { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.cvs-slider .cvs-slider__fleche {
	width: 40px; height: 40px; flex: 0 0 auto; padding: 0; cursor: pointer;
	background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 0; position: relative; transition: background .3s ease, border-color .3s ease;
}
.cvs-slider .cvs-slider__fleche:hover { background: rgba(47, 60, 209, .9); border-color: rgba(86, 181, 235, .7); }
.cvs-slider .cvs-slider__fleche:focus { outline: none; }
.cvs-slider .cvs-slider__fleche:focus-visible { outline: none; box-shadow: 0 0 0 2px rgba(86, 181, 235, .95); }
.cvs-slider .cvs-slider__fleche::before {
	content: ""; position: absolute; top: 50%; left: 50%; width: 9px; height: 9px;
	border-left: 2px solid #fff; border-bottom: 2px solid #fff;
}
.cvs-slider .cvs-slider__fleche--prec::before { transform: translate(-40%, -50%) rotate(45deg); }
.cvs-slider .cvs-slider__fleche--suiv::before { transform: translate(-60%, -50%) rotate(-135deg); }
.cvs-slider .cvs-slider__points { display: flex; align-items: center; gap: 7px; flex: 1 1 auto; }
.cvs-slider .cvs-slider__point {
	flex: 1 1 auto; height: 2px; min-height: 2px; padding: 12px 0; margin: -12px 0;
	background: none; border: 0; border-radius: 0; cursor: pointer; position: relative;
}
.cvs-slider .cvs-slider__point::before {
	content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px;
	background: rgba(255, 255, 255, .22); transition: background .3s ease;
}
.cvs-slider .cvs-slider__point--actif::before { background: var(--cv2-ciel); }
.cvs-slider .cvs-slider__point:focus { outline: none; }
.cvs-slider .cvs-slider__point:focus-visible::before { box-shadow: 0 0 0 2px rgba(86, 181, 235, .95); }

/* ---------- Repli quand la fiche n a aucune photo ----------
   Deux fiches sur vingt-trois n ont pas de galerie. Le bandeau y porte un appel
   plutot qu un rappel des reperes : ceux-ci sont deja dans la carte du heros,
   quelques centaines de pixels plus haut, et les repeter se voyait. */
.cvs-flanc__appel {
	display: flex; flex-direction: column; gap: 12px; padding: 22px;
	background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .11);
}
.cvs-flanc__appel p.cvs-flanc__appel-t {
	margin-block: 0; font-family: Montserrat, sans-serif; font-size: 15px;
	font-weight: 700; line-height: 1.7; color: #fff;
}
.cvs-flanc__appel p.cvs-flanc__appel-x {
	margin-block: 0; font-family: Montserrat, sans-serif; font-size: 15px;
	font-weight: 400; line-height: 1.7; color: #CFD1EA;
}
.cvs-flanc__appel p.cvs-flanc__appel-l { margin-block: 2px 0; }
.cvs-flanc__appel p.cvs-flanc__appel-l a {
	display: inline-flex; align-items: center; gap: 10px; min-height: 44px;
	font-family: Montserrat, sans-serif; font-size: 12.5px; font-weight: 700;
	line-height: 1; letter-spacing: .14em; text-transform: uppercase;
	color: #56B5EB; text-decoration: none;
}
.cvs-flanc__appel p.cvs-flanc__appel-l a::after {
	content: ""; width: 24px; height: 1px; background: linear-gradient(90deg, #0C67DE, #56B5EB);
	transition: width .35s ease;
}
.cvs-flanc__appel p.cvs-flanc__appel-l a:hover::after { width: 40px; }

/* ---------- Le partage ---------- */
.cvs-partage p.cvs-partage__t {
	margin-block: 0 12px; font-family: Montserrat, sans-serif; font-size: 11px;
	font-weight: 700; line-height: 1; letter-spacing: .18em; text-transform: uppercase; color: #56B5EB;
}
.cvs-partage .cvs-partage__l { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.cvs-partage .cvs-partage__l > li { margin: 0; }
.cvs-partage a, .cvs-partage .cvs-partage__copie {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; cursor: pointer; position: relative;
	background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 0; color: #E3E5F7; transition: background .3s ease, border-color .3s ease, color .3s ease;
}
.cvs-partage a:hover, .cvs-partage .cvs-partage__copie:hover {
	background: rgba(47, 60, 209, .9); border-color: rgba(86, 181, 235, .7); color: #fff;
}
.cvs-partage a:focus, .cvs-partage .cvs-partage__copie:focus { outline: none; }
.cvs-partage a:focus-visible, .cvs-partage .cvs-partage__copie:focus-visible {
	outline: none; box-shadow: 0 0 0 2px rgba(86, 181, 235, .95);
}
.cvs-partage svg { width: 17px; height: 17px; fill: currentColor; display: block; }
.cvs-partage .cvs-partage__dit {
	position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%);
	white-space: nowrap; padding: 5px 9px; background: #3440C5; color: #fff;
	font-family: Montserrat, sans-serif; font-size: 11px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; opacity: 0; pointer-events: none;
	transition: opacity .3s ease;
}
.cvs-partage .cvs-partage__dit--vu { opacity: 1; }

/* ---------- La colonne de lecture ---------- */
.cvs-corps .cvs-lecture { min-width: 0; }
.cvs-corps .cvs-lecture > h2 {
	position: relative; margin-block: 52px 18px; padding-top: 22px;
	font-size: var(--cv2-t2); font-weight: 700; line-height: 1.16;
	color: #fff; text-transform: none; overflow-wrap: break-word;
}
.cvs-corps .cvs-lecture > h2:first-child { margin-block-start: 0; }
.cvs-corps .cvs-lecture > h2::before {
	content: ""; position: absolute; left: 0; top: 0; width: 44px; height: 2px;
	background: linear-gradient(90deg, var(--cv2-ciel), rgba(86, 181, 235, 0));
}
.cvs-corps .cvs-lecture > p {
	margin-block: 0 18px; max-width: 74ch;
	font-family: Montserrat, sans-serif; font-size: 15px; font-weight: 400;
	line-height: 1.7; color: #CFD1EA;
}
.cvs-corps .cvs-lecture > h2 + p { font-size: 18.5px; line-height: 1.7; color: #E3E5F7; }
.cvs-corps .cvs-lecture > p:last-child { margin-block-end: 0; }
.cvs-corps .cvs-lecture > p a { color: #56B5EB; }

/* ============================ LES MOSAIQUES ============================ */
.cvs-corps { overflow-x: clip; }
.cvs-gal { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; list-style: none; margin: 0; padding: 0; }
.cvs-gal > .cvs-gal__item { grid-column: span var(--cvs-c, 2); min-width: 0; }
.cvs-gal--colonne { margin-block: 34px 40px !important; }
.cvs-galfin { margin-top: clamp(52px, 5vw, 84px); }
.cvs-galfin p.cvs-galfin__t {
	margin-block: 0 22px; font-family: Montserrat, sans-serif; font-size: 11.5px;
	font-weight: 700; line-height: 1; letter-spacing: .18em; text-transform: uppercase; color: #56B5EB;
}

.cvs-gal .cvs-gal__vue {
	position: relative; display: block; width: 100%; height: var(--cvs-h, 300px);
	padding: 0; margin: 0; border: 0; background: #05070F;
	border-radius: 0; cursor: zoom-in; overflow: visible;
	transition: transform .5s cubic-bezier(.2, .7, .3, 1);
}
.cvs-gal .cvs-gal__lueur {
	position: absolute; inset: -6% -4%; z-index: 0; pointer-events: none;
	background-size: cover; background-position: 50% 50%;
	filter: blur(38px) saturate(1.6); opacity: 0; transition: opacity .55s ease;
}
.cvs-gal .cvs-gal__img {
	position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; display: block;
	object-fit: cover; transform: scale(1.01);
	transition: transform 1s cubic-bezier(.2, .7, .3, 1);
}
.cvs-gal .cvs-gal__cadre {
	position: absolute; inset: 0; z-index: 2; pointer-events: none;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); transition: box-shadow .45s ease;
}
.cvs-gal .cvs-gal__num {
	position: absolute; z-index: 3; left: 14px; bottom: 12px;
	font-family: Montserrat, sans-serif; font-size: 11.5px; font-weight: 700;
	line-height: 1; letter-spacing: .18em; color: rgba(255, 255, 255, .55);
	text-shadow: 0 2px 12px rgba(0, 0, 0, .8); transition: color .4s ease;
}
.cvs-gal .cvs-gal__vue:hover { transform: translateY(-6px); }
.cvs-gal .cvs-gal__vue:hover .cvs-gal__lueur, .cvs-gal .cvs-gal__vue:focus-visible .cvs-gal__lueur { opacity: .6; }
.cvs-gal .cvs-gal__vue:hover .cvs-gal__img { transform: scale(1.06); }
.cvs-gal .cvs-gal__vue:hover .cvs-gal__cadre { box-shadow: inset 0 0 0 1px rgba(190, 194, 239, .75), 0 0 44px rgba(12, 103, 222, .28); }
.cvs-gal .cvs-gal__vue:hover .cvs-gal__num { color: #fff; }
.cvs-gal .cvs-gal__vue:focus { outline: none; }
.cvs-gal .cvs-gal__vue:focus-visible .cvs-gal__cadre { box-shadow: inset 0 0 0 2px rgba(190, 194, 239, .95); }

/* ============================ LA VISIONNEUSE ============================ */
.cvs-vue {
	position: fixed; inset: 0; z-index: 99999; display: none;
	background: rgba(0, 0, 0, .96); align-items: center; justify-content: center; padding: 68px 24px 104px;
}
.cvs-vue.cvs-vue--ouverte { display: flex; }
.cvs-vue .cvs-vue__img {
	max-width: min(1500px, 100%); max-height: 100%; width: auto; height: auto;
	object-fit: contain; display: block;
	box-shadow: 0 40px 120px rgba(0, 0, 0, 0.62), 0 0 90px rgba(12, 103, 222, .16);
}
.cvs-vue .cvs-vue__bouton {
	position: absolute; display: inline-flex; align-items: center; justify-content: center;
	width: 54px; height: 54px; padding: 0; cursor: pointer;
	background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .2);
	border-radius: 0; color: #fff; transition: background .3s ease, border-color .3s ease;
}
.cvs-vue .cvs-vue__bouton:hover { background: rgba(47, 60, 209, .92); border-color: rgba(86, 181, 235, .72); }
.cvs-vue .cvs-vue__bouton:focus { outline: none; }
.cvs-vue .cvs-vue__bouton:focus-visible { outline: none; box-shadow: 0 0 0 2px rgba(86, 181, 235, .95); }
.cvs-vue .cvs-vue__fermer { top: 18px; right: 18px; }
.cvs-vue .cvs-vue__prec { left: 18px; top: 50%; transform: translateY(-50%); }
.cvs-vue .cvs-vue__suiv { right: 18px; top: 50%; transform: translateY(-50%); }
.cvs-vue .cvs-vue__fermer::before, .cvs-vue .cvs-vue__fermer::after { content: ""; position: absolute; width: 20px; height: 2px; background: #fff; }
.cvs-vue .cvs-vue__fermer::before { transform: rotate(45deg); }
.cvs-vue .cvs-vue__fermer::after { transform: rotate(-45deg); }
.cvs-vue .cvs-vue__prec::before, .cvs-vue .cvs-vue__suiv::before {
	content: ""; width: 13px; height: 13px; border-left: 2px solid #fff; border-bottom: 2px solid #fff;
}
.cvs-vue .cvs-vue__prec::before { transform: rotate(45deg); margin-left: 5px; }
.cvs-vue .cvs-vue__suiv::before { transform: rotate(-135deg); margin-right: 5px; }
.cvs-vue .cvs-vue__pied {
	position: absolute; left: 0; right: 0; bottom: 28px; padding: 0 86px; text-align: center;
	font-family: Montserrat, sans-serif; font-size: 13.5px; line-height: 1.5; color: rgba(255, 255, 255, .84);
}
.cvs-vue .cvs-vue__compte {
	display: block; margin-top: 7px; font-size: 11px; font-weight: 700;
	letter-spacing: .2em; text-transform: uppercase; color: #56B5EB;
}

/* ============================ LA SUITE ============================ */
@media (min-width: 700px) and (max-width: 1099px) {
	.cvs-suite .cvr .cvr-grille > .cvr-item:last-child { grid-column: span 2; }
}
.cvs-suite .cvs-entete { max-width: none; margin-block: 0 clamp(34px, 3.6vw, 52px); }
.cvs-suite .cvs-entete h2.cvs-titre {
	position: relative; margin-block: 0 14px; padding-top: 24px;
	font-size: var(--cv2-t2); font-weight: 700; line-height: 1.14; color: #fff; text-transform: none;
}
.cvs-suite .cvs-entete h2.cvs-titre::before {
	content: ""; position: absolute; left: 0; top: 0; width: 54px; height: 2px;
	background: linear-gradient(90deg, var(--cv2-ciel), var(--cv2-bleu));
}
.cvs-suite .cvs-entete p.cvs-chapo {
	margin-block: 0; font-family: Montserrat, sans-serif; font-size: var(--cv2-t5);
	font-weight: 400; line-height: 1.66; color: #B3B6D6;
}
.cvs-suite p.cvs-suite__toutes { margin-block: 38px 0; text-align: center; }
.cvs-suite p.cvs-suite__toutes a {
	display: inline-flex; align-items: center; gap: 12px; min-height: 44px;
	font-family: Montserrat, sans-serif; font-size: 12.5px; font-weight: 700;
	line-height: 1; letter-spacing: .16em; text-transform: uppercase; color: #56B5EB; text-decoration: none;
}
.cvs-suite p.cvs-suite__toutes a::after {
	content: ""; width: 28px; height: 1px; background: linear-gradient(90deg, #0C67DE, #56B5EB); transition: width .35s ease;
}
.cvs-suite p.cvs-suite__toutes a:hover::after { width: 46px; }

/* ============================ PALIERS ============================ */
@media (max-width: 1099px) {
	body.cvs-fiche { --cvs-flanc: 34%; }
	.cvs-gal { gap: 13px; }
}
/* Sous 980px les deux colonnes ne tiennent plus : le bandeau passe AU-DESSUS
   du texte et cesse d etre collant - un bloc colle sur un ecran etroit mange
   la moitie de la hauteur utile. */
@media (max-width: 979px) {
	.cvs-corps .cvs-corps__grille { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.cvs-corps .cvs-flanc__collant { position: static; gap: 20px; }
	.cvs-slider .cvs-slider__piste { aspect-ratio: 16 / 9; }
	.cvs-partage .cvs-partage__l { justify-content: flex-start; }
}
@media (max-width: 699px) {
	.cvs-hero .cvs-hero__int { padding: 108px 20px 30px; }
	.cvs-hero .cvs-hero__bas { flex-direction: column; align-items: stretch; gap: 22px; }
	.cvs-hero .cvs-carte { width: 100%; aspect-ratio: auto; flex-direction: column; gap: 14px; padding: 18px; }
	.cvs-hero h1.cvs-hero__titre { max-width: none; }
	.cvs-hero .cvs-fil { font-size: 10.5px; padding: 9px 13px; }
	.cvs-hero .cvs-fil .cvs-fil__ici { max-width: 20ch; }
	.cvs-sec { padding-block: 62px; }
	.cvs-gal { grid-template-columns: 1fr; gap: 11px; }
	.cvs-gal > .cvs-gal__item { grid-column: span 1; }
	.cvs-corps .cvs-lecture > h2 { margin-block: 40px 14px; }
	.cvs-corps .cvs-lecture > p {font-size: 15px; line-height: 1.7;}
	.cvs-corps .cvs-lecture > h2 + p { font-size: 17px; }
	.cvs-vue { padding: 60px 12px 96px; }
	.cvs-vue .cvs-vue__prec { left: 10px; }
	.cvs-vue .cvs-vue__suiv { right: 10px; }
	.cvs-vue .cvs-vue__pied { padding: 0 20px; bottom: 18px; font-size: 12.5px; }
}

/* ============================ MOUVEMENT REDUIT ============================ */
@media (prefers-reduced-motion: reduce) {
	.cvs-gal .cvs-gal__vue, .cvs-gal .cvs-gal__img, .cvs-gal .cvs-gal__lueur, .cvs-gal .cvs-gal__cadre,
	.cvs-gal .cvs-gal__num, .cvs-vue .cvs-vue__bouton, .cvs-slider .cvs-slider__vue,
	.cvs-partage a, .cvs-partage .cvs-partage__copie, .cvs-suite p.cvs-suite__toutes a::after { transition: none !important; }
	.cvs-gal .cvs-gal__vue:hover { transform: none; }
	.cvs-gal .cvs-gal__vue:hover .cvs-gal__img { transform: scale(1.01); }
}

/* ============================================================================
   KIT .cvj-* - RUBRIQUE CONSEILS (page 2073) ET GABARIT D ARTICLE, 2026-08-21

   Parti B, la Une : un article ouvre la rubrique en composition horizontale,
   les suivants suivent en grille filtrable. La resorption anti-vide est portee
   par le PHP (celesta-articles.php) et recalculee par le JS a chaque filtrage
   et a chaque resize ; elle est prouvee par exhaustion de 0 a 12 articles,
   en 6 colonnes comme en 4 : aucune rangee incomplete possible.

   Geste signature : le titre se souligne progressivement - c est deja la
   signature des cartes d article de l accueil (.cvh-artcarte). Les cartes de
   realisation gardent le verre et le halo, la fiche garde son compteur.
   ============================================================================ */

body.cvj-article { background: #000000; }
body.cvj-index { background: var(--cv2-nuit); }

/* --- blockGap du coeur : liste EXPLICITE de classes (pieges A1bis et A1ter).
   Sur la PAGE les sections sont enfants du post-content ; dans le GABARIT
   elles sont enfants directs de <main> - les deux arborescences sont couvertes. */
.wp-site-blocks .wp-block-post-content > .cvj-portes,
body.cvj-article .wp-site-blocks main > .cvh-hero,
body.cvj-article .wp-site-blocks main > .cvh-sec,
body.cvj-article .wp-site-blocks main > .cvj-tete,
body.cvj-article .wp-site-blocks main > .wp-block-cover { margin-block: 0; }
body.cvj-article .wp-site-blocks main { margin-block-start: 0; }

/* ---------------------------------------------------------------------------
   La grille : 6 colonnes, une carte en vaut 2. La Une prend la rangee entiere.
   --------------------------------------------------------------------------- */
.cvj { display: block; }

.cvj .cvj-grille {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 24px;
	list-style: none;
	margin: 0;
	padding: 0;
}
/* neutralisation (0,3,0) : le coeur pose une margin-block-start sur les
   enfants non premiers de tout conteneur, grilles comprises (piege A1) */
.wp-site-blocks .cvj .cvj-grille > * { margin-block: 0; }
.cvj .cvj-grille > .cvj-item { grid-column: span 2; min-width: 0; }
.cvj .cvj-grille > .cvj-item--s3 { grid-column: span 3; }
.cvj .cvj-grille > .cvj-item--s6 { grid-column: span 6; }
.cvj .cvj-grille > .cvj-item--une { grid-column: span 6; }
/* [hidden] ne masque rien si une regle AUTEUR pose un display (piege A10) */
.cvj .cvj-grille > .cvj-item[hidden] { display: none; }

/* ---------------------------------------------------------------------------
   La carte
   --------------------------------------------------------------------------- */
.cvj .cvj-carte {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	box-sizing: border-box;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .11);
	overflow: hidden;
	transition: transform .45s ease, border-color .45s ease, background .45s ease;
}
.cvj .cvj-carte:hover,
.cvj .cvj-carte:focus-within {
	transform: translateY(-6px);
	border-color: rgba(86, 181, 235, .42);
	background: rgba(255, 255, 255, .07);
}

.cvj .cvj-carte__vue {
	position: relative;
	overflow: hidden;
	flex: 0 0 auto;
	aspect-ratio: 16 / 10;
	background: #04081f;
}
.cvj .cvj-carte__vue .cvj-carte__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s cubic-bezier(.2, .7, .3, 1);
}
.cvj .cvj-carte:hover .cvj-carte__img,
.cvj .cvj-carte:focus-within .cvj-carte__img { transform: scale(1.06); }
.cvj .cvj-carte__vue::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 42%, rgba(0, 0, 0, .58) 100%);
	pointer-events: none;
}

.cvj .cvj-carte__corps {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	box-sizing: border-box;
	padding: 24px 24px 26px;
}
/* neutralisation (0,4,0) : toute marge redeclaree DOIT etre au moins aussi
   specifique, sinon elle tombe a zero (piege A2) */
.wp-site-blocks .cvj .cvj-carte__corps > * { margin-block: 0; }
.wp-site-blocks .cvj .cvj-carte__corps > p.cvj-carte__meta { margin-block: 0 12px; }
.wp-site-blocks .cvj .cvj-carte__corps > h3.cvj-carte__titre { margin-block: 0 12px; }
.wp-site-blocks .cvj .cvj-carte__corps > p.cvj-carte__txt { margin-block: 0 18px; }
/* colle le lien en pied de carte, quelle que soit la longueur du texte */
.wp-site-blocks .cvj .cvj-carte__corps > p.cvj-carte__aller { margin-block: auto 0; }

.cvj .cvj-carte__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px 14px;
	font-family: Montserrat, sans-serif;
	font-size: 12.5px;
	line-height: 1.4;
	color: #C2C5E1;
}
.cvj .cvj-carte__meta .cvj-carte__cat {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--cv2-titre-accent);
}
.cvj .cvj-carte__meta .cvj-carte__duree { position: relative; padding-left: 15px; }
.cvj .cvj-carte__meta .cvj-carte__duree::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 7px;
	height: 1px;
	background: rgba(194, 197, 225, .55);
}

.cvj .cvj-carte__corps h3.cvj-carte__titre {
	font-size: var(--cv2-t-vignette);
	font-weight: 700;
	line-height: 1.25;
	color: #FFFFFF;
	text-transform: none;
	overflow-wrap: break-word;
}
/* le titre se souligne progressivement : signature editoriale du site */
.cvj .cvj-carte__corps h3.cvj-carte__titre a {
	color: inherit;
	text-decoration: none;
	background-image: linear-gradient(90deg, #0C67DE, #56B5EB);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 2px;
	transition: background-size .5s cubic-bezier(.2, .7, .3, 1);
}
.cvj .cvj-carte:hover .cvj-carte__titre a,
.cvj .cvj-carte:focus-within .cvj-carte__titre a { background-size: 100% 2px; }
/* toute la carte est cliquable, sans dupliquer le lien pour les lecteurs d ecran */
.cvj .cvj-carte__corps h3.cvj-carte__titre a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 4;
}
.cvj .cvj-carte__corps h3.cvj-carte__titre a:focus { outline: none; }
.cvj .cvj-carte__corps h3.cvj-carte__titre a:focus-visible::after {
	box-shadow: inset 0 0 0 2px rgba(86, 181, 235, .95);
}

.cvj .cvj-carte__corps p.cvj-carte__txt {
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: #CFD1EA;
}
.cvj .cvj-carte__corps p.cvj-carte__aller {
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--cv2-titre-accent);
}
.cvj .cvj-carte__corps p.cvj-carte__aller::after {
	content: "";
	display: block;
	width: 22px;
	height: 1px;
	margin-top: 7px;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	transition: width .45s ease;
}
.cvj .cvj-carte:hover .cvj-carte__aller::after,
.cvj .cvj-carte:focus-within .cvj-carte__aller::after { width: 44px; }

/* ---------------------------------------------------------------------------
   La Une et la carte pleine largeur : deux colonnes, hauteur dictee par le
   texte, image en absolu dans sa colonne. Motif C2 : aucun vide POSSIBLE.
   --------------------------------------------------------------------------- */
.cvj .cvj-carte--une,
.cvj .cvj-carte--large {
	display: grid;
	grid-template-columns: .52fr .48fr;
	align-items: stretch;
}
.cvj .cvj-carte--large { grid-template-columns: .48fr .52fr; }
.cvj .cvj-carte--une .cvj-carte__vue,
.cvj .cvj-carte--large .cvj-carte__vue {
	aspect-ratio: auto;
	height: 100%;
	min-height: 300px;
}
/* la carte pleine largeur de fin de grille est en MIROIR de la Une : deux
   compositions horizontales successives ne se ressemblent pas */
.cvj .cvj-carte--large .cvj-carte__vue { order: 2; }
.cvj .cvj-carte--large .cvj-carte__corps { order: 1; }
.cvj .cvj-carte--une .cvj-carte__corps,
.cvj .cvj-carte--large .cvj-carte__corps {
	justify-content: center;
	padding: 40px 44px 42px;
}
.cvj .cvj-carte--une .cvj-carte__corps h3.cvj-carte__titre,
.cvj .cvj-carte--large .cvj-carte__corps h3.cvj-carte__titre { font-size: var(--cv2-t3); }
.cvj .cvj-carte--une .cvj-carte__corps p.cvj-carte__txt,
.cvj .cvj-carte--large .cvj-carte__corps p.cvj-carte__txt {font-size: 15px; line-height: 1.7;}
.wp-site-blocks .cvj .cvj-carte--une .cvj-carte__corps > p.cvj-carte__aller,
.wp-site-blocks .cvj .cvj-carte--large .cvj-carte__corps > p.cvj-carte__aller { margin-block: 4px 0; }
/* jeton a la une, dessine, jamais une image */
.cvj .cvj-carte--une .cvj-carte__vue::before {
	content: "\00c0 la une";
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	padding: 9px 16px;
	font-family: Montserrat, sans-serif;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #060A39;
	background: linear-gradient(90deg, #56B5EB, #56B5EB);
}

/* ---------------------------------------------------------------------------
   Les filtres
   --------------------------------------------------------------------------- */
.cvj .cvj-filtres {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 16px;
}
.cvj .cvj-filtre {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: 44px;
	padding: 10px 18px;
	box-sizing: border-box;
	font-family: Montserrat, sans-serif;
	font-size: 13.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #CFD1EA;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 0;
	cursor: pointer;
	transition: background .35s ease, border-color .35s ease, color .35s ease, transform .35s ease;
}
.cvj .cvj-filtre::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 2px;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform .4s ease;
}
.cvj .cvj-filtre:hover {
	background: rgba(255, 255, 255, .09);
	border-color: rgba(86, 181, 235, .5);
	color: #FFFFFF;
	transform: translateY(-2px);
}
.cvj .cvj-filtre:hover::after { transform: scaleX(1); }
.cvj .cvj-filtre:focus { outline: none; }
.cvj .cvj-filtre:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(86, 181, 235, .9), 0 0 0 7px rgba(86, 181, 235, .2);
}
.cvj .cvj-filtre--actif {
	background: rgba(47, 60, 209, .92);
	border-color: rgba(86, 181, 235, .66);
	color: #FFFFFF;
}
.cvj .cvj-filtre--actif::after { transform: scaleX(1); }
.cvj .cvj-filtre .cvj-filtre__n {
	padding-left: 9px;
	border-left: 1px solid rgba(255, 255, 255, .2);
	font-size: 12.5px;
	font-weight: 400;
	letter-spacing: .04em;
	color: rgba(255, 255, 255, .66);
}
.cvj .cvj-filtre--actif .cvj-filtre__n {
	color: rgba(255, 255, 255, .88);
	border-left-color: rgba(255, 255, 255, .34);
}

.wp-site-blocks .cvj p.cvj-etat {
	margin-block: 0 22px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	font-weight: 400;
	letter-spacing: .04em;
	color: #ABAED0;
}

/* ---------------------------------------------------------------------------
   Le maillage vers les savoir-faire (kit .cvj-portes)
   --------------------------------------------------------------------------- */
.cvj-portes .cvj-portes__liste {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.wp-site-blocks .cvj-portes .cvj-portes__liste > * { margin-block: 0; }
.cvj-portes .cvj-portes__liste > .cvj-porte { grid-column: span 2; }
/* resorption GENERIQUE : ajouter ou retirer une discipline ne peut pas
   creer de rangee incomplete (motif C15bis) */
.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(3n + 1) { grid-column: span 6; }
.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1),
.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvj-porte { grid-column: span 3; }

.cvj-portes .cvj-porte {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 10px;
	box-sizing: border-box;
	padding: 28px 26px;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .11);
	transition: transform .4s ease, border-color .4s ease, background .4s ease;
}
.cvj-portes .cvj-porte::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 2px;
	background: linear-gradient(180deg, #0C67DE, #56B5EB);
	transform: scaleY(.28);
	transform-origin: top center;
	transition: transform .45s ease;
}
.cvj-portes .cvj-porte:hover,
.cvj-portes .cvj-porte:focus-within {
	transform: translateY(-5px);
	border-color: rgba(86, 181, 235, .4);
	background: rgba(255, 255, 255, .07);
}
.cvj-portes .cvj-porte:hover::before,
.cvj-portes .cvj-porte:focus-within::before { transform: scaleY(1); }
.wp-site-blocks .cvj-portes .cvj-porte > * { margin-block: 0; }
.cvj-portes .cvj-porte h3.cvj-porte__titre {
	font-size: var(--cv2-t-vignette);
	font-weight: 700;
	line-height: 1.25;
	color: #FFFFFF;
	text-transform: none;
	overflow-wrap: break-word;
}
.cvj-portes .cvj-porte h3.cvj-porte__titre a { color: inherit; text-decoration: none; }
.cvj-portes .cvj-porte h3.cvj-porte__titre a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.cvj-portes .cvj-porte h3.cvj-porte__titre a:focus { outline: none; }
.cvj-portes .cvj-porte h3.cvj-porte__titre a:focus-visible::after { box-shadow: inset 0 0 0 2px rgba(86, 181, 235, .95); }
.cvj-portes .cvj-porte p.cvj-porte__n {
	font-family: Montserrat, sans-serif;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--cv2-titre-accent);
}
.cvj-portes .cvj-porte p.cvj-porte__txt {
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: #CFD1EA;
}
.cvj-portes .cvj-porte p.cvj-porte__aller {
	padding-top: 4px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--cv2-titre-accent);
}
.wp-site-blocks .cvj-portes .cvj-porte > p.cvj-porte__aller { margin-block: auto 0; }

/* ---------------------------------------------------------------------------
   GABARIT D ARTICLE - entete editoriale
   Pas de heros photo plein ecran : c aurait ete le sixieme du site.
   --------------------------------------------------------------------------- */
.cvj-tete { background: #000000; }
.wp-site-blocks .cvj-tete .cvj-tete__int {
	max-width: none;
	padding-top: clamp(104px, 13vh, 156px);
	padding-bottom: clamp(34px, 4.5vw, 54px);
	text-align: center;
}
.wp-site-blocks .cvj-tete .cvj-tete__int > * { margin-block: 0; }

.cvj-tete .cvj-fil {
	margin-block: 0 22px;
	font-family: Montserrat, sans-serif;
	font-size: 12.5px;
	line-height: 1.5;
	color: #ABAED0;
}
.cvj-tete .cvj-fil a { color: #CFD1EA; text-decoration: none; }
.cvj-tete .cvj-fil a:hover { color: var(--cv2-titre-accent); text-decoration: underline; }

.wp-site-blocks .cvj-tete .cvj-tete__int > p.cvj-tete__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: center;
	gap: 10px 18px;
	margin-block: 0 20px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 1.4;
	color: #C2C5E1;
}
.cvj-tete .cvj-tete__cat {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--cv2-titre-accent);
}
.cvj-tete .cvj-tete__duree { position: relative; padding-left: 17px; }
.cvj-tete .cvj-tete__duree::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 9px;
	height: 1px;
	background: rgba(194, 197, 225, .55);
}

.wp-site-blocks .cvj-tete .cvj-tete__int > h1.cvj-tete__titre {
	margin-block: 0 22px;
	font-size: var(--cv2-t1);
	font-weight: 800;
	line-height: 1.08;
	color: #FFFFFF;
	text-transform: none;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvj-tete .cvj-tete__int > p.cvj-tete__chapo {
	margin-block: 0;
	font-family: Montserrat, sans-serif;
	font-size: var(--cv2-t5);
	font-weight: 400;
	line-height: 1.66;
	color: #CFD1EA;
}

/* la bande image : pleine largeur, sans texte pose dessus - la lisibilite est
   garantie par construction, quelle que soit la photo des articles a venir */
.cvj-tete .cvj-tete__bande {
	position: relative;
	margin: 0;
	width: 100%;
	aspect-ratio: 21 / 8;
	overflow: hidden;
	background: #04081f;
}
.cvj-tete .cvj-tete__bande .cvj-tete__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.cvj-tete .cvj-tete__bande::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, .28) 0%, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, .55) 100%);
	pointer-events: none;
}

/* ---------------------------------------------------------------------------
   GABARIT D ARTICLE - corps a deux colonnes, sommaire collant
   C22 : c est l ENFANT qui est sticky, la colonne doit s etirer pour lui
   donner sa course. La paire est CENTREE : les marges laterales sont
   symetriques, donc de la respiration et non un vide a droite.
   --------------------------------------------------------------------------- */
/* defaut : UNE seule colonne de lecture, centree. Ecrit de facon a rester
   utilisable si :has() n est pas compris - le sommaire s empile alors
   au-dessus du texte au lieu de se placer en marge (motif F14). */
.wp-site-blocks .cvj-lecture .cvj-lecture__int {
	max-width: 830px;
}
/* deux colonnes UNIQUEMENT quand le sommaire est rendu : un article de moins
   de trois H2 n en a pas, et une colonne de 244px vide serait un vide. */
.wp-site-blocks .cvj-lecture .cvj-lecture__int:has(.cvj-somm) {
	display: grid;
	grid-template-columns: 244px minmax(0, 768px);
	gap: clamp(36px, 4.4vw, 64px);
	justify-content: center;
	max-width: 1420px;
}
.wp-site-blocks .cvj-lecture .cvj-lecture__int > * { margin-block: 0; }

.cvj-lecture .cvj-somm { position: relative; }
.cvj-lecture .cvj-somm .cvj-somm__int {
	position: sticky;
	top: calc(var(--cvj-header, 100px) + 28px);
	padding-left: 18px;
	border-left: 1px solid rgba(255, 255, 255, .13);
}
.wp-site-blocks .cvj-lecture .cvj-somm .cvj-somm__int > * { margin-block: 0; }
.cvj-lecture .cvj-somm p.cvj-somm__t {
	margin-block: 0 14px;
	font-family: Montserrat, sans-serif;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--cv2-titre-accent);
}
.cvj-lecture .cvj-somm .cvj-somm__l {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: cvjsomm;
}
.cvj-lecture .cvj-somm .cvj-somm__l > li.cvj-somm__i { margin-block: 0; padding: 0; }
.cvj-lecture .cvj-somm .cvj-somm__l > li.cvj-somm__i + li.cvj-somm__i { margin-block: 10px 0; }
.cvj-lecture .cvj-somm .cvj-somm__i a {
	display: block;
	position: relative;
	padding-left: 26px;
	font-family: Montserrat, sans-serif;
	font-size: 13.5px;
	font-weight: 400;
	line-height: 1.45;
	color: #B5B8D8;
	text-decoration: none;
	counter-increment: cvjsomm;
	transition: color .3s ease;
}
.cvj-lecture .cvj-somm .cvj-somm__i a::before {
	content: counter(cvjsomm, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .08em;
	color: rgba(186, 190, 237, .55);
	transition: color .3s ease;
}
.cvj-lecture .cvj-somm .cvj-somm__i a:hover { color: #FFFFFF; }
.cvj-lecture .cvj-somm .cvj-somm__i a:focus { outline: none; }
.cvj-lecture .cvj-somm .cvj-somm__i a:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(86, 181, 235, .9);
}
/* le jalon de lecture : l entree en cours s allume */
.cvj-lecture .cvj-somm .cvj-somm__i--vu a { color: #FFFFFF; font-weight: 700; }
.cvj-lecture .cvj-somm .cvj-somm__i--vu a::before { color: var(--cv2-titre-accent); }

/* --- le contenu de l article --- */
.wp-site-blocks .cvj-lecture .wp-block-post-content { max-width: none; margin-block: 0; }
.wp-site-blocks .cvj-lecture .wp-block-post-content > * { margin-block: 0; }
.wp-site-blocks .cvj-lecture .wp-block-post-content > * + * { margin-block: 24px 0; }
.wp-site-blocks .cvj-lecture .wp-block-post-content > h2 { margin-block: 52px 0; }
.wp-site-blocks .cvj-lecture .wp-block-post-content > *:first-child { margin-block: 0; }

.cvj-lecture .wp-block-post-content h2 {
	font-size: var(--cv2-t2);
	font-weight: 700;
	line-height: 1.14;
	color: #FFFFFF;
	text-transform: none;
	overflow-wrap: break-word;
	scroll-margin-top: calc(var(--cvj-header, 100px) + 26px);
}
.cvj-lecture .wp-block-post-content h3 {
	font-size: var(--cv2-t3);
	font-weight: 700;
	line-height: 1.25;
	color: #FFFFFF;
	scroll-margin-top: calc(var(--cvj-header, 100px) + 26px);
}
.cvj-lecture .wp-block-post-content p {
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: #D3D5EC;
}
.cvj-lecture .wp-block-post-content a { color: var(--cv2-titre-accent); text-decoration: underline; text-underline-offset: 3px; }
.cvj-lecture .wp-block-post-content a:hover { color: #FFFFFF; }
.cvj-lecture .wp-block-post-content strong { color: #FFFFFF; font-weight: 700; }
.cvj-lecture .wp-block-post-content ul,
.cvj-lecture .wp-block-post-content ol { padding-left: 22px; color: #D3D5EC; font-size: 17px; line-height: 1.78; }
/* le coeur pose margin-top .5rem sur chaque li (piege A9) */
.cvj-lecture .wp-block-post-content li { margin-block: 0; }
.cvj-lecture .wp-block-post-content li + li { margin-block: 9px 0; }
.cvj-lecture .wp-block-post-content figure { margin: 0; }
.cvj-lecture .wp-block-post-content figure img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid rgba(255, 255, 255, .1);
}
.cvj-lecture .wp-block-post-content figcaption {
	margin-top: 10px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 1.5;
	color: #ABAED0;
}
.cvj-lecture .wp-block-post-content blockquote {
	margin: 0;
	padding: 4px 0 4px 24px;
	border-left: 2px solid rgba(86, 181, 235, .55);
	font-size: 18px;
	line-height: 1.7;
	color: #EAEBF9;
}

/* ---------------------------------------------------------------------------
   Paliers
   --------------------------------------------------------------------------- */
@media (max-width: 1240px) {
	.wp-site-blocks .cvj-lecture .cvj-lecture__int:has(.cvj-somm) { grid-template-columns: 218px minmax(0, 700px); }
}

@media (max-width: 1099px) {
	.cvj .cvj-grille { grid-template-columns: repeat(4, 1fr); gap: 20px; }
	/* les modificateurs sont REDECLARES dans la media query, a la meme
	   specificite : sans cela la regle de base la battrait (pieges A4 et C15bis) */
	.cvj .cvj-grille > .cvj-item { grid-column: span 2; }
	.cvj .cvj-grille > .cvj-item--s3 { grid-column: span 2; }
	.cvj .cvj-grille > .cvj-item--s6 { grid-column: span 4; }
	.cvj .cvj-grille > .cvj-item--s4 { grid-column: span 4; }
	.cvj .cvj-grille > .cvj-item--une { grid-column: span 4; }
	.cvj .cvj-carte--une,
	.cvj .cvj-carte--large { grid-template-columns: .5fr .5fr; }
	.cvj .cvj-carte--une .cvj-carte__corps,
	.cvj .cvj-carte--large .cvj-carte__corps { padding: 32px 32px 34px; }
	.cvj-portes .cvj-portes__liste { grid-template-columns: repeat(6, 1fr); }
	.cvj-portes .cvj-portes__liste > .cvj-porte { grid-column: span 3; }
	.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(2n + 1) { grid-column: span 6; }
	.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(3n + 1) { grid-column: span 6; }
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1),
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvj-porte { grid-column: span 3; }
}

@media (max-width: 980px) {
	/* sur un ecran etroit, un bloc fige mange la moitie de la hauteur utile */
	.wp-site-blocks .cvj-lecture .cvj-lecture__int:has(.cvj-somm) { grid-template-columns: minmax(0, 1fr); gap: 30px; }
	.cvj-lecture .cvj-somm .cvj-somm__int { position: static; }
	.cvj-lecture .cvj-somm .cvj-somm__l { column-count: 2; column-gap: 26px; }
	.cvj-lecture .cvj-somm .cvj-somm__i { break-inside: avoid; }
	.cvj-tete .cvj-tete__bande { aspect-ratio: 16 / 8; }
}

@media (max-width: 780px) {
	.cvj .cvj-grille { grid-template-columns: repeat(2, 1fr); gap: 18px; }
	.cvj .cvj-grille > .cvj-item,
	.cvj .cvj-grille > .cvj-item--s3,
	.cvj .cvj-grille > .cvj-item--s4,
	.cvj .cvj-grille > .cvj-item--s6,
	.cvj .cvj-grille > .cvj-item--une { grid-column: span 2; }
	/* les compositions horizontales repassent en pile : a cette largeur une
	   colonne d image de 160px ne montre plus rien */
	.cvj .cvj-carte--une,
	.cvj .cvj-carte--large {
		display: flex;
		flex-direction: column;
	}
	.cvj .cvj-carte--une .cvj-carte__vue,
	.cvj .cvj-carte--large .cvj-carte__vue {
		order: 0;
		aspect-ratio: 16 / 10;
		height: auto;
		min-height: 0;
	}
	.cvj .cvj-carte--une .cvj-carte__corps,
	.cvj .cvj-carte--large .cvj-carte__corps { order: 1; padding: 24px 22px 26px; }
	.cvj .cvj-carte--une .cvj-carte__corps h3.cvj-carte__titre,
	.cvj .cvj-carte--large .cvj-carte__corps h3.cvj-carte__titre { font-size: var(--cv2-t-vignette); }
	.cvj .cvj-carte--une .cvj-carte__corps p.cvj-carte__txt,
	.cvj .cvj-carte--large .cvj-carte__corps p.cvj-carte__txt {font-size: 15px; line-height: 1.7;}
	.cvj-portes .cvj-portes__liste { grid-template-columns: repeat(6, 1fr); gap: 16px; }
	.cvj-portes .cvj-portes__liste > .cvj-porte,
	.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(3n + 1),
	.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(2n + 1),
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1),
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvj-porte { grid-column: span 6; }
	.cvj-lecture .cvj-somm .cvj-somm__l { column-count: 1; }
	.cvj-lecture .wp-block-post-content p,
	.cvj-lecture .wp-block-post-content ul,
	.cvj-lecture .wp-block-post-content ol { font-size: 15px; line-height: 1.7; }
	.wp-site-blocks .cvj-lecture .wp-block-post-content > h2 { margin-block: 38px 0; }
	.cvj-tete .cvj-tete__bande { aspect-ratio: 4 / 3; }
	.wp-site-blocks .cvj-tete .cvj-tete__int { padding-top: clamp(84px, 12vh, 118px); }
}

@media (prefers-reduced-motion: reduce) {
	.cvj .cvj-carte,
	.cvj .cvj-carte__img,
	.cvj .cvj-carte__titre a,
	.cvj .cvj-carte__aller::after,
	.cvj .cvj-filtre,
	.cvj .cvj-filtre::after,
	.cvj-portes .cvj-porte,
	.cvj-portes .cvj-porte::before,
	.cvj-lecture .cvj-somm__i a { transition: none; }
	.cvj .cvj-carte:hover,
	.cvj .cvj-carte:focus-within,
	.cvj-portes .cvj-porte:hover,
	.cvj-portes .cvj-porte:focus-within { transform: none; }
}

/* --- Correctifs de hierarchie mesures le 2026-08-21 -------------------------
   La Une sortait a 378px quand les vignettes suivantes faisaient 550px et les
   cartes demi-largeur 637px : la piece maitresse etait la plus petite de la
   page. Deux gestes, aucun etirement a vide :
   1. la Une porte desormais les trois premiers jalons de l article (contenu
      utile, motif C14) ;
   2. la carte demi-largeur passe en 21/9 : a 641px de large, son image
      descend de 400 a 275px et sa hauteur totale rejoint celle des vignettes.
   --------------------------------------------------------------------------- */
.cvj .cvj-grille > .cvj-item--s3 .cvj-carte__vue { aspect-ratio: 21 / 9; }

.wp-site-blocks .cvj .cvj-carte__corps > p.cvj-carte__somt {
	margin-block: 0 10px;
	font-family: Montserrat, sans-serif;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #ABAED0;
}
.wp-site-blocks .cvj .cvj-carte__corps > ul.cvj-carte__som {
	margin-block: 0 22px;
	padding: 0;
	list-style: none;
	counter-reset: cvjune;
}
.cvj .cvj-carte__som > li {
	position: relative;
	margin-block: 0;
	padding-left: 26px;
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.7;
	color: #CFD1EA;
	counter-increment: cvjune;
}
.cvj .cvj-carte__som > li + li { margin-block: 9px 0; }
.cvj .cvj-carte__som > li::before {
	content: counter(cvjune, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 1px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	color: rgba(186, 190, 237, .62);
}

@media (max-width: 1099px) {
	.cvj .cvj-grille > .cvj-item--s3 .cvj-carte__vue { aspect-ratio: 16 / 10; }
}
@media (max-width: 780px) {
	.cvj .cvj-carte--une .cvj-carte__corps > ul.cvj-carte__som,
	.cvj .cvj-carte--large .cvj-carte__corps > ul.cvj-carte__som { display: none; }
	.cvj .cvj-carte--une .cvj-carte__corps > p.cvj-carte__somt,
	.cvj .cvj-carte--large .cvj-carte__corps > p.cvj-carte__somt { display: none; }
}

/* Chapo de section de la rubrique. Ecrit en (0,2,1) comme .cv4-chapo :
   .cvh-sstitre, employe par erreur, est un SOUS-TITRE de section a 42px/700. */
.wp-site-blocks p.cvj-chapo {
	margin-block: 0 30px;
	margin-inline: auto;
	max-width: 88ch;
	font-family: Montserrat, sans-serif;
	font-size: var(--cv2-t5);
	font-weight: 400;
	line-height: 1.66;
	color: #CFD1EA;
	text-align: center;
}
@media (max-width: 780px) {
	.wp-site-blocks p.cvj-chapo { font-size: 16px; margin-block: 0 24px; }
}

/* Entre 700 et 780px la grille garde QUATRE colonnes, donc deux cartes par
   rangee : mesure a 768px, une seule colonne donnait une page de 4 000px pour
   six articles. Seules les compositions horizontales s empilent a ce palier,
   une colonne d image de 350px ne montrant plus rien. Bloc place APRES celui
   de 780px : a specificite egale, l ordre tranche. */
@media (min-width: 700px) and (max-width: 780px) {
	.cvj .cvj-grille { grid-template-columns: repeat(4, 1fr); gap: 20px; }
	.cvj .cvj-grille > .cvj-item { grid-column: span 2; }
	.cvj .cvj-grille > .cvj-item--s3 { grid-column: span 2; }
	.cvj .cvj-grille > .cvj-item--s4 { grid-column: span 4; }
	.cvj .cvj-grille > .cvj-item--s6 { grid-column: span 4; }
	.cvj .cvj-grille > .cvj-item--une { grid-column: span 4; }
	.cvj .cvj-grille > .cvj-item--s3 .cvj-carte__vue { aspect-ratio: 16 / 10; }
	.cvj-portes .cvj-portes__liste { grid-template-columns: repeat(6, 1fr); }
	.cvj-portes .cvj-portes__liste > .cvj-porte { grid-column: span 3; }
	.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(2n + 1) { grid-column: span 6; }
	.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(3n + 1) { grid-column: span 6; }
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1),
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvj-porte { grid-column: span 3; }
}

/* Piege A11 : la couture de l accueil .cvh-sec + .cvh-sec--abysse .cvh-int
   (0,3,0) met padding-top a 0 et fuit sur ce gabarit - mesure, le texte de
   l article demarrait COLLE a la bande image. Redeclare a la meme
   specificite et APRES, l ordre tranche. */
.wp-site-blocks .cvj-lecture .cvj-lecture__int {
	padding-top: clamp(48px, 6vw, 78px);
	padding-bottom: clamp(56px, 7vw, 92px);
}

/* ============================================================================
   RETOUR CLIENT DU 2026-08-21 (soir) - refonte de l entete d article,
   rail des reseaux sociaux, et reduction des titres de corps de texte.
   ============================================================================ */

/* --- 1. HEROS D ARTICLE PLEIN VIEWPORT -------------------------------------
   Demande client : plein viewport, image mise en avant, voile en DEGRADE.
   Le contenu est ancre EN BAS et le haut est occupe par l image : la
   composition est pleine par construction, aucun vide possible (C1).
   Le degrade finit sur la couleur EXACTE de la section suivante
   (rgb(0, 2, 30)) : le raccord est invisible, sans couture ni bande.
   ⚠️ Une sonde de rail comptera donc un doublon de fond - c est le fondu voulu.
   --------------------------------------------------------------------------- */
body.cvj-article .wp-site-blocks main > .cvj-hero-art,
body.cvj-article .wp-site-blocks main > .cvj-rs { margin-block: 0; }

.cvj-hero-art {
	position: relative;
	display: flex;
	align-items: flex-end;
	/* le header est STICKY : il occupe le flux, donc 100vh deborderait
	   d exactement sa hauteur (piege C21). La valeur est publiee par le JS,
	   car elle vaut 114px en desktop et 77px en mobile. */
	min-height: calc(100svh - var(--cvj-header, 0px));
	overflow: hidden;
	background: #000000;
}
.cvj-hero-art .cvj-hero-art__fond { position: absolute; inset: 0; z-index: 0; }
.cvj-hero-art .cvj-hero-art__fond .cvj-hero-art__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
/* DEUX couches. La verticale porte la lisibilite du bas et le raccord sur
   rgb(0,2,30) ; l horizontale assombrit la GAUCHE, ou vit le texte, et laisse
   la droite de la photo intacte. Mesure du 2026-08-21 : avec une seule couche
   verticale douce, les 7 images mises en avant tombaient sous 4,5 (pire 2,76). */
.cvj-hero-art::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		linear-gradient(90deg, rgba(0, 0, 0, .46) 0%, rgba(0, 0, 0, .30) 34%, rgba(0, 0, 0, .10) 62%, rgba(0, 0, 0, 0) 100%),
		linear-gradient(180deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .20) 20%, rgba(0, 0, 0, .44) 38%, rgba(0, 0, 0, .60) 48%, rgba(0, 0, 0, .88) 72%, rgb(0, 0, 0) 100%);
}
.wp-site-blocks .cvj-hero-art .cvj-hero-art__int {
	position: relative;
	z-index: 2;
	width: 100%;
	padding-top: clamp(120px, 18vh, 200px);
	padding-bottom: clamp(52px, 7vh, 92px);
}
.wp-site-blocks .cvj-hero-art .cvj-hero-art__int > * { margin-block: 0; }

.wp-site-blocks .cvj-hero-art .cvj-hero-art__int > p.cvj-hero-art__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 18px;
	margin-block: 0 20px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 1.4;
	color: #DADCEF;
}
.cvj-hero-art .cvj-hero-art__cat {
	position: relative;
	padding-left: 46px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #CACDE8;
}
.cvj-hero-art .cvj-hero-art__cat::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 34px;
	height: 2px;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
}
.cvj-hero-art .cvj-hero-art__duree { position: relative; padding-left: 17px; }
.cvj-hero-art .cvj-hero-art__duree::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 9px;
	height: 1px;
	background: rgba(218, 220, 239, .6);
}

/* Le titre suit la meme regle de CONTEXTE que celui de la fiche : un heros
   plein ecran doit tenir dans le viewport, et les titres d article sont longs
   (78 a 88 caracteres). Il descend donc encore sur les ecrans COURTS. */
.wp-site-blocks .cvj-hero-art .cvj-hero-art__int > h1.cvj-hero-art__titre {
	margin-block: 0 22px;
	max-width: none;
	font-size: clamp(29px, 4vw, 54px);
	font-weight: 800;
	line-height: 1.08;
	color: #FFFFFF;
	text-transform: none;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvj-hero-art .cvj-hero-art__int > p.cvj-hero-art__chapo {
	margin-block: 0;
	max-width: 62ch;
	font-family: Montserrat, sans-serif;
	font-size: var(--cv2-t5);
	font-weight: 400;
	line-height: 1.66;
	color: #DADCEF;
}
@media (max-height: 860px) {
	.wp-site-blocks .cvj-hero-art .cvj-hero-art__int > h1.cvj-hero-art__titre { font-size: clamp(27px, 3.4vw, 46px); }
}
@media (max-height: 720px) {
	.wp-site-blocks .cvj-hero-art .cvj-hero-art__int > h1.cvj-hero-art__titre { font-size: clamp(25px, 2.9vw, 38px); }
	.wp-site-blocks .cvj-hero-art .cvj-hero-art__int { padding-top: clamp(96px, 14vh, 150px); }
}

/* --- 2. RAIL VERTICAL DES RESEAUX SOCIAUX ----------------------------------
   Demande client : vertical, colle a droite pendant tout le defilement.
   ⚠️ En position fixe : verifie qu aucun ancetre ne porte filter ni transform,
   sinon fixed se resoudrait par rapport a cet ancetre.
   --------------------------------------------------------------------------- */
.cvj-rs {
	position: fixed;
	z-index: 40;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 16px 10px;
	background: rgba(0, 2, 30, .58);
	border: 1px solid rgba(255, 255, 255, .13);
	border-right: 0;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cvj-rs { background: #00021E; }
}
.cvj-rs .cvj-rs__fil {
	display: block;
	width: 1px;
	height: 26px;
	margin-bottom: 6px;
	background: linear-gradient(180deg, rgba(86, 181, 235, 0), #56B5EB);
}
.cvj-rs .cvj-rs__l { display: flex; flex-direction: column; gap: 4px; list-style: none; margin: 0; padding: 0; }
.wp-site-blocks .cvj-rs .cvj-rs__l > li { margin-block: 0; }
.cvj-rs .cvj-rs__a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	color: #CFD1EA;
	text-decoration: none;
	transition: color .3s ease, background .3s ease;
}
.cvj-rs .cvj-rs__a:hover { color: #FFFFFF; background: rgba(86, 181, 235, .18); }
.cvj-rs .cvj-rs__a:focus { outline: none; }
.cvj-rs .cvj-rs__a:focus-visible { outline: none; box-shadow: inset 0 0 0 2px rgba(86, 181, 235, .95); }
.cvj-rs .cvj-rs__svg { width: 21px; height: 21px; display: block; }
/* le nom reste lisible par les lecteurs d ecran sans occuper de place */
.cvj-rs .cvj-rs__nom {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --- 3. TITRES DES CORPS DE TEXTE LONGS ------------------------------------
   Demande client : reduire les Hn dans le contenu, sur les articles ET sur les
   fiches de realisation. 42px dans une colonne de 768px ecrasait la lecture.
   La valeur retenue est le CRAN H3 de la charte : ce n est donc pas une taille
   neuve, c est une regle de CONTEXTE de plus, comme le titre de vignette.
   Rapport au corps (17px) : 1,65 - un rythme de lecture, pas un panneau.
   --------------------------------------------------------------------------- */
:root { --cv2-t2-corps: clamp(21px, 2.05vw, 28px); }

.cvj-lecture .wp-block-post-content h2 { font-size: var(--cv2-t2-corps); line-height: 1.22; }
.cvj-lecture .wp-block-post-content h3 { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.3; }
.wp-site-blocks .cvj-lecture .wp-block-post-content > h2 { margin-block: 42px 0; }

/* Fiche de realisation : la regle d origine vaut (0,2,1), celle-ci (0,3,1)
   et elle est ecrite APRES - les deux conditions sont necessaires (piege A4). */
.wp-site-blocks .cvs-corps .cvs-lecture > h2 { font-size: var(--cv2-t2-corps); line-height: 1.22; }

@media (max-width: 780px) {
	.wp-site-blocks .cvj-lecture .wp-block-post-content > h2 { margin-block: 34px 0; }
}

/* Sous 1100px le rail fixe occupait 17 % du viewport et recouvrait le texte
   sur 44px (mesure a 390). Il redevient une bande HORIZONTALE dans le flux,
   posee apres les articles a lire ensuite. Un seul element, donc aucun lien
   duplique pour les lecteurs d ecran. Fond nuit : le rail reste sans doublon
   (heros | abysse | noir | nuit | photo). */
@media (max-width: 1099px) {
	.cvj-rs {
		position: static;
		transform: none;
		right: auto;
		top: auto;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		gap: 10px;
		padding: 26px 20px;
		background: var(--cv2-nuit);
		border: 0;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
	.cvj-rs .cvj-rs__fil { width: 28px; height: 1px; margin: 0 4px 0 0; background: linear-gradient(90deg, rgba(86, 181, 235, 0), #56B5EB); }
	.cvj-rs .cvj-rs__l { flex-direction: row; gap: 8px; }
}

/* Retour client : de l air au-dessus du titre de groupe du formulaire.
   ⚠️ Le <legend> porte deja margin-top: 30px, SANS effet : un legend dans un
   fieldset n est pas positionne comme un bloc ordinaire, meme en display:block
   (ecart mesure entre la barre d onglets et le titre : 0px). L air se pose donc
   sur la BARRE, hors du fieldset, et la marge du legend est mise a zero pour
   que le resultat soit deterministe. */
.cvk .cvk-onglets { margin-bottom: 34px; }
.cvk .cvk-groupe > legend.cvk-groupe__titre { margin-top: 0; }
@media (max-width: 900px) {
	.cvk .cvk-onglets { margin-bottom: 26px; }
}

/* ============================================================================
   AUCUN CADRE AU CLIC - regle de DA, valable sur TOUT le site (2026-08-21)

   Cause trouvee : le coeur de WordPress sert `:where(.wp-site-blocks :focus)
   { outline: solid }` - un anneau sur :focus, donc AU CLIC, et pas seulement
   au clavier. Il vaut (0,0,0) et s applique partout ou aucun kit ne l a
   neutralise. Le bloc bouton en pose un second en (0,1,0).

   ⛔ On ne le supprime PAS purement et simplement : l anneau reste indispensable
   au clavier (piege B5, il n apparait pas dans getComputedStyle). On ne retire
   donc que le cas SOURIS, par :not(:focus-visible), et le clavier garde l anneau
   servi par le coeur et par les kits.
   ⚠️ Le box-shadow n est neutralise que sur les PSEUDO-elements (les anneaux
   dessines par nos kits) : la lueur des champs de formulaire, elle, est portee
   par l element et doit rester visible quand on clique dedans.
   ============================================================================ */
.wp-site-blocks :focus:not(:focus-visible) { outline: none; }
.wp-site-blocks :focus:not(:focus-visible)::after { box-shadow: none; }
.wp-site-blocks :focus:not(:focus-visible)::before { box-shadow: none; }

/* ============================================================================
   FICHE DE REALISATION - carte de reperes elargie (retour client)

   Mesure : la carte retrecit avec la HAUTEUR du viewport (clamp a 214px sous
   860px de haut, 188px sous 720px). A 188px moins 30px de padding, il reste
   158px pour une valeur de 46 caracteres - soit QUATRE lignes.
   Largeur de contenu necessaire pour tenir en DEUX lignes : ~200px, calculee
   sur les libelles les plus longs du corpus (disciplines 46 caracteres,
   commanditaire 34).
   ⚠️ Le carre est abandonne : elargir en gardant aspect-ratio 1/1 aurait
   grandi la carte d autant en hauteur, or le heros doit tenir dans le viewport.
   La hauteur vient desormais du contenu (mesuree ~226px, contre 239 avant).
   ============================================================================ */
.cvs-hero .cvs-carte {
	width: clamp(252px, 19.5vw, 292px);
	aspect-ratio: auto;
}
@media (max-height: 860px) {
	.cvs-hero .cvs-carte { width: clamp(244px, 18.5vw, 272px); padding: 20px; gap: 13px; aspect-ratio: auto; }
}
@media (max-height: 720px) {
	.cvs-hero .cvs-carte { width: clamp(236px, 17.5vw, 256px); padding: 17px; gap: 10px; aspect-ratio: auto; }
	.cvs-carte .cvs-carte__val { font-size: 14px; }
}
@media (max-width: 699px) {
	.cvs-hero .cvs-carte { width: 100%; aspect-ratio: auto; }
}

/* ============================================================================
   KIT .cvi-* - CEREMONIES INSTITUTIONNELLES (page 134), 2026-08-21

   Parti B : le compte a rebours protocolaire. Frise verticale, jalons en
   chevauchement alterne, ligne de progression qui se remplit au defilement.
   C est l angle mort mesure sur la SERP : sur 39 resultats, aucun ne traite
   la ceremonie PUBLIQUE (arrete prefectoral, pavoisement, sonnerie aux morts).

   ⛔ Etat de repos : la ligne est PLEINE et les jalons sont VISIBLES. Le JS ne
   fait que retirer du remplissage, jamais en ajouter - si le script ne tourne
   pas, la page reste juste (regle B2, la faute la plus grave du chantier).
   ============================================================================ */

/* --- blockGap : liste explicite des sections racine de cette page --- */
.wp-site-blocks .wp-block-post-content > .cvi-sec { margin-block: 0; }

/* ---------------------------------------------------------------------------
   Les quatre ceremonies
   --------------------------------------------------------------------------- */
.cvi-ceremonies {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}
.wp-site-blocks .cvi-ceremonies > * { margin-block: 0; }
.cvi-ceremonie {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 12px;
	box-sizing: border-box;
	padding: 30px 26px 32px;
	background: linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .03));
	border: 1px solid rgba(255, 255, 255, .12);
	overflow: hidden;
	transition: transform .45s cubic-bezier(.2, .7, .3, 1), border-color .45s ease, background .45s ease;
}
/* arete haute eclairee : la surface polie du site, pas un reflet duplique */
.cvi-ceremonie::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent);
}
/* bande speculaire visible AU REPOS, qui glisse au survol, DERRIERE le texte */
.cvi-ceremonie::after {
	content: "";
	position: absolute;
	z-index: 1;
	top: -30%;
	left: -60%;
	width: 46%;
	height: 160%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .10), transparent);
	transform: rotate(9deg);
	transition: transform .75s cubic-bezier(.2, .7, .3, 1);
}
.cvi-ceremonie:hover, .cvi-ceremonie:focus-within {
	transform: translateY(-6px);
	border-color: rgba(86, 181, 235, .42);
	background: linear-gradient(160deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .05));
}
.cvi-ceremonie:hover::after, .cvi-ceremonie:focus-within::after { transform: translateX(230%) rotate(9deg); }
.wp-site-blocks .cvi-ceremonie > * { position: relative; z-index: 2; margin-block: 0; }
.wp-site-blocks .cvi-ceremonie > p.cvi-ceremonie__cle {
	font-family: Montserrat, sans-serif;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: #56B5EB;
}
.wp-site-blocks .cvi-ceremonie > h3.cvi-ceremonie__titre {
	margin-block: 0;
	font-size: var(--cv2-t-vignette);
	font-weight: 700;
	line-height: 1.25;
	color: #FFFFFF;
	text-transform: none;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvi-ceremonie > p.cvi-ceremonie__txt {
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: #CFD1EA;
}
.wp-site-blocks .cvi-ceremonie > p.cvi-ceremonie__impose {
	margin-block: auto 0;
	padding-top: 14px;
	border-top: 1px solid rgba(255, 255, 255, .1);
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 1.55;
	color: #CACDE8;
}

/* ---------------------------------------------------------------------------
   La frise : trois semaines
   --------------------------------------------------------------------------- */
.cvi-frise {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding-left: 128px;
}
.wp-site-blocks .cvi-frise > * { margin-block: 0; }
/* le rail, et son remplissage. Au REPOS le remplissage est PLEIN : le JS ne
   fait que le reduire, donc sans JS la frise reste juste. */
.cvi-frise::before {
	content: "";
	position: absolute;
	left: 46px;
	top: 14px;
	bottom: 14px;
	width: 2px;
	background: rgba(255, 255, 255, .12);
}
.cvi-frise::after {
	content: "";
	position: absolute;
	left: 46px;
	top: 14px;
	width: 2px;
	height: calc((100% - 28px) * var(--cvi-p, 1));
	background: linear-gradient(180deg, #0C67DE, #56B5EB);
	box-shadow: 0 0 14px rgba(86, 181, 235, .55);
	transition: height .25s linear;
}

.cvi-jalon {
	position: relative;
	box-sizing: border-box;
	padding: 26px 30px 28px;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .12);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	transition: transform .45s cubic-bezier(.2, .7, .3, 1), border-color .45s ease, background .45s ease;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cvi-jalon { background: rgba(0, 4, 31, .82); }
}
/* chevauchement alterne : un jalon sur deux mord sur la gauche, l autre non.
   Le decalage est HORIZONTAL, il ne peut donc pas creuser de vide vertical. */
.cvi-frise > .cvi-jalon:nth-child(even) { margin-left: 46px; }
.cvi-jalon:hover, .cvi-jalon:focus-within {
	transform: translateX(6px);
	border-color: rgba(86, 181, 235, .4);
	background: rgba(255, 255, 255, .08);
}
/* le noeud sur le rail */
.cvi-jalon::before {
	content: "";
	position: absolute;
	left: -1px;
	top: 30px;
	width: 2px;
	height: 26px;
	background: linear-gradient(180deg, #0C67DE, #56B5EB);
}
.wp-site-blocks .cvi-jalon > * { margin-block: 0; }
.wp-site-blocks .cvi-jalon > p.cvi-jalon__quand {
	position: absolute;
	left: -128px;
	top: 26px;
	width: 104px;
	margin: 0;
	font-family: Montserrat, sans-serif;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #56B5EB;
	text-align: right;
}
.cvi-frise > .cvi-jalon:nth-child(even) > p.cvi-jalon__quand { left: -174px; }
.wp-site-blocks .cvi-jalon > h3.cvi-jalon__titre {
	margin-block: 0 10px;
	font-size: var(--cv2-t3);
	font-weight: 700;
	line-height: 1.25;
	color: #FFFFFF;
	text-transform: none;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvi-jalon > p.cvi-jalon__txt {
	margin-block: 0;
	max-width: 74ch;
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: #CFD1EA;
}
/* le jalon du jour J : c est le sommet du recit */
.cvi-frise > .cvi-jalon--jour {
	background: linear-gradient(140deg, rgba(12, 103, 222, .22), rgba(86, 181, 235, .10));
	border-color: rgba(86, 181, 235, .5);
}
.wp-site-blocks .cvi-frise > .cvi-jalon--jour > p.cvi-jalon__quand { color: #FFFFFF; }
.cvi-frise > .cvi-jalon--jour::before { width: 3px; height: 34px; left: -2px; }

/* ---------------------------------------------------------------------------
   Paliers
   --------------------------------------------------------------------------- */
@media (max-width: 1099px) {
	.cvi-ceremonies { grid-template-columns: repeat(2, 1fr); }
	.cvi-frise { padding-left: 112px; }
	.cvi-frise::before, .cvi-frise::after { left: 38px; }
	.wp-site-blocks .cvi-jalon > p.cvi-jalon__quand { left: -112px; width: 92px; }
	.cvi-frise > .cvi-jalon:nth-child(even) { margin-left: 34px; }
	.cvi-frise > .cvi-jalon:nth-child(even) > p.cvi-jalon__quand { left: -146px; }
}
@media (max-width: 780px) {
	.cvi-ceremonies { grid-template-columns: 1fr; gap: 14px; }
	/* en mobile la frise passe en pile simple : le rail et le chevauchement
	   mangeraient la largeur de lecture. */
	.cvi-frise { padding-left: 0; gap: 16px; }
	.cvi-frise::before, .cvi-frise::after { display: none; }
	.cvi-frise > .cvi-jalon, .cvi-frise > .cvi-jalon:nth-child(even) { margin-left: 0; }
	.cvi-jalon { padding: 22px 20px 24px; }
	.cvi-jalon::before { top: 0; left: 0; right: 0; width: auto; height: 2px; background: linear-gradient(90deg, #0C67DE, #56B5EB); }
	.wp-site-blocks .cvi-jalon > p.cvi-jalon__quand,
	.cvi-frise > .cvi-jalon:nth-child(even) > p.cvi-jalon__quand {
		position: static;
		width: auto;
		margin-block: 0 8px;
		text-align: left;
	}
	.wp-site-blocks .cvi-jalon > p.cvi-jalon__txt {font-size: 15px; line-height: 1.7;}
}
@media (prefers-reduced-motion: reduce) {
	.cvi-ceremonie, .cvi-ceremonie::after, .cvi-jalon, .cvi-frise::after { transition: none; }
	.cvi-ceremonie:hover, .cvi-ceremonie:focus-within, .cvi-jalon:hover, .cvi-jalon:focus-within { transform: none; }
	.cvi-frise::after { height: calc(100% - 28px); }
}

/* --- Les trois references : meme carte que les ceremonies, en trois colonnes
   et avec une photo en tete. Aucun kit neuf, une seule variante. --- */
.cvi-ceremonies.cvi-ceremonies--trois { grid-template-columns: repeat(3, 1fr); }
.cvi-ceremonie.cvi-ceremonie--photo { padding: 0; }
.wp-site-blocks .cvi-ceremonie--photo > figure.cvi-ceremonie__img {
	position: relative;
	z-index: 2;
	margin: 0;
	width: 100%;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #04081f;
}
.cvi-ceremonie--photo > figure.cvi-ceremonie__img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s cubic-bezier(.2, .7, .3, 1);
}
.cvi-ceremonie--photo:hover > figure.cvi-ceremonie__img img,
.cvi-ceremonie--photo:focus-within > figure.cvi-ceremonie__img img { transform: scale(1.06); }
.cvi-ceremonie--photo > figure.cvi-ceremonie__img::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 44%, rgba(0, 0, 0, .6) 100%);
}
.wp-site-blocks .cvi-ceremonie--photo > .cvi-ceremonie__corps { position: relative; z-index: 2; padding: 24px 24px 26px; display: flex; flex-direction: column; gap: 10px; flex: 1 1 auto; }
.wp-site-blocks .cvi-ceremonie--photo > .cvi-ceremonie__corps > * { margin-block: 0; }
.wp-site-blocks .cvi-ceremonie--photo .cvi-ceremonie__corps > p.cvi-ceremonie__cle {
	font-family: Montserrat, sans-serif; font-size: 11.5px; font-weight: 700;
	letter-spacing: .2em; text-transform: uppercase; color: #56B5EB;
}
.wp-site-blocks .cvi-ceremonie--photo .cvi-ceremonie__corps > h3.cvi-ceremonie__titre {
	font-size: var(--cv2-t-vignette); font-weight: 700; line-height: 1.25; color: #FFFFFF; text-transform: none;
}
.cvi-ceremonie--photo .cvi-ceremonie__corps h3.cvi-ceremonie__titre a { color: inherit; text-decoration: none; }
.cvi-ceremonie--photo .cvi-ceremonie__corps h3.cvi-ceremonie__titre a::after { content: ""; position: absolute; inset: 0; z-index: 4; }
.cvi-ceremonie--photo .cvi-ceremonie__corps h3.cvi-ceremonie__titre a:focus { outline: none; }
.cvi-ceremonie--photo .cvi-ceremonie__corps h3.cvi-ceremonie__titre a:focus-visible::after { box-shadow: inset 0 0 0 2px rgba(86, 181, 235, .95); }
.wp-site-blocks .cvi-ceremonie--photo .cvi-ceremonie__corps > p.cvi-ceremonie__txt {
	font-family: Montserrat, sans-serif; font-size: 15px; line-height: 1.7; color: #CFD1EA;
}
.wp-site-blocks .cvi-ceremonie--photo .cvi-ceremonie__corps > p.cvi-ceremonie__aller {
	margin-block: auto 0; padding-top: 12px;
	font-family: Montserrat, sans-serif; font-size: 13px; font-weight: 700;
	letter-spacing: .1em; text-transform: uppercase; color: #56B5EB;
}
@media (max-width: 1099px) {
	.cvi-ceremonies.cvi-ceremonies--trois { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 780px) {
	.cvi-ceremonies.cvi-ceremonies--trois { grid-template-columns: 1fr; }
}

/* Le barometre de cette page a ses PROPRES montants : sans redeclaration, les
   barres garderaient celles du 14 juillet et ne correspondraient plus aux
   libelles, sans la moindre erreur visible (piege F9). Echelle 0 - 35 000 EUR. */

/* La note sous la frise : c est la nuance que le client a demandee - trois
   semaines est un plancher, pas une limite. Elle porte donc un filet d accent. */
.wp-site-blocks p.cvi-note {
	position: relative;
	margin-block: 34px 0;
	margin-inline: auto;
	max-width: 88ch;
	box-sizing: border-box;
	padding: 20px 24px 20px 26px;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .1);
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: #CFD1EA;
}
.cvi-note::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 3px;
	background: linear-gradient(180deg, #0C67DE, #56B5EB);
}
@media (max-width: 780px) {
	.wp-site-blocks p.cvi-note { font-size: 14.5px; padding: 17px 18px 17px 20px; margin-block: 22px 0; }
}

/* ⛔ Piege C15bis, paye une fois de plus : les regles de resorption ecrites pour
   TROIS portes par rangee continuent de s appliquer au palier ou la grille en
   met DEUX, et leur specificite (0,5,0) bat celle du palier (0,4,0). Mesure a
   768 : la derniere rangee des preuves laissait 366px de vide.
   Parade : annuler explicitement les regles 3n, puis poser celle du reste sur
   deux colonnes A UNE SPECIFICITE AU MOINS EGALE et APRES - la classe est
   doublee pour cela. Generique : 3, 4, 5 ou 6 entrees, aucune rangee creuse. */
@media (min-width: 781px) and (max-width: 1099px) {
	.cvj-portes .cvj-portes__liste > .cvj-porte:last-child:nth-child(3n + 1),
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1),
	.cvj-portes .cvj-portes__liste > .cvj-porte:nth-last-child(2):nth-child(3n + 1) ~ .cvj-porte { grid-column: span 3; }
	.cvj-portes .cvj-portes__liste > .cvj-porte.cvj-porte:last-child:nth-child(odd) { grid-column: span 6; }
}

/* Entre 700 et 780px les cartes gardent DEUX colonnes : mesure a 768, une
   colonne unique donnait une page de pres de 10 000px. Bloc place apres celui
   de 780px - a specificite egale, l ordre tranche. */
@media (min-width: 700px) and (max-width: 780px) {
	.cvi-ceremonies { grid-template-columns: repeat(2, 1fr); gap: 16px; }
	.cvi-ceremonies.cvi-ceremonies--trois { grid-template-columns: repeat(2, 1fr); }
	/* trois references sur deux colonnes : la derniere prendrait la rangee seule.
	   Elle s etale donc sur les deux, en composition horizontale. */
	.cvi-ceremonies--trois > .cvi-ceremonie:last-child:nth-child(odd) { grid-column: span 2; display: grid; grid-template-columns: .46fr .54fr; }
	.cvi-ceremonies--trois > .cvi-ceremonie:last-child:nth-child(odd) > figure.cvi-ceremonie__img { aspect-ratio: auto; height: 100%; }
}

/* ---------------------------------------------------------------------------
   Le rail des articles rend desormais les boutons de PARTAGE de la fiche
   (LinkedIn, Facebook, X, courriel, copier) au lieu des liens de suivi.
   Un seul jeu de boutons pour tout le site, un seul endroit a maintenir.
   Il reste VERTICAL en desktop et bascule en bande horizontale sous 1100px,
   comme la version precedente - un rail fixe y mangeait 17 % du viewport.
   ⚠️ Les regles d origine du partage valent (0,2,0) et (0,2,1) : celles-ci
   sont ecrites a une specificite au moins egale ET apres.
   --------------------------------------------------------------------------- */
.cvj-rs--partage { padding: 14px 10px 16px; }
.cvj-rs--partage .cvs-partage { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.wp-site-blocks .cvj-rs--partage p.cvs-partage__t {
	margin-block: 0;
	font-size: 10px;
	letter-spacing: .16em;
	text-align: center;
}
.cvj-rs--partage .cvs-partage__l { flex-direction: column; flex-wrap: nowrap; gap: 6px; }
/* L infobulle du bouton copier part vers la GAUCHE : le rail est colle au bord
   droit, une infobulle centree au-dessus sortirait de l ecran. */
.cvj-rs--partage .cvs-partage__dit {
	left: auto;
	right: calc(100% + 10px);
	bottom: auto;
	top: 50%;
	transform: translateY(-50%);
}
@media (max-width: 1099px) {
	.cvj-rs--partage { padding: 24px 20px; }
	.cvj-rs--partage .cvs-partage { flex-direction: row; align-items: center; gap: 16px; }
	.cvj-rs--partage .cvs-partage__l { flex-direction: row; }
	.cvj-rs--partage .cvs-partage__dit {
		left: 50%;
		right: auto;
		bottom: calc(100% + 8px);
		top: auto;
		transform: translateX(-50%);
	}
}

/* ------- FAQ : bande pleine (piste C, validee par le client le 2026-08-21) -------
   Le style porte sur le BLOC NATIF core/details, sans aucune classe a taper : il
   couvre d un coup les 49 contenus qui en portent un, francais et anglais,
   presents et futurs. L ancien kit .cvh-faq__item, qui n existait que sur 5
   pages, a ete supprime : un seul design de FAQ vit desormais dans le site.
   L accordeon a un seul volet ouvert est deja pose sur .wp-block-details dans
   accueil.js - rien a changer cote script, et il fonctionne sans JS. */

/* Les bandes doivent se toucher : blockGap du coeur neutralise (0,2,1 > 0,2,0). */
.wp-site-blocks details.wp-block-details { margin-block: 0; }

.wp-site-blocks .wp-block-details {
	position: relative;
	background: rgba(255, 255, 255, 0.018);
	/* la bordure est reservee des l etat ferme : aucun decalage a l ouverture */
	border-left: 3px solid transparent;
	transition: background 0.3s ease, border-left-color 0.3s ease;
}
.wp-site-blocks .wp-block-details:nth-of-type(even) { background: transparent; }
.wp-site-blocks .wp-block-details + .wp-block-details { border-top: 1px solid rgba(86, 181, 235, 0.10); }
.wp-site-blocks .wp-block-details[open] { background: rgba(12, 103, 222, 0.10); border-left-color: #0C67DE; }

.wp-site-blocks .wp-block-details > summary {
	list-style: none;
	cursor: pointer;
	position: relative;
	padding: 17px 76px 17px 18px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.45;
	color: #FFFFFF;
	transition: color 0.25s ease;
}
.wp-site-blocks .wp-block-details > summary::-webkit-details-marker { display: none; }
.wp-site-blocks .wp-block-details > summary::marker { content: ""; }
.wp-site-blocks .wp-block-details[open] > summary { color: #56B5EB; }
.wp-site-blocks .wp-block-details > summary:focus-visible { outline: 2px solid #56B5EB; outline-offset: -2px; }

/* Chevron : seule affordance de la bande, il doit rester visible. */
.wp-site-blocks .wp-block-details > summary::after {
	content: "";
	position: absolute;
	right: 20px;
	top: 50%;
	width: 9px;
	height: 9px;
	border-right: 1px solid #56B5EB;
	border-bottom: 1px solid #56B5EB;
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.3s ease, border-color 0.3s ease;
}
.wp-site-blocks .wp-block-details[open] > summary::after {
	transform: translateY(-20%) rotate(-135deg);
	border-color: #56B5EB;
}

.wp-site-blocks .wp-block-details > :not(summary) {
	margin: 0;
	padding: 0 76px 20px 18px;
	max-width: 82ch;
	font-size: 14.5px;
	line-height: 1.7;
	color: #DADCEF;
}
.wp-site-blocks .wp-block-details > :not(summary) + :not(summary) { padding-top: 12px; }

/* Chiffre fantome : decor, jamais une information. Sans :has() il ne s affiche
   pas du tout - un numero faux serait pire qu aucun numero. */
@supports selector(:has(*)) {
	.wp-site-blocks .wp-block-group:has(> details.wp-block-details),
	.wp-site-blocks .entry-content:has(> details.wp-block-details),
	.wp-site-blocks main:has(> details.wp-block-details) { counter-reset: cvfaq; }
	.wp-site-blocks .wp-block-details { counter-increment: cvfaq; }
	.wp-site-blocks .wp-block-details > summary::before {
		content: counter(cvfaq, decimal-leading-zero);
		position: absolute;
		right: 46px;
		top: 50%;
		transform: translateY(-50%);
		font-size: 30px;
		font-weight: 800;
		line-height: 1;
		letter-spacing: -0.02em;
		color: rgba(86, 181, 235, 0.13);
		pointer-events: none;
	}
	.wp-site-blocks .wp-block-details[open] > summary::before { color: rgba(86, 181, 235, 0.18); }
}

@media (max-width: 900px) {
	.wp-site-blocks .wp-block-details > summary { padding: 15px 58px 15px 16px; font-size: 14.5px; }
	.wp-site-blocks .wp-block-details > :not(summary) { padding: 0 22px 18px 16px; }
	@supports selector(:has(*)) {
		.wp-site-blocks .wp-block-details > summary::before { right: 38px; font-size: 24px; }
	}
}
@media (max-width: 560px) {
	.wp-site-blocks .wp-block-details > summary { padding-right: 42px; }
	@supports selector(:has(*)) {
		.wp-site-blocks .wp-block-details > summary::before { display: none; }
	}
}
@media (prefers-reduced-motion: reduce) {
	.wp-site-blocks .wp-block-details,
	.wp-site-blocks .wp-block-details > summary,
	.wp-site-blocks .wp-block-details > summary::after { transition: none !important; }
}

/* =======================================================================
   KIT .cve-* - PAGE MERE EVENEMENTIEL (144), 2026-08-21
   Parti « la regie » valide par le client : un grand visuel a gauche qui
   bascule en fondu au parcours des cinq lignes de droite.
   ETAT DE REPOS SANS JS : la premiere vue est visible et les cinq lignes
   sont des liens pleinement utilisables. Le script ne fait qu ajouter le
   basculement ; s il ne tourne pas, la section reste entiere.
   ======================================================================= */

/* Le cran clair du rail de fonds, cf. celesta-da-bleu-indigo */
.cvh-sec--marine { background: #0D124F; }

/* ---------------- La regie ---------------- */
.cve-regie .cve-regie__jeu {
	display: grid;
	grid-template-columns: minmax(0, 43%) minmax(0, 1fr);
	gap: 36px;
	align-items: stretch;
	margin-top: 44px;
}
.wp-site-blocks .cve-regie .cve-regie__jeu > * { margin-block: 0; }

.cve-regie .cve-regie__vue {
	position: relative;
	overflow: hidden;
	min-height: 430px;
	border: 1px solid rgba(86, 181, 235, 0.18);
	background: #04061f;
}
.wp-site-blocks .cve-regie .cve-regie__vue > * { margin-block: 0; }
.cve-regie .cve-regie__vue figure {
	position: absolute;
	inset: 0;
	margin: 0;
	opacity: 0;
	transform: scale(1.04);
	transition: opacity 0.6s ease, transform 1.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}
/* repos SANS script : la premiere vue tient la place */
.cve-regie .cve-regie__vue figure:first-child { opacity: 1; transform: none; }
.cve-regie .cve-regie__vue figure.cve-vu { opacity: 1; transform: none; }
/* des que le script prend la main, seule .cve-vu decide */
.cve-regie--pret .cve-regie__vue figure:first-child { opacity: 0; transform: scale(1.04); }
.cve-regie--pret .cve-regie__vue figure.cve-vu { opacity: 1; transform: none; }
.cve-regie .cve-regie__vue figure img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* voile NOIR, jamais bleute (regle client du 2026-08-21) */
.cve-regie .cve-regie__vue::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.06) 34%, rgba(0, 0, 0, 0.28) 66%, rgba(0, 0, 0, 0.78) 100%);
}
/* bande speculaire : le verre qui passe */
.cve-regie .cve-regie__vue::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -30%;
	width: 26%;
	z-index: 3;
	pointer-events: none;
	transform: skewX(-14deg);
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.10), transparent);
	animation: cveLustre 6.5s ease-in-out 1.2s infinite;
}
@keyframes cveLustre {
	0% { left: -30%; }
	38% { left: 118%; }
	100% { left: 118%; }
}

.cve-regie .cve-regie__liste { display: flex; flex-direction: column; }
.wp-site-blocks .cve-regie .cve-regie__liste > * { margin-block: 0; }
.cve-regie .cve-ligne {
	position: relative;
	padding: 19px 22px 19px 18px;
	border-top: 1px solid rgba(86, 181, 235, 0.14);
	border-left: 3px solid transparent;
	cursor: pointer;
	transition: background 0.35s ease, border-left-color 0.35s ease;
}
.cve-regie .cve-ligne:last-child { border-bottom: 1px solid rgba(86, 181, 235, 0.14); }
.wp-site-blocks .cve-regie .cve-ligne > * { margin-block: 0; }
.cve-regie .cve-ligne__titre {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: #FFFFFF;
	margin: 0;
	transition: color 0.3s ease;
}
.cve-regie .cve-ligne__titre a { color: inherit; text-decoration: none; }
.cve-regie .cve-ligne__titre a::after { content: ""; position: absolute; inset: 0; }
.cve-regie .cve-ligne p.cve-ligne__txt {
	margin: 8px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: #B2B5D7;
	max-width: 62ch;
}
.cve-regie .cve-ligne p.cve-ligne__accroche {
	margin: 0;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	font-size: 13.5px;
	line-height: 1.6;
	color: #56B5EB;
	transition: max-height 0.45s ease, opacity 0.35s ease, margin 0.45s ease;
}
.cve-regie .cve-ligne.cve-actif {
	background: rgba(12, 103, 222, 0.10);
	border-left-color: #0C67DE;
}
.cve-regie .cve-ligne.cve-actif .cve-ligne__titre { color: #56B5EB; }
.cve-regie .cve-ligne.cve-actif p.cve-ligne__accroche { max-height: 96px; opacity: 1; margin-top: 9px; }
.cve-regie .cve-ligne:focus-within { outline: 2px solid #56B5EB; outline-offset: -2px; }

/* ---------------- Diptyque des deux disciplines ---------------- */
.cve-duo .cve-duo__jeu {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 26px;
	margin-top: 40px;
}
.wp-site-blocks .cve-duo .cve-duo__jeu > * { margin-block: 0; }
.cve-duo .cve-duo__volet {
	position: relative;
	overflow: hidden;
	padding: 30px 28px 34px;
	border: 1px solid rgba(86, 181, 235, 0.20);
	background: linear-gradient(158deg, rgba(86, 181, 235, 0.10), rgba(0, 2, 30, 0.52));
	-webkit-backdrop-filter: blur(10px) saturate(140%);
	backdrop-filter: blur(10px) saturate(140%);
	transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.5s ease, box-shadow 0.5s ease;
}
.wp-site-blocks .cve-duo .cve-duo__volet > * { margin-block: 0; }
/* le MIROIR : le volet est pose sur une surface qui le renvoie */
.cve-duo .cve-duo__volet::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 42%;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(86, 181, 235, 0.10), rgba(86, 181, 235, 0) 62%);
	transform: scaleY(-1);
	opacity: 0.85;
}
.cve-duo .cve-duo__volet::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 2px;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.cve-duo .cve-duo__volet:hover { transform: translateY(-4px); border-color: rgba(86, 181, 235, 0.38); box-shadow: 0 30px 62px rgba(0, 0, 0, 0.55); }
.cve-duo .cve-duo__volet:hover::before { transform: scaleX(1); }
.cve-duo p.cve-duo__eti {
	margin: 0 0 10px;
	font-size: 10.5px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #56B5EB;
}
.cve-duo .cve-duo__titre { margin: 0 0 12px; font-size: 22px; font-weight: 700; color: #FFFFFF; }
.cve-duo p.cve-duo__txt { margin: 0 0 16px; font-size: 15px; line-height: 1.7; color: #DADCEF; }
.cve-duo p.cve-duo__lien { margin: 0; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; }
.cve-duo p.cve-duo__lien a { color: #56B5EB; text-decoration: none; border-bottom: 1px solid rgba(86, 181, 235, 0.45); padding-bottom: 3px; transition: color 0.25s ease, border-color 0.25s ease; }
.cve-duo p.cve-duo__lien a:hover { color: #FFFFFF; border-bottom-color: #FFFFFF; }
.cve-duo p.cve-duo__pied {
	margin: 30px 0 0;
	padding: 20px 24px;
	border-left: 3px solid #0C67DE;
	background: rgba(12, 103, 222, 0.08);
	font-size: 15px;
	line-height: 1.7;
	color: #E3E5F9;
	max-width: 92ch;
}

/* ---------------- Les quatre gains ---------------- */
.cve-gains .cve-gains__grille {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	margin-top: 40px;
}
.wp-site-blocks .cve-gains .cve-gains__grille > * { margin-block: 0; }
.cve-gains .cve-gain {
	position: relative;
	padding: 26px 22px 28px;
	border: 1px solid rgba(86, 181, 235, 0.18);
	background: rgba(0, 2, 30, 0.42);
	transition: background 0.4s ease, border-color 0.4s ease, transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.wp-site-blocks .cve-gains .cve-gain > * { margin-block: 0; }
.cve-gains .cve-gain:hover { background: rgba(0, 2, 30, 0.62); border-color: rgba(86, 181, 235, 0.36); transform: translateY(-3px); }
.cve-gains p.cve-gain__n {
	margin: 0 0 14px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.08em;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.cve-gains .cve-gain__titre { margin: 0 0 10px; font-size: 17px; font-weight: 700; color: #FFFFFF; }
.cve-gains p.cve-gain__txt { margin: 0; font-size: 15px; line-height: 1.7; color: #C2C5E1; }

/* ---------------- Les deux horloges ---------------- */
.cve-horloges .cve-horloges__frise {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin-top: 40px;
}
.wp-site-blocks .cve-horloges .cve-horloges__frise > * { margin-block: 0; }
.cve-horloges .cve-jalon {
	position: relative;
	padding: 30px 26px 30px 30px;
	border: 1px solid rgba(86, 181, 235, 0.20);
	background: linear-gradient(165deg, rgba(86, 181, 235, 0.09), rgba(0, 0, 0, 0.36));
	overflow: hidden;
}
.wp-site-blocks .cve-horloges .cve-jalon > * { margin-block: 0; }
.cve-horloges .cve-jalon::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: linear-gradient(180deg, #0C67DE, #56B5EB);
}
.cve-horloges p.cve-jalon__nb {
	margin: 0;
	font-size: clamp(28px, 3.2vw, 40px);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.02em;
	background: linear-gradient(90deg, #56B5EB, #F3F4F9);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.cve-horloges p.cve-jalon__unite {
	margin: 8px 0 14px;
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #56B5EB;
}
.cve-horloges p.cve-jalon__txt { margin: 0; font-size: 15px; line-height: 1.7; color: #DADCEF; }
.cve-horloges p.cve-horloges__note {
	margin: 30px 0 0;
	padding: 20px 24px;
	border: 1px solid rgba(86, 181, 235, 0.22);
	background: rgba(12, 103, 222, 0.07);
	font-size: 15px;
	line-height: 1.7;
	color: #E3E5F9;
	max-width: 92ch;
}

/* ---------------- Paliers ---------------- */
@media (max-width: 1100px) {
	.cve-regie .cve-regie__jeu { grid-template-columns: 1fr; gap: 26px; }
	.cve-regie .cve-regie__vue { min-height: 300px; }
	.cve-gains .cve-gains__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
	.cve-duo .cve-duo__jeu { grid-template-columns: 1fr; }
	.cve-horloges .cve-horloges__frise { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.cve-gains .cve-gains__grille { grid-template-columns: 1fr; }
	.cve-regie .cve-ligne { padding: 16px 16px 16px 15px; }
	.cve-regie .cve-ligne__titre { font-size: 15.5px; }
	.cve-regie .cve-regie__vue { min-height: 220px; }
	.cve-duo .cve-duo__volet { padding: 24px 20px 28px; }
}
@media (prefers-reduced-motion: reduce) {
	.cve-regie .cve-regie__vue::after { animation: none !important; }
	.cve-regie .cve-regie__vue figure,
	.cve-regie .cve-ligne,
	.cve-regie .cve-ligne p.cve-ligne__accroche,
	.cve-duo .cve-duo__volet,
	.cve-duo .cve-duo__volet::before,
	.cve-gains .cve-gain { transition: none !important; }
}

/* ======================= RETOUCHES DU 2026-08-21 (demande client) =======================
   1. AIR AU-DESSUS DU CALENDRIER. Une regle generique du kit Collectivites,
      « .cvh-sec + .cvh-sec--abysse .cvh-int », met a ZERO le retrait haut de toute
      section abysse precedee d une section. Elle n est neutralisee que sur les pages
      .cvh-coll, pas ici : le surtitre se collait au bord. Mesure : 0 px sur la section
      des horloges contre 104 px sur les quatre autres. On reprend la valeur commune.
   2. La section des gains recoit une photographie de fond, voile NOIR (regle client).
   3. Les quatre cartes deviennent des plaques de verre posees sur un miroir, avec
      halo qui suit le curseur et legere inclinaison 3D. Etat de repos : halo centre
      en haut, aucune rotation - la carte est entiere si le script ne tourne pas.
   ====================================================================================== */

.wp-site-blocks .cve-horloges > .cvh-int { padding-top: clamp(64px, 8vw, 104px); }

.cve-gains {
	position: relative;
	isolation: isolate;
	background-color: #0D124F;
	background-image: url("/wp-content/uploads/2026/03/celesta-spectacle-9__optim.webp");
	background-size: cover;
	background-position: center 42%;
	background-repeat: no-repeat;
}
/* voile NOIR a deux couches : verticale pour la lisibilite, horizontale pour les bords */
.cve-gains::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		linear-gradient(180deg, rgba(0, 0, 0, 0.86) 0%, rgba(0, 0, 0, 0.84) 38%, rgba(0, 0, 0, 0.34) 52%, rgba(0, 0, 0, 0.34) 78%, rgba(0, 0, 0, 0.74) 100%),
		linear-gradient(90deg, rgba(0, 0, 0, 0.44), rgba(0, 0, 0, 0.08) 44%, rgba(0, 0, 0, 0.44));
}
/* Pas de min-height : une hauteur imposee dont le contenu ne remplit pas EST le
   defaut de vide refuse par le client. On agrandit par le RETRAIT, qui laisse
   voir la photographie et grandit avec le contenu. */
.cve-gains > .cvh-int { position: relative; z-index: 1; padding-block: clamp(120px, 14vw, 200px); }

.cve-gains .cve-gain {
	overflow: hidden;
	border-color: rgba(86, 181, 235, 0.24);
	background:
		radial-gradient(320px circle at var(--cvh-mx, 50%) var(--cvh-my, 0%), rgba(86, 181, 235, 0.10), transparent 68%),
		linear-gradient(158deg, rgba(10, 14, 54, 0.90), rgba(0, 2, 30, 0.94) 62%);
	-webkit-backdrop-filter: blur(14px) saturate(150%);
	backdrop-filter: blur(14px) saturate(150%);
	box-shadow: 0 26px 54px rgba(0, 0, 0, 0.46);
	transform: perspective(900px) rotateX(var(--cvh-rx, 0deg)) rotateY(var(--cvh-ry, 0deg));
	transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1), border-color 0.45s ease, box-shadow 0.45s ease, background 0.45s ease;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.cve-gains .cve-gain { background: linear-gradient(158deg, rgba(30, 34, 78, 0.96), rgba(0, 2, 30, 0.96)); }
}
/* arete haute qui s allume au survol */
.cve-gains .cve-gain::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 2px;
	z-index: 2;
	background: linear-gradient(90deg, #0C67DE, #56B5EB);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
}
/* le MIROIR : la plaque est posee sur une surface qui la renvoie */
.cve-gains .cve-gain::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 46%;
	z-index: 0;
	pointer-events: none;
	opacity: 0.9;
	background: linear-gradient(180deg, rgba(86, 181, 235, 0.15), rgba(86, 181, 235, 0) 66%);
	transform: scaleY(-1);
	transition: opacity 0.45s ease;
}
.cve-gains .cve-gain > * { position: relative; z-index: 1; }
.cve-gains .cve-gain:hover {
	border-color: rgba(86, 181, 235, 0.46);
	box-shadow: 0 38px 74px rgba(0, 0, 0, 0.58);
	transform: perspective(900px) rotateX(var(--cvh-rx, 0deg)) rotateY(var(--cvh-ry, 0deg)) translateY(-3px);
}
.cve-gains .cve-gain:hover::before { transform: scaleX(1); }
.cve-gains .cve-gain:hover::after { opacity: 1; }
/* le chiffre gagne en presence sur la photographie */
.cve-gains p.cve-gain__n {
	display: inline-block;
	font-size: 14px;
	letter-spacing: 0.12em;
	/* Sur la photographie, le degrade indigo du chiffre tombait a 1,36 de contraste
	   sur le haut de carte (mesure au canvas, pire pixel). Rampe claire imposee. */
	background: linear-gradient(90deg, #56B5EB, #F3F4F9);
	/* ATTENTION : la propriete raccourcie background REINITIALISE background-clip.
	   Sans ces deux lignes le degrade peint toute la boite au lieu du chiffre, qui
	   reste transparent : un rectangle clair apparait. Defaut vu par le client. */
	-webkit-background-clip: text;
	background-clip: text;
}
.cve-gains p.cve-gain__txt { color: #D3D5EC; }

@media (max-width: 600px) {
	.cve-gains { background-position: center 50%; }
	.cve-gains .cve-gain::after { height: 38%; }
}
@media (prefers-reduced-motion: reduce) {
	.cve-gains .cve-gain,
	.cve-gains .cve-gain::before,
	.cve-gains .cve-gain::after { transition: none !important; }
	.cve-gains .cve-gain { transform: none !important; }
}



/* =================================================================================
   BOUTONS - PAIRES DE MEME LONGUEUR SUR TOUT LE SITE (demande client 2026-08-24)
   Generalise a tous les kits la parade qui n existait que sur .cvh-coll (min-width
   250px en dur), mais SANS valeur figee : la grille a colonnes egales donne aux
   deux boutons la largeur du libelle le plus long, donc une reecriture de texte
   ne peut pas les desequilibrer. L etirement de la rangee egalise aussi les
   HAUTEURS : la bordure de 1px du bouton fantome ne creuse plus d ecart.
   Groupes a un seul bouton (400 des 428 du site) : comportement inchange.
   ============================================================================= */
.wp-site-blocks .wp-block-buttons {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	/* Le coeur pose align-items: center par .is-layout-flex (0,1,0) : sans cette
	   redeclaration, la bordure de 1px du bouton fantome laisse 2px d ecart. */
	align-items: stretch;
	width: max-content;
	max-width: 100%;
}
.wp-site-blocks .wp-block-buttons > .wp-block-button { display: flex; width: 100%; }
.wp-site-blocks .wp-block-buttons > .wp-block-button > .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	text-align: center;
	box-sizing: border-box;
}

/* Un groupe centre ne peut plus l etre par justify-content : la grille a
   largueur intrinseque remplit ses pistes. Le centrage passe par les marges.
   Perimetre releve : 2 groupes, tous deux sur l accueil. */
.wp-site-blocks .wp-block-buttons.is-content-justification-center,
.wp-site-blocks .cvh-centre,
.wp-site-blocks .cvh-bandeau__panneau--centre > .wp-block-buttons,
.wp-site-blocks .cvh-coll .cvh-bandeau__panneau--nu > .wp-block-buttons { margin-inline: auto; }

@media (max-width: 560px) {
	/* Empiles : grid-auto-rows 1fr pour que les deux gardent la MEME hauteur,
	   meme quand un libelle long passe sur deux lignes (15px d ecart sinon). */
	.wp-site-blocks .wp-block-buttons { grid-auto-flow: row; grid-auto-rows: 1fr; width: 100%; }
	.wp-site-blocks .cvh-coll .wp-block-button__link { min-width: 0; }
}


/* =========================================================================
   COUPURE DES TITRES - regle TRANSVERSE, ajoutee le 26/08 sur demande client
   ⛔⛔ Reproche : des titres coupes sur plusieurs lignes, et coupes AU
   MAUVAIS ENDROIT - au milieu d un groupe de mots, ou avec un article seul
   en fin de ligne.
   ⭐ `text-wrap: balance` repartit les mots a egalite entre les lignes et
   supprime les orphelins. Il ne change PAS le nombre de lignes : aucune
   hauteur de section ni aucun budget de heros n en est affecte. Les
   navigateurs qui ne le connaissent pas l ignorent sans effet de bord.
   ⚠️ La VRAIE cause d un titre a trois lignes n est presque jamais la
   coupure : c est une largeur bornee en `ch` posee sur le titre. Une mesure
   en caracteres vaut pour un PARAGRAPHE, jamais pour un titre.
   ========================================================================= */
.wp-site-blocks h1,
.wp-site-blocks h2,
.wp-site-blocks h3,
.wp-site-blocks h4 { text-wrap: balance; }


/* ---------- RETRAIT DES PICTOS DES MARQUEURS (demande client du 27/08) ----------
   Le pseudo-element qui portait le picto est neutralise, et le retrait gauche
   qu il reservait (62 px en bureau, 56 px sous 781) est rendu au texte.
   Les variables --cvh-picto restent definies sur les trois modificateurs :
   le retour arriere ne demande que de supprimer ce bloc.
   Le composant .cvh-marqueur ne sert QUE la page 114. */
.wp-site-blocks .cvh-marqueur::before,
.wp-site-blocks .cvh-marqueur:hover::before {
	content: none;
}
.wp-site-blocks .cvh-marqueur {
	padding: 17px 22px;
}
@media (max-width: 781px) {
	.wp-site-blocks .cvh-marqueur {
		padding: 15px 18px;
	}
}


/* ---------- TITRE DE FICHE : LA TAILLE SUIT LA LONGUEUR (27/08) ----------
   ⛔⛔ Le titre etait borne a 15ch. Un titre ne se borne JAMAIS en
   caracteres : sur la fiche Flyboard, 15ch valaient 575 px dans une colonne
   de 1068, soit 635 px inutilises, et le nom propre Chimelong Park se
   retrouvait coupe en deux. Troisieme occurrence de cette faute.
   La largeur passe en px, et le mu-plugin publie --cvs-titre-px calcule
   depuis la longueur du titre (37 a 77 caracteres sur le corpus) pour viser
   DEUX lignes. Repli sur le jeton de charte si la variable manque. */
.wp-site-blocks .cvs-hero h1.cvs-hero__titre {
	font-size: var(--cvs-titre-px, var(--cvs-t1));
}


/* ---------- HAUTEUR UNIQUE DES BOUTONS SUR TOUT LE SITE (client, 27/08) ----------
   Regle client rappelee TROIS fois. Mesure avant correctif : QUATRE hauteurs
   coexistaient, parce que chaque kit posait son propre padding et sa propre
   taille de police : 39 px (.cvh-coll), 45 px (.cvh-, .cvp-), 46,5 px (.cva-,
   .cvn-) et 47 px (.cvd-, .cvt-, .cvm-, .cvg-).
   ⭐ Harmoniser les paddings ne tiendrait pas : la feuille suivante
   redivergerait. On impose donc la HAUTEUR, et le padding vertical ne decide
   plus de rien. La largeur reste libre : elle depend du libelle.
   ⚠ La classe est DOUBLEE pour valoir (0,4,0) : les feuilles de kit sont
   chargees APRES accueil.css et leurs regles valent (0,3,0). Sans ce cran,
   la regle serait battue par l ordre de chargement. */
.wp-site-blocks .wp-block-button .wp-block-button__link.wp-block-button__link {
	box-sizing: border-box;
	min-height: 47px;
	/* Le padding VERTICAL est neutralise : sans cela min-height n est qu un
	   plancher et les kits a padding 16px sortaient a 48 et 49 px. Le centrage
	   est assure par le flex, la hauteur devient exacte. */
	padding-block: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
@media (max-width: 780px) {
	.wp-site-blocks .wp-block-button .wp-block-button__link.wp-block-button__link {
		min-height: 44px;
	}
}


/* ---------- DEGRADE DE PRODUCTION SUR LES TITRES (client, 27/08) ----------
   Releve sur la production : linear-gradient(90deg, #0C67DE, #56B5EB) peint
   sur le texte par background-clip. Applique a tous les <mark> de titre :
   35 en H1, 287 en H2, 13 en H3, sur 35 pages.
   ⭐ Contrastes MESURES sur le fond nuit : extremite claire 8,15,
   extremite foncee 3,55. Les trois niveaux sont du GRAND TEXTE (62/800,
   42/700, 22/700), dont le seuil est 3,0 : conforme partout.
   ⚠ -webkit-text-fill-color est indispensable : les <mark> portent une
   couleur EN LIGNE dans le contenu, qui gagnerait sur toute regle de color.
   ⚠ Repli en #56B5EB (8,15) et non en #0C67DE comme la production :
   sans background-clip, le bleu fonce tomberait a 2,82. Rendu identique la
   ou le clip fonctionne, meilleur la ou il ne fonctionne pas. */
.wp-site-blocks :is(h1, h2, h3, h4) mark {
	background-image: linear-gradient(90deg, #0C67DE, #56B5EB);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: #56B5EB;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
	.wp-site-blocks :is(h1, h2, h3, h4) mark {
		background-image: none;
		-webkit-text-fill-color: currentColor;
	}
}


/* ---------- BASE UNIQUE DU TEXTE COURANT (client, 27/08) ----------
   Demande : meme taille partout, le client ajustera ensuite au cas par cas.
   Mesure AVANT : sur la 157, les paragraphes de PROSE sans classe de kit
   existaient en QUATRE tailles (14,5 / 15 / 18 / 22 px), et deux d entre
   elles se suivaient dans la meme colonne. Ils n etaient vises par aucune
   regle : ni celles des kits, ni la charte.
   ⭐ Le :not([class*="cv"]) laisse intacts les chapos et tous les libelles
   de composant, qui portent une classe de kit : ils gardent leur taille et
   restent ajustables un par un, ce qui est le but.
   ⚠️ Sur les listes, le :not porte sur le PARENT : un <li> de composant n a
   pas de classe, c est son <ul> qui en porte une. */
.wp-site-blocks .wp-block-post-content p:not([class*="cv"]),
.wp-site-blocks .wp-block-post-content ul:not([class*="cv"]) > li,
.wp-site-blocks .wp-block-post-content ol:not([class*="cv"]) > li {
	font-size: 15px;
	line-height: 1.7;
}

/* ---------- 404 : blocs colles, mesures a 0px (client, 27/08) ----------
   Le blockGap du coeur est neutralise sur le site ; ces trois blocs n avaient
   aucune marge propre et se touchaient. Qui neutralise redeclare.
   Scope a body.error404 : aucune autre page ne bouge. */
body.error404 .wp-site-blocks .cv4-hero .wp-block-cover__inner-container > .cv4-recherche { margin-block-start: 34px; }
body.error404 .wp-site-blocks .cv4-hero .wp-block-cover__inner-container > .cv4-actions { margin-block-start: 28px; }
body.error404 .cvh-sec--abysse .cvr-portes { margin-top: 34px; }
body.error404 .cv4-recherche .wp-block-search__label { margin-bottom: 14px; }

/* ---------- FICHE REALISATION : le bloc bas doit rester EN BAS (client, 27/08) ----------
   ⛔⛔ Regression introduite en retirant le fil d Ariane. .cvs-hero__int est en
   justify-content: space-between ; avec DEUX enfants (le fil en haut, ce bloc en bas)
   la repartition marchait. Le fil retire, il ne reste qu UN enfant : space-between le
   colle en HAUT et laisse 326px de vide dessous, ou l image est presque noire. Le
   client a vu une bande parasite - c etait du vide.
   ⭐ margin-top: auto le pousse en bas quel que soit le nombre d enfants : si le fil
   revient un jour, il reprend sa place en haut sans autre correctif. */
.cvs-hero .cvs-hero__bas { margin-top: auto; }

/* ---------- DEGRADE SUR LES TITRES DES FICHES ET DES ARTICLES (client, 28/08) ----------
   Le degrade de marque vit sur le <mark> des titres de PAGE. Les titres du corps
   des fiches de realisation et des articles n ont pas de <mark> : le degrade porte
   donc sur le titre ENTIER.
   ⭐ Contrastes calcules sur le fond NOIR de ces zones : extremite claire #56B5EB
   a 9,21, extremite foncee #0C67DE a 4,03. Les deux niveaux sont du grand texte
   (seuil 3,0) : conforme, et meilleur que sur le fond nuit des pages (3,55).
   ⚠ -webkit-text-fill-color est indispensable : sans lui la couleur declaree plus
   haut (#FFFFFF) gagnerait sur le clip.
   ⚠ Repli en #56B5EB la ou background-clip: text n existe pas. */
.wp-site-blocks .cvs-corps .cvs-lecture > h2,
.wp-site-blocks .cvs-corps .cvs-lecture > h3,
.wp-site-blocks .cvs-suite .cvs-entete h2.cvs-titre,
.wp-site-blocks .cvj-lecture .wp-block-post-content h2,
.wp-site-blocks .cvj-lecture .wp-block-post-content h3 {
	background-image: linear-gradient(90deg, #0C67DE, #56B5EB);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: #56B5EB;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
	.wp-site-blocks .cvs-corps .cvs-lecture > h2,
	.wp-site-blocks .cvs-corps .cvs-lecture > h3,
	.wp-site-blocks .cvs-suite .cvs-entete h2.cvs-titre,
	.wp-site-blocks .cvj-lecture .wp-block-post-content h2,
	.wp-site-blocks .cvj-lecture .wp-block-post-content h3 {
		background-image: none;
		-webkit-text-fill-color: currentColor;
		color: #56B5EB;
	}
}

/* ---------- TITRE DE FICHE : PLAFOND DE LARGEUR (2026-08-28) ----------
   ⛔⛔ --cvs-titre-px est publie en STYLE EN LIGNE par celesta-realisation-fiche.php
   (px = 2900 / nb de caracteres), calibre pour une colonne de 880 px. C est une
   valeur FIXE : aucune part responsive, et posee en ligne elle ecrase --cvs-t1,
   donc elle NEUTRALISE toutes les media queries du kit sur les 46 fiches.
   Mesure AVANT correctif, fiche d Arras (56 caracteres, 52 px publies) :
      375 px -> colonne 335, SIX lignes, 324 px de haut  (signale par le client)
      700 px -> colonne 368, CINQ lignes, 270 px
      768 px -> colonne 421, QUATRE lignes, 216 px
     1200 px -> colonne 853, DEUX lignes : le calibrage n est juste QU ICI.
   ⛔ Le rapport colonne/viewport change de REGIME a 700 px : 0,89 quand la carte
   de reperes passe sous le texte, 0,53 a 0,74 quand elle revient a cote. Une
   seule pente en vw ne peut donc pas couvrir les deux -- une premiere version
   ecrite en 8vw seul etait insuffisante entre 700 et 1024, corrigee ici.
   ⭐ Parade : un TROISIEME plafond proportionnel, le plus petit gagnant (regle
   I4), avec une pente PAR REGIME. Il converge vers la valeur publiee vers
   1100 px et redevient inerte au-dessus : desktop strictement inchange
   (verifie a 1200 et 1366 : deux lignes, 52 px, identique a avant).
   Meme specificite (0,3,1) que la regle du 27/08, ecrite APRES : elle gagne,
   sans media query pour le cas general -- donc aucun piege A4.
   Retour arriere : accueil.css.avant-titre-fiche-mobile.bak */
.wp-site-blocks .cvs-hero h1.cvs-hero__titre {
	font-size: min(var(--cvs-titre-px, var(--cvs-t1)), max(24px, 4.8vw));
}
/* Sous 700 px la carte de reperes passe SOUS le texte : la colonne remonte a
   89 % du viewport, la pente doit donc etre plus forte. */
@media (max-width: 699px) {
	.wp-site-blocks .cvs-hero h1.cvs-hero__titre {
		font-size: min(var(--cvs-titre-px, var(--cvs-t1)), max(24px, 8vw));
	}
}