/*
Theme Name: Antoine Codex
Theme URI: https://antoinecodex.example
Author: ANTOINE CODEX
Description: Thème sur mesure pour ANTOINE CODEX — traduit la direction visuelle validée (canvas "ANTOINE CODEX — Accueil", Fraunces + Inter) en pages WordPress réelles. Fonctionne avec le plugin "Antoine Codex — Core" pour le diagnostic, l'assistant IA et le formulaire de contact.
Version: 0.5.0-dev
Requires PHP: 7.4
Text Domain: antoine-codex-theme

0.4.3-dev (2026-09-26) — Menu mobile : se referme tout seul dès qu'un lien est
choisi (et avec Échap ou un clic en dehors) ; les sections avec ancre
s'arrêtent sous l'en-tête fixe. Un menu assigné dans Apparence → Menus reçoit
les mêmes classes (liens clairs) que le menu du thème.

0.4.2-dev (2026-09-25) — L'aperçu de l'assistant IA (accueil) et le bouton
« Discuter avec l'assistant IA » (Résolution de problèmes) sont masqués tant
que l'assistant n'est pas confirmé en ligne (plugin 0.4.5-dev).

0.4.1-dev (2026-09-25) — Page Contact « premium » (page-templates/contact.php) :
en-tête sombre, colonne d'accompagnement (Antoine, étapes après l'envoi,
contact direct, lien vers le diagnostic gratuit) à côté du nouveau
formulaire qualifiant du plugin antoine-codex-core 0.4.3-dev (à installer
ensemble). Styles : bloc « PAGE CONTACT « PREMIUM » » en fin de fichier.
0.4.0-dev (2026-09-25) — Demande d'Antoine : (1) nouvelle page « ANTOINE
CODEX — Résolution de problèmes d’entreprise » (/resolution-problemes-entreprise/,
page-templates/resolution-problemes-entreprise.php) : problème examiné,
méthode ANTOINE CODEX en cinq étapes, livrables, trois situations
schématiques (aucune donnée client, aucun résultat annoncé), les 18 pages
de la présentation « Méthode ANTOINE CODEX » affichées l'une sous l'autre
dans la page (images, AUCUN PDF publié ni téléchargeable — demande
d'Antoine), puis une section « Contactez ANTOINE CODEX » (rendez-vous,
échange, devis). La page
WordPress est créée automatiquement au premier passage d'un administrateur
dans wp-admin (inc/problem-solving.php). (2) Accent « Résolution de
problèmes d’entreprise » juste sous la vidéo de l'accueil, vers cette page.
(3) « Fondateur » : texte définitif fourni par Antoine, mot pour mot
(rétablit aussi la biographie longue du 2026-09-23, perdue avec la 0.3.3-dev
qui était construite sur le ZIP du 2026-09-19). (4) Sur la nouvelle page,
bloc « Gratuit en ligne, ou approfondi sur place » : diagnostic automatique
(questionnaire + assistant IA) gratuit ; mission de la présentation
payante, menée par une équipe d'ANTOINE CODEX sous la supervision
d'Antoine, qui se déplace dans l'entreprise. Styles : bloc .ac-ps-* et
.ac-founder--long en fin de fichier — aucune nouvelle couleur.

0.3.3-dev (2026-09-24) — Vidéo d'introduction qui ne se lançait plus
(desktop ET mobile, retour d'Antoine). Cause réelle constatée en direct :
hero-desktop.mp4 et hero-mobile.mp4 renvoyaient 404 sur antoinecodex.fr
(absents du dossier assets/video/ du serveur, alors que hero-poster.jpg y
était). Les deux fichiers sont bien inclus dans ce build ; front-page.php
n'annonce plus que les sources réellement présentes sur le disque et
affiche un avertissement aux seuls administrateurs connectés si l'une
manque. Lecture automatique renforcée (propriété muted forcée, nouvelle
tentative au premier geste du visiteur si le navigateur l'a bloquée —
mode Économie d'énergie de l'iPhone, économiseur de données…) et nouveau
bouton lecture/pause discret (WCAG 2.2.2), qui permet aussi de lancer la
vidéo quand « réduire les animations » est actif. Corrigé au passage : le
bouton « Discuter avec l'assistant IA » refermait le chat s'il était déjà
ouvert ; la bande claire de 22px entre la vidéo et le HERO est supprimée
à la source (.ac-video-hero__scroll, marge négative en bas aussi) — le
correctif ajouté dans Personnaliser > CSS additionnel peut être retiré, il
effaçait le halo doré et la trame du HERO. Styles ajoutés :
.ac-video-hero__toggle(-icon) et .ac-video-hero__admin-warning — aucune
nouvelle couleur.

0.3.2-dev (2026-09-19) — Retour direct d'Antoine après le déploiement de
0.3.1-dev : la carte "Diagnostic préliminaire gratuit" n'était pas assez
visible (trop bas dans la page, à côté de la section "Comment fonctionne
le diagnostic"). Déplacée juste après le HERO texte (donc immédiatement
après la vidéo d'introduction), dans sa propre section pleine largeur —
carte centrée, largeur raisonnable, jamais étirée bord à bord. La section
"Comment fonctionne le diagnostic" repasse à une seule colonne (elle ne
contient plus que la démo). Aucun changement de copie, de couleur ni de
logique — uniquement un déplacement de placement. Voir front-page.php et
.ac-diag-promo-section ci-dessous.

0.3.1-dev (2026-09-19) — Vidéo d'introduction de l'accueil remplacée par
une nouvelle version fournie par Antoine en 4K ("ANTOINE_CODEX_presentation
4К.mp4", HEVC 3840×2160, 30s, muette). Recompressée en H.264 (compatibilité
navigateur large) en deux poids : assets/video/hero-desktop.mp4 (1920×1080,
~5,7 Mo, ~1,5 Mbps) et assets/video/hero-mobile.mp4 (960×540, ~1 Mo,
~0,27 Mbps) — poids comparable à la version précédente malgré la source 4K.
assets/video/hero-poster.jpg regénéré depuis la nouvelle vidéo. Contenu de
la vidéo repris tel quel (fourni par Antoine) — aucun texte, chiffre ou
logo ajouté ici. Voir front-page.php pour le commentaire détaillé. Aucun
autre fichier modifié dans ce build (se cumule avec 0.3.0-dev ci-dessous,
non encore déployé au moment de ce changement).

0.3.0-dev (2026-09-19) — Nouveau questionnaire « Diagnostic rapide »
(voir antoine-codex-core 0.4.0-dev pour la logique) : la page
`/diagnostic/` (page-templates/diagnostic.php) affiche désormais le
shortcode [ac_diagnostic_rapide] au lieu de [ac_diagnostic_form] — même
page, même emplacement, nouveau composant. Nouvelle carte de présentation
sur l'accueil (front-page.php, section .ac-explainer restructurée en
grille 2 colonnes desktop / empilée mobile via .ac-explainer__grid) avec
le texte exact fourni par Antoine (label/titre/description/sous-ligne/
bouton « Commencer mon diagnostic »). Styles ajoutés dans style.css :
uniquement .ac-explainer__grid/__col-main et .ac-diag-promo (+ variantes
__label/__title/__desc/__subline/__btn) — 100% des jetons de couleur déjà
définis dans :root réutilisés, aucune nouvelle couleur introduite. Aucun
autre gabarit ni page modifiés dans ce build.

STATUT : la page dédiée au service "Diagnostic d'entreprise & Stratégie
de croissance" (page-templates/diagnostic-entreprise.php), la carte
correspondante sur l'accueil (front-page.php), le correctif global
prefers-reduced-motion et le support du champ "Extrait" pour les Pages,
déployés les 2026-09-18 (v0.1.7-dev à v0.1.8-dev), sont EN LIGNE et
vérifiés — voir README-DEV.md (racine du plugin antoine-codex-core)
pour le détail.

Ce build (0.1.9-dev) développe UNIQUEMENT l'étape 01 ("Comprendre votre
entreprise dans son ensemble") de la méthode en 8 étapes, sur la même
page de service : titre/texte courts mis à jour dans la carte
.ac-step existante, et ajout d'un nouveau bloc détaillé en dessous de
la grille des 8 étapes (nouvelle section .ac-step-detail, fond clair,
sous-titres + liste + CTA), demandé le 2026-09-18 par Antoine — aucune
autre étape, aucun autre gabarit, aucune autre page modifiée dans ce
build.
*/

/* ============================================================
   JETONS DE COULEUR / TYPO — repris tels quels du canvas validé.
   Ne pas modifier sans mettre à jour le canvas en parallèle.
   ============================================================ */

:root {
	--ac-ink: #14161a;
	--ac-surface-dark: #1e2127;
	--ac-cream: #f7f4ee;
	--ac-gold: #b8935a;
	--ac-gold-hover: #c7a671;
	--ac-charcoal: #2c2e33;
	--ac-cream-soft: #efeae0;
	--ac-border-light: #e0dacb;
	--ac-stone: #c9c4b6;
	--ac-slate: #4a4c50;
	--ac-taupe: #8a8677;
	--ac-black: #0f1013;
	--ac-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
	--ac-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--ac-gutter: 56px;
	--ac-max: 1200px;
}

