/*
Theme Name: La Sieste
Theme URI: https://la-sieste.fr
Description: Thème enfant de GeneratePress pour la-sieste.fr. Toute la charte est pilotée par theme.json — n'ajoutez du CSS ici qu'en dernier recours.
Author: la-sieste.fr
Template: generatepress
Version: 1.43.0
Text Domain: la-sieste
*/

/* Accessibilité : focus toujours visible */
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--terracotta);
	outline-offset: 3px;
}

/* Respect des préférences de mouvement réduit */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

/* En-tête : séparation discrète du contenu */
.site-header {
	border-bottom: 1px solid var(--wp--preset--color--bordure);
}

/* Pied de page : titres de colonnes en Fraunces */
.footer-widgets h2,
.footer-widgets h3,
.footer-widgets h4 {
	font-family: var(--wp--preset--font-family--titre);
	font-size: 20px;
	font-weight: 300;
	letter-spacing: 0;
	text-transform: none;
	color: var(--wp--preset--color--creme);
	margin-bottom: 16px;
}
.footer-widgets .wp-block-list,
.footer-widgets p {
	font-size: 14px;
	line-height: 1.9;
}
.site-info {
	font-size: 13px;
}

/* Page d'accueil : les sections gèrent leur propre respiration */
.home .site-content .content-area {
	padding: 0;
}

/* ============================================================
   COUCHE v1.1 — profondeur, matière, mouvement, densité
   ============================================================ */

:root {
	/* Alias des jetons du theme.json. Aucune valeur n'est définie ici :
	   modifier une ombre ou une durée se fait dans theme.json, à un seul endroit. */
	--ombre-1: var(--wp--custom--ombre--un);
	--ombre-2: var(--wp--custom--ombre--deux);
	--ombre-3: var(--wp--custom--ombre--trois);
	--ombre-action: var(--wp--custom--ombre--action);
	--duree-rapide: var(--wp--custom--duree--rapide);
	--duree-carte: var(--wp--custom--duree--carte);
	--duree-entree: var(--wp--custom--duree--entree);
	--courbe-douce: var(--wp--custom--courbe--douce);
	--ls-colonne: var(--wp--style--global--content-size, 720px);
}

/* --- Finitions typographiques --- */
h1, h2, h3, h4, .wp-block-heading { text-wrap: balance; }
p { text-wrap: pretty; }
h1, h2, h3 { font-optical-sizing: auto; }
.ls-titre-accent { font-weight: 600; }

/* --- En-tête translucide au défilement --- */
.site-header {
	background: rgb(253 251 247 / .82);
	backdrop-filter: blur(14px) saturate(1.4);
	-webkit-backdrop-filter: blur(14px) saturate(1.4);
}

/* --- Grain sur les fonds sombres --- */
.ls-grain { position: relative; isolation: isolate; }
.ls-grain::after {
	content: ""; position: absolute; inset: 0; z-index: 1;
	pointer-events: none; opacity: .045;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.ls-grain > * { position: relative; z-index: 2; }

/* --- Dégradé maillé --- */
.ls-halo { position: relative; }
.ls-halo::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background:
		radial-gradient(ellipse at 15% 20%, rgb(184 179 233 / .26), transparent 55%),
		radial-gradient(ellipse at 85% 80%, rgb(226 114 91 / .18), transparent 50%);
}
.ls-halo > * { position: relative; z-index: 2; }

/* --- Cartes cliquables --- */
.ls-carte {
	position: relative;
	border-radius: var(--wp--custom--rayon--carte);
	box-shadow: var(--ombre-2);
	transition: transform var(--duree-carte) var(--courbe-douce),
	            box-shadow var(--duree-carte) var(--courbe-douce);
}
.ls-carte:hover, .ls-carte:focus-within {
	transform: translateY(-3px);
	box-shadow: var(--ombre-3);
}
.ls-carte .ls-fleche {
	display: inline-block; color: var(--wp--preset--color--terracotta);
	transition: transform var(--duree-carte) var(--courbe-douce);
}
.ls-carte:hover .ls-fleche { transform: translateX(4px); }
/* Lien étendu : toute la carte devient cliquable, le focus reste au clavier */
.ls-carte .ls-lien::after { content: ""; position: absolute; inset: 0; }

/* --- Verre dépoli + cartes débordantes --- */
.ls-verre {
	background: rgb(253 251 247 / .88);
	backdrop-filter: blur(16px) saturate(1.3);
	-webkit-backdrop-filter: blur(16px) saturate(1.3);
	border: 1px solid rgb(255 255 255 / .5);
}
.ls-debord { margin-top: -70px; position: relative; z-index: 3; }
@media (max-width: 768px) { .ls-debord { margin-top: -40px; } }

/* --- Grille bento --- */
.ls-bento { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ls-bento > .ls-large { grid-column: span 2; }
@media (max-width: 1024px) { .ls-bento { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .ls-bento { grid-template-columns: 1fr; }
                             .ls-bento > .ls-large { grid-column: span 1; } }

/* --- Cartouche d'icône --- */
.ls-icone {
	display: flex; align-items: center; justify-content: center;
	width: 42px; height: 42px; border-radius: var(--wp--custom--rayon--icone);
	background: var(--wp--preset--color--creme);
}
.ls-icone svg { width: 22px; height: 22px; }

/* --- Grands chiffres --- */
.ls-chiffre {
	font-family: var(--wp--preset--font-family--titre);
	font-weight: 300; line-height: 1;
	font-size: clamp(2.4rem, 5vw, 3.4rem);
	color: var(--wp--preset--color--nuit);
	font-variant-numeric: tabular-nums;
}

/* --- Boutons --- */
.wp-block-button__link { transition: background-color var(--duree-rapide) ease-out, transform var(--duree-rapide) ease-out; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link { box-shadow: var(--ombre-action); }

/* --- Vignettes : zoom contenu au survol --- */
.ls-vignette { overflow: hidden; border-radius: var(--wp--custom--rayon--vignette); }
.ls-vignette img { display: block; transition: transform 400ms var(--courbe-douce); }
.ls-carte:hover .ls-vignette img { transform: scale(1.03); }

/* --- Bande défilante --- */
.ls-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ls-marquee__piste { display: flex; width: max-content; animation: ls-defile 40s linear infinite; }
.ls-marquee:hover .ls-marquee__piste { animation-play-state: paused; }
.ls-marquee p { white-space: nowrap; padding-right: 2.5rem; margin: 0; }
@keyframes ls-defile { to { transform: translateX(-50%); } }

/* --- Apparition au défilement, sans JavaScript --- */
@media (prefers-reduced-motion: no-preference) {
	.ls-apparait {
		animation: ls-monte var(--duree-entree) ease-out both;
		animation-timeline: view();
		animation-range: entry 0% cover 22%;
	}
}
@keyframes ls-monte {
	from { opacity: 0; transform: translateY(24px); }
	to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.ls-marquee__piste { animation: none; }
}

/* --- Rendu différé hors écran --- */
.ls-differe { content-visibility: auto; contain-intrinsic-size: auto 600px; }

/* --- Bento v1.5 : trois colonnes, dernière rangée ouverte --- */
.ls-bento { grid-template-columns: repeat(3, 1fr); gap: 18px; }
.ls-bento > .ls-large { grid-column: span 1; }
@media (max-width: 900px) { .ls-bento { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .ls-bento { grid-template-columns: 1fr; } }

/* Carte de rubrique : vignette en tête, texte lisible */
.ls-rub { padding: 0 !important; overflow: hidden; }
.ls-rub .wp-block-image { margin: 0; }
.ls-rub .wp-block-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0; }
.ls-rub__corps { padding: 22px 24px 20px; }
.ls-rub__corps p { color: var(--wp--preset--color--texte); }
.ls-rub__meta { display: flex; justify-content: space-between; align-items: center;
	font-size: 13px; color: var(--wp--preset--color--texte-doux); margin-top: 12px; }

/* Newsletter : carte encadrée posée sur le crème */
.ls-encart { border-radius: var(--wp--custom--rayon--encart); overflow: hidden; }

/* ============================================================
   COUCHE v1.6 — GABARIT D'ARTICLE
   Rendu par les modules PHP de /inc/. Les classes de la couche
   v1.1 (.ls-carte, .ls-vignette, .ls-lien, .ls-grain, .ls-halo,
   .ls-fleche, .ls-encart) sont réutilisées telles quelles.
   ============================================================ */

/* --- Colonne de lecture : titre et en-tête alignés sur le corps --- */
.single-post .entry-header,
.ls-entete-article,
.ls-chapo,
.ls-signature,
.ls-sommaire,
.ls-sources {
	max-width: var(--ls-colonne);
	margin-inline: auto;
}

/* --- Fil d'Ariane --- */
.ls-entete-article {
	margin-bottom: var(--wp--preset--spacing--20);
}
.ls-fil {
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--texte-doux);
	margin-bottom: var(--wp--preset--spacing--10);
}
.ls-fil a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color var(--duree-rapide) ease-out;
}
.ls-fil a:hover { border-bottom-color: var(--wp--preset--color--texte-doux); }
.ls-fil .separator { padding: 0 .35em; opacity: .6; }

/* --- Pastille de rubrique + durée de lecture --- */
.ls-meta-haut {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	margin: 0;
}
.ls-chip {
	display: inline-block;
	padding: 5px 14px;
	border-radius: var(--wp--custom--rayon--pastille);
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wp--preset--color--nuit);
}
a.ls-chip:hover { filter: brightness(.96); }
.ls-duree {
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--texte-doux);
}

/* --- Chapô --- */
.ls-chapo {
	font-size: var(--wp--preset--font-size--moyen);
	line-height: 1.6;
	color: var(--wp--preset--color--texte-doux);
	margin-block: var(--wp--preset--spacing--20) var(--wp--preset--spacing--20);
}

/* --- Signature et relecture --- */
.ls-signature {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px var(--wp--preset--spacing--20);
	padding-block: var(--wp--preset--spacing--20);
	border-block: 1px solid var(--wp--preset--color--bordure);
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--texte-doux);
	margin-bottom: var(--wp--preset--spacing--30);
}
.ls-signature a {
	color: var(--wp--preset--color--texte);
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--bordure);
}
.ls-signature a:hover { border-bottom-color: var(--wp--preset--color--terracotta); }
.ls-signature__maj { font-weight: 500; color: var(--wp--preset--color--texte); }
.ls-signature__relu {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--wp--preset--color--texte);
}
.ls-signature__relu::before,
.ls-puce-relecture {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--sauge);
	flex: none;
}

/* --- Image mise en avant --- */
.single-post .post-image img,
.single-post .featured-image img {
	border-radius: var(--wp--custom--rayon--vignette);
}

/* --- Sommaire --- */
.ls-sommaire {
	background: var(--wp--preset--color--sable);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: var(--wp--custom--rayon--carte);
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	margin-bottom: var(--wp--preset--spacing--40);
}
.ls-sommaire__titre {
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
	cursor: pointer;
	list-style-position: outside;
}
.ls-sommaire__liste {
	margin: var(--wp--preset--spacing--20) 0 0;
	padding-left: 1.4em;
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.5;
}
.ls-sommaire__liste li { margin-bottom: 10px; }
.ls-sommaire__liste a {
	color: var(--wp--preset--color--texte);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color var(--duree-rapide) ease-out;
}
.ls-sommaire__liste a:hover { border-bottom-color: var(--wp--preset--color--terracotta); }

/* Les ancres ne doivent pas passer sous l'en-tête collant */
.single-post h2[id] { scroll-margin-top: 90px; }

/* --- Emplacements publicitaires réservés --- */
.ls-pub {
	min-height: var(--wp--custom--pub--hauteur);
	margin-block: var(--wp--preset--spacing--40);
	max-width: var(--ls-colonne);
	margin-inline: auto;
}
/* Repère visible uniquement pour la rédaction, jamais pour le lecteur */
.ls-pub--repere {
	border: 1px dashed var(--wp--preset--color--bordure);
	border-radius: var(--wp--custom--rayon--vignette);
	display: flex;
	align-items: center;
	justify-content: center;
}
.ls-pub--repere::after {
	content: "Emplacement publicitaire réservé — " attr(data-emplacement);
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--micro);
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
	opacity: .55;
}

/* --- FAQ : conteneur des blocs core/details --- */
.ls-faq { margin-block: var(--wp--preset--spacing--40); }
.ls-faq .wp-block-details {
	border-bottom: 1px solid var(--wp--preset--color--bordure);
	padding-block: var(--wp--preset--spacing--20);
}
.ls-faq .wp-block-details summary {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	cursor: pointer;
	color: var(--wp--preset--color--nuit);
}
.ls-faq .wp-block-details[open] summary { margin-bottom: var(--wp--preset--spacing--10); }

/* --- Sources --- */
.ls-sources {
	background: var(--wp--preset--color--lavande-clair);
	border-radius: var(--wp--custom--rayon--carte);
	padding: var(--wp--preset--spacing--30);
	margin-block: var(--wp--preset--spacing--40);
}
.ls-sources__titre {
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
	margin: 0 0 var(--wp--preset--spacing--20);
}
.ls-sources__liste {
	margin: 0;
	padding-left: 1.4em;
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.6;
	color: var(--wp--preset--color--texte);
}
.ls-sources__liste li { margin-bottom: 10px; }
.ls-sources__liste a { color: var(--wp--preset--color--texte); word-break: break-word; }
.ls-sources__methode {
	margin: var(--wp--preset--spacing--20) 0 0;
	font-size: var(--wp--preset--font-size--micro);
}
.ls-sources__methode a { color: var(--wp--preset--color--texte-doux); }

/* --- Bloc auteur --- */
.ls-auteur {
	display: flex;
	gap: var(--wp--preset--spacing--30);
	align-items: flex-start;
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	padding: var(--wp--preset--spacing--30);
	max-width: var(--ls-colonne);
	margin: var(--wp--preset--spacing--40) auto;
}
.ls-auteur:hover { transform: none; box-shadow: var(--ombre-2); }
.ls-auteur__media { flex: none; }
.ls-auteur__portrait {
	width: var(--wp--custom--portrait--auteur);
	height: var(--wp--custom--portrait--auteur);
	border-radius: var(--wp--custom--rayon--pastille);
	object-fit: cover;
}
.ls-auteur__nom {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--moyen);
	font-weight: 400;
	margin: 0 0 6px;
}
.ls-auteur__nom a { color: var(--wp--preset--color--nuit); text-decoration: none; }
.ls-auteur__nom a:hover { border-bottom: 1px solid var(--wp--preset--color--terracotta); }
.ls-auteur__fonction {
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--texte-doux);
}
.ls-auteur__bio {
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.65;
	color: var(--wp--preset--color--texte);
	margin: 0;
}
.ls-auteur__relecture {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: var(--wp--preset--spacing--20) 0 0;
	padding-top: var(--wp--preset--spacing--20);
	border-top: 1px solid var(--wp--preset--color--bordure);
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}
@media (max-width: 600px) {
	.ls-auteur { flex-direction: column; }
}

/* --- Newsletter de fin d'article --- */
.ls-infolettre {
	margin-block: var(--wp--preset--spacing--50);
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	text-align: center;
	color: var(--wp--preset--color--texte-clair);
}
.ls-infolettre__corps { max-width: 520px; margin-inline: auto; }
.ls-infolettre__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 300;
	color: var(--wp--preset--color--creme);
	margin: 0 0 var(--wp--preset--spacing--20);
}
.ls-infolettre__texte {
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.7;
	margin: 0 0 var(--wp--preset--spacing--30);
}
.ls-infolettre__lien { margin: 0; }
.ls-bouton {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 28px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--texte);
	font-size: 17px;
	font-weight: 500;
	text-decoration: none;
	box-shadow: var(--ombre-action);
	transition: background-color var(--duree-rapide) ease-out;
}
.ls-bouton:hover { background: var(--wp--preset--color--terracotta-fonce); color: var(--wp--preset--color--blanc); }
.ls-bouton:hover .ls-fleche { transform: translateX(4px); }
.ls-bouton .ls-fleche { color: currentColor; }

/* --- Articles liés --- */
.ls-lies { margin-block: var(--wp--preset--spacing--50); }
.ls-lies__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	margin: 0 0 var(--wp--preset--spacing--30);
}
.ls-lies__grille {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}
@media (max-width: 900px) { .ls-lies__grille { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .ls-lies__grille { grid-template-columns: 1fr; } }
.ls-lies__carte {
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.ls-lies__carte .ls-vignette { border-radius: 0; }
.ls-lies__carte .ls-vignette img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.ls-lies__corps {
	padding: var(--wp--preset--spacing--20);
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}
.ls-lies__corps .ls-chip { align-self: flex-start; margin: 0; }
.ls-lies__titre-article {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--moyen);
	font-weight: 400;
	line-height: 1.3;
	margin: 0;
}
.ls-lies__titre-article a { color: var(--wp--preset--color--nuit); text-decoration: none; }
.ls-lies__meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: auto 0 0;
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}

/* ============================================================
   COUCHE v1.7 — PAGES PILIERS, ENCADRÉS PAR CLASSE, RÉPONSE EXPRESS
   ============================================================ */

/* --- Encadrés éditoriaux : une classe, aucun style en ligne dans l'article --- */
.ls-encadre {
	border-radius: var(--wp--custom--rayon--vignette);
	padding: var(--wp--preset--spacing--30);
	margin-block: var(--wp--preset--spacing--40);
}
.ls-encadre--science  { background: var(--wp--preset--color--lavande-clair); }
.ls-encadre--retenir  { background: var(--wp--preset--color--sauge-clair); }
.ls-encadre--pratique { background: var(--wp--preset--color--sable); }
.ls-encadre > p:first-child,
.ls-encadre__surtitre {
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo);
	margin: 0 0 var(--wp--preset--spacing--10);
}
.ls-encadre > :last-child { margin-bottom: 0; }
.ls-encadre ul, .ls-encadre ol { padding-left: 1.3em; }

/* --- Réponse express : la réponse avant l'explication ---
   Premier bloc de chaque article. Lisible en vingt secondes, autonome,
   c'est ce que reprennent les extraits enrichis et les moteurs de réponse. */
.ls-reponse {
	border-left: 3px solid var(--wp--preset--color--terracotta);
	padding: var(--wp--preset--spacing--10) 0 var(--wp--preset--spacing--10) var(--wp--preset--spacing--30);
	margin-block: 0 var(--wp--preset--spacing--40);
}
.ls-reponse > p:first-child {
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
	margin: 0 0 8px;
}
.ls-reponse > p:last-child {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	line-height: 1.35;
	color: var(--wp--preset--color--nuit);
	margin: 0;
}

