/*
 * Composants — Loir&cher lemag
 *
 * PAS de couche de cascade, et c'est un choix mesuré.
 *
 * Ce fichier a d'abord vécu dans @layer lemag.composants. La couche partait
 * d'une observation juste — les feuilles du cœur de WordPress sont hors couche,
 * donc une couche perd contre elles — mais elle ratait la moitié de la règle :
 * theme.json aussi écrit hors couche. Résultat, TOUTES les règles de couleur
 * d'élément de ce fichier étaient muettes. Mesuré dans un vrai navigateur sur
 * la préproduction : la navigation et les dix titres de cartes de l'accueil
 * sortaient en bleu Loire au lieu d'encre, et le lien d'évitement affichait
 * 2,69:1 sur bleu nuit — la combinaison que le CLAUDE.md interdit nommément.
 *
 * Vérification faite avant de retirer la couche : sur les 183 sélecteurs de ce
 * fichier, AUCUN ne vise une classe du cœur. Le cœur ne cible jamais .lemag-*,
 * et ce fichier ne cible jamais .wp-block-* ni un élément nu. La couche ne
 * protégeait donc de rien ; elle ne faisait que perdre.
 *
 * La règle qui la remplace, et qui doit être tenue :
 *
 *     ce fichier ne cible QUE des classes .lemag-*, jamais un élément nu,
 *     jamais une classe du cœur. C'est cette discipline — et non la couche —
 *     qui garantit qu'on n'écrase pas un bloc du cœur par accident.
 *
 * Une seule exception tolérée : :root[data-tiroir-ouvert], qui pose un état de
 * document et ne dispute aucune propriété au cœur.
 *
 * L'apparence portée par theme.json (couleurs de la palette, tailles, éléments
 * globaux) reste dans theme.json. Ce fichier habille les composants maison.
 *
 * Aucune valeur littérale. Couleurs, tailles, espacements, rayons viennent
 * des presets de theme.json. Les seules valeurs en dur tolérées sont les
 * points de rupture des media queries, que CSS n'accepte pas en variable ;
 * ils doivent correspondre aux tokens --wp--custom--rupture--*, et
 * tools/valeurs-en-dur.py le vérifie.
 */


/* ---------------------------------------------------------------
 * Lien d'évitement. Premier élément focalisable du document.
 * --------------------------------------------------------------- */
.lemag-evitement {
	position: absolute;
	left: var(--wp--preset--spacing--20);
	top: var(--wp--preset--spacing--20);
	z-index: 100;
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--bleu-nuit);
	color: var(--wp--preset--color--surface);
	border-radius: var(--wp--custom--rayon--conteneur);
	font-size: var(--wp--preset--font-size--corps);
	text-decoration: underline;
	transform: translateY(-200%);
}

.lemag-evitement:focus-visible {
	transform: translateY(0);
}

/* ---------------------------------------------------------------
 * En-tête
 * --------------------------------------------------------------- */
.lemag-entete {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--wp--preset--color--surface);
	border-bottom: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet);
}

.lemag-entete__barre {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding-block: var(--wp--preset--spacing--30);
	padding-inline: var(--wp--preset--spacing--30);
}

.lemag-entete__logo {
	display: inline-flex;
	flex: 0 0 auto;
	margin-inline-end: auto;
}

/* La hauteur pilote tout le bloc : le SVG garde son rapport. */
.lemag-entete__logo img {
	display: block;
	width: auto;
	height: var(--wp--preset--font-size--tres-grand);
}

/* État compact, posé par assets/js/entete.js après défilement. */
.lemag-entete[data-compact] .lemag-entete__barre {
	padding-block: var(--wp--preset--spacing--10);
}

.lemag-entete[data-compact] .lemag-entete__panneau {
	padding-block-end: var(--wp--preset--spacing--10);
}

.lemag-entete[data-compact] .lemag-entete__logo img {
	height: var(--wp--preset--font-size--grand);
}

@media (prefers-reduced-motion: no-preference) {
	.lemag-entete__barre,
	.lemag-entete__logo img {
		transition:
			padding-block var(--wp--custom--duree--glissement) ease-out,
			height var(--wp--custom--duree--glissement) ease-out;
	}
}

/* ---------------------------------------------------------------
 * Bouton du tiroir. Présent seulement sous la rupture moyenne.
 * --------------------------------------------------------------- */
