/**
 * Yog'Action — styles globaux.
 *
 * 1. Tokens sémantiques --ya-* (mappés sur les presets de theme.json)
 * 2. Base (remise à zéro, typographie)
 * 3. Utilitaires de mise en page
 * 4. Composants partagés (surtitre, boutons, cartes, fonds, apparition)
 * 5. En-tête, navigation, menu mobile
 * 6. Pied de page
 * 7. Fil d'Ariane, article, 404
 * 8. Formulaire (Contact Form 7)
 *
 * Points de rupture (ceux de la maquette) : sm 640px, md 768px, lg 1024px, xl 1280px, 2xl 1536px.
 */

/* 1. Tokens ---------------------------------------------------------------- */

:root {
	--ya-couleur-fond: var(--wp--preset--color--fond);
	--ya-couleur-surface: var(--wp--preset--color--surface);
	--ya-couleur-carte: var(--wp--preset--color--carte);
	--ya-couleur-texte: var(--wp--preset--color--texte);
	--ya-couleur-attenue: var(--wp--preset--color--texte-attenue);
	--ya-couleur-primaire: var(--wp--preset--color--primaire);
	--ya-couleur-primaire-fonce: var(--wp--preset--color--primaire-fonce);
	--ya-couleur-primaire-texte: var(--wp--preset--color--primaire-texte);
	--ya-couleur-accent: var(--wp--preset--color--accent);
	--ya-couleur-accent-fonce: var(--wp--preset--color--accent-fonce);
	--ya-couleur-accent-texte: var(--wp--preset--color--accent-texte);
	--ya-couleur-blanc: var(--wp--preset--color--blanc);
	--ya-couleur-bordure: var(--wp--preset--color--bordure);
	--ya-couleur-bordure-forte: var(--wp--preset--color--bordure-forte);

	--ya-voile-fond: var(--wp--custom--voile--fond);
	--ya-voile-entete: var(--wp--custom--voile--entete);
	--ya-voile-accent: var(--wp--custom--voile--accent);
	--ya-voile-blanc: var(--wp--custom--voile--blanc);
	--ya-voile-lecture: var(--wp--custom--voile--lecture);
	--ya-voile-legende: var(--wp--custom--voile--legende);
	--ya-voile-degrade: var(--wp--custom--voile--degrade);

	--ya-police-titres: var(--wp--preset--font-family--titres);
	--ya-police-texte: var(--wp--preset--font-family--texte);
	--ya-police-mono: var(--wp--preset--font-family--mono);

	--ya-taille-mono: var(--wp--preset--font-size--mono);
	--ya-taille-petit: var(--wp--preset--font-size--petit);
	--ya-taille-bouton: var(--wp--preset--font-size--bouton);
	--ya-taille-base: var(--wp--preset--font-size--base);
	--ya-taille-lg: var(--wp--preset--font-size--lg);
	--ya-taille-xl: var(--wp--preset--font-size--xl);
	--ya-taille-2xl: var(--wp--preset--font-size--2-xl);
	--ya-taille-h1: var(--wp--preset--font-size--h-1);
	--ya-taille-h2: var(--wp--preset--font-size--h-2);
	--ya-taille-h3: var(--wp--preset--font-size--h-3);
	--ya-taille-accueil: var(--wp--preset--font-size--accueil);
	--ya-taille-accueil-mobile: var(--wp--preset--font-size--accueil-mobile);
	--ya-taille-ville: var(--wp--preset--font-size--ville);
	--ya-taille-nav: 0.82rem;
	--ya-taille-nav-large: 0.95rem;
	--ya-taille-suite-titre: 0.75em;

	--ya-interligne-texte: var(--wp--custom--interligne--texte);
	--ya-interligne-titre: var(--wp--custom--interligne--titre);
	--ya-interligne-serre: var(--wp--custom--interligne--serre);
	--ya-interligne-petit: 1.4286;
	--ya-interligne-bouton: 1.5;
	--ya-interligne-lg: 1.5556;
	--ya-interligne-xl: 1.4;
	--ya-interligne-2xl: 1.3333;

	--ya-espace-1: var(--wp--preset--spacing--1);
	--ya-espace-2: var(--wp--preset--spacing--2);
	--ya-espace-3: var(--wp--preset--spacing--3);
	--ya-espace-4: var(--wp--preset--spacing--4);
	--ya-espace-5: var(--wp--preset--spacing--5);
	--ya-espace-6: var(--wp--preset--spacing--6);
	--ya-espace-8: var(--wp--preset--spacing--8);
	--ya-espace-10: var(--wp--preset--spacing--10);
	--ya-espace-12: var(--wp--preset--spacing--12);
	--ya-espace-14: var(--wp--preset--spacing--14);
	--ya-espace-16: var(--wp--preset--spacing--16);
	--ya-espace-20: var(--wp--preset--spacing--20);
	--ya-espace-24: var(--wp--preset--spacing--24);
	--ya-espace-section: var(--wp--preset--spacing--section);

	--ya-rayon-carte: var(--wp--custom--rayon--carte);
	--ya-rayon-pastille: var(--wp--custom--rayon--pastille);
	--ya-rayon-petit: var(--wp--custom--rayon--petit);

	--ya-largeur-conteneur: var(--wp--custom--largeur--conteneur);
	--ya-largeur-lecture: var(--wp--custom--largeur--lecture);
	--ya-largeur-titre: var(--wp--custom--largeur--titre);
	--ya-largeur-menu: var(--wp--custom--largeur--menu);

	--ya-ombre-carte: var(--wp--custom--ombre--carte);
	--ya-ombre-menu: var(--wp--custom--ombre--menu);

	--ya-bande-sur-fond: url("../images/bande-02.svg");
	--ya-bande-sur-surface: url("../images/bande-01.svg");
}

