/* ============================================================
   DELTEA · Pages CSS V6 — accueil et styles specifiques
   Source : AGENTS.md, spec.md, recueil.md
   Zero blanc pur (#FFFFFF interdit), tokens stricts
   ============================================================ */

/* ---------- Hero Accueil (01 Promesse) ---------- */
.accueil-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: min(85vh, 740px);
	padding-top: calc(72px + var(--esp-lg));
	padding-bottom: var(--esp-xl);
	background: url('../img/fonds/deltea-fond_site-hero_sombre_TR_aucun.svg') center 40px no-repeat;
	background-size: 100% auto;
	background-color: var(--obsidienne);
}

.accueil-hero__inner {
	width: 100%;
	max-width: var(--large);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--esp-md);
	padding-right: var(--esp-md);
	display: flex;
	flex-direction: column;
	gap: var(--esp-md);
}

.accueil-hero__titre {
	font-family: 'Clash Display', sans-serif;
	font-size: clamp(1.45rem, 1rem + 2.5vw, 4.5rem);
	line-height: 1.08;
	letter-spacing: -0.02em;
	color: var(--ink);
	max-width: 18ch;
	margin: 0;
	overflow-wrap: break-word;
}

.accueil-hero__chapo {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-lg);
	line-height: 1.5;
	color: var(--ink-2);
	max-width: var(--lecture);
	margin: 0;
}

.accueil-hero__accroche {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	font-weight: 500;
	line-height: 1.5;
	color: var(--ink);
	max-width: var(--lecture);
	margin: 0;
}

.accueil-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--esp-md);
	margin-top: var(--esp-xs);
}

.accueil-hero__reassurance {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	line-height: 1.5;
	letter-spacing: 0.02em;
	color: var(--ink-2);
	max-width: var(--lecture);
	margin: 0;
}

/* ---------- Sections Accueil (02-09) ---------- */
.accueil-section {
	position: relative;
	padding-top: var(--esp-xl);
	padding-bottom: var(--esp-xl);
}

.accueil-section--fond {
	background-color: var(--bg-surface);
	border-top: 1px solid var(--hairline);
	border-bottom: 1px solid var(--hairline);
}

.accueil-section__inner {
	width: 100%;
	max-width: var(--large);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--esp-md);
	padding-right: var(--esp-md);
	display: flex;
	flex-direction: column;
	gap: var(--esp-md);
}

.accueil-section h2 {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-3xl);
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--ink);
	max-width: 24ch;
	margin: 0;
}

.accueil-section p {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	line-height: 1.6;
	color: var(--ink-2);
	max-width: var(--lecture);
	margin: 0;
}

.accueil-section p strong,
.accueil-section li strong {
	color: var(--ink);
}

.accueil-section__douleur {
	font-weight: 500;
	color: var(--ink) !important;
}

.accueil-section__chute {
	color: var(--ink) !important;
	padding-top: var(--esp-xs);
}

/* ---------- Bloc "Vous etes concerne si..." ---------- */
.concerne {
	max-width: var(--lecture);
	border-left: 2px solid var(--sauge);
	padding-left: var(--esp-md);
	margin-top: var(--esp-xs);
	margin-bottom: var(--esp-xs);
	display: flex;
	flex-direction: column;
	gap: var(--esp-xs);
}

.concerne__titre {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--sauge);
	margin-bottom: var(--esp-xs);
}

.concerne__liste {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--esp-xs);
}

.concerne__liste li {
	position: relative;
	padding-left: 1.25rem;
	font-size: var(--typo-base);
	line-height: 1.5;
	color: var(--ink-2);
}

.concerne__liste li::before {
	content: '·';
	position: absolute;
	left: 0.25rem;
	color: var(--sauge);
	font-weight: 700;
}

/* ---------- Foyers & Preuves chiffrées ---------- */
.foyers,
.preuves {
	max-width: var(--lecture);
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--esp-sm);
}