.lemag-entete__bascule {
	display: none;
	align-items: center;
	justify-content: center;
	gap: var(--wp--preset--spacing--10);
	min-width: var(--wp--custom--cible--minimum);
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--20);
	background: transparent;
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--encre);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
	cursor: pointer;
}

.lemag-entete__bascule svg {
	width: var(--wp--preset--font-size--corps);
	height: var(--wp--preset--font-size--corps);
	fill: currentColor;
}

.lemag-entete__bascule .lemag-entete__croix,
.lemag-entete__bascule[aria-expanded="true"] .lemag-entete__barres {
	display: none;
}

.lemag-entete__bascule[aria-expanded="true"] .lemag-entete__croix {
	display: block;
}

/* ---------------------------------------------------------------
 * Panneau. Un seul DOM : rangée en large, tiroir en étroit.
 * Rien n'est cloné, donc rien ne peut désynchroniser les deux états.
 * --------------------------------------------------------------- */
.lemag-entete__panneau {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
}

/* En large, deux rangées : le masthead, puis la navigation sur toute la
 * largeur. Sept rubriques aux noms longs plus la recherche et le bouton
 * newsletter ne tiennent pas sur une seule ligne, même à 1180 px.
 *
 * Le panneau devient transparent à la grille (display: contents) : ses
 * enfants deviennent des cases de la grille de l'en-tête et se répartissent
 * sur les deux rangées, sans qu'aucun élément soit dupliqué ni déplacé dans
 * le DOM. En étroit, ce même panneau redevient une vraie boîte, le tiroir.
 */
@media (min-width: 900px) {
	.lemag-entete__barre {
		display: grid;
		grid-template-columns: auto 1fr auto;
		align-items: center;
		row-gap: var(--wp--preset--spacing--20);
	}

	.lemag-entete__panneau {
		display: contents;
	}

	.lemag-entete__logo {
		grid-row: 1;
		grid-column: 1;
		margin-inline-end: 0;
	}

	.lemag-recherche {
		grid-row: 1;
		grid-column: 2;
		justify-self: end;
	}

	.lemag-entete__newsletter {
		grid-row: 1;
		grid-column: 3;
	}

	.lemag-entete__nav {
		grid-row: 2;
		grid-column: 1 / -1;
	}
}

.lemag-entete__nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30);
	margin: 0;
	padding: 0;
	list-style: none;
}

.lemag-entete__nav a {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--cible--minimum);
	color: var(--wp--preset--color--encre);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 700;
	text-decoration: none;
}

.lemag-entete__nav a:hover,
.lemag-entete__nav a[aria-current] {
	color: var(--wp--preset--color--bleu-loire-texte);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

.lemag-entete__voile {
	display: none;
}

@media (max-width: 899px) {
	.lemag-entete__bascule {
		display: inline-flex;
	}

	.lemag-entete__panneau {
		position: fixed;
		inset-block: 0;
		inset-inline-end: 0;
		z-index: 60;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		width: min(88vw, var(--wp--custom--rupture--s));
		padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--30);
		background: var(--wp--preset--color--surface);
		border-inline-start: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet);
		overflow-y: auto;
		overscroll-behavior: contain;
		transform: translateX(100%);
		visibility: hidden;
	}

	.lemag-entete__panneau[data-ouvert] {
		transform: translateX(0);
		visibility: visible;
	}

	/* visibility reste HORS transition, délibérément.
	 *
	 * C'est elle qui rend le panneau fermé non focalisable : sans JavaScript,
	 * c'est la seule chose qui empêche la tabulation d'entrer dans un tiroir
	 * hors écran. La mettre dans une transition la fige à sa valeur de départ
	 * le temps de l'animation — le panneau ouvert reste alors invisible et le
	 * piège de focus ne s'arme jamais. La retarder plutôt que l'interpoler
	 * corrige l'ouverture mais fait dépendre la fermeture d'un minuteur.
	 *
	 * On ne fait dépendre l'accessibilité ni de l'un ni de l'autre : seule la
	 * translation s'anime. Le tiroir glisse à l'ouverture et disparaît net à
	 * la fermeture. */
	@media (prefers-reduced-motion: no-preference) {
		.lemag-entete__panneau {
			transition: transform var(--wp--custom--duree--glissement) ease-out;
		}
	}

	.lemag-entete__nav ul {
		flex-direction: column;
		gap: 0;
	}

	.lemag-entete__nav a {
		padding-block: var(--wp--preset--spacing--20);
		border-bottom: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet);
		font-size: var(--wp--preset--font-size--corps);
	}

	.lemag-entete__voile {
		display: block;
		position: fixed;
		inset: 0;
		z-index: 55;
		background: var(--wp--preset--color--encre);
		opacity: 0;
		visibility: hidden;
	}

	.lemag-entete__voile[data-ouvert] {
		opacity: 0.5;
		visibility: visible;
	}

	@media (prefers-reduced-motion: no-preference) {
		.lemag-entete__voile {
			transition: opacity var(--wp--custom--duree--glissement) ease-out;
		}
	}
}