@media (max-width: 782px) {
	:root {
		--ac-gutter: 20px;
	}
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--ac-cream);
	color: var(--ac-charcoal);
	font-family: var(--ac-font-body);
	font-size: 16px;
	line-height: 1.5;
}

a {
	text-decoration: none;
	color: inherit;
}

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

h1, h2, h3 {
	font-family: var(--ac-font-display);
	font-weight: 500;
	margin: 0;
}

.ac-container {
	max-width: var(--ac-max);
	margin: 0 auto;
	width: 100%;
}

.ac-section {
	padding: 72px var(--ac-gutter);
	box-sizing: border-box;
}

@media (max-width: 782px) {
	.ac-section {
		padding: 44px var(--ac-gutter);
	}
}

.ac-eyebrow {
	display: block;
	font-size: 13px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ac-gold);
	font-weight: 600;
}

/* ---------- Boutons ---------- */

.ac-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 15px 30px;
	border-radius: 4px;
	font-size: 15px;
	font-weight: 600;
	font-family: var(--ac-font-body);
	border: none;
	cursor: pointer;
	transition: background 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.ac-btn--gold {
	background: var(--ac-gold);
	color: var(--ac-black);
	box-shadow: 0 6px 18px rgba(184, 147, 90, 0.32);
}

.ac-btn--gold:hover {
	background: var(--ac-gold-hover);
	box-shadow: 0 8px 22px rgba(184, 147, 90, 0.42);
	transform: translateY(-1px);
}

.ac-btn--outline {
	border: 1px solid rgba(247, 244, 238, 0.55);
	color: var(--ac-cream);
	background: transparent;
}

.ac-btn--outline:hover {
	border-color: var(--ac-cream);
	background: rgba(247, 244, 238, 0.08);
}

.ac-btn-row {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	justify-content: center;
}

@media (max-width: 600px) {
	.ac-btn-row {
		flex-direction: column;
		width: 100%;
	}

	.ac-btn {
		width: 100%;
	}
}

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

.ac-header {
	position: sticky;
	top: 0;
	z-index: 100;
	height: 88px;
	background: var(--ac-ink);
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 var(--ac-gutter);
	box-sizing: border-box;
	border-bottom: 1px solid rgba(184, 147, 90, 0.22);
}

@media (max-width: 782px) {
	.ac-header {
		height: 72px;
	}
}

.ac-brand {
	display: flex;
	align-items: center;
	gap: 14px;
	color: var(--ac-cream);
}

.ac-brand__logo {
	width: 40px;
	height: 40px;
	object-fit: cover;
	border-radius: 50%;
}

@media (max-width: 782px) {
	.ac-brand__logo {
		width: 32px;
		height: 32px;
	}
}

/*
 * CORRIGÉ SUITE À REVUE DU 2026-09-17 : the_custom_logo() (utilisé dès
 * qu'Antoine a réellement téléversé un logo via Personnaliser > Identité du
 * site) génère son propre balisage WordPress natif (<a class="custom-logo-link">
 * > <img class="custom-logo">), PAS <img class="ac-brand__logo"> — la règle
 * ci-dessus n'a donc jamais pu s'appliquer à un vrai logo. Ce bug restait
 * invisible tant qu'aucun logo n'était configuré. Corrigé ici en ciblant le
 * balisage réel de WordPress, avec le même traitement rond 40px/32px.
 */
.ac-brand .custom-logo-link {
	display: inline-flex;
	line-height: 0;
}

.ac-brand .custom-logo {
	width: 40px;
	height: 40px;
	object-fit: cover;
	border-radius: 50%;
	display: block;
}

@media (max-width: 782px) {
	.ac-brand .custom-logo {
		width: 32px;
		height: 32px;
	}
}

.ac-brand__mark-link {
	display: inline-flex;
	line-height: 0;
}

.ac-brand__mark {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--ac-surface-dark);
	border: 1.5px solid var(--ac-gold);
	color: var(--ac-gold);
	font-family: var(--ac-font-display);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
}

@media (max-width: 782px) {
	.ac-brand__mark {
		width: 32px;
		height: 32px;
		font-size: 12px;
	}
}

.ac-brand__name {
	font-family: var(--ac-font-display);
	font-size: 19px;
	letter-spacing: 0.04em;
	font-weight: 500;
}

@media (max-width: 782px) {
	.ac-brand__name {
		font-size: 15px;
	}
}

.ac-nav {
	display: flex;
	align-items: center;
	gap: 32px;
}

.ac-nav__list {
	display: flex;
	align-items: center;
	gap: 32px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ac-nav__link {
	color: #e7e2d6;
	font-size: 14px;
}

.ac-nav__link:hover {
	color: var(--ac-gold);
}

.ac-header__cta {
	white-space: nowrap;
	padding: 11px 22px;
	font-size: 14px;
}

.ac-header__cta--mobile-only {
	display: none;
}

@media (max-width: 900px) {
	.ac-header__cta--desktop-only {
		display: none;
	}

	.ac-header__cta--mobile-only {
		display: inline-flex;
		width: 100%;
		margin-top: 8px;
	}
}

.ac-nav-toggle {
	display: none;
	width: 22px;
	height: 16px;
	flex-direction: column;
	justify-content: space-between;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
}

.ac-nav-toggle span {
	display: block;
	height: 2px;
	background: var(--ac-cream);
	border-radius: 1px;
}

@media (max-width: 900px) {
	.ac-nav {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--ac-ink);
		flex-direction: column;
		align-items: flex-start;
		padding: 16px var(--ac-gutter) 24px;
		gap: 16px;
		display: none;
	}

	.ac-nav.is-open {
		display: flex;
	}

	.ac-nav__list {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}

	.ac-header__cta {
		width: 100%;
		text-align: center;
	}

	.ac-nav-toggle {
		display: flex;
	}
}

/* ============================================================
   VIDÉO D'INTRODUCTION (hero vidéo) — AJOUTÉE 2026-09-19
   CORRIGÉE 2026-09-19 (retour d'Antoine, desktop ET mobile) : la première
   version forçait la section à occuper toute la hauteur d'écran restante
   sous l'en-tête (100vh - 88px). Sur la plupart des moniteurs desktop
   (16:9 ou plus larges une fois l'en-tête déduit), cela rendait le
   conteneur légèrement PLUS LARGE que la vidéo (ratio 16:9) par rapport à
   sa hauteur — avec `object-fit: cover`, le début et la fin du clip se
   retrouvaient donc rognés en haut/bas (texte "ANTOINE CODEX" de la scène
   finale coupé, notamment). Même symptôme, en pire, sur téléphone/tablette
   (rognage sur les côtés, confirmé par Antoine).
   Correction définitive : la section prend TOUJOURS exactement le ratio
   natif de la vidéo (16:9, identique pour hero-desktop.mp4 et
   hero-mobile.mp4), pleine largeur, quelle que soit la taille d'écran —
   `object-fit: cover` ne rogne alors plus jamais rien, puisque le
   conteneur a par construction le même ratio que le contenu. Le clip
   s'affiche donc TOUJOURS en entier, du premier au dernier cadre.
   ============================================================ */

.ac-video-hero {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--ac-ink); /* couleur de repli pendant le chargement de l'image d'affiche */
}

.ac-video-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

.ac-video-hero__overlay {
	position: absolute;
	inset: 0;
	/* Assombrit progressivement vers le bas, pour que l'indicateur de
	   défilement (gold sur fond sombre) reste lisible quelle que soit la
	   scène de la vidéo à cet instant. */
	background: linear-gradient(180deg, rgba(20, 22, 26, 0) 55%, rgba(20, 22, 26, 0.78) 100%);
	pointer-events: none;
}

/*
 * Bouton lecture/pause — AJOUTÉ 2026-09-24 (voir front-page.php). Discret,
 * dans le coin bas-droit (zone sans texte incrusté dans la vidéo), mêmes
 * jetons que le repère de défilement (or sur fond encre) : aucune nouvelle
 * couleur. Permet de mettre en pause (WCAG 2.2.2) et de lancer la vidéo
 * quand le navigateur ou le réglage « réduire les animations » bloque la
 * lecture automatique. Masqué (attribut hidden) tant que le script ne l'a
 * pas activé.
 */
.ac-video-hero__toggle {
	position: absolute;
	right: 16px;
	bottom: 16px;
	z-index: 2;
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border-radius: 50%;
	border: 1.5px solid rgba(184, 147, 90, 0.85);
	background: rgba(20, 22, 26, 0.55);
	color: var(--ac-gold);
	cursor: pointer;
	opacity: 0.85;
	transition: opacity 0.15s ease, background 0.15s ease;
}

.ac-video-hero__toggle[hidden] {
	display: none;
}

.ac-video-hero__toggle:hover,
.ac-video-hero__toggle:focus-visible {
	opacity: 1;
	background: rgba(20, 22, 26, 0.8);
}

.ac-video-hero__toggle:focus-visible {
	outline: 2px solid var(--ac-gold);
	outline-offset: 2px;
}

/* Icône « pause » (deux barres) ; « lecture » (triangle) quand la vidéo est arrêtée. */
.ac-video-hero__toggle-icon {
	display: block;
	width: 10px;
	height: 12px;
	border-left: 3px solid currentColor;
	border-right: 3px solid currentColor;
}

.ac-video-hero__toggle.is-paused .ac-video-hero__toggle-icon {
	width: 0;
	height: 0;
	margin-left: 3px;
	border-style: solid;
	border-width: 6px 0 6px 10px;
	border-color: transparent transparent transparent currentColor;
}