.foyers li {
	padding-bottom: var(--esp-xs);
	border-bottom: 1px solid var(--hairline);
	font-size: var(--typo-base);
	line-height: 1.6;
	color: var(--ink-2);
}

.preuves li {
	font-size: var(--typo-sm);
	line-height: 1.5;
	color: var(--ink-2);
}

.preuves a,
.foyers a,
.accueil-section a:not(.btn-v3):not(.lien-fleche):not(.glossaire-terme) {
	color: var(--sauge);
	text-decoration: underline dotted 1px;
	text-underline-offset: 3px;
	transition: color 0.2s var(--easing-doux);
}

.preuves a:hover,
.foyers a:hover,
.accueil-section a:not(.btn-v3):not(.lien-fleche):not(.glossaire-terme):hover {
	color: var(--blanc-forge);
}

/* ---------- Lien fleche (CTA secondaire) ---------- */
.lien-fleche {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	width: fit-content;
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-sm);
	letter-spacing: 0.04em;
	text-decoration: none;
	color: var(--ink);
	border-bottom: 1px solid var(--hairline);
	padding-bottom: 3px;
	margin-top: var(--esp-xs);
	transition: color 0.25s var(--easing-doux), border-color 0.25s var(--easing-doux);
}

.lien-fleche::after {
	content: '\2192';
	transition: transform 0.25s var(--easing-doux);
}

.lien-fleche:hover,
.lien-fleche:focus-visible {
	color: var(--sauge);
	border-color: var(--sauge);
}

.lien-fleche:hover::after,
.lien-fleche:focus-visible::after {
	transform: translateX(4px);
}

/* ---------- FAQ Signature & ajustements ---------- */
.faq__signature {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	color: var(--ink-2);
	margin-top: var(--esp-md);
	letter-spacing: 0.02em;
}

.faq__signature a {
	color: var(--sauge);
	text-decoration: underline dotted 1px;
	text-underline-offset: 3px;
}

/* ---------- Carte Audit finale (Section 09) ---------- */
.audit-card {
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

.audit-card .carte-cadre {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--esp-sm);
	padding: var(--esp-xl) var(--esp-md);
}

.audit-card__meta {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--sauge);
	margin: 0;
}

.audit-card__valeur {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-2xl);
	line-height: 1.2;
	color: var(--ink);
	margin: 0;
	max-width: 28ch;
}

.audit-card__doctrine {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	color: var(--ink-2);
	margin: 0;
}

.audit-card .btn-v3 {
	margin-top: var(--esp-sm);
}

/* ---------- Schema placeholder ---------- */
.schema__placeholder {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	color: var(--ink-2);
	text-align: center;
	letter-spacing: 0.04em;
	padding: var(--esp-md);
}

/* ============================================================
   MANIFESTE · Styles spécifiques
   ============================================================ */
.refus-liste {
	list-style: none;
	padding: 0;
	margin: var(--esp-sm) 0 0 0;
	display: flex;
	flex-direction: column;
	gap: var(--esp-sm);
	max-width: var(--lecture);
}

.refus-item {
	display: flex;
	align-items: baseline;
	gap: var(--esp-md);
	padding: var(--esp-md);
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	border-radius: var(--rayon-carte);
}

.refus-item__num {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-lg);
	font-weight: 700;
	color: var(--sauge);
	flex-shrink: 0;
}

.refus-item__texte {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	font-weight: 500;
	line-height: 1.45;
	color: var(--ink);
	margin: 0;
}

/* ============================================================
   MÉTHODE · Styles spécifiques
   ============================================================ */
.timeline-hero-signe {
	width: 100%;
	max-width: 860px;
	margin: var(--esp-sm) auto var(--esp-sm) auto;
	border-radius: var(--rayon-carte);
	overflow: hidden;
}

.timeline-hero-signe img {
	width: 100%;
	height: auto;
	display: block;
}

.etape-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--esp-lg);
	margin-top: var(--esp-xs);
	max-width: var(--large);
}

@media (min-width: 860px) {
	.etape-grid {
		grid-template-columns: 1.35fr 1fr;
		align-items: start;
	}
}

