/*
 * Club Canin — feuille globale.
 *
 * Reprise fidèle de assets/css/main.css du thème Kahel (Rolly Bueno, GPL-2.0+),
 * augmentée des règles que Kahel déclarait dans theme.json pour les blocs
 * core/paragraph, core/group, core/heading et core/columns. Elles vivent ici,
 * en sélecteurs de classe simples, parce que les blocs Blocs Creator écrivent
 * leur propre balisage : une règle accrochée à `.wp-block-group` ne les
 * atteindrait pas.
 *
 * Les règles propres à une section (héros, chiffres, FAQ…) sont dans la
 * feuille du bloc correspondant : blocs/<identifiant>.css.
 */

/* La marque du site : une patte orange — le motif qu'on retrouve sur les sections. */
.kahel-brandline a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
}

.kahel-brandline a::before {
	content: "";
	width: 28px;
	height: 28px;
	flex-shrink: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F47A1F'%3E%3Cpath d='M12 10.7c-2.9 0-5.9 3.5-5.9 5.9 0 1.6 1.3 2.6 3 2.6 1.2 0 2-.55 2.9-.55s1.7.55 2.9.55c1.7 0 3-1 3-2.6 0-2.4-3-5.9-5.9-5.9Z'/%3E%3Cellipse cx='5.6' cy='10.7' rx='1.9' ry='2.35' transform='rotate(-25 5.6 10.7)'/%3E%3Cellipse cx='9.4' cy='7.3' rx='1.95' ry='2.45' transform='rotate(-8 9.4 7.3)'/%3E%3Cellipse cx='14.6' cy='7.3' rx='1.95' ry='2.45' transform='rotate(8 14.6 7.3)'/%3E%3Cellipse cx='18.4' cy='10.7' rx='1.9' ry='2.35' transform='rotate(25 18.4 10.7)'/%3E%3C/svg%3E") 50% 50% / contain no-repeat;
	rotate: -14deg;
}

/*
 * Titres : GRAS = ORANGE, ITALIQUE = POLICE SECONDAIRE.
 *
 * Une seule règle pour tout le site — sections, blocs natifs, pied de page —
 * et dans l'éditeur (cette feuille y est chargée) : ce qu'on met en forme
 * dans un titre se voit tel qu'il sera publié. Les deux se combinent.
 */
:where(h1, h2, h3, h4, h5, h6) :is(strong, b) {
	color: var(--wp--preset--color--orange);
	font-weight: inherit;
}

:where(h1, h2, h3, h4, h5, h6) :is(em, i) {
	font-family: var(--wp--preset--font-family--source-serif);
	font-style: italic;
	font-weight: 650;
}

/* L'image facultative des héros (club_canin_visuel_hero). */
/* Le cadre porte la pastille : l'image, elle, rogne ce qui dépasse. */
.kahel-hero-visuel-cadre {
	position: relative;
}

.kahel-hero-visuel {
	position: relative;
	margin: 0;
	overflow: hidden;
	border-radius: var(--wp--custom--radius--default);
	background: var(--wp--preset--color--cream);
	box-shadow: var(--wp--preset--shadow--card);
}

.kahel-hero-visuel .kahel-hero-visuel-media {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*
 * Une image cadrée dans l'éditeur (club_canin_style_cadrage) : le point choisi
 * reste visible, et le zoom se resserre autour de lui. Les variables sont
 * posées sur le cadre de l'image.
 */
.kahel-cadrable {
	object-position: var(--kahel-cadrage, 50% 50%);
	transform: scale(var(--kahel-zoom, 1));
	transform-origin: var(--kahel-cadrage, 50% 50%);
}

/* Sous le titre d'un en-tête : une bande large. */
.kahel-hero-visuel-cadre.is-large {
	margin-top: clamp(40px, 6vw, 80px);
}

.kahel-hero-visuel-cadre.is-large .kahel-hero-visuel {
	aspect-ratio: 21 / 9;
}

@media (max-width: 700px) {
	.kahel-hero-visuel-cadre.is-large .kahel-hero-visuel {
		aspect-ratio: 4 / 3;
	}
}

/*
 * La patte (club_canin_pastille) : orange, sans fond, posée à cheval sur un
 * coin d'image ou de panneau, légèrement penchée. Son parent doit être
 * positionné.
 */
:is(.kahel-hero-visuel-cadre, .kahel-home-about-visual-col, .kahel-origin-visual-col, .kahel-cta-cadre) {
	position: relative;
}

.kahel-pastille {
	--kahel-pastille-taille: clamp(76px, 8.5vw, 120px);
	--kahel-pastille-debord: calc(var(--kahel-pastille-taille) * -0.32);

	position: absolute;
	z-index: 3;
	display: block;
	width: var(--kahel-pastille-taille);
	height: var(--kahel-pastille-taille);
	color: var(--wp--preset--color--orange);
	pointer-events: none;
	rotate: -14deg;
}

.kahel-pastille .kahel-picto {
	display: block;
	width: 100%;
	height: 100%;
	/*
	 * Une ombre à peine marquée : la patte reste lisible là où elle passe sur
	 * une photo. Portée par le dessin, pas par la pastille — l'animation
	 * d'apparition remet le `filter` de la pastille à zéro.
	 */
	filter: drop-shadow(0 6px 10px rgba(36, 23, 15, 0.22));
}

/* Sur un fond orange, la patte passe en crème. */
.kahel-pastille.is-creme {
	color: var(--wp--preset--color--cream);
}

.kahel-pastille.is-haut-droite {
	top: var(--kahel-pastille-debord);
	right: var(--kahel-pastille-debord);
}

.kahel-pastille.is-haut-gauche {
	top: var(--kahel-pastille-debord);
	left: var(--kahel-pastille-debord);
}

.kahel-pastille.is-bas-droite {
	right: var(--kahel-pastille-debord);
	bottom: var(--kahel-pastille-debord);
}

.kahel-pastille.is-bas-gauche {
	bottom: var(--kahel-pastille-debord);
	left: var(--kahel-pastille-debord);
}

/* Sur petit écran, elle déborde moins : les marges latérales sont étroites. */
@media (max-width: 700px) {
	.kahel-pastille {
		--kahel-pastille-debord: calc(var(--kahel-pastille-taille) * -0.18);
	}
}

/*
 * Les textes enrichis des sections (club_canin_texte_html) : plusieurs
 * paragraphes ou des listes, dans un conteneur qui garde les classes du texte.
 */
.kahel-texte > * {
	margin-block: 0;
}

.kahel-texte > * + * {
	margin-block-start: 0.85em;
}

.kahel-texte :is(ul, ol) {
	padding-inline-start: 1.25em;
}

.kahel-texte li + li {
	margin-block-start: 0.35em;
}

.kahel-texte ul li::marker {
	color: var(--wp--preset--color--orange);
}

/* Header */
.kahel-header {
	padding-top: var(--wp--custom--header--padding-y);
	padding-bottom: var(--wp--custom--header--padding-y);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.kahel-header-bar {
	gap: var(--wp--preset--spacing--50);
}

/* Le logo du club, tout à gauche ; il remplace la patte devant le nom. */
.kahel-header-marque {
	gap: 12px;
	min-width: 0;
}

.kahel-header-logo {
	flex-shrink: 0;
	margin: 0;
}

.kahel-header-logo img {
	display: block;
	width: 56px;
	height: auto;
}

.kahel-header-marque:has(.kahel-header-logo img) .kahel-header-brand a::before {
	display: none;
}

.kahel-header-brand a {
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: var(--wp--custom--letter-spacing--brand);
}

.kahel-header-brand a::before {
	transition: transform var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease);
}

.kahel-header-brand a:hover::before {
	transform: scale(1.08) rotate(-6deg);
}

.kahel-header-actions {
	gap: var(--wp--custom--header--actions-gap);
}

.kahel-header-actions .wp-block-navigation__container {
	gap: var(--wp--custom--header--nav-gap);
}

/* La page en cours — ou sa rubrique — se repère d'un coup d'œil : orange, plus appuyée, soulignée. */
.kahel-header .wp-block-navigation :is(.current-menu-item, .current-menu-ancestor) > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--orange-deep);
	font-weight: 700;
}

