/*
 * ActiveD - feuille noyau du thème (direction B « Profondeur »).
 * Reprend le CSS de la maquette B (mêmes noms de classes) adapté aux blocs WordPress :
 * - jetons reliés aux préréglages de theme.json (--wp--preset--*) avec valeurs de repli ;
 * - marges automatiques des mises en page de blocs (blockGap) neutralisées là où la maquette pose ses propres espacements ;
 * - mobile d'abord ; toutes les animations sous prefers-reduced-motion: no-preference.
 * Les ajouts propres aux patterns sont dans patterns-a.css et patterns-b.css (chargés après ce fichier).
 */

/* ==========================================================================
   1. Jetons
   ========================================================================== */
:root {
	--nuit: var(--wp--preset--color--nuit, #071F2A);
	--abysse: var(--wp--preset--color--abysse, #0C2D3B);
	--surface: var(--wp--preset--color--surface, #12394A);
	--texte: var(--wp--preset--color--texte, #EAF4F6);
	--doux: var(--wp--preset--color--doux, #A9C1C9);
	--menthe: var(--wp--preset--color--menthe, #65D8C0);
	--ciel: var(--wp--preset--color--ciel, #3AB0EA);
	--glace: var(--wp--preset--color--glace, #EEF5F7);
	--encre: var(--wp--preset--color--encre, #0A2633);
	--gris: var(--wp--preset--color--gris, #4A6470);
	--lien-clair: var(--wp--preset--color--lien-clair, #0B6F8F);
	--blanc: var(--wp--preset--color--blanc, #FFFFFF);
	--bleu-logo: #1798D5;
	--ligne: var(--wp--custom--ligne, rgba(169,193,201,.18));
	--ligne-forte: var(--wp--custom--ligne-forte, rgba(169,193,201,.34));
	--erreur: #B3261E;

	--f: var(--wp--preset--font-family--archivo, "Archivo", "Helvetica Neue", Arial, system-ui, sans-serif);
	--t-xs: var(--wp--preset--font-size--xs, .8125rem);
	--t-s: var(--wp--preset--font-size--s, .9375rem);
	--t-m: var(--wp--preset--font-size--m, 1.0625rem);
	--t-l: var(--wp--preset--font-size--l, clamp(1.2rem, 1.1rem + .5vw, 1.4rem));
	--t-xl: var(--wp--preset--font-size--xl, clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem));
	--t-2xl: var(--wp--preset--font-size--xxl, clamp(2rem, 1.4rem + 2.6vw, 3.6rem));
	--t-3xl: var(--wp--preset--font-size--heros, clamp(1.9rem, 1.3rem + 2.2vw, 3.1rem));
	--t-chiffre: var(--wp--preset--font-size--chiffre, clamp(2.6rem, 1.6rem + 4vw, 5.2rem));

	--s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem; --s-5: 1.5rem; --s-6: 2rem; --s-7: 3rem; --s-8: 4rem;
	--s-section: var(--wp--preset--spacing--section, clamp(4.5rem, 3rem + 6vw, 9rem));
	--r-s: var(--wp--custom--rayon--s, 8px);
	--r-m: var(--wp--custom--rayon--m, 14px);
	--r-l: var(--wp--custom--rayon--l, 24px);
	--max: var(--wp--custom--max, 1280px);
	--entete-h: 77px; /* hauteur totale de l'en-tête (76 px + filet de 1 px), utilisée par .heros et .bandeau-page */
	--gouttiere-g: max(16px, env(safe-area-inset-left, 0px));
	--gouttiere-d: max(16px, env(safe-area-inset-right, 0px));
	--fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4'/%3E%3C/svg%3E");
	color-scheme: dark;
}
@media (min-width: 720px) {
	:root {
		--gouttiere-g: max(32px, env(safe-area-inset-left, 0px));
		--gouttiere-d: max(32px, env(safe-area-inset-right, 0px));
	}
	/* Marge latérale des blocs (padding racine de theme.json) alignée sur la maquette : 16 px puis 32 px. */
	:root body {
		--wp--style--root--padding-left: var(--gouttiere-g);
		--wp--style--root--padding-right: var(--gouttiere-d);
	}
}

/* ==========================================================================
   2. Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	/* Les ancres (#contact, #contenu...) ne passent pas sous l'en-tête collant. */
	scroll-padding-top: calc(var(--entete-h) + var(--wp-admin--admin-bar--height, 0px) + 1rem);
}
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}
:where(body) {
	margin: 0;
	background: var(--nuit);
	color: var(--texte);
	font-family: var(--f);
}
body {
	font-variation-settings: "wdth" 100;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: clip;
}
/* Bande de la zone d'encoche (iPhone en paysage / plein écran). */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 60; background: var(--nuit); pointer-events: none; }
:where(img, svg, video) { max-width: 100%; }
:where(img) { height: auto; }
[hidden] { display: none !important; }
:where(a) { text-underline-offset: .2em; text-decoration-thickness: from-font; }
:focus-visible { outline: 3px solid var(--menthe); outline-offset: 3px; border-radius: 6px; }
:where(h1, h2, h3, h4, h5, h6) { margin: 0; text-wrap: balance; font-variation-settings: "wdth" 112; }
:where(h4, h5, h6) { font-variation-settings: "wdth" 105; }
:where(p) { margin: 0; text-wrap: pretty; }
:where(strong, b) { font-weight: 700; }
::selection { background: var(--menthe); color: var(--nuit); }

/* Accessibilité : texte réservé aux lecteurs d'écran (classe .sr de la maquette, .screen-reader-text de WordPress). */
.sr, .screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px !important;
	overflow: hidden;
	clip: rect(0 0 0 0); clip-path: inset(50%);
	white-space: nowrap; border: 0;
}
.screen-reader-text:focus { position: static !important; width: auto; height: auto; margin: 0 !important; clip: auto; clip-path: none; white-space: normal; }

/* Lien d'évitement (ajouté par functions.php via wp_body_open). */
.sauter {
	position: absolute; left: 16px; top: -80px; z-index: 100001;
	background: var(--menthe); color: var(--nuit);
	padding: .6rem 1rem; border-radius: 8px;
	font: 600 var(--t-s)/1.2 var(--f); text-decoration: none;
}
.sauter:focus { top: 12px; }
.admin-bar .sauter:focus { top: calc(12px + var(--wp-admin--admin-bar--height, 0px)); }
:where(#contenu):focus { outline: none; }

/* ==========================================================================
   3. Structure : conteneur, sections, têtes de section
   ========================================================================== */
.wp-site-blocks { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.wp-site-blocks > main, .wp-site-blocks > .wp-block-group:has(> main) { flex: 1 0 auto; }
/* Les parties de modèle et le contenu principal s'enchaînent sans l'espacement automatique entre blocs. */
:root :where(.wp-site-blocks) > * { margin-block: 0; }

.wrap {
	width: 100%;
	max-width: var(--max);
	margin-inline: auto;
	padding-left: var(--gouttiere-g);
	padding-right: var(--gouttiere-d);
}
/* Pages composées de sections (modèles front-page et page-pleine-largeur) : les sections pleine largeur s'enchaînent sans espace. */
.wp-block-post-content.sections > .alignfull { margin-block-end: 0; }
.wp-block-post-content.sections > * + .alignfull, .wp-block-post-content.sections > .alignfull + * { margin-block-start: 0; }
.wp-block-post-content.sections > .alignfull:last-child { margin-block-end: 0; }

/* Un .wrap posé dans un conteneur qui porte déjà la marge latérale de WordPress ne la double pas. */
.has-global-padding > .wrap:not(.alignfull) { padding-left: 0; padding-right: 0; }

.section { padding-block: var(--s-section); }
.kicker {
	font-size: var(--t-xs); font-weight: 600; line-height: 1.4;
	letter-spacing: .16em; text-transform: uppercase;
	color: var(--menthe);
	font-variation-settings: "wdth" 118;
}
.tete { display: grid; gap: var(--s-4); margin-bottom: var(--s-7); max-width: 820px; }
.tete h2 { font-size: var(--t-2xl); line-height: 1.02; }
.tete p:not(.kicker) { color: var(--doux); font-size: var(--t-l); line-height: 1.5; max-width: 62ch; }
.nw { white-space: nowrap; }
:where(.case, .panneau-exp, .frise, .rep, .appel, .chiffres .bas) p { max-width: 62ch; }

/*
 * Neutralisation des marges de mise en page des blocs (blockGap) dans les conteneurs
 * qui gèrent leur espacement par grille ou flex comme dans la maquette.
 */
:root :where(
	.tete, .heros .wrap, .heros-gauche, .panneau, .actions, .onglets,
	.logos, .logos .wrap, .rang,
	.bento, .case,
	.chiffres .wrap, .chiffres dl, .chiffres .bas,
	.duo, .panneau-exp, .panneau-exp .corps,
	.frise, .frise > *, .frise-pied,
	.citation, .diapos, .diapo, .commandes,
	.faq .grille, .rep,
	.articles, .article, .article .corps,
	.contact .grille, .appel, .bureau, .formulaire, .champs, .champ, .envoi,
	.pied .haut, .pied .bas, .labels, .reseaux,
	.entete .wrap, .bandeau-page .wrap, .meta-article, .navigation-articles
) > * {
	margin-block: 0;
}

/* ==========================================================================
   4. Boutons et liens fléchés
   ========================================================================== */
/* .btn de la maquette (liens bruts) et bouton de bloc core/button (stylé par theme.json, complété ici). */
.btn, .wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: .6em;
	min-height: 46px;
	font-variation-settings: "wdth" 110;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
}
.btn {
	padding: .8rem 1.4rem; border-radius: 999px;
	font: 600 var(--t-s)/1 var(--f);
	background: var(--menthe); color: var(--nuit);
	border: 1.5px solid var(--menthe);
	flex: none;
}
.btn:hover { box-shadow: 0 0 0 6px rgba(101,216,192,.16); }
.btn--ligne, .btn.btn--ligne { background: transparent; color: var(--texte); border-color: var(--ligne-forte); }
.btn--ligne:hover { border-color: var(--texte); box-shadow: none; }

/* Variante contour : style natif « Contour » du bloc Bouton et classes de la maquette. */
:where(.wp-block-button.is-style-outline, .wp-block-button.btn--ligne, .wp-block-button.btn-bloc--ligne) > .wp-block-button__link {
	background: transparent;
	color: var(--texte);
	border: 1.5px solid var(--ligne-forte);
}
:where(.wp-block-button.is-style-outline, .wp-block-button.btn--ligne, .wp-block-button.btn-bloc--ligne) > .wp-block-button__link:hover {
	background: transparent;
	color: var(--texte);
	border-color: var(--texte);
	box-shadow: none;
}

/* Flèche des boutons pleins (comme « Découvrir », « Contact », « Envoyer » de la maquette). */
.wp-block-button:not(.is-style-outline):not(.btn--ligne):not(.btn-bloc--ligne):not(.sans-fleche):not(.is-style-sans-fleche) > .wp-block-button__link::after,
.btn:not(.btn--ligne):not(.sans-fleche)::after,
.lien > a::after, a.lien::after {
	content: "";
	flex: none;
	width: 16px; height: 16px;
	background: currentColor;
	-webkit-mask: var(--fleche) center / contain no-repeat;
	mask: var(--fleche) center / contain no-repeat;
}
.btn:has(svg)::after, a.lien:has(svg)::after, .lien > a:has(svg)::after { content: none; }
.btn svg, .lien svg { width: 16px; height: 16px; }

.lien > a, a.lien {
	display: inline-flex; align-items: center; gap: .45em;
	font-weight: 600; font-size: var(--t-s);
	color: var(--menthe);
	text-decoration: none;
	min-height: 44px;
}
.lien > a:hover, a.lien:hover { text-decoration: underline; }
.actions, .wp-block-buttons.actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }

/* ==========================================================================
   5. Emplacements d'images (.ph) - en attendant les photos
   ========================================================================== */
.ph {
	position: relative; margin: 0;
	border-radius: var(--r-m);
	overflow: hidden;
	background:
		linear-gradient(rgba(234,244,246,.06) 1px, transparent 1px) 0 0 / 32px 32px,
		linear-gradient(90deg, rgba(234,244,246,.06) 1px, transparent 1px) 0 0 / 32px 32px,
		linear-gradient(135deg, var(--surface), #0A4F6B);
	max-width: 100%;
	min-height: 120px;
	isolation: isolate;
}
.ph svg.motif { position: absolute; inset: 0; width: 100%; height: 100%; }
.ph:has(img) { background: var(--surface); min-height: 0; }
.ph img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ph figcaption { position: absolute; left: 10px; bottom: 10px; right: 10px; font: 500 .72rem/1.35 var(--f); color: var(--texte); background: rgba(7,31,42,.78); border-radius: 6px; padding: .4rem .6rem; }

/* ==========================================================================
   6. En-tête (partie de modèle « header » avec la classe .entete)
   ========================================================================== */
.entete {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + env(safe-area-inset-top, 0px));
	z-index: 50;
	border-bottom: 1px solid transparent;
}
@media (max-width: 600px) {
	.admin-bar .entete { top: env(safe-area-inset-top, 0px); }
}
.entete.defile {
	background: rgba(7,31,42,.82);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	border-bottom-color: var(--ligne);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.entete.defile { background: rgba(7,31,42,.96); }
}
/* Le voile flouté créerait un bloc conteneur pour le menu mobile (position: fixed) : on le retire quand le menu est ouvert. */
.has-modal-open .entete, .entete.menu-ouvert { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--nuit); }
.entete .wrap { display: flex; align-items: center; flex-wrap: nowrap; gap: var(--s-5); min-height: calc(var(--entete-h) - 1px); }

/* Logo (bloc Image avec la classe .logo, ou lien typographique de la maquette) */
.logo { display: inline-flex; flex-direction: column; line-height: 1; text-decoration: none; color: var(--texte); margin: 0 auto 0 0; flex: none; }
.logo b { font-weight: 800; font-size: 1.4rem; letter-spacing: .03em; font-variation-settings: "wdth" 100; }
.logo span { font-weight: 700; font-size: .55rem; letter-spacing: .26em; color: var(--ciel); margin-top: 3px; font-variation-settings: "wdth" 110; }
.wp-block-image.logo { margin: 0 auto 0 0; }
.wp-block-image.logo a { display: inline-flex; align-items: center; min-height: 44px; border-radius: 6px; }
.wp-block-image.logo img { display: block; height: auto; border-radius: 0; }

/* Navigation principale : bloc core/navigation (classe .nav) */
.entete .wp-block-navigation {
	--nav-pill: rgba(234,244,246,.08);
	font: 500 var(--t-s)/1 var(--f);
	gap: 2px;
}
.entete .wp-block-navigation .wp-block-navigation__container { gap: 2px; }
.entete .wp-block-navigation .wp-block-navigation-item__content {
	display: inline-flex; align-items: center; gap: .35em;
	min-height: 44px;
	padding: .7rem .85rem;
	border-radius: 999px;
	color: var(--texte);
	text-decoration: none;
	line-height: 1.1;
}
.entete .wp-block-navigation .wp-block-navigation-item__content:hover,
.entete .wp-block-navigation .wp-block-navigation-submenu__toggle[aria-expanded="true"] { background: var(--nav-pill); }
.entete .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content,
.entete .wp-block-navigation [aria-current="page"] { color: var(--menthe); }

/* Entrées parentes sans lien (Métiers, Technos, Société) : bouton de sous-menu et chevron. */
.entete .wp-block-navigation .wp-block-navigation-item.open-on-click .wp-block-navigation-submenu__toggle {
	padding: .7rem 1.9rem .7rem .85rem;
	cursor: pointer;
}
.entete .wp-block-navigation .wp-block-navigation-item.open-on-click .wp-block-navigation-submenu__toggle + .wp-block-navigation__submenu-icon {
	width: 12px; height: 12px;
	margin-left: -1.55rem;
	margin-right: .35rem;
	pointer-events: none;
}
.entete .wp-block-navigation .wp-block-navigation__submenu-icon svg { width: 12px; height: 12px; margin-top: 0; stroke-width: 1.6; }
@media (prefers-reduced-motion: no-preference) {
	.entete .wp-block-navigation .wp-block-navigation__submenu-icon svg { transition: transform .2s; }
	.entete .wp-block-navigation .wp-block-navigation-item__content { transition: background-color .2s, color .2s; }
}

/* Sous-menus déroulants (bureau) : .sous de la maquette */
.entete .wp-block-navigation .has-child .wp-block-navigation__submenu-container,
.sous {
	top: calc(100% + 10px);
	left: 0;
	padding: var(--s-2);
	list-style: none;
	margin: 0;
	background: var(--abysse);
	color: var(--texte);
	border: 1px solid var(--ligne-forte);
	border-radius: var(--r-m);
	box-shadow: 0 30px 60px -20px rgba(0,0,0,.6);
}
.sous { position: absolute; min-width: 310px; }
.entete .wp-block-navigation .has-child:not(.open-always) .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container { min-width: 310px; }
/* Sans JavaScript (script du bloc Navigation absent), les sous-menus s'ouvrent au survol et au focus clavier. */
html:not(.js) .entete .wp-block-navigation .has-child:is(:hover, :focus-within) > .wp-block-navigation__submenu-container {
	visibility: visible; overflow: visible; opacity: 1; width: auto; height: auto; min-width: 310px;
}
/* Pont invisible entre l'entrée et le sous-menu (évite la fermeture au survol). */
.entete .wp-block-navigation .has-child .wp-block-navigation__submenu-container::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.entete .wp-block-navigation .has-child .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content,
.sous a {
	display: block;
	width: 100%;
	border-radius: 10px;
	padding: .7rem .85rem;
	line-height: 1.3;
	white-space: normal;
}
.entete .wp-block-navigation .has-child .wp-block-navigation__submenu-container > .wp-block-navigation-item { width: 100%; }

/* Bouton Contact (entrée de menu avec la classe .btn-contact) */
.entete .wp-block-navigation .btn-contact { margin-left: var(--s-4); }
.entete .wp-block-navigation .btn-contact > .wp-block-navigation-item__content {
	gap: .6em;
	min-height: 46px;
	padding: .8rem 1.4rem;
	background: var(--menthe);
	color: var(--nuit);
	border: 1.5px solid var(--menthe);
	font-weight: 600;
	font-variation-settings: "wdth" 110;
}
.entete .wp-block-navigation .btn-contact > .wp-block-navigation-item__content::after {
	content: ""; width: 16px; height: 16px; flex: none; background: currentColor;
	-webkit-mask: var(--fleche) center / contain no-repeat; mask: var(--fleche) center / contain no-repeat;
}
.entete .wp-block-navigation .btn-contact > .wp-block-navigation-item__content:hover { background: var(--menthe); box-shadow: 0 0 0 6px rgba(101,216,192,.16); }

/* Bouton d'ouverture du menu mobile : .burger de la maquette */
.burger,
.entete .wp-block-navigation__responsive-container-open {
	width: 46px; height: 46px;
	border-radius: 50%;
	border: 1px solid var(--ligne-forte);
	background: transparent;
	color: var(--texte);
	place-items: center;
	cursor: pointer;
	padding: 0;
}
.burger { display: grid; }
.burger svg, .entete .wp-block-navigation__responsive-container-open svg { width: 22px; height: 22px; }

/* Entre 600 et 1079 px, le bloc Navigation garde le menu mobile (le bloc bascule à 600 px par défaut ; la maquette à 1080 px). */
@media (max-width: 1079.98px) {
	.entete .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) { display: grid; }
}
@media (min-width: 600px) and (max-width: 1079.98px) {
	.entete .wp-block-navigation .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* Menu mobile ouvert : .tiroir de la maquette */
/* Le menu est aligné à droite en bureau (items-justified-right) : dans le menu mobile, tout repart à gauche. */
.entete .wp-block-navigation__responsive-container.is-menu-open,
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation {
	--navigation-layout-justification-setting: stretch;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: stretch;
	--navigation-layout-text-align: start;
	text-align: start;
}
.tiroir { background: var(--abysse); border-top: 1px solid var(--ligne); max-height: calc(100vh - var(--entete-h)); overflow: auto; }
.entete .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--abysse);
	color: var(--texte);
	padding: calc(var(--wp-admin--admin-bar--height, 0px) + env(safe-area-inset-top, 0px) + 1rem) var(--gouttiere-d) calc(2rem + env(safe-area-inset-bottom, 0px)) var(--gouttiere-g);
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: calc(var(--entete-h) - 1rem);
	align-items: stretch;
	gap: 0;
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
	align-items: stretch;
	width: 100%;
	gap: 0;
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container > .wp-block-navigation-item {
	align-items: stretch;
	width: 100%;
	border-bottom: 1px solid var(--ligne);
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	display: flex;
	padding: 1rem 0;
	min-height: 48px;
	border-radius: 0;
	font-weight: 600;
	font-size: 1.1rem;
	font-variation-settings: "wdth" 110;
	background: none;
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-submenu__toggle {
	cursor: default;
	color: var(--menthe);
	font-size: var(--t-xs) !important;
	letter-spacing: .16em;
	text-transform: uppercase;
	font-variation-settings: "wdth" 118 !important;
	padding-bottom: .25rem !important;
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
	padding: 0 0 .75rem .75rem;
	gap: 0;
	min-width: 0;
	border: 0;
	box-shadow: none;
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	padding: .55rem 0;
	color: var(--doux);
	font-size: var(--t-m);
	font-weight: 500;
	line-height: 1.3;
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { color: var(--texte); }
.entete .wp-block-navigation__responsive-container.is-menu-open .btn-contact { border-bottom: 0 !important; margin: var(--s-5) 0 0; align-self: flex-start; width: auto !important; }
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container > .btn-contact > .wp-block-navigation-item__content {
	padding: .8rem 1.4rem;
	border-radius: 999px;
	background: var(--menthe);
	color: var(--nuit);
	font-size: var(--t-s);
	min-height: 46px;
}
.entete .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: calc(var(--wp-admin--admin-bar--height, 0px) + env(safe-area-inset-top, 0px) + 15px);
	right: var(--gouttiere-d);
	width: 46px; height: 46px;
	border-radius: 50%;
	border: 1px solid var(--ligne-forte);
	display: grid; place-items: center;
}
.entete .wp-block-navigation__responsive-container-close svg { width: 22px; height: 22px; }

/* Repli : structure de la maquette (.nav > ul, .menu-btn, .burger, .tiroir) si elle est utilisée telle quelle. */
.nav:not(.wp-block-navigation) { display: none; }
.nav > ul { list-style: none; display: flex; gap: 2px; margin: 0; padding: 0; }
.nav li { position: relative; }
.nav:not(.wp-block-navigation) a, .nav .menu-btn {
	display: inline-flex; align-items: center; gap: .35em;
	padding: .7rem .85rem; border-radius: 999px;
	color: var(--texte); text-decoration: none;
	font: 500 var(--t-s)/1 var(--f);
	background: none; border: 0; cursor: pointer;
}
.nav:not(.wp-block-navigation) a:hover, .nav .menu-btn:hover, .nav .menu-btn[aria-expanded="true"] { background: rgba(234,244,246,.08); }
.nav .menu-btn svg { width: 12px; height: 12px; }
.nav .menu-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.entete .wp-block-buttons .btn, .entete > .wrap > .btn { display: none; }
.entete .tiroir .wrap { display: grid; gap: 0; min-height: 0; align-items: stretch; padding-block: var(--s-4) var(--s-6); }
.tiroir details, .tiroir .wrap > a { border-bottom: 1px solid var(--ligne); }
.tiroir summary { list-style: none; cursor: pointer; padding: 1rem 0; font-weight: 600; font-size: 1.1rem; display: flex; justify-content: space-between; font-variation-settings: "wdth" 110; }
.tiroir summary::-webkit-details-marker { display: none; }
.tiroir summary::after { content: "+"; color: var(--menthe); font-weight: 400; }
.tiroir details[open] summary::after { content: "–"; }
.tiroir details a { display: block; padding: .55rem 0 .55rem .75rem; color: var(--doux); text-decoration: none; }
.tiroir .wrap > a { display: block; padding: 1rem 0; font-weight: 600; font-size: 1.1rem; color: var(--texte); text-decoration: none; font-variation-settings: "wdth" 110; }
.tiroir .wrap > a.btn { border: 0; margin-top: var(--s-5); justify-self: start; color: var(--nuit); padding: .8rem 1.4rem; font-size: var(--t-s); }
@media (min-width: 1080px) {
	.nav:not(.wp-block-navigation) { display: block; }
	.entete .wp-block-buttons .btn, .entete > .wrap > .btn { display: inline-flex; }
	.burger, .tiroir { display: none !important; }
}

/* ==========================================================================
   7. Héros à onglets
   ========================================================================== */
.heros {
	position: relative;
	margin-top: calc(-1 * var(--entete-h));
	padding-top: var(--entete-h);
	overflow: hidden;
	isolation: isolate;
}
.aurore {
	position: absolute; inset: -20% -10% auto; height: 120%; z-index: -1;
	background:
		radial-gradient(40% 50% at 75% 30%, rgba(23,152,213,.45), transparent 70%),
		radial-gradient(35% 45% at 60% 70%, rgba(101,216,192,.28), transparent 70%),
		radial-gradient(50% 60% at 10% 10%, rgba(18,57,74,.9), transparent 70%);
	filter: blur(10px);
	pointer-events: none;
}
.grain {
	position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background-image: linear-gradient(rgba(169,193,201,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(169,193,201,.07) 1px, transparent 1px);
	background-size: 64px 64px;
	-webkit-mask-image: radial-gradient(70% 70% at 70% 40%, #000, transparent);
	mask-image: radial-gradient(70% 70% at 70% 40%, #000, transparent);
}
.heros .wrap { display: grid; gap: var(--s-7); padding-block: clamp(2.5rem, 1.5rem + 5vw, 6.5rem) var(--s-8); }
.heros-gauche { display: grid; gap: var(--s-6); min-width: 0; }
.onglets { display: flex; gap: var(--s-2); flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding: 3px; margin: -3px; max-width: calc(100% + 6px); }
.onglets::-webkit-scrollbar { display: none; }
.onglets button, .onglets [role="tab"] {
	flex: none; white-space: nowrap;
	font: 600 var(--t-xs)/1 var(--f);
	font-variation-settings: "wdth" 112;
	letter-spacing: .06em; text-transform: uppercase;
	color: var(--doux);
	background: rgba(234,244,246,.04);
	border: 1px solid var(--ligne-forte);
	border-radius: 999px;
	padding: .7rem 1rem;
	min-height: 44px;
	cursor: pointer;
}
.onglets [aria-selected="true"] { color: var(--nuit); background: var(--menthe); border-color: var(--menthe); }
.onglets button:hover, .onglets [role="tab"]:hover { color: var(--texte); border-color: var(--texte); }
.onglets [aria-selected="true"]:hover { color: var(--nuit); border-color: var(--menthe); }
/* Sans JavaScript, les onglets ne servent à rien : ils restent masqués et les trois panneaux s'affichent. */
html:not(.js) .onglets { display: none; }
html:not(.js) .panneau[hidden] { display: grid !important; }
html:not(.js) .panneau + .panneau { padding-top: var(--s-6); border-top: 1px solid var(--ligne); }

.panneau { display: grid; gap: var(--s-5); align-content: start; }
.panneau .titre, .heros .titre {
	font-size: var(--t-3xl);
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.08;
	font-variation-settings: "wdth" 110;
}
.panneau .titre em, .heros .titre em { font-style: normal; color: var(--menthe); }
.panneau .accroche {
	font-size: var(--t-xs); font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
	color: var(--ciel);
	font-variation-settings: "wdth" 118;
}
.panneau p.chapo, .panneau .chapo { font-size: var(--t-l); line-height: 1.5; color: var(--doux); max-width: 46ch; }
.orbite { position: relative; max-width: min(520px, 86vw); width: 100%; justify-self: center; aspect-ratio: 1; }
.orbite svg { width: 100%; height: 100%; display: block; overflow: visible; }
.orbite text { font-family: var(--f); font-weight: 700; font-variation-settings: "wdth" 115; letter-spacing: .04em; }
.orbite .anneau { transform-origin: 260px 260px; }
@media (min-width: 980px) {
	.heros .wrap { grid-template-columns: 1.25fr 1fr; align-items: center; }
}

/* ==========================================================================
   8. Logos clients
   ========================================================================== */
.logos { border-block: 1px solid var(--ligne); padding-block: var(--s-6); display: grid; gap: var(--s-3); overflow: hidden; }
.logos .wrap { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.logos h2 {
	font-size: var(--t-xs); font-weight: 600; line-height: 1.4;
	letter-spacing: .16em; text-transform: uppercase;
	color: var(--doux);
	font-variation-settings: "wdth" 118;
}
.rang { overflow: hidden; }
.piste {
	display: flex; flex-wrap: wrap;
	gap: var(--s-3) clamp(2rem, 1rem + 3vw, 4rem);
	list-style: none;
	margin: 0;
	padding: 0 var(--gouttiere-d) 0 var(--gouttiere-g);
}
.piste li {
	margin: 0;
	font-weight: 700;
	font-size: clamp(1rem, .9rem + .5vw, 1.35rem);
	line-height: 1.3;
	color: rgba(234,244,246,.55);
	white-space: nowrap;
	font-variation-settings: "wdth" 112;
}
.piste li:hover { color: var(--texte); }
.pause-btn {
	font: 600 .75rem/1 var(--f);
	background: none;
	border: 1px solid var(--ligne-forte);
	border-radius: 999px;
	padding: .55rem .85rem;
	cursor: pointer;
	color: var(--doux);
	min-height: 44px;
}
.pause-btn:hover { color: var(--texte); border-color: var(--texte); }
/* La pause n'a de sens que si le défilement est actif (JavaScript présent, mouvement autorisé). */
html:not(.js) .pause-btn { display: none; }
/* Défilement : uniquement quand theme.js a dupliqué les éléments et posé data-defile sur .logos, et que le mouvement est autorisé. */
@media (prefers-reduced-motion: no-preference) {
	.logos[data-defile] .rang {
		-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
		mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
	}
	.logos[data-defile] .piste {
		flex-wrap: nowrap;
		width: max-content;
		padding: 0;
		gap: clamp(2rem, 1rem + 3vw, 4rem);
		animation: defile 70s linear infinite;
	}
	.logos[data-defile] .piste > li:last-child { margin-right: clamp(2rem, 1rem + 3vw, 4rem); }
	.logos[data-defile] .rang.inverse .piste { animation-direction: reverse; animation-duration: 80s; }
	.logos:hover .piste, .logos:focus-within .piste, .logos.pause .piste { animation-play-state: paused; }
	@keyframes defile { to { transform: translateX(-50%); } }
}
@media (prefers-reduced-motion: reduce) {
	.piste [aria-hidden="true"] { display: none; }
	.pause-btn { display: none; }
}

/* ==========================================================================
   9. Métiers en bento
   ========================================================================== */
.bento { display: grid; gap: var(--s-4); }
.case {
	position: relative;
	background: var(--abysse);
	border: 1px solid var(--ligne);
	border-radius: var(--r-l);
	padding: clamp(1.4rem, 1rem + 1.5vw, 2.25rem);
	display: grid; gap: var(--s-4); align-content: start;
	overflow: hidden;
	min-width: 0;
}
.case::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit;
	background: radial-gradient(400px circle at var(--mx, 50%) var(--my, 0%), rgba(101,216,192,.10), transparent 60%);
	opacity: 0; pointer-events: none;
}
.case:hover { border-color: var(--ligne-forte); }
.case:hover::before { opacity: 1; }
.case h3 { font-size: var(--t-xl); line-height: 1.02; font-variation-settings: "wdth" 118; }
.case p { color: var(--doux); font-size: var(--t-s); }
.case .lien { color: var(--menthe); }
.case .pic { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; background: rgba(101,216,192,.12); color: var(--menthe); }
.case .pic svg { width: 28px; height: 28px; }
.case.ia { background: linear-gradient(160deg, #0F3A4C 0%, #0C2D3B 55%); border-color: rgba(101,216,192,.35); }
.case.ia .pic { background: var(--menthe); color: var(--nuit); }
.case .ph { aspect-ratio: 16/9; margin-top: var(--s-2); }
@media (min-width: 860px) {
	.bento { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.case.app { grid-column: span 4; grid-row: span 2; }
	.case.web { grid-column: span 2; grid-row: span 2; }
	.case.conseil { grid-column: span 3; }
	.case.ia { grid-column: span 3; }
}

/* ==========================================================================
   10. Chiffres
   ========================================================================== */
.chiffres { background: linear-gradient(180deg, var(--nuit), var(--abysse)); border-block: 1px solid var(--ligne); }
.chiffres .wrap { padding-block: var(--s-8); display: grid; gap: var(--s-6); }
.chiffres dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-6) 0; }
.chiffres dl div { display: flex; flex-direction: column-reverse; gap: var(--s-2); padding-inline: var(--s-4); border-left: 1px solid var(--ligne-forte); }
.chiffres dd {
	margin: 0;
	font-weight: 800; font-size: var(--t-chiffre); line-height: .9; letter-spacing: -.04em;
	font-variation-settings: "wdth" 125; font-variant-numeric: tabular-nums;
	color: var(--texte);
}
.chiffres dd small { font-size: .45em; color: var(--menthe); vertical-align: top; margin-left: .05em; }
.chiffres dt { color: var(--doux); font-size: var(--t-s); line-height: 1.35; }
.chiffres .bas { display: flex; flex-wrap: wrap; gap: var(--s-4); align-items: center; justify-content: space-between; }
.chiffres .bas p { font-size: var(--t-l); font-weight: 600; font-variation-settings: "wdth" 110; }
@media (min-width: 900px) {
	.chiffres dl { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ==========================================================================
   11. Expertises
   ========================================================================== */
.duo { display: grid; gap: var(--s-5); }
.panneau-exp { background: var(--abysse); border: 1px solid var(--ligne); border-radius: var(--r-l); overflow: hidden; display: grid; grid-template-rows: auto 1fr; min-width: 0; }
.panneau-exp .ph { border-radius: 0; aspect-ratio: 16/8; }
.panneau-exp .corps { padding: clamp(1.4rem, 1rem + 1.5vw, 2.5rem); display: grid; gap: var(--s-4); align-content: start; }
.slogan {
	font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.7rem);
	font-weight: 800; line-height: 1.08; letter-spacing: -.02em;
	font-variation-settings: "wdth" 110;
	margin: 0;
	max-width: none;
}
.slogan span { display: block; color: transparent; -webkit-text-stroke: 1.5px var(--menthe); }
@supports not (-webkit-text-stroke: 1px black) {
	.slogan span { color: var(--menthe); }
}
.panneau-exp h3 { font-size: var(--t-l); line-height: 1.2; font-variation-settings: "wdth" 110; }
.panneau-exp p { color: var(--doux); font-size: var(--t-s); }
.panneau-exp p.slogan { color: var(--texte); font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.7rem); }
.puces { display: flex; flex-wrap: wrap; gap: var(--s-2); list-style: none; margin: 0; padding: 0; }
.puces li {
	margin: 0;
	font-size: .78rem; font-weight: 600; letter-spacing: .02em; line-height: 1.2;
	padding: .45rem .75rem;
	border-radius: 999px;
	border: 1px solid var(--ligne-forte);
	color: var(--texte);
}
.puces li.fort { background: rgba(101,216,192,.14); border-color: transparent; color: var(--menthe); }
@media (min-width: 960px) {
	.duo { grid-template-columns: 1fr 1fr; }
}

/* ==========================================================================
   12. Frise verticale
   ========================================================================== */
.frise { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-5); }
.frise::before { content: ""; position: absolute; left: 11px; top: 6px; bottom: 6px; width: 2px; background: var(--ligne-forte); }
.frise::after {
	content: ""; position: absolute; left: 11px; top: 6px; width: 2px; height: calc(100% - 12px);
	background: linear-gradient(var(--menthe), var(--ciel));
	transform-origin: top;
	transform: scaleY(var(--progres, 1));
}
.frise > li, .frise > .frise-item { position: relative; padding-left: 48px; display: grid; gap: var(--s-2); align-content: start; }
.frise > li::before, .frise > .frise-item::before {
	content: ""; position: absolute; left: 4px; top: .35em;
	width: 16px; height: 16px; border-radius: 50%;
	background: var(--nuit); border: 2px solid var(--menthe);
}
.frise > .cle::before { background: var(--menthe); box-shadow: 0 0 0 6px rgba(101,216,192,.18); }
.frise time, .frise .frise-annee {
	font-weight: 800; font-size: var(--t-xl); line-height: 1; letter-spacing: -.02em;
	font-variation-settings: "wdth" 125; font-variant-numeric: tabular-nums;
}
.frise .cle time, .frise .cle .frise-annee { color: var(--menthe); }
.frise p { color: var(--doux); font-size: var(--t-s); }
.frise.frise--js:not(.ouverte) > .masque { display: none; }
@media (min-width: 900px) {
	.frise { grid-template-columns: 1fr 1fr; column-gap: 96px; row-gap: var(--s-6); }
	.frise::before, .frise::after { left: 50%; margin-left: -1px; }
	.frise > li, .frise > .frise-item { padding-left: 0; }
	.frise > .g { text-align: right; grid-column: 1; }
	.frise > .d { grid-column: 2; margin-top: var(--s-8); }
	.frise > .g p { margin-left: auto; }
	.frise > li::before, .frise > .frise-item::before { top: .3em; }
	.frise > .g::before { left: auto; right: -57px; }
	.frise > .d::before { left: -57px; }
}
.frise-pied { display: flex; flex-wrap: wrap; gap: var(--s-4); justify-content: center; margin-top: var(--s-7); }

/* ==========================================================================
   13. Section claire et témoignages
   ========================================================================== */
.clair, .is-style-clair { background: var(--glace); color: var(--encre); color-scheme: light; }
:is(.clair, .is-style-clair) .kicker { color: var(--lien-clair); }
:is(.clair, .is-style-clair) .tete p:not(.kicker) { color: var(--gris); }
:is(.clair, .is-style-clair) :where(h1, h2, h3, h4, h5, h6) { color: var(--encre); }
:is(.clair, .is-style-clair) :where(a:not(.wp-element-button):not(.btn)) { color: var(--lien-clair); }
:is(.clair, .is-style-clair) :focus-visible { outline-color: var(--lien-clair); }
:is(.clair, .is-style-clair) .wp-block-buttons .wp-block-button:not(.is-style-outline):not(.btn--ligne):not(.btn-bloc--ligne) > .wp-block-button__link,
:is(.clair, .is-style-clair) .btn:not(.btn--ligne) { background: var(--encre); border-color: var(--encre); color: var(--glace); }
:is(.clair, .is-style-clair) .wp-block-buttons .wp-block-button:is(.is-style-outline, .btn--ligne, .btn-bloc--ligne) > .wp-block-button__link,
:is(.clair, .is-style-clair) .btn--ligne { background: transparent; color: var(--encre); border-color: rgba(10,38,51,.25); }
:is(.clair, .is-style-clair) .wp-block-buttons .wp-block-button:is(.is-style-outline, .btn--ligne, .btn-bloc--ligne) > .wp-block-button__link:hover { color: var(--encre); border-color: var(--encre); }
:is(.clair, .is-style-clair) .wp-block-buttons .wp-block-button:not(.is-style-outline):not(.btn--ligne):not(.btn-bloc--ligne) > .wp-block-button__link:hover { background: var(--encre); color: var(--glace); box-shadow: 0 0 0 6px rgba(10,38,51,.12); }
:is(.clair, .is-style-clair) .wp-block-separator { color: rgba(10,38,51,.18); }

.citation { display: grid; gap: var(--s-6); }
.citation > .tete { margin: 0; }
.diapos { position: relative; display: grid; }
.diapo { grid-area: 1 / 1; margin: 0; display: grid; gap: var(--s-5); align-content: start; }
/* Diapositive inactive : gardée dans la grille (hauteur stable) mais invisible et hors de l'arbre d'accessibilité. */
.diapo[hidden] { display: grid !important; opacity: 0; visibility: hidden; transform: translateY(10px); }
.diapo h3 { font-size: var(--t-2xl); font-weight: 800; line-height: 1; font-variation-settings: "wdth" 118; color: var(--encre); }
.diapo blockquote, .diapo .wp-block-quote {
	margin: 0; padding: 0; border: 0;
	font-size: var(--t-l); line-height: 1.55;
	color: #24434F;
	max-width: 60ch;
}
.diapo blockquote p { max-width: none; }
.diapo figcaption, .diapo .signature { display: flex; gap: var(--s-3); align-items: center; }
.diapo .ini {
	flex: none;
	width: 48px; height: 48px; border-radius: 50%;
	background: var(--encre); color: var(--menthe);
	display: grid; place-items: center;
	font-weight: 800; line-height: 1;
	font-variation-settings: "wdth" 120;
}
.diapo figcaption b, .diapo .nom { display: block; font-weight: 700; color: var(--encre); }
.diapo figcaption span span, .diapo .lieu { font-size: var(--t-xs); letter-spacing: .12em; text-transform: uppercase; color: var(--gris); }
/* Superposition des diapositives seulement quand theme.js a pris la main (.diapos--js) ; sinon elles s'empilent. */
.diapos:not(.diapos--js) { gap: var(--s-7); }
.diapos:not(.diapos--js) > .diapo { grid-area: auto; }
.diapos:not(.diapos--js) > .diapo + .diapo { padding-top: var(--s-7); border-top: 1px solid rgba(10,38,51,.14); }

.commandes { display: flex; gap: var(--s-3); align-items: center; }
.rond {
	width: 48px; height: 48px; border-radius: 50%;
	border: 1.5px solid rgba(10,38,51,.25);
	background: transparent; color: var(--encre);
	display: grid; place-items: center;
	cursor: pointer; padding: 0;
}
.rond:hover { background: var(--encre); color: var(--glace); }
.rond svg { width: 18px; height: 18px; }
.points { display: flex; gap: 8px; margin-left: var(--s-3); }
.points button { width: 44px; height: 44px; margin-inline: -8px; border: 0; background: none; padding: 0; cursor: pointer; display: grid; place-items: center; }
.points button::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: rgba(10,38,51,.25); }
.points button[aria-current="true"]::before { width: 26px; border-radius: 6px; background: var(--encre); }
.compteur { margin-left: auto; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--gris); font-variation-settings: "wdth" 120; }

/* ==========================================================================
   14. FAQ et bloc Détails (accordéons natifs)
   ========================================================================== */
.faq .grille { display: grid; gap: var(--s-6); }
.faq .grille > .tete { margin: 0; align-content: start; }
:where(.faq details, .wp-block-details) { border-bottom: 1px solid var(--ligne); margin: 0; }
.faq details:first-of-type, .wp-block-details:first-of-type, :not(.wp-block-details) + .wp-block-details { border-top: 1px solid var(--ligne); }
.wp-block-details + .wp-block-details { margin-top: 0 !important; }
:where(.faq summary, .wp-block-details > summary) {
	list-style: none; cursor: pointer;
	display: flex; gap: var(--s-4); justify-content: space-between; align-items: center;
	padding: var(--s-5) 0;
	min-height: 44px;
	font-weight: 700; font-size: var(--t-l); line-height: 1.3;
	font-variation-settings: "wdth" 110;
}
:where(.faq summary, .wp-block-details > summary)::-webkit-details-marker { display: none; }
:where(.faq summary, .wp-block-details > summary)::marker { content: ""; }
:where(.faq summary, .wp-block-details > summary)::after {
	content: ""; flex: none; width: 36px; height: 36px; border-radius: 50%;
	background: rgba(101,216,192,.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 3v10M3 8h10' stroke='%2365D8C0' stroke-width='1.8' fill='none'/%3E%3C/svg%3E") center / 16px no-repeat;
}
:where(.faq details[open] summary, .wp-block-details[open] > summary)::after { transform: rotate(45deg); }
.faq .rep, .wp-block-details > :not(summary) { color: var(--doux); }
.faq .rep { padding-bottom: var(--s-5); display: grid; gap: var(--s-3); }
.wp-block-details > :not(summary):last-child { padding-bottom: var(--s-5); }
.wp-block-details > summary + * { margin-top: 0; }
:is(.clair, .is-style-clair) :where(.wp-block-details, .faq details) { border-color: rgba(10,38,51,.18); }
:is(.clair, .is-style-clair) .wp-block-details > :not(summary), :is(.clair, .is-style-clair) .faq .rep { color: var(--gris); }
:is(.clair, .is-style-clair) :where(.faq summary, .wp-block-details > summary)::after {
	background-color: rgba(11,111,143,.12);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 3v10M3 8h10' stroke='%230B6F8F' stroke-width='1.8' fill='none'/%3E%3C/svg%3E");
}
@media (min-width: 960px) {
	.faq .grille { grid-template-columns: 5fr 7fr; }
}

/* ==========================================================================
   15. Blog : cartes d'articles (maquette .articles / .article et bloc Requête)
   ========================================================================== */
.articles, .wp-block-post-template.articles { display: grid; gap: var(--s-4); list-style: none; margin: 0; padding: 0; }
.articles > li { margin: 0; display: grid; min-width: 0; }
.article {
	position: relative;
	display: grid; grid-template-rows: auto 1fr;
	border-radius: var(--r-l);
	overflow: hidden;
	background: var(--abysse);
	border: 1px solid var(--ligne);
	text-decoration: none; color: inherit;
	height: 100%;
}
.article:hover, .article:focus-within { border-color: var(--menthe); }
.article .ph, .article .wp-block-post-featured-image { border-radius: 0; aspect-ratio: 16/9; margin: 0; overflow: hidden; }
.article .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.article .corps { padding: var(--s-5); display: grid; gap: var(--s-3); align-content: start; }
.article .corps:first-child { grid-row: 1 / -1; }
.article .meta { display: flex; gap: .8em; flex-wrap: wrap; align-items: center; font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--doux); line-height: 1.4; }
.article .meta b, .article .meta .wp-block-post-terms, .article .meta .wp-block-post-terms a { color: var(--menthe); font-weight: 600; text-decoration: none; }
.article .meta > * { margin: 0; font-size: inherit; letter-spacing: inherit; }
.article h3, .article .wp-block-post-title { font-size: var(--t-l); line-height: 1.2; font-weight: 700; font-variation-settings: "wdth" 108; margin: 0; }
.article .wp-block-post-title a { color: var(--texte); text-decoration: none; }
/* Toute la carte est cliquable (lien étendu sur le titre). */
.article .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.article .wp-block-post-title a:focus-visible { outline: none; }
.article .wp-block-post-title a:focus-visible::after { outline: 3px solid var(--menthe); outline-offset: 3px; }
.article .wp-block-post-terms a, .article .meta a { position: relative; z-index: 2; }
.article .wp-block-post-excerpt { margin: 0; }
.article .wp-block-post-excerpt__more-text { display: none; }
@media (min-width: 640px) {
	.articles, .wp-block-post-template.articles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 860px) {
	.articles, .wp-block-post-template.articles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Pagination de la liste d'articles */
.wp-block-query-pagination { gap: var(--s-2); margin-top: var(--s-7); align-items: center; justify-content: center; }
.wp-block-query-pagination a, .wp-block-query-pagination .page-numbers {
	display: inline-grid; place-items: center;
	min-width: 44px; min-height: 44px; padding: 0 .9rem;
	border-radius: 999px; border: 1px solid var(--ligne-forte);
	color: var(--texte); text-decoration: none;
}
.wp-block-query-pagination .page-numbers.current { background: var(--menthe); border-color: var(--menthe); color: var(--nuit); }
.wp-block-query-pagination a:hover { border-color: var(--texte); }
.wp-block-query-pagination .page-numbers.dots { border: 0; }
.wp-block-query-no-results { color: var(--doux); }

/* ==========================================================================
   16. Contact : bureaux, carte formulaire, Contact Form 7
   ========================================================================== */
.contact .grille { display: grid; gap: var(--s-7); }
.contact .appel { display: grid; gap: var(--s-5); align-content: start; }
.contact .appel h2 { font-size: var(--t-2xl); line-height: 1.02; }
.contact .appel h2 em { font-style: normal; color: var(--menthe); }
.bureau { display: grid; gap: 2px; padding: var(--s-4) 0; border-top: 1px solid var(--ligne); }
.bureau h3 { font-size: var(--t-m); font-weight: 700; letter-spacing: 0; line-height: 1.3; font-variation-settings: "wdth" 105; }
.bureau address, .bureau .adresse { font-style: normal; color: var(--doux); font-size: var(--t-s); }
.bureau a { color: var(--texte); font-variant-numeric: tabular-nums; }

.formulaire {
	background: var(--glace);
	color: var(--encre);
	color-scheme: light;
	border-radius: var(--r-l);
	padding: clamp(1.25rem, 1rem + 2vw, 2.75rem);
	display: grid; gap: var(--s-5);
	align-content: start;
	min-width: 0;
}
.formulaire h2 { font-size: var(--t-xl); color: var(--encre); }
.formulaire a { color: var(--lien-clair); }
.formulaire :focus-visible { outline-color: var(--lien-clair); }
.champs { display: grid; gap: var(--s-4); }
.champ { display: grid; gap: .4rem; }
.champ label { font-weight: 600; font-size: var(--t-s); }
.champ label i { font-style: normal; color: var(--lien-clair); }
.champ input, .champ select, .champ textarea {
	font: inherit; font-size: 1rem;
	color: var(--encre); background: var(--blanc);
	border: 1.5px solid rgba(10,38,51,.18); border-radius: 10px;
	padding: .8rem .9rem; min-height: 48px; width: 100%;
	color-scheme: light;
}
.champ textarea { min-height: 140px; resize: vertical; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--lien-clair); box-shadow: 0 0 0 4px rgba(11,111,143,.18); }
.champ input:user-invalid { border-color: var(--erreur); }
.formulaire .btn { background: var(--encre); border-color: var(--encre); color: var(--glace); }
.formulaire .btn:hover { box-shadow: 0 0 0 6px rgba(10,38,51,.12); }
.formulaire .mention { font-size: var(--t-xs); color: var(--gris); }
.envoi { display: flex; flex-wrap: wrap; gap: var(--s-4); align-items: center; }
.retour { font-weight: 600; font-size: var(--t-s); color: var(--lien-clair); }
.pot { position: absolute !important; left: -9999px; }
@media (min-width: 640px) {
	.champs { grid-template-columns: 1fr 1fr; }
	.champ.large { grid-column: 1 / -1; }
}
@media (min-width: 1000px) {
	.contact .grille { grid-template-columns: 5fr 7fr; }
}

/* Contact Form 7 (formulaire be97630) : carte claire de la maquette. Le balisage CF7 est libre : on stylise les éléments génériques. */
.wpcf7 { color: var(--encre); color-scheme: light; max-width: 100%; }
:not(.formulaire) > .wpcf7 { background: var(--glace); border-radius: var(--r-l); padding: clamp(1.25rem, 1rem + 2vw, 2.75rem); }
.formulaire .wpcf7 { background: none; padding: 0; }
.wpcf7-form { display: grid; gap: var(--s-4); margin: 0; }
.wpcf7-form > p, .wpcf7-form .champ, .wpcf7-form > div:not(.wpcf7-response-output):not(.screen-reader-response) { margin: 0; }
.wpcf7-form p { max-width: none; }
.wpcf7-form label { display: grid; gap: .4rem; font-weight: 600; font-size: var(--t-s); color: var(--encre); }
/* Gabarit .champ (libellé séparé du champ) : le libellé reste sur une ligne avec son astérisque. */
.contact .formulaire .wpcf7-form .champ > label, .wpcf7 .wpcf7-form .champ > label { display: block; }
.wpcf7-form label i { font-style: normal; color: var(--lien-clair); }
.wpcf7-form .wpcf7-form-control-wrap { display: block; position: relative; }
.wpcf7-form :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], select, textarea) {
	display: block; width: 100%;
	font: 400 1rem/1.4 var(--f);
	color: var(--encre); background: var(--blanc);
	border: 1.5px solid rgba(10,38,51,.18); border-radius: 10px;
	padding: .8rem .9rem; min-height: 48px;
	color-scheme: light;
	-webkit-appearance: none; appearance: none;
}
/* Flèche du menu déroulant (l'apparence native est retirée) : sélecteur renforcé pour passer après le fond blanc des champs. */
.wpcf7 .wpcf7-form .wpcf7-form-control-wrap select, .wpcf7-form select {
	padding-right: 2.5rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%230A2633' stroke-width='1.6'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
	background-position: right .9rem center;
	background-size: 12px;
	background-repeat: no-repeat;
}
.wpcf7-form textarea { min-height: 140px; resize: vertical; }
.wpcf7-form :is(input, select, textarea)::placeholder { color: var(--gris); opacity: 1; }
.wpcf7-form :is(input, select, textarea):focus { outline: none; border-color: var(--lien-clair); box-shadow: 0 0 0 4px rgba(11,111,143,.18); }
.wpcf7-form :is(input, select, textarea):user-invalid,
.wpcf7-form .wpcf7-not-valid { border-color: var(--erreur); }
.wpcf7-form .wpcf7-not-valid-tip { display: block; margin-top: .35rem; font-size: var(--t-xs); font-weight: 600; color: var(--erreur); }
.wpcf7-form :is(.wpcf7-checkbox, .wpcf7-radio, .wpcf7-acceptance) .wpcf7-list-item { display: inline-flex; align-items: center; gap: .5rem; margin: 0 1rem .25rem 0; min-height: 44px; }
.wpcf7-form :is(input[type="checkbox"], input[type="radio"]) { width: 20px; height: 20px; accent-color: var(--lien-clair); }
.wpcf7-form .wpcf7-list-item-label { font-weight: 400; }
.wpcf7-form :is(input[type="submit"], button[type="submit"], .wpcf7-submit) {
	display: inline-flex; align-items: center; justify-content: center; gap: .6em;
	min-height: 46px; padding: .8rem 1.4rem;
	border-radius: 999px; border: 1.5px solid var(--encre);
	background: var(--encre); color: var(--glace);
	font: 600 var(--t-s)/1 var(--f); font-variation-settings: "wdth" 110;
	cursor: pointer; width: auto;
	-webkit-appearance: none; appearance: none;
}
.wpcf7-form :is(input[type="submit"], button[type="submit"], .wpcf7-submit):hover { box-shadow: 0 0 0 6px rgba(10,38,51,.12); }
.wpcf7-form :is(input[type="submit"], button[type="submit"], .wpcf7-submit):disabled { opacity: .6; cursor: progress; }
.wpcf7-form .wpcf7-spinner { margin: 0 0 0 .75rem; vertical-align: middle; }
.wpcf7 form .wpcf7-response-output {
	margin: var(--s-2) 0 0;
	padding: .8rem 1rem;
	border: 1.5px solid var(--lien-clair);
	border-radius: 10px;
	font-size: var(--t-s); font-weight: 600;
	color: var(--encre); background: var(--blanc);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output { border-color: var(--erreur); color: #7A1A14; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #1E7A5E; color: #145A45; }
.wpcf7 .screen-reader-response { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
@media (min-width: 640px) {
	.wpcf7-form .champs { grid-template-columns: 1fr 1fr; }
}

/* ==========================================================================
   17. Pied de page (partie de modèle « footer » avec la classe .pied)
   ========================================================================== */
.pied { border-top: 1px solid var(--ligne); color: var(--doux); font-size: var(--t-s); overflow: hidden; }
.pied a { color: var(--texte); text-decoration: none; }
.pied a:hover { color: var(--menthe); text-decoration: underline; }
.pied .haut { display: grid; gap: var(--s-6); padding-block: var(--s-8) var(--s-6); }
.pied h2, .pied .pied-titre {
	font-size: var(--t-xs); font-weight: 600; line-height: 1.4;
	letter-spacing: .16em; text-transform: uppercase;
	color: var(--menthe);
	margin: 0 0 var(--s-4);
	font-variation-settings: "wdth" 118;
}
.pied ul:not(.wp-block-social-links):not(.wp-block-navigation__container) { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; }
.pied address { font-style: normal; }
.pied address + address, .pied .adresse + .adresse { margin-top: var(--s-4); }
.pied .adresse strong { color: var(--texte); font-weight: 600; }
.pied .pied-col > *, .pied .pied-marque > * { margin-block: 0; }
.pied .pied-col > .pied-titre { margin-block: 0 var(--s-4); }
.pied .pied-col > .pied-titre:not(:first-child) { margin-top: var(--s-5); }
.pied .pied-marque > :is(.labels, .reseaux) { margin-top: var(--s-5); }
.pied .wp-block-image.logo { margin: 0; }
/* Menus du pied : blocs Navigation verticaux */
.pied .wp-block-navigation { font-size: var(--t-s); font-weight: 400; }
.pied .wp-block-navigation .wp-block-navigation__container { gap: .55rem; }
.pied .wp-block-navigation .wp-block-navigation-item__content { padding: 0; min-height: 24px; display: inline-flex; align-items: center; line-height: 1.4; }
.labels, .reseaux { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-5); }
.labels > p { margin: 0; }
.labels a { display: inline-flex; align-items: center; min-height: 36px; font-size: .75rem; font-weight: 600; border: 1px solid var(--ligne-forte); border-radius: 999px; padding: .45rem .75rem; }
.labels a:hover { border-color: var(--menthe); text-decoration: none; }
.reseaux a { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--ligne-forte); display: grid; place-items: center; }
.reseaux svg { width: 18px; height: 18px; }
/* Bloc Liens sociaux natif (classe .reseaux) */
.pied .wp-block-social-links.reseaux { gap: var(--s-2); padding: 0; }
.wp-block-social-links.reseaux .wp-social-link { margin: 0; background: transparent !important; color: var(--texte) !important; border-radius: 50%; }
.wp-block-social-links.reseaux .wp-social-link a { width: 44px; height: 44px; padding: 0; border-radius: 50%; border: 1px solid var(--ligne-forte); display: grid; place-items: center; color: inherit; }
.wp-block-social-links.reseaux .wp-social-link a:hover { border-color: var(--menthe); color: var(--menthe); }
.wp-block-social-links.reseaux .wp-social-link svg { width: 18px; height: 18px; fill: currentColor; }
/* « ACTIVE D » géant détouré, purement décoratif (texte généré, alternative vide pour les lecteurs d'écran). */
.geant {
	font-weight: 900; font-size: clamp(3rem, 1rem + 10vw, 11rem); line-height: .8; letter-spacing: -.04em;
	font-variation-settings: "wdth" 125;
	color: transparent;
	-webkit-text-stroke: 1px rgba(169,193,201,.28);
	white-space: nowrap;
	-webkit-user-select: none; user-select: none;
	padding-block: var(--s-4) 0;
	margin-bottom: -.12em;
	max-width: none;
}
.geant:empty::before { content: "ACTIVE\a0 D"; content: "ACTIVE\a0 D" / ""; }
.pied .bas { border-top: 1px solid var(--ligne); padding-block: var(--s-5) calc(var(--s-5) + env(safe-area-inset-bottom, 0px)); display: flex; flex-wrap: wrap; gap: var(--s-3); justify-content: space-between; font-size: var(--t-xs); }
.pied .bas p { margin: 0; max-width: none; }
.pied .bas a { text-decoration: underline; }
@media (min-width: 760px) {
	.pied .haut { grid-template-columns: 1.3fr 1fr 1fr 1.2fr; }
}

/* ==========================================================================
   18. Pages internes : bandeau de titre, contenu long, articles
   ========================================================================== */
/* Bandeau de titre des modèles (classe .bandeau-page, stylée par patterns-b.css) : compléments pour les blocs dynamiques. */
.bandeau-page .wp-block-post-title, .bandeau-page .wp-block-query-title { margin: 0; max-width: 22ch; font-size: var(--t-3xl); font-weight: 800; line-height: 1.08; letter-spacing: -.02em; font-variation-settings: "wdth" 110; }
.bandeau-page .wp-block-term-description { margin: 0; max-width: 56ch; font-size: var(--t-l); line-height: 1.5; color: var(--doux); }
.bandeau-page .wp-block-term-description p { margin: 0; }
.bandeau-page .meta-article { display: flex; flex-wrap: wrap; gap: .4rem 1rem; align-items: center; font-size: var(--t-xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--doux); }
.bandeau-page .meta-article > * { margin: 0; font-size: inherit; letter-spacing: inherit; }
.bandeau-page .meta-article a { color: var(--menthe); text-decoration: none; }
.bandeau-page .meta-article a:hover { text-decoration: underline; }
.bandeau-page .wp-block-search { max-width: 560px; }

/* Corps des pages et articles : texte long lisible sur fond sombre */
.contenu-page { padding-block: var(--s-7) var(--s-section); }
.contenu-page.sans-bandeau { padding-top: 0; }
.contenu-page { font-size: var(--t-m); line-height: 1.7; }
:is(.contenu-page.wp-block-post-content, .contenu-page .wp-block-post-content) > * + * { margin-block-start: 1.25em; }
:is(.contenu-page.wp-block-post-content, .contenu-page .wp-block-post-content) > :is(h2, h3, h4, h5, h6) { margin-block-start: 2.2em; }
:is(.contenu-page.wp-block-post-content, .contenu-page .wp-block-post-content) > :is(h2, h3, h4, h5, h6) + * { margin-block-start: .75em; }
:is(.contenu-page.wp-block-post-content, .contenu-page .wp-block-post-content) > :first-child { margin-block-start: 0; }
:where(.contenu-page) :where(h2) { font-size: var(--t-xl); line-height: 1.12; }
:where(.contenu-page) :where(h3) { font-size: var(--t-l); line-height: 1.2; font-variation-settings: "wdth" 108; }
:where(.contenu-page) :where(h4) { font-size: var(--t-m); }
:where(.contenu-page) :where(p, li) { max-width: 72ch; }
:where(.contenu-page) :where(a:not(.wp-element-button):not(.btn)) { color: var(--menthe); text-decoration: underline; text-underline-offset: .2em; }
:where(.contenu-page) :where(a:not(.wp-element-button):not(.btn)):hover { text-decoration-thickness: 2px; }
:where(.contenu-page) :where(ul, ol):not(.wp-block-post-template):not(.puces):not(.piste):not(.wp-block-social-links) { padding-left: 1.4em; }
:where(.contenu-page) :where(ul, ol) li + li { margin-top: .4em; }
:where(.contenu-page) :where(ul:not(.puces):not(.piste):not(.wp-block-post-template):not(.wp-block-social-links)) > li::marker { color: var(--menthe); }
:where(.contenu-page) :where(ol) > li::marker { color: var(--menthe); font-weight: 700; font-variant-numeric: tabular-nums; }
:where(.contenu-page) :where(hr) { border: 0; border-top: 1px solid var(--ligne-forte); }

/* Citations */
.wp-block-quote { margin-inline: 0; }
.wp-block-quote p { max-width: 62ch; }
.wp-block-quote cite, .wp-block-quote .wp-block-quote__citation { display: block; margin-top: .75rem; font-size: var(--t-s); font-style: normal; color: var(--doux); letter-spacing: .02em; }
.wp-block-pullquote { padding-block: var(--s-6); text-align: left; }
.wp-block-pullquote blockquote { margin: 0; }
.wp-block-pullquote p { font-variation-settings: "wdth" 112; }

/* Tableaux */
.wp-block-table { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-inline: 0; }
.wp-block-table table, :where(.contenu-page) table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.wp-block-table :is(th, td), :where(.contenu-page) table :is(th, td) { padding: .7rem .9rem; border: 0; border-bottom: 1px solid var(--ligne); text-align: left; vertical-align: top; }
.wp-block-table thead th, :where(.contenu-page) table thead th { color: var(--menthe); font-size: var(--t-xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; border-bottom: 1px solid var(--ligne-forte); }
.wp-block-table thead, .wp-block-table tfoot { border: 0; }
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background: rgba(234,244,246,.04); }
.wp-block-table.is-style-stripes { border-bottom: 0; }
.wp-block-table figcaption { color: var(--doux); font-size: var(--t-xs); margin-top: .5rem; }

/* Images et médias */
.wp-block-image { margin-inline: 0; }
.wp-block-image img { display: block; }
.wp-block-image figcaption, .wp-element-caption { color: var(--doux); font-size: var(--t-xs); margin-top: .6rem; text-align: left; }
.wp-block-gallery .wp-block-image img { border-radius: var(--r-m); }
.wp-block-embed iframe { max-width: 100%; border-radius: var(--r-m); }
.wp-block-cover { border-radius: var(--r-l); overflow: hidden; }
.wp-block-cover.alignfull { border-radius: 0; }

/* Code */
:where(.contenu-page) :where(code):not(pre code) { background: var(--abysse); border: 1px solid var(--ligne); border-radius: 6px; padding: .1em .35em; font-size: .9em; }
.wp-block-code { overflow-x: auto; }
.wp-block-code code { white-space: pre; }

/* Séparateur */
.wp-block-separator { border: 0; border-top: 1px solid var(--ligne-forte); opacity: 1; }
.wp-block-separator.is-style-dots { border: 0; }
.wp-block-separator.is-style-dots::before { color: var(--menthe); }

/* Article : image mise en avant, étiquettes, navigation entre articles, articles liés */
.article-une img { border-radius: var(--r-l); aspect-ratio: 16/9; object-fit: cover; width: 100%; }
.wp-block-post-terms.is-style-pastilles a, .etiquettes a { display: inline-flex; align-items: center; min-height: 32px; padding: .3rem .75rem; border-radius: 999px; border: 1px solid var(--ligne-forte); color: var(--texte); text-decoration: none; font-size: var(--t-xs); }
.wp-block-post-terms__separator { display: none; }
.wp-block-post-terms.is-style-pastilles, .etiquettes { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.navigation-articles { border-top: 1px solid var(--ligne); padding-top: var(--s-5); gap: var(--s-4); }
.navigation-articles a { color: var(--texte); text-decoration: none; font-weight: 600; }
.navigation-articles a:hover { color: var(--menthe); }
.articles-lies { border-top: 1px solid var(--ligne); }

/* Recherche */
.wp-block-search__inside-wrapper { gap: var(--s-2); border: 0; padding: 0; }
.wp-block-search__input {
	min-height: 48px; padding: .8rem 1rem;
	font: 400 1rem/1.4 var(--f);
	color: var(--texte); background: var(--abysse);
	border: 1.5px solid var(--ligne-forte); border-radius: 999px;
}
.wp-block-search__input::placeholder { color: var(--doux); opacity: 1; }
.wp-block-search__input:focus { outline: none; border-color: var(--menthe); box-shadow: 0 0 0 4px rgba(101,216,192,.18); }
.wp-block-search__button { margin-left: 0; min-height: 48px; border-radius: 999px; }
.wp-block-search__label { font-weight: 600; font-size: var(--t-s); margin-bottom: .4rem; }

/* Page 404 */
.page-404 .wp-block-search { max-width: 560px; }

/* ==========================================================================
   19. Animations (uniquement si l'utilisateur n'a pas demandé moins de mouvement)
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
	.entete { transition: background-color .3s, border-color .3s; }
	.btn, .wp-block-button__link { transition: transform .2s, box-shadow .25s, background-color .2s, border-color .2s, color .2s; }
	.btn:hover, .wp-block-button__link:hover { transform: translateY(-1px); }
	.btn--ligne:hover, :where(.is-style-outline, .btn--ligne, .btn-bloc--ligne) > .wp-block-button__link:hover { transform: none; }
	.btn::after, .wp-block-button__link::after, .lien > a::after, a.lien::after, .btn svg, .lien svg,
	.entete .btn-contact > .wp-block-navigation-item__content::after { transition: transform .2s; }
	.btn:hover::after, .wp-block-button__link:hover::after, .lien > a:hover::after, a.lien:hover::after, .btn:hover svg, .lien:hover svg,
	.entete .btn-contact > .wp-block-navigation-item__content:hover::after { transform: translateX(3px); }

	.aurore { animation: aurore 18s ease-in-out infinite alternate; }
	@keyframes aurore { to { transform: translate3d(-4%, 3%, 0) scale(1.08); } }
	.orbite .anneau { animation: tourne 60s linear infinite; }
	@keyframes tourne { to { transform: rotate(360deg); } }
	.orbite .noeud circle.c { transition: fill .4s, r .4s; }
	.orbite .noeud text { transition: fill .4s; }
	.js .panneau:not([hidden]) { animation: entree .5s cubic-bezier(.2,.7,.2,1); }
	@keyframes entree { from { opacity: .4; transform: translateY(8px); } }
	.onglets button, .onglets [role="tab"] { transition: color .2s, border-color .2s, background-color .2s; }

	.piste li { transition: color .2s; }
	.case { transition: border-color .3s, transform .3s; }
	.case::before { transition: opacity .3s; }
	.article { transition: border-color .3s, transform .3s; }
	.article:hover { transform: translateY(-3px); }
	.frise::after { transition: transform .1s linear; }
	.diapo { transition: opacity .45s ease, transform .45s ease, visibility .45s; }
	.rond { transition: background-color .2s, color .2s; }
	.points button::before { transition: width .3s, background-color .3s; }
	:where(.faq summary, .wp-block-details > summary)::after { transition: transform .3s; }
	.champ :is(input, select, textarea), .wpcf7-form :is(input, select, textarea) { transition: border-color .2s, box-shadow .2s; }
	.wpcf7-form :is(input[type="submit"], button[type="submit"], .wpcf7-submit) { transition: box-shadow .25s; }
}