/* 2. Base ------------------------------------------------------------------ */

*,
*::before,
*::after {
	box-sizing: border-box;
	border: 0 solid var(--ya-couleur-bordure);
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

/*
 * « .editor-styles-wrapper » : dans le canevas de l’éditeur (iframe), le préfixeur réécrit
 * « body » en « body .editor-styles-wrapper », qui ne cible rien puisque le wrapper est
 * le <body> lui-même. Un sélecteur contenant déjà le wrapper est laissé tel quel.
 */
body,
.editor-styles-wrapper {
	margin: 0;
	background-color: var(--ya-couleur-fond);
	color: var(--ya-couleur-texte);
	font-family: var(--ya-police-texte);
	font-size: var(--ya-taille-base);
	line-height: var(--ya-interligne-texte);
	overflow-x: hidden;
}

body.ya-menu-ouvert {
	overflow: hidden;
}

h1,
h2,
h3,
h4,
p,
ul,
ol,
figure,
blockquote,
dl,
dd {
	margin: 0;
}

ul,
ol {
	padding: 0;
	list-style: none;
}

h1,
h2,
h3,
h4 {
	color: var(--ya-couleur-texte);
	font-family: var(--ya-police-titres);
	font-weight: 700;
	line-height: var(--ya-interligne-titre);
	letter-spacing: -0.01em;
	text-wrap: balance;
}

h1 {
	font-size: var(--ya-taille-h1);
}

h2 {
	font-size: var(--ya-taille-h2);
}

h3 {
	font-size: var(--ya-taille-h3);
}

a {
	color: inherit;
	text-decoration: inherit;
	outline-offset: 3px;
}

img,
svg {
	display: block;
	max-width: 100%;
}

img {
	height: auto;
}

button,
input,
select,
textarea {
	font: inherit;
	color: inherit;
}

button {
	cursor: pointer;
	background: none;
}

address {
	font-style: normal;
}

table {
	border-collapse: collapse;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid var(--ya-couleur-accent);
	outline-offset: 3px;
	border-radius: var(--ya-rayon-petit);
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

.ya-lien-evitement {
	position: absolute;
	left: var(--ya-espace-4);
	top: var(--ya-espace-4);
	z-index: 60;
	padding: var(--ya-espace-2) var(--ya-espace-4);
	border-radius: var(--ya-rayon-petit);
	background: var(--ya-couleur-primaire);
	color: var(--ya-couleur-blanc);
	font-weight: 700;
	transform: translateY(-300%);
}

.ya-lien-evitement:focus {
	transform: none;
}

/* 3. Mise en page ---------------------------------------------------------- */

.ya-conteneur {
	width: 100%;
	max-width: var(--ya-largeur-conteneur);
	margin-inline: auto;
	padding-inline: var(--ya-espace-5);
}

.ya-section {
	position: relative;
	padding-block: var(--ya-espace-16);
}

.ya-section.is-style-beige {
	background-color: var(--ya-couleur-surface);
}

.ya-lecture {
	max-width: var(--ya-largeur-lecture);
}

.ya-espace-haut {
	margin-top: var(--ya-espace-10);
}

.ya-mono {
	font-family: var(--ya-police-mono);
	letter-spacing: 0.06em;
}

.ya-grille {
	display: grid;
	gap: var(--ya-espace-6);
}

.ya-boutons {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ya-espace-3);
}

@media (min-width: 768px) {
	.ya-conteneur {
		padding-inline: var(--ya-espace-8);
	}

	/* Marge latérale de la page (blocs natifs) = celle de .ya-conteneur. */
	body,
	.editor-styles-wrapper {
		--wp--style--root--padding-left: var(--ya-espace-8);
		--wp--style--root--padding-right: var(--ya-espace-8);
	}

	.ya-section {
		padding-block: var(--ya-espace-section);
	}

	.ya-grille--2,
	.ya-grille--3,
	.ya-grille--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.ya-grille--3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1280px) {
	.ya-grille--4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* 4. Composants partagés --------------------------------------------------- */

/* Titre de section */
.ya-titre-section {
	max-width: var(--ya-largeur-titre);
}

.ya-titre-section__titre {
	margin-top: var(--ya-espace-3);
}

.ya-titre-section__intro {
	max-width: var(--ya-largeur-lecture);
	margin-top: var(--ya-espace-4);
	font-size: var(--ya-taille-lg);
	line-height: var(--ya-interligne-lg);
}

/* Surtitre (accent mono en capitales) ; aussi style « Surtitre » du paragraphe natif */
.ya-surtitre,
p.is-style-surtitre {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-3);
	width: fit-content;
	max-width: 100%;
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.ya-surtitre--rouge,
p.is-style-surtitre {
	padding: 0.45rem 1.5rem 0.4rem 1.1rem;
	color: var(--ya-couleur-primaire-texte);
	background-image: var(--ya-bande-sur-fond);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.is-style-beige .ya-surtitre--rouge,
.is-style-section-beige > p.is-style-surtitre {
	background-image: var(--ya-bande-sur-surface);
}


.ya-surtitre--vert {
	color: var(--ya-couleur-accent-texte);
}

.ya-surtitre__numero {
	color: var(--ya-couleur-accent-texte);
}

.ya-numero {
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	letter-spacing: 0.06em;
	color: var(--ya-couleur-accent-texte);
}

/* Boutons */
.ya-bouton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ya-espace-2);
	min-height: var(--ya-espace-12);
	padding-inline: 1.4rem;
	border-radius: var(--ya-rayon-pastille);
	font-size: var(--ya-taille-bouton);
	font-weight: 700;
	line-height: var(--ya-interligne-serre);
	text-align: center;
	transition:
		background-color 0.15s ease,
		color 0.15s ease,
		border-color 0.15s ease,
		transform 0.15s ease;
}

.ya-bouton:hover {
	transform: translateY(-1px);
}

.ya-bouton--primaire {
	background-color: var(--ya-couleur-primaire);
	color: var(--ya-couleur-blanc);
}

.ya-bouton--primaire:hover {
	background-color: var(--ya-couleur-primaire-fonce);
}

.ya-bouton--accent {
	background-color: var(--ya-couleur-accent);
	color: var(--ya-couleur-blanc);
}

.ya-bouton--accent:hover {
	background-color: var(--ya-couleur-accent-fonce);
}

.ya-bouton--contour {
	border: 2px solid var(--ya-couleur-bordure-forte);
	background-color: transparent;
	color: var(--ya-couleur-texte);
}

.ya-bouton--contour:hover {
	background-color: var(--ya-couleur-surface);
}

.ya-bouton--inverse {
	border: 2px solid var(--ya-couleur-blanc);
	color: var(--ya-couleur-blanc);
}

.ya-bouton--inverse:hover {
	background-color: var(--ya-voile-blanc);
}

.ya-bouton[aria-disabled="true"] {
	opacity: 0.6;
}

.ya-lien-fleche {
	display: inline-flex;
	align-items: center;
	gap: var(--ya-espace-2);
	color: var(--ya-couleur-primaire-texte);
	font-weight: 700;
}

.ya-lien-fleche:hover {
	text-decoration: underline;
}

/* Icônes */
.ya-icone {
	flex-shrink: 0;
	width: var(--ya-espace-5);
	height: var(--ya-espace-5);
}

.ya-icone--petite {
	width: var(--ya-espace-4);
	height: var(--ya-espace-4);
}

.ya-icone--moyenne {
	width: var(--ya-espace-6);
	height: var(--ya-espace-6);
}

.ya-icone--grande {
	width: var(--ya-espace-8);
	height: var(--ya-espace-8);
}

/* Cartes */
.ya-carte {
	border: 1px solid var(--ya-couleur-bordure);
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-carte);
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease,
		border-color 0.2s ease;
}

