/* =========================================================================
   Celesta v2 - kit « les deux horloges », page MERE du silo Sport et Culture
   (155). Prefixe .cvg-

   Distinct des trois kits voisins :
   .cva- (Savoir-faire)  : panneaux pleins, portes egales, dip image/texte
   .cvd- (Drone mere)    : trame de points, cartes photo verticales, jauges
   .cvt- (Drone filles)  : hero en split, chevauchement, timeline collante

   Ici la grammaire vient du sujet : DEUX HORLOGES OPPOSEES.
   - le heros pose sa plaque EN BAS et la fait MORDRE la photo d un cran ;
   - la signature est le FACE-A-FACE DECALE, deux colonnes dont la droite
     descend de 96px, separees par un axe vertical gradue ;
   - la frise est une BANDE DE MESURES a segments INEGAUX, la duree de
     chaque moment donnant sa largeur au segment.

   PARTI ASSUME, repris des filles drone : aucun texte n est jamais pose
   sur une photo. Toute plaque portant du texte est OPAQUE. Le contraste se
   calcule donc sur un aplat, jamais sur une image.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. SOCLE - blockGap, couleur de repli, jetons
   Point 1 de la check-list : sans ces quatre regles, une bande de fond de
   page separe le menu du heros. Douzieme recidive documentee.
   ------------------------------------------------------------------------- */
body:has(.cvg-hero) main,
body:has(.cvg-sec) main { margin-block-start: 0; }
body:has(.cvg-hero) .wp-block-post-content,
body:has(.cvg-sec) .wp-block-post-content { margin-block-start: 0; }

/* Point 3 : sans couleur de repli, tout element non colore herite du #111
   du theme et devient illisible sur fond sombre. */
