/*
 * AS3P — base.css
 * Focus-ring global + reveals progressifs.
 * Toute couleur est une référence de token (var --wp--preset--*), jamais un littéral,
 * à l'exception de l'anneau de focus (ink-strong #FFFFFF, DESIGN.md components.focus-ring).
 */

/* Anneau de focus global : 2 px blanc, offset 2 px, sur tout élément interactif.
 * Fallback : :focus pour les navigateurs sans :focus-visible (anneau partout,
 * jamais rien) ; les navigateurs modernes annulent l'anneau hors focus-visible.
 */
:focus {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

:focus:not(:focus-visible) {
	outline: none;
}

:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

/* Reveals — amélioration progressive stricte.
 * Par défaut (sans JS, ou motion réduite) : tout est visible, aucune animation.
 */
.as3p-reveal {
	opacity: 1;
}

/* L'état initial masqué ne s'applique que si JS est actif (html.as3p-js,
 * posée par reveal.js) ET si l'utilisateur n'a pas réduit le mouvement.
 */
@media (prefers-reduced-motion: no-preference) {
	html.as3p-js .as3p-reveal {
		opacity: 0;
		transform: translateY(12px);
		transition: opacity 200ms ease-out, transform 200ms ease-out;
	}

	html.as3p-js .as3p-reveal.is-visible {
		opacity: 1;
		transform: none;
	}
}

/* ------------------------------------------------------------------ */
/* Skip-link : WP le rend nativement (#wp-skip-link, premier élément   */
/* focusable, cible #contenu) ; on charte son état focus via tokens.   */
/* ------------------------------------------------------------------ */
#wp-skip-link:focus {
	background: var(--wp--preset--color--surface-overlay);
	color: var(--wp--preset--color--ink-strong);
	padding: var(--wp--preset--spacing--unit) var(--wp--preset--spacing--gutter);
	text-decoration: underline;
	top: var(--wp--preset--spacing--unit);
	left: var(--wp--preset--spacing--unit);
}

/* ------------------------------------------------------------------ */
/* Header 72 px : fond surface, filet bas line, nav + CTA persistant.  */
/* ------------------------------------------------------------------ */
.as3p-header {
	position: relative;
	min-height: 72px;
	align-items: center;
	gap: var(--wp--preset--spacing--unit);
	border-bottom: 1px solid var(--wp--preset--color--line);
	padding: 0 var(--wp--preset--spacing--margin-mobile);
}

@media (min-width: 1024px) {
	.as3p-header {
		gap: var(--wp--preset--spacing--gutter);
		padding-left: var(--wp--preset--spacing--margin-desktop);
		padding-right: var(--wp--preset--spacing--margin-desktop);
	}
}

.as3p-header .wp-block-site-title {
	margin: 0;
	white-space: nowrap;
	/* Ellipse aussi en desktop : jamais de débordement horizontal. */
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

.as3p-header .wp-block-site-title a {
	text-decoration: none;
}

/* Nav desktop (repliée sous 880 px : évite le débordement 768-820 px). */
.as3p-nav__list {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--wp--preset--spacing--gutter);
	list-style: none;
	margin: 0;
	padding: 0;
}

.as3p-nav a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	white-space: nowrap;
}