.kahel-header-cta .wp-block-button__link {
	padding: var(--wp--custom--header--cta-padding-y) var(--wp--custom--header--cta-padding-x);
	font-weight: 800;
	box-shadow: var(--wp--preset--shadow--button);
}

/* Footer */
.kahel-footer {
	padding-top: var(--wp--custom--footer--padding-top);
	padding-bottom: var(--wp--custom--footer--padding-bottom);
}

.kahel-footer a:where(:not(.wp-element-button)) {
	color: inherit;
	text-decoration: none;
}

.kahel-footer a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--orange);
}

.kahel-footer-top {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) repeat(2, minmax(160px, 0.45fr));
	gap: var(--wp--custom--footer--top-gap);
	align-items: start;
	padding-bottom: var(--wp--custom--footer--top-padding-bottom);
	border-bottom: 1px solid var(--wp--preset--color--line-on-ink);
}

.kahel-footer-brand {
	max-width: var(--wp--custom--footer--brand-max);
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--50);
}

.kahel-footer-brandline a {
	gap: 12px;
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: -0.035em;
}

.kahel-footer-title {
	max-width: var(--wp--custom--footer--title-max);
	margin: 0;
	font-weight: var(--wp--custom--weight--heading);
	line-height: var(--wp--custom--line-height--section);
	letter-spacing: var(--wp--custom--letter-spacing--h-1);
}

.kahel-footer-copy {
	max-width: var(--wp--custom--footer--copy-max);
	margin: 0;
	line-height: var(--wp--custom--line-height--body);
}

.kahel-footer-cta .wp-block-button__link {
	min-height: var(--wp--custom--footer--cta-min-height);
	font-weight: var(--wp--custom--weight--strong);
	box-shadow: var(--wp--preset--shadow--button-lg);
}

.kahel-footer-nav {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--40);
}

.kahel-footer-nav .wp-block-heading {
	margin: 0;
}

.kahel-footer-nav .wp-block-navigation {
	font-weight: 700;
}

.kahel-footer-nav .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--30);
}

.kahel-footer-bottom {
	padding-top: var(--wp--preset--spacing--50);
	font-size: 0.84rem;
}

.kahel-footer-bottom p {
	margin: 0;
}

.kahel-footer-bottom .wp-block-navigation__container {
	gap: 18px;
}

/* « Site réalisé par… » (inc/credit.php) : sur téléphone, sur sa propre ligne. */
@media (max-width: 600px) {
	.kahel-footer-credit {
		display: block;
		margin-top: 4px;
	}

	.kahel-footer-credit-sep {
		display: none;
	}
}

/*
 * Les réseaux sociaux (inc/reseaux.php) : des pastilles rondes, une icône
 * au centre. Dans le pied de page, sous le bouton ; dans le menu mobile,
 * sous son bouton ; dans le bloc « Informations de contact ».
 */
.kahel-reseaux {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kahel-reseaux .kahel-reseau {
	margin: 0;
}

.kahel-reseaux .kahel-reseau a {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--wp--preset--color--line-on-ink);
	border-radius: 50%;
	color: inherit;
	text-decoration: none;
	transition:
		background-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		border-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		transform 420ms var(--wp--custom--motion--ease-spring);
}

.kahel-reseaux .kahel-reseau svg {
	display: block;
	width: 20px;
	height: 20px;
	fill: currentColor;
}

.kahel-reseaux .kahel-reseau a:is(:hover, :focus-visible) {
	border-color: var(--wp--preset--color--orange);
	background: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--ink);
	transform: translateY(-3px);
}

.kahel-footer .kahel-footer-reseaux {
	margin-top: 4px;
}

@media (max-width: 900px) {
	.kahel-footer-top {
		grid-template-columns: 1fr 1fr;
	}

	.kahel-footer-brand {
		grid-column: 1 / -1;
	}
}

/*
 * Sur mobile, un pied de page resserré : les deux colonnes de liens restent
 * côte à côte, les marges et les tailles se réduisent, le bas tient en deux
 * lignes courtes.
 */
@media (max-width: 600px) {
	.kahel-footer {
		padding-top: 56px;
		padding-bottom: 20px;
	}

	.kahel-footer-top {
		gap: 36px 20px;
		padding-bottom: 32px;
	}

	.kahel-footer-brand {
		gap: 16px;
	}

	/* Les écarts viennent des `gap` : pas de marge de flux en plus. */
	.kahel-footer-brand > *,
	.kahel-footer-nav > * {
		margin-block: 0;
	}

	.kahel-footer-brand .wp-block-buttons {
		margin-top: 6px;
	}

	.kahel-footer-title {
		font-size: clamp(1.6rem, 7.5vw, 2rem) !important;
	}

	.kahel-footer-copy {
		font-size: 0.92rem;
	}

	.kahel-footer-cta .wp-block-button__link {
		min-height: 46px;
	}

	.kahel-footer-nav {
		gap: 14px;
	}

	.kahel-footer-nav .wp-block-navigation__container {
		gap: 10px;
	}

	.kahel-footer-bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
		padding-top: 20px;
		font-size: 0.78rem;
	}

	.kahel-footer-bottom .wp-block-navigation__container {
		gap: 6px 16px;
	}
}

/* Single */
.kahel-single-header {
	padding-top: var(--wp--custom--single--header-padding-top);
	padding-bottom: var(--wp--custom--single--header-padding-bottom);
}

/*
 * L'image ouvre l'article, le titre vient dessous. Sans image, c'est
 * l'en-tête qui ouvre la page, avec l'écart habituel sous l'en-tête du site.
 * (Deux classes de plus que l'écart des mises en page de WordPress,
 * `:root :where(.is-layout-constrained) > :first-child`.)
 */
.kahel-single > .kahel-single-featured:first-child {
	margin-block-start: var(--wp--custom--page--ecart-sous-entete);
}

.kahel-single > .kahel-single-featured + .kahel-single-header {
	margin-block-start: 0;
	padding-top: var(--wp--custom--single--titre-sous-image);
}

.kahel-single-kicker {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 22px;
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: var(--wp--custom--letter-spacing--kicker);
	text-transform: uppercase;
}

.kahel-single-kicker::before {
	content: "";
	width: var(--wp--custom--single--kicker-rule);
	height: 3px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--orange);
}

.kahel-single-kicker .wp-block-post-terms__separator {
	margin: 0 0.15em;
}

/* Pleine largeur de l'en-tête : une largeur plus étroite serait centrée par la
 * mise en page « contrainte » et décalerait le titre par rapport au surtitre. */
.kahel-single-title {
	margin: 0;
	text-wrap: balance;
}

.kahel-single-deck {
	margin-top: 30px;
}

/* Fil d'Ariane */
.kahel-fil-ariane {
	margin: 0 0 22px;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--caption);
}

.kahel-fil-ariane ol {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.kahel-fil-ariane li {
	display: flex;
	align-items: baseline;
	min-width: 0;
	margin: 0;
}

.kahel-fil-ariane li + li::before {
	content: "›";
	margin: 0 0.6em;
	color: var(--wp--preset--color--orange);
	font-weight: var(--wp--custom--weight--strong);
}

.kahel-fil-ariane a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--line-strong);
	text-underline-offset: 3px;
	transition: color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease);
}

.kahel-fil-ariane a:hover,
.kahel-fil-ariane a:focus-visible {
	color: var(--wp--preset--color--orange-deep);
	text-decoration-color: currentColor;
}