/* Défilement bloqué pendant que le tiroir est ouvert. Posé par
   assets/js/tiroir.js, en attribut plutôt qu'en style en ligne. */
:root[data-tiroir-ouvert] {
	overflow: hidden;
}

/* ---------------------------------------------------------------
 * Fil d'Ariane. Le JSON-LD correspondant est produit par le
 * mu-plugin lemag-schema, jamais par le thème.
 * --------------------------------------------------------------- */
.lemag-fil {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding-block: var(--wp--preset--spacing--20);
	padding-inline: var(--wp--preset--spacing--30);
}

.lemag-fil ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--10);
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
	color: var(--wp--preset--color--gris-3);
}

.lemag-fil li + li::before {
	content: "/";
	margin-inline-end: var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--filet-fort);
}

/* Les maillons sont des cibles à part entière, pas des liens au fil d'une
   phrase : ils prennent la hauteur minimale comme tout le reste. */
.lemag-fil a,
.lemag-fil [aria-current="page"] {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--cible--minimum);
}

.lemag-fil a {
	color: var(--wp--preset--color--bleu-loire-texte);
}

.lemag-fil [aria-current="page"] {
	color: var(--wp--preset--color--gris-2);
}

/* ---------------------------------------------------------------
 * Pied de page. Aplat bleu nuit : les liens sont en blanc souligné,
 * jamais en bleu Loire, qui n'y tient que 2,86:1.
 * --------------------------------------------------------------- */
.lemag-pied {
	background: var(--wp--preset--color--bleu-nuit);
	color: var(--wp--preset--color--surface);
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40);
}

.lemag-pied__grille {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--wp--custom--grille--colonne-minimum)), 1fr));
	gap: var(--wp--preset--spacing--50);
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
}

.lemag-pied__titre {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 500;
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
	color: var(--wp--preset--color--surface);
}

.lemag-pied ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.lemag-pied a {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--cible--minimum);
	color: var(--wp--preset--color--surface);
	font-size: var(--wp--preset--font-size--petit);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

.lemag-pied a:focus-visible {
	outline-color: var(--wp--preset--color--surface);
}

.lemag-pied__logo img {
	display: block;
	width: auto;
	/* Le logo du pied portait une taille de police comme hauteur : ça marchait,
	   mais ça liait la marque à l'échelle typographique, et il s'en trouvait
	   étriqué. Il a maintenant son propre jeton. */
	height: var(--wp--custom--logo--pied);
}

/* Le descriptif sous le logo. Mesure courte : c'est un pied de page, pas un
   paragraphe de lecture. */
.lemag-pied__descriptif {
	margin: var(--wp--preset--spacing--30) 0 0;
	max-width: var(--wp--custom--mesure--pied);
	font-size: var(--wp--preset--font-size--petit);
	line-height: var(--wp--custom--interligne--courant);
	color: var(--wp--preset--color--surface);
}

.lemag-pied__mentions {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	margin-block-start: var(--wp--preset--spacing--50);
	padding-block-start: var(--wp--preset--spacing--30);
	padding-inline: var(--wp--preset--spacing--30);
	border-top: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--surface);
}

/* ---------------------------------------------------------------
 * Recherche. Formulaire GET nu : il fonctionne sans JavaScript,
 * et sans une ligne de CSS du cœur à écraser.
 * --------------------------------------------------------------- */
.lemag-recherche {
	display: flex;
	align-items: stretch;
	gap: var(--wp--preset--spacing--10);
}

/* Le libellé de recherche est masqué à l'œil mais conservé pour les
   lecteurs d'écran, par l'utilitaire .lemag-hors-ecran plus bas. Le
   placeholder n'est pas un libellé : il disparaît à la première frappe. */

.lemag-recherche__champ {
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--20);
	background: var(--wp--preset--color--papier);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--encre);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--petit);
}

.lemag-recherche__champ::placeholder {
	color: var(--wp--preset--color--gris-3);
}