.as3p-nav a:hover,
.as3p-nav a:focus {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

/* Repli mobile : <details> natif, zéro JS. Le CTA reste hors du repli. */
.as3p-nav-mobile {
	display: none;
}

.as3p-nav-mobile summary {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 var(--wp--preset--spacing--unit);
	color: var(--wp--preset--color--ink);
	cursor: pointer;
	list-style: none;
}

.as3p-nav-mobile summary::-webkit-details-marker {
	display: none;
}

.as3p-nav-mobile[open] summary {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

.as3p-nav-mobile nav {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 50;
	background: var(--wp--preset--color--surface-raised);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.as3p-nav-mobile__list {
	list-style: none;
	margin: 0;
	padding: var(--wp--preset--spacing--unit) var(--wp--preset--spacing--margin-mobile);
}

.as3p-nav-mobile__list a {
	display: flex;
	align-items: center;
	min-height: 44px;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.as3p-nav-mobile__list a:hover,
.as3p-nav-mobile__list a:focus {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

@media (max-width: 879.98px) {
	.as3p-nav {
		display: none;
	}

	.as3p-nav-mobile {
		display: block;
	}

	.as3p-header .wp-block-site-title {
		flex: 1;
	}
}

/* CTA orange — unique par écran, toujours visible (mobile compris). */
.as3p-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 var(--wp--preset--spacing--gutter);
	background: var(--wp--preset--color--cta);
	color: var(--wp--preset--color--on-cta);
	border-radius: var(--wp--custom--radius--none);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.as3p-cta:hover,
.as3p-cta:focus {
	background: var(--wp--preset--color--cta);
	color: var(--wp--preset--color--on-cta);
	text-decoration: underline;
}

@media (max-width: 879.98px) {
	.as3p-cta {
		padding: 0 calc(var(--wp--preset--spacing--unit) * 2);
	}
}

/* Très petits viewports (≤ 380 px, y c. 320 px zoomé) : CTA compacté,
 * jamais masqué. */
@media (max-width: 379.98px) {
	.as3p-cta {
		padding: 0 var(--wp--preset--spacing--unit);
		font-size: var(--wp--preset--font-size--caption);
	}
}

/* ------------------------------------------------------------------ */
/* Badge Parcours : pilule surface-overlay, texte ice, mono.           */
/* ------------------------------------------------------------------ */
.as3p-badge-parcours {
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.as3p-badge-parcours a {
	display: inline-block;
	background: var(--wp--preset--color--surface-overlay);
	color: var(--wp--preset--color--ice);
	border-radius: var(--wp--custom--radius--full);
	padding: calc(var(--wp--preset--spacing--unit) / 2) calc(var(--wp--preset--spacing--unit) * 2);
	text-decoration: none;
}

.as3p-badge-parcours a:hover,
.as3p-badge-parcours a:focus {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

/* ------------------------------------------------------------------ */
/* Accueil — hero : titre display-xl (40 px sous ~782 px, décision     */
/* différée de 1.1 : mapping display par pattern + media query, le h1  */
/* global reste 32 px), constellation SVG décorative en tokens.        */
/* Hero et Manifeste : JAMAIS de reveal (.as3p-reveal interdit ici).   */
/* ------------------------------------------------------------------ */
/* Le gap hero→Manifeste (section-gap 96/128) est porté par UN seul côté :
 * le padding-top du Manifeste. Le hero n'a AUCUN padding-bottom. */
.as3p-hero {
	position: relative;
	overflow: hidden;
	padding-top: var(--wp--preset--spacing--section-gap);
}

@media (min-width: 1024px) {
	.as3p-hero {
		padding-top: var(--wp--preset--spacing--section-gap-desktop);
	}
}

.as3p-hero__svg {
	position: absolute;
	inset: 0;
	width: 100%;
	/* Neutralise le max-width contentSize (1024 px) posé par le layout
	 * constrained de core sur ses enfants : le décor couvre tout le hero. */
	max-width: none;
	height: 100%;
	color: var(--wp--preset--color--accent);
	pointer-events: none;
}

/* Mobile : le cadrage xMaxYMid n'a plus de zone utile hors du titre —
 * le décor est masqué plutôt que rogné derrière le texte. */
@media (max-width: 781.98px) {
	.as3p-hero__svg {
		display: none;
	}
}

/* Forced colors (Windows High Contrast) : décor sans valeur informative. */
@media (forced-colors: active) {
	.as3p-hero__svg {
		display: none;
	}
}

.as3p-hero__edges {
	stroke: var(--wp--preset--color--line);
}

.as3p-hero__nodes circle {
	fill: var(--wp--preset--color--surface-raised);
	stroke: currentColor;
}

.as3p-hero__nodes .is-full {
	fill: currentColor;
	stroke: none;
}

.as3p-hero__inner {
	position: relative;
	z-index: 1;
}

.as3p-hero__title {
	max-width: 780px;
	font-size: var(--wp--preset--font-size--display-xl);
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	line-height: 1.05;
	letter-spacing: 0.025em;
}

/* Borne complémentaire exacte du palier display (not min-width : aucune
 * fenêtre morte entre 781.98 et 782 px). */
@media not all and (min-width: 782px) {
	.as3p-hero__title {
		font-size: var(--wp--preset--font-size--display-xl-mobile);
		line-height: 1.1;
	}
}

.as3p-hero__subtitle {
	max-width: 620px;
}

/* Bouton fantôme : bordure accent, texte ink, coins droits — jamais
 * un second CTA orange. */
.as3p-btn-ghost {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 calc(var(--wp--preset--spacing--unit) * 3.5);
	border: 1px solid var(--wp--preset--color--accent);
	border-radius: var(--wp--custom--radius--none);
	color: var(--wp--preset--color--ink);
	font-weight: 400;
	text-decoration: none;
}

.as3p-btn-ghost:hover,
.as3p-btn-ghost:focus {
	background: var(--wp--preset--color--surface-raised);
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

/* ------------------------------------------------------------------ */
/* Accueil — sections (Manifeste, annonce Cohortes).                   */
/* ------------------------------------------------------------------ */
.as3p-section {
	padding-top: var(--wp--preset--spacing--section-gap);
}

@media (min-width: 1024px) {
	.as3p-section {
		padding-top: var(--wp--preset--spacing--section-gap-desktop);
	}
}

/* Le Manifeste reste immédiatement sous le hero (FR-5) : ce padding-top est
 * le SEUL porteur du gap hero→Manifeste (paliers 96 mobile / 128 desktop
 * explicités — le markup du Manifeste ne porte plus .as3p-section). */
.as3p-manifeste {
	padding-top: var(--wp--preset--spacing--section-gap);
}

@media (min-width: 1024px) {
	.as3p-manifeste {
		padding-top: var(--wp--preset--spacing--section-gap-desktop);
	}
}

.as3p-cohortes {
	padding-bottom: var(--wp--preset--spacing--section-gap);
}

@media (min-width: 1024px) {
	.as3p-cohortes {
		padding-bottom: var(--wp--preset--spacing--section-gap-desktop);
	}
}

.as3p-section-head {
	margin-bottom: calc(var(--wp--preset--spacing--gutter) * 2);
}

/* ------------------------------------------------------------------ */
/* Manifeste : 5 cartes 01-05 — index mono ink-muted (jamais de        */
/* sarcelle < 24 px), carte entière cliquable, survol bordure accent.  */
/* Rangée de 5 (≥ 1024 px), 2 + 3 (tablette), pile (mobile).           */
/* ------------------------------------------------------------------ */
.as3p-manifeste__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--gutter);
}

/* Paliers en min-width cascadés : bornes exactement complémentaires,
 * aucune fenêtre morte entre 1023.98 et 1024 px. */
@media (min-width: 600px) {
	.as3p-manifeste__grid {
		grid-template-columns: repeat(6, 1fr);
	}

	.as3p-garantie {
		grid-column: span 2;
	}

	.as3p-garantie:nth-child(1),
	.as3p-garantie:nth-child(2) {
		grid-column: span 3;
	}
}

@media (min-width: 1024px) {
	.as3p-manifeste__grid {
		/* minmax(0, 1fr) : les titres 24 px replient sans élargir la piste. */
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

	.as3p-garantie,
	.as3p-garantie:nth-child(1),
	.as3p-garantie:nth-child(2) {
		grid-column: auto;
	}
}

/* Carte = groupe de blocs natifs ; le lien « Voir la preuve » est étendu à
 * toute la carte (pseudo-élément), la carte entière reste cliquable. */
.as3p-garantie {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--gutter);
	color: var(--wp--preset--color--ink);
}

.as3p-garantie:hover,
.as3p-garantie:focus-within {
	border-color: var(--wp--preset--color--accent);
}

.as3p-garantie__index {
	margin: 0 0 calc(var(--wp--preset--spacing--gutter) + var(--wp--preset--spacing--unit));
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--index-mono);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-garantie__title {
	margin: 0 0 var(--wp--preset--spacing--unit);
	/* headline-sm (24 px) : conforme au contrat DESIGN des titres de carte. */
	font-size: var(--wp--preset--font-size--headline-sm);
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink-strong);
}

.as3p-garantie__desc {
	flex: 1;
	margin: 0;
	font-size: var(--wp--preset--font-size--caption);
	line-height: 1.6;
}

.as3p-garantie__more-wrap {
	margin: var(--wp--preset--spacing--gutter) 0 0;
}

.as3p-garantie__more {
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

/* Étend la zone cliquable du lien à toute la carte. */
.as3p-garantie__more::after {
	content: "";
	position: absolute;
	inset: 0;
}

.as3p-garantie:hover .as3p-garantie__more,
.as3p-garantie:focus-within .as3p-garantie__more {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* ------------------------------------------------------------------ */
/* Annonce Cohortes : 2 cartes sobres → /se-former/ (bascule 4.1).     */
/* ------------------------------------------------------------------ */
.as3p-cohortes__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--gutter);
}

@media (min-width: 782px) {
	.as3p-cohortes__grid {
		grid-template-columns: 1fr 1fr;
	}
}

.as3p-cohorte {
	display: flex;
	flex-direction: column;
	margin: 0;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: calc(var(--wp--preset--spacing--gutter) + var(--wp--preset--spacing--unit));
}

.as3p-cohorte__index {
	margin: 0 0 var(--wp--preset--spacing--gutter);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--index-mono);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-cohorte__title {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-size: var(--wp--preset--font-size--headline-sm);
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink-strong);
}

.as3p-cohorte__desc {
	flex: 1;
	margin: 0 0 var(--wp--preset--spacing--gutter);
	color: var(--wp--preset--color--ink);
}

.as3p-cohorte__note {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-size: var(--wp--preset--font-size--caption);
	color: var(--wp--preset--color--ink-muted);
}

.as3p-cohorte__cta {
	margin: 0;
}

.as3p-cohorte__link {
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	min-height: 44px;
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.as3p-cohorte__link:hover,
.as3p-cohorte__link:focus {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* ------------------------------------------------------------------ */
/* Blog — cartes du listing (/blog/) : méta, titre, extrait.           */
/* Le post-template natif rend une liste <ul>/<li> : neutralisée —     */
/* scopée à la boucle du thème (as3p-article-list) pour ne jamais      */
/* déborder sur un autre bloc query.                                   */
/* ------------------------------------------------------------------ */
.as3p-article-list .wp-block-post-template {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--wp--preset--spacing--gutter);
}

.as3p-article-card {
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--gutter);
}

.as3p-article-card:hover,
.as3p-article-card:focus-within {
	border-color: var(--wp--preset--color--accent);
}

.as3p-article-card .wp-block-post-title {
	margin: 0;
}

.as3p-article-card .wp-block-post-title a {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: none;
}

.as3p-article-card .wp-block-post-title a:hover,
.as3p-article-card .wp-block-post-title a:focus {
	text-decoration: underline;
}

.as3p-article-card .wp-block-post-excerpt {
	margin: 0;
	font-size: var(--wp--preset--font-size--caption);
	line-height: 1.6;
}

.as3p-article-card .wp-block-post-excerpt__excerpt {
	margin: 0;
}

/* ------------------------------------------------------------------ */
/* Article — méta telemetry (date · catégorie · auteur) : mono,        */
/* ink-muted, jamais de sarcelle < 24 px.                              */
/* ------------------------------------------------------------------ */
.as3p-article-meta {
	/* Colonne resserrée (unit) : le « · » pseudo-élément fait le rythme. */
	gap: var(--wp--preset--spacing--unit);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-article-meta a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.as3p-article-meta a:hover,
.as3p-article-meta a:focus {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

/* Séparateur de méta UNIFIÉ (listing, article, cartes liées) : « · » en
   pseudo-élément — texte alternatif vide = ignoré des lecteurs d'écran
   (équivalent aria-hidden), jamais posé dans le flux texte. */
.as3p-article-meta > * + *::before,
.as3p-related-card__meta > * + *::before {
	content: "·";
	content: "·" / "";
	margin-right: var(--wp--preset--spacing--unit);
	color: var(--wp--preset--color--ink-muted);
}

/* ------------------------------------------------------------------ */
/* Article — image de tête importée et lien fantôme de fin.            */
/* ------------------------------------------------------------------ */
.as3p-article-figure {
	margin: 0 0 var(--wp--preset--spacing--gutter);
}

.as3p-article-figure img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: var(--wp--custom--radius--md);
}

.as3p-article-cta {
	margin-top: calc(var(--wp--preset--spacing--gutter) * 2);
}

/* ------------------------------------------------------------------ */
/* Article — « À lire ensuite » : 3 cartes même catégorie.             */
/* ------------------------------------------------------------------ */
.as3p-related {
	margin-top: calc(var(--wp--preset--spacing--gutter) * 2);
	margin-bottom: var(--wp--preset--spacing--section-gap);
	border-top: 1px solid var(--wp--preset--color--line);
	padding-top: calc(var(--wp--preset--spacing--gutter) * 2);
}

.as3p-related__title {
	margin: 0 0 var(--wp--preset--spacing--gutter);
}

.as3p-related__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--gutter);
}

@media (min-width: 782px) {
	.as3p-related__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.as3p-related-card {
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--gutter);
}

.as3p-related-card:hover,
.as3p-related-card:focus-within {
	border-color: var(--wp--preset--color--accent);
}

.as3p-related-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--unit);
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-related-card__title {
	margin: 0;
	/* headline-sm (24 px) : posé par le preset has-headline-sm-font-size
	   (contrat DESIGN des titres de carte, cf. 1.3) — pas de font-size ici. */
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	line-height: 1.25;
}

.as3p-related-card__title a {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: none;
}

.as3p-related-card__title a:hover,
.as3p-related-card__title a:focus {
	text-decoration: underline;
}

/* ------------------------------------------------------------------ */
/* Auteur — carte-bio E-E-A-T (templates/author.html) : monogramme     */
/* pilule (CSS pur, jamais Gravatar), nom, bio, liens de preuve.       */
/* ------------------------------------------------------------------ */
/* La carte POSSÈDE son layout (flex, repli, gap tokens) : elle ne dépend
   pas des styles générés par l'attribut layout du bloc — l'attribut du
   gabarit ne fait que refléter la même intention dans l'éditeur. */
.as3p-author-card {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--gutter);
	margin-bottom: calc(var(--wp--preset--spacing--gutter) * 2);
	padding-bottom: calc(var(--wp--preset--spacing--gutter) * 2);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

/* Pilule monogramme : lettre sarcelle (24 px — seuil charte respecté)
   sur surface-raised ; décorative (aria-hidden dans le gabarit). */
.as3p-author-monogram {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 64px;
	height: 64px;
	border-radius: var(--wp--custom--radius--full);
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--headline-sm);
	color: var(--wp--preset--color--accent);
}

/* Le corps absorbe l'espace restant et replie sous le monogramme quand
   la ligne est trop étroite (mobile) — jamais de débordement. */
.as3p-author-card__body {
	flex: 1 1 260px;
	min-width: 0;
}

.as3p-author-card .wp-block-query-title {
	margin: 0 0 var(--wp--preset--spacing--unit);
}

.as3p-author-card .wp-block-post-author-biography {
	margin: 0 0 var(--wp--preset--spacing--unit);
	max-width: 65ch;
	line-height: 1.6;
}

/* Couleurs/décoration des liens : héritées d'elements.link (theme.json) —
   aucune règle locale (l'ancien doublon ink/ink-strong est supprimé). */
.as3p-author-card__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--unit) var(--wp--preset--spacing--gutter);
	margin: 0;
	font-size: var(--wp--preset--font-size--caption);
}