/* --- Tableaux éditoriaux --- */
.single-post table, .ls-pilier table {
	font-size: var(--wp--preset--font-size--petit);
	font-variant-numeric: tabular-nums;
	border-collapse: collapse;
}
.single-post table th, .ls-pilier table th {
	text-align: left;
	font-weight: 600;
	background: var(--wp--preset--color--sable);
}
.single-post table td, .single-post table th,
.ls-pilier table td, .ls-pilier table th {
	border: 1px solid var(--wp--preset--color--bordure);
	padding: 10px 12px;
}

/* --- Pilier : en-tête coloré pleine largeur --- */
.ls-pilier .entry-header { display: none; }
.ls-pilier__entete {
	padding-block: var(--wp--preset--spacing--50);
	margin-bottom: var(--wp--preset--spacing--40);
}
.ls-pilier__interieur {
	max-width: var(--ls-colonne);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--20);
}
.ls-pilier__surtitre {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
	margin: 0 0 var(--wp--preset--spacing--20);
}
.ls-pilier__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--xxl);
	font-weight: 300;
	line-height: 1.15;
	color: var(--wp--preset--color--nuit);
	margin: 0 0 var(--wp--preset--spacing--20);
}
.ls-pilier__chapo {
	font-size: var(--wp--preset--font-size--moyen);
	line-height: 1.6;
	color: var(--wp--preset--color--texte);
	margin: 0;
}

/* --- Pilier : cocons voisins --- */
.ls-voisins { margin-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); }
.ls-voisins__grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
@media (max-width: 600px) { .ls-voisins__grille { grid-template-columns: 1fr; } }
.ls-voisin {
	display: grid;
	gap: 6px;
	padding: var(--wp--preset--spacing--30);
	text-decoration: none;
	color: var(--wp--preset--color--nuit);
	border: 1px solid var(--wp--preset--color--bordure);
}
.ls-voisin__label {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
}
.ls-voisin__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
}

/* --- Carte produit (comparatifs, liens affiliés) --- */
.ls-carte-produit {
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: var(--wp--custom--rayon--carte);
	background: var(--wp--preset--color--blanc);
	padding: var(--wp--preset--spacing--20);
	margin-block: var(--wp--preset--spacing--30);
}
.ls-carte-produit h4 { margin-top: 0; }
.ls-carte-produit img { border-radius: var(--wp--custom--rayon--vignette); }
.ls-carte-produit .wp-block-buttons { margin-block: var(--wp--preset--spacing--10); }

/* ============================================================
   COUCHE v1.8 — BLOCS ÉDITORIAUX ILLUSTRÉS
   Cartes, étapes, chiffres, bandeaux d'appel, à faire / à éviter.
   Tout en blocs natifs (group, columns, image, cover), zéro style en ligne.
   ============================================================ */

/* --- Sortie de colonne : un bloc plus large que le texte (1100 px max) --- */
.ls-large {
	width: min(var(--wp--custom--largeur--large), 100%);
	margin-inline: auto;
	margin-block: var(--wp--preset--spacing--40);
}

/* --- Grille de cartes illustrées --- */
.ls-cartes {
	display: grid;
	gap: 22px;
	grid-template-columns: repeat(3, 1fr);
}
.ls-cartes--2 { grid-template-columns: repeat(2, 1fr); }
.ls-cartes--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .ls-cartes, .ls-cartes--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .ls-cartes, .ls-cartes--2, .ls-cartes--4 { grid-template-columns: 1fr; } }

.ls-carte-visuel {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: var(--wp--custom--rayon--carte);
	box-shadow: var(--wp--custom--ombre--un);
	overflow: hidden;
	transition: transform var(--wp--custom--duree--carte) var(--courbe-douce), box-shadow var(--wp--custom--duree--carte) var(--courbe-douce);
}
.ls-carte-visuel:has(a):hover, .ls-carte-visuel:focus-within {
	transform: translateY(-3px);
	box-shadow: var(--wp--custom--ombre--trois);
}
.ls-carte-visuel .wp-block-image { margin: 0; }
.ls-carte-visuel .wp-block-image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	transition: transform 400ms var(--courbe-douce);
}
.ls-cartes--carre .ls-carte-visuel .wp-block-image img { aspect-ratio: 1 / 1; }
.ls-carte-visuel:has(a):hover .wp-block-image img { transform: scale(1.03); }
.ls-carte-visuel__corps {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30) var(--wp--preset--spacing--30);
}
.ls-carte-visuel__corps > * { margin: 0; }
.ls-carte-visuel__chip {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
}
.ls-carte-visuel__titre, .ls-carte-visuel h3, .ls-carte-visuel h4 {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	line-height: 1.2;
	color: var(--wp--preset--color--nuit);
	text-wrap: balance;
}
.ls-carte-visuel__titre a { color: inherit; text-decoration: none; }
.ls-carte-visuel__titre a::after { content: ""; position: absolute; inset: 0; }
.ls-carte-visuel:focus-within { outline: 2px solid var(--wp--preset--color--terracotta); outline-offset: 2px; }
.ls-carte-visuel__texte {
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.55;
	color: var(--wp--preset--color--texte);
}
.ls-carte-visuel__grand {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 300;
	line-height: 1;
	color: var(--wp--preset--color--nuit);
	font-variant-numeric: tabular-nums;
}
/* Teintes de cocon sur le chip */
.ls-carte-visuel--lavande .ls-carte-visuel__chip, .ls-carte-visuel--bienfaits .ls-carte-visuel__chip { color: var(--wp--preset--color--indigo); }

/* --- Étapes illustrées : même carte, numéro en cartouche indigo --- */
.ls-etapes .ls-carte-visuel { counter-increment: etape; }
.ls-etapes { counter-reset: etape; }
.ls-etapes .ls-carte-visuel__chip::before {
	content: counter(etape, decimal-leading-zero);
	display: inline-block;
	min-width: 28px;
	padding: 3px 8px;
	margin-right: 8px;
	border-radius: var(--wp--custom--rayon--icone);
	background: var(--wp--preset--color--indigo);
	color: var(--wp--preset--color--creme);
	font-variant-numeric: tabular-nums;
	text-align: center;
}

/* --- Chiffres clés : densité et autorité --- */
.ls-chiffres {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
	padding: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--sable);
	border-radius: var(--wp--custom--rayon--carte);
	margin-block: var(--wp--preset--spacing--40);
}
@media (max-width: 600px) { .ls-chiffres { grid-template-columns: 1fr; } }
.ls-chiffres > .wp-block-group { display: grid; gap: 4px; }
.ls-chiffres p { margin: 0; }
.ls-chiffres__valeur {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--xxl);
	font-weight: 300;
	line-height: 1;
	color: var(--wp--preset--color--nuit);
	font-variant-numeric: tabular-nums;
}
.ls-chiffres__label { font-size: var(--wp--preset--font-size--petit); color: var(--wp--preset--color--texte); }
.ls-chiffres__source { grid-column: 1 / -1; }
.ls-chiffres__source, .ls-chiffres__source a {
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}

/* --- Bandeau d'appel à l'action (bloc Couverture) --- */
.ls-cta {
	border-radius: var(--wp--custom--rayon--encart);
	overflow: hidden;
	position: relative;
	box-shadow: var(--wp--custom--ombre--deux);
}
.ls-cta .wp-block-cover__inner-container {
	max-width: 520px;
	margin-left: 0;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40);
}
.ls-cta .wp-block-cover__inner-container > * { margin: 0 0 var(--wp--preset--spacing--20); }
.ls-cta .wp-block-cover__inner-container > :last-child { margin-bottom: 0; }
.ls-cta__surtitre {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--lavande);
}
.ls-cta h3 {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 300;
	line-height: 1.15;
	color: var(--wp--preset--color--creme);
	text-wrap: balance;
}
.ls-cta p { color: var(--wp--preset--color--texte-clair); font-size: var(--wp--preset--font-size--base); }
.ls-cta .wp-block-button__link { box-shadow: var(--wp--custom--ombre--action); }

/* --- À faire / à éviter --- */
.ls-faire-eviter { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-block: var(--wp--preset--spacing--40); }
@media (max-width: 640px) { .ls-faire-eviter { grid-template-columns: 1fr; } }
.ls-faire-eviter > .wp-block-group {
	padding: var(--wp--preset--spacing--30);
	border-radius: var(--wp--custom--rayon--carte);
}
.ls-faire-eviter__faire { background: var(--wp--preset--color--sauge-clair); }
.ls-faire-eviter__eviter { background: var(--wp--preset--color--corail-clair); }
.ls-faire-eviter > .wp-block-group > p:first-child {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo);
	margin: 0 0 var(--wp--preset--spacing--10);
}
.ls-faire-eviter ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.ls-faire-eviter li { position: relative; padding-left: 28px; font-size: var(--wp--preset--font-size--petit); line-height: 1.5; }
.ls-faire-eviter li::before {
	position: absolute; left: 0; top: 0;
	width: 20px; height: 20px; border-radius: 50%;
	font-size: 12px; line-height: 20px; text-align: center; font-weight: 600;
	color: var(--wp--preset--color--creme);
}
.ls-faire-eviter__faire li::before { content: "✓"; background: var(--wp--preset--color--sauge); }
.ls-faire-eviter__eviter li::before { content: "✕"; background: var(--wp--preset--color--terracotta-fonce); }

/* --- Image de corps avec légende --- */
.ls-figure { margin-block: var(--wp--preset--spacing--40); }
.ls-figure img { border-radius: var(--wp--custom--rayon--vignette); width: 100%; height: auto; display: block; }
.ls-figure figcaption {
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
	margin-top: 10px;
	text-align: left;
}

/* Apparition au défilement des blocs illustrés */
@media (prefers-reduced-motion: no-preference) {
	.ls-cartes > .ls-carte-visuel, .ls-chiffres, .ls-cta, .ls-faire-eviter {
		animation: ls-monte var(--wp--custom--duree--entree) ease-out both;
		animation-timeline: view();
		animation-range: entry 0% cover 20%;
	}
	.ls-cartes > .ls-carte-visuel:nth-child(2) { animation-delay: 60ms; }
	.ls-cartes > .ls-carte-visuel:nth-child(3) { animation-delay: 120ms; }
}

/* ============================================================
   COUCHE v1.11 — NEUTRALISATION DES RÈGLES DE MISE EN PAGE WORDPRESS
   WordPress ajoute automatiquement is-layout-constrained et
   has-global-padding à tout bloc Groupe. Sur nos blocs en grille, ces
   règles produisent trois défauts : un padding latéral parasite, une
   marge automatique sur les items, et une marge haute sur tous les
   enfants sauf le premier — d'où des cartes décalées verticalement.
   ============================================================ */

/* Padding latéral parasite sur les conteneurs de grille et les cartes */
.ls-cartes,
.ls-faire-eviter,
.ls-carte-visuel {
	padding-left: 0;
	padding-right: 0;
}

/* Marge haute appliquée à tous les enfants sauf le premier */
.ls-cartes > *,
.ls-chiffres > *,
.ls-faire-eviter > *,
.ls-carte-visuel > *,
.ls-carte-visuel__corps > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* Marges automatiques et largeur maximale imposées aux items de grille */
.ls-cartes > *,
.ls-chiffres > *,
.ls-faire-eviter > * {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Sortie de colonne : la règle WordPress pose margin-left/right auto en
   !important, il faut donc le même poids pour l'emporter. */
.entry-content .ls-large,
.ls-large {
	max-width: none !important;
	width: min(var(--wp--custom--largeur--large), 100%) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Sécurité : si le module Blog de GP repasse l'image mise en avant sur un
   pilier, le bandeau coloré reste la seule en-tête visible. */
.ls-pilier .featured-image.page-header-image { display: none; }

/* Le bandeau de pilier s'étend sur toute la largeur du conteneur, pas de
   la fenêtre : sans barre latérale, calc(50% - 50vw) déborde. */
.ls-pilier__entete {
	width: auto;
	margin-left: calc(-1 * var(--wp--preset--spacing--40));
	margin-right: calc(-1 * var(--wp--preset--spacing--40));
}
@media (max-width: 768px) {
	.ls-pilier__entete {
		margin-left: calc(-1 * var(--wp--preset--spacing--30));
		margin-right: calc(-1 * var(--wp--preset--spacing--30));
	}
}

/* ============================================================
   COUCHE v1.12 — CORRECTIFS D'AFFICHAGE
   ============================================================ */

/* Le bouton du bloc lettre était invisible : GeneratePress colore tout lien
   de .inside-article en terracotta, soit du terracotta sur du terracotta.
   Il faut la même spécificité pour reprendre la main. */
.inside-article a.ls-bouton,
.inside-article a.ls-bouton:hover,
.inside-article a.ls-bouton:focus {
	color: var(--wp--preset--color--blanc);
	text-decoration: none;
}

/* GeneratePress affiche sa propre ligne date et auteur sous le contenu, en
   plus de la signature du gabarit. Une seule suffit, et c'est la nôtre :
   elle porte aussi la date de mise à jour et la mention de relecture. */
.single-post .entry-meta,
.ls-pilier .entry-meta { display: none; }

/* Espacement de l'en-tête d'article : l'image, le titre et le chapô forment
   un bloc, pas trois éléments séparés par du vide. */
.single-post .featured-image { margin-bottom: var(--wp--preset--spacing--30); }
.single-post .entry-header { margin-bottom: 0; }
.single-post .entry-content { margin-top: var(--wp--preset--spacing--30); }

/* ============================================================
   COUCHE v1.15 — MENU, BOUCLES D'ARTICLES, DÉBORDEMENT, PIED DE PAGE
   ============================================================ */

/* --- Garde-fou contre le défilement horizontal ---
   Une seule largeur en 100vw suffit à rendre la page plus large que la
   fenêtre, à cause de la barre de défilement. On coupe le débordement
   latéral sans casser les éléments collants. */
html, body { overflow-x: clip; max-width: 100%; }

/* ============================================================
   MENU PRINCIPAL
   ============================================================ */
.main-navigation .main-nav ul li a {
	position: relative;
	padding-inline: 16px;
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.01em;
	transition: color var(--duree-rapide) ease-out;
}

/* Trait fin qui se déploie depuis le centre au survol. Pas de changement de
   fond, pas de déplacement : rien ne doit bouger sur un site sur le repos. */
.main-navigation .main-nav ul li a::after {
	content: "";
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 18px;
	height: 1px;
	background: var(--wp--preset--color--terracotta);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform var(--duree-carte) var(--courbe-douce);
}
.main-navigation .main-nav ul li a:hover::after,
.main-navigation .main-nav ul li a:focus::after,
.main-navigation .main-nav ul li[class*="current-menu-"] > a::after {
	transform: scaleX(1);
}

/* Point terracotta sur la rubrique courante, en rappel du logo. */
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
	color: var(--wp--preset--color--nuit);
}

/* L'en-tête se détache du contenu par un filet, jamais par une ombre. */
.site-header {
	border-bottom: 1px solid var(--wp--preset--color--bordure);
}

@media (prefers-reduced-motion: reduce) {
	.main-navigation .main-nav ul li a::after { transition: none; }
}

/* ============================================================
   BOUCLES D'ARTICLES (À la une, archives, blocs Query)
   Le bloc Query de WordPress ne reçoit pas sa grille dans un thème
   classique : on la pose nous-mêmes. Vaut aussi pour toutes les futures
   boucles sans avoir à réinsérer le pattern.
   ============================================================ */
.wp-block-post-template {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}
@media (max-width: 900px) { .wp-block-post-template { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .wp-block-post-template { grid-template-columns: 1fr; } }

.wp-block-post-template > li {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
}

.wp-block-post-template .wp-block-post-featured-image {
	margin: 0;
	border-radius: var(--wp--custom--rayon--vignette);
	overflow: hidden;
}
.wp-block-post-template .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform 400ms var(--courbe-douce);
}
.wp-block-post-template > li:hover .wp-block-post-featured-image img { transform: scale(1.03); }

/* Chip de rubrique : pastille colorée, pas un lien souligné en terracotta. */
.wp-block-post-template .wp-block-post-terms {
	margin: 0;
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.inside-article .wp-block-post-terms a,
.wp-block-post-template .wp-block-post-terms a {
	color: var(--wp--preset--color--texte-doux);
	text-decoration: none;
}
.inside-article .wp-block-post-terms a:hover,
.wp-block-post-template .wp-block-post-terms a:hover {
	color: var(--wp--preset--color--terracotta);
}

/* Titre d'article : Fraunces sur nuit, jamais terracotta souligné. */
.wp-block-post-template .wp-block-post-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	line-height: 1.25;
	text-wrap: balance;
}
.inside-article .wp-block-post-template .wp-block-post-title a,
.wp-block-post-template .wp-block-post-title a {
	color: var(--wp--preset--color--nuit);
	text-decoration: none;
}
.inside-article .wp-block-post-template .wp-block-post-title a:hover,
.wp-block-post-template .wp-block-post-title a:hover {
	color: var(--wp--preset--color--terracotta);
}

/* ============================================================
   PIED DE PAGE
   ============================================================ */
.footer-widgets .widget-title,
.footer-widgets h2 {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--moyen);
	margin-bottom: var(--wp--preset--spacing--20);
}
.footer-widgets ul { list-style: none; margin: 0; padding: 0; }
.footer-widgets li { margin-bottom: 10px; }
.footer-widgets a {
	text-decoration: none;
	transition: color var(--duree-rapide) ease-out;
}
.footer-widgets a:hover { text-decoration: underline; text-underline-offset: 3px; }
.site-info a { text-decoration: none; }
.site-info a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ============================================================
   COUCHE v1.16 — FORMULAIRE D'INSCRIPTION (Brevo)
   Le formulaire vit dans Brevo, son apparence vit ici. Aucune couleur
   ni taille écrite en dur : si la charte bouge, le formulaire suit.
   ============================================================ */
.ls-form { max-width: 520px; }
.ls-form p { margin: 0 0 var(--wp--preset--spacing--20); }

.ls-form__label {
	display: block;
	margin-bottom: 8px;
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
}

.ls-form__saisie {
	width: 100%;
	padding: 14px 18px;
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: var(--wp--custom--rayon--vignette);
	background: var(--wp--preset--color--creme);
	color: var(--wp--preset--color--texte);
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--base);
	transition: border-color var(--duree-rapide) ease-out, box-shadow var(--duree-rapide) ease-out;
}
.ls-form__saisie::placeholder { color: var(--wp--preset--color--texte-doux); }
.ls-form__saisie:focus {
	outline: none;
	border-color: var(--wp--preset--color--indigo);
	box-shadow: 0 0 0 3px rgb(184 179 233 / .35);
}