.ya-carte--survol:hover {
	transform: translateY(-4px);
	box-shadow: var(--ya-ombre-carte);
}

.ya-carte--fond {
	background-color: var(--ya-couleur-fond);
}

.ya-pastille {
	padding: var(--ya-espace-1) var(--ya-espace-3);
	border-radius: var(--ya-rayon-pastille);
	background-color: var(--ya-couleur-surface);
	color: var(--ya-couleur-attenue);
}

/* Texte riche */
.ya-texte-riche > * + * {
	margin-top: var(--ya-espace-4);
}

.ya-texte-riche a {
	color: var(--ya-couleur-primaire-texte);
	font-weight: 700;
}

.ya-texte-riche a:hover {
	text-decoration: underline;
}

.ya-texte-riche ul,
.ya-texte-riche ol {
	display: grid;
	gap: var(--ya-espace-3);
}

/* Mentions à compléter */
.ya-a-completer {
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	letter-spacing: 0.06em;
}

/* Photo : zoom au survol */
.ya-zoom {
	overflow: hidden;
}

.ya-zoom img {
	transition: transform 0.5s ease;
}

.ya-zoom:hover img {
	transform: scale(1.03);
}

.ya-media {
	border-radius: var(--ya-rayon-carte);
}

.ya-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Images de fond (balise img, pas de style en ligne) */
.ya-section--fond {
	isolation: isolate;
	clip-path: inset(0);
}

.ya-section--fond > .ya-conteneur {
	position: relative;
	z-index: 1;
}

.ya-fond {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.ya-fond__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.ya-fond--fixe .ya-fond__image {
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100vh;
}

/*
 * Voile et dégradé de lisibilité, posés sur des photos non retouchées.
 * --voile : voile clair uniforme ; --degrade : aplat clair à gauche (sous le texte)
 * qui s'efface vers la droite. Sur mobile, le texte occupe toute la largeur :
 * le dégradé y devient un voile uniforme.
 */
.ya-fond--voile {
	--ya-fond-voile: var(--ya-voile-fond);
}

.ya-fond--degrade {
	--ya-fond-voile: var(--ya-voile-lecture);
}

.ya-fond--voile::after,
.ya-fond--degrade::after {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--ya-fond-voile);
	background-image: var(--ya-fond-degrade, none);
}

@media (min-width: 768px) {
	.ya-fond--degrade {
		--ya-fond-voile: transparent;
		--ya-fond-degrade: var(--ya-voile-degrade);
	}

	.ya-fond--voile {
		--ya-fond-voile: var(--ya-voile-fond);
	}
}

/* Apparition douce au scroll (activée par JS) */
.js .ya-reveal {
	opacity: 0;
	transform: translateY(18px);
	transition:
		opacity 0.6s ease,
		transform 0.6s ease;
}