/* ------------------------------------------------------------------ */
/* Footer : liste de liens sobre, texte hérité (ink-muted).            */
/* ------------------------------------------------------------------ */
.as3p-footer-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--unit) var(--wp--preset--spacing--gutter);
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: var(--wp--preset--font-size--caption);
}

.as3p-footer-nav a {
	color: inherit;
}

.as3p-footer-nav a:hover,
.as3p-footer-nav a:focus {
	color: var(--wp--preset--color--ink-strong);
}

/* ------------------------------------------------------------------ */
/* Bloc-réponse (pattern as3p/bloc-reponse) : réponse directe 40-60    */
/* mots, extraction-friendly — filet accent + fond surface-raised.     */
/* ------------------------------------------------------------------ */
.as3p-bloc-reponse {
	background: var(--wp--preset--color--surface-raised);
	border-left: 3px solid var(--wp--preset--color--accent);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--gutter);
	margin-bottom: var(--wp--preset--spacing--gutter);
}

.as3p-bloc-reponse p {
	margin: 0;
	max-width: 65ch;
	line-height: 1.6;
}

/* Réponse en plusieurs paragraphes : respiration entre eux (le margin: 0
   ci-dessus les collerait). */
.as3p-bloc-reponse p + p {
	margin-top: var(--wp--preset--spacing--unit);
}

/* ------------------------------------------------------------------ */
/* FAQ (pattern as3p/faq) : accordéons details natifs, zéro JS —       */
/* chevron 100 % CSS (marqueur natif masqué), une ancre par question.  */
/* ------------------------------------------------------------------ */
.as3p-faq .as3p-faq__item {
	margin: 0 0 var(--wp--preset--spacing--unit);
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: 0 var(--wp--preset--spacing--gutter);
}

/* Cible d'ancre (lien direct vers une question) : filet accent. L'ancre est
   portée par le paragraphe de réponse (le fragment révèle le details parent) ;
   :has() remonte au conteneur — amélioration progressive, sans lui le details
   s'ouvre quand même. */
.as3p-faq .as3p-faq__item:has(:target) {
	border-color: var(--wp--preset--color--accent);
}

.as3p-faq summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--unit);
	padding: var(--wp--preset--spacing--unit) 0;
	cursor: pointer;
	list-style: none;
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	color: var(--wp--preset--color--ink-strong);
}

.as3p-faq summary::-webkit-details-marker {
	display: none;
}

/* Chevron : deux bords rotés — pointe vers le bas fermé, vers le haut
   ouvert. Graphique (non textuel) en ink-muted sur le fond surface-raised
   de l'item : ≈6,1:1 ≥ 3:1 (WCAG 1.4.11). */
.as3p-faq summary::after {
	content: "";
	flex-shrink: 0;
	width: 0.5em;
	height: 0.5em;
	margin-top: -0.25em;
	border-right: 2px solid var(--wp--preset--color--ink-muted);
	border-bottom: 2px solid var(--wp--preset--color--ink-muted);
	transform: rotate(45deg);
	transition: transform 0.15s ease;
}

.as3p-faq details[open] > summary::after {
	margin-top: 0.25em;
	transform: rotate(-135deg);
}

@media (prefers-reduced-motion: reduce) {
	.as3p-faq summary::after {
		transition: none;
	}
}

.as3p-faq .as3p-faq__item p {
	margin: 0 0 var(--wp--preset--spacing--unit);
	max-width: 65ch;
	line-height: 1.6;
}

