/*
Theme Name: Héméra Child
Theme URI: https://hemera-sportsante.fr
Description: Thème enfant de Twenty Twenty-Five pour Héméra Sport Santé pour Tous.
Author: Arneys Studio
Author URI: https://www.arneystudio.fr
Template: twentytwentyfive
Version: 13.5
Requires at least: 6.6
Tested up to: 7.1
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hemera-child
*/

/* Aucun !important. Si une règle ne s'applique pas, le sélecteur est en cause.
   Les valeurs de l'en-tête, du menu et du pied viennent de la maquette validée,
   relevées dans son code, pas reconstituées d'après son apparence. */

/* ==================================================================
   1. EN-TÊTE
   ================================================================== */

.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--position-offset, 0px);
	z-index: 800;
	background: var(--wp--preset--color--blanc);
	border-bottom: 1px solid rgba(31, 41, 55, 0.14);
}

/* Rang 1 : liens utilitaires et réservation. */
.hemera-rang1 {
	font-family: var(--wp--preset--font-family--display);
	font-size: 13px;
}

.hemera-rang1 .wp-block-navigation {
	gap: 22px;
}

.hemera-rang1 .wp-block-navigation a {
	color: var(--wp--preset--color--noir);
	text-decoration: none;
	font-weight: 500;
	min-height: 40px;
}

.hemera-rang1 .wp-block-navigation a:hover {
	color: var(--wp--preset--color--bleu-profond);
}

.hemera-rang1 .wp-block-button__link {
	padding: 6px 15px;
	border-radius: 4px;
	font-weight: 700;
	min-height: 32px;
}

/* Sous 860 px, la barre utilitaire garde le seul bouton de réservation.
   Les quatre liens tiennent sur deux lignes à cette largeur, et ils sont
   déjà présents dans le menu principal et dans le pied de page. */
@media (max-width: 860px) {
	.hemera-rang1 .wp-block-navigation {
		display: none;
	}

	.hemera-rang1 > .wp-block-group {
		justify-content: center;
	}

	.hemera-rang1 .wp-block-button__link {
		padding: 5px 14px;
		font-size: 12.5px;
		min-height: 30px;
	}
}

/* Rang 2 : identité et navigation principale. */
.hemera-rang2 > .wp-block-group {
	gap: 28px;
	min-height: 88px;
}

.hemera-rang2 .wp-block-site-logo img {
	height: 58px;
	width: auto;
}

.hemera-rang2 .wp-block-site-title {
	font-family: var(--wp--preset--font-family--display);
	font-size: 21px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.1;
	margin: 0;
}

.hemera-rang2 .wp-block-site-title a {
	color: var(--wp--preset--color--noir);
	text-decoration: none;
}

.hemera-rang2 .wp-block-site-tagline {
	font-size: 12px;
	color: var(--wp--preset--color--gris);
	letter-spacing: 0.09em;
	text-transform: uppercase;
	margin: 0;
}

/* ==================================================================
   2. NAVIGATION PRINCIPALE
   ================================================================== */

.hemera-rang2 .wp-block-navigation {
	gap: 4px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 14.5px;
	font-weight: 500;
}

.hemera-rang2 .wp-block-navigation .wp-block-navigation-item__content {
	color: var(--wp--preset--color--noir);
	text-decoration: none;
	padding: 10px 13px;
	border-radius: 4px;
	min-height: 44px;
}

.hemera-rang2 .wp-block-navigation .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--bleu-brume);
}

/* Page courante. La classe est posée par le mu-plugin : les liens étant
   relatifs, WordPress ne les rattache à aucune page. Le filet suit
   l'arrondi du lien, d'où son aspect légèrement incurvé aux extrémités. */
.hemera-rang2 .wp-block-navigation .hemera-actif {
	color: var(--wp--preset--color--bleu-profond);
	box-shadow: inset 0 -3px 0 var(--wp--preset--color--orange);
}

/* Sous-menus. */
.hemera-rang2 .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 6px;
	min-width: 238px;
	padding: 6px;
	box-shadow: 0 12px 28px rgba(31, 41, 55, 0.13);
}

.hemera-rang2 .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-weight: 400;
	font-size: 14px;
	padding: 8px 11px;
}

.hemera-rang2 .wp-block-navigation__submenu-container .hemera-actif {
	color: var(--wp--preset--color--orange-texte);
	font-weight: 600;
	background: var(--wp--preset--color--bleu-brume);
	box-shadow: none;
}

/* Sous 860 px, la maquette réduit l'identité et bascule en menu déroulant.
   Le bloc Navigation gère le déroulant lui-même ; on reprend les tailles. */
@media (max-width: 860px) {
	.hemera-rang2 .wp-block-site-logo img {
		height: 46px;
	}

	.hemera-rang2 .wp-block-site-title {
		font-size: 18px;
	}

	.hemera-rang2 > .wp-block-group {
		min-height: 0;
	}
}

/* Sous-titre du bandeau, produit par [hemera_soustitre]. */
.hemera-soustitre {
	font-size: var(--wp--preset--font-size--intro);
	color: var(--wp--preset--color--blanc);
	margin: 0;
}

/* Les sections pleine largeur se touchent : l'espacement de bloc global
   laissait une bande blanche entre chaque fond coloré. L'air vient du
   remplissage intérieur des sections, pas de marges entre elles.

   Deux structures à couvrir. Sur les pages, les sections sont dans le
   contenu. Sur les gabarits du blog et de l'article, elles sont
   directement dans le <main> : la première règle ne les atteignait pas,
   d'où la bande blanche au-dessus du bandeau final. */
.wp-block-post-content > .alignfull,
.wp-block-post-content > .alignwide,
main.wp-block-group > .alignfull,
main.wp-block-group > .alignwide {
	margin-block: 0;
}

.wp-block-post-content > :last-child {
	margin-block-end: 0;
}

.wp-site-blocks > footer.wp-block-template-part {
	margin-block-start: 0;
}

/* Les grandes zones de la page se touchent : en-tête, fil d'Ariane,
   contenu et pied. L'espacement de bloc global glissait une bande
   blanche entre chacune. */
.wp-site-blocks > * {
	margin-block-start: 0;
}

.wp-site-blocks > main.wp-block-group {
	margin-block-end: 0;
}

/* ==================================================================
   3. FIL D'ARIANE
   ================================================================== */

/* Sélecteur à deux classes : à spécificité égale avec la règle globale
   de WordPress, c'est l'ordre de chargement qui tranchait. */
.wp-site-blocks > .hemera-fil {
	margin-block: 0;
}

.hemera-fil > * {
	margin-block: 0;
}

.hemera-fil {
	font-size: var(--wp--preset--font-size--petit);
}

/* ==================================================================
   4. PIED DE PAGE
   ================================================================== */

.wp-site-blocks > footer.wp-block-template-part {
	font-size: 14.5px;
}

/* Vignettes de certification du pied de page. */
.hemera-certifs {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
}

.hemera-certifs img {
	width: 52px;
	height: auto;
	border-radius: 6px;
}

@media (max-width: 420px) {
	.hemera-certifs img {
		width: 44px;
	}
}

.hemera-liste-pied {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hemera-liste-pied li {
	margin: 0 0 7px;
}

.hemera-liste-pied a {
	display: block;
	text-decoration: none;
	padding: 6px 0;
}

.hemera-liste-pied a:hover,
.hemera-liste-pied a:focus-visible {
	color: var(--wp--preset--color--jaune);
	text-decoration: underline;
}

/* ==================================================================
   5. COMPOSANTS DE LA MAQUETTE
   Valeurs relevées dans le CSS de la maquette validée.
   ================================================================== */

/* En-tête visuel : texte à gauche, image à droite sur 46 % de la largeur,
   comme le hero-split de la maquette. */
.hemera-hero {
	position: relative;
	overflow: hidden;
}

.hemera-hero .hemera-hero-grille {
	gap: 0;
	min-height: 300px;
	margin-block: 0;
}

/* Les largeurs 54 / 46 sont portées par les attributs du bloc Colonnes,
   pas par ce fichier : Gutenberg écrit le flex-basis en style en ligne,
   et rien ici ne doit avoir à le forcer. */
.hemera-hero-txt {
	padding: 52px 48px 52px 0;
}

.hemera-hero-img {
	align-self: stretch;
}

/* Au-delà de 900 px, l'image sort du conteneur et touche le bord droit
   de la fenêtre, comme dans la maquette. Elle quitte donc le flux des
   colonnes : le texte garde sa largeur, l'image occupe la droite. */
@media (min-width: 901px) {
	.hemera-hero-img {
		position: absolute;
		top: 0;
		bottom: 0;
		/* Le groupe porte le remplissage latéral du site : une position
		   absolue se cale sur la boîte intérieure. On le récupère pour
		   que l'image touche vraiment le bord de la fenêtre. */
		right: calc(var(--wp--style--root--padding-right) * -1);
		width: calc(46% + var(--wp--style--root--padding-right));
		padding: 0;
	}

	.hemera-hero-img .wp-block-image,
	.hemera-hero-img figure,
	.hemera-hero-img img {
		height: 100%;
	}

	/* Dégradé sur le bord gauche de l'image, pour fondre la coupure. */
	.hemera-hero::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		right: 46%;
		width: 180px;
		background: linear-gradient(90deg, var(--wp--preset--color--noir), transparent);
		z-index: 1;
		pointer-events: none;
	}

	/* Seule la colonne de texte est positionnée : si le bloc Colonnes
	   l'était, l'image s'y calerait et ne pourrait pas dépasser sa largeur. */
	.hemera-hero-txt {
		position: relative;
		z-index: 2;
	}
}

.hemera-hero-img .wp-block-post-featured-image,
.hemera-hero-img figure {
	height: 100%;
	margin: 0;
}

.hemera-hero-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Le sujet est en bas de l'image : on cadre dessus, pas au centre. */
	object-position: center bottom;
}

.hemera-hero h1 {
	color: var(--wp--preset--color--blanc);
	margin: 0 0 10px;
	font-size: clamp(1.65rem, 2.9vw, 2.35rem);
	text-wrap: balance;
}

/* Sous-titre du bandeau. */
.hemera-hero-sous {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 15.5px;
	color: rgba(255, 255, 255, 0.86);
	margin: 0;
}

.hemera-hero-txt > p {
	color: rgba(255, 255, 255, 0.82);
}

.hemera-hero-img .wp-block-image,
.hemera-hero-img figure {
	height: 100%;
	margin: 0;
}

/* Trait manuscrit aligné à gauche, sous le sous-titre du bandeau. */
.hemera-trait-g {
	display: block;
	width: 74px;
	height: 12px;
	margin: 18px 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M3 8.4c26-3.6 58-5.4 96-5.4 34 0 66 1.4 98 4.2' fill='none' stroke='%23E55A00' stroke-width='3.2' stroke-linecap='round'/%3E%3Cpath d='M14 11c30-2.4 60-3.4 92-3.2' fill='none' stroke='%23E55A00' stroke-width='1.6' stroke-linecap='round' opacity='.5'/%3E%3C/svg%3E") no-repeat;
	background-size: 100% 100%;
}

/* Sous 782 px, le bloc Colonnes empile déjà tout seul et neutralise
   ses propres flex-basis. On ne reprend que l'espacement et la hauteur. */
@media (max-width: 900px) {
	/* L'image passe au-dessus du texte : elle accroche le regard avant
	   le titre, comme sur la maquette. */
	.hemera-hero-txt {
		/* 74 px = les 44 px repris par le trustbar, plus 30 px d'air.
		   Le chevauchement tombe ainsi dans le remplissage, jamais
		   sur le sous-titre. */
		padding: 32px 0 74px;
		order: 2;
	}

	/* L'image touche les deux bords. On agit sur l'image elle-même :
	   WordPress force flex-basis: 100% sur les colonnes empilées, ce qui
	   prime sur toute largeur posée sur la colonne. */
	.hemera-hero-img {
		padding: 0;
	}

	.hemera-hero-img img {
		height: 200px;
		width: 100vw;
		max-width: 100vw;
		margin-inline: calc(50% - 50vw);
	}
}

/* Titre de section avec icône, dans un carré arrondi crème. */
/* Le conteneur garde la largeur et le centrage des blocs contraints :
   la disposition en ligne se fait à l'intérieur, sinon le titre perd
   son alignement sur le reste du contenu. */
.hemera-titre-ico {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 8px;
}

.hemera-titre-ico > span {
	flex: 0 0 40px;
	height: 40px;
	border-radius: 11px;
	background: #FFF1E4;
	color: var(--wp--preset--color--orange-texte);
	display: flex;
	align-items: center;
	justify-content: center;
}