.lemag-recherche__bouton {
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--bleu-loire);
	border: 0;
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--surface);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 700;
	cursor: pointer;
}

.lemag-entete__newsletter {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--bleu-nuit);
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--surface);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.lemag-entete__newsletter:hover {
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

@media (max-width: 899px) {
	.lemag-entete__panneau > * {
		margin-block-start: var(--wp--preset--spacing--30);
	}

	.lemag-recherche,
	.lemag-entete__newsletter {
		width: 100%;
	}

	.lemag-entete__newsletter {
		justify-content: center;
	}
}

/* ===============================================================
 * ARTICLES
 * =============================================================== */

/* Masquage visuel conservant l'annonce vocale. */
.lemag-hors-ecran,
.lemag-recherche__label {
	position: absolute;
	width: var(--wp--custom--trait--fin);
	height: var(--wp--custom--trait--fin);
	margin: calc(-1 * var(--wp--custom--trait--fin));
	padding: 0;
	overflow: hidden;
	white-space: nowrap;
	clip-path: inset(50%);
}

/* Surtitre de rubrique, au-dessus du titre. */
.lemag-surtitre {
	display: inline-block;
	margin-block-end: var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--bleu-loire-texte);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 500;
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
	text-decoration: none;
}

.lemag-surtitre:hover {
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

/* ---------------------------------------------------------------
 * Carte article
 * --------------------------------------------------------------- */
.lemag-carte {
	position: relative;
	display: grid;
	gap: var(--wp--preset--spacing--20);
}

/* Le lien du titre s'étend sur toute la carte : un seul arrêt de tabulation,
   une cible tactile de la taille de la carte, et aucune image enveloppée
   dans un second lien vers la même destination. */
.lemag-carte__titre a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.lemag-carte__image {
	display: block;
	overflow: hidden;
	border-radius: var(--wp--custom--rayon--carte);
	background: var(--wp--custom--motif--placeholder);
}

.lemag-carte__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.lemag-carte__titre {
	margin: 0;
	font-size: var(--wp--preset--font-size--moyen);
	line-height: var(--wp--custom--interligne--intertitre);
	letter-spacing: var(--wp--custom--chasse--intertitre);
}

.lemag-carte__titre a {
	color: var(--wp--preset--color--encre);
	text-decoration: none;
}

.lemag-carte__titre a:hover {
	color: var(--wp--preset--color--bleu-loire-texte);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

.lemag-carte__chapo {
	margin: 0;
	color: var(--wp--preset--color--gris-2);
}

.lemag-carte__meta {
	margin: 0;
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-carte__meta > * + *::before {
	content: "·";
	margin-inline: var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--filet-fort);
}

.lemag-carte--une .lemag-carte__image {
	aspect-ratio: var(--wp--custom--ratio--une);
}

.lemag-carte--une .lemag-carte__titre {
	font-size: var(--wp--preset--font-size--tres-grand);
	font-weight: 800;
	line-height: var(--wp--custom--interligne--titre);
	letter-spacing: var(--wp--custom--chasse--titre);
}

.lemag-carte--liste .lemag-carte__image {
	aspect-ratio: var(--wp--custom--ratio--liste);
}

.lemag-carte--compacte {
	padding-block-start: var(--wp--preset--spacing--20);
	border-top: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet);
	gap: var(--wp--preset--spacing--10);
}

.lemag-carte--compacte .lemag-carte__titre {
	font-size: var(--wp--preset--font-size--corps);
	font-weight: 700;
}

@media (min-width: 640px) {
	.lemag-carte--liste {
		grid-template-columns: minmax(0, 1fr) 2fr;
		align-items: start;
		column-gap: var(--wp--preset--spacing--30);
	}
}

/* ---------------------------------------------------------------
 * À la une
 * --------------------------------------------------------------- */
.lemag-une__titre {
	margin: 0 0 var(--wp--preset--spacing--30);
	padding-block-end: var(--wp--preset--spacing--10);
	border-bottom: var(--wp--custom--trait--fort) solid var(--wp--preset--color--encre);
	font-size: var(--wp--preset--font-size--moyen);
	font-family: var(--wp--preset--font-family--mono);
	font-weight: 500;
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-une__grille {
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

.lemag-une__secondaires {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	align-content: start;
}

@media (min-width: 900px) {
	.lemag-une__grille {
		grid-template-columns: 2fr 1fr;
	}
}

/* ---------------------------------------------------------------
 * Métadonnées, signature, liés, partage
 * --------------------------------------------------------------- */
.lemag-meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30);
	color: var(--wp--preset--color--gris-2);
	font-size: var(--wp--preset--font-size--petit);
}

.lemag-meta__maj {
	color: var(--wp--preset--color--encre);
	font-weight: 700;
}

.lemag-signature {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--30);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	background: var(--wp--preset--color--surface);
}