.kahel-fil-ariane [aria-current="page"] {
	max-width: 32ch;
	overflow: hidden;
	color: var(--wp--preset--color--ink);
	font-weight: var(--wp--custom--weight--feature);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.kahel-single-deck .wp-block-post-excerpt__excerpt {
	margin: 0;
}

.kahel-single-deck .wp-block-post-excerpt__more-text {
	display: none;
}

/* Image à la une : un peu plus étroite que la grille large, format photo fixe. */
.kahel-single-featured {
	max-width: var(--wp--custom--single--featured-max);
	aspect-ratio: 3 / 2;
}

.kahel-single-featured img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*
 * Sous le titre, sur une ligne calée sur les bords de l'image : le fil
 * d'Ariane à gauche, la date à droite. Quand la place manque, c'est le titre
 * de l'article, au bout du fil, qui se raccourcit.
 */
.kahel-single-sous-image {
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap: 8px 24px;
	max-width: var(--wp--custom--single--featured-max);
	padding-top: 16px;
	border-top: 1px solid var(--wp--preset--color--line);
}

.kahel-single > .kahel-single-header + .kahel-single-sous-image {
	margin-block-start: 0;
}

.kahel-single-sous-image .kahel-fil-ariane {
	flex: 0 1 auto;
	min-width: 0;
	margin: 0;
}

.kahel-single-sous-image .kahel-fil-ariane ol {
	flex-wrap: nowrap;
}

.kahel-single-sous-image .kahel-fil-ariane li {
	flex: none;
}

.kahel-single-sous-image .kahel-fil-ariane li:last-child {
	flex: 0 1 auto;
	min-width: 0;
}

.kahel-single-sous-image .kahel-single-date {
	flex: none;
	margin: 0 0 0 auto;
	white-space: nowrap;
}

/* Sur un téléphone, le titre de l'article, juste au-dessus, ne se répète pas au bout du fil (il reste lu par les lecteurs d'écran). */
@media (max-width: 480px) {
	.kahel-single-sous-image .kahel-fil-ariane li:last-child {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
}

.kahel-single-content:where(:not([class*="wp-block-club-canin-"] *)) {
	margin-top: var(--wp--custom--single--content-margin-top);
}

.kahel-single-content > p:first-of-type::first-letter {
	float: left;
	margin: 8px 10px 0 0;
	color: var(--wp--preset--color--orange);
	font-size: var(--wp--custom--single--drop-cap-size);
	font-weight: var(--wp--custom--weight--strong);
	line-height: 0.72;
}

/* In-content heading scale (not hero/post-title sizes) */
.kahel-single-content h1:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content h1:where(:not([class*="wp-block-club-canin-"] *)) {
	max-width: none;
	margin: 2.2em 0 0.6em;
	font-size: var(--wp--preset--font-size--content);
	font-weight: var(--wp--custom--weight--heading);
	letter-spacing: var(--wp--custom--letter-spacing--content);
	line-height: var(--wp--custom--line-height--content);
}

.kahel-single-content h2:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content h2:where(:not([class*="wp-block-club-canin-"] *)) {
	margin: 2.5em 0 0.7em;
	font-size: var(--wp--preset--font-size--h-2);
	font-weight: var(--wp--custom--weight--heading);
	letter-spacing: var(--wp--custom--letter-spacing--h-2);
	line-height: var(--wp--custom--line-height--heading);
}

.kahel-single-content h3:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content h3:where(:not([class*="wp-block-club-canin-"] *)) {
	margin: 2em 0 0.55em;
	font-size: var(--wp--preset--font-size--h-3);
	font-weight: var(--wp--custom--weight--heading);
	letter-spacing: var(--wp--custom--letter-spacing--h-3);
	line-height: var(--wp--custom--line-height--heading);
}

.kahel-single-content h4:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content h5:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content h6:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content h4:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content h5:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content h6:where(:not([class*="wp-block-club-canin-"] *)) {
	margin: 1.75em 0 0.5em;
}

/* Classic HTML polish — theme.json block css uses :where(), so UA th/code win otherwise */
.kahel-single-content code:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content kbd:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content samp:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content code:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content kbd:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content samp:where(:not([class*="wp-block-club-canin-"] *)) {
	padding: 0.12em 0.4em;
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--cream);
	font-size: 0.92em;
}

.kahel-single-content pre:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content pre:where(:not([class*="wp-block-club-canin-"] *)) {
	padding: 1.1rem 1.25rem;
	overflow-x: auto;
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--cream);
}

.kahel-single-content pre code:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content pre code:where(:not([class*="wp-block-club-canin-"] *)) {
	padding: 0;
	background: transparent;
}

.kahel-single-content hr:not(.is-style-dots):where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content hr:not(.is-style-dots):where(:not([class*="wp-block-club-canin-"] *)) {
	border: 0;
	height: 1px;
	background: var(--wp--preset--color--line);
}

.kahel-single-content hr.is-style-dots:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content hr.is-style-dots:where(:not([class*="wp-block-club-canin-"] *)) {
	border: 0;
	height: auto;
	background: none;
	line-height: 1;
	text-align: center;
	overflow: visible;
}

.kahel-single-content hr.is-style-dots:where(:not([class*="wp-block-club-canin-"] *))::before,
.kahel-page-content hr.is-style-dots:where(:not([class*="wp-block-club-canin-"] *))::before {
	color: var(--wp--preset--color--muted);
}

/* Classic [gallery] shortcode — block themes skip WP's default float styles. */
.gallery {
	display: grid;
	gap: 1rem;
	margin: 0 0 1.5em;
}

.gallery-columns-1 {
	grid-template-columns: 1fr;
}

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

.gallery-columns-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, minmax(0, 1fr));
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, minmax(0, 1fr));
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, minmax(0, 1fr));
}

.gallery-item {
	margin: 0;
	text-align: center;
}

.gallery-icon {
	margin: 0;
}

.gallery-icon img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
	border-radius: var(--wp--custom--radius--default);
}

.gallery-caption {
	margin: 0.5em 0 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
}

@media (max-width: 600px) {
	.gallery-columns-3,
	.gallery-columns-4,
	.gallery-columns-5,
	.gallery-columns-6,
	.gallery-columns-7,
	.gallery-columns-8,
	.gallery-columns-9 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.kahel-single-content mark:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content mark:where(:not([class*="wp-block-club-canin-"] *)) {
	background: var(--wp--preset--color--apricot);
	color: var(--wp--preset--color--ink);
	padding: 0.05em 0.2em;
}

.kahel-single-content dl:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content dl:where(:not([class*="wp-block-club-canin-"] *)) {
	margin: 1.5em 0;
}

.kahel-single-content dt:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content dt:where(:not([class*="wp-block-club-canin-"] *)) {
	font-weight: 800;
	margin-top: 0.85em;
}

.kahel-single-content dd:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content dd:where(:not([class*="wp-block-club-canin-"] *)) {
	margin: 0.35em 0 0;
	color: var(--wp--preset--color--muted);
}

.kahel-single-content .wp-block-table:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content table:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content .wp-block-table:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content table:where(:not([class*="wp-block-club-canin-"] *)) {
	width: 100%;
	max-width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--custom--table--font-size);
}

.kahel-single-content .wp-block-table:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content .wp-block-table:where(:not([class*="wp-block-club-canin-"] *)) {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
}

.kahel-single-content .wp-block-table table:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content .wp-block-table table:where(:not([class*="wp-block-club-canin-"] *)) {
	margin: 0;
	border: 0;
}

.kahel-single-content th:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content td:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content th:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content td:where(:not([class*="wp-block-club-canin-"] *)) {
	padding: var(--wp--custom--table--cell-padding);
	border: 1px solid var(--wp--preset--color--line);
	text-align: left;
	vertical-align: top;
}

.kahel-single-content thead th:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content thead td:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-single-content th:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content thead th:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content thead td:where(:not([class*="wp-block-club-canin-"] *)),
.kahel-page-content th:where(:not([class*="wp-block-club-canin-"] *)) {
	background: var(--wp--preset--color--cream);
	font-weight: 800;
}

.kahel-single-content > table,
.kahel-page-content > table {
	display: block;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
}

.kahel-single-content > table th:first-child,
.kahel-single-content > table td:first-child,
.kahel-page-content > table th:first-child,
.kahel-page-content > table td:first-child {
	border-left: 0;
}

.kahel-single-content > table th:last-child,
.kahel-single-content > table td:last-child,
.kahel-page-content > table th:last-child,
.kahel-page-content > table td:last-child {
	border-right: 0;
}