@media (max-width: 782px) {
	.ac-video-hero__toggle {
		right: 10px;
		bottom: 10px;
		width: 32px;
		height: 32px;
	}
}

/* Avertissement affiché UNIQUEMENT aux administrateurs connectés quand un
   fichier vidéo manque sur le serveur (voir front-page.php). Mêmes couleurs
   que .ac-notice--warning. */
.ac-video-hero__admin-warning {
	position: absolute;
	top: 12px;
	left: 12px;
	right: 12px;
	z-index: 3;
	margin: 0;
	padding: 10px 14px;
	border-radius: 6px;
	background: #fbeeda;
	border: 1px solid var(--ac-gold);
	color: var(--ac-charcoal);
	font-size: 13px;
	line-height: 1.45;
}

/*
 * CORRIGÉ 2026-09-19 — repositionné hors de la vidéo (voir commentaire
 * front-page.php) : élément normal du flux, centré, à cheval sur la
 * jonction vidéo/HERO via une marge négative — ne recouvre donc plus
 * jamais le texte incrusté dans la vidéo elle-même.
 * CORRIGÉ 2026-09-24 — la seule marge négative du HAUT laissait 22px de
 * hauteur dans le flux (44px - 22px) : une bande claire (fond de la page)
 * apparaissait sur toute la largeur entre la vidéo et le HERO. Marge
 * négative aussi en BAS : le repère ne prend plus aucune hauteur et
 * chevauche vraiment les deux sections. (Rend inutile le correctif
 * « bande blanche » ajouté dans Personnaliser > CSS additionnel, qui
 * supprimait au passage le halo doré et la trame du HERO.)
 */
.ac-video-hero__scroll {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: -22px auto -22px;
	border-radius: 50%;
	border: 1.5px solid var(--ac-gold);
	background: var(--ac-ink);
	animation: ac-video-hero-bounce 2.2s ease-in-out infinite;
}

.ac-video-hero__scroll:hover {
	border-color: var(--ac-gold-hover);
}

.ac-video-hero__scroll-chevron {
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--ac-gold);
	border-bottom: 2px solid var(--ac-gold);
	transform: rotate(45deg) translate(-2px, -2px);
}

@keyframes ac-video-hero-bounce {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(6px); }
}

@media (max-width: 782px) {
	.ac-video-hero__scroll {
		width: 38px;
		height: 38px;
		margin-top: -19px;
		margin-bottom: -19px;
	}
}

/* Mouvement réduit : la vidéo est déjà mise en pause via JS (voir
   front-page.php) ; ici on retire aussi l'animation de rebond décorative
   du repère de défilement. */
@media (prefers-reduced-motion: reduce) {
	.ac-video-hero__scroll {
		animation: none;
	}
}

/* ============================================================
   HERO
   ============================================================ */

.ac-hero {
	position: relative;
	background: linear-gradient(160deg, var(--ac-ink) 0%, var(--ac-surface-dark) 100%);
	padding: 76px var(--ac-gutter) 96px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 22px;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 36px));
	scroll-margin-top: 88px; /* AJOUTÉ 2026-09-19 — pour l'ancre #hero-suite, sous l'en-tête fixe */
}

.ac-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background-image:
		radial-gradient(ellipse 700px 420px at 50% -8%, rgba(184, 147, 90, 0.20), transparent 70%),
		radial-gradient(rgba(247, 244, 238, 0.06) 1px, transparent 1px);
	background-size: auto, 24px 24px;
	pointer-events: none;
}

.ac-hero > * {
	position: relative;
	z-index: 1;
}

@media (max-width: 782px) {
	.ac-hero {
		padding: 44px var(--ac-gutter) 60px;
		gap: 16px;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 20px));
		scroll-margin-top: 72px; /* AJOUTÉ 2026-09-19 — en-tête mobile plus bas (72px, voir .ac-header) */
	}
}

.ac-hero__mark {
	width: 150px;
	height: auto;
	opacity: 0.96;
}

@media (max-width: 782px) {
	.ac-hero__mark {
		width: 110px;
	}
}

/* CORRIGÉ SUITE À REVUE DU 2026-09-17 — même bug : the_custom_logo() rend
   <a class="custom-logo-link"><img class="custom-logo">, jamais
   <img class="ac-hero__mark">. Le wrapper .ac-hero__mark-wrap existait déjà
   dans front-page.php mais n'avait aucune règle le ciblant. */
.ac-hero__mark-wrap .custom-logo-link {
	display: inline-flex;
	line-height: 0;
}

.ac-hero__mark-wrap .custom-logo {
	/* AGRANDI 2026-09-19, à la demande d'Antoine (+40% : 150px → 210px
	   desktop, 110px → 154px mobile), même ratio conservé entre les deux. */
	width: 210px;
	height: 210px;
	object-fit: cover;
	border-radius: 50%;
	display: block;
	box-shadow: 0 0 0 1px rgba(184, 147, 90, 0.35), 0 14px 32px rgba(0, 0, 0, 0.4);
}

@media (max-width: 782px) {
	.ac-hero__mark-wrap .custom-logo {
		width: 154px;
		height: 154px;
	}
}

.ac-hero__eyebrow {
	margin-bottom: -4px;
}

.ac-hero__kicker {
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	color: var(--ac-stone);
	letter-spacing: 0.01em;
}

@media (max-width: 782px) {
	.ac-hero__kicker {
		font-size: 13.5px;
	}
}

.ac-hero__title {
	font-size: 45px;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.2;
	color: var(--ac-cream);
	max-width: 820px;
}

@media (max-width: 782px) {
	.ac-hero__title {
		font-size: 25px;
		line-height: 1.28;
	}
}

.ac-hero__lede {
	font-size: 17px;
	line-height: 1.6;
	color: var(--ac-stone);
	max-width: 620px;
	margin: 0;
}

@media (max-width: 782px) {
	.ac-hero__lede {
		font-size: 14.5px;
	}
}

/* ============================================================
   GRILLES DE CONTENU (leviers, situations, méthode)
   ============================================================ */

.ac-grid {
	display: grid;
	gap: 24px;
	max-width: var(--ac-max);
	width: 100%;
}

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

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

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

@media (max-width: 600px) {
	.ac-grid--4,
	.ac-grid--3 {
		grid-template-columns: 1fr;
	}
}

.ac-levers {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
}

.ac-lever {
	background: var(--ac-cream-soft);
	border: 1px solid var(--ac-border-light);
	border-radius: 10px;
	padding: 26px 22px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	box-shadow: 0 1px 2px rgba(15, 16, 19, 0.05);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ac-lever:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 24px rgba(15, 16, 19, 0.09);
}

.ac-lever__num {
	font-family: var(--ac-font-display);
	font-size: 22px;
	font-weight: 500;
	color: var(--ac-gold);
}

.ac-lever__title {
	font-size: 17px;
	font-weight: 600;
	color: var(--ac-ink);
}

.ac-lever__text {
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--ac-slate);
}

/* ---------- Pour qui ---------- */

.ac-audience {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 20px;
}

.ac-audience__text {
	font-family: var(--ac-font-display);
	font-size: 26px;
	line-height: 1.55;
	color: var(--ac-charcoal);
	max-width: 760px;
	font-weight: 400;
}

@media (max-width: 782px) {
	.ac-audience__text {
		font-size: 19px;
	}
}

/* ---------- Pour qui, vraiment (contraste) ---------- */

.ac-fit {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 32px;
	text-align: center;
}

.ac-fit__title {
	font-size: 26px;
	max-width: 680px;
}

@media (max-width: 782px) {
	.ac-fit__title {
		font-size: 20px;
	}
}

.ac-fit__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	max-width: var(--ac-max);
	width: 100%;
	text-align: left;
}

@media (max-width: 782px) {
	.ac-fit__grid {
		grid-template-columns: 1fr;
	}
}

