/*
Theme Name: Antoine Codex (EN)
Theme URI: https://antoinecodex.com
Author: ANTOINE CODEX
Description: English (en-GB) production theme for antoinecodex.com. Same design system (colour tokens, typography, header/footer structure, components) as the French production theme on antoinecodex.fr — visual parity is intentional and exact. Body copy is fully hand-written English, not machine-translated. Works with the "Antoine Codex — Core (EN)" plugin fork for the Business Assessment, the AI assistant and the contact form. This file and the French theme's style.css are maintained in parallel: a visual/design change should be mirrored on both sides, but copy always stays independent.
Version: 0.4.2-dev
Requires PHP: 7.4
Text Domain: antoine-codex-theme-en

0.2.4-dev (2026-09-26) — Menu links light and readable again (the WordPress menu
assigned under Appearance → Menus had no .ac-nav__link class, so "About"
etc. were dark). Mobile menu closes by itself as soon as a link is chosen
(and with Escape or a click outside); anchored sections stop below the
sticky header.

0.2.3-dev (2026-09-25) — The AI assistant preview (homepage) and the "Chat
with the AI assistant" button (Problem solving) are hidden until the
assistant is confirmed online (plugin 0.1.4-dev).

0.2.2-dev (2026-09-25) — Email shown on the site changed from
contact@antoinecodex.fr to contact@antoinecodex.com (Antoine's request):
homepage (2 service blocks), Contact, Problem solving, Privacy Policy.

0.2.1-dev (2026-09-25) — "Premium" Contact page (page-templates/contact.php):
dark header, side column (Antoine, what happens after the message, direct
contact, link to the free assessment) next to the new qualifying form of
the antoine-codex-core-en 0.1.2-dev plugin (install together). Styles:
"PREMIUM CONTACT PAGE" block at the end of the file.
0.2.0-dev (2026-09-25) — Antoine's request: (1) new page "ANTOINE CODEX
Problem solving" (/problem-solving/, page-templates/problem-solving.php):
the problem we look at, the five-stage ANTOINE CODEX Method, deliverables,
three schematic situations (no client data, no result claimed), the 18
pages of the "ANTOINE CODEX Method" presentation shown one below the other
in the page (images — NO PDF published or downloadable, Antoine's
request), then a "Contact ANTOINE CODEX" section (meeting, conversation,
quote). The WordPress page is created automatically the first time an
administrator loads wp-admin (inc/problem-solving.php). (2) "ANTOINE CODEX
Problem solving" accent section right below the homepage video, linking to
that page. (3) On the new page, a "Free online, or in depth on site"
block: the automated assessment (questionnaire + AI assistant) is free; the
engagement in the presentation is paid, carried out by an ANTOINE
CODEX team supervised by Antoine, who comes to the company in person.
The Founder section is unchanged. Styles: .ac-ps-* block at the
end of this file — no new colours.

0.1.0-dev (2026-09-23) — First build of the English site. Structure,
CSS and visual design ported one-to-one from the French production theme
(antoine-codex-theme 0.3.1-dev / live 0.3.2-dev): same header/footer,
same section components (.ac-hero, .ac-card, .ac-step, .ac-method,
.ac-founder, .ac-faq, .ac-service-feature, .ac-step-detail, etc.), same
colour tokens and fonts (Fraunces + Inter), same responsive breakpoints.
Only the CSS comments in this file were translated/condensed to English —
every selector, rule and value is unchanged from the French source, so the
two sites render identically. Content (all page templates) is separate,
hand-written English — see front-page.php and page-templates/.

Video hero: uses this site's own English presentation video (provided by
Antoine, ANTOINE_CODEX_presentation_EN.mp4), re-encoded to the same
technical profile as the French hero video (H.264, two source files for
desktop/mobile) and served from this theme's own assets/video/ — no file
is shared with or hot-linked from antoinecodex.fr.
*/


/* ============================================================
   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;
	}
}

/* ============================================================
   LANGUAGE SWITCHER EN | FR
   ============================================================
   Reusable component (see inc/language-switcher.php), 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;
	}
}

/* ============================================================
   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;
}

/*
 * 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.
 */
.ac-video-hero__scroll {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: -22px auto 0;
	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;
	}
}