.kahel-single-content > table tr:first-child th,
.kahel-single-content > table tr:first-child td,
.kahel-page-content > table tr:first-child th,
.kahel-page-content > table tr:first-child td {
	border-top: 0;
}

.kahel-single-content > table tr:last-child th,
.kahel-single-content > table tr:last-child td,
.kahel-page-content > table tr:last-child th,
.kahel-page-content > table tr:last-child td {
	border-bottom: 0;
}

.kahel-single-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 60px;
	padding-top: 28px;
	border-top: 1px solid var(--wp--preset--color--line);
}

.kahel-single-tags a {
	padding: 8px 12px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--pill);
	font-weight: 800;
	text-decoration: none;
}

.kahel-single-related {
	padding: var(--wp--preset--spacing--100) 0;
	border-top: 1px solid var(--wp--preset--color--line);
}

.kahel-single-related-kicker {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 18px;
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: var(--wp--custom--letter-spacing--kicker);
	text-transform: uppercase;
}

.kahel-single-related-kicker::before {
	content: "";
	width: var(--wp--custom--single--kicker-rule);
	height: 3px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--orange);
}

.kahel-related-card {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
}

/* La mise en page « contrainte » centre ses enfants (marges auto !important) :
 * dans une colonne flex, chacun rétrécirait à son contenu et se centrerait. */
.kahel-related-card > * {
	align-self: stretch;
	max-width: none;
	margin-inline: 0 !important;
}

.kahel-related-card .wp-block-post-featured-image {
	border-radius: var(--wp--custom--stories--art-radius);
}

@media (max-width: 900px) {
	.kahel-related-query .wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 560px) {
	.kahel-related-query .wp-block-post-template {
		grid-template-columns: 1fr !important;
	}
}

/* Pagination */
.kahel-pagination {
	margin-top: var(--wp--custom--pagination--margin-top);
	gap: var(--wp--custom--pagination--gap);
}

.kahel-pagination .wp-block-query-pagination-numbers {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--wp--custom--pagination--gap);
}

.kahel-pagination .page-numbers,
.kahel-pagination .wp-block-query-pagination-previous,
.kahel-pagination .wp-block-query-pagination-next {
	box-sizing: border-box;
	display: inline-grid;
	place-items: center;
	min-width: var(--wp--custom--pagination--size);
	min-height: var(--wp--custom--pagination--size);
	padding: 0 12px;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--pagination--radius);
	font-size: 0.84rem;
	font-weight: 850;
	line-height: 1;
	text-decoration: none;
	color: var(--wp--preset--color--ink);
	background: transparent;
}

.kahel-pagination .page-numbers:hover,
.kahel-pagination .wp-block-query-pagination-previous:hover,
.kahel-pagination .wp-block-query-pagination-next:hover {
	border-color: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--orange-deep);
}

.kahel-pagination .page-numbers.current,
.kahel-pagination .page-numbers[aria-current="page"] {
	border-color: var(--wp--preset--color--orange);
	background: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--ink);
}

.kahel-pagination .page-numbers.dots {
	min-width: auto;
	border: 0;
	padding-inline: 4px;
}

@media (max-width: 560px) {
	.kahel-pagination {
		justify-content: flex-start;
		overflow-x: auto;
	}
}


/* Motion keyframes — theme.json can reference these, not declare them */
@keyframes kahel-rise {
	from {
		opacity: 0;
		transform: translateY(var(--wp--custom--motion--enter-distance));
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes kahel-flotte {
	0%,
	100% {
		transform: translate(-50%, -50%) translateY(0) rotate(-1.2deg);
	}

	50% {
		transform: translate(-50%, -50%) translateY(-12px) rotate(1.6deg);
	}
}

/*
 * L'illustration « patte de chien » (club_canin_illustration_patte) : ce qui
 * remplit un visuel orange tant qu'aucune photo n'est choisie — sections
 * « À propos » et « Image & texte », page 404.
 */
.kahel-patte-illu {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.kahel-patte-illu-patte {
	position: absolute;
	left: 50%;
	top: 52%;
	display: block;
	width: min(62%, 380px);
	height: auto;
	overflow: visible;
	color: var(--wp--preset--color--orange-deep);
	transform: translate(-50%, -50%);
	animation: kahel-flotte var(--wp--custom--motion--duration-float) var(--wp--custom--motion--ease-soft) infinite;
}

/* Un reflet à plat, sans modelé : la patte reste une forme graphique. */
.kahel-patte-illu-reflet {
	fill: var(--wp--preset--color--cream);
	opacity: 0.28;
}

/* Les doigts remuent l'un après l'autre, comme une patte qui s'étire. */
.kahel-patte-illu-doigt {
	transform-box: fill-box;
	transform-origin: 50% 100%;
	animation: kahel-patte-doigt var(--wp--custom--motion--duration-float) var(--wp--custom--motion--ease-soft) infinite;
	animation-delay: calc(var(--kahel-doigt, 0) * 180ms);
}

/* La trace de pas crème qui traverse le cadre, un pas après l'autre. */
.kahel-patte-illu-pas {
	position: absolute;
	width: clamp(34px, 11%, 60px);
	aspect-ratio: 1;
	color: var(--wp--preset--color--cream);
	opacity: 0.3;
	translate: -50% -50%;
	animation: kahel-patte-pas 4.8s var(--wp--custom--motion--ease-soft) infinite;
	animation-delay: calc(var(--kahel-pas, 0) * 600ms);
}

.kahel-patte-illu-pas .kahel-picto {
	display: block;
	width: 100%;
	height: 100%;
}

@keyframes kahel-patte-doigt {
	0%,
	60%,
	100% {
		transform: translateY(0) scale(1);
	}

	30% {
		transform: translateY(-5px) scale(1.04);
	}
}

@keyframes kahel-patte-pas {
	0%,
	100% {
		opacity: 0.14;
	}

	25% {
		opacity: 0.42;
	}
}

/* 404 — card accents theme.json cannot express */
.kahel-404-search:focus-within {
	border-color: var(--wp--preset--color--orange);
	box-shadow: var(--wp--preset--shadow--focus);
}

.kahel-404-links a {
	text-decoration: none;
}

.kahel-404-recent-meta {
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.kahel-404-recent-query .wp-block-post:nth-child(2) .kahel-404-recent-card {
	background: var(--wp--preset--color--cream);
}

.kahel-404-recent-query .wp-block-post:nth-child(3) .kahel-404-recent-card {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--cream);
}

.kahel-404-recent-query .wp-block-post:nth-child(3) .kahel-404-recent-meta {
	color: var(--wp--preset--color--orange);
}

.kahel-404-recent-query .wp-block-post:nth-child(3) .kahel-404-recent-card-title a {
	color: inherit;
}

@media (max-width: 850px) {
	.kahel-404-hero {
		min-height: auto;
	}

	.kahel-404-visual {
		min-height: var(--wp--custom--error--visual-min-height-mobile);
	}
}

@media (max-width: 620px) {
	.kahel-404-search {
		border-radius: var(--wp--custom--radius--md);
	}

	.kahel-404-visual {
		min-height: 360px;
		border-radius: 22px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wp-element-button,
	.wp-element-button:hover,
	.wp-element-button:active,
	a:where(:not(.wp-element-button)),
	.kahel-header-brand a::before,
	.kahel-404-search {
		transition: none !important;
		transform: none !important;
	}

	.kahel-404-title,
	.kahel-404-visual,
	.kahel-404-code,
	.kahel-patte-illu-patte,
	.kahel-patte-illu-doigt,
	.kahel-patte-illu-pas {
		animation: none !important;
	}
}

/* Archive (gabarits home, archive, index) */
/* Stories archive — HTML/archive.html (grid stagger, filters, decorative art) */
.kahel-archive-filters {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--custom--stories--filter-gap);
}

.kahel-archive-filter {
	padding: var(--wp--custom--stories--filter-padding);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--pill);
	background: transparent;
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--custom--stories--filter-size);
	font-weight: 800;
	line-height: 1.2;
	text-decoration: none;
}

.kahel-archive-filter:hover,
.kahel-archive-filter:focus-visible {
	border-color: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--orange-deep);
}