.wp-site-blocks .cvg-hero,
.wp-site-blocks .cvg-sec,
.wp-site-blocks .cvg-appel { color: var(--cvg-texte); }
.wp-site-blocks .cvg-hero h1,
.wp-site-blocks .cvg-hero h2,
.wp-site-blocks .cvg-sec h2,
.wp-site-blocks .cvg-sec h3,
.wp-site-blocks .cvg-sec h4,
.wp-site-blocks .cvg-appel h2,
.wp-site-blocks .cvg-appel h3 { color: #ffffff; }

.cvg-hero, .cvg-sec, .cvg-appel {
	--cvg-texte: #DCDDEF;
	--cvg-trait: rgba(86, 181, 235, 0.24);
	--cvg-trait-fort: rgba(86, 181, 235, 0.58);
	--cvg-verre: rgba(255, 255, 255, 0.048);
	--cvg-bord: rgba(255, 255, 255, 0.13);
	--cvg-luisant: rgba(255, 255, 255, 0.32);
	--cvg-decal: 96px;
}

.cvg-int {
	max-width: 1280px;
	margin-inline: auto;
	box-sizing: border-box;
	padding: clamp(58px, 7vw, 96px) clamp(20px, 3.2vw, 32px);
}

.cvg-sec--noir   { background: #000000; }
.cvg-sec--abysse { background: var(--cv2-abysse); }
.cvg-sec--nuit   { background: var(--cv2-nuit); }
.cvg-sec--marine { background: var(--cv2-marine); }

/* overflow CLIP et non HIDDEN : hidden tuerait tout position sticky pose
   plus tard sous cette section. clip rogne pareil sans creer de conteneur
   de defilement. */
/* A1bis : les sections RACINE prennent elles-memes les 19,2px du coeur en
   tant qu enfants non-premiers de .wp-block-post-content. La neutralisation
   des enfants ne les couvre pas : liste EXPLICITE, jamais `> *` generique. */
.wp-site-blocks .wp-block-post-content > .cvg-hero,
.wp-site-blocks .wp-block-post-content > .cvg-sec,
.wp-site-blocks .wp-block-post-content > .cvg-appel { margin-block: 0; }

.wp-site-blocks .cvg-sec { position: relative; overflow: clip; }
.wp-site-blocks .cvg-sec > *:not(.cvg-fond) { position: relative; z-index: 1; }

/* -------------------------------------------------------------------------
   2. NEUTRALISATION DES MARGES DU COEUR
   Point 5 de la check-list. `:root :where(.is-layout-flow) > * + *` pose
   1,2em (19,2px) sur tout enfant a partir du second, en (0,2,0). Dans une
   GRILLE cette marge ne separe pas : elle RETRECIT l element, puisque
   align-items vaut normal donc stretch.
   La liste couvre TOUS les conteneurs du kit des sa creation, y compris ceux
   qui n ont qu un enfant aujourd hui. Le piege s est represente trois fois
   sur le silo precedent faute de l avoir fait d emblee.
   QUI NEUTRALISE REDECLARE : les respirations voulues sont reposees au
   paragraphe 3, a specificite egale, APRES ce bloc.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-hero > *,
.wp-site-blocks .cvg-hero__int > *,
.wp-site-blocks .cvg-hero__plaque > *,
.wp-site-blocks .cvg-hero__reperes > *,
.wp-site-blocks .cvg-sec > *,
.wp-site-blocks .cvg-int > *,
.wp-site-blocks .cvg-tete > *,
.wp-site-blocks .cvg-duo > *,
.wp-site-blocks .cvg-col > *,
.wp-site-blocks .cvg-mesures > *,
.wp-site-blocks .cvg-mesure > *,
.wp-site-blocks .cvg-terrains > *,
.wp-site-blocks .cvg-terrain > *,
.wp-site-blocks .cvg-terrain__corps > *,
.wp-site-blocks .cvg-lignes > *,
.wp-site-blocks .cvg-ligne > *,
.wp-site-blocks .cvg-ligne__corps > *,
.wp-site-blocks .cvg-repere > *,
.wp-site-blocks .cvg-repere__col > *,
.wp-site-blocks .cvg-panneau > *,
.wp-site-blocks .cvg-panneau__pied > *,
.wp-site-blocks .cvg-cles > *,
.wp-site-blocks .cvg-cle > *,
.wp-site-blocks .cvg-reals > *,
.wp-site-blocks .cvg-realgrille > *,
.wp-site-blocks .cvg-realcarte > *,
.wp-site-blocks .cvg-realcarte__corps > *,
.wp-site-blocks .cvg-appel > *,
.wp-site-blocks .cvg-appel__bloc > *,
.wp-site-blocks .cvg-appel__int > *,
.wp-site-blocks .cvg-faq > * { margin-block: 0; }

/* -------------------------------------------------------------------------
   3. REDECLARATION DES RESPIRATIONS VOULUES
   Regle « qui neutralise redeclare » : la neutralisation ci-dessus vaut
   (0,3,0) et ecrase aussi les marges ecrites sur les classes, en (0,2,0).
   Sans ce bloc, chapo colle aux boutons, sur-titre colle au titre, titre
   colle au chapo. 47 respirations perdues d un coup sur le silo precedent.
   Seuls les conteneurs en FLUX sont concernes : ceux en flex ou en grid
   tirent leur air du gap, que la neutralisation n atteint pas.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-hero > .cvg-hero__int { margin-block-start: calc(-1 * clamp(44px, 8vh, 96px)); }
.wp-site-blocks .cvg-hero__plaque > .cvg-sur { margin-block-end: clamp(14px, 1.8vw, 20px); }
.wp-site-blocks .cvg-hero__plaque > .cvg-hero__titre { margin-block-end: clamp(16px, 2vw, 22px); }
.wp-site-blocks .cvg-hero__plaque > .cvg-hero__chapo { margin-block-end: clamp(22px, 2.6vw, 30px); }
.wp-site-blocks .cvg-hero__int > .cvg-hero__reperes { margin-block-start: clamp(20px, 2.4vw, 28px); }

.wp-site-blocks .cvg-tete > .cvg-sur { margin-block-end: 14px; }
.wp-site-blocks .cvg-tete > .cvg-titre { margin-block-end: 16px; }
.wp-site-blocks .cvg-int > .cvg-tete { margin-block-end: clamp(36px, 4.2vw, 54px); }
.wp-site-blocks .cvg-int > .cvg-note { margin-block-start: clamp(26px, 3vw, 36px); }

.wp-site-blocks .cvg-col > .cvg-col__cle { margin-block-end: 12px; }
.wp-site-blocks .cvg-col > .cvg-col__titre { margin-block-end: 14px; }
.wp-site-blocks .cvg-col > .cvg-col__texte { margin-block-end: 18px; }

.wp-site-blocks .cvg-appel__int > .cvg-sur { margin-block-end: 14px; }
.wp-site-blocks .cvg-appel__int > .cvg-appel__titre { margin-block-end: 16px; }
.wp-site-blocks .cvg-appel__int > .cvg-appel__texte { margin-block-end: clamp(22px, 2.6vw, 30px); }

.wp-site-blocks .cvg-faq > details { margin-block-start: 10px; }
.wp-site-blocks .cvg-faq > details:first-of-type { margin-block-start: 0; }

/* -------------------------------------------------------------------------
   4. BOUTONS
   Point 2 : les styles du site sont scopes sur .cvh-hero, .cvh-sec,
   .cvh-coll et .cvh-drones. Un kit neuf n en herite RIEN : les boutons
   retombent sur le noir du theme et disparaissent sur fond sombre.
   La regle des boutons de MEME TAILLE, elle, est generique et vit en fin
   d accueil.css : rien a reposer ici.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-hero .wp-block-button__link,
.wp-site-blocks .cvg-sec .wp-block-button__link,
.wp-site-blocks .cvg-appel .wp-block-button__link {
	background: var(--cv2-degrade-bouton);
	color: var(--cv2-blanc);
	border-radius: 0;
	border: 0;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.03em;
	line-height: 1;
	text-transform: uppercase;
	padding: 16px 28px;
	transition: box-shadow 0.18s ease, transform 0.18s ease;
}
.wp-site-blocks .cvg-hero .wp-block-button__link:hover,
.wp-site-blocks .cvg-sec .wp-block-button__link:hover,
.wp-site-blocks .cvg-appel .wp-block-button__link:hover {
	box-shadow: 0 8px 24px rgba(12, 103, 222, 0.45);
	transform: translateY(-1px);
}
.wp-site-blocks .cvg-hero .is-style-outline .wp-block-button__link,
.wp-site-blocks .cvg-sec .is-style-outline .wp-block-button__link,
.wp-site-blocks .cvg-appel .is-style-outline .wp-block-button__link {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.55);
	color: var(--cv2-blanc);
}
.wp-site-blocks .cvg-hero .is-style-outline .wp-block-button__link:hover,
.wp-site-blocks .cvg-sec .is-style-outline .wp-block-button__link:hover,
.wp-site-blocks .cvg-appel .is-style-outline .wp-block-button__link:hover {
	border-color: var(--cv2-ciel);
	box-shadow: none;
}

/* -------------------------------------------------------------------------
   5. HEROS - la plaque qui mord la photo par le bas
   Point 7 : le heros doit tenir dans le viewport, en-tete DEDUIT.
   --cv2-hdr-h annonce 76px, l en-tete rendu en mesure 114 (77 sur mobile).
   sport-culture.js publie --cvg-hdr ; le repli CSS vaut 114px.
   La photo prend toute la place restante (rangee 1fr), la plaque est en
   rangee auto et remonte dans l image par une marge negative : le heros
   garde donc exactement la hauteur du viewport, quelle que soit la morsure.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-hero {
	position: relative;
	background: var(--cv2-abysse);
	min-height: calc(100vh - var(--cvg-hdr, 114px));
	min-height: calc(100svh - var(--cvg-hdr, 114px));
	display: grid;
	grid-template-rows: 1fr auto;
	overflow: clip;
}
.wp-site-blocks .cvg-hero__media {
	position: relative;
	grid-row: 1;
	margin: 0;
	overflow: hidden;
	min-height: 180px;
}
.wp-site-blocks .cvg-hero__media img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 42%;
}
/* E11 : un voile en rgba(0,2,30,...) est un BLEU NUIT, pas un noir, et le
   client le voit comme tel. Voile NOIR, et volontairement LEGER en son
   milieu : aucun texte ne repose dessus, l image doit rester VISIBLE.
   C est le reproche paye sur le bandeau du silo drone. */
.wp-site-blocks .cvg-hero__media::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		linear-gradient(180deg, rgba(0,0,0,0.34) 0%, rgba(0,0,0,0.08) 38%, rgba(0,0,0,0.18) 72%, rgba(0,0,0,0.52) 100%),
		radial-gradient(72% 58% at 14% 8%, rgba(12, 103, 222, 0.22), transparent 64%);
}
.wp-site-blocks .cvg-hero__int {
	position: relative;
	z-index: 2;
	grid-row: 2;
	max-width: 1280px;
	width: 100%;
	margin-inline: auto;
	box-sizing: border-box;
	padding: 0 clamp(20px, 3.2vw, 32px) clamp(28px, 3.4vw, 42px);
}
/* La plaque est OPAQUE : le contraste du H1 se calcule sur l abysse plein,
   jamais sur la photo. Elle porte un cran d accent a gauche - c est la
   morsure, et c est le seul geste graphique qui touche l image. */
.wp-site-blocks .cvg-hero__plaque {
	position: relative;
	max-width: 920px;
	box-sizing: border-box;
	background: var(--cv2-abysse);
	padding: clamp(26px, 2.6vw, 34px) clamp(24px, 3vw, 40px);
	box-shadow: 0 -18px 48px rgba(0, 0, 0, 0.55);
}
.wp-site-blocks .cvg-hero__plaque::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 5px;
	background: var(--cv2-degrade);
}
/* Le cran : une equerre qui sort de la plaque par le haut et signe la
   morsure. Un SEUL pseudo-element portant deux fonds dimensionnes - deux
   pseudo-elements ne se composent pas de facon fiable. */