/* ------------------------------------------------------------------ */
/* Glossaire (Story 2.4) — index A-Z (pattern as3p/glossaire-index) :  */
/* nav de lettres, groupes, entrées filets (écho de la source Astro),  */
/* et page-nœud (single-terme) : liste « Termes liés » en pilules.     */
/* Tokens uniquement.                                                  */
/* ------------------------------------------------------------------ */
.as3p-glossaire__lettres {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--unit);
	margin-bottom: var(--wp--preset--spacing--gutter);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.as3p-glossaire__lettres a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	/* 44 px : cible tactile minimale (WCAG 2.5.8 marge comprise). */
	min-width: 44px;
	min-height: 44px;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.as3p-glossaire__lettres a:hover,
.as3p-glossaire__lettres a:focus {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

.as3p-glossaire__groupe {
	margin-top: calc(var(--wp--preset--spacing--gutter) * 2);
}

.as3p-glossaire__lettre {
	margin: 0 0 var(--wp--preset--spacing--unit);
	padding-bottom: var(--wp--preset--spacing--unit);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.as3p-glossaire__entree {
	padding: var(--wp--preset--spacing--gutter) 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.as3p-glossaire__entree:last-child {
	border-bottom: 0;
}

/* Ancres héritées (/glossaire/#terme) : l'entrée ciblée ne doit pas
   atterrir sous un éventuel bandeau — marge de défilement + entrée
   soulignée par le filet accent. */
.as3p-glossaire__terme {
	margin: 0 0 calc(var(--wp--preset--spacing--unit) / 2);
	scroll-margin-top: var(--wp--preset--spacing--gutter);
	font-size: var(--wp--preset--font-size--headline-sm);
}

/* Le fragment hérité cible le h3 (id = ancre source) : mise en évidence
   de l'entrée atteinte par soulignement accent du terme. */
.as3p-glossaire__terme:target {
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--accent);
}

.as3p-glossaire__definition {
	margin: 0;
	max-width: 65ch;
	line-height: 1.6;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-glossaire__lien {
	margin: calc(var(--wp--preset--spacing--unit) / 2) 0 0;
}

/* Page-nœud : liste des termes liés en pilules (liens, jamais des
   boutons — navigation, pas action). */
.as3p-termes-lies {
	margin-top: calc(var(--wp--preset--spacing--gutter) * 2);
	border-top: 1px solid var(--wp--preset--color--line);
	padding-top: calc(var(--wp--preset--spacing--gutter) * 2);
}

.as3p-termes-lies__title {
	margin: 0 0 var(--wp--preset--spacing--gutter);
}

.as3p-termes-lies__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--unit);
	margin: 0;
	padding: 0;
	list-style: none;
}

.as3p-termes-lies__list a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 calc(var(--wp--preset--spacing--unit) * 2);
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--full);
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.as3p-termes-lies__list a:hover,
.as3p-termes-lies__list a:focus {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink-strong);
	text-decoration: underline;
}

/* ------------------------------------------------------------------ */
/* Vue graphe du glossaire (Story 3.5, FR18) — « voyager dans le       */
/* cerveau de l'IA ». ENRICHISSEMENT DÉCORATIF (revue 3.5) : le SVG est */
/* aria-hidden, l'index A-Z reste l'équivalent accessible complet.      */
/* AMÉLIORATION PROGRESSIVE STRICTE : le conteneur est [hidden] par     */
/* défaut (aucun espace occupé sans JS) ; seul                          */
/* assets/js/glossaire-graphe.js le révèle. AUCUNE animation (layout    */
/* de force FIGÉ pré-calculé côté serveur) : prefers-reduced-motion     */
/* respecté de fait. MASQUÉ < 640 px et à l'impression (l'index prend   */
/* le relais). Tokens uniquement.                                       */
/* ------------------------------------------------------------------ */

/* Repli de robustesse : même si un reset tiers neutralisait le
   comportement natif de [hidden], le conteneur reste masqué sans JS. */
.as3p-glossaire-graphe[hidden] {
	display: none;
}

.as3p-glossaire-graphe {
	margin: 0 0 calc(var(--wp--preset--spacing--gutter) * 3);
}

.as3p-glossaire-graphe__titre {
	margin: 0 0 calc(var(--wp--preset--spacing--unit) / 2);
	font-size: var(--wp--preset--font-size--headline-sm);
}

.as3p-glossaire-graphe__intro {
	margin: 0 0 var(--wp--preset--spacing--gutter);
	max-width: 65ch;
	line-height: 1.6;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-glossaire-graphe__canvas {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--surface);
	padding: var(--wp--preset--spacing--unit);
	overflow-x: auto;
}

.as3p-graphe-svg {
	display: block;
	width: 100%;
	height: auto;
}

.as3p-glossaire-graphe__hint {
	margin: var(--wp--preset--spacing--unit) 0 0;
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.06em;
	color: var(--wp--preset--color--ink-muted);
}

/* Arêtes : trait token `line` (var --line, pas accent-deep), ≥ 1.5 px. */
.as3p-graphe-edges line {
	stroke: var(--wp--preset--color--line);
	stroke-width: 1.5;
	opacity: 0.85;
}

/* Nœuds : <a> SVG DÉCORATIFS (tabindex=-1, aria-hidden via le SVG) —
   cliquables souris/tactile, hors tabulation, donc aucun anneau de focus
   clavier nécessaire (l'index A-Z porte l'accessibilité). */
.as3p-gnode {
	cursor: pointer;
	outline: none;
}

.as3p-gnode__pill {
	fill: var(--wp--preset--color--surface-raised);
	stroke: var(--wp--preset--color--accent);
	stroke-width: 1;
}

.as3p-gnode__label {
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: 13px;
	fill: var(--wp--preset--color--ink);
	pointer-events: none;
}

/* Termes non promus : point sobre, libellé révélé au survol/focus. */
.as3p-gnode__dot {
	fill: var(--wp--preset--color--surface-overlay);
	stroke: var(--wp--preset--color--accent);
	stroke-width: 1;
}

.as3p-gnode__label--dot {
	opacity: 0;
	transition: opacity 120ms linear;
}

.as3p-gnode--terme:hover .as3p-gnode__label--dot {
	opacity: 1;
}

/* Mise en évidence des nœuds au survol (souris/tactile — décoratif). */
.as3p-gnode--promu:hover .as3p-gnode__pill {
	fill: var(--wp--preset--color--accent);
	stroke: var(--wp--preset--color--accent);
}

.as3p-gnode--promu:hover .as3p-gnode__label {
	fill: var(--wp--preset--color--on-cta);
}

.as3p-gnode--terme:hover .as3p-gnode__dot {
	fill: var(--wp--preset--color--accent);
}

/* Le libellé « label--dot » reste caché tant qu'aucune interaction :
   pas d'animation d'apparition sous reduced-motion. */
@media (prefers-reduced-motion: reduce) {
	.as3p-gnode__label--dot {
		transition: none;
	}
}

/* Lisibilité mobile (revue 3.5) : sous ~640 px, les libellés du graphe
   deviennent trop petits — on MASQUE le graphe décoratif, l'index A-Z
   (équivalent accessible complet) prend le relais. Cohérent avec le
   caractère décoratif : rien n'est perdu. */
@media (max-width: 640px) {
	.as3p-glossaire-graphe {
		display: none;
	}
}

/* Impression : le graphe décoratif n'a pas de sens sur papier — masqué,
   l'index A-Z reste imprimé. */
@media print {
	.as3p-glossaire-graphe {
		display: none;
	}
}

/* ------------------------------------------------------------------ */
/* Déployer (3.1) — options de déploiement : 3 cartes sobres           */
/* local / cloud souverain Infomaniak / hybride (pattern               */
/* as3p/options-deploiement). Tokens uniquement, index mono ink-muted. */
/* ------------------------------------------------------------------ */
.as3p-options__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--gutter);
}

@media (min-width: 782px) {
	.as3p-options__grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.as3p-option {
	margin: 0;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: calc(var(--wp--preset--spacing--gutter) + var(--wp--preset--spacing--unit));
}

.as3p-option__index {
	margin: 0 0 var(--wp--preset--spacing--gutter);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--index-mono);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-option__title {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-size: var(--wp--preset--font-size--headline-sm);
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink-strong);
}