.js .ya-reveal.est-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
	}

	.js .ya-reveal {
		opacity: 1;
		transform: none;
	}
}

/* Carte pratique */
.ya-carte-pratique {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
}

.ya-carte-pratique__media {
	display: block;
	aspect-ratio: 16 / 10;
}

.ya-carte-pratique__image,
.ya-carte-lieu__image,
.ya-carte-actualite__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ya-carte-pratique__corps,
.ya-carte-lieu__corps,
.ya-carte-actualite__corps {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: var(--ya-espace-6);
}

.ya-carte-pratique__surtitre {
	gap: var(--ya-espace-2);
}

.ya-carte-pratique__numero--vert {
	color: var(--ya-couleur-accent-texte);
}

.ya-carte-pratique__numero--rouge {
	color: var(--ya-couleur-primaire-texte);
}

.ya-carte-pratique__type {
	color: var(--ya-couleur-attenue);
}

.ya-carte-pratique__titre {
	margin-top: var(--ya-espace-2);
}

.ya-carte-pratique__titre a:hover,
.ya-carte-actualite__titre a:hover {
	color: var(--ya-couleur-accent-texte);
}

.ya-carte-pratique__resume {
	flex: 1;
	margin-top: var(--ya-espace-3);
}

.ya-carte-pratique__pour {
	margin-top: var(--ya-espace-4);
	padding: 0.375rem var(--ya-espace-3);
	border-radius: var(--ya-rayon-pastille);
	background-color: var(--ya-couleur-surface);
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	letter-spacing: 0.06em;
}

.ya-carte-pratique__lien,
.ya-carte-actualite__lien {
	margin-top: var(--ya-espace-5);
}

/* Carte lieu */
.ya-carte-lieu {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
}

.ya-carte-lieu__media {
	aspect-ratio: 21 / 9;
}

.ya-carte-lieu__ville {
	margin-top: var(--ya-espace-2);
	font-size: var(--ya-taille-ville);
}

.ya-carte-lieu__lieu {
	margin-top: var(--ya-espace-2);
	font-weight: 700;
}

.ya-carte-lieu__reperes {
	margin-top: var(--ya-espace-2);
	color: var(--ya-couleur-attenue);
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	letter-spacing: 0.06em;
}

.ya-carte-lieu__description {
	margin-top: var(--ya-espace-4);
	font-size: var(--ya-taille-lg);
	line-height: var(--ya-interligne-lg);
}

.ya-carte-lieu__bouton {
	align-self: flex-start;
	margin-top: var(--ya-espace-5);
}

/* Carte actualité */
.ya-carte-actualite {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
}

.ya-carte-actualite__media {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 10;
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-surface);
}

.ya-carte-actualite__vide,
.ya-article__vide {
	color: var(--ya-couleur-attenue);
	text-transform: uppercase;
}

.ya-carte-actualite__meta {
	flex-wrap: wrap;
}

.ya-carte-actualite__date {
	color: var(--ya-couleur-primaire-texte);
}

.ya-carte-actualite__titre {
	margin-top: var(--ya-espace-3);
}

.ya-carte-actualite__chapeau {
	flex: 1;
	margin-top: var(--ya-espace-3);
}

/* 5. En-tête --------------------------------------------------------------- */

.ya-entete {
	position: sticky;
	top: 0;
	z-index: 50;
	border-bottom: 1px solid var(--ya-couleur-bordure);
	background-color: var(--ya-voile-entete);
	backdrop-filter: blur(8px);
}

.admin-bar .ya-entete {
	top: var(--wp-admin--admin-bar--height, 0);
}

.ya-entete__barre {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ya-espace-4);
	padding-block: var(--ya-espace-4);
	transition: padding 0.2s ease;
}

.ya-entete.est-compact .ya-entete__barre {
	padding-block: var(--ya-espace-2);
}

.ya-entete__logo {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	gap: var(--ya-espace-3);
}

.ya-entete__image {
	width: auto;
	height: var(--ya-espace-14);
	transition: height 0.2s ease;
}

.ya-entete.est-compact .ya-entete__image {
	height: var(--ya-espace-10);
}

.ya-entete__actions {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-2);
}

.ya-entete__contact {
	display: none;
}

.ya-entete__burger {
	min-height: 2.75rem;
	padding-inline: var(--ya-espace-3);
}

.ya-entete__burger .ya-icone {
	width: var(--ya-espace-6);
	height: var(--ya-espace-6);
}

.ya-entete__burger[aria-expanded="true"] .ya-entete__icone-ouvrir,
.ya-entete__burger[aria-expanded="false"] .ya-entete__icone-fermer {
	display: none;
}

/* Navigation principale (grand écran) */
.ya-nav {
	display: none;
}

.ya-nav__liste {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-1);
}

.ya-nav__item {
	position: relative;
}

.ya-nav__lien {
	display: inline-flex;
	align-items: center;
	gap: var(--ya-espace-1);
	padding: var(--ya-espace-2);
	border-radius: var(--ya-rayon-petit);
	color: var(--ya-couleur-texte);
	font-size: var(--ya-taille-nav);
	font-weight: 700;
	white-space: nowrap;
	transition: color 0.15s ease;
}

.ya-nav__lien:hover,
.ya-nav__lien.est-actif {
	color: var(--ya-couleur-accent-texte);
}

.ya-nav__lien.est-actif:not(.ya-nav__bouton) {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 8px;
}