.wp-site-blocks .cvg-hero__plaque::after {
	content: "";
	position: absolute;
	left: 0;
	top: -14px;
	width: 92px;
	height: 14px;
	pointer-events: none;
	background:
		linear-gradient(90deg, var(--cv2-bleu), var(--cv2-bleu)) 0 0 / 5px 14px no-repeat,
		linear-gradient(90deg, var(--cv2-bleu), transparent) 0 0 / 92px 3px no-repeat;
}
.wp-site-blocks .cvg-hero__titre {
	font-size: var(--cv2-t1);
	font-weight: 800;
	line-height: 1.08;
	color: #ffffff;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvg-hero__titre mark {
	background: var(--cv2-degrade-titre);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.wp-site-blocks .cvg-hero__chapo {
	font-size: var(--cv2-t5);
	font-weight: 300;
	line-height: 1.66;
	color: var(--cvg-texte);
}
/* Les deux reperes du heros : une ligne, deux mentions, un filet vertical.
   Libelles courts : sur le silo precedent, 110 caracteres passaient a la
   ligne. Plafond de securite : 70. */
.wp-site-blocks .cvg-hero__reperes {
	list-style: none;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0 clamp(18px, 2.4vw, 30px);
}
.wp-site-blocks .cvg-hero__reperes > li {
	position: relative;
	margin: 0;
	padding-inline-start: clamp(18px, 2.4vw, 30px);
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	line-height: 1.5;
}
.wp-site-blocks .cvg-hero__reperes > li:first-child { padding-inline-start: 0; }
.wp-site-blocks .cvg-hero__reperes > li + li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 3px;
	bottom: 3px;
	width: 1px;
	background: var(--cvg-trait-fort);
}

/* -------------------------------------------------------------------------
   6. TETE DE SECTION
   ------------------------------------------------------------------------- */
.cvg-tete { max-width: none; }
/* Sur fond photo, la tete porte sa propre plaque : son contraste se calcule
   sur un aplat plein et ne depend plus de l image posee derriere. */