.hemera-titre-ico svg {
	width: 21px;
	height: 21px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.hemera-titre-ico h2 {
	margin: 0;
}

.hemera-titre-ico em {
	font-style: normal;
	font-weight: 400;
	color: var(--wp--preset--color--gris);
}

/* Icône ronde des cartes et blocs d'information. */
.hemera-ico {
	flex: 0 0 42px;
	height: 42px;
	border-radius: 11px;
	background: var(--wp--preset--color--bleu-brume);
	color: var(--wp--preset--color--bleu-profond);
	display: flex;
	align-items: center;
	justify-content: center;
}

.hemera-ico svg {
	width: 22px;
	height: 22px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Planning : une carte par jour, en-tête bleu, horaires orange.
   Les cartes s'ajustent à leur contenu, elles ne s'étirent pas
   à la hauteur de la plus longue. Gouttière de 14 px, comme la maquette. */
.hemera-planning {
	align-items: flex-start;
	gap: 14px;
}

.hemera-planning .wp-block-column {
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 12px;
	overflow: hidden;
	padding: 0;
}

.hemera-planning .wp-block-column > .wp-block-heading {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 15px;
	margin: 0;
	padding: 12px 16px;
	/* Bleu profond et non le bleu Héméra : blanc sur #00849B donne 4,40,
	   sous le seuil de 4,5. L'écart visuel est minime, l'écart légal non. */
	background: var(--wp--preset--color--bleu-profond);
	color: var(--wp--preset--color--blanc);
	letter-spacing: 0.02em;
}

.hemera-planning .hemera-creneaux {
	margin: 0;
	padding: 0;
}

.hemera-planning .hemera-creneaux li {
	padding: 12px 16px;
	border-bottom: 1px solid rgba(31, 41, 55, 0.14);
	border-top: 0;
	font-size: 15px;
	line-height: 1.4;
	margin: 0;
}

.hemera-planning .hemera-creneaux li:last-child {
	border-bottom: 0;
}

.hemera-planning .hemera-creneaux li strong {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 13px;
	color: var(--wp--preset--color--orange-texte);
	letter-spacing: 0.02em;
	margin-bottom: 2px;
}

/* Étiquette d'un créneau : maternité, sport adapté. */
.hemera-tag {
	font-style: normal;
	font-family: var(--wp--preset--font-family--display);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	background: var(--wp--preset--color--bleu-brume);
	color: var(--wp--preset--color--bleu-profond);
	padding: 2px 7px;
	border-radius: 3px;
	white-space: nowrap;
}

/* Pastille ronde de l'appel à l'action. */
.hemera-cta-ico {
	width: 62px;
	height: 62px;
	border-radius: 50%;
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--orange-texte);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
}

.hemera-cta-ico svg {
	width: 26px;
	height: 26px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Fonds de section. */
.hemera-fond-brume {
	background: linear-gradient(180deg, #F4F9FC, #E9F2F8);
}

/* Valeurs de la maquette. Le blanc franc posé ici auparavant était
   un choix esthétique de ma part, pas une contrainte : la maquette
   demande un dégradé bleu très pâle, c'est elle qui fait foi. */
/* Couleur réservée au bandeau final, identique sur toutes les pages
   et employée nulle part ailleurs. Ce n'est pas du noir : le noir du
   site, #1F2937, c'est le pied de page. La classe s'appelait
   hemera-fond-noir, ce qui était faux.

   Les sections courantes n'ont que deux fonds, le blanc et la brume,
   alternés. Trois teintes claires cohabitaient auparavant — brume,
   pale et froid — trop proches pour que l'écart se lise comme une
   intention. */
.hemera-fond-cta {
	background: linear-gradient(155deg, #0B4351, var(--wp--preset--color--cta-fond) 60%, #0A3B47);
	color: var(--wp--preset--color--blanc);
}

/* Surtitre : petites capitales orange précédées d'un tiret. */
/* Reste un bloc : inline-flex casserait le centrage du conteneur contraint. */
.hemera-eyebrow {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 11.5px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--wp--preset--color--orange-texte);
	font-weight: 700;
	margin: 0 0 0.9em;
}

.hemera-eyebrow::before {
	content: "";
	display: inline-block;
	width: 22px;
	height: 2px;
	border-radius: 1px;
	background: currentColor;
	vertical-align: middle;
	margin-right: 9px;
}

/* Trait manuscrit orange, sous les titres d'appel à l'action. */
.hemera-trait {
	display: block;
	width: 190px;
	max-width: 64%;
	height: 14px;
	margin: 6px auto 20px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M3 8.4c26-3.6 58-5.4 96-5.4 34 0 66 1.4 98 4.2' fill='none' stroke='%23E55A00' stroke-width='3.4' stroke-linecap='round'/%3E%3Cpath d='M14 11c30-2.4 60-3.4 92-3.2' fill='none' stroke='%23E55A00' stroke-width='1.6' stroke-linecap='round' opacity='.55'/%3E%3C/svg%3E") no-repeat;
	background-size: 100% 100%;
}

/* Listes à coche orange. */
.hemera-liste {
	list-style: none;
	padding: 0;
	margin: 0 0 1.1em;
}

.hemera-liste li {
	padding-left: 28px;
	position: relative;
	margin-bottom: 9px;
}

.hemera-liste li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: var(--wp--preset--color--orange);
	font-weight: 700;
}

.hemera-fond-cta .hemera-liste li::before {
	color: var(--wp--preset--color--jaune);
}

/* Citations : carte blanche avec un guillemet ouvrant en filigrane. */
.wp-block-quote {
	position: relative;
	margin: 0;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-left: 1px solid rgba(31, 41, 55, 0.07);
	border-radius: 16px;
	padding: 30px 24px 22px;
	font-size: 15.5px;
	box-shadow: 0 1px 2px rgba(31, 41, 55, 0.04), 0 8px 24px -12px rgba(31, 41, 55, 0.14);
}

.wp-block-quote::before {
	content: "\201C";
	position: absolute;
	top: 0.04em;
	left: 18px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 3.4rem;
	line-height: 1;
	color: var(--wp--preset--color--orange);
	opacity: 0.28;
}

.wp-block-quote cite {
	display: block;
	margin-top: 11px;
	font-style: normal;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 14px;
	color: var(--wp--preset--color--bleu-profond);
}

/* Coordonnée mise en avant sur la page Contact. */
.hemera-contact-fort a {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.2rem;
}

/* Cartes « besoin » : image en bas, icône colorée, lien en pied.
   La couleur d'accent se pose par variable, carte par carte. */
.hemera-besoins {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
}

@media (max-width: 1000px) {
	.hemera-besoins {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.hemera-besoins {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-besoin {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--blanc);
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-left: 4px solid var(--acc, var(--wp--preset--color--orange));
	box-shadow: var(--wp--preset--shadow--carte);
	transition: transform 0.22s cubic-bezier(0.2, 0.7, 0.3, 1), box-shadow 0.22s;
}

.hemera-besoin:hover {
	transform: translateY(-4px);
	box-shadow: var(--wp--preset--shadow--carte-survol);
}

@media (prefers-reduced-motion: reduce) {
	.hemera-besoin {
		transition: none;
	}

	.hemera-besoin:hover {
		transform: none;
	}
}

.hemera-besoin-txt {
	padding: 24px 24px 20px;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.hemera-besoin h3 {
	font-size: 1.15rem;
	line-height: 1.25;
	margin: 0 0 0.5em;
	color: var(--wp--preset--color--noir);
}

.hemera-besoin p {
	margin: 0 0 1em;
	font-size: 14.5px;
}

.hemera-besoin-prix {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--acc, var(--wp--preset--color--orange-texte));
}

.hemera-besoin a {
	margin-top: auto;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 14px;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 44px;
	color: var(--acc, var(--wp--preset--color--orange-texte));
}

.hemera-besoin a:hover,
.hemera-besoin a:focus-visible {
	text-decoration: underline;
}

.hemera-besoin-ico {
	width: 52px;
	height: 52px;
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 18px;
	background: var(--tin, #FFF1E4);
	color: var(--acc, var(--wp--preset--color--orange-texte));
}

.hemera-besoin-ico svg {
	width: 24px;
	height: 24px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.hemera-besoin-img {
	width: 100%;
	height: 140px;
	object-fit: cover;
	display: block;
	margin: 0;
}

/* Bandeau des certifications, en chevauchement sous le bandeau visuel.
   Le décalage porte sur le groupe : c'est lui qui est dans le flux de la
   page, le div intérieur n'y peut rien. */
.wp-block-post-content > .hemera-trustbar {
	position: relative;
	z-index: 5;
	margin-block-start: -44px;
}

.hemera-certif-bandeau {
	position: relative;
	z-index: 5;
	margin: 0 auto;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-radius: 16px;
	box-shadow: 0 10px 34px -14px rgba(31, 41, 55, 0.26);
	padding: 20px 26px;
	display: flex;
	align-items: center;
	gap: 26px;
	flex-wrap: wrap;
}

.hemera-certif-bandeau > img {
	flex: 0 0 58px;
	width: 58px;
	height: auto;
	margin: 0;
	border-radius: 9px;
}

.hemera-certif-txt {
	flex: 1 1 240px;
	min-width: 0;
}

.hemera-certif-txt p {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
}

.hemera-certif-txt p + p {
	font-family: var(--wp--preset--font-family--texte);
	font-weight: 400;
	font-size: 13.5px;
	color: var(--wp--preset--color--gris);
	margin-top: 3px;
}

.hemera-certif-bandeau .hemera-certifs {
	flex: 0 0 auto;
	gap: 14px;
}

/* Sous 900 px, les badges passent à la ligne et s'étalent. */
@media (max-width: 900px) {
	.hemera-certif-bandeau .hemera-certifs {
		flex: 1 1 100%;
		justify-content: space-between;
		gap: 8px;
	}
}

/* Sous 600 px, le remplissage de la carte est repris : à 320 px les cinq
   badges de 44 px et leurs quatre écarts demandent 252 px, et 26 px de
   remplissage de chaque côté n'en laissaient que 236. La rangée débordait. */
@media (max-width: 600px) {
	.hemera-certif-bandeau {
		padding: 18px 16px;
		gap: 16px;
	}
}

/* Les liens dans le texte prennent la couleur des liens du thème,
   bleu profond, illisible sur un fond sombre de la même famille.
   Ils passent au jaune : 10,47 sur le bandeau final, 10,47 sur le
   bandeau visuel. */
.hemera-fond-cta :where(p, li) a,
.hemera-hero :where(p, li) a {
	color: var(--wp--preset--color--jaune);
}

/* Cartes blanches. */
/* Les quatre autres composants de carte — .hemera-cc, .hemera-besoin,
   .hemera-spe et les colonnes du planning — sont déjà des conteneurs
   flex en colonne, et leur dernier élément se cale en bas. .hemera-carte
   était la seule à ne pas le faire : sur une section où une carte finit
   par un lien et les autres par un paragraphe, le lien remontait contre
   son texte au lieu de s'aligner sur le pied des cartes voisines. */
/* Pas de height: 100% ici. Une colonne ou une cellule de grille ne
   s'étire à la hauteur de ses voisines que si sa hauteur reste « auto ».
   Poser 100 % la rend définie, annule l'étirement, et chaque carte
   retombe sur la hauteur de son propre contenu — c'est ce qui
   désalignait « Ce qui est inclus ». */
.hemera-carte {
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-radius: 16px;
	padding: 26px;
	box-shadow: var(--wp--preset--shadow--carte);
	transition: transform 0.22s cubic-bezier(0.2, 0.7, 0.3, 1), box-shadow 0.22s;
}

.hemera-carte:hover {
	transform: translateY(-4px);
	box-shadow: var(--wp--preset--shadow--carte-survol);
}

/* Le mouvement est supprimé pour qui l'a demandé dans son système. */
@media (prefers-reduced-motion: reduce) {
	.hemera-carte {
		transition: none;
	}

	.hemera-carte:hover {
		transform: none;
	}
}

/* Le lien ou la mention de fin se cale en bas, comme sur .hemera-spe.
   Le :not(:first-child) protège les cartes qui ne contiennent qu'un
   seul paragraphe : rien à repousser dans ce cas. */
.hemera-carte > :last-child {
	margin-bottom: 0;
}

.hemera-carte > p:last-child:not(:first-child) {
	margin-top: auto;
	padding-top: 12px;
}

/* Une carte posée sur un bloc Colonne s'étire à la hauteur de la rangée.
   Explicite, parce que WordPress laisse parfois traîner un
   align-self hérité d'un ancien réglage d'alignement vertical. */
.wp-block-column.hemera-carte {
	align-self: stretch;
}

/* Cinq cartes de cours collectifs, produites par [hemera_cartes]. */
.hemera-cartes {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 14px;
	align-items: stretch;
	max-width: none;
}

@media (max-width: 1100px) {
	.hemera-cartes {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 760px) {
	.hemera-cartes {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 480px) {
	.hemera-cartes {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-tarif {
	position: relative;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 14px;
	padding: 22px 18px;
	display: flex;
	flex-direction: column;
}

.hemera-tarif .hemera-liste {
	margin: auto 0 0;
}

.hemera-tarif .hemera-liste li {
	font-size: 13.5px;
	margin-bottom: 5px;
	padding-left: 22px;
}

.hemera-tarif-quand {
	font-size: 13.5px;
	color: var(--wp--preset--color--gris);
	line-height: 1.4;
	min-height: 38px;
	margin: 0 0 12px;
	padding-bottom: 12px;
	border-bottom: 1px solid rgba(31, 41, 55, 0.14);
}

.hemera-tarif-nom {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1rem;
	margin: 0 0 8px;
	line-height: 1.2;
}

.hemera-tarif-nom span {
	display: block;
	font-weight: 400;
	font-size: 13px;
	color: var(--wp--preset--color--gris);
}

.hemera-tarif-prix {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.75rem;
	color: var(--wp--preset--color--bleu-profond);
	margin: 0;
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.hemera-tarif-prix small {
	font-family: var(--wp--preset--font-family--texte);
	font-weight: 400;
	font-size: 13px;
	color: var(--wp--preset--color--gris);
}

.hemera-tarif-sub {
	font-size: 12.5px;
	color: var(--wp--preset--color--gris);
	margin: 4px 0 14px;
}

/* La carte mise en avant. Le liseré ne porte pas seul l'information :
   le badge le dit en toutes lettres. */
.hemera-tarif--phare {
	border: 2px solid var(--wp--preset--color--orange);
	box-shadow: 0 10px 28px rgba(229, 90, 0, 0.13);
}

.hemera-tarif-badge {
	position: absolute;
	top: -11px;
	left: 50%;
	transform: translateX(-50%);
	background: var(--wp--preset--color--orange-texte);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--display);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 4px 12px;
	border-radius: 11px;
	white-space: nowrap;
}

/* Cartes des tarifs spéciaux. */
.hemera-spe {
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 14px;
	padding: 22px;
	display: flex;
	flex-direction: column;
}

/* Le lien de fin se cale en bas : les cartes s'alignent entre elles
   même quand leurs listes n'ont pas la même longueur. */
.hemera-spe > p:last-child {
	margin-top: auto;
	padding-top: 12px;
}

.hemera-spe-tete,
.hemera-ip-tete {
	display: flex;
	gap: 14px;
	align-items: center;
	margin-bottom: 12px;
}

/* Le texte s'aligne sous le titre, pas sous l'icône. */
.hemera-spe > :not(.hemera-spe-tete),
.hemera-ip > :not(.hemera-ip-tete) {
	padding-left: 56px;
}

.hemera-spe-tete h3,
.hemera-ip-tete h3 {
	margin: 0;
}

.hemera-spe-prix {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.5rem;
	color: var(--wp--preset--color--bleu-profond);
	margin: 0;
	line-height: 1.1;
}

.hemera-spe-sous {
	font-size: 13.5px;
	color: var(--wp--preset--color--gris);
	margin: 4px 0 12px;
}

.hemera-spe .hemera-liste li {
	font-size: 13.5px;
	margin-bottom: 5px;
	padding-left: 22px;
}

/* Blocs d'information pratique. */
.hemera-ip p {
	font-size: 14.5px;
	margin: 0 0 8px;
	line-height: 1.6;
}

.hemera-ip .hemera-liste li {
	font-size: 14px;
	margin-bottom: 5px;
	padding-left: 22px;
}

.hemera-prix-g {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.45rem;
	color: var(--wp--preset--color--bleu-profond);
	display: block;
	margin: 0.2em 0;
}

/* Encart crème du bandeau : icône à gauche, texte à droite. */
.hemera-encart {
	background: #FFF6E9;
	border-radius: 14px;
	padding: 20px 22px;
	color: var(--wp--preset--color--noir);
	max-width: 520px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
}

.hemera-encart-in {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.hemera-encart .hemera-ico {
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--orange-texte);
}

/* Hors bandeau, l'encart prend toute la largeur de sa section. */
.hemera-encart-large {
	max-width: none;
	box-shadow: none;
	border-left: 4px solid var(--wp--preset--color--orange);
	border-radius: 0 14px 14px 0;
}

.hemera-encart p {
	margin: 0 0 6px;
	font-size: 14.5px;
	line-height: 1.65;
}

.hemera-encart p:last-child {
	margin-bottom: 0;
}

.hemera-encart strong {
	font-family: var(--wp--preset--font-family--display);
	display: block;
	margin-bottom: 4px;
}

/* Appel à l'action de fin de page. */
.hemera-cta p {
	color: rgba(255, 255, 255, 0.86);
}

.hemera-cta-micro {
	color: rgba(255, 255, 255, 0.6);
	font-size: 13.5px;
	margin-top: 18px;
}

/* ==================================================================
   6. CONTENU
   ================================================================== */

.wp-block-button__link,
.wp-block-post-title a {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--orange-texte);
	outline-offset: 2px;
	border-radius: 2px;
}

.wp-block-table {
	overflow-x: auto;
}

.wp-block-table table {
	border-collapse: collapse;
}

.wp-block-table th,
.wp-block-table td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--wp--preset--color--bleu-pale);
	vertical-align: top;
}

.wp-block-table thead th,
.wp-block-table tbody th[scope="row"] {
	text-align: left;
	font-weight: 600;
}

.wp-block-table thead th {
	background: var(--wp--preset--color--bleu-brume);
}

/* Tableau produit par le shortcode [hemera_tarifs]. */
.hemera-tarifs {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--petit);
}

.hemera-tarifs th,
.hemera-tarifs td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--wp--preset--color--bleu-pale);
	text-align: left;
	vertical-align: top;
}

.hemera-tarifs thead th {
	background: var(--wp--preset--color--bleu-brume);
}

/* Blocs dépliables : cadre blanc, flèche native conservée. */
.wp-block-details {
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 8px;
	padding: 12px 16px;
	margin-bottom: 9px;
	background: var(--wp--preset--color--blanc);
}

.wp-block-details summary {
	cursor: pointer;
	min-height: 44px;
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 15.5px;
	list-style: none;
}

/* La flèche par défaut varie d'un navigateur à l'autre : on la remplace
   par un chevron qui pivote à l'ouverture. */
.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::before {
	content: "";
	flex: 0 0 10px;
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--wp--preset--color--orange-texte);
	border-bottom: 2px solid var(--wp--preset--color--orange-texte);
	transform: rotate(-45deg);
	transition: transform 0.2s;
}

.wp-block-details[open] summary::before {
	transform: rotate(45deg);
}

.wp-block-details[open] summary {
	margin-bottom: 9px;
	color: var(--wp--preset--color--bleu-profond);
}

/* Au clic, pas de cadre. Les navigateurs posent leur propre contour sur
   un <summary> reçu au pointeur, ce que :focus-visible ne couvre pas
   partout. On l'annule pour ce cas précis, et pour lui seul.

   La navigation au clavier garde son contour : la règle globale
   :focus-visible plus haut continue de s'appliquer, et c'est elle qui
   rend l'accordéon utilisable sans souris. Ne pas remplacer ceci par
   summary:focus { outline: none }, qui supprimerait les deux. */
.wp-block-details summary:focus:not(:focus-visible) {
	outline: none;
}

/* Le chevron marque déjà l'ouverture, le titre change de couleur :
   l'état reste lisible sans le contour. */
.wp-block-details summary::-moz-focus-inner {
	border: 0;
}

.wp-block-details p:last-child {
	margin-bottom: 0;
}

/* Planning : une colonne par jour, empilées par le bloc Colonnes. */
.hemera-creneaux {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hemera-creneaux li {
	padding: 10px 0;
	border-top: 1px solid var(--wp--preset--color--bleu-pale);
}

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

.screen-reader-text:focus {
	position: static;
	width: auto;
	height: auto;
	margin: 0;
	clip-path: none;
	white-space: normal;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms;
		animation-iteration-count: 1;
		transition-duration: 0.01ms;
		scroll-behavior: auto;
	}
}

/* --------------------------------------------------------------
   Anti-CLS des images posées à la main
   --------------------------------------------------------------
   Les blocs Image collés en HTML n'ont pas d'ID média : WordPress
   ne peut pas écrire width et height, et écrire ces attributs à la
   main invalide le bloc (« Tentative de récupération »).
   Le ratio réserve la place sans toucher au balisage.
-------------------------------------------------------------- */

.hemera-img-207 img {
	aspect-ratio: 20 / 7;
	height: auto;
}

/* ==================================================================
   7. PAGE COURS COLLECTIFS
   Valeurs relevées dans le CSS de la maquette. Trois couleurs
   d'accent y descendaient sous 4,5 sur leur propre teinte :
   #00849B (3,81) -> #046070, #2E7D5B (4,40) -> #2D7B5A,
   #C97A0A (3,12) -> #A26208. #C0392B, #2A5C8A et #6B4E8F passent.
   ================================================================== */

.hemera-ancre {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	padding-bottom: 20px;
	border-bottom: 1px solid rgba(31, 41, 55, 0.14);
}

.hemera-ancre a {
	font-family: var(--wp--preset--font-family--display);
	font-size: 13.5px;
	text-decoration: none;
	color: var(--wp--preset--color--noir);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 20px;
	padding: 0 15px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

.hemera-ancre a:hover,
.hemera-ancre a:focus-visible {
	background: var(--wp--preset--color--noir);
	color: var(--wp--preset--color--blanc);
}

/* Grille des cartes de cours. */
.hemera-cours {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	align-items: stretch;
}

@media (max-width: 1000px) {
	.hemera-cours {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.hemera-cours {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-cc {
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--blanc);
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-left: 4px solid var(--acc, var(--wp--preset--color--orange));
	box-shadow: var(--wp--preset--shadow--carte);
	transition: transform 0.22s cubic-bezier(0.2, 0.7, 0.3, 1), box-shadow 0.22s;
}

.hemera-cc:hover {
	transform: translateY(-4px);
	box-shadow: var(--wp--preset--shadow--carte-survol);
}

@media (prefers-reduced-motion: reduce) {
	.hemera-cc {
		transition: none;
	}

	.hemera-cc:hover {
		transform: none;
	}
}

.hemera-cc-txt {
	padding: 22px 22px 18px;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

.hemera-cc-ico {
	width: 48px;
	height: 48px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 15px;
	background: var(--tin, #FFF1E4);
	color: var(--acc, var(--wp--preset--color--orange-texte));
}

.hemera-cc-ico svg {
	width: 23px;
	height: 23px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.hemera-cc h3 {
	font-size: 1.1rem;
	line-height: 1.25;
	margin: 0 0 0.45em;
	color: var(--wp--preset--color--noir);
}

.hemera-cc > .hemera-cc-txt > p {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--wp--preset--color--gris);
	margin: 0 0 1em;
}

/* Mémo du cours : deux colonnes, intitulé orange et valeur grise. */
.hemera-cc-memo {
	margin: 14px 0 0;
	padding-top: 14px;
	border-top: 1px solid rgba(31, 41, 55, 0.14);
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 5px 12px;
	font-size: 13px;
	line-height: 1.45;
}

.hemera-cc-memo dt {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	color: var(--wp--preset--color--orange-texte);
	white-space: nowrap;
	margin: 0;
}

.hemera-cc-memo dd {
	margin: 0;
	color: var(--wp--preset--color--gris);
}

/* Horaires : pastilles à la couleur d'accent de la carte. */
.hemera-cc .hemera-cc-h {
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid rgba(31, 41, 55, 0.14);
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	font-size: inherit;
	color: inherit;
}

.hemera-cc-h span {
	display: inline-flex;
	align-items: center;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 12.5px;
	color: var(--acc, var(--wp--preset--color--orange-texte));
	background: var(--tin, #FFF1E4);
	border-radius: 6px;
	padding: 5px 10px;
	white-space: nowrap;
}

.hemera-cc-lien {
	margin-top: 12px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 14px;
	text-decoration: none;
	color: var(--acc, var(--wp--preset--color--orange-texte));
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 44px;
}

.hemera-cc-lien:hover,
.hemera-cc-lien:focus-visible {
	text-decoration: underline;
}

/* Grille « Par où commencer ». */
.hemera-depart {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-top: 20px;
}

@media (max-width: 900px) {
	.hemera-depart {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.hemera-depart {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-depart h3 {
	font-size: 1.02rem;
	margin: 0 0 0.4em;
}

.hemera-depart p {
	margin: 0;
	font-size: 14.5px;
	color: var(--wp--preset--color--gris);
}

/* ==================================================================
   8. GRAS ET SURVOLS
   ================================================================== */

/* Source Sans 3 n'est auto-hébergée qu'en 400 et 600. <strong> demande
   700 par défaut : aucune fonte ne répond, le navigateur bricole un faux
   gras à peine visible. On le ramène sur la graisse réellement chargée.
   Montserrat, elle, possède son 700 : les titres n'y touchent pas. */
strong,
b {
	font-weight: 600;
}

.hemera-encart strong,
.hemera-cc-memo dt,
.hemera-eyebrow {
	font-weight: 700;
}

/* Boutons. La maquette les soulève de 2 px au survol et pose une ombre
   colorée ; l'appui les repose. Aucun état n'était transposé. */
.wp-block-button__link {
	transition: transform 0.18s, box-shadow 0.18s, background-color 0.18s, color 0.18s, border-color 0.18s;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 12px 26px -8px rgba(194, 76, 0, 0.55);
}

.wp-block-button__link:active {
	transform: translateY(0);
	box-shadow: none;
}

/* Bouton creux sur fond clair : il se remplit de noir. */
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
	background-color: var(--wp--preset--color--noir);
	color: var(--wp--preset--color--blanc);
	border-color: var(--wp--preset--color--noir);
	box-shadow: none;
}

/* Sur fond sombre, le contour est blanc et s'inverse au survol.
   Blanc sur noir : 14,6. Noir sur blanc : 14,6. */
/* Sur fond sombre, le contour est blanc. La couleur vient d'ici et non
   d'une classe has-…-color : WordPress sort ces classes avec !important,
   et aucune règle de survol ne pourrait alors les reprendre — le texte
   restait blanc sur le fond blanc du survol. */
.hemera-hero .wp-block-button.is-style-outline .wp-block-button__link,
.hemera-fond-cta .wp-block-button.is-style-outline .wp-block-button__link {
	color: var(--wp--preset--color--blanc);
	border-color: rgba(255, 255, 255, 0.55);
}

.hemera-hero .wp-block-button.is-style-outline .wp-block-button__link:hover,
.hemera-hero .wp-block-button.is-style-outline .wp-block-button__link:focus-visible,
.hemera-fond-cta .wp-block-button.is-style-outline .wp-block-button__link:hover,
.hemera-fond-cta .wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
	background-color: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--noir);
	border-color: var(--wp--preset--color--blanc);
	box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-button__link {
		transition: background-color 0.18s, color 0.18s, border-color 0.18s;
	}

	.wp-block-button__link:hover,
	.wp-block-button__link:focus-visible,
	.wp-block-button__link:active {
		transform: none;
	}
}

/* ==================================================================
   9. COMPOSANTS DE LA MAQUETTE MANQUANTS AU THÈME
   ================================================================== */

/* .repere de la maquette : gris, petites capitales, sans tiret.
   À ne pas confondre avec hemera-eyebrow, qui est orange et précédé
   d'un tiret. Ce sont deux objets différents. */
.hemera-repere {
	font-family: var(--wp--preset--font-family--display);
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gris);
	margin: 0 0 6px;
}

/* .note de la maquette. hemera-encart lui ressemble mais met son
   <strong> en display:block, ce qui coupe la phrase en deux lignes.
   Ici le gras reste dans le fil du texte. */
.hemera-note {
	background: #FFF8E6;
	border-left: 4px solid var(--wp--preset--color--orange);
	padding: 14px 18px;
	font-size: 14.5px;
	margin: 0 0 18px;
}

.hemera-note p {
	margin: 0;
}

.hemera-note strong {
	font-family: var(--wp--preset--font-family--display);
}

/* Carte à liseré orange et coins droits arrondis. */
.hemera-carte-liseré {
	border-left: 4px solid var(--wp--preset--color--orange);
	border-radius: 0 16px 16px 0;
}

/* Une carte de jour isolée, hors de la grille du planning. */
.hemera-carte .hemera-planning {
	display: block;
	margin-top: 4px;
}

.hemera-carte .hemera-planning > .wp-block-group {
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 12px;
	overflow: hidden;
}

.hemera-carte .hemera-planning h4 {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 15px;
	margin: 0;
	padding: 12px 16px;
	background: var(--wp--preset--color--bleu-profond);
	color: var(--wp--preset--color--blanc);
	letter-spacing: 0.02em;
}

/* Carte sur fond bleu brume, sans bordure. Le bloc « Nous trouver »
   de la page Héméra. */
.hemera-carte-brume {
	background: var(--wp--preset--color--bleu-brume);
	border: 0;
}

/* Grille des fiches de coachs. */
.hemera-coachs {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	margin-top: 30px;
}

@media (max-width: 1000px) {
	.hemera-coachs {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.hemera-coachs {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-coach img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 8px;
	margin-bottom: 16px;
	display: block;
}

.hemera-coach h3 {
	font-size: 1.1rem;
	margin: 0 0 0.3em;
}

/* Le rôle du coach : même forme que le repère, en orange. */
.hemera-repere-orange {
	color: var(--wp--preset--color--orange-texte);
}

.hemera-coach > p {
	font-size: 14.5px;
	margin: 0 0 1em;
}

.hemera-dip {
	font-size: 14.5px;
	margin-top: auto;
}

.hemera-dip li {
	margin-bottom: 5px;
	padding-left: 22px;
}

/* ==================================================================
   10. HARMONISATION DES HAUTEURS
   ==================================================================
   Le bloc Colonnes étire ses colonnes à la hauteur de la plus haute,
   mais ce qu'elles contiennent garde sa hauteur propre. Une carte
   posée dans une colonne flotte donc dans le vide au lieu de
   s'aligner sur ses voisines. Il faut relayer l'étirement.
   ------------------------------------------------------------------ */

/* Les citations. La colonne devient conteneur, la carte la remplit,
   et la signature se cale en pied comme dans la maquette. */
.wp-block-columns > .wp-block-column > .wp-block-quote {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.wp-block-columns > .wp-block-column > .wp-block-quote > :last-child {
	margin-bottom: 0;
}

.wp-block-columns > .wp-block-column > .wp-block-quote cite {
	margin-top: auto;
	padding-top: 11px;
}

/* Une colonne alignée en haut ne s'étire pas : align-self la sort du
   flux d'étirement. Les citations et les cartes n'y sont donc jamais
   posées, sauf quand la colonne est seule de son espèce. */
.wp-block-columns.are-vertically-aligned-top > .wp-block-column.hemera-carte,
.wp-block-columns.are-vertically-aligned-top > .wp-block-column.hemera-spe {
	align-self: stretch;
}

/* Cartes en grille : .hemera-besoins, .hemera-cours, .hemera-cartes,
   .hemera-depart et .hemera-coachs. La grille étire ses cellules
   d'elle-même ; on s'assure seulement qu'aucune hauteur fixe ne
   vienne annuler cet étirement. */
.hemera-besoins > *,
.hemera-cours > *,
.hemera-depart > *,
.hemera-coachs > * {
	height: auto;
}

/* ==================================================================
   11. PAGE LOUER LA SALLE
   ================================================================== */

/* Grille des disponibilités. Nommée hemera-dispo et non
   hemera-creneaux : cette dernière sert déjà les listes d'horaires
   du planning, ce sont deux objets différents. */
.hemera-dispo {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	margin-top: 26px;
}

@media (max-width: 1000px) {
	.hemera-dispo {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.hemera-dispo {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-dispo-jour {
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-radius: 14px;
	padding: 18px 18px 16px;
	box-shadow: var(--wp--preset--shadow--carte);
}

.hemera-dispo-j {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--bleu-profond);
	margin: 0 0 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid rgba(31, 41, 55, 0.14);
}

.hemera-dispo-jour ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.hemera-dispo-jour li {
	font-size: 14.5px;
	padding: 5px 0 5px 20px;
	position: relative;
	color: var(--wp--preset--color--noir);
}

/* La pastille ne porte pas seule l'information : un créneau pris
   nomme son occupant en toutes lettres. */
.hemera-dispo-jour li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 12px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #3FA37A;
}

.hemera-dispo-jour li.pris {
	color: var(--wp--preset--color--gris);
}

.hemera-dispo-jour li.pris::before {
	background: rgba(31, 41, 55, 0.14);
}

.hemera-dispo-week {
	background: linear-gradient(160deg, #EAF6F1, #F5FBF8);
	border-color: #C7E6D8;
}

.hemera-dispo-autre {
	background: var(--wp--preset--color--bleu-brume);
	border-style: dashed;
}

.hemera-dispo-autre p:last-child {
	font-size: 14.5px;
	margin: 0;
	color: var(--wp--preset--color--gris);
}

/* Les trois formules de location. */
.hemera-tarif-loc {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin-top: 30px;
}

@media (max-width: 860px) {
	.hemera-tarif-loc {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Une seule formule publiee : la carte se centre au lieu de s'etirer
   sur les trois colonnes de la grille. */
.hemera-tarif-loc-solo {
	grid-template-columns: minmax(0, 1fr);
	max-width: 420px;
}

.hemera-tl {
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-radius: 14px;
	padding: 22px;
	box-shadow: var(--wp--preset--shadow--carte);
}

.hemera-tl-vedette {
	border: 2px solid var(--wp--preset--color--orange);
	position: relative;
}

/* Badge : orange-texte et non orange vif. Blanc dessus donne 3,62
   contre 4,85. Même correction que « Le plus choisi ». */
.hemera-tl-badge {
	position: absolute;
	top: -11px;
	left: 18px;
	background: var(--wp--preset--color--orange-texte);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--display);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	padding: 4px 12px;
	border-radius: 11px;
	white-space: nowrap;
}

.hemera-tl-k {
	font-family: var(--wp--preset--font-family--display);
	font-size: 12px;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gris);
	margin: 0 0 6px;
}

.hemera-tl-v {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.9rem;
	font-weight: 700;
	color: var(--wp--preset--color--bleu-profond);
	line-height: 1;
	letter-spacing: -0.02em;
	margin: 0;
}

.hemera-tl-v small {
	font-size: 0.42em;
	font-weight: 500;
	color: var(--wp--preset--color--gris);
}

.hemera-tl-d {
	font-size: 14px;
	color: var(--wp--preset--color--gris);
	margin: 10px 0 0;
}

/* Étapes numérotées par compteur CSS : le numéro est décoratif,
   il n'entre pas dans le texte lu par les lecteurs d'écran. */
.hemera-etapes {
	counter-reset: hemera-etape;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin-top: 26px;
}

@media (max-width: 780px) {
	.hemera-etapes {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-et {
	position: relative;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.07);
	border-radius: 14px;
	padding: 20px 20px 18px 62px;
	box-shadow: 0 1px 2px rgba(31, 41, 55, 0.04);
}

.hemera-et::before {
	counter-increment: hemera-etape;
	content: counter(hemera-etape);
	position: absolute;
	left: 18px;
	top: 20px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--wp--preset--color--bleu-brume);
	color: var(--wp--preset--color--bleu-profond);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hemera-et h3 {
	font-size: 1.02rem;
	margin: 0 0 5px;
}

.hemera-et p {
	font-size: 14.5px;
	margin: 0;
	color: var(--wp--preset--color--gris);
}

/* Carte de l'association occupante, aux couleurs d'Éclats de Danse. */
.hemera-danse-carte {
	background: #0D0A10;
	border-radius: 16px;
	padding: 26px;
	margin-top: 22px;
}

.hemera-danse-tete {
	display: flex;
	gap: 22px;
	align-items: center;
	flex-wrap: wrap;
}

.hemera-danse-tete img {
	flex: 0 0 96px;
	width: 96px;
	height: auto;
	margin: 0;
}

.hemera-danse-tete > div {
	flex: 1 1 260px;
	min-width: 0;
}

/* #C9A227 sur #0D0A10 : 7,08. #E6007E : 4,58. */
.hemera-danse-slogan {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	color: #C9A227;
	margin: 0 0 4px;
	font-size: 14.5px;
}

.hemera-danse-carte h3 {
	color: var(--wp--preset--color--blanc);
	margin: 0 0 8px;
	font-size: 1.4rem;
}

.hemera-danse-txt {
	color: rgba(255, 255, 255, 0.8);
	font-size: 15px;
	margin: 0;
}

.hemera-danse-bas {
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	padding-top: 16px;
	margin: 22px 0 0;
}

.hemera-danse-bas a {
	color: #FF4FA3;
}

/* Bouton de partage de page. */
/* Le bouton de partage est defini une seule fois, en fin de fichier :
   version claire, puis inversion sur fond sombre. */

/* ==================================================================
   12. PAGE ÉCLATS DE DANSE
   Charte de l'association hébergée, distincte de celle d'Héméra.
   ================================================================== */

.hemera-danse {
	background: #0D0A10;
	color: var(--wp--preset--color--blanc);
	position: relative;
	overflow: hidden;
}

/* Deux halos, purement décoratifs. */
.hemera-danse::before,
.hemera-danse::after {
	content: "";
	position: absolute;
	width: 520px;
	height: 520px;
	border-radius: 50%;
	pointer-events: none;
}

.hemera-danse::before {
	top: -140px;
	right: -120px;
	background: radial-gradient(circle, rgba(230, 0, 126, 0.22), transparent 68%);
}

.hemera-danse::after {
	bottom: -180px;
	left: -140px;
	background: radial-gradient(circle, rgba(201, 162, 39, 0.16), transparent 68%);
}

.hemera-danse > * {
	position: relative;
	z-index: 2;
}

.hemera-danse p {
	color: rgba(255, 255, 255, 0.82);
}

/* Le rose de la charte, #E6007E, donne 4,37 sur ce fond : sous le
   seuil pour du texte. Éclairci à #EB0081, 4,54, teinte inchangée.
   Il reste #E6007E là où il n'est pas du texte. */
.hemera-danse .hemera-eyebrow {
	color: #EB0081;
}

.hemera-d-tete {
	display: flex;
	align-items: center;
	gap: 26px;
	flex-wrap: wrap;
	margin-bottom: 8px;
}

.hemera-d-logo {
	flex: 0 0 118px;
	width: 118px;
	height: auto;
}

.hemera-d-slogan {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-weight: 500;
	font-size: 1.05rem;
	margin: 0;
}

.hemera-danse .hemera-d-slogan {
	color: #C9A227;
}

.hemera-d-titre {
	font-size: clamp(1.8rem, 3.4vw, 2.6rem);
	letter-spacing: -0.02em;
	margin: 0 0 6px;
}

.hemera-d-osez {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-weight: 700;
	font-size: 1.35rem;
	margin: 14px 0 0;
	letter-spacing: 0.01em;
}

.hemera-danse .hemera-d-osez {
	color: #EB0081;
}

.hemera-d-photos {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 26px 0 30px;
}

.hemera-d-photos img {
	width: 100%;
	height: 230px;
	object-fit: cover;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.12);
}

@media (max-width: 700px) {
	.hemera-d-photos img {
		height: 150px;
	}
}

.hemera-d-essai {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	/* Dégradé assombri : le blanc doit rester lisible d'un bout à
	   l'autre. #E6007E donne 4,50 et #C9A227 seulement 3,41 ; les deux
	   bornes retenues donnent 5,90 et 4,61. Teintes inchangées. */
	background: linear-gradient(96deg, #C4006B, #8D721B);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 15px;
	padding: 13px 24px;
	border-radius: 30px;
	margin: 0 0 30px;
}

.hemera-danse .hemera-d-essai {
	color: var(--wp--preset--color--blanc);
}

.hemera-d-h2 {
	font-size: 1.2rem;
	margin-bottom: 16px;
}

.hemera-d-jours {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}

@media (max-width: 700px) {
	.hemera-d-jours {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-d-jour {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 12px;
	padding: 16px;
}

.hemera-d-j {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 14px;
	color: #C9A227;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 12px;
	padding-bottom: 9px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.hemera-d-s {
	margin-bottom: 11px;
}

.hemera-d-s:last-child {
	margin-bottom: 0;
}

.hemera-d-s .h {
	font-family: var(--wp--preset--font-family--display);
	font-size: 12.5px;
	color: #EB0081;
	margin: 0;
}

.hemera-d-s .c {
	font-size: 14.5px;
	margin: 1px 0 0;
	color: rgba(255, 255, 255, 0.92);
}

.hemera-d-s .p {
	font-size: 12.5px;
	margin: 0;
	color: rgba(255, 255, 255, 0.62);
}

.hemera-d-legende {
	font-size: 13.5px;
	margin-top: 12px;
}

.hemera-d-legende strong {
	color: rgba(255, 255, 255, 0.9);
}

.hemera-d-tarifs {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 12px;
	padding: 20px;
}

.hemera-d-tarifs table {
	width: 100%;
	background: transparent;
	font-size: 14px;
	border-collapse: collapse;
}

.hemera-d-table2 {
	margin-top: 16px;
}

.hemera-d-tarifs th,
.hemera-d-tarifs td {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.9);
	padding: 9px 4px;
	text-align: left;
}

.hemera-d-tarifs th:last-child,
.hemera-d-tarifs td:last-child {
	text-align: right;
}

.hemera-d-tarifs thead th {
	background: transparent;
	color: #C9A227;
	font-size: 12px;
}

.hemera-d-tarifs tbody tr:last-child td {
	border-bottom: 0;
}

.hemera-d-remise {
	color: #EB0081;
}

.hemera-d-saison {
	font-size: 13px;
	margin: 0 0 14px;
}

.hemera-d-mentions {
	font-size: 13px;
	margin: 14px 0 0;
}

.hemera-d-famille {
	font-size: 13.5px;
	margin: 14px 0 0;
}

.hemera-d-famille strong {
	color: #C9A227;
}

.hemera-d-note {
	background: rgba(255, 255, 255, 0.06);
	border-left: 4px solid #C9A227;
	border-radius: 0 12px 12px 0;
	padding: 16px 20px;
	margin-top: 30px;
}

.hemera-d-note p {
	margin: 0;
	font-size: 14.5px;
}

.hemera-d-note strong {
	font-family: var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--blanc);
}

/* Liens de la section : sur fond sombre, la couleur de lien du thème ne
   tient pas le contraste. Blanc souligné, les boutons gardent leur style. */
.hemera-danse a:not(.wp-block-button__link) {
	color: var(--wp--preset--color--blanc);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.hemera-danse a:not(.wp-block-button__link):hover,
.hemera-danse a:not(.wp-block-button__link):focus-visible {
	text-decoration-thickness: 2px;
}

/* Bouton plein aux couleurs de l'association. #C4006B donne 5,33
   sous le blanc, contre 4,50 tout juste pour #E6007E. */
.hemera-bouton-danse .wp-block-button__link {
	background-color: #C4006B;
	color: var(--wp--preset--color--blanc);
	border: 2px solid transparent;
}

.hemera-bouton-danse .wp-block-button__link:hover,
.hemera-bouton-danse .wp-block-button__link:focus-visible {
	box-shadow: 0 12px 26px -8px rgba(196, 0, 107, 0.6);
}

.hemera-danse .wp-block-button.is-style-outline .wp-block-button__link {
	color: var(--wp--preset--color--blanc);
	border-color: rgba(255, 255, 255, 0.45);
}

.hemera-danse .wp-block-button.is-style-outline .wp-block-button__link:hover,
.hemera-danse .wp-block-button.is-style-outline .wp-block-button__link:focus-visible {
	background-color: var(--wp--preset--color--blanc);
	color: #0D0A10;
	border-color: var(--wp--preset--color--blanc);
}

/* Bloc de partage sur fond clair. */
.hemera-partage-clair {
	border-top-color: rgba(31, 41, 55, 0.14);
	justify-content: flex-start;
}

.hemera-partage-clair p {
	color: var(--wp--preset--color--gris);
}

.hemera-partage-clair .hemera-btn-partage {
	background: var(--wp--preset--color--blanc);
	border-color: rgba(31, 41, 55, 0.14);
	color: var(--wp--preset--color--noir);
}

.hemera-partage-clair .hemera-btn-partage:hover,
.hemera-partage-clair .hemera-btn-partage:focus-visible {
	background: var(--wp--preset--color--noir);
	color: var(--wp--preset--color--blanc);
	border-color: var(--wp--preset--color--noir);
}

/* ==================================================================
   13. PAGE ACTIVITÉS NATURE
   ================================================================== */

/* Cartes de projet : image en tête, lien en pied. Elles réemploient
   .hemera-carte, qui distribue déjà son contenu en colonne. */
.hemera-projets img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 10px;
	margin: 0 0 14px;
	display: block;
}

.hemera-projets h3 {
	font-size: 1.08rem;
	margin: 0 0 0.4em;
}

.hemera-projets-bas {
	margin-top: auto;
	padding-top: 12px;
}

.hemera-img-43 img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	width: 100%;
	height: auto;
}

/* Vidéo. Lecteur natif : pas de tiers, pas de cookie, pas de
   consentement à demander. preload="none" ne charge rien tant que
   le visiteur n'a pas lancé la lecture. */
.hemera-video {
	margin: 0;
}

.hemera-video video {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border-radius: 12px;
	display: block;
	background: var(--wp--preset--color--noir);
}

.hemera-video figcaption {
	font-size: 14px;
	color: var(--wp--preset--color--gris);
	margin-top: 10px;
}

/* ==================================================================
   14. PAGE TOUS CAPABLES 2027
   ================================================================== */

/* Citation isolée, hors grille. */
.hemera-citation-seule {
	margin: 26px auto 0;
	max-width: 620px;
	text-align: center;
}

/* Façade de vidéo YouTube. Rien n'est chargé depuis YouTube tant que
   le visiteur n'a pas cliqué : l'image est servie par le site, et le
   lien ouvre YouTube dans un nouvel onglet. Aucun traceur avant. */
.hemera-video-facade {
	margin: 22px 0 0;
}

.hemera-vf-lien {
	position: relative;
	display: block;
	border-radius: 12px;
	overflow: hidden;
	text-decoration: none;
}

.hemera-vf-lien img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
}

.hemera-vf-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(31, 41, 55, 0.28);
	transition: background-color 0.18s;
}

.hemera-vf-play svg {
	width: 34px;
	height: 34px;
	fill: var(--wp--preset--color--blanc);
	background: rgba(31, 41, 55, 0.72);
	border-radius: 50%;
	padding: 14px;
	box-sizing: content-box;
}

.hemera-vf-lien:hover .hemera-vf-play,
.hemera-vf-lien:focus-visible .hemera-vf-play {
	background: rgba(31, 41, 55, 0.12);
}

.hemera-video-facade figcaption {
	font-size: 13.5px;
	color: var(--wp--preset--color--gris);
	margin-top: 10px;
}

/* ==================================================================
   15. PAGE D'ACCUEIL
   ================================================================== */

.hemera-hero-acc {
	position: relative;
	background: #152231;
	color: var(--wp--preset--color--blanc);
	overflow: hidden;
}

/* Le groupe est en disposition « par défaut », pas « contenu contraint » :
   sur un bloc alignfull, WordPress impose margin-inline:auto !important à
   ses enfants, et le texte se centrait dans la moitié gauche. La marge
   gauche est donc reprise ici, alignée sur le remplissage du site. */
.hemera-hero-acc > .hemera-ha-in {
	position: relative;
	z-index: 3;
	padding: 64px max(52px, 5vw) 82px var(--wp--style--root--padding-left);
	max-width: min(calc(580px + var(--wp--style--root--padding-left)), 52vw);
}

/* L'image occupe la moitié droite, coupée en biais. Le liseré orange
   est un second losange décalé de 4 px : c'est lui qui dessine le trait. */
.hemera-ha-media {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 52%;
	overflow: hidden;
	clip-path: polygon(16% 0, 100% 0, 100% 100%, 0 100%);
	z-index: 2;
}

.hemera-ha-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 52% 45%;
}

.hemera-ha-media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, rgba(21, 34, 49, 0.5), rgba(21, 34, 49, 0) 40%);
}

.hemera-ha-biais {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 52%;
	background: var(--wp--preset--color--orange);
	clip-path: polygon(16% 0, 100% 0, 100% 100%, 0 100%);
	transform: translateX(-4px);
	z-index: 1;
}

.hemera-ha-vague {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	z-index: 4;
	display: block;
	width: 100%;
	height: 54px;
}

.hemera-ha-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(255, 255, 255, 0.09);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 22px;
	padding: 7px 15px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 13px;
	margin: 0 0 18px;
}

.hemera-ha-eyebrow svg {
	width: 15px;
	height: 15px;
	stroke: var(--wp--preset--color--jaune);
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.hemera-hero-acc h1 {
	color: var(--wp--preset--color--blanc);
	font-size: clamp(2rem, 4vw, 3.1rem);
	line-height: 1.12;
	margin: 0 0 4px;
	letter-spacing: -0.022em;
}

.hemera-hero-acc h1 span {
	display: block;
	font-size: 0.62em;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.82);
	margin: 6px 0 26px;
	letter-spacing: -0.01em;
	text-wrap: balance;
}

/* Mot souligné à main levée. */
.hemera-mot-h {
	position: relative;
	font-style: normal;
	white-space: nowrap;
}

.hemera-mot-h::after {
	content: "";
	position: absolute;
	left: -3px;
	right: -3px;
	bottom: -0.22em;
	height: 0.3em;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M3 8.4c26-3.6 58-5.4 96-5.4 34 0 66 1.4 98 4.2' fill='none' stroke='%23E55A00' stroke-width='3.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
	background-size: 100% 100%;
}

.hemera-ha-lead {
	font-size: 1.05rem;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.82);
	margin: 0 0 24px;
	text-wrap: pretty;
}

.hemera-ha-puces {
	margin: 0 0 28px;
	padding: 16px 0 0;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0 6px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 13.5px;
}

.hemera-ha-puces li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

.hemera-ha-puces li:not(:last-child)::after {
	content: "·";
	color: var(--wp--preset--color--jaune);
	margin-left: 6px;
	font-weight: 700;
}

.hemera-ha-sous {
	margin: 18px 0 0;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.72);
}

/* Sous 900 px, l'image repasse au-dessus du texte et le biais
   disparaît : une coupe oblique n'a plus de sens sur une colonne. */
@media (max-width: 900px) {
	.hemera-ha-media {
		position: static;
		width: 100%;
		height: 210px;
		clip-path: none;
	}

	.hemera-ha-media::after,
	.hemera-ha-biais,
	.hemera-ha-vague {
		display: none;
	}

	.hemera-hero-acc > .hemera-ha-in {
		padding: 36px var(--wp--style--root--padding-right) 44px var(--wp--style--root--padding-left);
		max-width: none;
	}
}

/* Introduction en trois colonnes. */
.hemera-titre-xl {
	font-size: clamp(2rem, 3.6vw, 2.9rem);
	margin-bottom: 0.2em;
}

.hemera-souligne {
	display: block;
	width: 190px;
	max-width: 62%;
	height: 12px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M3 8.4c26-3.6 58-5.4 96-5.4 34 0 66 1.4 98 4.2' fill='none' stroke='%23E55A00' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
	background-size: 100% 100%;
}

.hemera-accroche {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-weight: 500;
	font-size: 1.12rem;
	color: var(--wp--preset--color--bleu-profond);
	margin-top: 0.7em;
}

/* Bulle d'Aurore : la photo déborde à gauche, le texte lui laisse
   la place par un remplissage, jamais par une marge négative. */
.hemera-bulle-aurore {
	position: relative;
	background: #FFF3E8;
	border: 1px solid #F6DEC9;
	border-radius: 14px;
	padding: 20px 20px 20px 96px;
	min-height: 104px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.hemera-bulle-aurore img {
	position: absolute;
	left: -14px;
	top: 50%;
	transform: translateY(-50%);
	width: 96px;
	height: 96px;
	border-radius: 50%;
	object-fit: cover;
	object-position: 50% 22%;
	border: 4px solid var(--wp--preset--color--blanc);
	box-shadow: 0 6px 20px rgba(31, 41, 55, 0.16);
	margin: 0;
}

.hemera-bulle-aurore p {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--wp--preset--color--noir);
}

.hemera-bulle-aurore strong {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 15px;
	color: var(--wp--preset--color--orange-texte);
	margin-bottom: 4px;
}

.hemera-besoin-bas {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 36px;
	text-align: center;
}

/* Les deux fragments sont des éléments de flex : l'espace de 16 px les
   sépare à l'écran, mais rien ne les sépare à la copie ni à la lecture
   d'écran, qui enchaînent « parlait ?Aurore ». L'espace insécable rétabli
   dans le balisage vaut aussi pour ces deux cas. */
.hemera-besoin-bas em::after {
	content: "\00a0";
}

.hemera-besoin-bas em {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-weight: 500;
	font-size: 1.12rem;
	color: var(--wp--preset--color--noir);
}

.hemera-besoin-bas span {
	font-size: 15px;
	color: var(--wp--preset--color--gris);
}

/* Vignettes de certification, version accueil. */
.hemera-certifs-acc {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 9px;
	margin: 16px 0 24px;
	padding: 0;
	list-style: none;
	max-width: 400px;
}

.hemera-certifs-acc img {
	width: 100%;
	height: auto;
	display: block;
	margin: 0;
	filter: drop-shadow(0 3px 9px rgba(31, 41, 55, 0.18));
}

/* Pastille des avis Google et bouton, sur une même ligne. */
.hemera-avis-ligne {
	margin-top: 24px;
	gap: 16px;
}

.hemera-avis-ligne .wp-block-buttons {
	margin: 0;
}

.hemera-avis-google {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 12px;
	padding: 12px 18px;
	min-height: 44px;
	text-decoration: none;
	box-shadow: var(--wp--preset--shadow--carte);
}

.hemera-avis-google b {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--wp--preset--color--noir);
	line-height: 1;
}

/* #A56A08 et non #F5A623 : l'or de la maquette donne 2,03 sur blanc,
   les étoiles y sont illisibles. Ici 4,50. La note chiffrée « 5,0 »
   porte l'information de toute façon, la couleur ne fait que l'appuyer. */
.hemera-etoiles {
	font-size: 15px;
	letter-spacing: 1px;
	color: #A56A08;
}

.hemera-avis-google small {
	display: block;
	font-size: 12.5px;
	color: var(--wp--preset--color--gris);
	margin-top: 2px;
}

/* Aperçu des trois formules, produit par [hemera_tarifs_accueil]. */
.hemera-apercu-tarifs {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-top: 26px;
}

@media (max-width: 860px) {
	.hemera-apercu-tarifs {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-apercu-tarifs h3 {
	font-size: 1.05rem;
	margin: 0 0 0.3em;
}

.hemera-apercu-tarifs .hemera-prix-g small {
	display: block;
	font-family: var(--wp--preset--font-family--texte);
	font-weight: 400;
	font-size: 14px;
	color: var(--wp--preset--color--gris);
}

.hemera-apercu-tarifs p:last-child {
	font-size: 15px;
	margin: 0;
}

.hemera-img-1610 img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
	width: 100%;
	height: auto;
}

/* ==================================================================
   16. BLOG
   ================================================================== */

/* Article à la une : image à gauche, texte à droite. */
.hemera-une {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 0;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 16px;
	overflow: hidden;
}

.hemera-une .wp-block-post-featured-image {
	margin: 0;
	height: 100%;
}

.hemera-une .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	min-height: 280px;
	object-fit: cover;
	display: block;
}

.hemera-une-txt {
	padding: 34px 36px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.hemera-une-txt h2 {
	font-size: clamp(1.4rem, 2.4vw, 1.9rem);
	margin: 0 0 0.4em;
}

.hemera-une-txt p {
	font-size: 15.5px;
}

.hemera-une-txt .hemera-repere {
	gap: 5px;
	margin-bottom: 6px;
}

.hemera-une-txt .hemera-repere p,
.hemera-une-txt .hemera-repere time {
	margin: 0;
	font-size: inherit;
	color: inherit;
	text-transform: inherit;
	letter-spacing: inherit;
}

@media (max-width: 860px) {
	.hemera-une {
		grid-template-columns: minmax(0, 1fr);
	}

	.hemera-une .wp-block-post-featured-image img {
		min-height: 200px;
	}

	.hemera-une-txt {
		padding: 26px 24px;
	}
}

/* Filtres par catégorie. Ce sont des liens vers les archives, pas des
   boutons : la liste se filtre côté serveur, sans JavaScript, et chaque
   catégorie a son adresse propre — indexable et partageable. */
.hemera-filtres {
	display: flex;
	gap: 9px;
	flex-wrap: wrap;
	margin-top: 18px;
}

.hemera-filtre {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 14px;
	background: var(--wp--preset--color--blanc);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 20px;
	padding: 0 17px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	color: var(--wp--preset--color--noir);
	text-decoration: none;
}

.hemera-filtre:hover {
	border-color: var(--wp--preset--color--bleu-profond);
}

.hemera-filtre-actif {
	background: var(--wp--preset--color--noir);
	border-color: var(--wp--preset--color--noir);
	color: var(--wp--preset--color--blanc);
}

/* Cartes d'article : la boucle réutilise la grille .hemera-depart. */
.hemera-art .wp-block-post-featured-image {
	margin: 0 0 14px;
}

.hemera-art .wp-block-post-featured-image img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 10px;
	display: block;
}

.hemera-art h3 {
	margin: 0 0 0.4em;
}

.hemera-art h3 a {
	text-decoration: none;
	color: var(--wp--preset--color--noir);
}

.hemera-art h3 a:hover,
.hemera-art h3 a:focus-visible {
	text-decoration: underline;
}

.hemera-art .wp-block-post-excerpt {
	font-size: 14.5px;
	margin: 0;
}

.hemera-art-lien {
	margin-top: auto;
	padding-top: 12px;
}

.hemera-art-lien a {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 14px;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

.hemera-pagination {
	margin-top: 34px;
	gap: 8px;
}

/* ==================================================================
   17. CORPS D'ARTICLE
   Mise en page éditoriale : colonne de 680 px, lecture longue.
   ================================================================== */

.hemera-article .wp-block-post-content > p {
	font-size: 16.5px;
	line-height: 1.78;
	color: #31404E;
	margin: 0 0 1.15em;
}

/* Le premier paragraphe fait chapô, sans classe à poser. */
.hemera-article .wp-block-post-content > p:first-of-type {
	font-size: 18px;
	line-height: 1.7;
	color: var(--wp--preset--color--noir);
}

.hemera-article .wp-block-post-content h2 {
	font-size: clamp(1.25rem, 2.1vw, 1.5rem);
	letter-spacing: -0.015em;
	margin: 2.2em 0 0.7em;
	padding-top: 20px;
	position: relative;
}

.hemera-article .wp-block-post-content h2::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 34px;
	height: 2px;
	background: var(--wp--preset--color--orange);
}

.hemera-article .wp-block-post-content h2:first-child {
	margin-top: 0;
}

/* Accroche intercalée. */
.hemera-accroche-art {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: clamp(1.1rem, 1.9vw, 1.32rem);
	line-height: 1.5;
	color: var(--wp--preset--color--bleu-profond);
	border-left: 3px solid var(--wp--preset--color--orange);
	padding-left: 20px;
	margin: 1.6em 0;
}

/* Repères chronologiques. */
.hemera-dates {
	list-style: none;
	margin: 26px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid rgba(31, 41, 55, 0.14);
}

.hemera-dates li {
	display: flex;
	gap: 16px;
	padding: 7px 0;
	font-size: 14.5px;
	color: var(--wp--preset--color--gris);
	line-height: 1.5;
	margin: 0;
}

.hemera-dates b {
	flex: 0 0 52px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 14px;
	color: var(--wp--preset--color--bleu-profond);
}

.hemera-dates li.cle {
	color: var(--wp--preset--color--noir);
}

.hemera-dates li.cle b {
	color: var(--wp--preset--color--orange-texte);
}

/* Citation pleine page, sans cadre. */
.hemera-cite-art {
	background: none;
	border: 0;
	box-shadow: none;
	border-radius: 0;
	padding: 0;
	margin: 44px auto;
}

.hemera-cite-art::before {
	content: none;
}

.hemera-cite-art p {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: clamp(1.25rem, 2.3vw, 1.62rem);
	line-height: 1.42;
	letter-spacing: -0.022em;
	color: var(--wp--preset--color--noir);
	margin: 0;
	padding-left: 22px;
	border-left: 3px solid var(--wp--preset--color--orange);
}

.hemera-cite-art cite {
	display: block;
	margin: 14px 0 0 25px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gris);
	font-style: normal;
}

/* Figure de presse. */
.hemera-fig-presse {
	background: #F4F2EC;
	padding: 14px;
	border-radius: 4px;
	box-shadow: 0 1px 2px rgba(31, 41, 55, 0.06), 0 14px 34px -18px rgba(31, 41, 55, 0.32);
	margin: 34px 0;
}

.hemera-fig-presse img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 2px;
}

.hemera-fig-presse figcaption {
	font-size: 13px;
	color: var(--wp--preset--color--gris);
	margin-top: 10px;
	line-height: 1.5;
	font-style: italic;
}

/* Encart de liens. */
.hemera-encart-liens {
	background: var(--wp--preset--color--bleu-brume);
	border-radius: 4px;
	padding: 26px 28px;
	margin: 40px 0;
}

.hemera-encart-liens :is(h2, h3) {
	font-family: var(--wp--preset--font-family--display);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--bleu-profond);
	margin: 0 0 16px;
}

.hemera-encart-liens ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hemera-encart-liens li {
	padding: 9px 0;
	border-top: 1px solid rgba(4, 96, 112, 0.12);
	font-size: 14.5px;
	line-height: 1.55;
	margin: 0;
}

.hemera-encart-liens li:first-child {
	border-top: 0;
	padding-top: 0;
}

.hemera-encart-liens span {
	display: block;
	color: var(--wp--preset--color--gris);
	font-size: 13.5px;
	margin-top: 2px;
}

/* Trois notions en bandeau. */
.hemera-trio {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: rgba(31, 41, 55, 0.14);
	border: 1px solid rgba(31, 41, 55, 0.14);
	border-radius: 4px;
	overflow: hidden;
	margin: 40px 0 0;
}

@media (max-width: 640px) {
	.hemera-trio {
		grid-template-columns: minmax(0, 1fr);
	}
}

.hemera-trio > div {
	background: var(--wp--preset--color--blanc);
	padding: 22px 18px;
}

.hemera-trio b {
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--wp--preset--color--bleu-profond);
	margin-bottom: 8px;
}

.hemera-trio > div.or b {
	color: var(--wp--preset--color--orange-texte);
}

.hemera-trio p {
	margin: 0;
	font-size: 13.5px;
	color: var(--wp--preset--color--gris);
	line-height: 1.55;
}

/* Pied d'article. */
.hemera-po-fin {
	border-top: 1px solid rgba(31, 41, 55, 0.14);
	margin-top: 56px;
	padding-top: 34px;
}

.hemera-po-fin > p {
	font-size: 15px;
	color: var(--wp--preset--color--gris);
	margin: 0 0 18px;
}

/* Le bandeau d'article : l'image n'a pas de colonne dédiée en mobile,
   elle garde le comportement du bandeau standard. */
.hemera-hero .wp-block-post-featured-image {
	margin: 0;
	height: 100%;
}

.hemera-hero .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center bottom;
}