/* Le portrait ne rétrécit pas et n'oblige pas le texte à passer dessous tant
   qu'il reste de quoi lire : au-dessous de cette base, la biographie se
   coupait en mots isolés sur un téléphone. */
.lemag-signature__portrait {
	flex: 0 0 auto;
	margin: 0;
}

.lemag-signature__portrait img {
	display: block;
	width: var(--wp--custom--portrait--signature);
	height: var(--wp--custom--portrait--signature);
	border-radius: 50%;
	object-fit: cover;
}

.lemag-signature__corps {
	flex: 1 1 var(--wp--custom--colonne--signature);
	min-width: 0;
}

.lemag-signature__intitule {
	margin: 0 0 var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-signature__nom {
	margin: 0 0 var(--wp--preset--spacing--10);
	font-size: var(--wp--preset--font-size--moyen);
	font-weight: 700;
}

.lemag-signature__fonction {
	margin: 0 0 var(--wp--preset--spacing--20);
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-signature__bio {
	margin: 0 0 var(--wp--preset--spacing--20);
	max-width: var(--wp--custom--mesure--lecture);
	color: var(--wp--preset--color--gris-2);
}

.lemag-signature__tous {
	margin: 0;
	font-size: var(--wp--preset--font-size--petit);
}

/* ---------------------------------------------------------------
 * Présentation d'auteur
 * --------------------------------------------------------------- */
.lemag-auteur {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--40);
	align-items: start;
	margin-block: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--40);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	background: var(--wp--preset--color--surface);
}

.lemag-auteur__portrait {
	flex: 0 0 auto;
	margin: 0;
}

.lemag-auteur__portrait img {
	display: block;
	width: var(--wp--custom--portrait--auteur);
	height: var(--wp--custom--portrait--auteur);
	border-radius: 50%;
	object-fit: cover;
}

.lemag-auteur__corps {
	flex: 1 1 var(--wp--custom--colonne--auteur);
	min-width: 0;
}

.lemag-auteur__role {
	margin: 0 0 var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-auteur__bio {
	margin: 0 0 var(--wp--preset--spacing--20);
	max-width: var(--wp--custom--mesure--lecture);
	color: var(--wp--preset--color--gris-2);
}

.lemag-auteur__contact {
	margin: 0;
	font-size: var(--wp--preset--font-size--petit);
}

.lemag-lies__titre {
	margin: 0 0 var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--grand);
}

.lemag-lies__liste {
	display: grid;
	gap: var(--wp--preset--spacing--30);
	margin: 0;
	padding: 0;
	list-style: none;
}

.lemag-lies__article {
	margin: 0;
	font-size: var(--wp--preset--font-size--corps);
	font-weight: 700;
}

.lemag-lies__article a {
	color: var(--wp--preset--color--encre);
	text-decoration: none;
}

.lemag-lies__article a:hover {
	color: var(--wp--preset--color--bleu-loire-texte);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

.lemag-lies__date {
	margin: var(--wp--preset--spacing--10) 0 0;
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

@media (min-width: 640px) {
	.lemag-lies__liste {
		grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--wp--custom--grille--colonne-minimum)), 1fr));
	}
}

.lemag-partage__intitule {
	margin: 0 0 var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-partage__liste {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10);
	margin: 0;
	padding: 0;
	list-style: none;
}

.lemag-partage__liste a,
.lemag-partage__liste button {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--20);
	background: var(--wp--preset--color--surface);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--encre);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--petit);
	text-decoration: none;
	cursor: pointer;
}

.lemag-partage__liste a:hover,
.lemag-partage__liste button:hover {
	border-color: var(--wp--preset--color--bleu-loire-texte);
	color: var(--wp--preset--color--bleu-loire-texte);
}

/* ---------------------------------------------------------------
 * Corps d'article
 * --------------------------------------------------------------- */
.lemag-chapo {
	max-width: var(--wp--custom--mesure--lecture);
	color: var(--wp--preset--color--gris-2);
	font-size: var(--wp--preset--font-size--moyen);
	line-height: var(--wp--custom--interligne--courant);
}