.wp-site-blocks .cvg-sec--photo .cvg-int > .cvg-tete { margin-block-end: 18px; }
.wp-site-blocks .cvg-sec--photo .cvg-tete {
	box-sizing: border-box;
	max-width: none;
	background: rgba(0, 0, 0, 0.94);
	padding: clamp(24px, 2.8vw, 34px) clamp(22px, 2.6vw, 32px);
	border-inline-start: 3px solid var(--cv2-bleu);
}
.wp-site-blocks .cvg-sur {
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
}
.wp-site-blocks .cvg-hero .cvg-sur {
	position: relative;
	display: inline-block;
	padding-inline-start: 40px;
}
.wp-site-blocks .cvg-hero .cvg-sur::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 28px;
	height: 2px;
	background: var(--cv2-degrade);
}
.wp-site-blocks .cvg-titre {
	font-size: var(--cv2-t2);
	font-weight: 700;
	line-height: 1.14;
	color: #ffffff;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvg-titre mark {
	background: var(--cv2-degrade-titre);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.wp-site-blocks .cvg-chapo {
	font-size: var(--cv2-t5);
	font-weight: 300;
	line-height: 1.66;
	color: var(--cvg-texte);
}
.wp-site-blocks p.cvg-note {
	max-width: 900px;
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
	padding-inline-start: 18px;
	border-inline-start: 2px solid var(--cvg-trait-fort);
}

/* -------------------------------------------------------------------------
   7. LE FACE-A-FACE DECALE - la signature du kit
   Deux colonnes de verre separees par un AXE VERTICAL GRADUE. La colonne de
   droite descend de 96px : c est le decalage des deux horloges, et c est ce
   qui distingue ce composant des deux plateaux de .cvd-balance comme du
   split de .cvt-hero.
   Le decalage passe par un TRANSFORM et non par une marge : une marge
   deferait l egalite des hauteurs de grille. La section reserve la place en
   bas par un padding, jamais par une valeur au pixel sur la colonne.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-duo {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(22px, 2.6vw, 34px);
	align-items: stretch;
	grid-auto-rows: 1fr;
}
.wp-site-blocks .cvg-col {
	position: relative;
	height: 100%;
	box-sizing: border-box;
	padding: clamp(28px, 3.2vw, 40px);
	background: var(--cvg-verre);
	border: 1px solid var(--cvg-bord);
	-webkit-backdrop-filter: blur(14px) saturate(120%);
	backdrop-filter: blur(14px) saturate(120%);
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.32);
	display: flex;
	flex-direction: column;
	overflow: clip;
}
/* Arete eclairee en tete de panneau : la matiere verre demandee. */
.wp-site-blocks .cvg-col::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--cvg-luisant), transparent);
	pointer-events: none;
}
/* Le chiffre en filigrane. Pile : filigrane 0, contenu 1. */
.wp-site-blocks .cvg-col__num {
	position: absolute;
	z-index: 0;
	top: -8px;
	right: clamp(6px, 1.4vw, 18px);
	font-size: clamp(96px, 12vw, 168px);
	font-weight: 800;
	line-height: 1;
	color: rgba(86, 181, 235, 0.09);
	pointer-events: none;
	user-select: none;
}
.wp-site-blocks .cvg-col > *:not(.cvg-col__num) { position: relative; z-index: 1; }
.wp-site-blocks .cvg-col__cle {
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	padding-block-end: 12px;
	border-block-end: 1px solid var(--cvg-trait);
}
.wp-site-blocks .cvg-col__titre {
	font-size: var(--cv2-t3);
	font-weight: 700;
	line-height: 1.24;
	color: #ffffff;
	overflow-wrap: break-word;
}
.wp-site-blocks p.cvg-col__texte {
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
}
.wp-site-blocks .cvg-col__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	margin-block-start: auto;
}
.wp-site-blocks .cvg-col__liste > li {
	position: relative;
	margin: 0;
	padding: 11px 0 11px 22px;
	border-block-start: 1px solid var(--cvg-trait);
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
}
.wp-site-blocks .cvg-col__liste > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 20px;
	width: 8px;
	height: 2px;
	background: var(--cv2-ciel);
}

/* -------------------------------------------------------------------------
   8. LA BANDE DE MESURES - segments INEGAUX
   La largeur de chaque segment vaut la duree relative du moment qu il porte.
   C est ce qui la distingue de la frise de .cvt-, dont les six etapes sont
   egales, et de la frise verticale de .cvd-.
   Le fond porte une image sous voile NOIR a 0,86 : pire cas d une photo
   blanche pure = 5,53 de contraste sur le texte, garanti par l arithmetique
   et non par l image choisie.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-sec--photo { position: relative; overflow: clip; }
.wp-site-blocks figure.cvg-fond,
.wp-site-blocks .cvg-fond {
	position: absolute;
	inset: 0;
	z-index: 0;
	margin: 0;
	overflow: hidden;
	pointer-events: none;
}
.wp-site-blocks .cvg-fond img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.wp-site-blocks .cvg-fond::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.46) 0%, rgba(0, 0, 0, 0.22) 40%, rgba(0, 0, 0, 0.34) 100%);
}
/* Cran PHOTO LUMINEUSE : le bandeau d appel porte une photo a L = 0,42.
   Avec le voile leger ci-dessus, son texte tomberait a 3,05 de contraste. */
.wp-site-blocks .cvg-appel .cvg-fond::after {
	background:
		linear-gradient(90deg, rgba(0, 0, 0, 0.52) 0%, rgba(0, 0, 0, 0.34) 48%, rgba(0, 0, 0, 0.18) 100%),
		linear-gradient(180deg, rgba(0, 0, 0, 0.34) 0%, rgba(0, 0, 0, 0.12) 40%, rgba(0, 0, 0, 0.38) 100%);
}

.wp-site-blocks .cvg-mesures {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	align-items: stretch;
	grid-auto-rows: 1fr;
}
.wp-site-blocks .cvg-mesure {
	position: relative;
	height: 100%;
	box-sizing: border-box;
	padding: clamp(22px, 2.6vw, 32px) clamp(18px, 2.2vw, 28px);
	display: flex;
	flex-direction: column;
	gap: 10px;
	border-block-end: 1px solid var(--cvg-trait);
	background-color: rgba(0, 0, 0, 0.94);
	/* Le RAIL : la piste vide de la jauge, sur toute la largeur du segment.
	   Sans elle, le remplissage ne se lit pas comme une mesure. */
}
/* La reglette : le REMPLISSAGE de la jauge, dont la LARGEUR dit la
   duree. Elle vit dans le CSS : changer un libelle sans toucher la
   largeur afficherait un trait qui ne correspond plus, et rien ne le
   signalerait. Les quatre valeurs sont ci-dessous, une par modificateur. */