.etape-principal {
	display: flex;
	flex-direction: column;
	gap: var(--esp-md);
}

.etape-carte-livrable {
	padding: var(--esp-lg) var(--esp-md);
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	border-radius: var(--rayon-carte);
	display: flex;
	flex-direction: column;
	gap: var(--esp-sm);
}

.etape-carte-livrable__titre {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--sauge);
	margin: 0;
}

.etape-carte-livrable__texte {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	font-weight: 500;
	line-height: 1.5;
	color: var(--ink);
	margin: 0;
}

.etape-carte-livrable__preuve {
	font-size: var(--typo-sm);
	line-height: 1.55;
	color: var(--ink-2);
	border-top: 1px solid var(--hairline);
	padding-top: var(--esp-sm);
	margin: 0;
}

.etape-carte-livrable__preuve strong {
	color: var(--ink);
}

.etape-carte-livrable__preuve a {
	color: var(--sauge);
	text-decoration: underline dotted 1px;
	text-underline-offset: 3px;
}

.etape-carte-livrable__preuve a:hover {
	color: var(--blanc-forge);
}

/* ============================================================
   GLOSSAIRE · Styles spécifiques
   ============================================================ */
.glossaire-nav {
	display: flex;
	flex-wrap: wrap;
	gap: var(--esp-xs);
	margin-top: var(--esp-xs);
	margin-bottom: var(--esp-md);
}

.glossaire-nav__btn {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.03em;
	padding: 0.45rem 0.85rem;
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	color: var(--ink-2);
	border-radius: var(--rayon-controle);
	text-decoration: none;
	transition: color 0.2s var(--easing-doux), border-color 0.2s var(--easing-doux), background-color 0.2s var(--easing-doux);
}

.glossaire-nav__btn:hover,
.glossaire-nav__btn:focus-visible {
	color: var(--ink);
	border-color: var(--sauge);
	background: rgba(95, 118, 106, 0.12);
}

.glossaire-nav__count {
	opacity: 0.65;
	font-size: 0.9em;
}

.glossaire-groupe {
	margin-top: var(--esp-xl);
	padding-top: var(--esp-lg);
	border-top: 1px solid var(--hairline);
}

.glossaire-groupe__titre {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-2xl);
	color: var(--ink);
	margin: 0 0 var(--esp-md) 0;
	display: flex;
	align-items: baseline;
	gap: var(--esp-sm);
}

.glossaire-groupe__count {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	color: var(--sauge);
	letter-spacing: 0.04em;
}

.glossaire-grille {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--esp-md);
}

@media (min-width: 768px) {
	.glossaire-grille {
		grid-template-columns: repeat(2, 1fr);
	}
}

.glossaire-carte {
	position: relative;
	padding: var(--esp-md);
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	border-radius: var(--rayon-carte);
	display: flex;
	flex-direction: column;
	gap: var(--esp-xs);
	scroll-margin-top: calc(72px + var(--esp-lg));
	transition: border-color 0.25s var(--easing-doux), background-color 0.25s var(--easing-doux), box-shadow 0.25s var(--easing-doux);
}

.glossaire-carte:target {
	border-color: var(--sauge);
	background: rgba(95, 118, 106, 0.08);
	box-shadow: 0 0 0 1px var(--sauge);
}

.glossaire-carte__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--esp-xs);
	flex-wrap: wrap;
}

.glossaire-carte__titre {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-lg);
	color: var(--ink);
	margin: 0;
}

.glossaire-carte__titre a {
	color: inherit;
	text-decoration: none;
}

.glossaire-carte__titre a:hover {
	color: var(--sauge);
}

.glossaire-carte__badge {
	font-family: 'Space Mono', monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.15rem 0.45rem;
	border-radius: 2px;
	background: rgba(95, 118, 106, 0.15);
	color: var(--sauge);
	border: 1px solid rgba(95, 118, 106, 0.3);
}

.glossaire-carte__def {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-sm);
	line-height: 1.6;
	color: var(--ink-2);
	margin: 0;
}