/* Case de consentement : alignée sur la première ligne, jamais pré-cochée. */
.ls-form__consentement {
	display: grid;
	grid-template-columns: 20px 1fr;
	gap: 10px;
	align-items: start;
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.5;
	color: var(--wp--preset--color--texte);
}
.ls-form__consentement input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin: 3px 0 0;
	accent-color: var(--wp--preset--color--terracotta);
	cursor: pointer;
}
.ls-form__consentement label { cursor: pointer; }

.ls-form__bouton {
	width: 100%;
	padding: 14px 28px;
	border: 0;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 500;
	cursor: pointer;
	box-shadow: var(--wp--custom--ombre--action);
	transition: background-color var(--duree-rapide) ease-out;
}
.ls-form__bouton:hover,
.ls-form__bouton:focus { background: var(--wp--preset--color--terracotta-fonce); }

.ls-form__mention,
.ls-form__mention a {
	font-size: var(--wp--preset--font-size--micro);
	line-height: 1.5;
	color: var(--wp--preset--color--texte-doux);
}

/* Champ et bouton côte à côte dès qu'il y a la place. */
@media (min-width: 620px) {
	.ls-form { display: grid; grid-template-columns: 1fr auto; gap: 12px var(--wp--preset--spacing--20); align-items: end; }
	.ls-form__champ { grid-column: 1; margin: 0; }
	.ls-form__action { grid-column: 2; margin: 0; }
	.ls-form__bouton { width: auto; white-space: nowrap; }
	.ls-form__consentement, .ls-form__mention { grid-column: 1 / -1; }
}

/* Messages de retour de Brevo repris à la charte. */
.sib-form-message-panel,
.entry-content .sib-form-message-panel {
	margin-top: var(--wp--preset--spacing--20);
	padding: 14px 18px;
	border-radius: var(--wp--custom--rayon--vignette);
	font-size: var(--wp--preset--font-size--petit);
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--sauge-clair);
	color: var(--wp--preset--color--texte);
}
#error-message .sib-form-message-panel,
.sib-form-message-panel--error {
	background: var(--wp--preset--color--corail-clair);
}

/* ============================================================
   COUCHE v1.17 — FICHES DE LIEUX (annuaire)
   ============================================================ */
.ls-lieu {
	padding: var(--wp--preset--spacing--30);
	margin-block: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: var(--wp--custom--rayon--carte);
	box-shadow: var(--wp--custom--ombre--un);
	transition: box-shadow var(--duree-carte) var(--courbe-douce);
}
.ls-lieu:hover { box-shadow: var(--wp--custom--ombre--deux); }
.ls-lieu > * { margin-block: 0 var(--wp--preset--spacing--10); }
.ls-lieu > :last-child { margin-bottom: 0; }

.ls-lieu__chip {
	display: inline-block;
	padding: 4px 12px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--rose-clair);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo);
}
.ls-lieu h3 {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	color: var(--wp--preset--color--nuit);
	margin-top: var(--wp--preset--spacing--10);
}
.ls-lieu__adresse {
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--texte-doux);
}
.ls-lieu__adresse strong { color: var(--wp--preset--color--texte); font-weight: 500; }
.ls-lieu__pratique {
	font-size: var(--wp--preset--font-size--petit);
	padding: 10px 14px;
	border-radius: var(--wp--custom--rayon--vignette);
	background: var(--wp--preset--color--sable);
	color: var(--wp--preset--color--texte);
}
.ls-lieu .wp-block-buttons { margin-top: var(--wp--preset--spacing--20); }
.inside-article .ls-lieu .is-style-outline a.wp-block-button__link {
	background: transparent;
	border: 1px solid var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--terracotta);
	padding: 8px 20px;
	font-size: var(--wp--preset--font-size--petit);
	box-shadow: none;
}
.inside-article .ls-lieu .is-style-outline a.wp-block-button__link:hover {
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--blanc);
}

/* ============================================================
   COUCHE v1.18 — PAGES VILLE : RYTHME ET HIÉRARCHIE
   Une page d'annuaire empile facilement quinze cartes blanches
   identiques. Ces règles créent deux zones distinctes, le gratuit
   et le payant, et deux niveaux de fiche, la principale et les
   secondaires.
   ============================================================ */

/* --- Zone « dehors, gratuit » : fond sauge, sortie de colonne --- */
.ls-zone {
	width: min(var(--wp--custom--largeur--large), 100%) !important;
	max-width: none !important;
	margin-inline: auto !important;
	margin-block: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
	border-radius: var(--wp--custom--rayon--encart);
	background: var(--wp--preset--color--sauge-clair);
}
.ls-zone--abri { background: var(--wp--preset--color--sable); }
.ls-zone > * {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.ls-zone > h2:first-child,
.ls-zone > .wp-block-heading:first-child { margin-top: 0; }
@media (max-width: 600px) {
	.ls-zone { padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20); }
}

.ls-zone__surtitre {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo);
	margin: 0 0 var(--wp--preset--spacing--10);
}

/* Dans une zone colorée, la fiche reste blanche pour se détacher. */
.ls-zone .ls-lieu { background: var(--wp--preset--color--blanc); }

/* --- Fiche principale : plus grande, avec un filet d'accent --- */
.ls-lieu--phare {
	border-left: 4px solid var(--wp--preset--color--sauge);
	box-shadow: var(--wp--custom--ombre--deux);
}
.ls-lieu--phare h3 { font-size: var(--wp--preset--font-size--xl); font-weight: 300; }

/* --- Fiches secondaires : deux colonnes, format court --- */
.ls-lieux-compact {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
	margin-block: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
}
@media (max-width: 640px) { .ls-lieux-compact { grid-template-columns: 1fr; } }
.ls-lieux-compact > * { max-width: none !important; margin: 0 !important; }

.ls-lieu-compact {
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--wp--preset--color--bordure);
	border-radius: var(--wp--custom--rayon--vignette);
}
.ls-lieu-compact > * { margin: 0 0 6px !important; }
.ls-lieu-compact > :last-child { margin-bottom: 0 !important; }
.ls-lieu-compact h3,
.ls-lieu-compact h4 {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--moyen);
	font-weight: 400;
	line-height: 1.25;
	color: var(--wp--preset--color--nuit);
}
.ls-lieu-compact__situation {
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}
.ls-lieu-compact__texte {
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.55;
	color: var(--wp--preset--color--texte);
}

/* --- Étiquettes par nature de lieu --- */
.ls-lieu__chip--parc      { background: var(--wp--preset--color--sauge-clair); }
.ls-lieu__chip--jardin    { background: var(--wp--preset--color--lavande-clair); }
.ls-lieu__chip--eau       { background: var(--wp--preset--color--bleu-clair); }
.ls-lieu__chip--interieur { background: var(--wp--preset--color--sable); }
.ls-lieu__chip--hotel     { background: var(--wp--preset--color--rose-clair); }

/* --- Repères chiffrés en tête de zone --- */
.ls-reperes {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30);
	margin-block: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	padding-bottom: var(--wp--preset--spacing--20);
	border-bottom: 1px solid rgb(27 29 62 / .08);
}
.ls-reperes > .wp-block-group { margin: 0 !important; max-width: none !important; }
.ls-reperes p { margin: 0; }
.ls-reperes__valeur {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 300;
	line-height: 1.1;
	color: var(--wp--preset--color--nuit);
	font-variant-numeric: tabular-nums;
}
.ls-reperes__label {
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}

/* ============================================================
   COUCHE v1.19 — PICTOGRAMMES
   Trait fin 1,5 px, terminaisons arrondies, jamais de forme pleine.
   L'icône prend la couleur du texte de son conteneur, sans exception.
   ============================================================ */
.ls-ico {
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
	color: inherit;
	vertical-align: -0.22em;
}
.ls-ico--grand { width: 24px; height: 24px; }

/* Dans une étiquette : l'icône précède le texte, même ligne, même couleur. */
.ls-lieu__chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

/* Dans un cartouche : fond crème, rayon 10, pour les listes pratiques. */
.ls-cartouche {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: var(--wp--custom--rayon--icone);
	background: var(--wp--preset--color--creme);
	border: 1px solid var(--wp--preset--color--bordure);
	color: var(--wp--preset--color--indigo);
}

/* Liste à pictogrammes : remplace les puces par une icône en cartouche. */
.ls-liste-ico ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.ls-liste-ico li {
	display: grid;
	grid-template-columns: 38px 1fr;
	gap: 14px;
	align-items: start;
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.55;
}
.ls-liste-ico li .ls-cartouche { margin-top: 1px; }

/* Repères chiffrés : l'icône se place au-dessus de la valeur. */
.ls-reperes .ls-ico { display: block; margin-bottom: 8px; color: var(--wp--preset--color--sauge); }
.ls-zone--abri .ls-reperes .ls-ico { color: var(--wp--preset--color--terracotta-fonce); }

/* ============================================================
   COUCHE v1.20 — CARTE DES LIEUX ET PHOTOS DE TERRAIN
   ============================================================ */

/* --- Carte : état d'attente, avant le clic --- */
.ls-carte {
	width: min(var(--wp--custom--largeur--large), 100%) !important;
	max-width: none !important;
	margin: var(--wp--preset--spacing--40) auto !important;
	height: 440px;
	border-radius: var(--wp--custom--rayon--encart);
	overflow: hidden;
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--sable);
	position: relative;
	z-index: 0;
}
@media (max-width: 600px) { .ls-carte { height: 360px; } }

.ls-carte__attente {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: var(--wp--preset--spacing--30);
	text-align: center;
	color: var(--wp--preset--color--indigo);
	/* Suggestion de plan en fond : un quadrillage très discret, sans image. */
	background-image:
		linear-gradient(rgb(27 29 62 / .05) 1px, transparent 1px),
		linear-gradient(90deg, rgb(27 29 62 / .05) 1px, transparent 1px);
	background-size: 44px 44px;
}
.ls-carte__attente p { margin: 0; }
.ls-carte__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	color: var(--wp--preset--color--nuit);
}
.ls-carte__bouton {
	padding: 12px 26px;
	border: 0;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 500;
	cursor: pointer;
	box-shadow: var(--wp--custom--ombre--action);
	transition: background-color var(--duree-rapide) ease-out;
}
.ls-carte__bouton:hover,
.ls-carte__bouton:focus { background: var(--wp--preset--color--terracotta-fonce); }
.ls-carte__bouton:disabled { opacity: .7; cursor: wait; }
.ls-carte__mention {
	max-width: 360px;
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}

/* --- Carte active : fond de plan réchauffé pour tenir la charte --- */
.ls-carte--active .leaflet-tile-pane { filter: grayscale(.55) sepia(.22) brightness(1.04) contrast(.92); }
.ls-carte--active { background: var(--wp--preset--color--creme); }

/* Repères numérotés : terracotta, parce qu'ils sont cliquables. */
.ls-carte__repere span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
	border: 2px solid var(--wp--preset--color--blanc);
	box-shadow: var(--wp--custom--ombre--deux);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--texte);
	font-size: 14px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.leaflet-popup-content-wrapper {
	border-radius: var(--wp--custom--rayon--vignette);
	font-family: var(--wp--preset--font-family--texte);
	box-shadow: var(--wp--custom--ombre--trois);
}
.leaflet-popup-content { margin: 12px 16px; font-size: var(--wp--preset--font-size--petit); line-height: 1.5; }
.leaflet-popup-content strong { font-family: var(--wp--preset--font-family--titre); font-weight: 400; font-size: var(--wp--preset--font-size--moyen); color: var(--wp--preset--color--nuit); }
.leaflet-popup-content a { color: var(--wp--preset--color--terracotta); }

/* --- Numéro de fiche, qui répond au repère de la carte --- */
.ls-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	margin-right: 8px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--texte);
	font-size: 13px;
	font-weight: 600;
	vertical-align: 0.15em;
	font-variant-numeric: tabular-nums;
}
/* L'ancre de la fiche ne doit pas passer sous l'en-tête collant. */
[id^="lieu-"] { scroll-margin-top: 96px; }

/* --- Photos de terrain dans les fiches --- */
.ls-lieu .ls-lieu__photo,
.ls-lieu-compact .ls-lieu__photo {
	margin: 0 0 var(--wp--preset--spacing--20) !important;
	border-radius: var(--wp--custom--rayon--vignette);
	overflow: hidden;
}
.ls-lieu__photo img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
.ls-lieu-compact .ls-lieu__photo img { aspect-ratio: 4 / 3; }
.ls-lieu__photo figcaption {
	margin: 6px 0 0;
	font-size: 11px;
	line-height: 1.4;
	color: var(--wp--preset--color--texte-doux);
}

/* ============================================================
   COUCHE v1.21 — PICTOGRAMMES POSÉS PAR CLASSE
   Le contenu ne porte qu'une classe : le thème dessine l'icône.
   Généré depuis inc/icones.php, qui reste la seule source de dessin.
   ============================================================ */

/* Titre de groupe : icône en cartouche crème à gauche. */
.ls-cat {
	display: flex;
	align-items: center;
	gap: 14px;
}
.ls-cat::before {
	content: "";
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	border-radius: var(--wp--custom--rayon--icone);
	background-color: var(--wp--preset--color--creme);
	border: 1px solid var(--wp--preset--color--bordure);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
}
.ls-zone .ls-cat::before { background-color: var(--wp--preset--color--blanc); }
h2.ls-cat::before { flex-basis: 44px; width: 44px; height: 44px; background-size: 22px 22px; }

