/**
 * Accueil · Cinq leviers : les verbes qui s'encrent.
 * Le verbe (Connaître, Optimiser…) s'affiche en grand, en contour marine, et se remplit
 * de betterave de gauche à droite au fil du scroll ; son texte apparaît dessous.
 * Contenu : blocs natifs (.h26-levier > __num, __nom, __corps) ; ce fichier gère la mise en page.
 */

/* --- Mise en page : numéro + verbe sur une ligne, texte en deux colonnes dessous --- */
.h26-leviers__liste .h26-levier {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	column-gap: clamp(16px, 2vw, 32px);
	row-gap: 28px;
	align-items: baseline;
	padding: 40px 0 56px;
	border-top: 1px solid var(--wp--preset--color--gray, #D9D4D0);
}
.h26-leviers__liste { border-bottom: 1px solid var(--wp--preset--color--gray, #D9D4D0); }
.h26-leviers__liste .h26-levier + .h26-levier { border-top: 1px solid var(--wp--preset--color--gray, #D9D4D0); }
.h26-leviers__liste .h26-levier__num {
	font-family: var(--wp--preset--font-family--accessite);
	font-size: 14px;
	letter-spacing: .14em;
	font-weight: 600;
	line-height: 1;
	color: var(--wp--preset--color--betterave);
}
.h26-leviers__liste .h26-levier__nom {
	font-family: var(--wp--preset--font-family--accroche);
	font-size: clamp(48px, 8vw, 120px);
	line-height: .95;
	letter-spacing: -.02em;
	color: var(--wp--preset--color--navy);
}
.h26-leviers__liste .h26-levier__corps {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
	column-gap: 48px;
	row-gap: 14px;
}
.h26-leviers__liste .h26-levier__corps > :first-child { grid-column: 1; grid-row: 1 / span 3; margin: 0; }
.h26-leviers__liste .h26-levier__corps > :not(:first-child) { grid-column: 2; margin: 0; }
@media (max-width: 900px) {
	.h26-leviers__liste .h26-levier__corps { grid-template-columns: 1fr; }
	.h26-leviers__liste .h26-levier__corps > :not(#_) { grid-column: 1; grid-row: auto; }
}

/* --- Effet (classe .lv-encre posée par leviers-encre.js) --- */
.lv-encre .h26-levier__nom:not(.has-text-color) {
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: 1.5px var(--wp--preset--color--betterave);
	background-image: linear-gradient(90deg, var(--wp--preset--color--betterave) var(--encre, 0%), transparent var(--encre, 0%));
	-webkit-background-clip: text;
	background-clip: text;
}
@media (max-width: 900px) {
	.lv-encre .h26-levier__nom:not(.has-text-color) { -webkit-text-stroke-width: 1px; }
}
.lv-encre .h26-levier__corps {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1);
}
.lv-encre .h26-levier.is-encre .h26-levier__corps { opacity: 1; transform: none; }

/* Le fond (l'encre) ne couvre que la boîte du texte : avec un interlignage serré, les jambages
 * (p, q, g) et les accents dépassaient et restaient vides. On agrandit la boîte sans décaler la mise en page. */
.lv-encre .h26-levier__nom:not(.has-text-color) {
	padding: .12em 0 .22em;
	margin: -.12em 0 -.22em;
}
