/* =================================================================
   Base : reset léger, typographie, éléments globaux.
   ================================================================= */

body {
	background: var(--gf-bg);
	color: var(--gf-ink);
	font-family: var(--gf-font-text);
	font-size: var(--gf-fs-base);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* Titres : serif éditorial */
h1, h2, h3, h4,
.gf-display {
	font-family: var(--gf-font-display);
	color: var(--gf-ink);
	line-height: 1.08;
	letter-spacing: -0.02em;
	font-weight: 600;
}

h1 { font-size: var(--gf-fs-h1); }
h2 { font-size: var(--gf-fs-h2); }
h3 { font-size: var(--gf-fs-h3); }

.gf-display {
	font-size: var(--gf-fs-display);
	letter-spacing: -0.035em;
}

p { max-width: var(--gf-maxw-text); }

a {
	color: var(--gf-brand);
	text-underline-offset: 0.18em;
	transition: color var(--gf-dur) var(--gf-ease);
}
a:hover { color: var(--gf-brand-ink); }

/* Eyebrow / étiquette mono technique */
.gf-eyebrow {
	font-family: var(--gf-font-mono);
	font-size: var(--gf-fs-xs);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--gf-muted);
	display: inline-flex;
	align-items: center;
	gap: var(--gf-space-2);
}
.gf-eyebrow::before {
	content: "";
	width: 1.6rem;
	height: 1px;
	background: var(--gf-line-strong);
}

/* Conteneur centré */
.gf-container {
	width: 100%;
	max-width: var(--gf-maxw);
	margin-inline: auto;
	padding-inline: var(--gf-section-x);
}

/* Rythme de section */
.gf-section {
	padding-block: var(--gf-section-y);
}
.gf-section--tint { background: var(--gf-bg-tint); }
.gf-section--ink {
	background: var(--gf-ink);
	color: var(--gf-bg);
}
.gf-section--ink h1,
.gf-section--ink h2,
.gf-section--ink h3 { color: var(--gf-bg); }

/* Lien d'évitement (accessibilité clavier) */
.gf-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--gf-ink);
	color: #fff;
	padding: var(--gf-space-3) var(--gf-space-4);
	z-index: 1000;
}
.gf-skip-link:focus { left: var(--gf-space-3); }

/* Focus visible homogène */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--gf-brand);
	outline-offset: 2px;
	border-radius: var(--gf-r-sm);
}

img { max-width: 100%; height: auto; }

/* Respect du mode mouvement réduit */
@media (prefers-reduced-motion: reduce) {
	* {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
	}
}