/* ============================================================
   SERVICES (Hub & Piliers) · Styles spécifiques
   ============================================================ */
.piliers-grille {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--esp-lg);
	margin-top: var(--esp-md);
}

@media (min-width: 900px) {
	.piliers-grille {
		grid-template-columns: repeat(3, 1fr);
		align-items: stretch;
	}
}

.pilier-carte {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: var(--esp-lg) var(--esp-md);
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	border-radius: var(--rayon-carte);
	gap: var(--esp-md);
	transition: border-color 0.25s var(--easing-doux);
}

.pilier-carte:hover {
	border-color: var(--sauge);
}

.pilier-carte__head {
	display: flex;
	flex-direction: column;
	gap: var(--esp-xs);
}

.pilier-carte__eyebrow {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--sauge);
	margin: 0;
}

.pilier-carte__titre {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-xl);
	line-height: 1.2;
	color: var(--ink);
	margin: 0;
}

.pilier-carte__desc {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-sm);
	line-height: 1.6;
	color: var(--ink-2);
	margin: 0;
}

.pilier-carte__preuve {
	font-size: var(--typo-xs);
	line-height: 1.5;
	color: var(--ink-2);
	border-top: 1px solid var(--hairline);
	padding-top: var(--esp-sm);
	margin: 0;
}

.pilier-carte__preuve strong {
	color: var(--ink);
}

.pilier-carte__preuve a {
	color: var(--sauge);
	text-decoration: underline dotted 1px;
	text-underline-offset: 3px;
}

/* Grille 2 colonnes sous-pages services */
.service-subgrid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--esp-lg);
	margin-top: var(--esp-md);
	max-width: var(--large);
}

@media (min-width: 860px) {
	.service-subgrid {
		grid-template-columns: 1.35fr 1fr;
		align-items: start;
	}
}

/* Matrice de risque */
.matrice-risque {
	list-style: none;
	padding: 0;
	margin: var(--esp-sm) 0 0 0;
	display: flex;
	flex-direction: column;
	gap: var(--esp-xs);
	max-width: var(--lecture);
}

.matrice-risque__item {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	padding: var(--esp-sm) var(--esp-md);
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	border-radius: var(--rayon-carte);
	gap: var(--esp-sm);
	flex-wrap: wrap;
}

.matrice-risque__label {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-sm);
	font-weight: 500;
	color: var(--ink);
}

.matrice-risque__badge {
	font-family: 'Space Mono', monospace;
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.15rem 0.5rem;
	border-radius: 2px;
}

.matrice-risque__badge--faible {
	background: rgba(95, 118, 106, 0.15);
	color: var(--sauge);
	border: 1px solid rgba(95, 118, 106, 0.3);
}

.matrice-risque__badge--moyen {
	background: rgba(143, 118, 84, 0.15);
	color: var(--cuivre);
	border: 1px solid rgba(143, 118, 84, 0.3);
}

.matrice-risque__badge--eleve {
	background: rgba(155, 77, 58, 0.15);
	color: var(--alerte);
	border: 1px solid rgba(155, 77, 58, 0.3);
}

.matrice-risque__badge--critique {
	background: rgba(155, 77, 58, 0.25);
	color: #D87B68;
	border: 1px solid rgba(155, 77, 58, 0.5);
	font-weight: 700;
}

/* Listes de livrables et formats */
.livrables-liste,
.formats-liste {
	list-style: none;
	padding: 0;
	margin: var(--esp-sm) 0 0 0;
	display: flex;
	flex-direction: column;
	gap: var(--esp-sm);
	max-width: var(--lecture);
}

.livrable-item,
.format-item {
	position: relative;
	padding-left: 1.75rem;
	font-size: var(--typo-base);
	line-height: 1.5;
	color: var(--ink-2);
}

.livrable-item::before,
.format-item::before {
	content: '■';
	position: absolute;
	left: 0.25rem;
	top: 0.1em;
	font-size: 0.65rem;
	color: var(--sauge);
}