/* Étiquette de fiche et ligne de situation : icône au trait, couleur du texte. */
.ls-lieu__chip::before,
.ls-lieu__adresse::before,
.ls-lieu-compact__situation::before {
	content: "";
	display: inline-block;
	flex: 0 0 auto;
	width: 15px;
	height: 15px;
	background-color: currentColor;
	-webkit-mask: var(--ls-ico) center / contain no-repeat;
	        mask: var(--ls-ico) center / contain no-repeat;
}
.ls-lieu__adresse,
.ls-lieu-compact__situation {
	display: flex;
	align-items: center;
	gap: 7px;
}
.ls-lieu__adresse,
.ls-lieu-compact__situation { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.5-5.6 6.5-10.2A6.5 6.5 0 0 0 5.5 10.8C5.5 15.4 12 21 12 21z'/%3E %3Ccircle cx='12' cy='10.5' r='2.5'/%3E%3C/svg%3E"); }
.ls-lieu__chip:not([class*="--"])::before { display: none; }

/* Liste à pictogrammes : chaque puce devient une icône en cartouche.
   La classe peut être portée par la liste elle-même ou par un groupe parent. */
.ls-liste-ico ul,
ul.ls-liste-ico { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.ls-liste-ico li,
ul.ls-liste-ico > li {
	display: grid;
	grid-template-columns: 36px 1fr;
	gap: 14px;
	align-items: center;
	margin: 0;
}
.ls-liste-ico li::before,
ul.ls-liste-ico > li::before {
	content: "";
	width: 36px;
	height: 36px;
	border-radius: var(--wp--custom--rayon--icone);
	background-color: var(--wp--preset--color--blanc);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 19px 19px;
	border: 1px solid var(--wp--preset--color--bordure);
}

.ls-cat--parc::before, .ls-ico-li--parc::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20v-5'/%3E %3Cpath d='M12 15c-3.6 0-6.5-2.7-6.5-6S8.4 3.5 12 3.5s6.5 2.2 6.5 5.5-2.9 6-6.5 6z'/%3E %3Cpath d='M4 20h16'/%3E%3C/svg%3E"); }
.ls-lieu__chip--parc { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20v-5'/%3E %3Cpath d='M12 15c-3.6 0-6.5-2.7-6.5-6S8.4 3.5 12 3.5s6.5 2.2 6.5 5.5-2.9 6-6.5 6z'/%3E %3Cpath d='M4 20h16'/%3E%3C/svg%3E"); }
.ls-cat--jardin::before, .ls-ico-li--jardin::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20v-7'/%3E %3Cpath d='M12 13c0-2.5 1.8-4.5 4.5-4.5 0 2.5-1.8 4.5-4.5 4.5z'/%3E %3Cpath d='M12 13c0-2.5-1.8-4.5-4.5-4.5 0 2.5 1.8 4.5 4.5 4.5z'/%3E %3Cpath d='M5 20h14'/%3E%3C/svg%3E"); }
.ls-lieu__chip--jardin { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20v-7'/%3E %3Cpath d='M12 13c0-2.5 1.8-4.5 4.5-4.5 0 2.5-1.8 4.5-4.5 4.5z'/%3E %3Cpath d='M12 13c0-2.5-1.8-4.5-4.5-4.5 0 2.5 1.8 4.5 4.5 4.5z'/%3E %3Cpath d='M5 20h14'/%3E%3C/svg%3E"); }
.ls-cat--eau::before, .ls-ico-li--eau::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9c1.5 0 1.5 1.5 3 1.5S7.5 9 9 9s1.5 1.5 3 1.5S13.5 9 15 9s1.5 1.5 3 1.5S19.5 9 21 9'/%3E %3Cpath d='M3 14c1.5 0 1.5 1.5 3 1.5S7.5 14 9 14s1.5 1.5 3 1.5S13.5 14 15 14s1.5 1.5 3 1.5S19.5 14 21 14'/%3E %3Cpath d='M3 19c1.5 0 1.5 1.5 3 1.5S7.5 19 9 19'/%3E%3C/svg%3E"); }
.ls-lieu__chip--eau { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9c1.5 0 1.5 1.5 3 1.5S7.5 9 9 9s1.5 1.5 3 1.5S13.5 9 15 9s1.5 1.5 3 1.5S19.5 9 21 9'/%3E %3Cpath d='M3 14c1.5 0 1.5 1.5 3 1.5S7.5 14 9 14s1.5 1.5 3 1.5S13.5 14 15 14s1.5 1.5 3 1.5S19.5 14 21 14'/%3E %3Cpath d='M3 19c1.5 0 1.5 1.5 3 1.5S7.5 19 9 19'/%3E%3C/svg%3E"); }
.ls-cat--interieur::before, .ls-ico-li--interieur::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5V8.5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v11'/%3E %3Cpath d='M4 19.5h16M8 6.5v13M16 6.5v13'/%3E %3Cpath d='M3 8.5l9-5 9 5'/%3E%3C/svg%3E"); }
.ls-lieu__chip--interieur { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5V8.5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v11'/%3E %3Cpath d='M4 19.5h16M8 6.5v13M16 6.5v13'/%3E %3Cpath d='M3 8.5l9-5 9 5'/%3E%3C/svg%3E"); }
.ls-cat--hotel::before, .ls-ico-li--hotel::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 19v-4.5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2V19M3 19h18M3 19v1.5M21 19v1.5'/%3E %3Cpath d='M6 12.5V9a1.5 1.5 0 0 1 1.5-1.5h9A1.5 1.5 0 0 1 18 9v3.5'/%3E %3Cpath d='M6 7.5V5'/%3E%3C/svg%3E"); }
.ls-lieu__chip--hotel { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 19v-4.5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2V19M3 19h18M3 19v1.5M21 19v1.5'/%3E %3Cpath d='M6 12.5V9a1.5 1.5 0 0 1 1.5-1.5h9A1.5 1.5 0 0 1 18 9v3.5'/%3E %3Cpath d='M6 7.5V5'/%3E%3C/svg%3E"); }
.ls-cat--soleil::before, .ls-ico-li--soleil::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E %3Cpath d='M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6l1.4 1.4M17 17l1.4 1.4M18.4 5.6L17 7M7 17l-1.4 1.4'/%3E%3C/svg%3E"); }
.ls-lieu__chip--soleil { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E %3Cpath d='M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6l1.4 1.4M17 17l1.4 1.4M18.4 5.6L17 7M7 17l-1.4 1.4'/%3E%3C/svg%3E"); }
.ls-cat--lieux::before, .ls-ico-li--lieux::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.5-5.6 6.5-10.2A6.5 6.5 0 0 0 5.5 10.8C5.5 15.4 12 21 12 21z'/%3E %3Ccircle cx='12' cy='10.5' r='2.5'/%3E%3C/svg%3E"); }
.ls-lieu__chip--lieux { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.5-5.6 6.5-10.2A6.5 6.5 0 0 0 5.5 10.8C5.5 15.4 12 21 12 21z'/%3E %3Ccircle cx='12' cy='10.5' r='2.5'/%3E%3C/svg%3E"); }
.ls-cat--masque::before, .ls-ico-li--masque::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5c0-1.7 1.4-3 3-3h12c1.7 0 3 1.3 3 3 0 2.5-2 4.5-4.5 4.5-1.6 0-3-.8-3.8-2h-1.4c-.8 1.2-2.2 2-3.8 2C5 16 3 14 3 11.5z'/%3E %3Cpath d='M3 11h-1.5M21 11h1.5'/%3E%3C/svg%3E"); }
.ls-lieu__chip--masque { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11.5c0-1.7 1.4-3 3-3h12c1.7 0 3 1.3 3 3 0 2.5-2 4.5-4.5 4.5-1.6 0-3-.8-3.8-2h-1.4c-.8 1.2-2.2 2-3.8 2C5 16 3 14 3 11.5z'/%3E %3Cpath d='M3 11h-1.5M21 11h1.5'/%3E%3C/svg%3E"); }
.ls-cat--plaid::before, .ls-ico-li--plaid::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6.5h13a3 3 0 0 1 0 6H8a2.5 2.5 0 0 0 0 5h12'/%3E %3Cpath d='M4 6.5v11'/%3E%3C/svg%3E"); }
.ls-lieu__chip--plaid { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6.5h13a3 3 0 0 1 0 6H8a2.5 2.5 0 0 0 0 5h12'/%3E %3Cpath d='M4 6.5v11'/%3E%3C/svg%3E"); }
.ls-cat--alarme::before, .ls-ico-li--alarme::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13' r='7'/%3E %3Cpath d='M12 9.5V13l2 1.5'/%3E %3Cpath d='M4.5 4.5l2.5 2M19.5 4.5L17 6.5'/%3E%3C/svg%3E"); }
.ls-lieu__chip--alarme { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='13' r='7'/%3E %3Cpath d='M12 9.5V13l2 1.5'/%3E %3Cpath d='M4.5 4.5l2.5 2M19.5 4.5L17 6.5'/%3E%3C/svg%3E"); }
.ls-cat--sac::before, .ls-ico-li--sac::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8.5h14l1 11H4l1-11z'/%3E %3Cpath d='M9 8.5v-2a3 3 0 0 1 6 0v2'/%3E%3C/svg%3E"); }
.ls-lieu__chip--sac { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8.5h14l1 11H4l1-11z'/%3E %3Cpath d='M9 8.5v-2a3 3 0 0 1 6 0v2'/%3E%3C/svg%3E"); }
.ls-cat--gratuit::before, .ls-ico-li--gratuit::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E %3Cpath d='M9 9.5h5.5M9 12.5h5M11 9.5v5.5'/%3E%3C/svg%3E"); }
.ls-lieu__chip--gratuit { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E %3Cpath d='M9 9.5h5.5M9 12.5h5M11 9.5v5.5'/%3E%3C/svg%3E"); }
.ls-cat--coworking::before, .ls-ico-li--coworking::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='11' rx='1.5'/%3E %3Cpath d='M8 20h8M12 16v4'/%3E %3Cpath d='M7.5 12.5h4M7.5 9.5h9'/%3E%3C/svg%3E"); }
.ls-lieu__chip--coworking { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='11' rx='1.5'/%3E %3Cpath d='M8 20h8M12 16v4'/%3E %3Cpath d='M7.5 12.5h4M7.5 9.5h9'/%3E%3C/svg%3E"); }
.ls-cat--bar-sieste::before, .ls-ico-li--bar-sieste::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 17.5v-8a5.5 5.5 0 0 1 11 0v8'/%3E %3Cpath d='M3 17.5h13M9.5 4v13.5'/%3E %3Cpath d='M17.5 8.5h3l-3 4h3'/%3E%3C/svg%3E"); }
.ls-lieu__chip--bar-sieste { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 17.5v-8a5.5 5.5 0 0 1 11 0v8'/%3E %3Cpath d='M3 17.5h13M9.5 4v13.5'/%3E %3Cpath d='M17.5 8.5h3l-3 4h3'/%3E%3C/svg%3E"); }
.ls-cat--sieste-guidee::before, .ls-ico-li--sieste-guidee::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232B2D5B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E %3Cpath d='M7 12a5 5 0 0 1 5-5M17 12a5 5 0 0 1-5 5'/%3E %3Cpath d='M3.5 12A8.5 8.5 0 0 1 12 3.5M20.5 12A8.5 8.5 0 0 1 12 20.5'/%3E%3C/svg%3E"); }
.ls-lieu__chip--sieste-guidee { --ls-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E %3Cpath d='M7 12a5 5 0 0 1 5-5M17 12a5 5 0 0 1-5 5'/%3E %3Cpath d='M3.5 12A8.5 8.5 0 0 1 12 3.5M20.5 12A8.5 8.5 0 0 1 12 20.5'/%3E%3C/svg%3E"); }

/* ============================================================
   COUCHE v1.23 — CURSEUR 2030 SUR LES PAGES LIEUX
   Le premier jet était juste mais sage. On ajoute de la profondeur
   et du caractère sans sortir de la palette ni des dix règles.
   ============================================================ */

/* --- Cartouche d'icône : squircle, halo lavande, accent décalé ---
   L'icône reste au trait fin. Ce qui change, c'est ce qu'il y a derrière. */
.ls-cat::before,
.ls-liste-ico li::before,
ul.ls-liste-ico > li::before,
.ls-cartouche {
	position: relative;
	border-radius: 34% 66% 62% 38% / 42% 38% 62% 58%;
	border: 0;
	background-color: var(--wp--preset--color--lavande-clair);
	box-shadow: inset 0 0 0 1px rgb(184 179 233 / .55), 0 2px 8px rgb(27 29 62 / .06);
	transition: border-radius var(--duree-carte) var(--courbe-douce),
	            transform var(--duree-carte) var(--courbe-douce);
}
.ls-zone--abri .ls-cat::before { background-color: var(--wp--preset--color--sable); box-shadow: inset 0 0 0 1px rgb(226 114 91 / .22), 0 2px 8px rgb(27 29 62 / .06); }
.ls-cat:hover::before { border-radius: 62% 38% 38% 62% / 58% 62% 38% 42%; transform: rotate(-4deg); }

/* --- Titres de section : graisse mixte, comme le hero ---
   Le mot qui porte le sens passe en 600, sans changer de couleur. */
.ls-cat {
	font-size: var(--wp--preset--font-size--xl);
	letter-spacing: -0.015em;
}
.ls-cat strong { font-weight: 600; }

/* --- Zone : halo d'angle très doux, grain léger --- */
.ls-zone { position: relative; isolation: isolate; overflow: hidden; }
.ls-zone::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(60% 55% at 92% 4%, rgb(184 179 233 / .34), transparent 70%),
		radial-gradient(50% 45% at 4% 96%, rgb(226 114 91 / .12), transparent 70%);
}
.ls-zone::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	opacity: .03;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.ls-zone--abri::before {
	background:
		radial-gradient(58% 52% at 6% 6%, rgb(226 114 91 / .16), transparent 70%),
		radial-gradient(52% 48% at 96% 94%, rgb(156 175 136 / .22), transparent 70%);
}

/* --- Bento : la première fiche compacte de chaque grille occupe deux colonnes ---
   Casse l'alignement en damier, qui est ce qui fait « site de 2015 ». */
@media (min-width: 720px) {
	.ls-lieux-compact { grid-template-columns: repeat(3, 1fr); }
	.ls-lieux-compact > *:first-child { grid-column: span 2; }
	.ls-lieux-compact > *:first-child .ls-lieu-compact__texte,
	.ls-lieu-compact:first-child .ls-lieu-compact__texte { font-size: var(--wp--preset--font-size--base); }
	.ls-lieux-compact > *:first-child h4 { font-size: var(--wp--preset--font-size--grand); }
	/* Une grille de deux fiches reste à deux colonnes égales. */
	.ls-lieux-compact:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, 1fr); }
	.ls-lieux-compact:has(> :nth-child(2):last-child) > *:first-child { grid-column: auto; }
}

/* --- Fiche compacte : trait d'accent qui se révèle au survol --- */
.ls-lieu-compact {
	position: relative;
	overflow: hidden;
	transition: transform var(--duree-carte) var(--courbe-douce),
	            box-shadow var(--duree-carte) var(--courbe-douce);
}
.ls-lieu-compact::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 2px;
	background: linear-gradient(90deg, var(--wp--preset--color--lavande), var(--wp--preset--color--sauge));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--duree-carte) var(--courbe-douce);
}
.ls-lieu-compact:hover {
	transform: translateY(-3px);
	box-shadow: var(--wp--custom--ombre--deux);
}
.ls-lieu-compact:hover::after { transform: scaleX(1); }

/* --- Fiche phare : le filet devient un dégradé --- */
.ls-lieu--phare {
	border-left: 0;
	background-image: linear-gradient(180deg, var(--wp--preset--color--sauge), var(--wp--preset--color--lavande));
	background-repeat: no-repeat;
	background-size: 4px 100%;
	background-position: left top;
	padding-left: calc(var(--wp--preset--spacing--30) + 4px);
}

/* --- Repères chiffrés : valeur en très grand, alignée sur la ligne de base --- */
.ls-reperes__valeur { font-size: var(--wp--preset--font-size--xl); letter-spacing: -0.02em; }

/* --- Images de corps : plus larges, moins hautes ---
   Une photo qui occupe un écran entier coupe la lecture en deux. */
.ls-figure img {
	aspect-ratio: 21 / 9;
	object-fit: cover;
	max-height: 340px;
}
.ls-zone .ls-figure { margin-block: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30); }

/* --- Barre de catégories : accès direct aux sections de la page --- */
.ls-onglets {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-block: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	padding: 0;
	list-style: none;
}
.ls-onglets li { margin: 0; }
.inside-article .ls-onglets a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 18px;
	border-radius: var(--wp--custom--rayon--pastille);
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--nuit);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 500;
	text-decoration: none;
	transition: border-color var(--duree-rapide) ease-out,
	            box-shadow var(--duree-rapide) ease-out,
	            transform var(--duree-rapide) ease-out;
}
.inside-article .ls-onglets a::before {
	content: "";
	width: 15px; height: 15px;
	background-color: currentColor;
	-webkit-mask: var(--ls-ico) center / contain no-repeat;
	        mask: var(--ls-ico) center / contain no-repeat;
}
.inside-article .ls-onglets a:hover {
	border-color: var(--wp--preset--color--lavande);
	box-shadow: 0 4px 14px rgb(27 29 62 / .08);
	transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
	.ls-cat::before, .ls-lieu-compact, .ls-lieu-compact::after, .inside-article .ls-onglets a { transition: none; }
}

/* ============================================================
   COUCHE v1.24 — 2.5D : PHYSICALITÉ ET AFFORDANCE
   Une source de lumière unique, en haut à gauche. Toutes les ombres
   tombent dans le même sens, toutes les arêtes hautes reçoivent le
   même liseré clair. Ce qui se saisit est creusé, ce qui agit est en
   relief. Le texte de lecture reste plat, sans exception.
   ============================================================ */

:root {
	/* Source de lumière en haut à gauche : décalage x négatif, y positif. */
	--ls-relief-arete: inset 0 1px 0 rgb(255 255 255 / .9), inset 1px 0 0 rgb(255 255 255 / .45);
	--ls-relief-creux: inset 0 1px 3px rgb(27 29 62 / .10), inset 0 -1px 0 rgb(255 255 255 / .7);
	--ls-relief-repos: -1px 2px 4px rgb(27 29 62 / .06), -2px 6px 16px rgb(27 29 62 / .07);
	--ls-relief-leve:  -2px 6px 12px rgb(27 29 62 / .08), -4px 14px 32px rgb(27 29 62 / .12);
	--ls-relief-appui: -1px 1px 2px rgb(27 29 62 / .10);
	--ls-anneau-focus: 0 0 0 3px rgb(184 179 233 / .55);
}

/* ------------------------------------------------------------
   1. RELIEF : tout ce qui est posé sur la page
   ------------------------------------------------------------ */
.ls-lieu,
.ls-lieu-compact,
.ls-carte-visuel,
.ls-carte-produit {
	box-shadow: var(--ls-relief-arete), var(--ls-relief-repos);
	border-color: rgb(231 226 216 / .9);
}
.ls-lieu:hover,
.ls-carte-produit:hover {
	box-shadow: var(--ls-relief-arete), var(--ls-relief-leve);
}
.ls-lieu-compact:hover,
.ls-carte-visuel:has(a):hover,
.ls-carte-visuel:focus-within {
	box-shadow: var(--ls-relief-arete), var(--ls-relief-leve);
}

/* L'appui : l'élément s'enfonce et son ombre se rétracte.
   C'est le retour qui manquait complètement, en particulier au doigt. */
.ls-lieu-compact:active,
.ls-carte-visuel:active {
	transform: translateY(1px);
	box-shadow: var(--ls-relief-appui);
	transition-duration: 80ms;
}

/* ------------------------------------------------------------
   2. ACTION : boutons et pastilles, en relief franc
   ------------------------------------------------------------ */
.inside-article .wp-block-button__link,
.ls-bouton,
.ls-form__bouton,
.ls-carte__bouton {
	box-shadow: var(--ls-relief-arete), var(--wp--custom--ombre--action);
	transition: transform 120ms var(--courbe-douce),
	            box-shadow 120ms var(--courbe-douce),
	            background-color var(--duree-rapide) ease-out;
}
.inside-article .wp-block-button__link:hover,
.ls-bouton:hover,
.ls-form__bouton:hover,
.ls-carte__bouton:hover {
	transform: translateY(-2px);
	box-shadow: var(--ls-relief-arete), 0 10px 22px rgb(226 114 91 / .34);
}
.inside-article .wp-block-button__link:active,
.ls-bouton:active,
.ls-form__bouton:active,
.ls-carte__bouton:active {
	transform: translateY(1px);
	box-shadow: inset 0 2px 4px rgb(27 29 62 / .22);
	transition-duration: 70ms;
}

/* Bouton de contour : relief plus discret, même grammaire. */
.inside-article .is-style-outline a.wp-block-button__link {
	box-shadow: var(--ls-relief-repos);
}
.inside-article .is-style-outline a.wp-block-button__link:active {
	transform: translateY(1px);
	box-shadow: inset 0 2px 4px rgb(27 29 62 / .14);
}

/* Onglets de catégorie : mêmes trois états. */
.inside-article .ls-onglets a {
	box-shadow: var(--ls-relief-arete), var(--ls-relief-repos);
}
.inside-article .ls-onglets a:hover {
	box-shadow: var(--ls-relief-arete), var(--ls-relief-leve);
}
.inside-article .ls-onglets a:active {
	transform: translateY(1px);
	box-shadow: var(--ls-relief-appui);
	transition-duration: 70ms;
}

/* ------------------------------------------------------------
   3. CREUX : tout ce qui reçoit une saisie
   ------------------------------------------------------------ */
.ls-form__saisie,
.inside-article input[type="text"],
.inside-article input[type="email"],
.inside-article input[type="search"],
.inside-article textarea,
.search-modal-form .search-field {
	box-shadow: var(--ls-relief-creux);
}
.ls-form__saisie:focus,
.inside-article input:focus,
.inside-article textarea:focus {
	box-shadow: var(--ls-relief-creux), var(--ls-anneau-focus);
}

/* La case à cocher est creusée elle aussi, jusqu'à ce qu'elle soit cochée. */
.ls-form__consentement input[type="checkbox"] {
	border-radius: 5px;
	box-shadow: var(--ls-relief-creux);
}

/* ------------------------------------------------------------
   4. FOCUS VISIBLE : même anneau partout, jamais supprimé
   ------------------------------------------------------------ */
.inside-article a:focus-visible,
.inside-article button:focus-visible,
.ls-carte__bouton:focus-visible,
.ls-form__bouton:focus-visible,
.main-navigation a:focus-visible {
	outline: 2px solid var(--wp--preset--color--terracotta);
	outline-offset: 3px;
	border-radius: 4px;
}

/* ------------------------------------------------------------
   5. LE TEXTE RESTE PLAT
   Règle 3 de la charte : aucun effet de matière derrière un texte
   de lecture longue. Ces éléments ne reçoivent ni relief ni creux.
   ------------------------------------------------------------ */
.ls-encadre,
.ls-reponse,
.entry-content > p,
.ls-figure figcaption {
	box-shadow: none;
}

/* ------------------------------------------------------------
   6. MOUVEMENT RÉDUIT : le relief reste, le déplacement disparaît
   L'affordance ne doit pas dépendre de l'animation.
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	.ls-lieu-compact:active,
	.ls-carte-visuel:active,
	.inside-article .wp-block-button__link:hover,
	.inside-article .wp-block-button__link:active,
	.ls-bouton:hover, .ls-bouton:active,
	.ls-form__bouton:hover, .ls-form__bouton:active,
	.ls-carte__bouton:hover, .ls-carte__bouton:active,
	.inside-article .ls-onglets a:hover,
	.inside-article .ls-onglets a:active {
		transform: none;
	}
}

/* ============================================================
   COUCHE v1.25 — EN-TÊTE PHOTOGRAPHIQUE DES PAGES VILLE
   L'image mise en avant devient un bandeau, pas un mur. Le titre se
   pose dessus, le contenu commence au-dessus de la ligne de flottaison.
   ============================================================ */
.ls-ville .entry-header { display: none; }
.ls-ville .featured-image { display: none; }

.ls-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	min-height: 46vh;
	max-height: 480px;
	margin: 0 0 var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--rayon--encart);
	overflow: hidden;
	background: var(--wp--preset--color--nuit);
	box-shadow: var(--ls-relief-arete), var(--ls-relief-repos);
}
@media (max-width: 768px) {
	.ls-hero { min-height: 340px; padding: var(--wp--preset--spacing--40) 0 var(--wp--preset--spacing--30); }
}

.ls-hero__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -2;
}

/* Voile dégradé de gauche à droite : le texte reste lisible, l'image reste
   visible. Jamais un aplat uniforme, qui éteint la photo. */
.ls-hero__voile {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(100deg, rgb(27 29 62 / .88) 0%, rgb(27 29 62 / .72) 38%, rgb(27 29 62 / .28) 72%, rgb(27 29 62 / .12) 100%),
		radial-gradient(70% 60% at 6% 0%, rgb(184 179 233 / .22), transparent 70%);
}

.ls-hero__interieur {
	position: relative;
	width: 100%;
	max-width: var(--wp--custom--largeur--large);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--30);
}
.ls-hero__interieur > * { max-width: 30ch; margin: 0; }
.ls-hero__interieur > * + * { margin-top: var(--wp--preset--spacing--20); }

.ls-hero__surtitre {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--wp--preset--color--lavande);
}
.ls-hero__surtitre a { color: inherit; text-decoration: none; }
.ls-hero__surtitre a:hover { text-decoration: underline; text-underline-offset: 3px; }

.ls-hero__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--xxl);
	font-weight: 300;
	line-height: 1.1;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--creme);
	text-wrap: balance;
	max-width: 22ch;
}
.ls-hero__chapo {
	font-size: var(--wp--preset--font-size--moyen);
	line-height: 1.55;
	color: var(--wp--preset--color--texte-clair);
	max-width: 46ch;
}

/* Sans image mise en avant, le bandeau reste nuit avec son halo : il ne
   casse pas, il devient simplement un en-tête coloré. */
.ls-hero--sans-image { min-height: 0; padding-block: var(--wp--preset--spacing--40); }

/* ============================================================
   COUCHE v1.26 — CORRECTIFS DE LA PAGE D'ACCUEIL
   ============================================================ */

/* --- Cartes de réponse express : plus de chevauchement sur le hero ---
   Le débord remontait les cartes de 70 px sur un hero dont le contenu est
   centré verticalement : elles passaient par-dessus les boutons. Le débord
   ne reviendra que si le hero aligne son contenu en haut. */
.ls-debord { margin-top: 0; }
.ls-debord .ls-cartes { margin-top: calc(-1 * var(--wp--preset--spacing--30)); }

/* --- Formulaire posé sur un fond nuit ---
   Les libellés et mentions sont écrits pour un fond clair : sur le nuit,
   ils tombent sous le seuil de lisibilité. */
.ls-encart .ls-form__label { color: var(--wp--preset--color--lavande); }
.ls-encart .ls-form__consentement { color: var(--wp--preset--color--texte-clair); }
.ls-encart .ls-form__mention,
.ls-encart .ls-form__mention a { color: var(--wp--preset--color--texte-clair); }
.ls-encart .ls-form__mention a { text-decoration: underline; text-underline-offset: 2px; }
.ls-encart .ls-form__saisie {
	background: rgb(253 251 247 / .96);
	border-color: rgb(184 179 233 / .45);
}
.ls-encart .ls-form { max-width: 100%; }

/* --- Encart newsletter : proportions tenues --- */
.ls-encart { max-width: 820px; margin-inline: auto; }
.ls-encart .wp-block-heading { margin-bottom: var(--wp--preset--spacing--20); }
.ls-encart > p { margin-bottom: var(--wp--preset--spacing--30); }
.ls-encart .wp-block-image { margin-block: var(--wp--preset--spacing--30) 0; }
.ls-encart .wp-block-image img { max-height: 220px; width: auto; margin-inline: auto; display: block; }

/* --- Cartes sans image : le corps ne doit pas coller au bord --- */
.ls-carte-visuel:not(:has(.wp-block-image)) .ls-carte-visuel__corps {
	padding-top: var(--wp--preset--spacing--30);
}

/* ============================================================
   COUCHE v1.27 — PAGE DE TOUS LES ARTICLES
   Grille de cartes, date et durée de lecture, pagination.
   ============================================================ */

/* La date et la durée passent sous le titre, en métadonnée discrète. */
.wp-block-post-template .wp-block-post-date {
	margin: 0;
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}
.wp-block-post-template .wp-block-post-excerpt {
	margin: 0;
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.55;
	color: var(--wp--preset--color--texte);
}
.wp-block-post-template .wp-block-post-excerpt__more-text { display: none; }

/* Pagination : trois états, comme partout ailleurs. */
.wp-block-query-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: var(--wp--preset--spacing--40);
}
.inside-article .wp-block-query-pagination a,
.wp-block-query-pagination .wp-block-query-pagination-numbers span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	padding: 9px 16px;
	border-radius: var(--wp--custom--rayon--pastille);
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--nuit);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 500;
	text-decoration: none;
	box-shadow: var(--ls-relief-arete), var(--ls-relief-repos);
	transition: transform 120ms var(--courbe-douce), box-shadow 120ms var(--courbe-douce);
}
.inside-article .wp-block-query-pagination a:hover {
	transform: translateY(-2px);
	box-shadow: var(--ls-relief-arete), var(--ls-relief-leve);
}
.inside-article .wp-block-query-pagination a:active {
	transform: translateY(1px);
	box-shadow: var(--ls-relief-appui);
}
.wp-block-query-pagination .wp-block-query-pagination-numbers .current {
	background: var(--wp--preset--color--nuit);
	border-color: var(--wp--preset--color--nuit);
	color: var(--wp--preset--color--creme);
}
.wp-block-query-pagination-numbers { display: flex; gap: 10px; align-items: center; }
.wp-block-query-no-results { text-align: center; color: var(--wp--preset--color--texte-doux); }