/* L'essentiel : HTML plat, premier bloc textuel après le titre. Aucun
   repliement, aucun onglet — un moteur de réponse doit pouvoir le citer
   sans exécuter la page. */
.lemag-essentiel {
	padding: var(--wp--preset--spacing--30);
	border-inline-start: var(--wp--custom--trait--fort) solid var(--wp--preset--color--bleu-loire);
	background: var(--wp--preset--color--surface);
	border-radius: 0 var(--wp--custom--rayon--conteneur) var(--wp--custom--rayon--conteneur) 0;
}

.lemag-essentiel__titre {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 500;
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
	color: var(--wp--preset--color--bleu-loire-texte);
}

.lemag-essentiel ul {
	margin: 0;
	padding-inline-start: var(--wp--preset--spacing--30);
}

.lemag-essentiel li + li {
	margin-block-start: var(--wp--preset--spacing--10);
}

.lemag-encadre {
	padding: var(--wp--preset--spacing--30);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	background: var(--wp--preset--color--surface);
}

.lemag-encadre__titre {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-size: var(--wp--preset--font-size--moyen);
}

.lemag-figure figcaption {
	color: var(--wp--preset--color--gris-3);
}

.lemag-figure__credit {
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

/* ===============================================================
 * SERVICES
 * =============================================================== */

/* Piège à robots. Masqué comme le reste des contenus hors écran, jamais
   par display:none seul, que les automates repèrent. */
.lemag-piege {
	position: absolute;
	width: var(--wp--custom--trait--fin);
	height: var(--wp--custom--trait--fin);
	margin: calc(-1 * var(--wp--custom--trait--fin));
	padding: 0;
	overflow: hidden;
	white-space: nowrap;
	clip-path: inset(50%);
}

/* Champs de formulaire partagés par les filtres et la newsletter. */
.lemag-filtres label,
.lemag-newsletter__champ label {
	display: block;
	margin-block-end: var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--gris-2);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 700;
}

.lemag-filtres input,
.lemag-filtres select,
/* La case du consentement bloque l'inscription : elle doit etre atteignable.
 * Sans regle, elle garde sa taille native, ~14 px — sous les 44 px du
 * projet, et meme sous les 24 px du critere 2.5.8 de WCAG 2.2. */
.lemag-newsletter input[type="checkbox"] {
	inline-size: var(--wp--custom--cible--minimum);
	block-size: var(--wp--custom--cible--minimum);
	flex: 0 0 auto;
	margin: 0;
}

.lemag-newsletter input[type="email"] {
	width: 100%;
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--20);
	background: var(--wp--preset--color--surface);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--encre);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--corps);
}

.lemag-filtres button,
.lemag-newsletter button {
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--bleu-loire);
	border: 0;
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--surface);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--corps);
	font-weight: 700;
	cursor: pointer;
}

/* ---------------------------------------------------------------
 * Carte événement
 * --------------------------------------------------------------- */
.lemag-evenement {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--wp--preset--spacing--30);
	align-items: start;
	padding-block: var(--wp--preset--spacing--30);
	border-top: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet);
}

.lemag-evenement__pastille {
	margin: 0;
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	background: var(--wp--preset--color--bleu-nuit);
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--surface);
	text-align: center;
}

.lemag-evenement__pastille time {
	display: block;
}

.lemag-evenement__jour {
	display: block;
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 800;
	line-height: var(--wp--custom--interligne--affiche);
}