.livrable-item strong,
.format-item strong {
	color: var(--ink);
}

/* Séquence / progression étapes */
.sequence-liste {
	display: flex;
	flex-wrap: wrap;
	gap: var(--esp-xs);
	align-items: center;
	margin: var(--esp-sm) 0;
}

.sequence-etape {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.04em;
	padding: 0.35rem 0.75rem;
	background: var(--bg-surface);
	border: 1px solid var(--hairline);
	color: var(--ink);
	border-radius: var(--rayon-controle);
}

.sequence-separateur {
	color: var(--sauge);
	font-size: 0.8rem;
}

/* ============================================================
   ACTION (Audit, Réserver, Coaching, Formation) · Styles
   ============================================================ */
.ce-que-cest-grille {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--esp-md);
	margin-top: var(--esp-md);
	max-width: var(--large);
}

@media (min-width: 768px) {
	.ce-que-cest-grille {
		grid-template-columns: 1fr 1fr;
	}
}

.ce-que-cest-carte {
	padding: var(--esp-lg) var(--esp-md);
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	border-radius: var(--rayon-carte);
	display: flex;
	flex-direction: column;
	gap: var(--esp-sm);
}

.ce-que-cest-carte--positif {
	border-left: 3px solid var(--sauge);
}

.ce-que-cest-carte--negatif {
	border-left: 3px solid var(--ardoise);
}

.ce-que-cest-carte__titre {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0;
}

.ce-que-cest-carte--positif .ce-que-cest-carte__titre {
	color: var(--sauge);
}

.ce-que-cest-carte--negatif .ce-que-cest-carte__titre {
	color: var(--ardoise);
}

.ce-que-cest-carte__texte {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	line-height: 1.5;
	color: var(--ink);
	margin: 0;
}

/* Grille de parcours et formats */
.parcours-grille {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--esp-lg);
	margin-top: var(--esp-md);
}

@media (min-width: 860px) {
	.parcours-grille {
		grid-template-columns: repeat(3, 1fr);
		align-items: stretch;
	}
}

.parcours-carte {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: var(--esp-lg) var(--esp-md);
	border: 1px solid var(--hairline);
	background: var(--bg-surface);
	border-radius: var(--rayon-carte);
	gap: var(--esp-md);
	transition: border-color 0.25s var(--easing-doux);
}

.parcours-carte:hover {
	border-color: var(--sauge);
}

.parcours-carte__badge {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--sauge);
	margin: 0;
}

.parcours-carte__titre {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-xl);
	color: var(--ink);
	margin: 0;
}

.parcours-carte__desc {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-sm);
	line-height: 1.6;
	color: var(--ink-2);
	margin: 0;
}

.parcours-carte__action {
	margin-top: auto;
}

/* ---------- Reduction mouvement ---------- */
@media (prefers-reduced-motion: reduce) {
	.lien-fleche::after,
	.lien-fleche:hover::after,
	.lien-fleche:focus-visible::after {
		transition: none;
		transform: none;
	}
}

/* ============================================================
   STRATE PREUVE & CONFIANCE (A propos, Contact, Transparence, Legal, Merci)
   ============================================================ */

/* ---------- Formulaire Contact ---------- */
.form-contact {
	display: flex;
	flex-direction: column;
	gap: var(--esp-lg);
	max-width: var(--large);
	margin-top: var(--esp-md);
}

.form-contact__grille-2 {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--esp-md);
}

@media (min-width: 768px) {
	.form-contact__grille-2 {
		grid-template-columns: 1fr 1fr;
	}
}

.form-groupe {
	display: flex;
	flex-direction: column;
	gap: var(--esp-xxs);
}

.form-label {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.05em;
	color: var(--ink-2);
}

.form-label--requis::after {
	content: " *";
	color: var(--sauge);
}

.form-input,
.form-select,
.form-textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	background-color: var(--bg-surface);
	color: var(--ink);
	border: 1px solid var(--hairline);
	border-radius: var(--rayon-controle);
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	transition: border-color 0.2s var(--easing-doux);
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
	outline: none;
	border-color: var(--sauge);
}