/* ============================================================
   COUCHE v1.28 — CORRECTIFS D'AUDIT ET MENU
   Suite à l'audit public du 25 septembre 2026.
   ============================================================ */

/* --- B07 : les titres à graisse mixte se coupaient en colonnes ---
   .ls-cat était en display:flex, donc le texte avant <strong>, le <strong>
   et le texte après devenaient trois éléments de la grille flex. La phrase
   se lisait en colonnes. L'icône redevient un élément en ligne. */
.ls-cat {
	display: block;
	gap: 0;
}
.ls-cat::before {
	display: inline-block;
	vertical-align: -0.28em;
	margin-right: 14px;
}
h2.ls-cat::before { vertical-align: -0.3em; }

/* --- B08 : contraste des boutons ---
   Blanc sur corail donne 3,09:1, sous le seuil AA de 4,5:1. L'encre nuit
   sur le même corail atteint 5,26:1. La couleur d'action ne change pas,
   seule l'encre change. */
.inside-article .wp-block-button__link:not(.is-style-outline .wp-block-button__link),
.wp-block-button:not(.is-style-outline) .wp-block-button__link,
.ls-bouton,
.ls-form__bouton,
.ls-carte__bouton,
.ls-num,
.ls-carte__repere span {
	color: var(--wp--preset--color--nuit);
}
.inside-article a.wp-block-button__link:hover,
.ls-bouton:hover, .ls-bouton:focus,
.ls-form__bouton:hover, .ls-form__bouton:focus,
.ls-carte__bouton:hover, .ls-carte__bouton:focus {
	color: var(--wp--preset--color--creme);
}
/* Sur le nuit, le bouton reste crème sur corail foncé : 5,9:1. */
.ls-encart .ls-form__bouton,
.wp-block-cover .wp-block-button__link {
	background: var(--wp--preset--color--terracotta-fonce);
	color: var(--wp--preset--color--creme);
}

/* --- B06 : l'image d'article gardait une hauteur fixe de 675 px --- */
.featured-image img,
.post-image img,
.single-post .featured-image img {
	width: 100%;
	height: auto;
	max-height: 420px;
	object-fit: cover;
	display: block;
}
@media (max-width: 768px) {
	.featured-image img { max-height: 240px; }
}

/* ============================================================
   MENU — bandeau plus fin, plus éditorial
   ============================================================ */
.site-header .inside-header {
	padding-top: 14px;
	padding-bottom: 14px;
}
.site-logo img { max-height: 52px; width: auto; }

.main-navigation .main-nav ul li a {
	padding-inline: 14px;
	font-size: 15.5px;
	font-weight: 500;
	letter-spacing: 0.005em;
}

/* Rubrique courante : trait corail court et graisse légèrement accrue. */
.main-navigation .main-nav ul li[class*="current-menu-"] > a { font-weight: 600; }
.main-navigation .main-nav ul li a::after {
	left: 50%;
	right: auto;
	width: 22px;
	transform: translateX(-50%) scaleX(0);
	transform-origin: center;
}
.main-navigation .main-nav ul li a:hover::after,
.main-navigation .main-nav ul li a:focus::after,
.main-navigation .main-nav ul li[class*="current-menu-"] > a::after {
	transform: translateX(-50%) scaleX(1);
}

/* Loupe : zone cliquable confortable, fond lavande très léger au survol. */
.menu-bar-items .menu-bar-item > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: var(--wp--custom--rayon--icone);
	transition: background-color var(--duree-rapide) ease-out;
}
.menu-bar-items .menu-bar-item > a:hover,
.menu-bar-items .menu-bar-item > a:focus-visible {
	background: var(--wp--preset--color--lavande-clair);
}
.menu-bar-items .gp-icon svg { width: 18px; height: 18px; }

/* ============================================================
   MENU MOBILE — panneau typographique
   ============================================================ */
@media (max-width: 768px) {
	#site-navigation.toggled .main-nav > ul {
		position: fixed;
		inset: 82px 0 0;
		z-index: 99;
		display: flex;
		flex-direction: column;
		gap: 2px;
		margin: 0;
		padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
		background: var(--wp--preset--color--creme);
		overflow-y: auto;
		overscroll-behavior: contain;
		animation: ls-monte 240ms var(--courbe-douce) both;
	}

	/* Mention d'entrée, posée par le CSS pour ne pas toucher au menu. */
	#site-navigation.toggled .main-nav > ul::before {
		content: "Explorer La Sieste";
		display: block;
		margin-bottom: var(--wp--preset--spacing--30);
		font-family: var(--wp--preset--font-family--texte);
		font-size: var(--wp--preset--font-size--micro);
		font-weight: 600;
		letter-spacing: 0.16em;
		text-transform: uppercase;
		color: var(--wp--preset--color--texte-doux);
	}

	#site-navigation.toggled .main-nav > ul > li { width: 100%; }
	#site-navigation.toggled .main-nav > ul > li > a {
		display: block;
		padding: 14px 0;
		font-family: var(--wp--preset--font-family--titre);
		font-size: 27px;
		font-weight: 300;
		line-height: 1.2;
		letter-spacing: -0.015em;
		color: var(--wp--preset--color--nuit);
		border-bottom: 1px solid rgb(231 226 216 / .7);
	}
	#site-navigation.toggled .main-nav > ul > li:last-child > a { border-bottom: 0; }

	/* Rubrique courante : le point corail du logo devient le repère. */
	#site-navigation.toggled .main-nav > ul > li[class*="current-menu-"] > a {
		font-weight: 400;
		position: relative;
	}
	#site-navigation.toggled .main-nav > ul > li[class*="current-menu-"] > a::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 2px;
		width: 9px;
		height: 9px;
		margin-top: -4px;
		border-radius: 50%;
		background: var(--wp--preset--color--terracotta);
		transform: none;
	}

	/* Liens secondaires : ajouter la classe ls-menu-secondaire aux entrées
	   À propos et La lettre dans Apparence puis Menus. */
	#site-navigation.toggled .main-nav > ul > li.ls-menu-secondaire > a {
		font-family: var(--wp--preset--font-family--texte);
		font-size: var(--wp--preset--font-size--petit);
		font-weight: 500;
		color: var(--wp--preset--color--texte-doux);
		padding: 10px 0;
		border-bottom: 0;
	}
	#site-navigation.toggled .main-nav > ul > li.ls-menu-secondaire:first-of-type > a {
		margin-top: var(--wp--preset--spacing--30);
		padding-top: var(--wp--preset--spacing--20);
		border-top: 1px solid rgb(231 226 216 / .7);
	}

	/* L'en-tête reste au-dessus du panneau : logo et croix accessibles. */
	.site-header { position: relative; z-index: 100; }
	body.mobile-menu-ouvert { overflow: hidden; }
}

/* --- B10 : fil d'Ariane, secours maison quand Rank Math ne rend rien --- */
.ls-fil__liste {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.ls-fil__item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}
.ls-fil__item + .ls-fil__item::before {
	content: "›";
	color: var(--wp--preset--color--bordure);
}
.inside-article .ls-fil__item a { color: var(--wp--preset--color--texte-doux); text-decoration: none; }
.inside-article .ls-fil__item a:hover { color: var(--wp--preset--color--terracotta); }
.ls-fil__item [aria-current] { color: var(--wp--preset--color--texte); }

/* --- Image d'article, rendue après le chapô (audit, section 06 et 07) --- */
.ls-image-article {
	margin: var(--wp--preset--spacing--30) 0 var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--rayon--vignette);
	overflow: hidden;
}
.ls-image-article img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	max-height: 420px;
}
@media (max-width: 768px) {
	.ls-image-article img { aspect-ratio: 3 / 2; max-height: 260px; }
	.ls-image-article { margin-top: var(--wp--preset--spacing--20); }
}
.ls-image-article figcaption {
	margin-top: 10px;
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}

/* ============================================================
   COUCHE v1.29 — MENU : PRIORITÉ SUR LES RÉGLAGES DU PERSONNALISATEUR
   GeneratePress injecte ses réglages en CSS après cette feuille, avec la
   même spécificité. Sur les propriétés qu'il pilote, il l'emportait.
   On préfixe par body pour passer devant, sans recourir à !important
   partout : les valeurs restent modifiables ici, à un seul endroit.
   ============================================================ */
body .site-header .inside-header {
	padding-top: 14px;
	padding-bottom: 14px;
}
body .site-logo img { max-height: 52px; width: auto; }

body .main-navigation .main-nav ul li a {
	position: relative;
	padding-left: 14px;
	padding-right: 14px;
	font-size: 15.5px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0.005em;
}
body .main-navigation .main-nav ul li a::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 14px;
	width: 22px;
	height: 1px;
	background: var(--wp--preset--color--terracotta);
	transform: translateX(-50%) scaleX(0);
	transform-origin: center;
	transition: transform var(--duree-carte) var(--courbe-douce);
}
body .main-navigation .main-nav ul li a:hover::after,
body .main-navigation .main-nav ul li a:focus::after,
body .main-navigation .main-nav ul li[class*="current-menu-"] > a::after {
	transform: translateX(-50%) scaleX(1);
}
body .main-navigation .main-nav ul li[class*="current-menu-"] > a { font-weight: 600; }

body .site-header { border-bottom: 1px solid var(--wp--preset--color--bordure); }

body .menu-bar-items .menu-bar-item > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: var(--wp--custom--rayon--icone);
	transition: background-color var(--duree-rapide) ease-out;
}
body .menu-bar-items .menu-bar-item > a:hover,
body .menu-bar-items .menu-bar-item > a:focus-visible {
	background: var(--wp--preset--color--lavande-clair);
}

/* --- Panneau mobile --- */
@media (max-width: 768px) {
	body #site-navigation.toggled .main-nav > ul,
	body nav.main-navigation.toggled .main-nav > ul {
		position: fixed;
		inset: 82px 0 0;
		z-index: 99;
		display: flex;
		flex-direction: column;
		gap: 0;
		margin: 0;
		padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
		background: var(--wp--preset--color--creme);
		overflow-y: auto;
		overscroll-behavior: contain;
	}
	body #site-navigation.toggled .main-nav > ul::before {
		content: "Explorer La Sieste";
		display: block;
		margin-bottom: var(--wp--preset--spacing--30);
		font-family: var(--wp--preset--font-family--texte);
		font-size: var(--wp--preset--font-size--micro);
		font-weight: 600;
		letter-spacing: 0.16em;
		text-transform: uppercase;
		color: var(--wp--preset--color--texte-doux);
	}
	body #site-navigation.toggled .main-nav > ul > li { width: 100%; float: none; }
	body #site-navigation.toggled .main-nav > ul > li > a {
		display: block;
		padding: 14px 0;
		font-family: var(--wp--preset--font-family--titre);
		font-size: 27px;
		font-weight: 300;
		line-height: 1.2;
		letter-spacing: -0.015em;
		color: var(--wp--preset--color--nuit);
		border-bottom: 1px solid rgb(231 226 216 / .7);
	}
	body #site-navigation.toggled .main-nav > ul > li > a::after { display: none; }
	body #site-navigation.toggled .main-nav > ul > li[class*="current-menu-"] > a {
		font-weight: 400;
		position: relative;
	}
	body #site-navigation.toggled .main-nav > ul > li[class*="current-menu-"] > a::before {
		content: "";
		position: absolute;
		top: 50%;
		right: 2px;
		width: 9px;
		height: 9px;
		margin-top: -4px;
		border-radius: 50%;
		background: var(--wp--preset--color--terracotta);
	}
	body #site-navigation.toggled .main-nav > ul > li.ls-menu-secondaire > a {
		font-family: var(--wp--preset--font-family--texte);
		font-size: var(--wp--preset--font-size--petit);
		font-weight: 500;
		color: var(--wp--preset--color--texte-doux);
		padding: 10px 0;
		border-bottom: 0;
	}
	body #site-navigation.toggled .main-nav > ul > li.ls-menu-secondaire:first-of-type > a {
		margin-top: var(--wp--preset--spacing--30);
		padding-top: var(--wp--preset--spacing--20);
		border-top: 1px solid rgb(231 226 216 / .7);
	}
	body .site-header { position: relative; z-index: 100; }
}