.ac-fit__col {
	border-radius: 10px;
	padding: 28px 26px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.ac-fit__col--no {
	background: var(--ac-cream-soft);
	border: 1px solid var(--ac-border-light);
}

.ac-fit__col--yes {
	background: var(--ac-ink);
	border: 1px solid var(--ac-ink);
}

.ac-fit__col-title {
	font-family: var(--ac-font-display);
	font-size: 17px;
	font-weight: 500;
}

.ac-fit__col--no .ac-fit__col-title {
	color: var(--ac-ink);
}

.ac-fit__col--yes .ac-fit__col-title {
	color: var(--ac-gold);
}

.ac-fit__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.ac-fit__list li {
	font-size: 14px;
	line-height: 1.55;
	padding-left: 26px;
	position: relative;
}

.ac-fit__col--no .ac-fit__list li {
	color: var(--ac-slate);
}

.ac-fit__col--no .ac-fit__list li::before {
	content: '–';
	position: absolute;
	left: 0;
	color: var(--ac-taupe);
	font-weight: 700;
}

.ac-fit__col--yes .ac-fit__list li {
	color: var(--ac-cream);
}

.ac-fit__col--yes .ac-fit__list li::before {
	content: '✓';
	position: absolute;
	left: 0;
	color: var(--ac-gold);
	font-weight: 700;
}

/* ---------- Situations ---------- */

.ac-situations {
	background: var(--ac-cream-soft);
}

.ac-situations__title {
	font-size: 28px;
	text-align: center;
	margin: 0 0 44px;
}

@media (max-width: 782px) {
	.ac-situations__title {
		font-size: 21px;
		margin-bottom: 28px;
	}
}

.ac-card {
	background: var(--ac-cream);
	border: 1px solid var(--ac-border-light);
	border-radius: 8px;
	padding: 28px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ac-card__title {
	font-size: 15px;
	font-weight: 600;
	color: var(--ac-ink);
}

.ac-card__text {
	font-size: 14px;
	line-height: 1.55;
	color: var(--ac-slate);
}

.ac-card--note {
	background: transparent;
	border: none;
	justify-content: center;
	font-size: 13px;
	line-height: 1.6;
	color: #7a7568;
	font-style: italic;
}

/* ---------- Explication du diagnostic ---------- */

.ac-explainer {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
}

.ac-explainer__intro {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 720px;
}

.ac-explainer__lede {
	font-family: var(--ac-font-display);
	font-size: 22px;
	line-height: 1.5;
	color: var(--ac-charcoal);
	font-weight: 400;
}

@media (max-width: 782px) {
	.ac-explainer__lede {
		font-size: 17px;
	}
}

.ac-demo {
	max-width: 640px;
	width: 100%;
	background: #fff;
	border: 1px solid var(--ac-border-light);
	border-radius: 10px;
	padding: 32px 36px;
	box-sizing: border-box;
}

@media (max-width: 600px) {
	.ac-demo {
		padding: 24px 20px;
	}
}

.ac-demo__tag {
	display: inline-block;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ac-gold);
	font-weight: 700;
	background: rgba(184, 147, 90, 0.12);
	padding: 5px 10px;
	border-radius: 4px;
	margin-bottom: 18px;
}

.ac-demo__meta {
	font-size: 12.5px;
	color: #7a7568;
	margin-bottom: 16px;
}

.ac-demo__row {
	display: flex;
	gap: 10px;
	align-items: baseline;
	margin-bottom: 14px;
}

.ac-demo__row:last-child {
	margin-bottom: 0;
}

.ac-demo__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	min-width: 64px;
	color: var(--ac-slate);
}

.ac-demo__label--risk {
	color: var(--ac-gold);
}

.ac-demo__text {
	font-size: 14px;
	line-height: 1.55;
	color: var(--ac-charcoal);
}

/*
 * ---------- "Explication du diagnostic" (démo) ----------
 * AJOUTÉ 2026-09-19, SIMPLIFIÉ le même jour : contenait une grille 2
 * colonnes (démo + carte "Diagnostic préliminaire gratuit") jusqu'à ce que
 * la carte soit déplacée plus haut dans la page, juste après le HERO (voir
 * .ac-diag-promo-section ci-dessous) — Antoine ne la voyait pas assez vite
 * ici. Cette section revient donc à une seule colonne centrée, comme le
 * reste de .ac-explainer.
 */
.ac-explainer__col-main {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	width: 100%;
	max-width: var(--ac-max);
}

/*
 * ---------- Carte "Diagnostic préliminaire gratuit" ----------
 * AJOUTÉE 2026-09-19, DÉPLACÉE le même jour juste après le HERO texte
 * (retour direct d'Antoine après un premier déploiement : la carte, alors
 * dans .ac-explainer plus bas dans la page, passait inaperçue). Nouvel
 * emplacement : sa propre section pleine largeur, carte centrée à largeur
 * raisonnable (jamais étirée bord à bord, y compris en desktop) — visible
 * tout de suite après le HERO, sans avoir à faire défiler le reste de la
 * page. Mêmes jetons de couleur, aucune nouvelle couleur introduite.
 */
.ac-diag-promo-section {
	display: flex;
	justify-content: center;
}

.ac-diag-promo {
	width: 100%;
	max-width: 640px;
	box-sizing: border-box;
	background: var(--ac-cream);
	border: 1px solid var(--ac-border-light);
	border-left: 3px solid var(--ac-gold);
	border-radius: 10px;
	padding: 28px 30px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	text-align: left;
}

.ac-diag-promo__label {
	display: block;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ac-gold);
	font-weight: 700;
}

.ac-diag-promo__title {
	font-family: var(--ac-font-display);
	font-size: 22px;
	font-weight: 500;
	color: var(--ac-ink);
	margin: 2px 0 0;
}

.ac-diag-promo__desc {
	font-size: 14px;
	line-height: 1.6;
	color: var(--ac-slate);
	margin: 0;
}

.ac-diag-promo__subline {
	font-size: 12.5px;
	font-style: italic;
	color: var(--ac-taupe);
	margin: 0 0 6px;
}

.ac-diag-promo__btn {
	align-self: flex-start;
}

@media (max-width: 600px) {
	.ac-diag-promo__btn {
		align-self: stretch;
	}
}

/* ---------- Méthode ---------- */

.ac-method {
	position: relative;
	overflow: hidden;
}

.ac-method__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.22;
}

.ac-method__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(160deg, var(--ac-ink) 15%, rgba(20, 22, 26, 0.92) 100%);
}

.ac-method__inner {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 44px;
}

.ac-method__title {
	font-size: 30px;
	color: var(--ac-cream);
}