.wp-site-blocks .cvg-mesure::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 5px;
	width: 100%;
	background: var(--cv2-degrade);
}
.wp-site-blocks p.cvg-mesure__duree {
	font-size: 15px;
	line-height: 1.7;
	margin: 0;
}
.wp-site-blocks p.cvg-mesure__duree strong {
	font-size: var(--cv2-t3);
	font-weight: 800;
	line-height: 1.1;
	color: #ffffff;
	white-space: nowrap;
}
.wp-site-blocks .cvg-mesure__cle {
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	margin: 0;
}
.wp-site-blocks .cvg-mesure__titre {
	font-size: var(--cv2-t-vignette);
	font-weight: 700;
	line-height: 1.28;
	min-height: calc(2 * 1.28em);
	color: #ffffff;
	margin: 0;
	overflow-wrap: break-word;
}
.wp-site-blocks p.cvg-mesure__texte {
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
	margin: 0;
}

/* -------------------------------------------------------------------------
   9. LES PORTES DE TERRAIN - vers 157 et 159
   Point 10 : image a ratio FIXE en haut, corps en dessous portant son
   PROPRE aplat, lien pousse par margin-top auto. Ne jamais poser le texte
   sur une image de fond : la plaque monterait ou descendrait selon la
   longueur du texte et les cartes se decaleraient.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-terrains {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(20px, 2.4vw, 30px);
	align-items: stretch;
	grid-auto-rows: 1fr;
}
.wp-site-blocks .cvg-terrain {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	background: rgba(0, 0, 0, 0.42);
	border: 1px solid var(--cvg-bord);
	overflow: clip;
	transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}
.wp-site-blocks .cvg-terrain:hover {
	transform: translateY(-4px);
	border-color: rgba(12, 103, 222, 0.6);
	box-shadow: 0 20px 44px rgba(0, 0, 0, 0.42);
}
.wp-site-blocks .cvg-terrain__media {
	position: relative;
	margin: 0;
	aspect-ratio: 2 / 1;
	overflow: hidden;
	flex: 0 0 auto;
}
.wp-site-blocks .cvg-terrain__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}
.wp-site-blocks .cvg-terrain:hover .cvg-terrain__media img { transform: scale(1.04); }
.wp-site-blocks .cvg-terrain__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,0.22) 0%, rgba(0,0,0,0.10) 50%, rgba(0,0,0,0.52) 100%);
	pointer-events: none;
}
/* Le corps porte son propre aplat OPAQUE : le contraste se calcule donc
   sur un fond plein, plus aucune dependance a la photo choisie. */
.wp-site-blocks .cvg-terrain__corps {
	position: relative;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 12px;
	box-sizing: border-box;
	padding: clamp(24px, 2.8vw, 34px);
	background: var(--cv2-abysse);
}
.wp-site-blocks .cvg-terrain__cle {
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	margin: 0;
}
.wp-site-blocks .cvg-terrain__titre {
	font-size: var(--cv2-t3);
	font-weight: 700;
	line-height: 1.22;
	color: #ffffff;
	margin: 0;
	overflow-wrap: break-word;
}
.wp-site-blocks p.cvg-terrain__texte {
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
	margin: 0;
}
.wp-site-blocks .cvg-terrain__lien {
	margin-block-start: auto;
	padding-block-start: 16px;
	border-block-start: 1px solid var(--cvg-trait);
}
.wp-site-blocks .cvg-terrain__lien a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	text-decoration: none;
}
.wp-site-blocks .cvg-terrain__lien a::after {
	content: "";
	width: 22px;
	height: 2px;
	background: var(--cv2-degrade);
	transition: width 0.22s ease;
}
.wp-site-blocks .cvg-terrain:hover .cvg-terrain__lien a::after { width: 34px; }