.kahel-archive-filter.is-active,
.kahel-archive-filter[aria-current="page"] {
	border-color: var(--wp--preset--color--orange);
	background: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--ink);
}

.kahel-archive-grid.wp-block-post-template {
	gap: var(--wp--custom--stories--grid-row-gap) var(--wp--custom--stories--grid-column-gap);
}

/*
 * La recherche, au bout de la barre des catégories (inc/actualites.php) :
 * une pilule avec la loupe à gauche et la flèche pour lancer à droite.
 */
.kahel-archive-recherche {
	position: relative;
	display: flex;
	flex: 0 1 var(--wp--custom--stories--recherche-largeur);
	align-items: center;
	min-width: 0;
	margin: 0 0 0 auto;
}

/* L'intitulé reste lu par les lecteurs d'écran ; à l'écran, le texte du champ suffit. */
.kahel-archive-recherche-libelle {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.kahel-archive-recherche-loupe {
	position: absolute;
	left: 16px;
	color: var(--wp--preset--color--orange);
	pointer-events: none;
	transition: transform 420ms var(--wp--custom--motion--ease-spring);
}

.kahel-archive-recherche:focus-within .kahel-archive-recherche-loupe {
	transform: scale(1.12) rotate(-8deg);
}

.kahel-archive-recherche input[type="search"] {
	box-sizing: border-box;
	width: 100%;
	height: var(--wp--custom--stories--recherche-hauteur);
	margin: 0;
	padding: 0 50px 0 42px;
	border: 1px solid var(--wp--preset--color--line-strong);
	border-radius: var(--wp--custom--radius--pill);
	background: #fff;
	color: var(--wp--preset--color--ink);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 600;
	-webkit-appearance: none;
	appearance: none;
	transition:
		border-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		box-shadow var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease);
}

.kahel-archive-recherche:has(.kahel-archive-recherche-effacer) input[type="search"] {
	padding-right: 84px;
}

.kahel-archive-recherche input[type="search"]::placeholder {
	color: var(--wp--preset--color--muted);
	font-weight: 500;
	opacity: 0.85;
}

.kahel-archive-recherche input[type="search"]:hover {
	border-color: var(--wp--preset--color--orange);
}

.kahel-archive-recherche input[type="search"]:focus {
	border-color: var(--wp--preset--color--orange);
	outline: none;
	box-shadow: 0 0 0 4px rgba(244, 122, 31, 0.18);
}

/* La croix du navigateur vide le champ sans rien relancer : la nôtre efface la recherche. */
.kahel-archive-recherche input[type="search"]::-webkit-search-cancel-button,
.kahel-archive-recherche input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
	appearance: none;
}

.kahel-archive-recherche-effacer,
.kahel-archive-recherche-bouton {
	position: absolute;
	display: grid;
	place-items: center;
	padding: 0;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition:
		background-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		transform 420ms var(--wp--custom--motion--ease-spring);
}

.kahel-archive-recherche-effacer {
	right: 46px;
	width: 30px;
	height: 30px;
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--ink);
}

.kahel-archive-recherche-effacer:hover,
.kahel-archive-recherche-effacer:focus-visible {
	background: var(--wp--preset--color--apricot);
	transform: rotate(90deg);
}

.kahel-archive-recherche-bouton {
	right: 5px;
	width: 34px;
	height: 34px;
	background: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--ink);
}

.kahel-archive-recherche-bouton:hover,
.kahel-archive-recherche-bouton:focus-visible {
	background: var(--wp--preset--color--orange-deep);
	color: #fff;
}

.kahel-archive-recherche-bouton:hover svg,
.kahel-archive-recherche-bouton:focus-visible svg {
	transform: translateX(2px);
}

.kahel-archive-recherche-bouton svg {
	transition: transform 420ms var(--wp--custom--motion--ease-spring);
}

/* Sous la barre : le nombre d'articles à gauche, le tri à droite. */
.kahel-archive-bilan {
	gap: 8px 24px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--wp--custom--stories--tools-margin-bottom);
}

.kahel-archive .kahel-archive-tools + .kahel-archive-bilan {
	margin-block-start: var(--wp--custom--stories--bilan-margin-top);
}

.kahel-archive-tri {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 16px;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--custom--stories--count-size);
}

.kahel-archive-tri-lien {
	padding-bottom: 2px;
	border-bottom: 2px solid transparent;
	color: var(--wp--preset--color--muted);
	font-weight: 700;
	text-decoration: none;
	transition:
		color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		border-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease);
}

.kahel-archive-tri-lien:hover,
.kahel-archive-tri-lien:focus-visible {
	color: var(--wp--preset--color--orange-deep);
}

.kahel-archive-tri-lien.is-active {
	border-bottom-color: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--ink);
	font-weight: 800;
}

/* Rien trouvé : le message et de quoi repartir, à la place de la grille. */
.kahel-archive-vide {
	padding: clamp(28px, 4vw, 48px);
	border-radius: var(--wp--custom--stories--art-radius);
	background: var(--wp--preset--color--cream);
	text-align: center;
}

.kahel-archive-vide p {
	margin: 0;
}

.kahel-archive-vide .kahel-archive-vide-titre {
	font-size: var(--wp--preset--font-size--feature);
	font-weight: var(--wp--custom--weight--heading);
	letter-spacing: -0.02em;
	line-height: 1.25;
	text-wrap: balance;
}

.kahel-archive-vide .kahel-archive-vide-aide {
	margin-top: 10px;
	color: var(--wp--preset--color--muted);
}

.kahel-archive-vide .kahel-archive-vide-liens {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 26px;
	margin-top: 20px;
}