.ac-step {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ac-step__num {
	font-family: var(--ac-font-display);
	font-size: 32px;
	color: var(--ac-gold);
}

.ac-step__title {
	font-size: 16px;
	font-weight: 600;
	color: var(--ac-cream);
}

.ac-step__title em {
	font-style: normal;
	font-weight: 400;
	color: var(--ac-taupe);
	font-size: 13px;
}

.ac-step__text {
	font-size: 14px;
	line-height: 1.6;
	color: var(--ac-stone);
}

.ac-method__footnote {
	font-size: 12.5px;
	color: var(--ac-taupe);
}

.ac-method__link {
	color: var(--ac-gold);
	font-size: 14px;
	font-weight: 600;
}

/* ---------- Aperçu assistant IA ---------- */

.ac-ai-preview-wrap {
	display: flex;
	justify-content: center;
}

.ac-ai-preview {
	max-width: 640px;
	width: 100%;
	background: var(--ac-cream-soft);
	border: 1px solid var(--ac-border-light);
	border-radius: 12px;
	padding: 40px 44px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

@media (max-width: 600px) {
	.ac-ai-preview {
		padding: 24px 20px;
	}
}

.ac-ai-preview__head {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.ac-ai-preview__title {
	font-size: 22px;
}

.ac-bubbles {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ac-bubble {
	max-width: 85%;
	padding: 12px 16px;
	font-size: 13.5px;
	line-height: 1.55;
}

.ac-bubble--assistant {
	align-self: flex-start;
	background: var(--ac-cream);
	border: 1px solid var(--ac-border-light);
	border-radius: 10px 10px 10px 2px;
	color: var(--ac-charcoal);
}

.ac-bubble--user {
	align-self: flex-end;
	background: var(--ac-ink);
	border-radius: 10px 10px 2px 10px;
	color: var(--ac-cream);
}

.ac-bubble--tag {
	align-self: center;
	font-size: 10.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ac-gold);
}

.ac-ai-preview__note {
	font-size: 12px;
	line-height: 1.5;
	color: #7a7568;
	text-align: center;
}

/* ---------- Fondateur ---------- */

.ac-founder-wrap {
	display: flex;
	justify-content: center;
}

.ac-founder {
	max-width: 780px;
	width: 100%;
	display: flex;
	gap: 44px;
	align-items: center;
}

@media (max-width: 600px) {
	.ac-founder {
		flex-direction: column;
		text-align: center;
		gap: 24px;
	}
}

.ac-founder__portrait {
	width: 168px;
	height: 168px;
	border-radius: 50%;
	background: var(--ac-cream-soft);
	border: 1px solid var(--ac-border-light);
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	box-sizing: border-box;
	overflow: hidden;
}

.ac-founder__portrait-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
	display: block;
}

.ac-founder__body {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.ac-founder__name {
	font-size: 24px;
}

.ac-founder__text {
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--ac-slate);
	margin: 0;
}

.ac-founder__link {
	color: var(--ac-gold);
	font-size: 14px;
	font-weight: 600;
}

/* AJOUTÉ 2026-09-19 — signature de la section "mission personnelle"
   d'Antoine sur la page Création d'entreprise (réutilise .ac-founder,
   déjà existant, pour cette nouvelle instance du bloc). */
.ac-founder__signature {
	font-family: var(--ac-font-display);
	font-size: 15px;
	color: var(--ac-gold);
	margin: 4px 0 0;
}

/* ---------- FAQ ---------- */

.ac-faq {
	background: var(--ac-cream-soft);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
}

.ac-faq__title {
	font-size: 28px;
}

.ac-faq__list {
	max-width: 780px;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.ac-faq__question {
	font-size: 15px;
	font-weight: 600;
	color: var(--ac-ink);
	margin-bottom: 6px;
}

.ac-faq__answer {
	font-size: 14px;
	line-height: 1.6;
	color: var(--ac-slate);
}

.ac-faq__link {
	color: var(--ac-gold);
	font-size: 14px;
	font-weight: 600;
}

/* ---------- CTA final ---------- */

.ac-final-cta {
	background: var(--ac-ink);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 26px;
}

.ac-final-cta__title {
	font-size: 28px;
	color: var(--ac-cream);
}

@media (max-width: 782px) {
	.ac-final-cta__title {
		font-size: 21px;
	}
}

/* ---------- Formulaires (pages diagnostic / contact) ---------- */

.ac-page-header {
	background: var(--ac-ink);
	padding: 56px var(--ac-gutter);
	text-align: center;
}

.ac-page-header__title {
	color: var(--ac-cream);
	font-size: 32px;
}

.ac-page-header__lede {
	color: var(--ac-stone);
	max-width: 640px;
	margin: 14px auto 0;
	font-size: 15px;
	line-height: 1.6;
}

.ac-page-body {
	padding: 56px var(--ac-gutter) 88px;
	display: flex;
	justify-content: center;
}

.ac-notice {
	padding: 1rem 1.25rem;
	border-radius: 8px;
	font-size: 0.9rem;
}

.ac-notice--warning {
	background: #fbeeda;
	border: 1px solid var(--ac-gold);
	color: var(--ac-charcoal);
}

/* ---------- Pied de page ---------- */

.ac-footer {
	background: var(--ac-black);
	padding: 48px var(--ac-gutter);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px;
}

.ac-footer__brand {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ac-footer__brand-logo {
	width: 28px;
	height: 28px;
	object-fit: cover;
	border-radius: 50%;
	opacity: 0.85;
}

/* CORRIGÉ SUITE À REVUE DU 2026-09-17 — même bug que .ac-brand__logo ci-dessus :
   the_custom_logo() rend <a class="custom-logo-link"><img class="custom-logo">,
   jamais <img class="ac-footer__brand-logo">. */
.ac-footer__brand .custom-logo-link {
	display: inline-flex;
	line-height: 0;
}

.ac-footer__brand .custom-logo {
	width: 28px;
	height: 28px;
	object-fit: cover;
	border-radius: 50%;
	display: block;
	opacity: 0.85;
}

.ac-footer__brand-mark {
	width: 28px;
	height: 28px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--ac-surface-dark);
	border: 1px solid rgba(184, 147, 90, 0.55);
	color: var(--ac-gold);
	font-family: var(--ac-font-display);
	font-size: 10px;
	font-weight: 600;
	opacity: 0.9;
}

.ac-footer__brand-name {
	font-family: var(--ac-font-display);
	font-size: 14px;
	color: var(--ac-taupe);
}

.ac-footer__links {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ac-footer__links a {
	font-size: 13px;
	color: var(--ac-taupe);
}

.ac-footer__links a:hover {
	color: var(--ac-gold);
}

/* ---------- Générique (page.php) ---------- */

.ac-generic-content {
	max-width: 780px;
	margin: 0 auto;
	padding: 72px var(--ac-gutter);
}

.ac-generic-content h1 {
	font-size: 32px;
	margin-bottom: 1.5rem;
}

.ac-generic-content p {
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--ac-slate);
}

/* ============================================================
   AJOUTÉ 2026-09-18 — Service "Diagnostic d'entreprise & Stratégie
   de croissance" (page dédiée + carte sur l'accueil). Réutilise au
   maximum les composants existants (.ac-hero, .ac-card, .ac-step,
   .ac-grid, .ac-final-cta) ; seules les règles réellement nouvelles
   sont ajoutées ici.
   ============================================================ */

/* Lien de clarification sous le CTA du hero de service : distingue
   explicitement ce diagnostic accompagné (sur devis) du diagnostic
   automatique gratuit déjà existant sur /diagnostic/. */
.ac-hero__alt-link {
	margin: -6px 0 0;
	font-size: 13px;
	color: var(--ac-stone);
}

.ac-hero__alt-link a {
	color: var(--ac-gold);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ac-hero__alt-link a:hover {
	color: var(--ac-gold-hover);
}

/* Intro de la section méthode (8 étapes) — même traitement que
   .ac-explainer__lede mais sur fond sombre (.ac-method). */
.ac-method__intro {
	font-size: 15px;
	line-height: 1.6;
	color: var(--ac-stone);
	max-width: 680px;
	text-align: center;
	margin: -20px 0 4px;
}

/* Variante bloc (pleine largeur, centrée) de la note discrète déjà
   utilisée en bas de la section méthode de l'accueil. */
.ac-method__footnote--block {
	display: block;
	max-width: 680px;
	text-align: center;
	line-height: 1.6;
	margin-top: 8px;
}

/* Même note discrète, mais utilisée hors fond sombre (section
   "Ce que vous obtenez", fond clair) — couleur adaptée. */
.ac-method__footnote--light {
	display: block;
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--ac-taupe);
	text-align: center;
	max-width: 680px;
	margin: 8px auto 0;
}

.ac-service-ai {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	text-align: center;
}

.ac-service-ai__text {
	max-width: 720px;
}

.ac-service-accent {
	font-family: var(--ac-font-display);
	font-size: 20px;
	font-weight: 500;
	color: var(--ac-ink);
	max-width: 620px;
	margin: 0;
}

.ac-final-cta__lede {
	color: var(--ac-stone);
	max-width: 560px;
	font-size: 15px;
	line-height: 1.6;
	margin: -12px 0 0;
}

/* ---------- Carte "Diagnostic d'entreprise" sur l'accueil ---------- */

.ac-service-feature {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 32px;
}

/*
 * AJOUTÉ 2026-09-19 — Deux nouvelles directions de service ("Notoriété,
 * image de marque & communication" et "Création d'entreprise &
 * accompagnement entrepreneurial") rejoignent le diagnostic dans cette
 * section : la carte unique centrée devient une grille de 3 cartes.
 * .ac-service-feature__card garde exactement le même style (fond, bordure,
 * padding) — seule la disposition autour change.
 */
.ac-service-feature__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	max-width: var(--ac-max);
	width: 100%;
	align-items: stretch;
}

@media (max-width: 900px) {
	.ac-service-feature__grid {
		grid-template-columns: 1fr;
	}
}

.ac-service-feature__card {
	max-width: 720px;
	width: 100%;
	background: var(--ac-cream-soft);
	border: 1px solid var(--ac-border-light);
	border-radius: 12px;
	padding: 40px 44px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 16px;
}

@media (max-width: 600px) {
	.ac-service-feature__card {
		padding: 28px 22px;
	}
}

.ac-service-feature__title {
	font-size: 24px;
}

@media (max-width: 782px) {
	.ac-service-feature__title {
		font-size: 20px;
	}
}

.ac-service-feature__text {
	font-size: 15px;
	line-height: 1.65;
	color: var(--ac-slate);
	max-width: 560px;
	margin: 0;
}

/* ============================================================
   MOUVEMENT RÉDUIT — AJOUTÉ 2026-09-18. `html { scroll-behavior:
   smooth }` (tout en haut de ce fichier) et les transitions de survol
   (.ac-btn, .ac-lever, .ac-hero__alt-link) ignoraient jusqu'ici la
   préférence système "Réduire les animations" — corrigé ici pour tout
   le site, pas seulement la nouvelle page, puisque le problème était
   déjà présent partout où `scroll-behavior: smooth` s'applique
   (ancres du menu, "Découvrir notre méthode", etc.).
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ============================================================
   AJOUTÉ 2026-09-18 (suite) — Développement de l'étape 01 de la
   méthode, page "Diagnostic d'entreprise & Stratégie de croissance".
   Section claire, texte long-format, sous-titres lisibles : reprend
   le gabarit déjà utilisé par .ac-generic-content (max-width 780px,
   paragraphes 15.5px / line-height 1.7 / couleur --ac-slate) plutôt
   que d'entasser ce texte dans une carte .ac-step (pensée pour un
   court résumé sur fond sombre, pas pour du texte long).
   ============================================================ */

.ac-step-detail {
	background: var(--ac-cream);
}

.ac-step-detail__inner {
	max-width: 780px;
	margin: 0 auto;
}

.ac-step-detail__inner .ac-eyebrow {
	margin-bottom: 8px;
}

.ac-step-detail__subhead {
	font-size: 20px;
	margin-top: 40px;
	margin-bottom: 4px;
	color: var(--ac-charcoal);
}

.ac-step-detail__subhead--first {
	margin-top: 4px;
}

.ac-step-detail__inner p {
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--ac-slate);
}

.ac-step-detail__list {
	margin: 0 0 1em;
	padding-left: 1.2em;
	list-style: disc;
}

.ac-step-detail__list li {
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--ac-slate);
	margin-bottom: 6px;
}

.ac-step-detail__list li strong {
	color: var(--ac-charcoal);
}

.ac-step-detail__disclaimer {
	font-size: 12.5px !important;
	line-height: 1.6 !important;
	color: var(--ac-taupe) !important;
	font-style: italic;
	margin-top: 4px !important;
}

.ac-step-detail__accent {
	font-family: var(--ac-font-display);
	font-size: 19px;
	color: var(--ac-gold);
	text-align: center;
	margin: 40px 0 4px;
}

.ac-step-detail .ac-btn-row {
	margin-top: 28px;
}

/* ============================================================
   RÉSOLUTION DE PROBLÈMES / PROBLEM SOLVING — AJOUTÉ 2026-09-25
   Accent sous la vidéo de l'accueil (.ac-ps-teaser) + page dédiée
   (.ac-ps-page). Uniquement les jetons --ac-* existants (couleurs,
   Fraunces/Inter) : aucune nouvelle couleur. Même bloc dans les thèmes
   FR et EN.
   ============================================================ */