/* ==================================================================
   18. JOINTURE DU DERNIER BANDEAU ET DU PIED DE PAGE
   ==================================================================
   Le modèle « Pages » pose un remplissage bas sur le <main>, prévu
   pour du texte courant. Quand la page finit par un bandeau pleine
   largeur sur fond sombre, ce remplissage laisse une bande blanche
   entre le bandeau et le pied de page.

   Les modèles « Page avec en-tête visuel », « Page d'accueil » et
   « Publications seules » posent déjà 0 : la règle ne sert qu'aux
   pages restées sur le modèle générique, et cesse d'agir dès qu'un
   bandeau final n'est plus le dernier bloc.
   ------------------------------------------------------------------ */

main.wp-block-group:has(> .wp-block-post-content > .hemera-cta:last-child),
main.wp-block-group:has(> .wp-block-post-content > .hemera-fond-cta:last-child),
main.wp-block-group:has(> .wp-block-post-content > .hemera-danse:last-child),
main.wp-block-group:has(> .hemera-cta:last-child),
main.wp-block-group:has(> .hemera-fond-cta:last-child) {
	padding-bottom: 0;
}

/* Sur les pages, le bandeau final est le dernier bloc du contenu ; sur
   les gabarits du blog et de l'article, il est directement dans le
   <main>. Les deux doivent perdre leur marge de fin, sinon l'espacement
   de bloc global glisse une bande blanche avant le pied de page. */