.as3p-option__desc {
	margin: 0;
	color: var(--wp--preset--color--ink);
}

/* ------------------------------------------------------------------ */
/* Hubs du Parcours (3.1) — Query Loop des contenus rattachés au       */
/* terme etape-parcours (mécanisme unique de rattachement). Le         */
/* post-template natif rend <ul>/<li> : neutralisé, scopé à            */
/* .as3p-hub-liste pour ne jamais déborder sur un autre bloc query.    */
/* ------------------------------------------------------------------ */
.as3p-hub-liste .wp-block-post-template {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--wp--preset--spacing--unit);
}

.as3p-hub-liste .wp-block-post-template > li {
	margin: 0;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--gutter);
}

.as3p-hub-liste .wp-block-post-title {
	margin: 0;
	font-size: var(--wp--preset--font-size--headline-sm);
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	line-height: 1.25;
}

.as3p-hub-liste .wp-block-post-title a {
	color: var(--wp--preset--color--ink-strong);
	text-decoration: none;
}

.as3p-hub-liste .wp-block-post-title a:hover,
.as3p-hub-liste .wp-block-post-title a:focus {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* ------------------------------------------------------------------ */
/* Sécurité (3.2) — schéma des 3 filtres (pattern as3p/schema-3-       */
/* filtres). Règles spine : flux autorisé/filtres porteurs de sens en  */
/* accent 2 px (≥ 3:1 sur surface-raised), flux ARRÊTÉS porteurs du    */
/* message central en ink-muted pointillé 2 px (6,13:1), décoratif en  */
/* accent-deep ; < 800 px la version EMPILÉE (blocs natifs) remplace   */
/* le SVG (jamais de réduction homothétique) ; alternative textuelle   */
/* visible dès 800 px ; AUCUNE animation (preuve : reveals interdits). */
/* ------------------------------------------------------------------ */
.as3p-schema3f__figure {
	margin: 0;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	/* Padding horizontal minimal (unit) : garde les textes du SVG
	 * ≥ 14 px effectifs au pire viewport desktop (bascule empilée à
	 * 800 px : ~744 px rendus / viewBox 960 × 19 px ≈ 14,7 px). Les
	 * marges internes du dessin font le reste. */
	padding: var(--wp--preset--spacing--gutter) var(--wp--preset--spacing--unit);
	/* Figure décorative (aria-hidden) : ni sélection ni interaction —
	 * le texte structuré fait foi. */
	-webkit-user-select: none;
	user-select: none;
	pointer-events: none;
}

.as3p-schema3f__svg {
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
}

.as3p-schema3f__svg text {
	font-family: var(--wp--preset--font-family--as3p-mono);
}

.as3p-s3f-ink {
	fill: var(--wp--preset--color--ink);
}

.as3p-s3f-muted {
	fill: var(--wp--preset--color--ink-muted);
}

/* Décoratif : constellation source (arêtes non porteuses de sens). */
.as3p-s3f-edges {
	stroke: var(--wp--preset--color--accent-deep);
	stroke-width: 1.5;
	fill: none;
}

/* Flux arrêtés par un filtre : PORTEURS du message central (« ce qui
 * ne passe pas s'arrête ») — ink-muted (#8FB8BD, 6,13:1 sur
 * surface-raised) pointillé 2 px, distinct du flux autorisé plein. */
.as3p-s3f-stopped {
	stroke: var(--wp--preset--color--ink-muted);
	stroke-width: 2;
	stroke-dasharray: 7 7;
	fill: none;
}

/* Flux autorisé (porteur de sens) : accent 2 px plein — 3,4:1 sur
 * surface-raised (≥ 3:1, WCAG 1.4.11). */
.as3p-s3f-flux {
	stroke: var(--wp--preset--color--accent);
	stroke-width: 2;
	fill: none;
}

/* Barre de filtre (porteuse de sens) : accent 2 px. */
.as3p-s3f-bar {
	stroke: var(--wp--preset--color--accent);
	stroke-width: 2;
}

.as3p-s3f-ring {
	fill: var(--wp--preset--color--surface);
	stroke: var(--wp--preset--color--accent);
	stroke-width: 2;
}

.as3p-s3f-ring--mid {
	fill: none;
	stroke: var(--wp--preset--color--accent-deep);
	stroke-width: 1.5;
}

.as3p-s3f-dot {
	fill: var(--wp--preset--color--accent);
}

/* Nœuds de données : porteurs de sens (sources des flux) — accent
 * 2 px, même poids que les barres de filtre. */
.as3p-s3f-node circle {
	fill: var(--wp--preset--color--surface);
	stroke: var(--wp--preset--color--accent);
	stroke-width: 2;
}

/* Version empilée (une étape par bloc) : masquée en desktop. */
.as3p-schema3f__stack {
	display: none;
}

.as3p-s3f-step {
	position: relative;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--gutter);
}

/* Connecteur vertical accent 2 px entre étapes (décoratif, CSS pur). */
.as3p-s3f-step + .as3p-s3f-step::before {
	content: "";
	position: absolute;
	top: calc(-1 * var(--wp--preset--spacing--gutter) - 1px);
	left: 50%;
	width: 2px;
	height: calc(var(--wp--preset--spacing--gutter) + 2px);
	background: var(--wp--preset--color--accent);
}

/* Index d'étape : h3 navigable (hiérarchie a11y) rendu en telemetry
 * mono 14 px (index-mono ≥ 14 px effectifs), graisse normale. */
.as3p-s3f-step__index {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--index-mono);
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
	line-height: 1.4;
}

.as3p-s3f-step__desc {
	margin: 0;
	max-width: 65ch;
	line-height: 1.6;
}

/* Alternative textuelle (lecture du schéma) : filet haut, ink-muted
 * hérité du corps — visible en desktop, remplacée par l'empilé mobile. */
.as3p-schema3f__alt {
	margin-top: var(--wp--preset--spacing--gutter);
	border-top: 1px solid var(--wp--preset--color--line);
	padding-top: var(--wp--preset--spacing--gutter);
}

.as3p-schema3f__alt p,
.as3p-schema3f__alt ol {
	max-width: 65ch;
	line-height: 1.6;
}

.as3p-schema3f__alt ol {
	margin: 0;
	padding-left: calc(var(--wp--preset--spacing--gutter) + var(--wp--preset--spacing--unit));
}

/* < 800 px : l'empilé REMPLACE le schéma large et sa lecture. Bascule
 * montée de 768 à 800 px (revue) : marge pour la barre de défilement —
 * à 800 px de fenêtre, la zone rendue garantit encore des textes SVG
 * ≥ 14 px effectifs. */
@media (max-width: 799.98px) {
	.as3p-schema3f__figure {
		display: none;
	}

	.as3p-schema3f__alt {
		display: none;
	}

	.as3p-schema3f__stack {
		display: block;
	}
}

/* Forced colors (Windows High Contrast) : le SVG est décoratif
 * (aria-hidden) — le texte structuré fait foi. */
@media (forced-colors: active) {
	.as3p-schema3f__figure {
		display: none;
	}
}

/* Impression : fonds transparents, encres foncées ; l'empilé (équivalent
 * textuel complet) remplace le SVG décoratif et l'alternative. */
@media print {
	.as3p-schema3f__figure,
	.as3p-schema3f__alt {
		display: none;
	}

	.as3p-schema3f__stack {
		display: block;
	}

	.as3p-s3f-step,
	.as3p-vignette,
	.as3p-integration__tag {
		background: transparent;
	}

	.as3p-s3f-step__index,
	.as3p-s3f-step__desc,
	.as3p-vignette__label,
	.as3p-vignette__title,
	.as3p-vignette__desc,
	.as3p-vignette__scope,
	.as3p-integration__label,
	.as3p-integration__tag {
		color: #111;
	}

	.as3p-s3f-step + .as3p-s3f-step::before {
		background: #111;
	}
}