/* ============================================================
   COUCHE v1.30 — MENU, TABLEAUX, HERO DE PILIER, VOISINS, CENTRAGE
   Suite aux retours du 26 septembre.
   ============================================================ */

/* ------------------------------------------------------------
   1. LE CENTRAGE PARASITE
   WordPress impose une largeur de 720 px et des marges automatiques
   aux enfants de tout groupe. Nos blocs font 1 100 px : leur contenu
   se recentrait à l'intérieur. C'est ce qui donnait l'impression que
   les encadrés et le bandeau méthodologie étaient mal cadrés.
   ------------------------------------------------------------ */
.ls-encadre > *,
.ls-reponse > *,
.ls-lieu > *,
.ls-lieu-compact > *,
.ls-carte-visuel__corps > *,
.ls-zone > *,
.ls-faq > * {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.ls-cta .wp-block-cover__inner-container {
	max-width: 560px !important;
	margin-left: 0 !important;
	margin-right: auto !important;
	text-align: left;
}
.ls-cta .wp-block-cover__inner-container > * {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* ------------------------------------------------------------
   2. MENU : une pastille, un point, rien d'autre
   Le trait positionné en pixels traversait le mot : la hauteur du lien
   dépend des réglages de GeneratePress. On passe par le soulignement
   natif, qui suit le texte quoi qu'il arrive, et par une pastille
   lavande au survol qui donne enfin du caractère au bandeau.
   ------------------------------------------------------------ */
body .main-navigation .main-nav ul li a::after { display: none !important; }

body .main-navigation .main-nav ul li a {
	position: relative;
	padding: 10px 16px;
	margin-inline: 2px;
	border-radius: var(--wp--custom--rayon--pastille);
	font-size: 15.5px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--wp--preset--color--nuit);
	text-decoration: none;
	transition: background-color var(--duree-rapide) ease-out,
	            color var(--duree-rapide) ease-out;
}
body .main-navigation .main-nav ul li a:hover,
body .main-navigation .main-nav ul li a:focus-visible {
	background: var(--wp--preset--color--lavande-clair);
	color: var(--wp--preset--color--nuit);
}

/* Rubrique courante : encre nuit, graisse accrue, et le point du logo.
   Pas de couleur de texte terracotta : 3,1 pour 1 sur le crème. */
body .main-navigation .main-nav ul li[class*="current-menu-"] > a {
	color: var(--wp--preset--color--nuit);
	font-weight: 600;
	padding-right: 26px;
}
body .main-navigation .main-nav ul li[class*="current-menu-"] > a::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 12px;
	width: 6px;
	height: 6px;
	margin-top: -3px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
}

/* Le bandeau se pose sur la page : filet fin et voile au défilement. */
body .site-header {
	border-bottom: 1px solid rgb(231 226 216 / .9);
	background: rgb(253 251 247 / .92);
	backdrop-filter: blur(12px) saturate(1.3);
}

/* ------------------------------------------------------------
   3. TABLEAUX ÉDITORIAUX
   Plus de grille façon tableur : des filets horizontaux seulement,
   un en-tête en petites capitales, des lignes alternées très douces.
   ------------------------------------------------------------ */
.entry-content .wp-block-table { margin-block: var(--wp--preset--spacing--40); }
.entry-content .wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	font-size: var(--wp--preset--font-size--petit);
	font-variant-numeric: tabular-nums;
	overflow: hidden;
	border-radius: var(--wp--custom--rayon--vignette);
}
.entry-content .wp-block-table thead { border-bottom: 0; }
.entry-content .wp-block-table th {
	padding: 14px 18px;
	background: var(--wp--preset--color--sable);
	border: 0;
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo);
	text-align: left;
	vertical-align: bottom;
}
.entry-content .wp-block-table td {
	padding: 14px 18px;
	border: 0;
	border-top: 1px solid rgb(231 226 216 / .8);
	color: var(--wp--preset--color--texte);
	vertical-align: top;
}
.entry-content .wp-block-table tbody tr:nth-child(even) td {
	background: rgb(253 251 247 / .7);
}
.entry-content .wp-block-table tbody tr:hover td {
	background: var(--wp--preset--color--lavande-clair);
}
/* La première colonne porte la clé de lecture. */
.entry-content .wp-block-table td:first-child {
	font-weight: 600;
	color: var(--wp--preset--color--nuit);
	white-space: nowrap;
}
@media (max-width: 720px) {
	.entry-content .wp-block-table { overflow-x: auto; }
	.entry-content .wp-block-table table { min-width: 560px; }
	.entry-content .wp-block-table th,
	.entry-content .wp-block-table td { padding: 12px 14px; }
}

/* ------------------------------------------------------------
   4. HERO DE PILIER : de l'aplat à la matière
   ------------------------------------------------------------ */
.ls-pilier__entete {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}
.ls-pilier__entete::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	background:
		radial-gradient(70% 62% at 88% 2%, rgb(255 255 255 / .55), transparent 68%),
		radial-gradient(56% 50% at 2% 100%, rgb(27 29 62 / .07), transparent 70%);
}
.ls-pilier__entete::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	opacity: .035;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.ls-pilier__surtitre {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 14px 6px 12px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: rgb(253 251 247 / .8);
	box-shadow: inset 0 0 0 1px rgb(27 29 62 / .06);
	color: var(--wp--preset--color--indigo);
}
.ls-pilier__surtitre::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
}
.ls-pilier__titre {
	font-size: clamp(2.2rem, 1.2rem + 3vw, 3.4rem);
	letter-spacing: -0.025em;
	max-width: 20ch;
}
.ls-pilier__chapo { max-width: 52ch; }

/* ------------------------------------------------------------
   5. RUBRIQUES VOISINES : des cartes qui disent quelque chose
   ------------------------------------------------------------ */
.ls-voisins__grille { gap: 22px; }
.ls-voisin {
	display: grid;
	grid-template-rows: auto auto 1fr auto;
	gap: 8px;
	min-height: 0;
	padding: var(--wp--preset--spacing--30);
	border-radius: var(--wp--custom--rayon--carte);
	border: 1px solid var(--wp--preset--color--bordure);
	background: var(--wp--preset--color--blanc);
	box-shadow: var(--ls-relief-arete), var(--ls-relief-repos);
	text-decoration: none;
	transition: transform var(--duree-carte) var(--courbe-douce),
	            box-shadow var(--duree-carte) var(--courbe-douce);
}
.ls-voisin:hover { transform: translateY(-3px); box-shadow: var(--ls-relief-arete), var(--ls-relief-leve); }
.ls-voisin:active { transform: translateY(1px); box-shadow: var(--ls-relief-appui); }

.ls-voisin__label {
	display: inline-flex;
	align-self: start;
	padding: 4px 12px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--lavande-clair);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo);
}
.ls-voisin--bienfaits .ls-voisin__label  { background: var(--wp--preset--color--lavande-clair); }
.ls-voisin--techniques .ls-voisin__label { background: var(--wp--preset--color--sable); }
.ls-voisin--travail .ls-voisin__label    { background: var(--wp--preset--color--sauge-clair); }
.ls-voisin--enfant .ls-voisin__label     { background: var(--wp--preset--color--corail-clair); }
.ls-voisin--materiel .ls-voisin__label   { background: var(--wp--preset--color--bleu-clair); }
.ls-voisin--lieux .ls-voisin__label      { background: var(--wp--preset--color--rose-clair); }
.ls-voisin--profils .ls-voisin__label    { background: var(--wp--preset--color--gris-clair); }

.ls-voisin__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	line-height: 1.2;
	color: var(--wp--preset--color--nuit);
	text-wrap: balance;
}
.ls-voisin__texte {
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.55;
	color: var(--wp--preset--color--texte);
}
.ls-voisin__action {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: var(--wp--preset--spacing--10);
	font-size: var(--wp--preset--font-size--petit);
	font-weight: 500;
	color: var(--wp--preset--color--terracotta-fonce);
}
.ls-voisin:hover .ls-fleche { transform: translateX(4px); }
.ls-voisin .ls-fleche { transition: transform var(--duree-carte) var(--courbe-douce); }

/* ============================================================
   COUCHE v1.31 — MENU SUR UNE LIGNE, RECHERCHE, HERO
   ============================================================ */

/* --- Le menu passait sur deux lignes : neuf entrées, c'est deux de trop.
   « À propos » et « La lettre » sont des liens secondaires pensés pour le
   panneau mobile. Sur ordinateur ils sortent du bandeau ; ils restent dans
   le pied de page, où ils ont toujours été. --- */
@media (min-width: 769px) {
	body .main-navigation .main-nav ul > li.ls-menu-secondaire { display: none; }
	body .main-navigation .main-nav ul { flex-wrap: nowrap; }
	body .main-navigation .main-nav ul li a {
		white-space: nowrap;
		padding: 9px 13px;
		margin-inline: 1px;
		font-size: 15px;
	}
}
/* Entre 769 et 1100 px, on resserre encore plutôt que de casser la ligne. */
@media (min-width: 769px) and (max-width: 1100px) {
	body .main-navigation .main-nav ul li a { padding: 9px 9px; font-size: 14.5px; }
	body .main-navigation .main-nav ul li[class*="current-menu-"] > a { padding-right: 20px; }
	body .main-navigation .main-nav ul li[class*="current-menu-"] > a::before { right: 8px; }
}

/* ============================================================
   RECHERCHE : une vraie fenêtre, pas un champ perdu sur la photo
   ============================================================ */
.gp-modal__overlay,
.gp-modal--search .gp-modal__overlay {
	background: rgb(27 29 62 / .82);
	backdrop-filter: blur(8px);
}
.gp-modal--search .gp-modal__container {
	width: min(680px, calc(100vw - 2 * var(--wp--preset--spacing--30)));
	padding: var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--rayon--encart);
	background: var(--wp--preset--color--creme);
	box-shadow: var(--ls-relief-arete), 0 24px 60px rgb(27 29 62 / .32);
}
.gp-modal--search .gp-modal__content { padding: 0; }

/* Libellé posé au-dessus du champ, sinon on ne comprend pas ce qu'on regarde. */
.gp-modal--search .gp-modal__container::before {
	content: "Rechercher sur La Sieste";
	display: block;
	margin-bottom: var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 400;
	color: var(--wp--preset--color--nuit);
}
.gp-modal--search .gp-modal__container::after {
	content: "Un sujet, une ville, un âge. Par exemple : durée, bureau, bébé 6 mois, Lyon.";
	display: block;
	margin-top: var(--wp--preset--spacing--20);
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--texte-doux);
}

.search-modal-form,
.gp-modal--search .search-form {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 6px 6px 6px 18px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--blanc);
	box-shadow: var(--ls-relief-creux);
}
.gp-modal--search input[type="search"],
.gp-modal--search .search-field {
	flex: 1;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 12px 0 !important;
	font-family: var(--wp--preset--font-family--texte);
	font-size: var(--wp--preset--font-size--moyen) !important;
	color: var(--wp--preset--color--nuit) !important;
}
.gp-modal--search input[type="search"]::placeholder { color: var(--wp--preset--color--texte-doux); opacity: 1; }
.gp-modal--search .search-submit,
.gp-modal--search button[type="submit"] {
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: var(--wp--custom--rayon--pastille);
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--nuit);
	cursor: pointer;
}
.gp-modal--search .gp-modal__close {
	top: 14px;
	right: 14px;
	color: var(--wp--preset--color--texte-doux);
}

/* ============================================================
   HERO D'ACCUEIL : de l'image voilée à une scène composée
   Le voile uniforme éteignait la photo et aplatissait le texte. On
   remplace par un dégradé de gauche à droite, on descend le contenu
   en bas de cadre, et on ajoute le repère du logo.
   ============================================================ */
.home .entry-content > .wp-block-cover:first-child {
	min-height: 78vh;
	align-items: flex-end;
	padding-bottom: var(--wp--preset--spacing--60);
	border-radius: 0;
}
.home .entry-content > .wp-block-cover:first-child > .wp-block-cover__background {
	background: linear-gradient(
		100deg,
		rgb(27 29 62 / .94) 0%,
		rgb(27 29 62 / .86) 26%,
		rgb(27 29 62 / .52) 58%,
		rgb(27 29 62 / .18) 100%
	) !important;
	opacity: 1 !important;
}
/* Halo lavande dans l'angle haut, comme sur les zones et les piliers. */
.home .entry-content > .wp-block-cover:first-child::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: radial-gradient(48% 42% at 6% 0%, rgb(184 179 233 / .3), transparent 70%);
}
.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container { z-index: 2; }

.home .ls-hero__surtitre {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 7px 16px 7px 13px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: rgb(253 251 247 / .12);
	box-shadow: inset 0 0 0 1px rgb(253 251 247 / .22);
	color: var(--wp--preset--color--lavande);
}
.home .ls-hero__surtitre::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
}
.home .entry-content > .wp-block-cover:first-child h1 {
	font-size: clamp(2.6rem, 1.4rem + 4.4vw, 4.6rem);
	line-height: 1.02;
	letter-spacing: -0.03em;
	max-width: 15ch;
}
.home .entry-content > .wp-block-cover:first-child h1 strong { font-weight: 600; }
.home .entry-content > .wp-block-cover:first-child p { max-width: 46ch; }

/* Repère de défilement : une ligne qui respire, pas une flèche qui saute. */
.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container::after {
	content: "";
	display: block;
	width: 1px;
	height: 44px;
	margin-top: var(--wp--preset--spacing--40);
	background: linear-gradient(180deg, var(--wp--preset--color--lavande), transparent);
	animation: ls-respire 3.2s ease-in-out infinite;
}
@keyframes ls-respire {
	0%, 100% { opacity: .35; transform: scaleY(.82); transform-origin: top; }
	50%      { opacity: .9;  transform: scaleY(1);   transform-origin: top; }
}
@media (prefers-reduced-motion: reduce) {
	.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container::after { animation: none; }
}
@media (max-width: 768px) {
	.home .entry-content > .wp-block-cover:first-child {
		min-height: 62vh;
		padding-bottom: var(--wp--preset--spacing--40);
	}
	.home .entry-content > .wp-block-cover:first-child > .wp-block-cover__background {
		background: linear-gradient(180deg, rgb(27 29 62 / .55) 0%, rgb(27 29 62 / .82) 48%, rgb(27 29 62 / .94) 100%) !important;
	}
	.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container::after { display: none; }
}

/* ============================================================
   COUCHE v1.32 — DURCISSEMENT MOBILE
   Revue du code à 390 px de large. Cinq défauts corrigés.
   ============================================================ */
@media (max-width: 768px) {

	/* 1. Les images de corps étaient en 21:9, un format panoramique pensé
	   pour un écran large. Sur un téléphone, ça donne une bande de 60 px
	   de haut dans laquelle on ne distingue rien. */
	.ls-figure img {
		aspect-ratio: 16 / 9;
		max-height: none;
	}

	/* 2. Les bandeaux d'appel gardaient une hauteur minimale de 320 px et
	   une colonne de texte de 560 px : sur mobile le texte se serrait dans
	   un coin d'une grande image. */
	.ls-cta {
		min-height: 0 !important;
	}
	.ls-cta .wp-block-cover__inner-container {
		max-width: 100% !important;
		padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20) !important;
	}
	.ls-cta h3 { font-size: var(--wp--preset--font-size--grand); }
	.ls-cta .wp-block-button__link { width: 100%; text-align: center; }

	/* 3. Le fond de page défilait derrière le panneau de menu ouvert :
	   on ferme le menu, on se retrouve ailleurs dans la page. */
	body:has(#site-navigation.toggled) { overflow: hidden; }

	/* 4. Les repères chiffrés s'empilaient en trois lignes hautes. Deux
	   colonnes tiennent sans compression et raccourcissent la zone. */
	.ls-reperes {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--wp--preset--spacing--20);
	}
	.ls-reperes > .wp-block-group:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.ls-reperes__valeur { font-size: var(--wp--preset--font-size--grand); }

	/* 5. Zones de contact trop petites sur les éléments secondaires.
	   Le minimum recommandé est 44 px de haut. */
	.ls-fil__item a,
	.ls-chip,
	.ls-lieu__chip {
		display: inline-flex;
		align-items: center;
		min-height: 32px;
	}
	.inside-article .ls-onglets a { min-height: 44px; padding-block: 11px; }
	.ls-voisin { padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20); }

	/* Le sommaire reste replié par défaut sur petit écran : déplié, il
	   repousse le premier paragraphe hors de l'écran. */
	.ls-sommaire { padding: var(--wp--preset--spacing--20); }
	.ls-sommaire summary { min-height: 44px; display: flex; align-items: center; }
}

/* Très petits écrans : on descend encore d'un cran. */
@media (max-width: 400px) {
	.ls-zone { padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20); }
	.ls-pilier__titre { font-size: clamp(1.9rem, 1rem + 5vw, 2.4rem); }
	body #site-navigation.toggled .main-nav > ul > li > a { font-size: 24px; padding: 12px 0; }
	.ls-lieu, .ls-lieu-compact { padding: var(--wp--preset--spacing--20); }
	.entry-content .wp-block-table table { min-width: 480px; }
}

/* --- L'image de GeneratePress ne doit plus exister ; si une version la
   réintroduit, elle reste masquée et ne préempte pas la mesure de vitesse. */
.single-post .featured-image,
.ls-pilier .featured-image,
.ls-ville .featured-image { display: none !important; }

/* --- Sommaire : replié sur mobile, ouvert sur grand écran --- */
@media (min-width: 900px) {
	.ls-sommaire[open] > .ls-sommaire__titre ~ * { display: block; }
}

/* ============================================================
   COUCHE v1.33 — MOBILE : CE QUI TIENT DANS LE PREMIER ÉCRAN
   Mesures prises à 390 x 844, le format le plus répandu.
   ============================================================ */