.lemag-evenement__mois,
.lemag-evenement__annee {
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-evenement__titre {
	margin: 0;
	font-size: var(--wp--preset--font-size--moyen);
	line-height: var(--wp--custom--interligne--intertitre);
}

.lemag-evenement__titre a {
	color: var(--wp--preset--color--encre);
	text-decoration: none;
}

.lemag-evenement__titre a:hover {
	color: var(--wp--preset--color--bleu-loire-texte);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

.lemag-evenement__ou,
.lemag-evenement__duree {
	margin: var(--wp--preset--spacing--10) 0 0;
	color: var(--wp--preset--color--gris-2);
	font-size: var(--wp--preset--font-size--petit);
}

/* Date prévisionnelle : elle se lit avant le titre, pas après.
   Le lecteur doit savoir qu'il ne peut pas encore réserver. */
.lemag-evenement__recurrence {
	margin: 0 0 var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

.lemag-evenement__provisoire {
	margin: 0 0 var(--wp--preset--spacing--10);
	color: var(--wp--preset--color--gris-2);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
}

/* ---------------------------------------------------------------
 * Éditions précédentes, sous l'agenda
 * --------------------------------------------------------------- */
.lemag-editions {
	margin-block-start: var(--wp--preset--spacing--60);
	padding-block-start: var(--wp--preset--spacing--40);
	border-top: var(--wp--custom--trait--fort) solid var(--wp--preset--color--filet-fort);
}

.lemag-editions__titre {
	margin: 0;
	font-size: var(--wp--preset--font-size--moyen);
	line-height: var(--wp--custom--interligne--intertitre);
}

.lemag-editions__chapo {
	margin: var(--wp--preset--spacing--10) 0 var(--wp--preset--spacing--30);
	color: var(--wp--preset--color--gris-2);
	font-size: var(--wp--preset--font-size--petit);
}

/* Les cartes passées sont en retrait : présentes, jamais confondues avec
   l'agenda courant. Le retrait se joue sur la seule pastille de date, dont le
   fond passe du bleu nuit au gris — 5,05:1 avec le blanc, donc toujours AA.
   Pas d'opacité sur le conteneur : elle aurait éclairci le texte lui-même et
   fait passer les cartes sous le seuil, pour un effet purement décoratif. */
.lemag-editions__liste .lemag-evenement__pastille {
	background: var(--wp--preset--color--gris-3);
}

.lemag-editions__tout {
	margin: var(--wp--preset--spacing--30) 0 0;
	font-size: var(--wp--preset--font-size--petit);
}

/* ---------------------------------------------------------------
 * Cartes commune et numéro
 * --------------------------------------------------------------- */
.lemag-commune {
	padding: var(--wp--preset--spacing--30);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	background: var(--wp--preset--color--surface);
}

.lemag-commune__nom {
	margin: 0;
	font-size: var(--wp--preset--font-size--moyen);
}

.lemag-commune__nom a {
	color: var(--wp--preset--color--encre);
	text-decoration: none;
}

.lemag-commune__nom a:hover {
	color: var(--wp--preset--color--bleu-loire-texte);
	text-decoration: underline;
	text-underline-offset: var(--wp--custom--trait--fort);
}

.lemag-commune__insee {
	margin: var(--wp--preset--spacing--10) 0 0;
	color: var(--wp--preset--color--gris-3);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: var(--wp--custom--chasse--mono);
}

/* ---------------------------------------------------------------
 * Filtres d'agenda
 * --------------------------------------------------------------- */
.lemag-filtres {
	padding: var(--wp--preset--spacing--30);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	background: var(--wp--preset--color--surface);
}

.lemag-filtres__titre {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 500;
	letter-spacing: var(--wp--custom--chasse--mono);
	text-transform: uppercase;
	color: var(--wp--preset--color--gris-3);
}

.lemag-filtres__champs {
	display: grid;
	gap: var(--wp--preset--spacing--20);
}

.lemag-filtres__champ {
	margin: 0;
}

.lemag-filtres__actions a {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--cible--minimum);
}

.lemag-filtres__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	margin: var(--wp--preset--spacing--30) 0 0;
}

@media (min-width: 640px) {
	.lemag-filtres__champs {
		grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--wp--custom--grille--colonne-minimum)), 1fr));
	}
}

/* ---------------------------------------------------------------
 * Newsletter
 * --------------------------------------------------------------- */
.lemag-newsletter {
	padding: var(--wp--preset--spacing--40);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	background: var(--wp--preset--color--surface);
}

.lemag-newsletter__titre {
	margin: 0 0 var(--wp--preset--spacing--10);
	font-size: var(--wp--preset--font-size--grand);
}

.lemag-newsletter__chapo {
	margin: 0 0 var(--wp--preset--spacing--30);
	max-width: var(--wp--custom--mesure--lecture);
	color: var(--wp--preset--color--gris-2);
}

.lemag-newsletter__message {
	margin: 0 0 var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--20);
	border-inline-start: var(--wp--custom--trait--fort) solid var(--wp--preset--color--succes);
	border-radius: 0 var(--wp--custom--rayon--carte) var(--wp--custom--rayon--carte) 0;
	background: var(--wp--preset--color--papier);
	color: var(--wp--preset--color--gris-2);
}

.lemag-newsletter__message--erreur {
	border-inline-start-color: var(--wp--preset--color--erreur);
}