/* ------------------------------------------------------------------ */
/* Sécurité (3.2) — vignettes assureurs : 3 cartes profil (labels      */
/* telemetry mono) + rangée d'intégration AD · SSO · MFA en pilules.   */
/* ------------------------------------------------------------------ */
.as3p-vignettes__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--gutter);
}

@media (min-width: 782px) {
	.as3p-vignettes__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.as3p-vignette {
	display: flex;
	flex-direction: column;
	margin: 0;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: calc(var(--wp--preset--spacing--gutter) + var(--wp--preset--spacing--unit));
}

.as3p-vignette__label {
	margin: 0 0 var(--wp--preset--spacing--gutter);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-vignette__title {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-size: var(--wp--preset--font-size--headline-sm);
	/* Open Sans porte une vraie graisse 600 (semibold). */
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink-strong);
}

.as3p-vignette__desc {
	flex: 1;
	margin: 0;
	color: var(--wp--preset--color--ink);
}

.as3p-vignette__scope {
	margin: var(--wp--preset--spacing--gutter) 0 0;
	padding-top: calc(var(--wp--preset--spacing--unit) * 2);
	border-top: 1px solid var(--wp--preset--color--line);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--index-mono);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--ink-muted);
	line-height: 1.6;
}

.as3p-integration {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: calc(var(--wp--preset--spacing--unit) * 2);
	margin-top: calc(var(--wp--preset--spacing--gutter) + var(--wp--preset--spacing--unit));
}

.as3p-integration__label {
	margin: 0;
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-integration__tag {
	display: inline-flex;
	align-items: center;
	margin: 0;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--full);
	padding: var(--wp--preset--spacing--unit) calc(var(--wp--preset--spacing--unit) * 2);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--ink);
}

/* ------------------------------------------------------------------ */
/* Page Cohorte (4.1) — en-tête de section (index mono + label), grille */
/* programme (cartes de modules composés du Catalogue), télémétrie des  */
/* infos clés et bandeau d'état pré-inscription. Tokens uniquement ;    */
/* la sarcelle (accent) sert soit à l'UI mono ≥ 24 px, soit en usage    */
/* décoratif assumé sous 24 px (pastille d'état aria-hidden de 8 px) ;   */
/* orange jamais ici (le seul CTA orange est le header). Zéro JS.        */
/* ------------------------------------------------------------------ */
.as3p-section-index {
	display: flex;
	align-items: baseline;
	gap: var(--wp--preset--spacing--unit);
	margin-bottom: var(--wp--preset--spacing--unit);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* En-tête de section composé en blocs (promesse « 01 » du post_content) :
   le groupe natif porte la même classe — neutraliser les marges de blocs. */
.as3p-section-index.wp-block-group {
	margin-top: var(--wp--preset--spacing--section-gap);
}

.as3p-section-index p {
	margin: 0;
}

.as3p-section-index__num {
	font-size: var(--wp--preset--font-size--index-mono);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--accent);
}

.as3p-section-index__label {
	color: var(--wp--preset--color--ink-muted);
}

.as3p-cohorte-infos,
.as3p-cohorte-inscription {
	margin-top: var(--wp--preset--spacing--section-gap);
}

/* Grille programme — cartes de modules (blocs natifs éditables du contenu). */
.as3p-cohorte-programme {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--gutter);
	margin-top: var(--wp--preset--spacing--gutter);
}

@media (min-width: 782px) {
	.as3p-cohorte-programme {
		grid-template-columns: 1fr 1fr;
	}
}

.as3p-cohorte-module {
	margin: 0;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: calc(var(--wp--preset--spacing--gutter) + var(--wp--preset--spacing--unit));
}

.as3p-cohorte-module:hover {
	border-color: var(--wp--preset--color--accent);
}

.as3p-cohorte-module__idx {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--index-mono);
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-cohorte-module__title {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-size: var(--wp--preset--font-size--headline-sm);
	font-weight: 600;
	line-height: 1.25;
	color: var(--wp--preset--color--ink-strong);
}

.as3p-cohorte-module__meta {
	margin: var(--wp--preset--spacing--unit) 0 0;
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

/* Télémétrie des infos clés — 4 cellules filetées, valeurs mono. */
.as3p-cohorte-telemetry {
	display: grid;
	grid-template-columns: 1fr;
	margin: var(--wp--preset--spacing--gutter) 0 0;
	border-top: 1px solid var(--wp--preset--color--line);
}

@media (min-width: 600px) {
	.as3p-cohorte-telemetry {
		grid-template-columns: 1fr 1fr;
	}
}

@media (min-width: 1024px) {
	.as3p-cohorte-telemetry {
		grid-template-columns: repeat(4, 1fr);
	}
}

.as3p-cohorte-telemetry__cell {
	padding: var(--wp--preset--spacing--gutter);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

@media (min-width: 1024px) {
	.as3p-cohorte-telemetry__cell {
		border-right: 1px solid var(--wp--preset--color--line);
		border-bottom: none;
	}

	.as3p-cohorte-telemetry__cell:last-child {
		border-right: none;
	}
}

.as3p-cohorte-telemetry__cell dt {
	margin: 0 0 var(--wp--preset--spacing--unit);
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

.as3p-cohorte-telemetry__cell dd {
	margin: 0;
	color: var(--wp--preset--color--ink-strong);
}

.as3p-cohorte-telemetry__line {
	display: block;
}

.as3p-cohorte-telemetry__pending {
	color: var(--wp--preset--color--ink-muted);
}

.as3p-cohorte-telemetry__note {
	display: block;
	margin: var(--wp--preset--spacing--unit) 0 0;
	font-size: var(--wp--preset--font-size--caption);
	color: var(--wp--preset--color--ink-muted);
	line-height: 1.5;
}

/* Bandeau d'état pré-inscription (piloté par le champ statut, AD-13). */
.as3p-cohorte-status {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--unit);
	margin: var(--wp--preset--spacing--gutter) 0 0;
	padding: var(--wp--preset--spacing--gutter);
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--sm);
}

/* Pastille d'état : sarcelle (accent) pour pré-inscription / inscription
   ouverte, atténuée (ink-muted) pour complet / fermé — la couleur suit le
   statut, pilotée par data-dot posé par le pattern cohorte-infos (AD-13). */
.as3p-cohorte-status__dot {
	flex: none;
	width: 8px;
	height: 8px;
	margin-top: 8px;
	border-radius: var(--wp--custom--radius--full);
	background: var(--wp--preset--color--accent);
}

.as3p-cohorte-status[data-dot="muted"] .as3p-cohorte-status__dot {
	background: var(--wp--preset--color--ink-muted);
}

.as3p-cohorte-status p {
	margin: 0;
}

.as3p-cohorte-status strong {
	color: var(--wp--preset--color--ink-strong);
}

.as3p-cohorte-inscription__reserved {
	margin: var(--wp--preset--spacing--gutter) 0 0;
	color: var(--wp--preset--color--ink);
}

/* Promesse (douleur → solution) : filet accent sobre, tokens uniquement. */
.as3p-cohorte-promesse {
	border-left: 2px solid var(--wp--preset--color--accent);
	padding-left: var(--wp--preset--spacing--gutter);
	color: var(--wp--preset--color--ink-strong);
}

/* Lien de rappel vers #inscription (pré-inscription / inscription ouverte) :
   style fantôme — jamais le CTA orange, réservé au header. */
.as3p-cohorte-jump {
	margin: var(--wp--preset--spacing--gutter) 0 0;
}

/* Repli du badge étape-parcours (terme absent) : même ton atténué. */
.as3p-badge-parcours--repli span {
	color: var(--wp--preset--color--ink-muted);
}

/* ------------------------------------------------------------------ */
/* Cas d'usage assurance (3.3) — matrice des droits : tableau natif    */
/* charté en tokens. Entêtes telemetry mono, première colonne (profil) */
/* mono ; le défilement horizontal éventuel reste contenu dans la      */
/* figure (jamais de scroll de page sur mobile).                       */
/* ------------------------------------------------------------------ */
.as3p-matrice {
	margin: var(--wp--preset--spacing--gutter) 0 0;
	overflow-x: auto;
}

.as3p-matrice table {
	width: 100%;
	min-width: 560px;
	border-collapse: collapse;
	background: var(--wp--preset--color--surface-raised);
}

.as3p-matrice th,
.as3p-matrice td {
	border: 1px solid var(--wp--preset--color--line);
	padding: calc(var(--wp--preset--spacing--unit) * 2) var(--wp--preset--spacing--gutter);
	text-align: left;
	vertical-align: top;
	color: var(--wp--preset--color--ink);
}

.as3p-matrice thead th {
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--label-mono);
	font-weight: 400;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-muted);
}