.form-input::placeholder,
.form-textarea::placeholder {
	color: var(--ardoise);
	opacity: 0.7;
}

.form-textarea {
	min-height: 120px;
	resize: vertical;
}

/* Tuiles de choix / options radio et checkbox */
.form-options-grille {
	display: flex;
	flex-wrap: wrap;
	gap: var(--esp-xs);
	margin-top: var(--esp-xxs);
}

.form-option-item {
	display: inline-flex;
	align-items: center;
	cursor: pointer;
}

.form-option-item input[type="radio"],
.form-option-item input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.form-option-chip {
	display: inline-block;
	padding: 0.4rem 0.85rem;
	border: 1px solid var(--hairline);
	border-radius: 9999px;
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-xs);
	color: var(--ink-2);
	background: var(--bg-surface);
	transition: all 0.2s var(--easing-doux);
	user-select: none;
}

.form-option-item input:checked + .form-option-chip {
	border-color: var(--sauge);
	background: rgba(184, 197, 183, 0.12);
	color: var(--blanc-forge);
}

.form-checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: var(--esp-xs);
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-sm);
	color: var(--ink-2);
	line-height: 1.5;
	cursor: pointer;
	margin-top: var(--esp-xs);
}

.form-checkbox-label input[type="checkbox"] {
	margin-top: 0.25rem;
	accent-color: var(--sauge);
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

/* ---------- Textes Légaux & Contenu Doc ---------- */
.texte-legal {
	max-width: var(--large);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var(--esp-lg);
}

.texte-legal-section {
	display: flex;
	flex-direction: column;
	gap: var(--esp-xs);
	border-bottom: 1px solid var(--hairline);
	padding-bottom: var(--esp-lg);
}

.texte-legal-section:last-child {
	border-bottom: none;
}

.texte-legal-section h2 {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-lg);
	color: var(--ink);
	margin: 0;
}

.texte-legal-section p,
.texte-legal-section ul {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	line-height: 1.6;
	color: var(--ink-2);
	margin: 0;
}

.texte-legal-section ul {
	padding-left: var(--esp-md);
}

.texte-legal-section li {
	margin-bottom: var(--esp-xxs);
}

.texte-legal-section a {
	color: var(--sauge);
	text-decoration: underline dotted 1px;
	text-underline-offset: 3px;
}

.texte-legal-section a:hover {
	color: var(--blanc-forge);
}

/* ---------- Pages de Confirmation /merci/ ---------- */
.merci-conteneur {
	max-width: 640px;
	margin: var(--esp-xl) auto;
	padding: var(--esp-xl) var(--esp-md);
	background: var(--bg-surface);
	border: 1px solid var(--hairline);
	border-radius: var(--rayon-carte);
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--esp-md);
}

.merci-conteneur__badge {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--sauge);
}

.merci-conteneur__titre {
	font-family: 'Clash Display', sans-serif;
	font-size: var(--typo-xxl);
	color: var(--ink);
	margin: 0;
}

.merci-conteneur__message {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-base);
	line-height: 1.6;
	color: var(--ink-2);
	margin: 0;
}

.merci-preparer {
	width: 100%;
	padding: var(--esp-md);
	background: rgba(184, 197, 183, 0.05);
	border: 1px dashed var(--hairline);
	border-radius: var(--rayon-controle);
	text-align: left;
	margin-top: var(--esp-xs);
}

.merci-preparer__titre {
	font-family: 'Space Mono', monospace;
	font-size: var(--typo-xs);
	color: var(--sauge);
	margin-bottom: var(--esp-xxs);
}

.merci-preparer__texte {
	font-family: 'General Sans', sans-serif;
	font-size: var(--typo-sm);
	color: var(--ink-2);
	line-height: 1.5;
	margin: 0;
}

.merci-actions {
	display: flex;
	gap: var(--esp-md);
	justify-content: center;
	flex-wrap: wrap;
	margin-top: var(--esp-sm);
}