@media (max-width: 768px) {

	/* L'en-tête de pilier mangeait 460 px avant le premier mot du texte :
	   96 px de marge haute, 72 en bas, plus le titre et le chapô. On garde
	   la respiration sans perdre l'écran. */
	.ls-pilier__entete {
		padding-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
		margin-bottom: var(--wp--preset--spacing--30);
	}
	.ls-pilier__chapo { font-size: var(--wp--preset--font-size--base); }

	/* Titre d'article : la taille de bureau produisait cinq lignes.
	   Quatre suffisent, et la réponse express remonte d'autant. */
	.single-post .entry-title {
		font-size: clamp(1.75rem, 1.1rem + 3.4vw, 2.2rem);
		line-height: 1.16;
		letter-spacing: -0.02em;
	}
	.single-post .ls-chapo { font-size: var(--wp--preset--font-size--base); line-height: 1.55; }

	/* La réponse express est ce que le lecteur pressé vient chercher :
	   elle doit se voir comme un bloc, pas comme un paragraphe de plus. */
	.ls-reponse {
		padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--20) var(--wp--preset--spacing--20) var(--wp--preset--spacing--20);
		border-left-width: 4px;
		background: var(--wp--preset--color--sable);
		border-radius: 0 var(--wp--custom--rayon--vignette) var(--wp--custom--rayon--vignette) 0;
	}
	.ls-reponse > p:last-child { font-size: var(--wp--preset--font-size--moyen); }

	/* Carnets de ville : une trentaine de fiches en colonne unique, c'est
	   un très long défilement. La barre de catégories devient collante
	   pour qu'on puisse sauter de section à tout moment. */
	.ls-onglets {
		position: sticky;
		top: 0;
		z-index: 40;
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
		margin-inline: calc(-1 * var(--wp--preset--spacing--20));
		padding: 10px var(--wp--preset--spacing--20);
		background: rgb(253 251 247 / .94);
		backdrop-filter: blur(10px);
		border-bottom: 1px solid var(--wp--preset--color--bordure);
	}
	.ls-onglets::-webkit-scrollbar { display: none; }
	.inside-article .ls-onglets a { white-space: nowrap; }

	/* La carte de 360 px de haut coupe la page en deux quand elle s'ouvre.
	   Sur mobile elle prend la hauteur utile et se referme au défilement. */
	.ls-carte { height: 420px; }
	.ls-carte__attente { gap: 8px; }
	.ls-carte__mention { font-size: 11px; }
}

/* ============================================================
   COUCHE v1.34 — MENU FINAL ET CATALOGUE ARTICLES & GUIDES
   Consolidation visuelle et corrections ciblées mobile.
   ============================================================ */

/* Menu principal : état courant plus visible, sans réintroduire le trait
   décoratif des anciennes couches v1.15/v1.28. */
body .main-navigation .main-nav ul li[class*="current-menu-"] > a {
	background-color: var(--wp--preset--color--lavande-clair);
}
body .main-navigation .main-nav ul li a:focus-visible {
	outline: 2px solid var(--wp--preset--color--terracotta);
	outline-offset: 2px;
}

/* Le panneau reste compatible avec les variantes de balisage GeneratePress.
   Le sélecteur est limité au menu principal, jamais aux listes éditoriales. */
@media (max-width: 768px) {
	body #site-navigation.toggled .main-nav > ul,
	body nav.main-navigation.toggled .main-nav > ul {
		padding-bottom: calc(var(--wp--preset--spacing--50) + env(safe-area-inset-bottom, 0px));
	}
	body #site-navigation.toggled .main-nav > ul > li > a:hover,
	body #site-navigation.toggled .main-nav > ul > li > a:focus-visible,
	body nav.main-navigation.toggled .main-nav > ul > li > a:hover,
	body nav.main-navigation.toggled .main-nav > ul > li > a:focus-visible {
		background-color: var(--wp--preset--color--lavande-clair);
		border-radius: var(--wp--custom--rayon--vignette);
	}
}

/* Catalogue : ses listes de liens mènent vers des rubriques et des villes,
   ce ne sont pas des ancres de navigation collantes dans un long article. */
.ls-articles-guides .ls-onglets {
	position: static;
	top: auto;
	z-index: auto;
	background: transparent;
	backdrop-filter: none;
	border-bottom: 0;
}

@media (max-width: 768px) {
	.ls-articles-guides .ls-onglets {
		position: relative;
		flex-wrap: nowrap;
		gap: 8px;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		scroll-snap-type: x proximity;
		margin-inline: 0;
		padding: 8px 2px 14px;
		background: transparent;
		border: 0;
		-webkit-overflow-scrolling: touch;
	}
	.ls-articles-guides .ls-onglets li { flex: 0 0 auto; scroll-snap-align: start; }
	.inside-article .ls-articles-guides .ls-onglets a { white-space: nowrap; }
}

/* ============================================================
   COUCHE v1.35 — CORRECTIFS DU 27 SEPTEMBRE
   ============================================================ */

/* --- Menu : distinguer l'état courant du survol ---
   Le fond lavande sur les deux rendait les états indiscernables : on
   survole une rubrique et elle paraît être celle où l'on se trouve.
   Le courant garde le fond plein, le survol se contente d'un voile. */
body .main-navigation .main-nav ul li a:hover,
body .main-navigation .main-nav ul li a:focus-visible {
	background: rgb(184 179 233 / .28);
}
body .main-navigation .main-nav ul li[class*="current-menu-"] > a,
body .main-navigation .main-nav ul li[class*="current-menu-"] > a:hover {
	background: var(--wp--preset--color--lavande-clair);
	box-shadow: inset 0 0 0 1px rgb(184 179 233 / .55);
}

/* --- Hero : le contenu se posait au milieu à gauche ---
   WordPress applique is-position-center-left avec trois classes, ce qui
   passait devant ma règle. On descend le bloc en bas de cadre, là où il
   respire et où l'image reste visible au-dessus. */
body.home .entry-content > .wp-block-cover.has-custom-content-position,
body.home .entry-content > .wp-block-cover.is-position-center-left {
	align-items: flex-end;
	min-height: 78vh;
	padding-bottom: var(--wp--preset--spacing--60);
}
body.home .entry-content > .wp-block-cover .wp-block-cover__inner-container {
	margin-bottom: 0;
}
@media (max-width: 768px) {
	body.home .entry-content > .wp-block-cover.has-custom-content-position,
	body.home .entry-content > .wp-block-cover.is-position-center-left {
		min-height: 62vh;
		padding-bottom: var(--wp--preset--spacing--40);
	}
}

/* --- Pastilles de rubrique de l'accueil ---
   Elles portent le modificateur de couleur sans la classe de base :
   elles recevaient donc un fond de couleur sans forme ni respiration,
   d'où l'impression de bloc cassé. On leur donne la forme de pastille. */
.ls-carte-visuel__chip[class*="ls-lieu__chip--"] {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	align-self: flex-start;
	width: auto;
	padding: 4px 12px;
	border-radius: var(--wp--custom--rayon--pastille);
	color: var(--wp--preset--color--indigo);
}
.ls-carte-visuel__chip[class*="ls-lieu__chip--"]::before {
	content: "";
	display: inline-block;
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
	background-color: currentColor;
	-webkit-mask: var(--ls-ico) center / contain no-repeat;
	        mask: var(--ls-ico) center / contain no-repeat;
}

/* --- Boutons posés sur une couverture sombre ---
   La règle de contraste mettait l'encre en nuit sur tous les boutons.
   Sur un fond terracotta foncé lui-même posé sur une photo sombre, ça
   tombe à 3,8 pour 1. Sur ces boutons, l'encre reste crème. */
.wp-block-cover .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.wp-block-cover .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.wp-block-cover .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
.ls-encart .ls-form__bouton,
.ls-encart .ls-form__bouton:hover {
	background: var(--wp--preset--color--terracotta-fonce);
	color: var(--wp--preset--color--creme);
}
.wp-block-cover .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--nuit);
}

/* --- Encart de la lettre : trop massif ---
   Marges de 40 sur les quatre côtés, titre en xl, formulaire en pleine
   largeur : le bloc occupait un écran entier pour un champ et un bouton. */
.ls-encart {
	max-width: 720px;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--30) !important;
}
.ls-encart .wp-block-heading {
	font-size: var(--wp--preset--font-size--grand) !important;
	margin-bottom: var(--wp--preset--spacing--10);
}
.ls-encart > p { font-size: var(--wp--preset--font-size--petit); margin-bottom: var(--wp--preset--spacing--20); }
.ls-encart .ls-zone__surtitre { margin-bottom: 6px; }
.ls-encart .ls-form { max-width: 520px; }
.ls-encart .ls-form__label { margin-bottom: 6px; }
.ls-encart .ls-form__mention { margin-top: var(--wp--preset--spacing--10); }
@media (min-width: 620px) {
	.ls-encart .ls-form { grid-template-columns: 1fr auto; }
}
@media (max-width: 768px) {
	.ls-encart { padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20) !important; }
}

/* --- Formulaire compact : champ et bouton sur une ligne, par construction --- */
.ls-form--compact .ls-form__ligne {
	display: flex;
	align-items: stretch;
	gap: 10px;
	margin: 0 0 var(--wp--preset--spacing--10);
}
.ls-form--compact .ls-form__saisie { flex: 1 1 auto; min-width: 0; }
.ls-form--compact .ls-form__bouton { flex: 0 0 auto; width: auto; white-space: nowrap; padding-inline: 22px; }
.ls-form__invisible {
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
.ls-form--compact .ls-form__consentement { font-size: var(--wp--preset--font-size--micro); line-height: 1.45; }
.ls-encart .ls-form--compact .ls-form__consentement a { color: var(--wp--preset--color--lavande); }
@media (max-width: 520px) {
	.ls-form--compact .ls-form__ligne { flex-direction: column; }
	.ls-form--compact .ls-form__bouton { width: 100%; }
}

/* ============================================================
   COUCHE v1.37 — EN-TÊTE FLOTTANT, PANNEAU MOBILE, ACCUEIL
   Revue visuelle du 27 septembre, à 1440 et 390 px.
   ============================================================ */

:root {
	--ls-grille: 1180px;            /* colonne de contenu des sections */
	--ls-pilule-marge: 14px;        /* écart entre la pilule et le bord de fenêtre */
	--ls-pilule-retrait: 22px;      /* marge intérieure gauche de la pilule */
	--ls-pilule-hauteur: 64px;
	--ls-entete-hauteur: calc(var(--ls-pilule-marge) + var(--ls-pilule-hauteur));
	--ls-voile-creme: rgb(253 251 247 / .86);
	--ls-filet-creme: rgb(231 226 216 / .85);
}
@media (max-width: 768px) {
	:root {
		--ls-pilule-marge: 10px;
		--ls-pilule-retrait: 16px;
		--ls-pilule-hauteur: 56px;
	}
}

/* ------------------------------------------------------------
   1. L'EN-TÊTE DEVIENT UNE PILULE FLOTTANTE
   Le bandeau n'est plus qu'un conteneur transparent et collant. La
   pilule est son contenu. Le verre dépoli est posé sur un pseudo-
   élément et non sur la pilule : un filtre sur la pilule ferait d'elle
   le repère de tout enfant en position fixe, et le panneau mobile
   s'ouvrirait dedans au lieu de s'ouvrir sur l'écran.
   ------------------------------------------------------------ */
body .site-header,
body #mobile-header {
	position: sticky;
	top: 0;
	z-index: 100;
	padding: var(--ls-pilule-marge) var(--ls-pilule-marge) 0;
	background: transparent;
	border: 0;
	box-shadow: none;
	-webkit-backdrop-filter: none;
	        backdrop-filter: none;
}
body.admin-bar .site-header,
body.admin-bar #mobile-header { top: 32px; }
@media (max-width: 782px) {
	body.admin-bar .site-header,
	body.admin-bar #mobile-header { top: 46px; }
}
@media (max-width: 600px) {
	body.admin-bar .site-header,
	body.admin-bar #mobile-header { top: 0; }
}

body .site-header .inside-header,
body #mobile-header .inside-navigation {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--ls-grille) + 2 * var(--ls-pilule-retrait));
	min-height: var(--ls-pilule-hauteur);
	margin-inline: auto;
	padding: 0 8px 0 var(--ls-pilule-retrait);
	border-radius: var(--wp--custom--rayon--pastille);
	background: transparent;
}
body .site-header .inside-header::before,
body #mobile-header .inside-navigation::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: var(--ls-voile-creme);
	-webkit-backdrop-filter: blur(16px) saturate(1.3);
	        backdrop-filter: blur(16px) saturate(1.3);
	box-shadow: 0 0 0 1px var(--ls-filet-creme), var(--wp--custom--ombre--deux);
}
body #site-navigation,
body #site-navigation .inside-navigation { background: transparent; }

/* Le logo est un SVG sans dimensions propres : dans un conteneur flexible,
   une largeur automatique le réduisait à zéro. On pose la hauteur et le
   rapport, la largeur suit. GeneratePress ajoute aussi 10 px de marge
   intérieure au logo mobile, ce qui l'écrasait à 10 px de haut. */
body .site-header .site-logo,
body #mobile-header .site-logo { flex: 0 0 auto; margin: 0; }
body .site-header .site-logo img {
	height: 40px;
	max-height: none;
	width: auto;
	aspect-ratio: 167 / 60;
}
body #mobile-header .site-logo img {
	height: 30px;
	max-height: none;
	width: auto;
	padding: 0;
	aspect-ratio: 167 / 60;
}

/* Recherche et bouton de menu groupés à droite, en cibles de 44 px. */
body #mobile-header .menu-bar-items { margin-left: auto; }
body #mobile-header .menu-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	line-height: 1;
	border-radius: var(--wp--custom--rayon--pastille);
}
body #mobile-header .menu-bar-items .menu-bar-item > a {
	width: 44px;
	height: 44px;
	padding: 0;
	line-height: 1;
}

/* Accueil : la photo remonte sous la pilule, comme une couverture. */
body.home .site-header,
body.home #mobile-header { margin-bottom: calc(-1 * var(--ls-entete-hauteur)); }

/* Tout ce qui colle ou qu'on atteint par ancre passe sous la pilule. */
html { scroll-padding-top: calc(var(--ls-entete-hauteur) + 16px); }
.single-post h2[id],
[id^="lieu-"] { scroll-margin-top: calc(var(--ls-entete-hauteur) + 16px); }
@media (max-width: 768px) {
	.ls-onglets { top: calc(var(--ls-entete-hauteur) + 6px); }
	.ls-articles-guides .ls-onglets { top: auto; }
}

/* ------------------------------------------------------------
   2. PANNEAU MOBILE : UNE CARTE SOUS LA PILULE
   Les couches v1.29 à v1.34 visaient #site-navigation, alors que sur
   téléphone GeneratePress ouvre #mobile-header. Leur mise en forme ne
   s'appliquait donc pas : c'est ce qui donnait la liste nue.
   ------------------------------------------------------------ */
body #site-navigation .ls-menu-villes,
body #site-navigation .ls-menu__ico { display: none; }
body .main-navigation .ls-menu__libelle { display: inline; }