.ya-sous-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 50;
	display: none;
	width: var(--ya-largeur-menu);
	padding: var(--ya-espace-2);
	border: 1px solid var(--ya-couleur-bordure);
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-fond);
	box-shadow: var(--ya-ombre-menu);
}

.ya-nav__bouton[aria-expanded="true"] + .ya-sous-menu {
	display: block;
}

.ya-sous-menu__tout,
.ya-sous-menu__lien {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-3);
	padding: var(--ya-espace-2) var(--ya-espace-3);
	border-radius: var(--ya-rayon-petit);
	transition: color 0.15s ease;
}

.ya-sous-menu__tout {
	font-weight: 700;
}

.ya-sous-menu__tout:hover,
.ya-sous-menu__lien:hover {
	background-color: var(--ya-couleur-surface);
}

/* Au survol, le titre glisse vers la droite ; le numéro reste en place. */
.ya-sous-menu__libelle {
	display: inline-block;
	transition: transform 0.2s ease;
}

.ya-sous-menu__tout:hover .ya-sous-menu__libelle,
.ya-sous-menu__lien:hover .ya-sous-menu__libelle {
	transform: translateX(10px);
}

@media (prefers-reduced-motion: reduce) {
	.ya-sous-menu__libelle {
		transition: none;
	}
}

.ya-sous-menu__tout:hover,
.ya-sous-menu__lien:hover,
.ya-sous-menu__lien:hover .ya-numero,
.ya-menu-mobile__sous-lien:hover,
.ya-menu-mobile__sous-lien:hover .ya-numero {
	color: var(--ya-couleur-primaire-texte);
}

/* Menu mobile */
.ya-menu-mobile {
	max-height: calc(100vh - 5rem);
	overflow-y: auto;
	border-top: 1px solid var(--ya-couleur-bordure);
	background-color: var(--ya-couleur-fond);
}

.ya-menu-mobile[hidden] {
	display: none;
}

.ya-menu-mobile__nav {
	display: flex;
	flex-direction: column;
	gap: var(--ya-espace-1);
	padding-block: var(--ya-espace-4);
}

.ya-menu-mobile__liste {
	display: flex;
	flex-direction: column;
	gap: var(--ya-espace-1);
}

.ya-menu-mobile__lien {
	display: block;
	padding: var(--ya-espace-3) var(--ya-espace-2);
	border-radius: var(--ya-rayon-petit);
	font-size: var(--ya-taille-lg);
	line-height: var(--ya-interligne-lg);
	font-weight: 700;
}

/* Sous-menu en accordéon : toute la ligne du titre est la zone de toucher. */
.ya-menu-mobile__resume {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ya-espace-3);
	cursor: pointer;
	list-style: none;
	user-select: none;
}

.ya-menu-mobile__resume::-webkit-details-marker {
	display: none;
}

.ya-menu-mobile__chevron {
	transition: transform 0.2s ease;
}

.ya-menu-mobile__accordeon[open] > .ya-menu-mobile__resume .ya-menu-mobile__chevron {
	transform: rotate(180deg);
}

.ya-menu-mobile__tout {
	font-weight: 700;
}

/* Pendant l’animation d’ouverture ou de fermeture (assets/js/site.js). */
.ya-menu-mobile__sous-liste.est-anime {
	overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.ya-menu-mobile__chevron {
		transition: none;
	}
}

.ya-menu-mobile__lien.est-actif,
.ya-menu-mobile__sous-lien.est-actif {
	color: var(--ya-couleur-accent-texte);
}

.ya-menu-mobile__sous-liste {
	margin: 0 0 var(--ya-espace-2) var(--ya-espace-3);
	padding-left: var(--ya-espace-4);
	border-left: 2px solid var(--ya-couleur-accent);
}

.ya-menu-mobile__sous-lien {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-3);
	padding: var(--ya-espace-3) var(--ya-espace-2);
	border-radius: var(--ya-rayon-petit);
}

.ya-menu-mobile__sous-lien.est-actif {
	font-weight: 700;
}

.ya-menu-mobile__contact {
	margin-top: var(--ya-espace-3);
}

@media (min-width: 640px) {
	.ya-entete__contact {
		display: inline-flex;
	}
}

@media (min-width: 1280px) {
	.ya-nav {
		display: flex;
		align-items: center;
	}

	.ya-nav__item--parent:hover .ya-sous-menu {
		display: block;
	}

	.ya-entete__burger,
	.ya-menu-mobile {
		display: none;
	}
}

@media (min-width: 1536px) {
	.ya-nav__lien {
		font-size: var(--ya-taille-nav-large);
	}
}

/* 6. Pied de page ---------------------------------------------------------- */

.ya-pied {
	margin-top: var(--ya-espace-24);
	border-top: 2px solid var(--ya-couleur-bordure-forte);
	background-color: var(--ya-couleur-fond);
}

.ya-pied__grille {
	display: grid;
	gap: var(--ya-espace-12);
	padding-block: var(--ya-espace-14);
}

.ya-pied__logo {
	width: auto;
	height: var(--ya-espace-16);
}

.ya-pied__texte {
	max-width: var(--ya-largeur-lecture);
	margin-top: var(--ya-espace-4);
	font-size: var(--ya-taille-bouton);
	line-height: var(--ya-interligne-bouton);
}

.ya-pied__liens,
.ya-pied__coordonnees {
	display: grid;
	gap: var(--ya-espace-2);
	margin-top: var(--ya-espace-4);
}