/* Première colonne = profil (th scope="row", a11y revue) : même
 * signature mono que les labels des vignettes de /securite/
 * (cohérence 3.2). */
.as3p-matrice tbody th {
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--index-mono);
	font-weight: 400;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--ink-muted);
	white-space: nowrap;
}

/* Impression (modèle 3.2, revu) : fonds transparents, encres foncées —
 * sélecteurs de spécificité ≥ aux règles écran (thead th, tbody th),
 * sinon les encres muted des entêtes et de la colonne profil gagnent ;
 * contraintes écran levées : plus de défilement (overflow visible),
 * plus de largeur minimale ni de nowrap sur la colonne profil. */
@media print {
	.as3p-matrice {
		overflow: visible;
	}

	.as3p-matrice table {
		background: transparent;
		min-width: 0;
	}

	.as3p-matrice th,
	.as3p-matrice td,
	.as3p-matrice thead th,
	.as3p-matrice tbody th,
	.as3p-matrice tbody td:first-child {
		color: #111;
		border-color: #111;
	}

	.as3p-matrice tbody th,
	.as3p-matrice tbody td:first-child {
		white-space: normal;
	}
}

/* ------------------------------------------------------------------ */
/* Formulaire d'inscription / pré-inscription (Story 4.2, Fluent Forms) */
/* Fluent applique des couleurs et contrastes clairs par défaut : on   */
/* les REMPLACE intégralement par les tokens du thème sombre. Champs    */
/* lisibles (ink-strong sur surface-raised), focus visible (anneau      */
/* accent), erreurs accessibles (role=alert), un seul bouton = CTA      */
/* orange. Aucun style ne dépend d'un asset Fluent ; tokens uniquement. */
/* ------------------------------------------------------------------ */
.as3p-cohorte-form {
	/* C8 (revue 4.2) : couleur d'ERREUR dédiée, distincte du CTA orange
	   (#FFA400) pour lever l'ambiguïté action/erreur. Coral #FF6F61 —
	   contraste AA sur les deux fonds sombres du thème (5.55:1 sur #002B30,
	   4.83:1 sur #00363C, ≥ 4.5:1). Le bouton d'envoi reste le seul orange. */
	--as3p-form-error: #FF6F61;

	margin: var(--wp--preset--spacing--gutter) 0 0;
}

.as3p-cohorte-form .fluentform {
	margin: 0;
}

/* Groupe de champ : espacement vertical régulier. */
.as3p-cohorte-form .ff-el-group {
	margin-bottom: var(--wp--preset--spacing--gutter);
}

/* Labels : encre forte, astérisque « requis » en accent. */
.as3p-cohorte-form .ff-el-input--label label,
.as3p-cohorte-form .ff-el-input--label {
	color: var(--wp--preset--color--ink-strong);
	font-weight: 600;
}

.as3p-cohorte-form .ff-el-is-required.asterisk-left label:before,
.as3p-cohorte-form .ff-el-is-required.asterisk-right label:after,
.as3p-cohorte-form .ff-el-input--label.ff-el-is-required:after {
	color: var(--wp--preset--color--accent);
}

/* Aide sous le champ : ton atténué. */
.as3p-cohorte-form .ff-el-help-message,
.as3p-cohorte-form .ff-el-input--content .ff-el-help-message {
	color: var(--wp--preset--color--ink-muted);
	font-size: var(--wp--preset--font-size--caption);
}

/* Contrôles de saisie : fond surface-raised, encre forte, filet line. */
.as3p-cohorte-form input[type="text"],
.as3p-cohorte-form input[type="email"],
.as3p-cohorte-form input[type="number"],
.as3p-cohorte-form input[type="tel"],
.as3p-cohorte-form select,
.as3p-cohorte-form textarea,
.as3p-cohorte-form .ff-el-form-control {
	width: 100%;
	min-height: 44px;
	padding: calc(var(--wp--preset--spacing--unit) * 1.5) var(--wp--preset--spacing--gutter);
	background: var(--wp--preset--color--surface-raised);
	color: var(--wp--preset--color--ink-strong);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--sm);
	font-family: inherit;
	font-size: inherit;
	line-height: 1.5;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}

.as3p-cohorte-form textarea,
.as3p-cohorte-form textarea.ff-el-form-control {
	min-height: 120px;
	resize: vertical;
}

/* Texte du placeholder : atténué mais lisible. */
.as3p-cohorte-form ::placeholder {
	color: var(--wp--preset--color--ink-muted);
	opacity: 1;
}

/* Focus visible : anneau accent (jamais l'anneau blanc global effacé ici). */
.as3p-cohorte-form input:focus,
.as3p-cohorte-form select:focus,
.as3p-cohorte-form textarea:focus,
.as3p-cohorte-form .ff-el-form-control:focus {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 1px;
	border-color: var(--wp--preset--color--accent);
}

/* Case à cocher RGPD : alignement et lisibilité. */
.as3p-cohorte-form .ff-el-form-check {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--unit);
	color: var(--wp--preset--color--ink);
}

.as3p-cohorte-form .ff-el-form-check-input,
.as3p-cohorte-form input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin-top: 2px;
	accent-color: var(--wp--preset--color--accent);
	flex: none;
}

.as3p-cohorte-form .ff-el-form-check-label,
.as3p-cohorte-form .ff_gdpr_field + label,
.as3p-cohorte-form .ff-el-form-check label {
	color: var(--wp--preset--color--ink);
	font-weight: 400;
}

/* État d'erreur (serveur ou blur TVA) : filet et message en couleur d'erreur
   dédiée (--as3p-form-error, distincte du CTA — C8), lisible sur fond sombre.
   role="alert" porté par le message. */
.as3p-cohorte-form .ff-el-is-error input,
.as3p-cohorte-form .ff-el-is-error select,
.as3p-cohorte-form .ff-el-is-error textarea,
.as3p-cohorte-form input[aria-invalid="true"],
.as3p-cohorte-form select[aria-invalid="true"],
.as3p-cohorte-form textarea[aria-invalid="true"] {
	border-color: var(--as3p-form-error);
}

.as3p-cohorte-form .error,
.as3p-cohorte-form .text-danger,
.as3p-cohorte-form .ff-el-is-error .error {
	margin-top: calc(var(--wp--preset--spacing--unit) / 2);
	color: var(--as3p-form-error);
	font-size: var(--wp--preset--font-size--caption);
}

/* Message d'erreur GLOBAL (AD-13 « inscriptions closes » / restrictions). */
.as3p-cohorte-form .ff-errors-in-stack,
.as3p-cohorte-form .error.text-danger.ff-el-is-error {
	color: var(--as3p-form-error);
}

