/* =========================================================
   MLT CHIFFRES — bande olive texturée, grands chiffres clés.
   Mobile : 2 colonnes ; ≥ 1024 px : 4.
   Dépend de mlt-tokens (.mlt-olive-grain).
   ========================================================= */

.mlt-chiffres__inner {
	display: grid;
	gap: var(--mlt-space-48);
}

.mlt-chiffres__liste {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--mlt-space-32) var(--mlt-space-16);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Filet ocre en tête de chaque chiffre (sillon du logo) */
.mlt-chiffres__item {
	padding-top: var(--mlt-space-24);
	border-top: 1px solid var(--mlt-color-ligne-inverse);
}

.mlt-chiffres__item::before {
	content: "";
	display: block;
	width: 32px;
	height: 2px;
	margin: -25px 0 var(--mlt-space-24);
	background: var(--mlt-color-ocre);
}

.mlt-chiffres__valeur {
	display: flex;
	align-items: baseline;
	gap: var(--mlt-space-4);
	margin: 0;
	color: var(--mlt-color-blanc);
	font-size: var(--mlt-fs-section);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.045em;
	white-space: nowrap;
}

/* Le compteur garde sa largeur pendant l'animation (pas de saut de mise en page) */
.mlt-chiffres__nombre {
	font-variant-numeric: tabular-nums;
	font-weight: 500;
}

.mlt-chiffres__prefixe,
.mlt-chiffres__suffixe {
	font-size: 0.5em;
	letter-spacing: 0;
}

.mlt-chiffres__libelle {
	max-width: 26ch;
	margin: var(--mlt-space-16) 0 0;
	color: var(--mlt-color-blanc-80);
	font-size: var(--mlt-fs-small);
	line-height: var(--mlt-lh-body);
}

@media (min-width: 768px) {
	.mlt-chiffres__libelle {
		font-size: var(--mlt-fs-body);
	}
}

@media (min-width: 1024px) {
	.mlt-chiffres__inner {
		gap: var(--mlt-space-64);
	}

	.mlt-chiffres__liste {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: var(--mlt-space-32);
	}
}