/* -------------------------------------------------------------------------
   10. LES LIGNES DE CONTRAINTE - bandes horizontales pleine largeur
   Vocabulaire propre au kit : ni cartes en grille (.cva-), ni quinconce
   (.cvt-), ni frise verticale (.cvd-). Une ligne, un numero, un titre, un
   texte, et un filet qui court.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-lignes {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	border-block-start: 1px solid var(--cvg-trait);
}
.wp-site-blocks .cvg-ligne {
	position: relative;
	display: grid;
	grid-template-columns: auto 1fr;
	gap: clamp(16px, 2.2vw, 30px);
	align-items: start;
	padding: clamp(20px, 2.4vw, 28px) 0;
	border-block-end: 1px solid var(--cvg-trait);
	transition: background-color 0.22s ease, padding-inline-start 0.22s ease;
}
.wp-site-blocks .cvg-ligne:hover {
	background-color: rgba(12, 103, 222, 0.09);
	padding-inline-start: 14px;
}
.wp-site-blocks .cvg-ligne__num {
	font-size: var(--cv2-t5);
	font-weight: 800;
	line-height: 1.2;
	color: var(--cv2-ciel);
	margin: 0;
	min-width: 46px;
	padding-block-start: 2px;
}
.wp-site-blocks .cvg-ligne__corps {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.wp-site-blocks .cvg-ligne__titre {
	font-size: var(--cv2-t3);
	font-weight: 700;
	line-height: 1.28;
	color: #ffffff;
	margin: 0;
	overflow-wrap: break-word;
}
.wp-site-blocks p.cvg-ligne__texte {
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
	margin: 0;
}

/* -------------------------------------------------------------------------
   11. LE REPERE - budget et delais
   Colonne de gauche editoriale, panneau de droite chiffre. Le seul montant
   de la page est le seuil DRONE : la grille par taille de collectivite est
   celle du FEU et ne s applique pas a un club ni a un festival.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-repere {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(26px, 3.2vw, 44px);
	align-items: stretch;
}
.wp-site-blocks .cvg-repere__col {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.wp-site-blocks .cvg-repere__filet {
	width: 88px;
	height: 3px;
	background: var(--cv2-degrade);
	border: 0;
	margin: 0;
	opacity: 1;
}
.wp-site-blocks .cvg-panneau {
	position: relative;
	box-sizing: border-box;
	padding: clamp(26px, 3vw, 38px);
	background: var(--cvg-verre);
	border: 1px solid var(--cvg-bord);
	-webkit-backdrop-filter: blur(14px) saturate(120%);
	backdrop-filter: blur(14px) saturate(120%);
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.32);
	display: flex;
	flex-direction: column;
	gap: 0;
	overflow: clip;
}
.wp-site-blocks .cvg-panneau::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--cvg-luisant), transparent);
	pointer-events: none;
}
.wp-site-blocks .cvg-cles { list-style: none; margin: 0; padding: 0; }
.wp-site-blocks .cvg-cles > li {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 18px;
	margin: 0;
	padding: 14px 0;
	border-block-end: 1px solid var(--cvg-trait);
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
}
.wp-site-blocks .cvg-cles > li:first-child { padding-block-start: 0; }
.wp-site-blocks .cvg-cles > li b,
.wp-site-blocks .cvg-cles > li strong {
	font-weight: 700;
	color: #ffffff;
	white-space: nowrap;
}
/* Point 13 : un montant coupe sur deux lignes est un defaut. Le pied du
   panneau reserve donc sa largeur et interdit la coupure. */
.wp-site-blocks .cvg-panneau__pied {
	margin-block-start: clamp(20px, 2.4vw, 28px);
	padding: clamp(18px, 2.2vw, 26px);
	border: 1px solid rgba(12, 103, 222, 0.55);
	background: rgba(12, 103, 222, 0.12);
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px 20px;
}
.wp-site-blocks .cvg-panneau__pied p {
	margin: 0;
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
}
.wp-site-blocks p.cvg-panneau__montant {
	font-size: 15px;
	margin: 0;
	line-height: 1.7;
}
.wp-site-blocks p.cvg-panneau__montant strong {
	font-size: var(--cv2-t3);
	font-weight: 800;
	line-height: 1.1;
	color: #ffffff;
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
   12. REALISATIONS - section 3
   Cartes ecrites a la main : aucun terme de taxonomie « sport » ni
   « culture » n existe, et aucun query.search ne sait isoler une selection
   editoriale (motif F10). Les liens passent par des jetons resolus par
   get_permalink cote serveur, jamais par un slug devine.
   La classe .cvg-realcarte est ce que cherche le filtre generique
   anti-section-vide du mu-plugin : ne pas la renommer.
   ------------------------------------------------------------------------- */
/* Rendu DYNAMIQUE : la section est alimentée par un core/query sur le terme
   Culture et patrimoine. Ces regles habillent les blocs du query.
   La classe .cvg-realcarte reste celle que cherche le filtre anti-vide. */
.wp-site-blocks .cvg-realgrille > li { margin: 0; list-style: none; }
.wp-site-blocks .cvg-realcarte .wp-block-post-featured-image {
	margin: 0;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	flex: 0 0 auto;
}
.wp-site-blocks .cvg-realcarte .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}
.wp-site-blocks .cvg-realcarte:hover .wp-block-post-featured-image img { transform: scale(1.04); }
.wp-site-blocks .cvg-realcarte__corps > * { margin: 0; }
.wp-site-blocks .cvg-badge-real,
.wp-site-blocks .cvg-badge-real a {
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	text-decoration: none;
}
.wp-site-blocks .cvg-realcarte h3 {
	font-size: var(--cv2-t-vignette);
	font-weight: 700;
	line-height: 1.26;
	color: #ffffff;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvg-realcarte h3 a { color: #ffffff; text-decoration: none; }
.wp-site-blocks .cvg-realcarte h3 a:hover { color: var(--cv2-ciel); }
.wp-site-blocks .cvg-realcarte .wp-block-post-excerpt__excerpt {
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
	margin: 0;
}
.wp-site-blocks .cvg-realcarte .wp-block-read-more {
	margin-block-start: auto;
	padding-block-start: 14px;
	border-block-start: 1px solid var(--cvg-trait);
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	text-decoration: none;
	align-self: stretch;
}
.wp-site-blocks .cvg-realcarte .wp-block-read-more:hover { color: #ffffff; }

.wp-site-blocks .cvg-realgrille {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(20px, 2.4vw, 30px);
	align-items: stretch;
	grid-auto-rows: 1fr;
	list-style: none;
	margin: 0;
	padding: 0;
}
.wp-site-blocks .cvg-realcarte {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	background: var(--cv2-abysse);
	border: 1px solid var(--cvg-bord);
	overflow: clip;
	transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}
.wp-site-blocks .cvg-realcarte:hover {
	transform: translateY(-4px);
	border-color: rgba(12, 103, 222, 0.6);
	box-shadow: 0 20px 44px rgba(0, 0, 0, 0.42);
}
.wp-site-blocks .cvg-realcarte__media {
	position: relative;
	margin: 0;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	flex: 0 0 auto;
}
.wp-site-blocks .cvg-realcarte__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}
.wp-site-blocks .cvg-realcarte:hover .cvg-realcarte__media img { transform: scale(1.04); }
.wp-site-blocks .cvg-realcarte__corps {
	position: relative;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 10px;
	box-sizing: border-box;
	padding: clamp(20px, 2.4vw, 28px);
}
.wp-site-blocks .cvg-realcarte__cle {
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	margin: 0;
}
.wp-site-blocks .cvg-realcarte__titre {
	font-size: var(--cv2-t-vignette);
	font-weight: 700;
	line-height: 1.26;
	color: #ffffff;
	margin: 0;
	overflow-wrap: break-word;
}
.wp-site-blocks p.cvg-realcarte__texte {
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
	margin: 0;
}
.wp-site-blocks .cvg-realcarte__lien {
	margin-block-start: auto;
	padding-block-start: 14px;
	border-block-start: 1px solid var(--cvg-trait);
}
.wp-site-blocks .cvg-realcarte__lien a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: var(--cv2-t6);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cv2-ciel);
	text-decoration: none;
}
.wp-site-blocks .cvg-realcarte__lien a::after {
	content: "";
	width: 22px;
	height: 2px;
	background: var(--cv2-degrade);
	transition: width 0.22s ease;
}
.wp-site-blocks .cvg-realcarte:hover .cvg-realcarte__lien a::after { width: 34px; }