.lemag-newsletter__champ {
	margin: 0 0 var(--wp--preset--spacing--20);
	max-width: var(--wp--custom--grille--colonne-minimum);
}

.lemag-newsletter__accord {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--10);
	margin: 0 0 var(--wp--preset--spacing--30);
	max-width: var(--wp--custom--mesure--lecture);
}

/* La case fait 24 px à l'œil — le minimum du critère 2.5.8 — et sa zone
   d'appui est portée à 44 px par un pseudo-élément, sans que la mise en
   page ne grossisse. Une case de 44 px pleine serait disgracieuse. */
.lemag-newsletter__accord input[type="checkbox"] {
	position: relative;
	flex: 0 0 auto;
	inline-size: var(--wp--custom--cible--case);
	block-size: var(--wp--custom--cible--case);
	margin: 0;
	accent-color: var(--wp--preset--color--bleu-loire);
}

.lemag-newsletter__accord input[type="checkbox"]::after {
	content: "";
	position: absolute;
	inset: calc((var(--wp--custom--cible--case) - var(--wp--custom--cible--minimum)) / 2);
}

.lemag-newsletter__accord label {
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--gris-2);
}

.lemag-newsletter__actions {
	margin: 0;
}

/* ---------------------------------------------------------------
 * Pagination et résultats
 * --------------------------------------------------------------- */
.lemag-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10);
	margin: 0;
	padding: 0;
	list-style: none;
}

.lemag-pagination a,
.lemag-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--wp--custom--cible--minimum);
	min-height: var(--wp--custom--cible--minimum);
	padding-inline: var(--wp--preset--spacing--20);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	color: var(--wp--preset--color--bleu-loire-texte);
	font-size: var(--wp--preset--font-size--petit);
	text-decoration: none;
}

.lemag-pagination .current {
	background: var(--wp--preset--color--bleu-nuit);
	border-color: var(--wp--preset--color--bleu-nuit);
	color: var(--wp--preset--color--surface);
	font-weight: 700;
}

.lemag-pagination a:hover {
	border-color: var(--wp--preset--color--bleu-loire-texte);
	text-decoration: underline;
}

.lemag-resultats__titre {
	margin: 0 0 var(--wp--preset--spacing--10);
}

.lemag-resultats__compte {
	margin: 0;
	color: var(--wp--preset--color--gris-2);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--petit);
}

.lemag-resultats__issue {
	margin-block-start: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--30);
	border: var(--wp--custom--trait--fin) solid var(--wp--preset--color--filet-fort);
	border-radius: var(--wp--custom--rayon--conteneur);
	background: var(--wp--preset--color--surface);
	max-width: var(--wp--custom--mesure--lecture);
}

.lemag-resultats__issue p {
	margin: 0 0 var(--wp--preset--spacing--20);
}

.lemag-resultats__issue ul {
	margin: 0;
	padding-inline-start: var(--wp--preset--spacing--30);
	color: var(--wp--preset--color--gris-2);
}

.lemag-resultats__issue li + li {
	margin-block-start: var(--wp--preset--spacing--10);

	/* ---------------------------------------------------------------
	 * Contenus d'une commune
	 * --------------------------------------------------------------- */
	.lemag-commune-contenus {
		margin-block-start: var(--wp--preset--spacing--50);
	}

	.lemag-commune-contenus__titre {
		margin: 0 0 var(--wp--preset--spacing--30);
		padding-block-end: var(--wp--preset--spacing--10);
		border-bottom: var(--wp--custom--trait--fort) solid var(--wp--preset--color--encre);
		font-size: var(--wp--preset--font-size--grand);
	}

	.lemag-commune-contenus__liste {
		display: grid;
		gap: var(--wp--preset--spacing--20);
	}

	@media (min-width: 640px) {
		.lemag-commune-contenus--articles .lemag-commune-contenus__liste {
			grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--wp--custom--grille--colonne-minimum)), 1fr));
			column-gap: var(--wp--preset--spacing--40);
		}
	}
}

/* ---------------------------------------------------------------
 * Chapô d'archive
 * --------------------------------------------------------------- */
.lemag-chapo {
	margin: 0 0 var(--wp--preset--spacing--40);
	max-width: var(--wp--custom--mesure--lecture);
	font-size: var(--wp--preset--font-size--moyen);
	line-height: var(--wp--custom--interligne--courant);
	color: var(--wp--preset--color--gris-2);
}