/**
 * Dahu Theme Annad 2026 — composition « Technologie — chiffres clés » (4.82.0).
 *
 * patterns/technologie-chiffres-cles.php. Fond : celui de la page (aucun aplat ni texture ajoutés).
 * Photo à gauche, grille 2 × 2 de cartes à droite dès 60em (1024 px compris, barre de défilement
 * déduite) ; une colonne en dessous. Couleurs et police du thème (header.css) ; tailles et espacements de la maquette « ANNAD – Bloc Technologie home ».
 * Chargée d'après le contenu (functions.php) et dans l'éditeur (inc/blocks.php).
 */

.annad-chiffres {
	--annad-chiffres-gap: 1.5rem; /* 24px : photo / cartes, et entre cartes */
	--annad-chiffres-space: 4rem; /* 64px : titre / contenu / bouton */
}

.annad-chiffres > * {
	max-width: 75rem; /* 1200px */
	margin-inline: auto;
}

.annad-chiffres .annad-chiffres__title {
	margin-bottom: 1rem;
}

.annad-chiffres__intro {
	margin-block: 0;
	text-align: center;
	text-wrap: balance;
	color: color-mix(in srgb, var(--color-on-surface) 82%, var(--color-surface));
}

.annad-chiffres > .annad-chiffres__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--annad-chiffres-gap);
	margin-top: var(--annad-chiffres-space);
}

@media (min-width: 60em) {
	.annad-chiffres > .annad-chiffres__grid {
		grid-template-columns: 1fr 1fr;
	}
}

/* Marge d'espacement des blocs (block gap) retirée : photo et cartes alignées en haut. */
.annad-chiffres__grid > *,
.annad-chiffres__cards > * {
	margin-block: 0;
}

/* Photo : cadre arrondi, image recadrée sur toute la hauteur de la grille de cartes. */
.annad-chiffres .annad-chiffres__photo {
	position: relative;
	min-height: 25rem; /* ~400px */
	margin: 0;
	overflow: hidden;
	background-color: var(--color-surface-3); /* emplacement sans photo (inc/blocks.php) */
	border-radius: 1.5rem; /* 24px */
}

.annad-chiffres .annad-chiffres__photo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 59.99em) {
	.annad-chiffres .annad-chiffres__photo {
		min-height: 0;
		aspect-ratio: 4 / 3;
	}
}

.annad-chiffres__cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--annad-chiffres-gap);
}

@media (min-width: 40em) {
	.annad-chiffres__cards {
		grid-template-columns: 1fr 1fr;
	}
}

.annad-chiffres .annad-chiffres__card {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin: 0;
	padding: 2rem 1.75rem; /* 32 × 28px */
	background-color: var(--color-surface-3);
	border-radius: 1.25rem; /* 20px */
}

.annad-chiffres__card > * {
	margin: 0;
}

/* Préfixe, valeur, unité : une ligne, sur la ligne de base. Préfixe ou unité vide : masqué. */
.annad-chiffres__figure {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	column-gap: 0.4rem;
	color: var(--color-brand-green);
	font-family: var(--font-heading);
}

.annad-chiffres__figure > p {
	margin: 0;
}

.annad-chiffres__figure > p:empty {
	display: none;
}

.annad-chiffres .annad-chiffres__value {
	font-size: 3.5rem; /* 56px */
	font-weight: 800;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.annad-chiffres .annad-chiffres__prefix,
.annad-chiffres .annad-chiffres__unit {
	font-size: 1.25rem; /* 20px */
	font-weight: 700;
	line-height: 1;
}

.annad-chiffres .annad-chiffres__label {
	font-family: var(--font-body);
	font-size: 0.8125rem; /* 13px */
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-on-surface);
}

.annad-chiffres .annad-chiffres__text {
	font-size: 1rem;
	line-height: 1.5;
	color: color-mix(in srgb, var(--color-on-surface) 82%, var(--color-surface-3)); /* ~#CFCFCF */
}

.annad-chiffres > .annad-chiffres__cta {
	margin-top: var(--annad-chiffres-space);
}

.annad-chiffres__cta .wp-block-button__link {
	text-transform: uppercase;
}

/* Colonne de cartes étroite (1024 px…) : chiffre et marges réduits, préfixe / valeur / unité sur une ligne. */
@media (min-width: 60em) and (max-width: 79.99em) {
	.annad-chiffres .annad-chiffres__card {
		padding: 1.75rem 1.25rem;
	}

	.annad-chiffres .annad-chiffres__value {
		font-size: 2.75rem;
	}

	.annad-chiffres .annad-chiffres__prefix,
	.annad-chiffres .annad-chiffres__unit {
		font-size: 1.125rem;
	}
}

/* Groupe de boutons « Masqué sur le site » (inc/blocks.php) : absent du site, grisé dans l'éditeur. */
.wp-block-buttons.is-style-annad-masque {
	opacity: 0.4;
}