main.wp-block-group > :last-child,
main.wp-block-group > .wp-block-post-content > :last-child {
	margin-block-end: 0;
}

/* Même raisonnement en haut : une page qui commence par un bandeau
   visuel ne veut pas de remplissage au-dessus de lui. */
main.wp-block-group:has(> .wp-block-post-content > .hemera-hero:first-child),
main.wp-block-group:has(> .wp-block-post-content > .hemera-hero-acc:first-child) {
	padding-top: 0;
}

/* Chapô de récit : trois lignes centrées, en ouverture. */
.hemera-chapo-recit {
	font-style: italic;
	font-size: 1.15rem;
	line-height: 1.6;
	color: var(--wp--preset--color--gris);
	border-bottom: 1px solid rgba(31, 41, 55, 0.14);
	padding-bottom: 26px;
	margin: 0 0 40px;
}

/* Le premier paragraphe d'un article passe en chapô automatiquement.
   Quand c'est le chapô de récit qui ouvre, il garde son propre style. */
.hemera-article .wp-block-post-content > p.hemera-chapo-recit:first-of-type {
	font-size: 1.15rem;
	color: var(--wp--preset--color--gris);
}

/* Bande teintée à l'intérieur d'un article. Elle sort de la colonne
   de 680 px pour occuper la largeur de la fenêtre, et le remplissage
   du corps d'article est neutralisé de part et d'autre. */