.ya-pied__coordonnees {
	gap: var(--ya-espace-3);
}

.ya-pied__lien:hover,
.ya-pied__legal a:hover {
	color: var(--ya-couleur-accent-texte);
}

.ya-pied__coordonnee {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-2);
	font-weight: 700;
}

.ya-pied__coordonnee:hover {
	color: var(--ya-couleur-primaire-texte);
}

.ya-pied__coordonnee .ya-icone {
	color: var(--ya-couleur-primaire-texte);
}

.ya-pied__coordonnee .ya-mono {
	font-size: var(--ya-taille-bouton);
	line-height: var(--ya-interligne-bouton);
}

.ya-pied__note {
	margin-top: var(--ya-espace-4);
	color: var(--ya-couleur-attenue);
	font-size: var(--ya-taille-petit);
	line-height: var(--ya-interligne-petit);
}

.ya-pied__bouton {
	width: 100%;
	margin-top: var(--ya-espace-5);
}

.ya-pied__bas {
	border-top: 1px solid var(--ya-couleur-bordure);
}

.ya-pied__bas-contenu {
	display: flex;
	flex-direction: column;
	gap: var(--ya-espace-3);
	padding-block: var(--ya-espace-6);
	font-size: var(--ya-taille-petit);
	line-height: var(--ya-interligne-petit);
}

.ya-pied__bas-contenu .ya-mono {
	font-size: var(--ya-taille-mono);
}

.ya-pied__legal {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ya-espace-2) var(--ya-espace-6);
}

@media (min-width: 768px) {
	.ya-pied__grille {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ya-pied__bas-contenu {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

@media (min-width: 1024px) {
	.ya-pied__grille {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* 7. Fil d'Ariane, article, 404 -------------------------------------------- */

.ya-fil-ariane {
	border-bottom: 1px solid var(--ya-couleur-bordure);
	background-color: var(--ya-couleur-surface);
}

.ya-fil-ariane__liste {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ya-espace-1) var(--ya-espace-2);
	padding-block: var(--ya-espace-3);
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	letter-spacing: 0.06em;
}

.ya-fil-ariane__etape {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-2);
}

.ya-fil-ariane__separateur {
	width: var(--ya-espace-4);
	height: var(--ya-espace-4);
	color: var(--ya-couleur-attenue);
}

.ya-fil-ariane__lien:hover {
	color: var(--ya-couleur-accent-texte);
}

.ya-fil-ariane__courant {
	color: var(--ya-couleur-accent-texte);
	font-weight: 700;
}

.ya-article__meta {
	flex-wrap: wrap;
}

.ya-article__titre {
	max-width: 56rem;
	margin-top: var(--ya-espace-4);
}

.ya-article__chapeau {
	max-width: var(--ya-largeur-lecture);
	margin-top: var(--ya-espace-5);
	font-size: var(--ya-taille-lg);
	line-height: var(--ya-interligne-lg);
}

.ya-article__media {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 9;
	margin-top: var(--ya-espace-10);
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-surface);
}

.ya-article__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ya-article__corps {
	display: grid;
	gap: var(--ya-espace-8);
	max-width: var(--ya-largeur-lecture);
	margin-top: var(--ya-espace-10);
}

.ya-article__intertitre {
	margin-bottom: var(--ya-espace-3);
	font-size: var(--ya-taille-xl);
	line-height: var(--ya-interligne-xl);
}

.ya-article__bouton {
	margin-top: var(--ya-espace-5);
}

.ya-article__partager {
	margin: var(--ya-espace-8) 0 var(--ya-espace-3);
	font-size: var(--ya-taille-lg);
	line-height: var(--ya-interligne-lg);
}

.ya-article__autres {
	margin-top: var(--ya-espace-16);
}

.ya-article__autres-titre {
	margin: var(--ya-espace-2) 0 var(--ya-espace-8);
	font-size: var(--ya-taille-2xl);
	line-height: var(--ya-interligne-2xl);
}

.ya-article__retour {
	margin-top: var(--ya-espace-12);
}

.ya-erreur {
	padding-block: var(--ya-espace-20);
}

.ya-erreur__titre {
	margin-top: var(--ya-espace-3);
}

.ya-erreur__texte {
	margin-top: var(--ya-espace-4);
	font-size: var(--ya-taille-lg);
	line-height: var(--ya-interligne-lg);
}

.ya-erreur__boutons {
	margin-top: var(--ya-espace-8);
}

@media (min-width: 768px) {
	.ya-erreur {
		padding-block: 7rem;
	}
}

/* 8. Formulaire (Contact Form 7) ------------------------------------------- */

.ya-formulaire {
	padding: var(--ya-espace-6);
	border: 1px solid var(--ya-couleur-bordure);
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-carte);
}

.ya-formulaire__grille {
	display: grid;
	gap: var(--ya-espace-5);
}

.ya-formulaire__etiquette,
.ya-formulaire legend {
	font-weight: 700;
}

.ya-formulaire__facultatif {
	color: var(--ya-couleur-attenue);
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	font-weight: 400;
	letter-spacing: 0.06em;
}

.ya-formulaire .wpcf7-form-control-wrap {
	display: block;
}

.ya-formulaire .wpcf7-text,
.ya-formulaire .wpcf7-email,
.ya-formulaire .wpcf7-tel,
.ya-formulaire .wpcf7-select,
.ya-formulaire .wpcf7-textarea {
	width: 100%;
	margin-top: var(--ya-espace-2);
	padding: var(--ya-espace-3) var(--ya-espace-4);
	border: 1px solid var(--ya-couleur-bordure);
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-fond);
	color: var(--ya-couleur-texte);
	font-size: var(--ya-taille-bouton);
	line-height: var(--ya-interligne-bouton);
}

