/*
 * Gaume Bois — socle visuel (13. Contraste · 14. Responsive · 20. CTA unique)
 * Charte de la maquette de référence : papier crème, encre, vert forêt, doré « sève ».
 * Toutes les paires texte/fond sont vérifiées WCAG AA : python3 outils/contraste.py
 */

:root {
	--gb-papier: #fbfaf7;
	--gb-surface: #f1eee5;
	--gb-surface-fonce: #e6e2d5;
	--gb-trait: #dcd7c9;
	--gb-encre: #16150f;
	--gb-encre-douce: #4a463c;
	--gb-encre-pale: #6b6558;      /* Maquette : #7d776a (4,26:1) → foncé pour atteindre AA */
	--gb-foret: #1e3b2c;
	--gb-foret-fonce: #132619;
	--gb-seve: #b68a18;            /* Fonds et décor uniquement (3,03:1 sur papier) */
	--gb-seve-vive: #d9a827;
	--gb-seve-texte: #7f5f12;      /* Doré utilisable en texte sur papier (5,67:1) */
	--gb-sur-seve: #17130a;        /* Texte posé sur un fond doré */
	--gb-blanc: #ffffff;
	--gb-alerte: #8a2b14;
	--gb-ok: #1d6b3e;

	--gb-police: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--gb-rayon: 2px;
	--gb-focus: 0 0 0 3px rgba(182, 138, 24, 0.55);
	--gb-largeur: 1240px;
	--gb-etroit: 760px;
}

/* ---------- Accessibilité : focus visible au clavier ---------- */

:focus-visible {
	outline: 2px solid var(--gb-foret);
	outline-offset: 2px;
	box-shadow: var(--gb-focus);
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------- Responsive : garde-fous ---------- */

img, video, iframe, svg {
	max-width: 100%;
}

img {
	height: auto;
}

.entry-content table,
.gb-document table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
}

.gb-document,
.entry-content {
	overflow-wrap: break-word;
}

/* ---------- 20. Bouton d'action unique ---------- */

.gb-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 48px; /* Cible tactile confortable sur mobile */
	padding: 0.8rem 1.6rem;
	border: 1px solid var(--gb-seve);
	border-radius: var(--gb-rayon);
	background: var(--gb-seve);
	color: var(--gb-sur-seve);
	font-family: inherit;
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background 120ms ease, border-color 120ms ease;
}

.gb-cta:hover,
.gb-cta:focus-visible {
	background: var(--gb-seve-vive);
	border-color: var(--gb-seve-vive);
	color: var(--gb-sur-seve);
}

@media (max-width: 600px) {
	.gb-cta {
		width: 100%;
	}
}

/* ---------- Pages légales ---------- */

.gb-document {
	max-width: var(--gb-etroit);
	color: var(--gb-encre);
	line-height: 1.6;
}

.gb-document h2 {
	margin-top: 2.5rem;
}

.gb-a-completer {
	background: #fff1b8;
	color: var(--gb-encre);
	padding: 0 0.2em;
}

.gb-liens-legaux {
	padding: 1.5rem 16px;
	background: var(--gb-foret-fonce);
	font-size: 0.875rem;
}

.gb-liens-legaux ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem 1.5rem;
	max-width: var(--gb-largeur);
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.gb-liens-legaux a {
	color: var(--gb-papier);
	text-underline-offset: 3px;
}

.gb-liens-legaux a:hover {
	color: var(--gb-seve-vive);
}

/* ---------- 15. Page 404 ---------- */

.gb-404 {
	max-width: var(--gb-etroit);
	margin: 0 auto;
	padding: clamp(3rem, 10vw, 6rem) 16px;
	color: var(--gb-encre);
	text-align: center;
}

.gb-404__code {
	margin: 0 0 0.5rem;
	color: var(--gb-seve-texte);
	font-size: 0.78125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.gb-404__titre {
	margin: 0 0 1rem;
	font-size: clamp(2.25rem, 5.5vw, 3.75rem);
	font-stretch: 112%;
	line-height: 1.1;
	letter-spacing: -0.02em;
}

.gb-404__texte {
	margin: 0 auto 2rem;
	color: var(--gb-encre-douce);
}

.gb-404__recherche {
	max-width: 480px;
	margin: 0 auto 2rem;
}

.gb-404__liens {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem 1.5rem;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
}

.gb-404__liens a {
	color: var(--gb-foret);
	text-underline-offset: 3px;
}

.gb-404__liens a:hover {
	color: var(--gb-seve-texte);
}

/* ---------- 18. Anti-spam : champ piège invisible pour les humains ---------- */

.gb-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}