.hemera-encadre-recit {
	margin-block: 44px;
}

/* Citation reprise d'un tiers : plus discrète que la parole d'Aurore. */
.hemera-cite-lue {
	background: none;
	border: 0;
	border-left: 3px solid rgba(31, 41, 55, 0.14);
	box-shadow: none;
	border-radius: 0;
	padding: 0 0 0 20px;
	margin: 24px 0;
	font-style: italic;
	color: var(--wp--preset--color--gris);
	font-size: 15.5px;
}

.hemera-cite-lue::before {
	content: none;
}

.hemera-cite-lue p {
	margin: 0;
}

/* Ligne « À demander » des articles de conseils : un rappel d'action
   au bout de chaque question, détaché du corps du texte. */
.hemera-a-demander {
	background: var(--wp--preset--color--bleu-brume);
	border-radius: 8px;
	padding: 13px 18px;
	margin: 1.4em 0 1.8em;
	font-size: 15px;
}

.hemera-a-demander strong {
	font-family: var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--bleu-profond);
}

/* Crédits et sources en pied d'article. */
.hemera-credits {
	border-top: 1px solid rgba(31, 41, 55, 0.14);
	padding-top: 18px;
	margin-top: 40px;
}

/* ==================================================================
   19. CARTES D'ARTICLE DANS UNE BOUCLE
   ==================================================================
   Le bloc Modèle de contenu ne place pas la carte directement dans la
   grille : il l'enveloppe dans un <li class="wp-block-post">. C'est
   donc le <li> qui s'étire à la hauteur de la rangée, et la carte
   qu'il contient garde la sienne. Même mécanisme que pour les
   citations dans des colonnes, un étage plus bas.
   ------------------------------------------------------------------ */