/* ---------- Accent sous la vidéo (accueil) ---------- */

.ac-ps-teaser {
	position: relative;
	overflow: hidden;
	background: var(--ac-black);
	color: var(--ac-cream);
	padding: 88px var(--ac-gutter) 92px;
	border-bottom: 1px solid rgba(184, 147, 90, 0.28);
	scroll-margin-top: 88px;
}

.ac-ps-teaser::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(ellipse 55% 75% at 80% 50%, rgba(184, 147, 90, 0.16), transparent 70%),
		radial-gradient(rgba(247, 244, 238, 0.05) 1px, transparent 1px);
	background-size: auto, 24px 24px;
	pointer-events: none;
}

.ac-ps-teaser__inner {
	position: relative;
	max-width: var(--ac-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
	gap: 64px;
	align-items: center;
}

.ac-ps-teaser__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
}

.ac-ps-teaser__title {
	margin: 0;
	font-family: var(--ac-font-display);
	font-size: clamp(38px, 4.4vw, 62px);
	font-weight: 500;
	line-height: 1.06;
	letter-spacing: -0.015em;
	color: var(--ac-cream);
	text-wrap: balance;
}

.ac-ps-teaser__text {
	margin: 0;
	max-width: 540px;
	font-size: 18px;
	line-height: 1.65;
	color: var(--ac-stone);
}

.ac-ps-arrow {
	display: inline-block;
	margin-left: 10px;
	transition: transform 0.15s ease;
}

.ac-btn:hover .ac-ps-arrow,
.ac-btn:focus-visible .ac-ps-arrow {
	transform: translateX(4px);
}

.ac-ps-teaser__visual {
	display: block;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 0 0 1px rgba(184, 147, 90, 0.45), 0 30px 70px rgba(0, 0, 0, 0.55);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ac-ps-teaser__visual img {
	display: block;
	width: 100%;
	height: auto;
}

.ac-ps-teaser__visual:hover {
	transform: translateY(-4px);
	box-shadow: 0 0 0 1px rgba(184, 147, 90, 0.85), 0 36px 80px rgba(0, 0, 0, 0.6), 0 0 70px rgba(184, 147, 90, 0.16);
}

@media (max-width: 900px) {
	.ac-ps-teaser {
		padding: 60px var(--ac-gutter) 64px;
		scroll-margin-top: 72px;
	}

	.ac-ps-teaser__inner {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.ac-ps-teaser__title {
		font-size: clamp(32px, 8.4vw, 44px);
	}

	.ac-ps-teaser__text {
		font-size: 16.5px;
	}
}

@media (max-width: 600px) {
	.ac-ps-teaser__content {
		align-items: stretch;
	}
}

/* Focus clavier visible sur les boutons et liens ajoutés (fonds sombres/clairs). */
.ac-ps-teaser a:focus-visible,
.ac-ps-page a:focus-visible,
.ac-ps-page button:focus-visible {
	outline: 2px solid var(--ac-gold);
	outline-offset: 3px;
}

/* ---------- Page dédiée : structure commune ---------- */

.ac-ps-head {
	max-width: 780px;
	margin: 0 auto 44px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	text-align: center;
}

.ac-ps-head h2 {
	font-size: clamp(27px, 3vw, 38px);
	line-height: 1.2;
	color: var(--ac-ink);
}

.ac-ps-head p {
	margin: 0;
	font-size: 17px;
	line-height: 1.65;
	color: var(--ac-slate);
}

.ac-ps-head--dark h2 {
	color: var(--ac-cream);
}

.ac-ps-head--dark p {
	color: var(--ac-stone);
}

.ac-ps-note {
	max-width: 700px;
	margin: 40px auto 0;
	text-align: center;
	font-family: var(--ac-font-display);
	font-size: 20px;
	line-height: 1.5;
	color: var(--ac-charcoal);
}

.ac-ps-note--small {
	font-family: var(--ac-font-body);
	font-size: 13.5px;
	font-style: italic;
	color: var(--ac-taupe);
}

.ac-ps-badge {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 4px;
	background: rgba(184, 147, 90, 0.12);
	color: var(--ac-gold);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ---------- En-tête de page ---------- */

.ac-ps-hero {
	position: relative;
	overflow: hidden;
	padding: 80px var(--ac-gutter) 104px;
	background: linear-gradient(160deg, var(--ac-black) 0%, var(--ac-ink) 55%, var(--ac-surface-dark) 100%);
	color: var(--ac-cream);
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 36px));
}

.ac-ps-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(ellipse 700px 420px at 20% -10%, rgba(184, 147, 90, 0.18), transparent 70%),
		radial-gradient(rgba(247, 244, 238, 0.05) 1px, transparent 1px);
	background-size: auto, 24px 24px;
	pointer-events: none;
}

.ac-ps-hero__inner {
	position: relative;
	max-width: var(--ac-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 56px;
	align-items: center;
}

.ac-ps-hero__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
}

.ac-ps-hero__title {
	font-size: clamp(34px, 4.2vw, 56px);
	line-height: 1.08;
	letter-spacing: -0.015em;
	color: var(--ac-cream);
	text-wrap: balance;
}

.ac-ps-hero__claim {
	margin: 0;
	font-family: var(--ac-font-display);
	font-size: clamp(20px, 2vw, 25px);
	line-height: 1.35;
	color: var(--ac-gold);
}

.ac-ps-hero__lede {
	margin: 0;
	max-width: 600px;
	font-size: 17px;
	line-height: 1.7;
	color: var(--ac-stone);
}

.ac-ps-hero__actions {
	justify-content: flex-start;
	margin-top: 6px;
}

.ac-ps-hero__visual {
	margin: 0;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 0 0 1px rgba(184, 147, 90, 0.45), 0 30px 70px rgba(0, 0, 0, 0.55);
}

.ac-ps-hero__visual img {
	display: block;
	width: 100%;
	height: auto;
}

@media (max-width: 900px) {
	.ac-ps-hero {
		padding: 48px var(--ac-gutter) 72px;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 20px));
	}

	.ac-ps-hero__inner {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.ac-ps-hero__lede {
		font-size: 16px;
	}
}

@media (max-width: 600px) {
	.ac-ps-hero__content {
		align-items: stretch;
	}
}

/* ---------- 1. Le problème examiné ---------- */

.ac-ps-problems {
	background: var(--ac-cream);
}

.ac-ps-problems__grid {
	max-width: var(--ac-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.ac-ps-problem {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 30px 28px;
	background: #fff;
	border: 1px solid var(--ac-border-light);
	border-top: 3px solid var(--ac-gold);
	border-radius: 10px;
	box-shadow: 0 1px 2px rgba(15, 16, 19, 0.05);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ac-ps-problem:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 24px rgba(15, 16, 19, 0.09);
}

.ac-ps-problem__icon {
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--ac-ink);
	color: var(--ac-gold);
}

.ac-ps-problem__title {
	font-size: 21px;
	line-height: 1.3;
	color: var(--ac-ink);
}

.ac-ps-problem__question {
	margin: 0;
	font-size: 15.5px;
	font-weight: 600;
	color: var(--ac-charcoal);
}

.ac-ps-problem__tags {
	margin: auto 0 0;
	padding-top: 8px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ac-taupe);
}

@media (max-width: 900px) {
	.ac-ps-problems__grid {
		grid-template-columns: 1fr;
		max-width: 560px;
	}

	.ac-ps-note {
		font-size: 18px;
	}
}

/* ---------- 2. La méthode (fond sombre) ---------- */

.ac-ps-method {
	position: relative;
	background: linear-gradient(160deg, var(--ac-ink) 15%, var(--ac-surface-dark) 100%);
}

.ac-ps-steps {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: var(--ac-max);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 18px;
}

.ac-ps-step {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 26px 22px 22px;
	background: rgba(247, 244, 238, 0.03);
	border: 1px solid rgba(184, 147, 90, 0.24);
	border-radius: 12px;
	transition: border-color 0.15s ease, background 0.15s ease;
}

.ac-ps-step:hover {
	border-color: rgba(184, 147, 90, 0.6);
	background: rgba(247, 244, 238, 0.05);
}

.ac-ps-step__letter {
	width: 54px;
	height: 54px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	border: 1.5px solid var(--ac-gold);
	background: var(--ac-black);
	color: var(--ac-gold);
	font-family: var(--ac-font-display);
	font-size: 24px;
	font-weight: 600;
}

.ac-ps-step__body {
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}

.ac-ps-step__title {
	font-family: var(--ac-font-body);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--ac-cream);
}

.ac-ps-step__title span {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ac-gold);
}

.ac-ps-step__text {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ac-stone);
}

.ac-ps-step__output {
	margin: auto 0 0;
	padding-top: 12px;
	border-top: 1px solid rgba(184, 147, 90, 0.2);
	font-size: 14px;
	font-weight: 600;
	color: var(--ac-cream);
}

.ac-ps-step__output span {
	display: block;
	margin-bottom: 2px;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ac-taupe);
}

@media (max-width: 900px) {
	.ac-ps-steps {
		grid-template-columns: 1fr;
		max-width: 560px;
	}

	.ac-ps-step {
		flex-direction: row;
		align-items: flex-start;
		gap: 18px;
		padding: 22px 20px;
	}

	.ac-ps-step__letter {
		width: 46px;
		height: 46px;
		font-size: 21px;
	}
}