@media (max-width: 768px) {
	body #mobile-header.toggled .main-nav > ul {
		position: fixed;
		top: calc(var(--ls-entete-hauteur) + 8px);
		right: var(--ls-pilule-marge);
		bottom: auto;
		left: var(--ls-pilule-marge);
		z-index: 101;
		display: grid;
		grid-template-columns: 1fr 1fr;
		align-content: start;
		gap: 2px 0;
		max-height: calc(100dvh - var(--ls-entete-hauteur) - 8px - var(--ls-pilule-marge));
		margin: 0;
		padding: 10px 10px calc(16px + env(safe-area-inset-bottom, 0px));
		border-radius: var(--wp--custom--rayon--encart);
		background: var(--wp--preset--color--creme);
		box-shadow: 0 0 0 1px var(--wp--preset--color--bordure), var(--wp--custom--ombre--trois);
		overflow-y: auto;
		overscroll-behavior: contain;
		animation: ls-panneau var(--wp--custom--duree--carte) var(--courbe-douce);
	}
	body #mobile-header.toggled .main-nav > ul::before { display: none; }
	body #mobile-header.toggled .main-nav > ul > li {
		grid-column: 1 / -1;
		width: auto;
		float: none;
		margin: 0;
	}

	/* Rubriques : pictogramme en cartouche, libellé en Fraunces. */
	body #mobile-header.toggled .main-nav > ul > li > a {
		display: flex;
		align-items: center;
		gap: 14px;
		min-height: 52px;
		margin: 0;
		padding: 7px 10px;
		border: 0;
		border-radius: var(--wp--custom--rayon--vignette);
		background: transparent;
		font-family: var(--wp--preset--font-family--titre);
		font-size: 1.3125rem;
		font-weight: 400;
		line-height: 1.2;
		letter-spacing: -0.01em;
		color: var(--wp--preset--color--nuit);
		text-decoration: none;
	}
	body #mobile-header.toggled .main-nav > ul > li > a::before,
	body #mobile-header.toggled .main-nav > ul > li > a::after { display: none; }
	body #mobile-header.toggled .ls-menu__ico {
		flex: 0 0 auto;
		box-sizing: content-box;
		width: 20px;
		height: 20px;
		padding: 9px;
		border-radius: var(--wp--custom--rayon--icone);
		background: var(--wp--preset--color--lavande-clair);
		color: var(--wp--preset--color--indigo);
	}
	body #mobile-header.toggled .main-nav > ul > li > a:hover,
	body #mobile-header.toggled .main-nav > ul > li > a:focus-visible {
		background: rgb(184 179 233 / .22);
	}
	body #mobile-header.toggled .main-nav > ul > li[class*="current-menu-"] > a {
		background: var(--wp--preset--color--lavande-clair);
		font-weight: 600;
	}
	body #mobile-header.toggled .main-nav > ul > li[class*="current-menu-"] .ls-menu__ico {
		background: var(--wp--preset--color--blanc);
	}

	/* À propos et La lettre : côte à côte, en retrait. */
	body #mobile-header.toggled .main-nav > ul > li.ls-menu-secondaire {
		grid-column: auto;
		margin-top: 8px;
		padding-top: 8px;
		border-top: 1px solid var(--wp--preset--color--bordure);
	}
	body #mobile-header.toggled .main-nav > ul > li.ls-menu-secondaire > a {
		min-height: 44px;
		padding: 8px 10px;
		font-family: var(--wp--preset--font-family--texte);
		font-size: var(--wp--preset--font-size--petit);
		font-weight: 500;
		color: var(--wp--preset--color--texte);
	}

	/* Raccourci villes. */
	body #mobile-header.toggled .main-nav > ul > li.ls-menu-villes {
		margin-top: 6px;
		padding: 14px 10px 2px;
		border-top: 1px solid var(--wp--preset--color--bordure);
	}
	body #mobile-header .ls-menu-villes__titre {
		display: block;
		margin-bottom: 10px;
		font-family: var(--wp--preset--font-family--texte);
		font-size: var(--wp--preset--font-size--micro);
		font-weight: 600;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		color: var(--wp--preset--color--texte-doux);
	}
	body #mobile-header .ls-menu-villes__liste {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}
	body #mobile-header .main-nav .ls-menu-villes__lien {
		display: inline-flex;
		align-items: center;
		min-height: 38px;
		margin: 0;
		padding: 6px 14px;
		border-radius: var(--wp--custom--rayon--pastille);
		background: var(--wp--preset--color--blanc);
		box-shadow: 0 0 0 1px var(--wp--preset--color--bordure), 0 1px 2px rgb(27 29 62 / .05);
		font-family: var(--wp--preset--font-family--texte);
		font-size: var(--wp--preset--font-size--petit);
		font-weight: 500;
		line-height: 1.2;
		color: var(--wp--preset--color--nuit);
		text-decoration: none;
	}
	body #mobile-header .main-nav .ls-menu-villes__lien:active { transform: translateY(1px); }

	/* Voile derrière le panneau, page immobile. */
	body:has(#mobile-header.toggled) { overflow: hidden; }
	body:has(#mobile-header.toggled)::after {
		content: "";
		position: fixed;
		inset: 0;
		z-index: 99;
		background: rgb(27 29 62 / .36);
		animation: ls-voile var(--wp--custom--duree--carte) ease-out;
	}
}
@keyframes ls-panneau {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: none; }
}
@keyframes ls-voile {
	from { opacity: 0; }
	to   { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	body #mobile-header.toggled .main-nav > ul,
	body:has(#mobile-header.toggled)::after { animation: none; }
}

/* ------------------------------------------------------------
   3. HERO D'ACCUEIL
   Avec une position de contenu choisie dans le bloc, WordPress réduit
   le conteneur intérieur à la largeur du texte et le plaque au bord :
   le titre partait à 21 px quand le logo était à 153. On rend au
   conteneur la largeur de la grille, centrée comme la pilule.
   ------------------------------------------------------------ */
body.home .entry-content > .wp-block-cover:first-child {
	padding-top: calc(var(--ls-entete-hauteur) + var(--wp--preset--spacing--40));
	padding-bottom: var(--wp--preset--spacing--50);
}
body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container {
	width: 100% !important;
	max-width: var(--ls-grille) !important;
	margin-inline: auto !important;
	padding-inline: 0 !important;
}
body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container > .wp-block-group {
	margin-left: 0 !important;
	padding-inline: 0 !important;
}
/* Le repère de défilement se lisait comme un trait égaré sous les boutons. */
body.home .entry-content > .wp-block-cover:first-child .wp-block-cover__inner-container::after { display: none; }

@media (max-width: 768px) {
	body.home .entry-content > .wp-block-cover:first-child {
		min-height: 78svh;
		padding-inline: calc(var(--ls-pilule-marge) + var(--ls-pilule-retrait)) !important;
		padding-bottom: var(--wp--preset--spacing--40);
	}
	body.home .entry-content > .wp-block-cover:first-child .wp-block-buttons { gap: 10px; }
}

/* Bouton secondaire en contour sur fond sombre : GeneratePress lui
   imposait le fond terracotta des boutons pleins, les deux actions
   avaient le même poids. */
body .wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link,
body .wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link:visited {
	background: transparent !important;
	border: 0;
	box-shadow: inset 0 0 0 1.5px rgb(253 251 247 / .6);
	color: var(--wp--preset--color--creme) !important;
}
body .wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link:hover,
body .wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link:focus-visible {
	background: rgb(253 251 247 / .12) !important;
	box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--creme);
}

/* ------------------------------------------------------------
   4. RUBRIQUES : GRILLE PLEINE ET LISTE COMPACTE
   Sept cartes sur quatre colonnes laissaient un trou. La première
   prend deux places : huit cases, deux rangées pleines, et la même
   chose sur deux colonnes.
   ------------------------------------------------------------ */
.ls-cartes--rubriques > .ls-carte-visuel:first-child { grid-column: span 2; }
.ls-cartes--rubriques > .ls-carte-visuel:first-child .wp-block-image img { aspect-ratio: 8 / 3; }
@media (max-width: 900px) {
	.ls-cartes--rubriques > .ls-carte-visuel:first-child .wp-block-image img { aspect-ratio: 16 / 9; }
}

/* Sur téléphone, une carte de 470 px par rubrique faisait une section
   de 3 300 px. Vignette à gauche, texte à droite : quatre fois moins. */
@media (max-width: 560px) {
	.ls-cartes--compact { gap: 12px; }
	.ls-cartes--compact > .ls-carte-visuel,
	.ls-cartes--rubriques > .ls-carte-visuel:first-child {
		grid-column: auto;
		flex-direction: row;
		align-items: stretch;
	}
	.ls-cartes--compact .ls-carte-visuel > .wp-block-image {
		flex: 0 0 104px;
		margin: 0;
	}
	.ls-cartes--compact .ls-carte-visuel > .wp-block-image img,
	.ls-cartes--rubriques > .ls-carte-visuel:first-child .wp-block-image img {
		height: 100%;
		min-height: 108px;
		aspect-ratio: auto;
	}
	.ls-cartes--compact .ls-carte-visuel__corps {
		flex: 1 1 auto;
		justify-content: center;
		gap: 4px;
		padding: 12px 16px;
	}
	.ls-cartes--compact .ls-carte-visuel__chip { display: none; }
	.ls-cartes--compact .ls-carte-visuel__titre,
	.ls-cartes--compact .ls-carte-visuel h3 { font-size: var(--wp--preset--font-size--moyen); }
	.ls-cartes--compact .ls-carte-visuel__texte {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		font-size: var(--wp--preset--font-size--micro);
		line-height: 1.45;
	}
}

/* ============================================================
   COUCHE v1.38 — ARTICLES SUR GRAND ÉCRAN
   L'élément GeneratePress « Article — Layout » fixe #content à 720 px,
   soit 640 px utiles une fois les marges retirées. Sur un écran de
   1 536 px, l'article occupait à peine 40 % de la largeur sous une
   pilule de 1 224 px : deux grands vides de part et d'autre.
   On ouvre le conteneur à la largeur des blocs larges (1 100 px), on
   garde le texte sur une colonne de lecture de 720 px, et l'image de
   tête, les blocs ls-large et les articles liés profitent de l'espace.
   ============================================================ */
:root { --ls-colonne-lecture: 720px; --ls-image-tete: 960px; }

@media (min-width: 1025px) {
	body.single-post #content {
		max-width: calc(var(--wp--custom--largeur--large) + 80px);
	}
	body.single-post .inside-article > *,
	body.single-post .entry-content > * {
		max-width: var(--ls-colonne-lecture);
		margin-left: auto !important;
		margin-right: auto !important;
	}
	body.single-post .inside-article > .entry-content { max-width: none; }
	body.single-post .inside-article > .ls-image-article { max-width: var(--ls-image-tete); }
	body.single-post .inside-article > .ls-lies { max-width: var(--wp--custom--largeur--large); }
	body.single-post .inside-article > .ls-auteur { max-width: var(--ls-colonne-lecture) !important; }
	body.single-post .entry-content > .ls-large { max-width: none !important; }
}

/* ============================================================
   COUCHE v1.39 — PAGE DE LA LETTRE
   La page reprenait le gabarit d'une page de texte : un titre, un
   paragraphe, un formulaire, deux listes. Pour une invitation, c'était
   froid. Elle compose maintenant ses sections comme l'accueil : un
   bandeau indigo avec l'aperçu d'une lettre, des cartes, des
   engagements, un dernier appel.
   La pleine largeur et le titre masqué viennent de inc/page-lettre.php.
   ============================================================ */

/* Le bandeau remonte sous la pilule, comme le hero de l'accueil. */
body.ls-page-lettre .site-header,
body.ls-page-lettre #mobile-header { margin-bottom: calc(-1 * var(--ls-entete-hauteur)); }
body.ls-page-lettre .site-content,
body.ls-page-lettre .inside-article { padding: 0; }
body.ls-page-lettre .entry-content > .alignfull { margin-block: 0; }

/* --- Bandeau --- */
.ls-lettre-hero {
	padding: calc(var(--ls-entete-hauteur) + var(--wp--preset--spacing--50)) var(--wp--preset--spacing--30) var(--wp--preset--spacing--60);
	background-image:
		radial-gradient(55% 65% at 6% 0%, rgb(184 179 233 / .34), transparent 70%),
		radial-gradient(45% 55% at 96% 92%, rgb(184 179 233 / .16), transparent 70%),
		linear-gradient(165deg, var(--wp--preset--color--indigo) 0%, var(--wp--preset--color--nuit) 100%);
	color: var(--wp--preset--color--creme);
	overflow: hidden;
}
.ls-lettre-hero__colonnes {
	gap: var(--wp--preset--spacing--50);
	margin-block: 0;
}
.ls-lettre-hero__texte > *,
.ls-lettre-hero__visuel > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }

.ls-lettre__surtitre {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 7px 16px 7px 13px;
	border-radius: var(--wp--custom--rayon--pastille);
	background: rgb(253 251 247 / .1);
	box-shadow: inset 0 0 0 1px rgb(253 251 247 / .22);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--lavande);
}
.ls-lettre__surtitre::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--wp--preset--color--terracotta);
}
.ls-lettre-hero__titre {
	margin: var(--wp--preset--spacing--30) 0 0;
	font-family: var(--wp--preset--font-family--titre);
	font-size: clamp(2.4rem, 1.3rem + 3.6vw, 4rem);
	font-weight: 300;
	line-height: 1.04;
	letter-spacing: -0.03em;
	color: var(--wp--preset--color--creme);
	text-wrap: balance;
}
.ls-lettre-hero__titre strong { font-weight: 600; }
.ls-lettre-hero__chapo {
	max-width: 46ch;
	margin: var(--wp--preset--spacing--30) 0 0;
	font-size: var(--wp--preset--font-size--moyen);
	line-height: 1.6;
	color: var(--wp--preset--color--texte-clair);
}

/* Formulaire posé sur l'indigo : mêmes réglages que l'encart de l'accueil. */
.ls-lettre-hero__formulaire { max-width: 560px; margin: var(--wp--preset--spacing--40) 0 0; }
.ls-lettre-hero__formulaire > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
.ls-lettre-hero .ls-form { max-width: 100%; }
.ls-lettre-hero .ls-form__saisie {
	background: rgb(253 251 247 / .96);
	border-color: rgb(184 179 233 / .45);
}
.ls-lettre-hero .ls-form__consentement { color: var(--wp--preset--color--texte-clair); }
.ls-lettre-hero .ls-form__consentement a,
.ls-lettre-hero__mention a {
	color: var(--wp--preset--color--lavande);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.ls-lettre-hero .ls-form__bouton,
.ls-lettre-hero .ls-form__bouton:visited {
	background: var(--wp--preset--color--terracotta-fonce);
	color: var(--wp--preset--color--creme);
}
.ls-lettre-hero .ls-form__bouton:hover,
.ls-lettre-hero .ls-form__bouton:focus-visible {
	background: var(--wp--preset--color--terracotta);
	color: var(--wp--preset--color--nuit);
}
.ls-lettre-hero__mention {
	margin: var(--wp--preset--spacing--20) 0 0;
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-clair);
}

/* --- Aperçu de la lettre : une feuille crème, une seconde en dessous --- */
.ls-lettre-apercu {
	position: relative;
	max-width: 420px;
	margin-inline: auto !important;
	padding: var(--wp--preset--spacing--30);
	border-radius: var(--wp--custom--rayon--encart);
	background: var(--wp--preset--color--creme);
	color: var(--wp--preset--color--texte);
	/* La seconde feuille, décalée, est une ombre sans flou : un pseudo-élément
	   passerait devant le fond crème de la carte. */
	box-shadow:
		16px 16px 0 rgb(184 179 233 / .3),
		0 1px 2px rgb(21 23 53 / .2),
		0 28px 60px rgb(21 23 53 / .45);
}
.ls-lettre-apercu > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
.ls-lettre-apercu__entete {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 18px !important;
	padding-bottom: 14px;
	border-bottom: 1px dashed var(--wp--preset--color--bordure);
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--texte-doux);
}
.ls-lettre-apercu__objet {
	margin: 0 0 12px !important;
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--grand);
	font-weight: 300;
	line-height: 1.2;
	color: var(--wp--preset--color--nuit);
}
.ls-lettre-apercu__objet strong { font-weight: 600; }
.ls-lettre-apercu__sommaire {
	counter-reset: lettre;
	margin: 0 !important;
	padding: 0;
	list-style: none;
}
.ls-lettre-apercu__sommaire li {
	counter-increment: lettre;
	position: relative;
	margin: 0;
	padding: 14px 0 14px 44px;
	border-bottom: 1px solid var(--wp--preset--color--bordure);
	font-size: var(--wp--preset--font-size--petit);
	line-height: 1.4;
}
.ls-lettre-apercu__sommaire li:last-child { border-bottom: 0; }
.ls-lettre-apercu__sommaire li::before {
	content: counter(lettre);
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -15px;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--wp--preset--color--lavande-clair);
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--indigo);
}
.ls-lettre-apercu__sommaire strong { font-weight: 600; color: var(--wp--preset--color--nuit); }
.ls-lettre-apercu__pied {
	margin: 12px 0 0 !important;
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}

/* --- Sections --- */
.ls-lettre-section {
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--30);
}
.ls-lettre-cartes { margin-top: var(--wp--preset--spacing--30); }
.ls-lettre-cartes .ls-carte-visuel__grand { color: var(--wp--preset--color--indigo); }
.ls-lettre-section__note {
	margin-top: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--petit);
	color: var(--wp--preset--color--texte-doux);
}
.ls-lettre-engagements__colonnes { gap: var(--wp--preset--spacing--50); margin-block: 0; }
.ls-lettre-engagements .wp-block-column > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
.ls-lettre-engagements .ls-liste-ico li { color: var(--wp--preset--color--texte); }

/* --- Dernier appel : indigo, pour se détacher du pied de page nuit --- */
.ls-lettre-final {
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--30);
	background-image: radial-gradient(50% 80% at 50% 0%, rgb(184 179 233 / .22), transparent 70%);
}
.ls-lettre-final__titre {
	font-family: var(--wp--preset--font-family--titre);
	font-size: var(--wp--preset--font-size--xxl);
	font-weight: 300;
	color: var(--wp--preset--color--creme);
}
.ls-lettre-final__titre strong { font-weight: 600; }
.ls-lettre-final__texte { color: var(--wp--preset--color--texte-clair); }

@media (max-width: 768px) {
	.ls-lettre-hero {
		padding: calc(var(--ls-entete-hauteur) + var(--wp--preset--spacing--40)) calc(var(--ls-pilule-marge) + var(--ls-pilule-retrait)) var(--wp--preset--spacing--50);
	}
	.ls-lettre-hero__colonnes { gap: var(--wp--preset--spacing--40); }
	.ls-lettre-apercu { max-width: 100%; margin-right: 16px !important; }
	.ls-lettre-section,
	.ls-lettre-final { padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--30); }
	.ls-lettre-engagements__colonnes { gap: var(--wp--preset--spacing--20); }
}

/* ============================================================
   COUCHE v1.40 — COULEURS GLOBALES DE GENERATEPRESS
   GeneratePress écrit ses règles avec ses propres variables (--contrast,
   --base-2, --accent…). Elles ne sont plus déclarées : la palette
   « Couleurs globales » du personnalisateur est vide. Toute règle qui
   s'en sert tombe donc à vide. Symptôme visible : au focus, le champ
   e-mail perdait son fond crème et laissait voir le fond nuit du bloc,
   avec un texte noir dessus.
   On redéclare ces variables à partir des jetons du theme.json, selon la
   correspondance de la DA. Si la palette est un jour remplie dans le
   personnalisateur, GeneratePress repasse devant, avec les mêmes valeurs.
   ============================================================ */
:root {
	--contrast: var(--wp--preset--color--nuit);
	--contrast-2: var(--wp--preset--color--texte);
	--contrast-3: var(--wp--preset--color--texte-doux);
	--base: var(--wp--preset--color--sable);
	--base-2: var(--wp--preset--color--creme);
	--base-3: var(--wp--preset--color--blanc);
	--accent: var(--wp--preset--color--terracotta);
}

/* Champ e-mail sur fond sombre : fond et encre tenus dans tous les états.
   La règle :focus de GeneratePress est plus spécifique que la nôtre. */
.ls-encart .ls-form__saisie,
.ls-encart .ls-form__saisie:focus,
.ls-lettre-hero .ls-form__saisie,
.ls-lettre-hero .ls-form__saisie:focus,
.ls-infolettre .ls-form__saisie,
.ls-infolettre .ls-form__saisie:focus {
	background-color: rgb(253 251 247 / .96);
	color: var(--wp--preset--color--texte);
}

/* ============================================================
   COUCHE v1.42 — ANNUAIRE DES LIEUX
   Les fiches viennent désormais du type de contenu « Lieu »
   (inc/lieux.php) et sont rendues par [ls_lieux]. Le balisage reprend
   exactement les classes des fiches écrites à la main : seules trois
   règles sont nouvelles.
   ============================================================ */

/* Un groupe de fiches standard est enveloppé d'un conteneur. Ses marges
   reprennent celles d'une fiche, pour un rendu identique à l'ancien. */
.ls-lieux-groupe { margin-block: var(--wp--preset--spacing--30); }
.ls-lieux-groupe > .ls-lieu:first-child { margin-top: 0; }
.ls-lieux-groupe > .ls-lieu:last-child { margin-bottom: 0; }

/* Les onglets des carnets pointent vers les groupes, plus vers une fiche :
   ajouter un lieu ne casse plus aucun lien. */
[id^="g-"] { scroll-margin-top: calc(var(--ls-entete-hauteur) + 16px); }

/* Lien « Modifier », visible uniquement pour la rédaction connectée. */
.ls-lieu__modifier {
	display: inline-block;
	margin-top: var(--wp--preset--spacing--10);
	font-size: var(--wp--preset--font-size--micro);
	color: var(--wp--preset--color--texte-doux);
}

/* ============================================================
   COUCHE v1.43 — CARTES COMPACTES DE L'ACCUEIL SUR MOBILE
   Depuis la v1.41, les images des blocs portent leurs dimensions
   (width et height) pour le chargement différé. Dans la carte compacte,
   la vignette demandait « 100 % de la hauteur » d'un conteneur sans
   hauteur : le navigateur retombait sur les dimensions de l'image et
   chaque carte montait à 1 500 px. La vignette remplit maintenant sa
   colonne en position absolue : la carte prend la hauteur de son texte.
   ============================================================ */
@media (max-width: 560px) {
	body .ls-cartes--compact .ls-carte-visuel > .wp-block-image {
		position: relative;
		flex: 0 0 104px;
		align-self: stretch;
		min-height: 108px;
		margin: 0;
		overflow: hidden;
	}
	body .ls-cartes--compact .ls-carte-visuel > .wp-block-image img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		min-height: 0;
		max-width: none;
		aspect-ratio: auto;
		object-fit: cover;
	}
}