.hemera-liste-articles .hemera-depart {
	align-items: stretch;
}

.hemera-liste-articles .wp-block-post {
	display: flex;
	margin: 0;
}

.hemera-liste-articles .wp-block-post > .hemera-art {
	flex: 1 1 auto;
}

/* Sans image mise en avant, le bloc reste dans le flux et laisse un
   vide en tête de carte. On le retire tant qu'il n'a rien à montrer. */
.hemera-art .wp-block-post-featured-image:not(:has(img)) {
	display: none;
}

/* ==================================================================
   20. ANNONCE D'ÉVÉNEMENT
   ==================================================================
   Produite par [hemera_evenement] et [hemera_evenement_carte]. Le
   mu-plugin ne renvoie rien passé la date : la bande disparaît d'
   elle-même, sans laisser de section vide.
   ------------------------------------------------------------------ */

/* Fond blanc : la bande d'annonce se glisse entre le bandeau visuel et
   la première section, toutes deux blanches. Une teinte ici créerait un
   troisième fond hors de l'alternance. La carte se détache par son
   ombre portée, pas par le fond qui la porte. */
.hemera-evt {
	background: var(--wp--preset--color--blanc);
	padding-block: 26px 6px;
}

/* Vide quand l'événement est passé : la bande ne doit pas subsister. */
.hemera-evt:not(:has(.hemera-evt-carte)) {
	display: none;
}