/* 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 */
	/* ADDED 2026-09-23 — .ac-video-hero__scroll (the round chevron between
	   the video and this section) only pulls ITSELF up via a negative
	   top margin; that margin does not affect this section's own flow
	   position. Left as-is, the scroll link's negative margin still
	   consumes 22px of vertical flow space between the video and this
	   section, with no background of its own outside the 44px circle —
	   so the page's cream body background showed through as a full-width
	   bar between two dark sections. Pulling this section up by the same
	   22px closes that gap exactly flush with the video's bottom edge;
	   the chevron (explicit z-index: 2) still renders above this section
	   (z-index: auto) wherever they now overlap, so it stays visible,
	   centred right on the seam.
	*/
	margin-top: -22px;
}

.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) */
		margin-top: -19px; /* ADDED 2026-09-23 — matches .ac-video-hero__scroll's -19px mobile margin, see desktop rule above */
	}
}

.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);
}

/*
 * ---------- Grille "explication du diagnostic" + carte Diagnostic rapide ----------
 * AJOUTÉ 2026-09-19. .ac-explainer reste display:flex/column/centré pour
 * l'intro (inchangé) ; cette grille encadre uniquement la partie sous
 * l'intro (démo + CTA / carte promo), en une seule colonne par défaut
 * (mobile — la carte suit simplement l'exemple de démonstration dans l'ordre
 * naturel du contenu) et en deux colonnes à partir de 900px (desktop — carte
 * en colonne de droite, alignée en haut de la grille).
 */
.ac-explainer__grid {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 32px;
	width: 100%;
	max-width: var(--ac-max);
}

.ac-explainer__col-main {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	width: 100%;
}

@media (min-width: 900px) {
	.ac-explainer__grid {
		display: grid;
		grid-template-columns: 1.3fr 1fr;
		align-items: start;
		gap: 40px;
	}

	.ac-explainer__col-main {
		align-items: flex-start;
		text-align: left;
	}
}

.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;
}

@media (min-width: 900px) {
	.ac-diag-promo {
		max-width: none;
	}
}

.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 {
	/* 2026-09-28: questions are now <h3> (heading structure); keep the body font of the former <div>. */
	font-family: var(--ac-font-body);
	line-height: 1.5;
	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);
}

/* 2026-09-28: in-text links in page headers (Quick Business Assessment). */
.ac-page-header__lede a {
	color: var(--ac-gold);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ac-page-header__lede 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;
	}
}

/* ---------- Video / accent junction (EN homepage) ----------
   ADDED 2026-09-25 — on this site the chevron's negative top margin is
   compensated by .ac-hero { margin-top: -22px } (see the HERO rules). The
   new accent section now sits between the chevron and the HERO, so it takes
   over that compensation, and the HERO right after it is no longer pulled
   up (it would otherwise overlap the accent section by 22px). */
.ac-video-hero__scroll + .ac-ps-teaser {
	margin-top: -22px;
}

.ac-ps-teaser + .ac-hero {
	margin-top: 0;
}

@media (max-width: 782px) {
	.ac-video-hero__scroll + .ac-ps-teaser {
		margin-top: -19px;
	}

	.ac-ps-teaser + .ac-hero {
		margin-top: 0;
	}
}

/* ---------- 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;
	}
}

/* ============================================================
   PREMIUM CONTACT PAGE — ADDED 2026-09-25
   Dark header, form card overlapping the header, side column (Antoine,
   what happens next, direct contact). The form itself: see the plugin's
   ac-frontend.css (.ac-contact-form--premium). Existing --ac-* tokens only.
   ============================================================ */

.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;
}

/* ---------- Side column ---------- */

.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;
	}
}

/* ============================================================
   AI ASSISTANT OFFLINE — ADDED 2026-09-25
   Every [data-ac-requires-chat] element (assistant preview on the homepage,
   "Chat with the AI assistant" button) stays hidden until the plugin has
   confirmed the assistant answers ("ac-chat-online" class on <html>, set by
   ac-chat-widget.js). Same rule as in the plugin, repeated here so these
   elements stay hidden even if the plugin is deactivated.
   ============================================================ */
html:not(.ac-chat-online) [data-ac-requires-chat] {
	display: none !important;
}
/* ============================================================
   PRIMARY MENU — ADDED 2026-09-26 (Antoine's request)
   1. Light colour for ALL menu links, including those of a WordPress menu
      assigned under Appearance → Menus (wp_nav_menu doesn't give them the
      .ac-nav__link class: they took the dark default link colour — the
      case on antoinecodex.com, "About" etc. barely visible).
   2. Every anchored section (#about, #services…) stops BELOW the sticky
      header instead of having its heading hidden behind it.
   ============================================================ */
.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;
	}
}

/* ADDED 2026-09-28 — copied from the French theme (0.5.0-dev) at Antoine's request, same as antoinecodex.fr: long founder biography —
   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;
	}
}