/* ---------- 3. Ce que vous obtenez ---------- */

.ac-ps-deliverables {
	background: var(--ac-cream-soft);
}

.ac-ps-deliverables__inner {
	max-width: var(--ac-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
	gap: 64px;
	align-items: start;
}

.ac-ps-deliverables__intro {
	display: flex;
	flex-direction: column;
	gap: 16px;
	position: sticky;
	top: 120px;
}

.ac-ps-deliverables__intro h2 {
	font-size: clamp(27px, 3vw, 38px);
	line-height: 1.2;
	color: var(--ac-ink);
}

.ac-ps-deliverables__intro p {
	margin: 0;
	font-size: 17px;
	line-height: 1.65;
	color: var(--ac-slate);
}

.ac-ps-deliverables__intro .ac-ps-deliverables__footnote {
	font-size: 13.5px;
	font-style: italic;
	color: var(--ac-taupe);
}

.ac-ps-deliverables__list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--ac-border-light);
}

.ac-ps-deliverables__list li {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 16px;
	padding: 24px 0;
	border-bottom: 1px solid var(--ac-border-light);
}

.ac-ps-deliverables__num {
	font-family: var(--ac-font-display);
	font-size: 32px;
	line-height: 1;
	color: var(--ac-gold);
}

.ac-ps-deliverables__list h3 {
	margin-bottom: 6px;
	font-size: 21px;
	line-height: 1.3;
	color: var(--ac-ink);
}

.ac-ps-deliverables__list p {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--ac-slate);
}

@media (max-width: 900px) {
	.ac-ps-deliverables__inner {
		grid-template-columns: 1fr;
		gap: 28px;
		max-width: 620px;
	}

	.ac-ps-deliverables__intro {
		position: static;
	}

	.ac-ps-deliverables__list li {
		grid-template-columns: 48px minmax(0, 1fr);
		gap: 12px;
		padding: 20px 0;
	}

	.ac-ps-deliverables__num {
		font-size: 26px;
	}

	.ac-ps-deliverables__list h3 {
		font-size: 19px;
	}
}

/* ---------- 4. Situations schématiques ---------- */

.ac-ps-examples {
	background: var(--ac-cream);
}

.ac-ps-examples__grid {
	max-width: var(--ac-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.ac-ps-example {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 28px 26px;
	background: #fff;
	border: 1px solid var(--ac-border-light);
	border-radius: 10px;
}

.ac-ps-example__kicker {
	margin: 0;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ac-gold);
}

.ac-ps-example__kicker span {
	margin-left: 6px;
	padding-left: 8px;
	border-left: 1px solid var(--ac-border-light);
	color: var(--ac-taupe);
}

.ac-ps-example__title {
	font-size: 19px;
	line-height: 1.4;
	color: var(--ac-ink);
}

.ac-ps-example__list {
	margin: 4px 0 0;
	padding-top: 14px;
	border-top: 1px solid var(--ac-border-light);
}

.ac-ps-example__list dt {
	margin-top: 12px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ac-slate);
}

.ac-ps-example__list dt:first-child {
	margin-top: 0;
}

.ac-ps-example__list dd {
	margin: 4px 0 0;
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--ac-charcoal);
}

@media (max-width: 900px) {
	.ac-ps-examples__grid {
		grid-template-columns: 1fr;
		max-width: 560px;
	}
}

/* ---------- 5. La présentation : ses pages affichées dans le site ---------- */
/* Demande d'Antoine : pas de PDF — les 18 pages s'affichent l'une sous
   l'autre et se lisent en faisant défiler la page. */
.ac-ps-deck {
	background: var(--ac-black);
}

.ac-ps-slides {
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: 1100px;
	display: flex;
	flex-direction: column;
	gap: 36px;
}

.ac-ps-slide {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ac-ps-slide__num {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	color: var(--ac-gold);
}

.ac-ps-slide img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
	background: var(--ac-surface-dark);
	box-shadow: 0 0 0 1px rgba(184, 147, 90, 0.35), 0 24px 60px rgba(0, 0, 0, 0.5);
}

@media (max-width: 782px) {
	.ac-ps-slides {
		gap: 22px;
	}

	.ac-ps-slide img {
		border-radius: 6px;
	}
}

/* ---------- Contact : rendez-vous, échange et devis ---------- */

.ac-ps-contact .ac-final-cta__lede {
	margin: -8px 0 0;
}

.ac-ps-contact__mail {
	margin: 0;
	font-size: 14px;
	color: var(--ac-stone);
}

.ac-ps-contact__mail a {
	color: var(--ac-gold);
	font-weight: 600;
}

.ac-ps-contact__mail a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}
/* Mouvement réduit : le bloc global en fin de fichier neutralise déjà
   transitions et animations ; on retire en plus les déplacements au survol. */
@media (prefers-reduced-motion: reduce) {
	.ac-ps-teaser__visual:hover,
	.ac-ps-problem:hover {
		transform: none;
	}
}

/* ---------- « Fondateur » (accueil FR) : biographie complète ---------- */
/* AJOUTÉ 2026-09-25 — texte définitif fourni par Antoine (9 paragraphes) :
   lecture confortable sur ordinateur (portrait qui reste visible pendant
   la lecture) et sur téléphone (texte aligné à gauche, jamais centré sur
   de longs paragraphes). */
.ac-founder--long {
	max-width: 880px;
	align-items: flex-start;
}

.ac-founder--long .ac-founder__portrait {
	position: sticky;
	top: 120px;
}

.ac-founder--long .ac-founder__body {
	gap: 14px;
}

.ac-founder__lead {
	margin: 2px 0 4px;
	font-family: var(--ac-font-display);
	font-size: 21px;
	line-height: 1.45;
	color: var(--ac-ink);
}

.ac-founder__lead strong {
	font-weight: 600;
}

.ac-founder--long .ac-founder__text {
	font-size: 15.5px;
	line-height: 1.75;
}

@media (max-width: 600px) {
	.ac-founder--long {
		align-items: stretch;
		text-align: left;
	}

	.ac-founder--long .ac-founder__portrait {
		position: static;
		align-self: center;
	}

	.ac-founder--long .ac-eyebrow,
	.ac-founder--long .ac-founder__name {
		text-align: center;
	}

	.ac-founder__lead {
		font-size: 19px;
		text-align: center;
	}

	.ac-founder--long .ac-founder__text {
		font-size: 15px;
		line-height: 1.7;
	}
}

/* ---------- Gratuit en ligne / approfondi sur place ---------- */
/* AJOUTÉ 2026-09-25 — distingue le diagnostic automatique gratuit
   (questionnaire + assistant IA) de la mission payante sur place décrite
   par la présentation. */
.ac-ps-offers {
	background: var(--ac-cream);
}

.ac-ps-offers__grid {
	max-width: 1000px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	align-items: stretch;
}

.ac-ps-offer {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 32px 30px;
	background: #fff;
	border: 1px solid var(--ac-border-light);
	border-radius: 12px;
}

.ac-ps-offer p {
	margin: 0;
	font-size: 15px;
	line-height: 1.65;
	color: var(--ac-slate);
}

.ac-ps-offer--featured {
	background: var(--ac-ink);
	border-color: rgba(184, 147, 90, 0.5);
	box-shadow: 0 20px 50px rgba(15, 16, 19, 0.18);
}

.ac-ps-offer--featured p {
	color: var(--ac-stone);
}

.ac-ps-offer__price {
	align-self: flex-start;
	padding: 6px 12px;
	border-radius: 999px;
	border: 1px solid var(--ac-gold);
	color: var(--ac-gold);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ac-ps-offer--featured .ac-ps-offer__price {
	background: var(--ac-gold);
	color: var(--ac-black);
}

.ac-ps-offer__title {
	font-size: 24px;
	line-height: 1.25;
	color: var(--ac-ink);
}

.ac-ps-offer--featured .ac-ps-offer__title {
	color: var(--ac-cream);
}

.ac-ps-offer .ac-ps-offer__note {
	font-size: 13px;
	font-style: italic;
	color: var(--ac-taupe);
}

.ac-ps-offer__actions {
	margin-top: auto;
	padding-top: 8px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 22px;
}

.ac-ps-offer__link {
	padding: 0;
	border: none;
	background: none;
	font-family: var(--ac-font-body);
	font-size: 14px;
	font-weight: 600;
	color: var(--ac-gold);
	cursor: pointer;
}

.ac-ps-offer__link[hidden] {
	display: none;
}

.ac-ps-offer__link:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 900px) {
	.ac-ps-offers__grid {
		grid-template-columns: 1fr;
		max-width: 560px;
	}

	.ac-ps-offer {
		padding: 26px 22px;
	}

	.ac-ps-offer__title {
		font-size: 21px;
	}
}

/* ============================================================
   PAGE CONTACT « PREMIUM » — AJOUTÉ 2026-09-25
   En-tête sombre, carte du formulaire qui chevauche l'en-tête, colonne
   d'accompagnement (Antoine, étapes après l'envoi, contact direct).
   Formulaire lui-même : voir ac-frontend.css du plugin (.ac-contact-form--premium).
   Uniquement les jetons --ac-* existants : aucune nouvelle couleur.
   ============================================================ */