/* ------------------------------------------------------------------
   Bandeau d'annonce, sur l'accueil.
   Écrit du mobile vers le bureau : une colonne par défaut, trois
   colonnes à partir de 900 px.
   ------------------------------------------------------------------ */

.hemera-evt-carte {
	display: grid;
	gap: 18px;
	background: var(--wp--preset--color--blanc);
	border-radius: 14px;
	padding: 18px clamp(16px, 2.4vw, 22px);
	/* Ombre portée vers le bas seulement. L'ombre des cartes déborde de
	   4 px vers le haut — flou 24, décalage 8, étalement -12 — ce qui se
	   voit sous le bandeau visuel, juste au-dessus. Ici décalage 10 et
	   étalement -14 ramènent la portée haute à zéro. */
	box-shadow: 0 1px 2px rgba(31, 41, 55, 0.04), 0 10px 24px -14px rgba(31, 41, 55, 0.2);
}

@media (min-width: 900px) {
	.hemera-evt-carte {
		/* Le titre prend le tiers, les informations la moitié, le bouton
		   sa largeur propre. */
		grid-template-columns: minmax(210px, 1fr) 2fr auto;
		gap: clamp(20px, 2.4vw, 34px);
		align-items: center;
		padding: 16px clamp(16px, 2.4vw, 24px);
	}
}

.hemera-evt-tete {
	margin: 0;
	text-align: center;
}

@media (min-width: 900px) {
	.hemera-evt-tete {
		text-align: left;
	}
}

.hemera-evt-sur {
	margin: 0 0 4px;
	font-family: var(--wp--preset--font-family--display);
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--orange-texte);
}

.hemera-evt-titre {
	margin: 0;
	/* Un bandeau, pas un titre de page : il annonce sans dominer les
	   informations posées à côté. */
	font-size: clamp(18px, 1.9vw, 22px);
	line-height: 1.2;
	text-wrap: balance;
}

.hemera-evt-ville {
	margin: 6px 0 0;
	font-size: 14px;
	color: var(--wp--preset--color--gris);
}

/* orange-texte et non orange vif : blanc dessus donne 4,85 contre 3,62. */
.hemera-evt-tag {
	display: inline-block;
	margin-top: 7px;
	background: var(--wp--preset--color--orange-texte);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--display);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	padding: 3px 10px;
	border-radius: 11px;
}

/* auto-fit plutôt qu'un nombre fixe : une seule case occupe toute la
   largeur, quatre se répartissent. La grille suit ce qui est saisi. */
.hemera-evt-infos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 18px 4px;
}

@media (min-width: 700px) {
	.hemera-evt-infos {
		gap: 2px;
	}
}

.hemera-evt-i {
	text-align: center;
	padding: 0 10px;
	position: relative;
}

/* Le filet de séparation n'apparaît que sur une seule rangée : empilées,
   les cases n'ont pas de voisine à leur gauche. */
@media (min-width: 700px) {
	.hemera-evt-i + .hemera-evt-i::before {
		content: "";
		position: absolute;
		left: 0;
		top: 14%;
		bottom: 14%;
		width: 1px;
		background: rgba(31, 41, 55, 0.14);
	}
}

.hemera-rond {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 7px;
	color: var(--wp--preset--color--blanc);
}