.ya-formulaire .wpcf7-textarea::placeholder {
	color: var(--ya-couleur-attenue);
}

.ya-formulaire fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

.ya-formulaire .wpcf7-radio {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ya-espace-3);
	margin-top: var(--ya-espace-3);
}

.ya-formulaire .wpcf7-list-item {
	margin: 0;
}

.ya-formulaire .wpcf7-radio label {
	display: flex;
	align-items: center;
	gap: var(--ya-espace-3);
	padding: var(--ya-espace-3) var(--ya-espace-4);
	border: 1px solid var(--ya-couleur-bordure);
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-fond);
	cursor: pointer;
}

.ya-formulaire input[type="radio"],
.ya-formulaire input[type="checkbox"] {
	width: var(--ya-espace-4);
	height: var(--ya-espace-4);
	margin: 0;
	accent-color: var(--ya-couleur-accent);
}

.ya-formulaire__aide {
	display: none;
	margin-top: var(--ya-espace-3);
	color: var(--ya-couleur-attenue);
	font-size: var(--ya-taille-petit);
	line-height: 1.625;
}

.ya-formulaire__profil:has(input[value="professionnel"]:checked) .ya-formulaire__aide {
	display: block;
}

.ya-formulaire .wpcf7-acceptance label {
	display: flex;
	align-items: flex-start;
	gap: var(--ya-espace-3);
	cursor: pointer;
}

.ya-formulaire .wpcf7-acceptance input {
	margin-top: var(--ya-espace-1);
}

.ya-formulaire .wpcf7-acceptance a {
	color: var(--ya-couleur-primaire-texte);
	font-weight: 700;
}

.ya-formulaire__mention {
	margin-top: var(--ya-espace-5);
	color: var(--ya-couleur-attenue);
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	letter-spacing: 0.06em;
}

.ya-formulaire .wpcf7-submit {
	width: 100%;
	margin-top: var(--ya-espace-4);
	border: 0;
}

.ya-formulaire .wpcf7-not-valid-tip {
	display: block;
	margin-top: var(--ya-espace-2);
	color: var(--ya-couleur-primaire-texte);
	font-size: var(--ya-taille-petit);
	line-height: var(--ya-interligne-petit);
	font-weight: 700;
}

.ya-formulaire .wpcf7-response-output {
	margin: var(--ya-espace-5) 0 0;
	padding: var(--ya-espace-4);
	border-left: 4px solid var(--ya-couleur-accent);
	border-radius: var(--ya-rayon-carte);
	background-color: var(--ya-couleur-surface);
}

.ya-formulaire.init .wpcf7-response-output,
.ya-formulaire.resetting .wpcf7-response-output,
.ya-formulaire.submitting .wpcf7-response-output,
.ya-formulaire .wpcf7-response-output:empty {
	display: none;
}

.ya-formulaire.invalid .wpcf7-response-output,
.ya-formulaire.failed .wpcf7-response-output {
	border-left-color: var(--ya-couleur-primaire);
}

.ya-formulaire .wpcf7-spinner {
	display: none;
}

.ya-formulaire.submitting .wpcf7-spinner {
	display: inline-block;
}

@media (min-width: 640px) {
	.ya-formulaire .wpcf7-submit {
		width: auto;
	}
}