/* -------------------------------------------------------------------------
   13. BANDEAU D APPEL
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-appel {
	position: relative;
	background: #000000;
	overflow: clip;
}
.wp-site-blocks .cvg-appel > *:not(.cvg-fond) { position: relative; z-index: 1; }
.wp-site-blocks .cvg-appel__bloc {
	position: relative;
	z-index: 1;
	max-width: 1280px;
	margin-inline: auto;
	box-sizing: border-box;
	padding: clamp(58px, 7vw, 92px) clamp(20px, 3.2vw, 32px);
}
.wp-site-blocks .cvg-appel__int {
	max-width: 800px;
	box-sizing: border-box;
	background: rgba(0, 0, 0, 0.94);
	padding: clamp(26px, 3vw, 38px) clamp(24px, 2.8vw, 34px);
	border-inline-start: 3px solid var(--cv2-bleu);
}
.wp-site-blocks .cvg-appel__titre {
	font-size: var(--cv2-t2);
	font-weight: 700;
	line-height: 1.14;
	color: #ffffff;
	overflow-wrap: break-word;
}
.wp-site-blocks .cvg-appel__titre mark {
	background: var(--cv2-degrade-titre);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.wp-site-blocks p.cvg-appel__texte {
	font-size: 15px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--cvg-texte);
}

/* -------------------------------------------------------------------------
   14. FAQ - AUCUN motif propre au kit, VOLONTAIREMENT
   accueil.css porte deja le kit FAQ "bande pleine" valide par le client :
   fond alterne en nth-of-type, chiffre fantome en counter(), liseré d accent
   a l ouverture, chevron comme seule affordance, paliers a 900 et 560.
   Redefinir le motif ici produisait une COLLISION sur huit selecteurs, le
   motif exact du "sapin de Noel" deja paye sur ce chantier : mon fond et mon
   padding s appliquaient, le chevron du site aussi, et l etat ouvert ne
   changeait plus rien. Le kit se distingue par ses sept autres composants.
   Ne restent ici que la colonne de lecture et les respirations, car la
   neutralisation des marges du paragraphe 2 ecrase celles du kit global.
   ------------------------------------------------------------------------- */
.wp-site-blocks .cvg-faq { max-width: 940px; }

/* -------------------------------------------------------------------------
   15. ANIMATIONS
   Point 6 : accueil.js retire .cvh-anim au bout de 1,2 s par un filet
   de securite. Une regle .X.cvh-anim.cvh-vu ne joue donc JAMAIS au
   defilement. Le seul crochet fiable est .cvh-vu SEUL, que l observateur
   pose et ne retire pas.
   Et l etat de repos ne masque RIEN : si l animation ne joue pas, le
   contenu reste visible. C est la faute la plus grave du chantier.
   ------------------------------------------------------------------------- */
@keyframes cvgMonte {
	from { opacity: 0; transform: translateY(26px); }
	to   { opacity: 1; transform: none; }
}
.wp-site-blocks .cvg-hero__plaque > *,
.wp-site-blocks .cvg-tete > *,
.wp-site-blocks .cvg-duo > .cvg-col,
.wp-site-blocks .cvg-mesures > .cvg-mesure,
.wp-site-blocks .cvg-terrains > .cvg-terrain,
.wp-site-blocks .cvg-lignes > .cvg-ligne,
.wp-site-blocks .cvg-repere > *,
.wp-site-blocks .cvg-realgrille > .cvg-realcarte,
.wp-site-blocks .cvg-faq > details,
.wp-site-blocks .cvg-appel__int > * { opacity: 1; }

.wp-site-blocks .cvg-hero__plaque > .cvh-vu,
.wp-site-blocks .cvg-tete > .cvh-vu,
.wp-site-blocks .cvg-duo > .cvh-vu,
.wp-site-blocks .cvg-mesures > .cvh-vu,
.wp-site-blocks .cvg-terrains > .cvh-vu,
.wp-site-blocks .cvg-lignes > .cvh-vu,
.wp-site-blocks .cvg-repere > .cvh-vu,
.wp-site-blocks .cvg-realgrille > .cvh-vu,
.wp-site-blocks .cvg-faq > .cvh-vu,
.wp-site-blocks .cvg-appel__int > .cvh-vu {
	animation: cvgMonte 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) backwards;
}