.ac-contact-hero {
	position: relative;
	overflow: hidden;
	padding: 76px var(--ac-gutter) 150px;
	background: linear-gradient(160deg, var(--ac-black) 0%, var(--ac-ink) 55%, var(--ac-surface-dark) 100%);
	color: var(--ac-cream);
}

.ac-contact-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(ellipse 720px 420px at 85% -10%, rgba(184, 147, 90, 0.2), transparent 70%),
		radial-gradient(rgba(247, 244, 238, 0.05) 1px, transparent 1px);
	background-size: auto, 24px 24px;
	pointer-events: none;
}

.ac-contact-hero__inner {
	position: relative;
	max-width: var(--ac-max);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.ac-contact-hero__title {
	max-width: 760px;
	font-size: clamp(38px, 4.6vw, 60px);
	line-height: 1.06;
	letter-spacing: -0.015em;
	color: var(--ac-cream);
}

.ac-contact-hero__lede,
.ac-contact-hero__lede p {
	max-width: 640px;
	margin: 0;
	font-size: 18px;
	line-height: 1.65;
	color: var(--ac-stone);
}

.ac-contact-hero__points {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
}

.ac-contact-hero__points li {
	position: relative;
	padding-left: 26px;
	font-size: 14px;
	font-weight: 600;
	color: var(--ac-cream);
}

.ac-contact-hero__points li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 2px;
	width: 17px;
	height: 17px;
	border-radius: 50%;
	border: 1.5px solid var(--ac-gold);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b8935a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='5 12.5 10 17.5 19 7'/%3E%3C/svg%3E") center / 10px no-repeat;
}

.ac-contact-main {
	padding: 0 var(--ac-gutter) 96px;
	background: var(--ac-cream);
}

.ac-contact-main__inner {
	position: relative;
	z-index: 2;
	max-width: var(--ac-max);
	margin: -96px auto 0;
	display: grid;
	grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
	gap: 44px;
	align-items: start;
}

.ac-contact-main__form .ac-contact-form--premium {
	max-width: none;
}

/* ---------- Colonne d'accompagnement ---------- */

.ac-contact-aside {
	position: sticky;
	top: 112px;
	margin-top: 150px;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.ac-contact-aside__person {
	display: flex;
	align-items: center;
	gap: 16px;
}

.ac-contact-aside__person img {
	width: 68px;
	height: 68px;
	object-fit: cover;
	border-radius: 50%;
	box-shadow: 0 0 0 2px var(--ac-cream), 0 0 0 3.5px var(--ac-gold);
}

.ac-contact-aside__name {
	margin: 0;
	font-family: var(--ac-font-display);
	font-size: 21px;
	color: var(--ac-ink);
}

.ac-contact-aside__role {
	margin: 2px 0 0;
	font-size: 13px;
	color: var(--ac-taupe);
}

.ac-contact-aside__quote {
	margin: 0;
	padding-left: 16px;
	border-left: 2px solid var(--ac-gold);
	font-family: var(--ac-font-display);
	font-size: 17px;
	line-height: 1.55;
	color: var(--ac-charcoal);
}

.ac-contact-aside__title {
	margin-top: 6px;
	font-family: var(--ac-font-body);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ac-gold);
}

.ac-contact-steps {
	list-style: none;
	margin: -8px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.ac-contact-steps li {
	display: grid;
	grid-template-columns: 32px minmax(0, 1fr);
	gap: 14px;
}

.ac-contact-steps__num {
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--ac-ink);
	color: var(--ac-gold);
	font-family: var(--ac-font-display);
	font-size: 15px;
}

.ac-contact-steps strong {
	display: block;
	font-size: 15px;
	color: var(--ac-ink);
}

.ac-contact-steps p {
	margin: 3px 0 0;
	font-size: 14px;
	line-height: 1.55;
	color: var(--ac-slate);
}

.ac-contact-aside__direct,
.ac-contact-aside__free {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px 18px;
	border: 1px solid var(--ac-border-light);
	border-radius: 12px;
	background: #fff;
}

.ac-contact-aside__label {
	margin: 0;
	font-size: 12px;
	font-weight: 600;
	color: var(--ac-taupe);
}

.ac-contact-aside__direct a {
	font-size: 16px;
	font-weight: 600;
	color: var(--ac-ink);
	overflow-wrap: anywhere;
}

.ac-contact-aside__direct a:hover,
.ac-contact-aside__free:hover {
	color: var(--ac-gold);
}

.ac-contact-aside__free {
	background: var(--ac-ink);
	border-color: var(--ac-ink);
	color: var(--ac-cream);
	font-size: 15px;
	font-weight: 600;
	transition: transform 0.15s ease;
}

.ac-contact-aside__free:hover {
	transform: translateY(-2px);
}

.ac-contact-aside a:focus-visible {
	outline: 2px solid var(--ac-gold);
	outline-offset: 3px;
}

@media (max-width: 1000px) {
	.ac-contact-main__inner {
		grid-template-columns: 1fr;
		gap: 40px;
		max-width: 780px;
	}

	.ac-contact-main__form {
		order: -1;
	}

	.ac-contact-aside {
		position: static;
		margin-top: 0;
	}
}

@media (max-width: 782px) {
	.ac-contact-hero {
		padding: 48px var(--ac-gutter) 110px;
	}

	.ac-contact-hero__lede,
	.ac-contact-hero__lede p {
		font-size: 16px;
	}

	.ac-contact-main {
		padding-bottom: 64px;
	}

	.ac-contact-main__inner {
		margin-top: -72px;
	}
}

/* ============================================================
   ASSISTANT IA HORS LIGNE — AJOUTÉ 2026-09-25
   Tout élément [data-ac-requires-chat] (aperçu de l'assistant sur l'accueil,
   bouton « Discuter avec l'assistant IA ») reste masqué tant que le plugin
   n'a pas confirmé que l'assistant répond (classe « ac-chat-online » sur
   <html>, posée par ac-chat-widget.js). Même règle que dans le plugin :
   répétée ici pour que ces éléments restent masqués même si le plugin est
   désactivé.
   ============================================================ */
html:not(.ac-chat-online) [data-ac-requires-chat] {
	display: none !important;
}
/* ============================================================
   MENU PRINCIPAL — AJOUTÉ 2026-09-26 (demande d'Antoine)
   1. Couleur claire pour TOUS les liens du menu, y compris ceux d'un menu
      WordPress assigné dans Apparence → Menus (wp_nav_menu ne leur donne
      pas la classe .ac-nav__link : ils prenaient la couleur sombre par
      défaut des liens — c'était le cas sur antoinecodex.com).
   2. Chaque section avec ancre (#a-propos, #services…) s'arrête SOUS
      l'en-tête fixe au lieu d'avoir son titre caché derrière.
   ============================================================ */
.ac-nav__list a {
	color: #e7e2d6;
	font-size: 14px;
	transition: color 0.15s ease;
}

.ac-nav__list a:hover,
.ac-nav__list a:focus-visible {
	color: var(--ac-gold);
}

.ac-section[id] {
	scroll-margin-top: 88px;
}

@media (max-width: 782px) {
	.ac-section[id] {
		scroll-margin-top: 72px;
	}
}

/* ============================================================
   LANGUAGE SWITCHER EN | FR
   ============================================================
   Reusable component (voir inc/language-switcher.php — copié du thème EN le 2026-09-28), identical in the
   desktop and mobile variant — only visibility differs here.
   ============================================================ */

.ac-lang-switch {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--ac-font-body);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.03em;
}

.ac-lang-switch__item {
	display: inline-flex;
	align-items: center;
	padding: 4px 6px;
	border-radius: 4px;
	color: #e7e2d6;
	text-decoration: none;
	border: 1px solid transparent;
	transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

a.ac-lang-switch__item:hover {
	color: var(--ac-gold);
}

.ac-lang-switch__item:focus-visible {
	outline: 2px solid var(--ac-gold);
	outline-offset: 2px;
}

.ac-lang-switch__item.is-active {
	color: var(--ac-cream);
	background: var(--ac-surface-dark);
	border-color: rgba(184, 147, 90, 0.45);
	cursor: default;
}

/* Active language but not yet published on the other side: stays visible
   and readable, never hidden, but clearly non-interactive — neither a
   dead link nor a disabled HTML button. */
span.ac-lang-switch__item.is-disabled {
	color: var(--ac-stone);
	cursor: default;
	opacity: 0.65;
}

.ac-lang-switch__sep {
	color: var(--ac-stone);
	opacity: 0.6;
	font-size: 12px;
}

/* Desktop variant: visible in the header, hidden in the mobile dropdown
   menu (same threshold as .ac-header__cta--desktop-only/--mobile-only,
   to stay consistent with the rest of the header). */
.ac-lang-switch--mobile {
	display: none;
}

@media (max-width: 900px) {
	.ac-lang-switch--desktop {
		display: none;
	}

	.ac-lang-switch--mobile {
		display: inline-flex;
		margin: 4px 0 2px;
	}
}

/* 2026-09-28 : questions de la FAQ en <h3> (structure des titres) — police du texte conservée. */
.ac-faq__question {
	font-family: var(--ac-font-body);
	line-height: 1.5;
}

.ac-page-header__lede a {
	color: var(--ac-gold);
	text-decoration: underline;
	text-underline-offset: 2px;
}