.hemera-rond svg {
	width: 17px;
	height: 17px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Pastilles : blanc dessus à 4,85, 7,21, 7,21 et 4,90. Le #C97A0A de
   la maquette tombait à 3,35, il passe en #A26208. */
.hemera-rond.r1 { background: var(--wp--preset--color--orange-texte); }
.hemera-rond.r2 { background: var(--wp--preset--color--bleu-profond); }
.hemera-rond.r3 { background: var(--wp--preset--color--bleu-profond); }
.hemera-rond.r4 { background: #A26208; }

.hemera-evt-i b {
	display: block;
	text-wrap: balance;
	font-family: var(--wp--preset--font-family--display);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--wp--preset--color--bleu-profond);
	margin-bottom: 4px;
}

.hemera-evt-i .r1 + b {
	color: var(--wp--preset--color--orange-texte);
}

/* Le :not exclut la pastille. Sans lui, ce sélecteur — une classe et un
   élément — l'emporte sur .hemera-rond, qui n'a qu'une classe : le blanc
   de l'icône était écrasé par le gris des valeurs. */
.hemera-evt-i span:not(.hemera-rond) {
	display: block;
	font-size: 14px;
	line-height: 1.4;
	color: var(--wp--preset--color--gris);
	text-wrap: balance;
}

.hemera-evt-i span:not(.hemera-rond) strong {
	color: var(--wp--preset--color--noir);
	font-weight: 600;
}

.hemera-evt-cta {
	max-width: 150px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	background: var(--wp--preset--color--bleu-profond);
	color: var(--wp--preset--color--blanc);
	border-radius: 12px;
	padding: 14px 18px;
	min-height: 44px;
	/* Centré quand la carte est empilée, calé à droite en rangée. */
	justify-self: center;
	text-align: center;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 13.5px;
	line-height: 1.3;
	transition: background-color 0.18s;
}

.hemera-evt-cta:hover,
.hemera-evt-cta:focus-visible {
	background: var(--wp--preset--color--orange-texte);
	color: var(--wp--preset--color--blanc);
}

.hemera-evt-cta svg {
	width: 19px;
	height: 19px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.7;
}

@media (max-width: 900px) {
	.hemera-evt-cta {
		max-width: none;
		flex-direction: row;
	}
}

/* ==================================================================
   21. FEUILLET D'AGENDA
   ==================================================================
   La carte d'événement du blog, en page de carnet : papier crème,
   reliure spirale débordant à gauche, lignes horizontales, marge
   rouge et coin corné. Valeurs reprises de la maquette.
   ------------------------------------------------------------------ */

.hemera-agenda {
	margin-bottom: 30px;
	max-width: 420px;
	margin-left: 14px;
}

.hemera-agenda-carte {
	position:relative;
	overflow:visible;
	border:0;
	border-radius:2px 4px 4px 2px;
	background:#FCFAF3;
	padding:28px 26px 30px 60px;
	margin-left:14px;
	box-shadow:
    0 1px 0 rgba(31,41,55,.11),
    1px 2px 0 -1px #F1EDE0, 1px 3px 1px -1px rgba(31,41,55,.10),
    2px 4px 0 -2px #EEE9D9, 2px 5px 2px -2px rgba(31,41,55,.08),
    3px 6px 0 -3px #EAE4D2, 3px 7px 2px -3px rgba(31,41,55,.06),
    0 26px 40px -20px rgba(31,41,55,.45);
	transition: transform 0.22s cubic-bezier(0.2, 0.7, 0.3, 1);
}

.hemera-agenda-carte::before {
	content:"";
	position:absolute;
	inset:0;
	z-index:4;
	pointer-events:none;
	border-radius:inherit;
	background:
    linear-gradient(90deg,rgba(31,41,55,.13) 0 6px,rgba(31,41,55,.045) 6px 22px,transparent 40px),
    linear-gradient(180deg,rgba(31,41,55,.045) 0 4px,transparent 18px),
    repeating-linear-gradient(108deg,rgba(122,112,92,.02) 0 2px,transparent 2px 5px),
    radial-gradient(150% 80% at 82% 6%,rgba(255,255,255,.5),transparent 55%)
}

.hemera-agenda-carte::after {
	content:"";
	position:absolute;
	right:-1px;
	bottom:-1px;
	width:30px;
	height:30px;
	z-index:5;
	pointer-events:none;
	background:linear-gradient(135deg,transparent 47%,#EFE9DA 48%,#FCFAF3 74%);
	box-shadow:-2px -2px 5px rgba(31,41,55,.12);
	clip-path:polygon(100% 0,100% 100%,0 100%)
}

.hemera-ag-tete {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	width:38px;
	z-index:0;
	pointer-events:none;
	background:linear-gradient(90deg,#F2EBDA,#FCFAF3 92%);
	border-right:1px solid rgba(31,41,55,.07);
	border-radius:2px 0 0 2px
}

.hemera-ag-spirale {
	position:absolute;
	top:12px;
	bottom:12px;
	left:-30px;
	width:62px;
	z-index:6;
	pointer-events:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2262%22 height=%2230%22 viewBox=%220 0 62 30%22%3E %3Cdefs%3E %3ClinearGradient id=%22w%22 x1=%220%22 y1=%220%22 x2=%22.3%22 y2=%221%22%3E %3Cstop offset=%220%22 stop-color=%22%234E5A64%22/%3E%3Cstop offset=%22.2%22 stop-color=%22%23C4CFD7%22/%3E %3Cstop offset=%22.46%22 stop-color=%22%238A97A3%22/%3E%3Cstop offset=%22.74%22 stop-color=%22%234B565F%22/%3E %3Cstop offset=%221%22 stop-color=%22%2393A0AB%22/%3E %3C/linearGradient%3E %3CradialGradient id=%22h%22 cx=%22.38%22 cy=%22.3%22 r=%22.85%22%3E %3Cstop offset=%220%22 stop-color=%22%236D675C%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23403C36%22/%3E %3Cstop offset=%221%22 stop-color=%22%2324221D%22/%3E %3C/radialGradient%3E %3C/defs%3E %3Cg transform=%22matrix(0 1 1 0 0 0)%22%3E %3Cpath d=%22M15 44C5.5 42 4 20 15 11 25 12 27 28 22.5 39%22 fill=%22none%22 stroke=%22rgba(16,22,28,.34)%22 stroke-width=%225.4%22 stroke-linecap=%22round%22 transform=%22translate(2,1.6)%22/%3E %3C/g%3E %3Cellipse cx=%2244%22 cy=%2215%22 rx=%224.4%22 ry=%225.4%22 fill=%22url(%23h)%22/%3E %3Cpath d=%22M42.6 9.8a4.4 5.4 0 0 1 0 10.4%22 fill=%22none%22 stroke=%22rgba(0,0,0,.5)%22 stroke-width=%221.5%22/%3E %3Cpath d=%22M46.2 10a4.4 5.4 0 0 0 0 10%22 fill=%22none%22 stroke=%22rgba(255,255,255,.8)%22 stroke-width=%221.2%22/%3E %3Cg transform=%22matrix(0 1 1 0 0 0)%22%3E %3Cpath d=%22M15 44C5.5 42 4 20 15 11 25 12 27 28 22.5 39%22 fill=%22none%22 stroke=%22url(%23w)%22 stroke-width=%223.8%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M13.6 43C6.5 40 6 22 14.6 13.2%22 fill=%22none%22 stroke=%22rgba(255,255,255,.55)%22 stroke-width=%221%22 stroke-linecap=%22round%22/%3E %3C/g%3E %3C/svg%3E");
	background-repeat:repeat-y;
	background-position:left top;
	background-size:62px 30px
}

.hemera-agenda-carte > * {
	position: relative;
	z-index: 2;
}

.hemera-agenda-carte .hemera-repere {
	color: var(--wp--preset--color--orange-texte);
	margin-bottom: 10px;
}

.hemera-agenda-carte h3 {
	font-size: 1.12rem;
	margin: 0 0 0.5em;
}

.hemera-agenda-carte p {
	font-size: 14.5px;
	margin: 0;
}

.hemera-agenda-bas {
	margin-top: auto;
	padding-top: 14px;
}

.hemera-agenda-carte:hover {
	transform: translateY(-3px) rotate(-0.25deg);
}

@media (prefers-reduced-motion: reduce) {
	.hemera-agenda-carte {
		transition: none;
	}

	.hemera-agenda-carte:hover {
		transform: none;
	}
}

.hemera-ag-lignes {
	position:absolute;
	left:38px;
	right:0;
	top:0;
	bottom:0;
	z-index:0;
	pointer-events:none;
	background:repeating-linear-gradient(180deg,transparent 0 25px,rgba(66,102,118,.14) 25px 25.8px)
}

.hemera-ag-marge {
	position:absolute;
	left:50px;
	top:0;
	bottom:0;
	width:1px;
	z-index:0;
	pointer-events:none;
	background:linear-gradient(180deg,rgba(188,68,54,.30),rgba(188,68,54,.14))
}

/* Coach à venir : cadre pointillé et fond teinté. La carte annonce une
   arrivée, elle ne doit pas se lire comme une fiche complète. */
.hemera-coach-avenir {
	border: 2px dashed rgba(31, 41, 55, 0.2);
	background: var(--wp--preset--color--bleu-brume);
	box-shadow: none;
	/* Sans liste de diplômes, rien ne remplit la carte : le rôle se
	   retrouvait rejeté en bas, loin du nom. Il reste sous le nom, et
	   le vide passe en pied. */
	justify-content: flex-start;
}

.hemera-coach-avenir .hemera-repere {
	margin-top: 0;
}

.hemera-coach-avenir:hover {
	transform: none;
	box-shadow: none;
}

/* Un lien écrit à la main dans un bloc HTML n'hérite pas de la couleur
   que WordPress applique aux liens du contenu : il sort blanc, donc
   invisible sur un fond clair. Cette classe le rattache à la couleur
   des liens du thème, où qu'il soit. */
.hemera-lien {
	color: var(--wp--preset--color--bleu-profond);
	text-decoration: underline;
}

.hemera-lien:hover,
.hemera-lien:focus-visible {
	text-decoration: none;
}

/* Cadrage centré, pour les bandeaux dont le sujet n'est pas en bas.
   Le cadrage par défaut vise le bas de l'image : juste sur une salle ou
   une façade, il coupe les visages d'une photo de groupe. */
.hemera-hero-centre img {
	object-position: center center;
}

/* Date de dernière mise à jour des pages légales. Produite par
   [hemera_maj], qui retient la plus récente entre la modification de la
   page et celle des données du mu-plugin : un tarif changé dans l'écran
   de réglages met la date à jour sans rouvrir la page. */
.hemera-maj {
	border-top: 1px solid rgba(31, 41, 55, 0.14);
	padding-top: 16px;
	margin-top: 30px;
	font-style: italic;
}

/* Le temps de lecture rejoint la catégorie dans le surtitre de
   l'article. Un point les sépare, posé en CSS pour qu'il disparaisse
   si le shortcode ne renvoie rien. */
.hemera-eyebrow .wp-block-shortcode {
	margin: 0;
	font: inherit;
	color: inherit;
}

.hemera-eyebrow .wp-block-shortcode::before {
	content: "·";
	margin: 0 8px;
	opacity: 0.6;
}

.hemera-eyebrow .wp-block-shortcode:empty {
	display: none;
}

/* Les titres se coupent aux endroits qui les servent. text-wrap répartit
   les lignes au lieu de remplir la première, ce qui évite qu'une
   expression comme « sport santé » se retrouve à cheval.

   L'espace insécable ferait la même chose, mais Rank Math compare le
   mot-clé au contenu brut : &nbsp; au milieu d'une expression lui fait
   perdre la correspondance. Le CSS n'a pas cet effet de bord. */
.hemera-hero h1,
.hemera-hero-acc h1,
.wp-block-heading {
	text-wrap: balance;
}

/* Les titres de bandeau répartissent leurs lignes plutôt que de couper
   au hasard. text-wrap: balance évite les coupures maladroites sans
   toucher au texte : une espace insécable dans le contenu casserait
   l'analyse des extensions de référencement, qui lisent le code source
   et non le texte rendu. */
.hemera-hero h1,
.hemera-hero-acc h1,
.hemera-hero-sous,
.hemera-ha-lead {
	text-wrap: balance;
}

/* « sport santé » ne doit pas se couper en fin de ligne. Une espace
   insécable dans le contenu casserait l'analyse des extensions de
   référencement, qui lisent le code source : la coupure se règle donc
   ici. Le fragment est enveloppé dans un <span> sans texte propre, ce
   que les extensions ignorent. */
.hemera-insec {
	white-space: nowrap;
}

/* Un repère employé comme titre de sous-section annonce le paragraphe
   qui le suit. Une marge haute franche le détache de ce qui précède ;
   en dessous, l'espacement de bloc de WordPress suffit. */
h3.hemera-repere {
	margin-top: 32px;
	margin-bottom: 0;
}

/* L'espace sous le titre ne vient pas de lui : WordPress pose son
   espacement de bloc en marge haute du bloc suivant. C'est donc le
   paragraphe qu'il faut viser, sans marge négative. */
h3.hemera-repere + p {
	margin-top: 6px;
}

/* Le premier de la série suit déjà le titre de section. */
.wp-block-heading + h3.hemera-repere {
	margin-top: 6px;
}

/* Une carte seule dans sa section : elle se centre au lieu de laisser
   une moitié vide à sa droite. */
.hemera-col-centre {
	max-width: 560px;
	margin-inline: auto;
}

/* Encart des bons cadeaux : l'icône, le texte et le bouton sur une
   ligne, le bouton calé à droite. Il repasse en colonne sous 700 px. */
.hemera-cadeau {
	display: flex;
	align-items: center;
	gap: 18px;
	max-width: none;
}

.hemera-cadeau-txt {
	flex: 1 1 auto;
	min-width: 0;
}

.hemera-cadeau-txt h3 {
	margin: 0 0 4px;
	font-size: 18px;
}

.hemera-cadeau-txt p {
	margin: 0;
}

.hemera-cadeau-btn {
	flex: 0 0 auto;
	display: inline-block;
	padding: 11px 22px;
	border-radius: 999px;
	background: var(--wp--preset--color--orange-texte);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	text-decoration: none;
}

.hemera-cadeau-btn:hover,
.hemera-cadeau-btn:focus-visible {
	background: var(--wp--preset--color--noir);
	color: var(--wp--preset--color--blanc);
}

@media (max-width: 700px) {
	.hemera-cadeau {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* Bouton de pause des vidéos en boucle, posé sur l'image. */
.hemera-video-boucle {
	position: relative;
}

.hemera-pause {
	position: absolute;
	right: 14px;
	bottom: 52px;
	z-index: 4;
	padding: 6px 14px;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 20px;
	background: rgba(31, 41, 55, 0.72);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--display);
	font-size: 12.5px;
	font-weight: 500;
	cursor: pointer;
}

.hemera-pause:hover {
	background: rgba(31, 41, 55, 0.92);
}

.hemera-pause:focus-visible {
	outline: 3px solid var(--wp--preset--color--orange-texte);
	outline-offset: 2px;
}

/* Sans le script, le bouton ne sert à rien : on le cache. */
.no-js .hemera-pause {
	display: none;
}

/* Légende de la grille des disponibilités : les deux états, avec la
   même puce que dans la grille. */
.hemera-dispo-legende {
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
	margin-top: 18px;
	font-size: 14px;
	color: var(--wp--preset--color--gris);
}

.hemera-dispo-legende span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.hemera-dispo-legende span::before {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--wp--preset--color--vert, #2E7D5B);
}

.hemera-dispo-legende .pris::before {
	background: var(--wp--preset--color--gris);
}

/* ==================================================================
   FORMULAIRE DE CONTACT
   ================================================================== */

.hemera-form {
	max-width: 620px;
}

/* Le lien de la politique se coupait en fin de ligne. On empêche la
   césure et on laisse la phrase se replier avant lui. */
.hemera-form-rgpd a {
	white-space: nowrap;
}

.hemera-form-note {
	margin: 0 0 22px;
	font-size: 14px;
	color: var(--wp--preset--color--gris);
}

.hemera-form-oblig {
	margin-left: 3px;
	color: var(--wp--preset--color--gris);
	font-weight: 400;
}

.hemera-form p {
	margin: 0 0 18px;
}

.hemera-form label {
	display: block;
	margin-bottom: 6px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.01em;
}

.hemera-form :is(input[type="text"], input[type="email"], input[type="tel"], select, textarea) {
	width: 100%;
	/* Sans quoi le remplissage s'ajoute à la largeur et déborde. */
	box-sizing: border-box;
	padding: 12px 14px;
	border: 1px solid rgba(31, 41, 55, 0.2);
	border-radius: 10px;
	background: var(--wp--preset--color--blanc);
	font: inherit;
	/* 16 px minimum : en dessous, iOS zoome à la mise au point. */
	font-size: 16px;
	line-height: 1.4;
	color: var(--wp--preset--color--noir);
	transition: border-color 0.15s, box-shadow 0.15s;
}

.hemera-form :is(input, select, textarea):hover {
	border-color: rgba(31, 41, 55, 0.4);
}

/* Contour de mise au point en bleu plutôt qu'en orange : à cette
   épaisseur, l'orange se lit comme une alerte. Un trait de 2 px doublé
   d'un halo reste largement visible, y compris au clavier. */
.hemera-form :is(input, select, textarea):focus-visible {
	outline: 2px solid var(--wp--preset--color--bleu-profond);
	outline-offset: 1px;
	border-color: var(--wp--preset--color--bleu-profond);
	box-shadow: 0 0 0 4px rgba(4, 96, 112, 0.12);
}

.hemera-form textarea {
	resize: vertical;
	min-height: 150px;
}

.hemera-form select {
	/* Le chevron du navigateur laisse place à un dessin unique. */
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='1.6' d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 12px;
	padding-right: 40px;
}

/* Deux champs par ligne, empilés sur mobile. */
.hemera-form-duo {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 18px;
}

@media (max-width: 600px) {
	.hemera-form-duo {
		grid-template-columns: 1fr;
	}
}

/* Le champ piège : invisible sans disparaître pour les automates. */
.hemera-form-piege {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.hemera-form-rgpd {
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--wp--preset--color--bleu-brume);
}

.hemera-form-rgpd label {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	font-family: inherit;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.55;
}

.hemera-form-rgpd input {
	/* Cible d'au moins 20 px, alignée sur la première ligne. */
	width: 20px;
	height: 20px;
	margin-top: 1px;
	flex: 0 0 auto;
	accent-color: var(--wp--preset--color--orange-texte);
}

.hemera-form-envoi {
	padding: 14px 34px;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--orange-texte);
	color: var(--wp--preset--color--blanc);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: 16px;
	cursor: pointer;
	transition: background-color 0.15s;
}

.hemera-form-envoi:hover {
	background: var(--wp--preset--color--noir);
}

.hemera-form-envoi:focus-visible {
	outline: 3px solid var(--wp--preset--color--noir);
	outline-offset: 3px;
}

.hemera-form-ok,
.hemera-form-erreur {
	max-width: 620px;
	margin: 0 0 22px;
	padding: 16px 20px;
	border-radius: 12px;
	border-left: 4px solid;
	line-height: 1.55;
}

.hemera-form-ok {
	background: #E9F3EC;
	border-color: #2E7D5B;
}

.hemera-form-erreur {
	background: #FDECEA;
	border-color: #C0392B;
}

@media (prefers-reduced-motion: reduce) {
	.hemera-form :is(input, select, textarea),
	.hemera-form-envoi {
		transition: none;
	}
}

/* Annonce de la prochaine sortie : texte à gauche, image à droite.
   Le bloc entier disparaît quand aucune annonce n'est en cours. */
.hemera-evt-sortie {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 44px;
	align-items: center;
}

@media (max-width: 860px) {
	.hemera-evt-sortie {
		grid-template-columns: 1fr;
		gap: 26px;
	}
}

.hemera-evt-sortie h2 {
	margin-top: 6px;
}

.hemera-evt-sortie-bas {
	margin-top: 22px;
}

.hemera-evt-sortie-img {
	margin: 0;
}

.hemera-evt-sortie-img img {
	width: 100%;
	height: 100%;
	max-height: 320px;
	object-fit: cover;
	border-radius: 16px;
}

/* Date de la carte d'agenda : sous le titre, en couleur d'accent, dans
   sa casse normale. En capitales espacées elle passait sur deux lignes
   et pesait plus lourd que le titre lui-même. */
.hemera-ag-date {
	margin: 4px 0 10px;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: 15px;
	color: var(--wp--preset--color--orange-texte);
}

.hemera-agenda-carte h3 {
	margin-bottom: 0;
}

/* Le texte d'explication de l'annonce, sous le titre. Il tient sur
   quelques lignes : au-delà, c'est la page qui en parle. */
.hemera-evt-texte {
	margin: 8px 0 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--wp--preset--color--gris);
}

/* Surtitre posé sur le fond sombre du bandeau : l'orange sombre y donne
   3,03 contre 1, l'orange clair 7,15. Vaut pour le texte comme pour le
   lien de catégorie des articles. */
.hemera-hero .hemera-eyebrow,
.hemera-hero-acc .hemera-eyebrow {
	color: var(--wp--preset--color--orange-clair);
}

.hemera-hero .hemera-eyebrow a,
.hemera-hero-acc .hemera-eyebrow a {
	color: inherit;
	text-decoration: none;
}

.hemera-hero .hemera-eyebrow a:hover,
.hemera-hero .hemera-eyebrow a:focus-visible {
	text-decoration: underline;
}

/* ------------------------------------------------------------------
   Bouton de partage
   Pas de boutons de réseaux sociaux : le panneau du système sur mobile,
   la copie du lien ailleurs. Aucun traceur, rien à faire consentir.
   ------------------------------------------------------------------ */

.hemera-partage {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid rgba(31, 41, 55, 0.14);
}

.hemera-partage p {
	margin: 0;
	font-size: 14.5px;
	color: var(--wp--preset--color--gris);
}

.hemera-btn-partage {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 9px 16px;
	border: 1px solid rgba(31, 41, 55, 0.16);
	border-radius: 8px;
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--noir);
	font: inherit;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: 14px;
	cursor: pointer;
}

.hemera-btn-partage:hover {
	border-color: var(--wp--preset--color--bleu);
	color: var(--wp--preset--color--bleu-profond);
}

.hemera-btn-partage:focus-visible {
	outline: 3px solid var(--wp--preset--color--bleu);
	outline-offset: 2px;
}

.hemera-btn-partage svg {
	width: 17px;
	height: 17px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Sur un fond sombre : filet, texte et bouton s'inversent. */
.hemera-fond-cta .hemera-partage,
.hemera-danse .hemera-partage {
	border-top-color: rgba(255, 255, 255, 0.18);
}

.hemera-fond-cta .hemera-partage p,
.hemera-danse .hemera-partage p {
	color: rgba(255, 255, 255, 0.72);
}

.hemera-fond-cta .hemera-btn-partage,
.hemera-danse .hemera-btn-partage {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.4);
	color: var(--wp--preset--color--blanc);
}

.hemera-fond-cta .hemera-btn-partage:hover,
.hemera-danse .hemera-btn-partage:hover {
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--noir);
}

/* Le coach sous le nom du cours, dans les grilles de planning. */
.hemera-creneau-coach {
	display: block;
	margin-top: 2px;
	font-size: 12.5px;
	color: var(--wp--preset--color--gris);
}