@media (prefers-reduced-motion: reduce) {
	.wp-site-blocks .cvg-hero__plaque > .cvh-vu,
	.wp-site-blocks .cvg-tete > .cvh-vu,
	.wp-site-blocks .cvg-duo > .cvh-vu,
	.wp-site-blocks .cvg-mesures > .cvh-vu,
	.wp-site-blocks .cvg-terrains > .cvh-vu,
	.wp-site-blocks .cvg-lignes > .cvh-vu,
	.wp-site-blocks .cvg-repere > .cvh-vu,
	.wp-site-blocks .cvg-realgrille > .cvh-vu,
	.wp-site-blocks .cvg-faq > .cvh-vu,
	.wp-site-blocks .cvg-appel__int > .cvh-vu { animation: none; }
	.wp-site-blocks .cvg-terrain,
	.wp-site-blocks .cvg-realcarte,
	.wp-site-blocks .cvg-ligne,
	.wp-site-blocks .cvg-terrain__media img,
	.wp-site-blocks .cvg-realcarte__media img { transition: none; }
	.wp-site-blocks .cvg-terrain:hover,
	.wp-site-blocks .cvg-realcarte:hover { transform: none; }
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
	.wp-site-blocks .cvg-col,
	.wp-site-blocks .cvg-panneau { background: rgba(7, 12, 61, 0.86); }
}

/* =========================================================================
   16. PALIERS RESPONSIVES
   Ecrits EN FIN DE FICHIER et bornes des deux cotes quand c est utile :
   une redeclaration posee plus bas ecraserait une media query ecrite plus
   haut. Toute reecriture ulterieure d un composant doit reprendre ses
   paliers ICI, a la suite.
   ========================================================================= */

/* --- 820px : terrains et realisations sortent de la colonne unique ------ */
@media (min-width: 820px) {
	.wp-site-blocks .cvg-terrains { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.wp-site-blocks .cvg-realgrille { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.wp-site-blocks .cvg-terrain__media { aspect-ratio: 3 / 2; }
	.wp-site-blocks .cvg-ligne { grid-template-columns: 64px 1fr; }
	.wp-site-blocks .cvg-repere { grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr); }
	.wp-site-blocks .cvg-repere__col {
		position: sticky;
		top: calc(var(--cvg-hdr, 114px) + 28px);
		align-self: start;
	}
}

/* --- 900px : le face-a-face et son axe, la bande a quatre segments ------
   C est ici que la signature du kit apparait : la colonne de droite descend
   de --cvg-decal, et l axe vertical gradue s allume entre les deux.
   Le decalage passe par un TRANSFORM : une marge deferait l egalite des
   hauteurs de grille. La section reserve la place en bas par un padding. */
@media (min-width: 900px) {
	.wp-site-blocks .cvg-duo {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: clamp(44px, 5.4vw, 84px);
		padding-block-end: var(--cvg-decal);
	}
	.wp-site-blocks .cvg-duo::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 50%;
		width: 1px;
		transform: translateX(-0.5px);
		pointer-events: none;
		background:
			linear-gradient(180deg, transparent, var(--cvg-trait-fort) 12%, var(--cvg-trait-fort) 88%, transparent),
			repeating-linear-gradient(180deg, var(--cv2-ciel) 0 2px, transparent 2px 26px);
		background-size: 1px 100%, 1px 100%;
		opacity: 0.7;
	}
	.wp-site-blocks .cvg-duo > .cvg-col--decale { transform: translateY(var(--cvg-decal)); }

	.wp-site-blocks .cvg-mesures { grid-template-columns: 1.35fr 1.1fr 0.9fr 1.05fr; }
	.wp-site-blocks .cvg-mesure { border-block-end: 0; }
	.wp-site-blocks .cvg-mesure + .cvg-mesure::after {
		content: "";
		position: absolute;
		left: 0;
		top: 5px;
		bottom: 0;
		width: 1px;
		background: var(--cvg-trait);
	}
	.wp-site-blocks .cvg-mesure:nth-child(odd) { border-inline-start: 1px solid var(--cvg-trait); }
	.wp-site-blocks .cvg-mesure:first-child { border-inline-start: 0; }
}

/* --- sous 900px : le decalage et l axe n existent pas -------------------
   Bornage explicite : aucune regle du palier superieur ne doit survivre. */
@media (max-width: 899.98px) {
	.wp-site-blocks .cvg-duo > .cvg-col--decale { transform: none; }
	.wp-site-blocks .cvg-duo { padding-block-end: 0; }
	.wp-site-blocks .cvg-col__num { font-size: clamp(84px, 20vw, 128px); }
	.wp-site-blocks .cvg-mesures { grid-template-columns: 1fr; grid-auto-rows: auto; }
	.wp-site-blocks .cvg-mesure { border-inline-start: 0; border-block-end: 1px solid var(--cvg-trait); }
}

/* --- sous 620px : tout en une colonne ----------------------------------- */
@media (max-width: 619.98px) {
	.wp-site-blocks .cvg-panneau__pied { flex-direction: column; align-items: flex-start; }
	.wp-site-blocks .cvg-cles > li { flex-direction: column; align-items: flex-start; gap: 2px; }
	.wp-site-blocks .cvg-hero__reperes { flex-direction: column; gap: 8px 0; }
	.wp-site-blocks .cvg-hero__reperes > li { padding-inline-start: 0; }
	.wp-site-blocks .cvg-hero__reperes > li + li::before { display: none; }
	.wp-site-blocks .cvg-terrain__media { aspect-ratio: 16 / 9; }
}