.kahel-archive-vide-liens a {
	color: var(--wp--preset--color--orange-deep);
	font-weight: 800;
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.kahel-archive-vide-liens a:hover,
.kahel-archive-vide-liens a:focus-visible {
	color: var(--wp--preset--color--ink);
}

/* Toutes les cartes ont la même taille : même format d'image, même hauteur
   sur une rangée, « Lire la suite » calé en bas. */
.kahel-archive-grid > .wp-block-post {
	display: flex;
	min-width: 0;
}

.kahel-archive-grid .kahel-archive-story {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-width: 0;
}

.kahel-archive-grid .kahel-archive-story > * {
	width: 100%;
}

.kahel-archive-grid .kahel-archive-story-art {
	flex: 0 0 auto;
	min-height: 0;
	aspect-ratio: 4 / 3;
}

.kahel-archive-grid .kahel-archive-story-title,
.kahel-archive-grid .kahel-archive-story-excerpt .wp-block-post-excerpt__excerpt {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.kahel-archive-grid .kahel-archive-story-excerpt .wp-block-post-excerpt__excerpt {
	margin: 0;
}

/* La mise en page « contrainte » centre ses enfants (marges auto !important) :
   dans une colonne flex, le lien se retrouverait centré. */
.kahel-archive-grid .kahel-archive-story > .kahel-archive-story-more {
	align-self: flex-start;
	width: auto;
	margin-top: auto;
	margin-inline: 0 !important;
	padding-top: var(--wp--custom--stories--more-margin-top);
}

.kahel-archive-story-media {
	margin: 0;
}

.kahel-archive-story-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.kahel-archive-story-art:has(img) {
	background: transparent;
}

.kahel-archive-story-art:has(img) .kahel-archive-story-media {
	position: absolute;
	inset: 0;
}

.kahel-archive-story-art:not(:has(img))::before,
.kahel-archive-story-art:not(:has(img))::after {
	content: "";
	position: absolute;
}

.kahel-archive-story-art:not(:has(img))::before {
	width: 44%;
	aspect-ratio: 1;
	left: 16%;
	top: 20%;
	border-radius: 50%;
	background: var(--wp--preset--color--orange);
	box-shadow: 85px 52px 0 rgba(255, 244, 232, 0.85);
}

.kahel-archive-story-art:not(:has(img))::after {
	left: 10%;
	right: 10%;
	bottom: 13%;
	height: 10px;
	background: var(--wp--preset--color--ink);
	box-shadow: 0 -22px 0 var(--wp--preset--color--ink);
}

.kahel-archive-grid > .wp-block-post:nth-child(2) .kahel-archive-story-art:not(:has(img)) {
	background: var(--wp--preset--color--leaf);
}

.kahel-archive-grid > .wp-block-post:nth-child(3) .kahel-archive-story-art:not(:has(img)) {
	background: var(--wp--preset--color--ink);
}

.kahel-archive-grid > .wp-block-post:nth-child(4) .kahel-archive-story-art:not(:has(img)) {
	background: var(--wp--preset--color--orange);
}

.kahel-archive-grid > .wp-block-post:nth-child(5) .kahel-archive-story-art:not(:has(img)) {
	background: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--line);
}

.kahel-archive-grid > .wp-block-post:nth-child(6) .kahel-archive-story-art:not(:has(img)) {
	background: var(--wp--custom--stories--art-warm);
}

.kahel-archive-grid > .wp-block-post:nth-child(even) .kahel-archive-story-art:not(:has(img))::before {
	left: 30%;
	border-radius: 50% 45% 48% 52%;
	box-shadow: none;
}

.kahel-archive-grid > .wp-block-post:nth-child(3n) .kahel-archive-story-art:not(:has(img))::after {
	inset: 15%;
	height: auto;
	border: 2px solid var(--wp--preset--color--apricot);
	background: transparent;
	box-shadow: none;
	transform: rotate(8deg);
}

.kahel-archive .kahel-pagination {
	margin: var(--wp--custom--pagination--margin-top) 0;
	justify-content: center;
}

.kahel-archive .kahel-pagination .wp-block-query-pagination-next {
	margin-left: var(--wp--custom--pagination--gap);
}

@media (max-width: 900px) {
	.kahel-archive-grid.wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 560px) {
	.kahel-archive-header {
		padding-top: var(--wp--custom--stories--header-padding-top-mobile);
	}

	.kahel-archive-tools {
		align-items: flex-start;
		flex-direction: column;
	}

	.kahel-archive-recherche {
		flex: none;
		width: 100%;
		margin: 0;
	}

	.kahel-archive-grid.wp-block-post-template {
		grid-template-columns: 1fr !important;
	}
}

/*
 * Un formulaire qui part (classe `is-envoi`, posée par son script pendant
 * l'envoi — contact, inscription) : une roue tourne dans le bouton d'envoi,
 * devant son texte.
 */
form.is-envoi button[type="submit"].wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	cursor: progress;
}

form.is-envoi button[type="submit"].wp-element-button::before {
	content: "";
	flex: none;
	box-sizing: border-box;
	width: 1.15em;
	height: 1.15em;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: kahel-envoi-tourne 700ms linear infinite;
}

@keyframes kahel-envoi-tourne {
	to {
		transform: rotate(360deg);
	}
}

/* Moins de mouvement : la roue tourne quand même (c'est elle qui dit que ça part), plus lentement. */
@media (prefers-reduced-motion: reduce) {
	form.is-envoi button[type="submit"].wp-element-button::before {
		animation-duration: 1.8s;
	}
}

/* Bouton contour — l'emporte sur la pilule pleine de .wp-element-button */
.wp-block-button.kahel-button-outline .wp-block-button__link.wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--wp--custom--button--min-height);
	padding: 0 20px;
	border: 1.5px solid var(--wp--preset--color--orange);
	border-radius: var(--wp--custom--radius--md);
	background: transparent;
	color: var(--wp--preset--color--orange-deep);
	box-shadow: none;
	font-weight: 800;
	transform: none;
}

.wp-block-button.kahel-button-outline .wp-block-button__link.wp-element-button:hover,
.wp-block-button.kahel-button-outline .wp-block-button__link.wp-element-button:focus {
	background: var(--wp--preset--color--orange);
	color: var(--wp--preset--color--ink);
	transform: none;
}

.kahel-home-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0;
	margin-top: var(--wp--custom--home--actions-margin-top);
}

.kahel-home-actions .wp-block-buttons {
	width: auto;
	margin: 0;
}

.kahel-home-actions .wp-block-button {
	margin: 0;
}

.kahel-home-actions .kahel-home-text-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 0 var(--wp--custom--home--text-link-gap);
}

/* ------------------------------------------------------------------ *
 * Règles que Kahel déclarait dans theme.json (blocs core), en classes.
 * ------------------------------------------------------------------ */

.kahel-kicker{
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 20px;
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: var(--wp--custom--letter-spacing--kicker);
	text-transform: uppercase;
}

.kahel-kicker::before{
	content: "";
	width: var(--wp--custom--page--kicker-rule);
	height: 3px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--orange);
}

.kahel-404-copy{
	max-width: var(--wp--custom--error--copy-max);
	margin-top: var(--wp--custom--error--copy-margin-top);
}

.kahel-404-code{
	position: absolute;
	right: 24px;
	bottom: 18px;
	z-index: 1;
	margin: 0;
	font-size: var(--wp--custom--error--code-size);
	font-weight: var(--wp--custom--weight--strong);
	line-height: 1;
	letter-spacing: -0.09em;
	color: rgba(36, 23, 15, 0.7);
	animation: kahel-rise var(--wp--custom--motion--duration-enter) var(--wp--custom--motion--ease) both;
	animation-delay: 160ms;
}

.kahel-home-text-link a{
	text-decoration: none;
}

.kahel-home-text-link{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 0 var(--wp--custom--home--text-link-gap);
	font-weight: 800;
}

.kahel-home-text-link a{
	text-decoration: none;
}

.kahel-archive-intro{
	max-width: var(--wp--custom--stories--intro-max);
	margin: var(--wp--custom--stories--intro-margin-top) 0 0;
}

.kahel-archive-count{
	margin: 0;
	flex: 0 0 auto;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--custom--stories--count-size);
}