@media (min-width: 768px) {
	.ya-formulaire {
		padding: var(--ya-espace-8);
	}

	.ya-formulaire__grille {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ya-formulaire__large {
		grid-column: span 2 / span 2;
	}
}

/* 9. Compléments partagés -------------------------------------------------- */

.ya-titre-suite {
	font-size: var(--ya-taille-suite-titre);
}

.ya-puce {
	color: var(--ya-couleur-accent-texte);
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
	letter-spacing: 0.06em;
}

.ya-liste-puces > li,
.ya-texte-riche--puces li {
	display: flex;
	gap: var(--ya-espace-3);
}

/* Bandeau du surtitre rouge selon le fond qui le porte. */
.ya-sur-surface .ya-surtitre--rouge,
.is-style-beige .ya-sur-surface .ya-surtitre--rouge {
	background-image: var(--ya-bande-sur-surface);
}

.ya-sur-fond .ya-surtitre--rouge,
.is-style-beige .ya-sur-fond .ya-surtitre--rouge {
	background-image: var(--ya-bande-sur-fond);
}

.ya-apercu-vide {
	padding: var(--ya-espace-6);
	border: 2px dashed var(--ya-couleur-bordure-forte);
	border-radius: var(--ya-rayon-carte);
	color: var(--ya-couleur-attenue);
	font-family: var(--ya-police-mono);
	font-size: var(--ya-taille-mono);
}

/* ==========================================================================
   Blocs natifs de Gutenberg (contenu libre) : mêmes largeurs, textes et boutons
   que nos sections. Racine : .ya-contenu (page.php, home.php) ; éditeur :
   .is-root-container ; sections libres : groupes de style « Section ».
   ========================================================================== */

/* Sections pleine largeur (les nôtres et les groupes « Section ») : sans l'écart entre blocs ;
   entre une section et des blocs natifs posés hors section, l'espacement d'une section. */
.ya-contenu > .alignfull,
.is-root-container > .alignfull {
	margin-block: 0;
}

.ya-contenu > .alignfull + :not(.alignfull),
.ya-contenu > :not(.alignfull) + .alignfull,
.is-root-container > .alignfull + :not(.alignfull),
.is-root-container > :not(.alignfull) + .alignfull {
	margin-top: var(--ya-espace-16);
}

/* Page qui commence ou finit par des blocs natifs hors section. */
.ya-contenu > :first-child:not(.alignfull) {
	margin-top: var(--ya-espace-16);
}

.ya-contenu > :last-child:not(.alignfull) {
	margin-bottom: var(--ya-espace-16);
}

@media (min-width: 768px) {
	.ya-contenu > :first-child:not(.alignfull) {
		margin-top: var(--ya-espace-section);
	}

	.ya-contenu > :last-child:not(.alignfull) {
		margin-bottom: var(--ya-espace-section);
	}

	.ya-contenu > .alignfull + :not(.alignfull),
	.ya-contenu > :not(.alignfull) + .alignfull,
	.is-root-container > .alignfull + :not(.alignfull),
	.is-root-container > :not(.alignfull) + .alignfull {
		margin-top: var(--ya-espace-section);
	}
}

/* Paragraphes, listes et citations : 68ch au plus, calés à gauche comme dans nos blocs. */
:where(.ya-contenu, .is-root-container, .wp-block-group.is-layout-constrained) > :is(p, ul, ol, blockquote):not([class*="has-text-align-"], .has-background, .is-style-surtitre) {
	padding-inline-end: max(0px, min(100%, var(--wp--style--global--content-size)) - var(--ya-largeur-lecture));
}

:where(.ya-contenu, .is-root-container, .wp-block-group) > :is(p, ul, ol, h2, h3, h4) a {
	color: var(--ya-couleur-primaire-texte);
	font-weight: 700;
}

:where(.ya-contenu, .is-root-container, .wp-block-group) > :is(p, ul, ol, h2, h3, h4) a:hover {
	text-decoration: underline;
}

:where(.ya-contenu, .is-root-container, .wp-block-group) > .wp-block-list {
	padding-left: 1.25em;
	list-style: disc;
}

:where(.ya-contenu, .is-root-container, .wp-block-group) > ol.wp-block-list {
	list-style: decimal;
}

:where(.ya-contenu, .is-root-container, .wp-block-group) > .wp-block-list li + li {
	margin-top: var(--ya-espace-2);
}

:where(.ya-contenu, .is-root-container, .wp-block-group) > .wp-block-quote {
	padding-left: var(--ya-espace-5);
	border-left: 3px solid var(--ya-couleur-accent);
	font-family: var(--ya-police-titres);
	font-size: var(--ya-taille-lg);
	line-height: var(--ya-interligne-lg);
}

:where(.ya-contenu, .is-root-container, .wp-block-group) .wp-block-image img {
	border-radius: var(--ya-rayon-carte);
}

:where(.ya-contenu, .is-root-container, .wp-block-group) .wp-block-image figcaption {
	color: var(--ya-couleur-attenue);
	font-size: var(--ya-taille-petit);
	line-height: var(--ya-interligne-petit);
}

/* Paragraphe de style « Surtitre » : calé sur le bord gauche du contenu (la mise en page de WordPress centre). */
:where(.ya-contenu, .is-root-container, .wp-block-group.is-layout-constrained) > p.is-style-surtitre {
	margin-left: max(0px, (100% - var(--wp--style--global--content-size)) / 2) !important;
}

.is-style-surtitre + :is(h1, h2, h3) {
	margin-top: var(--ya-espace-3);
}

/* Boutons natifs : boutons du thème (plein = rouge, « Contour » = contour). */
.wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--ya-espace-12);
	padding: 0 1.4rem;
	border: 0;
	border-radius: var(--ya-rayon-pastille);
	background-color: var(--ya-couleur-primaire);
	color: var(--ya-couleur-blanc);
	font-size: var(--ya-taille-bouton);
	font-weight: 700;
	line-height: var(--ya-interligne-serre);
	transition:
		background-color 0.15s ease,
		transform 0.15s ease;
}

.wp-block-button .wp-block-button__link:hover {
	background-color: var(--ya-couleur-primaire-fonce);
	transform: translateY(-1px);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 2px solid var(--ya-couleur-bordure-forte);
	background-color: transparent;
	color: var(--ya-couleur-texte);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background-color: var(--ya-couleur-surface);
}

/* Groupes de style « Section » : fond et espacement vertical de nos sections. */
.wp-block-group.is-style-section-claire,
.wp-block-group.is-style-section-beige {
	padding-block: var(--ya-espace-16);
}

.wp-block-group.is-style-section-beige {
	background-color: var(--ya-couleur-surface);
}

/* Section en grille, rangée ou pile (mise en page non contrainte) : contenu aligné sur celui des sections. */
:where(.ya-contenu, .is-root-container) > .wp-block-group.alignfull:is(.is-style-section-claire, .is-style-section-beige):not(.is-layout-constrained) {
	padding-inline: calc(var(--wp--style--root--padding-left) + max(0px, (100% - var(--wp--style--global--content-size)) / 2));
}

@media (min-width: 768px) {
	.wp-block-group.is-style-section-claire,
	.wp-block-group.is-style-section-beige {
		padding-block: var(--ya-espace-section);
	}
}