/* Bouton d'envoi = LE CTA orange de la vue inscription (un seul bouton). */
.as3p-cohorte-form .ff-btn-submit,
.as3p-cohorte-form button[type="submit"],
.as3p-cohorte-form .ff_submit_btn_wrapper button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 var(--wp--preset--spacing--gutter);
	background: var(--wp--preset--color--cta);
	color: var(--wp--preset--color--on-cta);
	border: 0;
	border-radius: var(--wp--custom--radius--none);
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
}

.as3p-cohorte-form .ff-btn-submit:hover,
.as3p-cohorte-form .ff-btn-submit:focus,
.as3p-cohorte-form button[type="submit"]:hover,
.as3p-cohorte-form button[type="submit"]:focus {
	background: var(--wp--preset--color--cta);
	color: var(--wp--preset--color--on-cta);
	text-decoration: underline;
}

/* Message de confirmation à l'écran (« paiement à réception de facture »). */
.as3p-cohorte-form .ff-message-success {
	margin: 0;
	padding: var(--wp--preset--spacing--gutter);
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--accent);
	border-radius: var(--wp--custom--radius--sm);
	color: var(--wp--preset--color--ink-strong);
}

/* ================================================================== */
/* Story 4.3 — Entonnoir « Testez BrainDup » (façade démo + maquette)  */
/* ================================================================== */

/* Paliers de l'entonnoir : rythme vertical régulier, comme les sections
   Cohorte (aucune couleur nouvelle — tokens de la charte uniquement). */
.as3p-testez-demo,
.as3p-testez-mockup {
	margin-top: var(--wp--preset--spacing--section-gap);
}

/* ------------------------------------------------------------------ */
/* Palier 1 — Façade vidéo SANS TRACEUR (AD-9). La vidéo n'est chargée */
/* qu'au clic ; poster LOCAL (SVG inline), bouton de lecture ≥ 44 px,  */
/* focus visible. Ratio 16:9 stable (poster ET iframe injectée).       */
/* ------------------------------------------------------------------ */
.as3p-facade {
	margin-top: var(--wp--preset--spacing--gutter);
	max-width: 900px;
}

/* Conteneur focalisable (tabindex=-1) : repli de focus a11y après injection de
   l'iframe (C2). Focus PROGRAMMATIQUE seulement — pas d'anneau parasite autour
   de tout le bloc. */
.as3p-facade:focus {
	outline: none;
}

/* Utilitaire sr-only : masque visuellement en restant annoncé par les lecteurs
   d'écran (statut aria-live « Lecteur vidéo chargé »). */
.as3p-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.as3p-facade__stage {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	overflow: hidden;
}

/* Bouton de lecture : recouvre tout le poster (grande cible), transparent,
   coins hérités du stage. Sans JS il n'agit pas — le lien de repli prend le
   relais (amélioration progressive stricte). */
.as3p-facade__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	min-height: 44px;
	padding: 0;
	margin: 0;
	background: transparent;
	border: 0;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.as3p-facade__poster {
	position: absolute;
	inset: 0;
}

.as3p-facade__poster svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* Pastille de lecture (triangle) : cercle accent, triangle on-cta, ≥ 44 px. */
.as3p-facade__play-btn {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: var(--wp--custom--radius--full);
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink-strong);
	box-shadow: 0 0 0 6px rgba(0, 43, 48, 0.45);
	padding-left: 3px;
	transition: transform 0.15s ease, background 0.15s ease;
}

.as3p-facade__play:hover .as3p-facade__play-btn {
	background: var(--wp--preset--color--cta);
	color: var(--wp--preset--color--on-cta);
	transform: scale(1.06);
}

/* Focus visible : anneau accent net sur le bouton (clavier). */
.as3p-facade__play:focus-visible {
	outline: 3px solid var(--wp--preset--color--cta);
	outline-offset: -3px;
}

.as3p-facade__play:focus-visible .as3p-facade__play-btn {
	background: var(--wp--preset--color--cta);
	color: var(--wp--preset--color--on-cta);
}

@media (prefers-reduced-motion: reduce) {
	.as3p-facade__play-btn,
	.as3p-facade__play:hover .as3p-facade__play-btn {
		transition: none;
		transform: none;
	}
}

/* Iframe injectée AU CLIC (jamais présente au chargement) : occupe le stage. */
.as3p-facade__iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

/* Repli no-JS : lien texte first-party (redirection serveur), ton atténué. */
.as3p-facade__fallback {
	margin-top: var(--wp--preset--spacing--unit);
	color: var(--wp--preset--color--ink-muted);
	font-size: var(--wp--preset--font-size--caption);
}

.as3p-facade__fallback a {
	color: var(--wp--preset--color--ink);
}

/* ------------------------------------------------------------------ */
/* Palier 2 — Accès maquette : réutilise INTÉGRALEMENT le style du      */
/* formulaire 4.2 (.as3p-cohorte-form). Seul l'espacement propre au    */
/* palier est posé ici (aucune couleur ni contrôle nouveau).           */
/* ------------------------------------------------------------------ */
.as3p-mockup-form {
	margin-top: var(--wp--preset--spacing--gutter);
	max-width: 640px;
}

/* ------------------------------------------------------------------ */
/* Palier 2 — Façade RDV Calendly SANS TRACEUR (AD-9, Story 4.4).       */
/* Voie DIRECTE « réserver un échange », à côté du formulaire Mockup.   */
/* Aucune ressource Calendly avant clic ; embed INLINE au clic (FR16).  */
/* Bouton « Réserver » = SECONDAIRE (accent/ghost) — le SEUL CTA orange */
/* de la page reste le submit du formulaire.                            */
/* ------------------------------------------------------------------ */
.as3p-rdv {
	margin-top: var(--wp--preset--spacing--gutter);
	max-width: 640px;
	padding-top: var(--wp--preset--spacing--gutter);
	border-top: 1px solid var(--wp--preset--color--line);
}

.as3p-rdv__titre {
	margin: 0 0 var(--wp--preset--spacing--unit);
}

.as3p-rdv__intro {
	color: var(--wp--preset--color--ink-muted);
}

/* Conteneur focalisable (tabindex=-1) : repli de focus a11y après ouverture
   de l'embed (acquis 4.3, C2). Focus PROGRAMMATIQUE seulement. */
.as3p-rdv-facade {
	margin-top: var(--wp--preset--spacing--unit);
}

.as3p-rdv-facade:focus {
	outline: none;
}

/* Bouton SECONDAIRE (ghost accent) — surtout PAS orange (règle : un seul CTA
   orange par page = le submit du formulaire). Cible ≥ 44 px, focus visible. */
.as3p-rdv-facade__open {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0.7rem 1.4rem;
	font-family: var(--wp--preset--font-family--as3p-mono);
	font-size: var(--wp--preset--font-size--body);
	color: var(--wp--preset--color--ink-strong);
	background: transparent;
	border: 1px solid var(--wp--preset--color--accent);
	border-radius: var(--wp--custom--radius--md);
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.as3p-rdv-facade__open:hover {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink-strong);
	border-color: var(--wp--preset--color--accent);
}

.as3p-rdv-facade__open:focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.as3p-rdv-facade__open {
		transition: none;
	}
}

/* Conteneur d'embed inline (rempli AU CLIC seulement — jamais au chargement) :
   hauteur raisonnable, scroll interne, coins et bordure de la charte. */
.as3p-rdv-facade__embed {
	margin-top: var(--wp--preset--spacing--unit);
	width: 100%;
	min-height: 630px;
	overflow: auto;
	background: var(--wp--preset--color--surface-raised);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
}

.as3p-rdv-facade__embed:focus {
	outline: none;
}

/* Repli no-JS : lien texte first-party (redirection serveur), ton atténué. */
.as3p-rdv-facade__fallback {
	margin-top: var(--wp--preset--spacing--unit);
	color: var(--wp--preset--color--ink-muted);
	font-size: var(--wp--preset--font-size--caption);
}

.as3p-rdv-facade__fallback a {
	color: var(--wp--preset--color--ink);
}