.kahel-archive-story-meta{
	margin: var(--wp--custom--stories--meta-margin);
	color: var(--wp--preset--color--orange-deep);
	font-size: var(--wp--custom--stories--meta-size);
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.kahel-feature-text{
	margin: 0;
	font-size: var(--wp--custom--editorial--feature-size);
	font-weight: var(--wp--custom--weight--feature);
	line-height: 1.4;
	letter-spacing: -0.025em;
}

.kahel-page-header{
	padding-top: var(--wp--custom--page--header-padding-top);
	padding-bottom: var(--wp--custom--page--header-padding-bottom);
}

/*
 * Quand le contenu commence par du texte (paragraphe, liste, sous-titre…) et
 * pas par une section, il se lit comme la suite du titre : l'écart de section
 * (marge du bas de l'en-tête + marge du haut du contenu) devient un écart de
 * titre à texte.
 */
.kahel-page:has(> .kahel-page-header + .kahel-page-content > :first-child:not([class*="wp-block-club-canin-"], .alignfull)) > .kahel-page-header {
	padding-bottom: 0;
}

.kahel-page > .kahel-page-header + .kahel-page-content.kahel-page-content:has(> :first-child:not([class*="wp-block-club-canin-"], .alignfull)) {
	margin-top: clamp(20px, 2.5vw, 32px);
}

/*
 * Quand le contenu commence par une section du thème (FAQ, Image & texte…),
 * c'est elle qui porte l'écart, avec sa propre marge du haut : l'en-tête et
 * le contenu n'y ajoutent plus les leurs — trois marges empilées faisaient
 * un grand vide sous le titre. Une section sur fond de couleur garde juste
 * l'écart d'un titre à son texte, pour que son fond ne colle pas au titre.
 */
.kahel-page:has(> .kahel-page-header + .kahel-page-content > [class*="wp-block-club-canin-"]:first-child) > .kahel-page-header {
	padding-bottom: 0;
}

.kahel-page:has(> .kahel-page-header + .kahel-page-content > [class*="wp-block-club-canin-"].has-background:first-child) > .kahel-page-header {
	padding-bottom: var(--wp--custom--page--ecart-sous-entete);
}

.kahel-page > .kahel-page-header + .kahel-page-content.kahel-page-content:has(> [class*="wp-block-club-canin-"]:first-child) {
	margin-top: 0;
}

.kahel-404-visual{
	position: relative;
	min-height: var(--wp--custom--error--visual-min-height);
	overflow: hidden;
	border-radius: var(--wp--custom--radius--default);
	box-shadow: var(--wp--preset--shadow--media);
	animation: kahel-rise var(--wp--custom--motion--duration-enter) var(--wp--custom--motion--ease) both;
	animation-delay: 90ms;
}

.kahel-404-links{
	gap: 10px 22px;
	margin-top: var(--wp--custom--error--links-margin-top);
}

.kahel-404-recent{
	padding-top: var(--wp--custom--error--recent-padding-y);
	padding-bottom: var(--wp--custom--error--recent-padding-y);
}

.kahel-404-recent-card{
	min-height: var(--wp--custom--error--recent-card-min-height);
	padding: var(--wp--custom--error--recent-card-padding);
	border-radius: var(--wp--custom--error--recent-card-radius);
	background: var(--wp--preset--color--orange);
}

.kahel-home-section{
	padding-top: var(--wp--custom--home--section-padding-y);
	padding-bottom: var(--wp--custom--home--section-padding-y);
}

.kahel-home-actions{
	gap: 0;
	margin-top: var(--wp--custom--home--actions-margin-top);
	align-items: center;
}

.kahel-archive-header{
	padding-top: var(--wp--custom--stories--header-padding-top);
	padding-bottom: var(--wp--custom--stories--header-padding-bottom);
}

.kahel-archive-tools{
	gap: 14px var(--wp--custom--stories--tools-gap);
	margin-bottom: 0;
	padding-top: var(--wp--custom--stories--tools-padding-y);
	padding-bottom: var(--wp--custom--stories--tools-padding-y);
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
	align-items: center;
	justify-content: space-between;
}

.kahel-archive-story-art{
	position: relative;
	min-height: var(--wp--custom--stories--art-min-height);
	overflow: hidden;
	border-radius: var(--wp--custom--stories--art-radius);
	background: var(--wp--preset--color--apricot);
}

.kahel-404-title{
	max-width: var(--wp--custom--error--title-max);
	margin: 0;
	animation: kahel-rise var(--wp--custom--motion--duration-enter) var(--wp--custom--motion--ease) both;
}

.kahel-404-recent-title{
	max-width: var(--wp--custom--error--recent-title-max);
	margin: 0 0 var(--wp--custom--error--recent-title-margin-bottom);
}

.kahel-404-recent-card-title{
	max-width: 15ch;
	margin: 0;
}

.kahel-archive-title{
	margin: 0;
}

.kahel-archive-story-title{
	margin: 0;
}

.kahel-archive-story-title a{
	text-decoration: none;
}

.kahel-contact-section-title{
	margin: 0;
	font-size: var(--wp--custom--contact--section-title-size);
	line-height: 0.94;
}

.kahel-editorial-section-title{
	margin: 0;
	font-size: var(--wp--custom--editorial--section-title-size);
	line-height: 0.94;
}

.kahel-404-hero{
	gap: var(--wp--custom--error--hero-gap);
	align-items: flex-start;
	padding-top: var(--wp--custom--page--ecart-sous-entete);
	padding-bottom: var(--wp--custom--error--hero-padding-y);
}

/* Comme toutes les pages : le texte démarre en haut, juste sous l'en-tête. */
.kahel-404-hero > .wp-block-column.is-vertically-aligned-center {
	align-self: flex-start;
}


/* ------------------------------------------------------------------ *
 * Ajouts du thème Club Canin
 * ------------------------------------------------------------------ */

/* En-tête de section : titre à gauche, lien « tout voir » à droite. */
.kahel-home-section-head {
	display: flex;
	flex-wrap: wrap;
	gap: 24px 40px;
	align-items: end;
	justify-content: space-between;
	margin-bottom: var(--wp--custom--home--section-head-margin-bottom);
}

.kahel-home-section-head .kahel-home-text-link {
	margin: 0 0 8px;
}

.kahel-home-text-link a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

/*
 * Les sections du thème se touchent, comme les compositions de Kahel :
 * l'écart entre blocs de la mise en page est fait pour du texte, pas pour
 * des bandes de couleur.
 */
:is(.is-layout-constrained, .is-layout-flow) > .alignfull[class*="wp-block-club-canin-"] {
	margin-block-start: 0;
	margin-block-end: 0;
}

/*
 * Modèle « Par défaut » : l'en-tête de page tient lieu d'en-tête éditorial.
 * Une section sans fond qui ouvre le contenu ne rajoute pas sa marge haute :
 * elle arrive à la même distance du titre qu'un simple paragraphe.
 */
.kahel-page-content > :is(.kahel-origin-split-section, .kahel-contributors, .kahel-audience-section, .kahel-principles-section, .kahel-contact-pitch-section):first-child {
	padding-top: 0;
}

/*
 * … mais son titre ne vient pas se coller au H1 : l'en-tête garde une petite
 * marge, la même qu'au-dessus d'une section sur fond de couleur.
 */
.kahel-page:has(> .kahel-page-header + .kahel-page-content > :is(.kahel-origin-split-section, .kahel-contributors, .kahel-audience-section, .kahel-principles-section, .kahel-contact-pitch-section):first-child) > .kahel-page-header {
	padding-bottom: var(--wp--custom--page--ecart-sous-entete);
}

/* Page d'accueil et pages pleine largeur : le contenu démarre sous l'en-tête. */
.wp-site-blocks > :is(.kahel-home, .kahel-page-full) {
	margin-block-start: 0;
}

.wp-site-blocks > :is(.kahel-home, .kahel-page-full) + * {
	margin-block-start: 0;
}

.wp-site-blocks > .kahel-header-part + * {
	margin-block-start: 0;
}

/*
 * Modèle « Sans titre H1 » : le premier bloc arrive juste sous l'en-tête du
 * site, sans sa grande marge de section — un simple souffle. Les héros, faits
 * pour ouvrir une page, gardent leur propre mise en page.
 */
.kahel-page-full-content > :first-child:not([class*="wp-block-club-canin-hero"]) {
	margin-block-start: 0;
	padding-top: var(--wp--custom--page--ecart-sous-entete);
}

/* Un souffle avant le pied de page : le dernier élément ne vient jamais s'y coller. */
.wp-site-blocks > footer.wp-block-template-part {
	margin-block-start: clamp(40px, 5vw, 64px);
}

/* Une section du thème finit déjà par sa propre marge : on n'en rajoute pas. */
.wp-site-blocks > main:has(.wp-block-post-content > [class*="wp-block-club-canin-"]:last-child) + footer.wp-block-template-part {
	margin-block-start: 0;
}

/* Le surtitre des pages : le nom du site, en petites capitales orange. */
.kahel-page-kicker {
	font-size: var(--wp--preset--font-size--caption) !important;
	letter-spacing: var(--wp--custom--letter-spacing--kicker);
}

.kahel-page-kicker a {
	color: inherit;
	text-decoration: none;
}

/*
 * Les liens écrits dans le texte courant se voient avant le survol : orange
 * et soulignés d'un trait léger, qui se renforce au survol. Seuls les liens
 * sans classe, dans le texte d'une page ou d'un article (hors sections) et
 * dans les textes enrichis des sections (`kahel-riche`) : menus, boutons,
 * cartes et liens « Tout voir » gardent leur dessin.
 */
:where(.wp-block-post-content :where(p, li, dd, td, figcaption, blockquote):not([class*="wp-block-club-canin-"] *), .kahel-riche) a:where(:not([class])):is(:link, :visited) {
	color: var(--wp--preset--color--orange-deep);
	text-decoration: underline;
	text-decoration-color: rgba(244, 122, 31, 0.45);
	text-decoration-thickness: 1.5px;
	text-underline-offset: 0.22em;
	transition: color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease), text-decoration-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease);
}

:where(.wp-block-post-content :where(p, li, dd, td, figcaption, blockquote):not([class*="wp-block-club-canin-"] *), .kahel-riche) a:where(:not([class])):is(:hover, :focus-visible) {
	color: var(--wp--preset--color--orange-deep);
	text-decoration-color: currentColor;
	text-decoration-thickness: 2px;
}

/* Sur fond sombre ou orange, le lien reprend la couleur du texte. */
:where(.has-ink-background-color, .has-orange-background-color, .has-orange-deep-background-color) :where(.kahel-riche, p, li) a:where(:not([class])) {
	color: inherit !important;
	text-decoration-color: currentColor !important;
}

/* Les listes des sections n'héritent pas des puces du contenu. */
[class*="wp-block-club-canin-"] :is(ul, ol)[class] {
	margin-block: 0;
}

/* Le rappel Blocs Creator pour la rédaction, aux couleurs du thème. */
[class*="wp-block-club-canin-"] .bc-rappel {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

/* Un nom de site plus long que « Kahel » : l'en-tête se resserre avant de passer à la ligne. */
@media (max-width: 1180px) {
	.kahel-header-bar {
		gap: var(--wp--preset--spacing--40);
	}

	.kahel-header-actions,
	.kahel-header-actions .wp-block-navigation__container {
		gap: 18px;
	}
}

/*
 * Rien ne dépasse sur les côtés : un élément qui attend son entrée, décalé de
 * quelques pixels, ne doit pas élargir la page sur mobile. `clip` et non
 * `hidden` : l'en-tête collant continue de coller.
 */
.wp-site-blocks {
	overflow-x: clip;
}

/* Les mots français sont plus longs que « Kahel » : le très grand titre se règle sur l'écran. */
@media (max-width: 480px) {
	.has-huge-font-size {
		font-size: clamp(2.1rem, 10vw, 2.8rem) !important;
	}
}

/* En-tête mobile : le logo à gauche, le bouton et le menu à droite, sur une seule rangée. */
@media (max-width: 600px) {
	.kahel-header-bar {
		flex-wrap: nowrap;
		gap: 12px;
	}

	.kahel-header-marque {
		flex: 1 1 auto;
		gap: 8px;
	}

	.kahel-header-logo img {
		width: 42px;
	}

	.kahel-header-brand {
		flex: 1 1 auto;
		min-width: 0;
		font-size: 0.95rem;
		line-height: 1.15;
	}

	/* Avec un logo, il reste seul : le nom du club reparaît dans le menu ouvert. Toujours lu par les lecteurs d'écran. */
	.kahel-header-marque:has(.kahel-header-logo img) .kahel-header-brand {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.kahel-header-actions {
		flex-direction: row-reverse;
		flex-wrap: nowrap;
		gap: 12px;
	}

	.kahel-header-cta .wp-block-button__link {
		padding: 9px 13px;
		font-size: 0.8rem;
		white-space: nowrap;
	}
}

/*
 * Le menu mobile ouvert.
 *
 * En tête, le logo et le nom du club, et la croix dans un rond. Dessous, une
 * page par rangée, séparées d'un filet : son numéro, son nom en grand, une
 * flèche ; la page où l'on est passe en orange, avec un point. En bas, le
 * bouton d'appel de l'en-tête. La marque et le bouton sont posés par
 * assets/js/animations.js ; les entrées et la sortie sont dans
 * animations.css.
 */
.kahel-menu-marque,
.kahel-menu-appel,
.kahel-menu-reseaux {
	display: none;
}

.kahel-header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--custom--header--padding-y) var(--wp--style--root--padding-right, 20px) calc(24px + env(safe-area-inset-bottom)) var(--wp--style--root--padding-left, 20px);
	background:
		radial-gradient(circle at 100% 0%, rgba(244, 122, 31, 0.13), transparent 46%),
		var(--wp--preset--color--base);
	color: var(--wp--preset--color--ink);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-marque {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 46px;
	padding-right: 64px;
	font-size: 1rem;
	font-weight: var(--wp--custom--weight--strong);
	letter-spacing: var(--wp--custom--letter-spacing--brand);
	line-height: 1.15;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-marque img {
	display: block;
	flex-shrink: 0;
	width: 42px;
	height: auto;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border: 1px solid var(--wp--preset--color--line-strong);
	border-radius: 50%;
	background: var(--wp--preset--color--surface);
	transition:
		background-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		border-color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease),
		transform 420ms var(--wp--custom--motion--ease-spring);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close:is(:hover, :focus-visible) {
	border-color: var(--wp--preset--color--orange);
	background: var(--wp--preset--color--orange);
	transform: rotate(90deg);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	flex: 1 1 auto;
	align-items: stretch;
	padding-top: clamp(28px, 6vh, 52px);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 0 !important;
	align-items: stretch;
	border-top: 1px solid var(--wp--preset--color--line);
	counter-reset: kahel-menu;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
	align-items: stretch;
	border-bottom: 1px solid var(--wp--preset--color--line);
	font-size: clamp(1.45rem, 6.8vw, 2rem);
	font-weight: var(--wp--custom--weight--heading);
	letter-spacing: -0.04em;
	line-height: 1.1;
	counter-increment: kahel-menu;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	gap: 16px;
	box-sizing: border-box;
	width: 100%;
	padding: 17px 4px;
	font-weight: inherit;
	transition: color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease), padding 420ms var(--wp--custom--motion--ease);
}

/* Le numéro de la page : 01, 02… */
.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::before {
	content: counter(kahel-menu, decimal-leading-zero);
	min-width: 2ch;
	color: var(--wp--preset--color--muted);
	font-size: 0.72rem;
	font-variant-numeric: tabular-nums;
	font-weight: 800;
	letter-spacing: 0.1em;
	transition: color var(--wp--custom--motion--duration-fast) var(--wp--custom--motion--ease);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label {
	flex: 1 1 auto;
	min-width: 0;
}

/* La flèche, à droite — le trait orange de l'en-tête n'a pas cours ici. */
.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after {
	content: "→";
	position: static;
	flex-shrink: 0;
	height: auto;
	border-radius: 0;
	background: none;
	color: var(--wp--preset--color--orange);
	font-size: 0.8em;
	font-weight: 700;
	transform: none;
	transition: transform 420ms var(--wp--custom--motion--ease-spring);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:is(:hover, :focus-visible, :active) {
	padding-left: 10px;
	color: var(--wp--preset--color--orange-deep);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:is(:hover, :focus-visible, :active)::before {
	color: var(--wp--preset--color--orange);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:is(:hover, :focus-visible, :active)::after {
	transform: translateX(5px);
}

/* La page où l'on est : en orange, avec un point à la place de la flèche. */
.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > :is(.current-menu-item, .current-menu-ancestor) > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--orange-deep);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > :is(.current-menu-item, .current-menu-ancestor) > .wp-block-navigation-item__content::before {
	color: var(--wp--preset--color--orange);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > :is(.current-menu-item, .current-menu-ancestor) > .wp-block-navigation-item__content::after {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--wp--preset--color--orange);
	transform: none;
}

/* Le bouton d'appel, en bas, sur toute la largeur. */
.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-appel {
	display: block;
	margin-top: auto;
	padding-top: 32px;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-appel .wp-block-button {
	width: 100%;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-appel .wp-block-button__link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 54px;
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: normal;
	box-shadow: var(--wp--preset--shadow--button);
}

/* Les réseaux sociaux, sous le bouton (inc/reseaux.php). */
.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-reseaux {
	display: flex;
	justify-content: center;
	margin-top: auto;
	padding-top: 32px;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-appel + .kahel-menu-reseaux {
	margin-top: 0;
	padding-top: 18px;
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-reseaux .kahel-reseau a {
	border-color: var(--wp--preset--color--line-strong);
	background: var(--wp--preset--color--surface);
}

.kahel-header .wp-block-navigation__responsive-container.is-menu-open .kahel-menu-reseaux .kahel-reseau a:is(:hover, :focus-visible) {
	border-color: var(--wp--preset--color--orange);
	background: var(--wp--preset--color--orange);
}

/* « promenade » ne tient pas dans les 9 caractères de Kahel. */
.kahel-404-title {
	max-width: 12ch;
}
