/* =====================================================
   Sportuna ES — design tokens
   TYPO-08 / SPACE-01 / CONT-08 / BP-06 / GEO-06 / MOTION-07
   ===================================================== */
:root {
	/* colors */
	--color-primary: #151249;
	--color-accent: #f7bc02;
	--color-accent-pressed: #d29c00;
	--color-bg: #1a132e;
	--color-bg-elevated: #221b39;
	--color-bg-deep: #110b22;
	--color-gradient-light: #ffffff;
	--color-gradient-mid: #74b121;
	--color-text: #ffffff;
	--color-text-muted: #c0bfbf;
	--color-border: rgba(255,255,255,0.10);
	--color-border-strong: rgba(255,255,255,0.18);
	--color-rg-banner: #dc2626;
	--color-success: #4ade80;

	/* typography */
	--font-display: 'Bebas Neue', 'Rubik', 'Inter', Helvetica, Arial, sans-serif;
	--font-body: 'Inter', Helvetica, Arial, sans-serif;
	--fs-base: 17px;
	--fs-sm: 14px;
	--fs-xs: 12px;
	--fs-md: 18px;
	--fs-lg: 22px;
	--fs-xl: 30px;
	--fs-2xl: 44px;
	--fs-3xl: 62px;
	--lh-tight: 1.15;
	--lh-body: 1.65;

	/* spacing (SPACE-01) */
	--space-3xs: 4px;
	--space-2xs: 8px;
	--space-xs: 12px;
	--space-sm: 16px;
	--space-md: 24px;
	--space-lg: 32px;
	--space-xl: 48px;
	--space-2xl: 72px;
	--space-3xl: 104px;

	/* container (CONT-08) */
	--container-site: 1160px;
	--container-readable: 710px;
	--container-padding: 24px;

	/* geometry (GEO-06) */
	--radius-sm: 6px;
	--radius-md: 10px;
	--radius-lg: 18px;
	--radius-pill: 999px;

	/* motion */
	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--dur: 220ms;

	/* header height */
	--header-h: 96px;
}

/* =====================================================
   Reset / base
   ===================================================== */
*,*::before,*::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: var(--fs-base);
	line-height: var(--lh-body);
	font-weight: 400;
	padding-top: var(--header-h);
	min-height: 100vh;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--color-accent); text-decoration: none; transition: color var(--dur) var(--ease); }
a:hover { color: var(--color-accent-pressed); }
h1,h2,h3,h4 { font-family: var(--font-display); letter-spacing: 0.01em; margin: 0; line-height: var(--lh-tight); font-weight: 700; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
button { font-family: inherit; cursor: pointer; }

.sr-only {
	position: absolute; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
	position: absolute; left: 16px; top: -200px !important;
	background: var(--color-accent); color: #111;
	padding: 12px 18px; border-radius: var(--radius-md);
	font-weight: 700; z-index: 1000;
}
.skip-link:focus { top: 12px !important; }

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}

/* =====================================================
   Header — HEAD-12 (.piazzetta-moderne)
   ===================================================== */
.piazzetta-moderne {
	position: fixed; top: 0; left: 0; right: 0; z-index: 100;
	background: rgba(17, 12, 38, 0.78);
	backdrop-filter: saturate(140%) blur(12px);
	-webkit-backdrop-filter: saturate(140%) blur(12px);
	border-bottom: 1px solid var(--color-border);
	transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.piazzetta-moderne.is-shrunk {
	background: rgba(13, 8, 30, 0.95);
	border-bottom-color: var(--color-border-strong);
}
.piazzetta-moderne-inner {
	max-width: 1440px;
	margin: 0 auto;
	padding-inline: var(--space-md);
	min-height: var(--header-h);
	display: flex; align-items: center; gap: var(--space-lg);
}
.piazzetta-moderne-brand {
	display: inline-flex; align-items: center; flex-shrink: 0;
}
.piazzetta-moderne-logo, .piazzetta-moderne-logo-img,
.piazzetta-moderne-brand { flex-shrink: 0; }
.piazzetta-moderne-logo-img {
	height: 88px; width: auto;
}
.piazzetta-moderne.is-shrunk .piazzetta-moderne-logo-img { height: 72px; }

.piazzetta-moderne-nav {
	flex: 1 1 auto;
	display: flex; justify-content: center;
}
.piazzetta-moderne-list {
	list-style: none;
	display: flex; flex-wrap: nowrap; align-items: center;
	gap: var(--space-md);
}
.piazzetta-moderne-item { white-space: nowrap; }
.piazzetta-moderne-link {
	color: var(--color-text);
	font-weight: 500;
	font-size: var(--fs-sm);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 8px 4px;
	border-bottom: 2px solid transparent;
	transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.piazzetta-moderne-link:hover { color: var(--color-accent); border-bottom-color: var(--color-accent); }
.piazzetta-moderne-link[aria-current='page'] { color: var(--color-accent); border-bottom-color: var(--color-accent); }

.piazzetta-moderne-toggle {
	display: none;
	background: transparent;
	border: 1px solid var(--color-border-strong);
	border-radius: var(--radius-md);
	width: 44px; height: 44px;
	margin-left: auto !important;
	flex-direction: column; justify-content: center; align-items: center;
	gap: 5px;
}
.piazzetta-moderne-toggle-bar {
	display: block; width: 22px; height: 2px;
	background: var(--color-text);
	transition: transform var(--dur) var(--ease), opacity var(--dur) var(--ease);
}

.piazzetta-moderne-mobile {
	display: none;
	border-top: 1px solid var(--color-border);
	background: rgba(13, 8, 30, 0.97);
	padding: var(--space-md) var(--space-md) var(--space-lg);
}
.piazzetta-moderne-mobile-list { list-style: none; display: flex; flex-direction: column; gap: var(--space-xs); }
.piazzetta-moderne-mobile-link {
	display: block;
	color: var(--color-text);
	font-weight: 500;
	padding: 12px 14px;
	border-radius: var(--radius-md);
	background: rgba(255,255,255,0.04);
}
.piazzetta-moderne-mobile-link[aria-current='page'] { background: rgba(247,188,2,0.14); color: var(--color-accent); }

@media (max-width: 1024px) {
	.piazzetta-moderne-nav { display: none; }
	.piazzetta-moderne-toggle { display: inline-flex; }
	.piazzetta-moderne.is-open .piazzetta-moderne-mobile { display: block; }
}
@media (max-width: 720px) {
	:root { --header-h: 76px; }
	.piazzetta-moderne-logo-img { height: 64px; }
	.piazzetta-moderne.is-shrunk .piazzetta-moderne-logo-img { height: 60px; }
}

/* =====================================================
   Hero — HERO-01 (.crucifix-prime)
   ===================================================== */
.crucifix-prime {
	background:
		radial-gradient(110% 80% at 85% 10%, rgba(116, 177, 33, 0.18), transparent 60%),
		radial-gradient(80% 60% at 10% 90%, rgba(21, 18, 73, 0.55), transparent 70%),
		linear-gradient(180deg, #110a25 0%, var(--color-bg) 100%);
	border-bottom: 1px solid var(--color-border);
}
.crucifix-prime-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: var(--space-3xl) var(--container-padding) var(--space-2xl);
	display: grid; gap: var(--space-2xl);
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	align-items: center;
}
.crucifix-prime-eyebrow {
	display: inline-block;
	font-family: var(--font-display);
	letter-spacing: 0.18em;
	color: var(--color-accent);
	text-transform: uppercase;
	font-size: var(--fs-xs);
	padding: 6px 14px;
	background: rgba(247,188,2,0.10);
	border: 1px solid rgba(247,188,2,0.25);
	border-radius: var(--radius-pill);
	margin-bottom: var(--space-md);
}
.crucifix-prime-h {
	font-size: clamp(36px, 5vw, var(--fs-3xl));
	letter-spacing: 0.005em;
	margin-bottom: var(--space-md);
	background: linear-gradient(180deg, #fff 0%, #fff 60%, rgba(247,188,2,0.85) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.crucifix-prime-subtitle {
	font-size: var(--fs-md);
	color: var(--color-text-muted);
	max-width: 580px;
	margin-bottom: var(--space-lg);
}
.crucifix-prime-actions { display: flex; flex-wrap: wrap; gap: var(--space-md); align-items: center; }
.crucifix-prime-cta {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--color-accent); color: #1a1300;
	padding: 14px 28px;
	border-radius: var(--radius-pill);
	font-weight: 700; font-size: var(--fs-md);
	letter-spacing: 0.02em;
	box-shadow: 0 8px 24px rgba(247,188,2,0.30);
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.crucifix-prime-cta:hover {
	background: var(--color-accent-pressed); color: #1a1300;
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(247,188,2,0.40);
}
.crucifix-prime-link {
	color: var(--color-text); font-weight: 500;
	border-bottom: 1px dashed var(--color-text-muted);
	padding-bottom: 2px;
}
.crucifix-prime-link:hover { color: var(--color-accent); border-bottom-color: var(--color-accent); }
.crucifix-prime-media {
	position: relative;
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: 0 30px 80px rgba(0,0,0,0.45);
	border: 1px solid var(--color-border);
}
.crucifix-prime-image { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 3/2; }

@media (max-width: 980px) {
	.crucifix-prime-inner { grid-template-columns: 1fr; padding-top: var(--space-2xl); padding-bottom: var(--space-xl); gap: var(--space-xl); }
	.crucifix-prime-h { font-size: 38px; }
}

/* =====================================================
   Page header — PHEAD-01 (.parure-raffine)
   ===================================================== */
.parure-raffine {
	background: linear-gradient(180deg, var(--color-bg-deep) 0%, var(--color-bg) 100%);
	border-bottom: 1px solid var(--color-border);
}
.parure-raffine-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: var(--space-2xl) var(--container-padding) var(--space-xl);
}
.parure-raffine-eyebrow {
	font-family: var(--font-display);
	color: var(--color-accent);
	font-size: var(--fs-sm);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	margin-bottom: var(--space-sm);
}
.parure-raffine-h {
	font-size: clamp(34px, 4.5vw, 54px);
	letter-spacing: 0.005em;
}

/* =====================================================
   Breadcrumbs — BREAD-05 (.receptacle-sombre)
   ===================================================== */
.receptacle-sombre {
	background: var(--color-bg-deep);
	border-bottom: 1px solid var(--color-border);
}
.receptacle-sombre-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 12px var(--container-padding);
}
.receptacle-sombre-list {
	list-style: none;
	display: flex; flex-wrap: wrap; align-items: center;
	gap: 6px;
	font-size: var(--fs-sm);
}
.receptacle-sombre-item { color: var(--color-text-muted); display: inline-flex; align-items: center; gap: 6px; }
.receptacle-sombre-item:not(:last-child)::after {
	content: '›'; color: var(--color-text-muted); margin-left: 4px;
}
.receptacle-sombre-item-current { color: var(--color-text); }
.receptacle-sombre-link { color: var(--color-text-muted); }
.receptacle-sombre-link:hover { color: var(--color-accent); }

/* =====================================================
   Prose — PROSE-03 (.monstrance-dru)
   ===================================================== */
.monstrance-dru {
	padding: var(--space-2xl) 0;
}
.monstrance-dru + .monstrance-dru { padding-top: 0; }
.monstrance-dru-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
}
.monstrance-dru-h {
	font-size: clamp(26px, 3vw, var(--fs-xl));
	letter-spacing: 0.005em;
	margin-bottom: var(--space-md);
	position: relative;
	padding-left: var(--space-md);
}
.monstrance-dru-h::before {
	content: ''; position: absolute; left: 0; top: 0.25em; bottom: 0.25em;
	width: 4px; background: var(--color-accent); border-radius: 2px;
}
.monstrance-dru-p {
	font-size: var(--fs-base);
	color: var(--color-text);
	max-width: var(--container-readable);
	margin-bottom: var(--space-md);
}
.monstrance-dru-p:last-child { margin-bottom: 0; }
.monstrance-dru-link { color: var(--color-accent); border-bottom: 1px dashed rgba(247,188,2,0.6); }
.monstrance-dru-link:hover { color: var(--color-accent-pressed); border-bottom-color: var(--color-accent-pressed); }
.monstrance-dru-p strong { color: #ffe89a; font-weight: 700; }
.monstrance-dru-ol, .monstrance-dru-ul {
	max-width: var(--container-readable);
	list-style-position: outside;
	padding-left: 22px;
	margin-bottom: var(--space-md);
	color: var(--color-text);
}
.monstrance-dru-ol li, .monstrance-dru-ul li {
	margin-bottom: var(--space-xs);
	padding-left: 6px;
}
.monstrance-dru-ol li::marker { color: var(--color-accent); font-weight: 700; }
.monstrance-dru-ul li::marker { color: var(--color-accent); }

/* =====================================================
   Items grid — GRID-04 (.prie-dieu-dru)
   ===================================================== */
.prie-dieu-dru {
	padding: var(--space-3xl) 0 var(--space-2xl);
	background: linear-gradient(180deg, var(--color-bg) 0%, var(--color-bg-deep) 100%);
}
.prie-dieu-dru-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
}
.prie-dieu-dru-h {
	font-size: clamp(28px, 3.5vw, 40px);
	margin-bottom: var(--space-xl);
	letter-spacing: 0.005em;
}
.prie-dieu-dru-grid {
	display: grid; gap: var(--space-md);
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}
.prie-dieu-dru-card {
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	padding: var(--space-lg);
	position: relative;
	transition: transform var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.prie-dieu-dru-card:hover {
	transform: translateY(-3px);
	border-color: rgba(247,188,2,0.4);
}
.prie-dieu-dru-num {
	display: inline-flex; align-items: center; justify-content: center;
	font-family: var(--font-display);
	font-size: var(--fs-lg);
	color: var(--color-bg);
	background: var(--color-accent);
	width: 40px; height: 40px;
	border-radius: var(--radius-md);
	margin-bottom: var(--space-md);
	font-weight: 700;
}
.prie-dieu-dru-card-h {
	font-size: var(--fs-lg);
	margin-bottom: var(--space-sm);
	color: var(--color-text);
}
.prie-dieu-dru-card-text {
	font-size: 15px;
	color: var(--color-text-muted);
	line-height: 1.6;
}

/* =====================================================
   Reviews — REV-08 (.ciboire-calme)
   ===================================================== */
.ciboire-calme {
	padding: var(--space-2xl) 0;
	background: var(--color-bg);
}
.ciboire-calme-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
}
.ciboire-calme-head {
	display: flex; align-items: baseline; justify-content: space-between;
	flex-wrap: wrap; gap: var(--space-md);
	margin-bottom: var(--space-xl);
}
.ciboire-calme-h {
	font-size: clamp(26px, 3vw, 38px);
	letter-spacing: 0.005em;
}
.ciboire-calme-avg {
	font-family: var(--font-display);
	color: var(--color-text-muted);
	font-size: var(--fs-md);
}
.ciboire-calme-avg-num {
	color: var(--color-accent);
	font-size: var(--fs-2xl);
	margin-right: 4px;
}
.ciboire-calme-grid {
	display: grid; gap: var(--space-md);
	grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
}
.ciboire-calme-card {
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-md) var(--space-lg);
}
.ciboire-calme-card-head {
	display: flex; align-items: center; justify-content: space-between;
	gap: var(--space-sm);
	margin-bottom: var(--space-sm);
}
.ciboire-calme-card-author {
	font-weight: 700; font-size: var(--fs-sm);
	color: var(--color-text);
}
.ciboire-calme-card-rating { display: inline-flex; gap: 2px; }
.ciboire-calme-star { color: rgba(255,255,255,0.18); font-size: var(--fs-sm); }
.ciboire-calme-star-full { color: var(--color-accent); }
.ciboire-calme-card-text { font-size: 15px; color: var(--color-text-muted); line-height: 1.55; }

/* =====================================================
   FAQ — FAQ-06 (.sanctuaire-bas)
   ===================================================== */
.sanctuaire-bas {
	padding: var(--space-2xl) 0;
	background: var(--color-bg-deep);
}
.sanctuaire-bas-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
}
.sanctuaire-bas-h {
	font-size: clamp(26px, 3vw, 38px);
	margin-bottom: var(--space-xl);
	letter-spacing: 0.005em;
}
.sanctuaire-bas-list { display: flex; flex-direction: column; gap: 10px; }
.sanctuaire-bas-item {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: rgba(255,255,255,0.02);
	overflow: hidden;
}
.sanctuaire-bas-q {
	display: flex; align-items: center; justify-content: space-between;
	width: 100%;
	background: transparent;
	border: 0;
	padding: var(--space-md) var(--space-lg);
	color: var(--color-text);
	font-size: var(--fs-md);
	font-weight: 600;
	text-align: left;
	gap: var(--space-md);
	transition: background var(--dur) var(--ease);
}
.sanctuaire-bas-q:hover { background: rgba(247,188,2,0.06); }
.sanctuaire-bas-q-text { flex: 1; }
.sanctuaire-bas-q-icon {
	display: inline-block;
	width: 18px; height: 18px;
	position: relative;
	flex-shrink: 0;
}
.sanctuaire-bas-q-icon::before,
.sanctuaire-bas-q-icon::after {
	content: ''; position: absolute; left: 0; top: 50%;
	width: 100%; height: 2px;
	background: var(--color-accent);
	transform: translateY(-50%);
	transition: transform var(--dur) var(--ease);
}
.sanctuaire-bas-q-icon::after { transform: translateY(-50%) rotate(90deg); }
.sanctuaire-bas-q[aria-expanded='true'] .sanctuaire-bas-q-icon::after { transform: translateY(-50%) rotate(0); }
.sanctuaire-bas-a {
	padding: 0 var(--space-lg) var(--space-md);
	color: var(--color-text-muted);
	font-size: 15.5px;
	line-height: 1.65;
}

/* =====================================================
   CTA — CTA-01 (.verriere-haut)
   ===================================================== */
.verriere-haut {
	padding: var(--space-2xl) 0;
	background:
		radial-gradient(80% 100% at 50% 0%, rgba(247,188,2,0.12), transparent 60%),
		var(--color-bg);
}
.verriere-haut-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: var(--space-2xl) var(--container-padding);
	text-align: center;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
}
.verriere-haut-h {
	font-size: clamp(28px, 3.5vw, 42px);
	margin-bottom: var(--space-md);
}
.verriere-haut-text {
	color: var(--color-text-muted);
	max-width: 700px;
	margin: 0 auto var(--space-lg);
	font-size: var(--fs-md);
}
.verriere-haut-button {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--color-accent); color: #1a1300;
	padding: 16px 36px;
	border-radius: var(--radius-pill);
	font-weight: 700; font-size: var(--fs-md);
	letter-spacing: 0.02em;
	box-shadow: 0 8px 24px rgba(247,188,2,0.32);
	transition: transform var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.verriere-haut-button:hover {
	background: var(--color-accent-pressed); color: #1a1300;
	transform: translateY(-2px);
}

/* =====================================================
   Byline — BYLINE-07 (.parterre-profond)
   ===================================================== */
.parterre-profond {
	padding: var(--space-xl) 0 var(--space-2xl);
}
.parterre-profond-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: var(--space-md) var(--container-padding);
	display: flex; align-items: center; gap: var(--space-md);
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	max-width: 860px;
	margin-inline: auto;
}
.parterre-profond-portrait {
	width: 72px; height: 72px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid rgba(247,188,2,0.6);
	flex-shrink: 0;
}
.parterre-profond-body { flex: 1; min-width: 0; }
.parterre-profond-by {
	font-family: var(--font-display);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin-bottom: 2px;
}
.parterre-profond-link {
	color: var(--color-accent);
	font-family: var(--font-body);
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	font-size: var(--fs-md);
}
.parterre-profond-link:hover { color: var(--color-accent-pressed); }
.parterre-profond-role { color: var(--color-text-muted); font-size: var(--fs-sm); margin-bottom: 4px; }
.parterre-profond-bio { color: var(--color-text); font-size: var(--fs-sm); line-height: 1.5; }

/* =====================================================
   Author card — AUTH-02 (.bosquet-sombre)
   ===================================================== */
.bosquet-sombre {
	padding: var(--space-3xl) 0 var(--space-2xl);
	background: linear-gradient(180deg, var(--color-bg-deep) 0%, var(--color-bg) 100%);
}
.bosquet-sombre-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
	display: grid;
	gap: var(--space-xl);
	grid-template-columns: 220px 1fr;
	align-items: start;
}
.bosquet-sombre-portrait {
	width: 220px; height: 220px;
	border-radius: var(--radius-lg);
	object-fit: cover;
	border: 1px solid var(--color-border);
}
.bosquet-sombre-name {
	font-size: clamp(34px, 4vw, 48px);
	margin-bottom: var(--space-2xs);
	letter-spacing: 0.005em;
}
.bosquet-sombre-role {
	color: var(--color-accent);
	font-family: var(--font-display);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: var(--space-md);
	font-size: var(--fs-sm);
}
.bosquet-sombre-bio { color: var(--color-text); max-width: 700px; margin-bottom: var(--space-md); font-size: var(--fs-md); }
.bosquet-sombre-skills-h { font-size: var(--fs-md); margin-bottom: var(--space-sm); font-family: var(--font-body); font-weight: 700; }
.bosquet-sombre-skills {
	list-style: none;
	display: flex; flex-wrap: wrap; gap: 8px;
}
.bosquet-sombre-skill {
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-pill);
	padding: 6px 14px;
	font-size: var(--fs-sm);
	color: var(--color-text);
}
.bosquet-sombre-articles {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: var(--space-xl) auto 0;
	padding: 0 var(--container-padding);
}
.bosquet-sombre-articles-heading {
	font-size: clamp(22px, 2.6vw, 30px);
	margin-bottom: var(--space-md);
}
.bosquet-sombre-articles-list {
	list-style: none;
	display: grid; gap: var(--space-sm);
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}
.bosquet-sombre-articles-item {
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	padding: var(--space-md) var(--space-lg);
}
.bosquet-sombre-articles-link { color: var(--color-text); font-weight: 600; }
.bosquet-sombre-articles-link:hover { color: var(--color-accent); }

@media (max-width: 720px) {
	.bosquet-sombre-inner { grid-template-columns: 1fr; }
	.bosquet-sombre-portrait { width: 160px; height: 160px; margin-inline: auto; }
}

/* =====================================================
   Legal — LEGAL-05 (.pavois-sombre)
   ===================================================== */
.pavois-sombre {
	padding: var(--space-xl) 0 var(--space-2xl);
}
.pavois-sombre-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
}
.pavois-sombre-intro {
	max-width: var(--container-readable);
	color: var(--color-text-muted);
	margin-bottom: var(--space-lg);
	font-size: var(--fs-md);
}
.pavois-sombre-section { margin-bottom: var(--space-xl); }
.pavois-sombre-h {
	font-size: clamp(22px, 2.6vw, 28px);
	margin-bottom: var(--space-md);
	padding-bottom: var(--space-xs);
	border-bottom: 1px solid var(--color-border);
}
.pavois-sombre-p {
	max-width: var(--container-readable);
	color: var(--color-text);
	margin-bottom: var(--space-md);
}
.pavois-sombre-list {
	max-width: var(--container-readable);
	list-style: disc;
	padding-left: 22px;
	color: var(--color-text);
}
.pavois-sombre-list li { margin-bottom: var(--space-xs); }
.pavois-sombre-disclaimer {
	max-width: var(--container-readable);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	padding: var(--space-md);
	border-left: 3px solid var(--color-accent);
	background: rgba(255,255,255,0.02);
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

/* =====================================================
   Contact form — FORM-02 (.amphitheatre-dru)
   ===================================================== */
.amphitheatre-dru {
	padding: var(--space-xl) 0 var(--space-2xl);
}
.amphitheatre-dru-inner {
	max-width: 780px;
	margin: 0 auto;
	padding: 0 var(--container-padding);
}
.amphitheatre-dru-intro { color: var(--color-text-muted); margin-bottom: var(--space-lg); font-size: var(--fs-md); }
.amphitheatre-dru-form {
	background: var(--color-bg-elevated);
	padding: var(--space-xl);
	border-radius: var(--radius-lg);
	border: 1px solid var(--color-border);
}
.amphitheatre-dru-field { display: flex; flex-direction: column; margin-bottom: var(--space-md); }
.amphitheatre-dru-label {
	font-weight: 600;
	font-size: var(--fs-sm);
	color: var(--color-text);
	margin-bottom: 6px;
}
.amphitheatre-dru-input {
	background: rgba(0,0,0,0.25);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	color: var(--color-text);
	font-family: inherit;
	font-size: var(--fs-base);
	padding: 12px 14px;
	transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease);
	resize: vertical;
}
.amphitheatre-dru-input:focus {
	outline: 0; border-color: var(--color-accent);
	background: rgba(0,0,0,0.35);
}
.amphitheatre-dru-submit {
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--color-accent); color: #1a1300;
	padding: 14px 32px;
	border: 0;
	border-radius: var(--radius-pill);
	font-weight: 700; font-size: var(--fs-md);
	cursor: pointer;
	transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.amphitheatre-dru-submit:hover { background: var(--color-accent-pressed); color: #1a1300; }
.amphitheatre-dru-success {
	margin-top: var(--space-md);
	padding: var(--space-md);
	border-radius: var(--radius-md);
	background: rgba(74,222,128,0.10);
	border: 1px solid rgba(74,222,128,0.4);
	color: var(--color-success);
}

/* =====================================================
   Error — ERR-07 (.baldaquin-dru)
   ===================================================== */
.baldaquin-dru {
	padding: var(--space-3xl) 0;
	background:
		radial-gradient(60% 60% at 50% 30%, rgba(247,188,2,0.12), transparent 70%),
		var(--color-bg);
	text-align: center;
}
.baldaquin-dru-inner {
	max-width: 720px;
	margin: 0 auto;
	padding: var(--space-2xl) var(--container-padding);
}
.baldaquin-dru-code {
	font-family: var(--font-display);
	font-size: clamp(80px, 14vw, 160px);
	color: var(--color-accent);
	line-height: 1;
	margin-bottom: var(--space-md);
}
.baldaquin-dru-h { font-size: clamp(28px, 3.6vw, 40px); margin-bottom: var(--space-md); }
.baldaquin-dru-text { color: var(--color-text-muted); margin-bottom: var(--space-lg); font-size: var(--fs-md); }
.baldaquin-dru-button {
	display: inline-flex;
	background: var(--color-accent); color: #1a1300;
	padding: 14px 32px;
	border-radius: var(--radius-pill);
	font-weight: 700;
	transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.baldaquin-dru-button:hover { background: var(--color-accent-pressed); color: #1a1300; }

/* =====================================================
   Figures (per-page images)
   ===================================================== */
.figures {
	padding: var(--space-md) 0 var(--space-xl);
}
.figures-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
	display: grid;
	gap: var(--space-md);
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.figure { margin: 0; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--color-border); }
.figure-img { width: 100%; height: auto; display: block; }
.figure-context { grid-column: 1 / -1; max-height: 480px; overflow: hidden; }
.figure-context .figure-img { object-fit: cover; max-height: 480px; }

/* =====================================================
   Footer — FOOT-08 (.presbytere-robuste) — editorial/masthead
   ===================================================== */
.presbytere-robuste {
	background: var(--color-bg-deep);
	border-top: 1px solid var(--color-border-strong);
	padding: var(--space-2xl) 0 var(--space-lg);
}
.presbytere-robuste-inner {
	max-width: calc(var(--container-site) + 2 * var(--container-padding));
	margin: 0 auto;
	padding: 0 var(--container-padding);
}
.presbytere-robuste-masthead {
	display: flex; align-items: center; justify-content: center;
	flex-wrap: wrap;
	gap: 12px;
	padding-bottom: var(--space-md);
	margin-bottom: var(--space-xl);
	border-bottom: 1px solid var(--color-border);
	font-family: var(--font-display);
	font-size: var(--fs-sm);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-text-muted);
}
.presbytere-robuste-masthead-name { color: var(--color-accent); }
.presbytere-robuste-masthead-sep { color: var(--color-border-strong); }
.presbytere-robuste-grid {
	display: grid; gap: var(--space-xl);
	grid-template-columns: 1.4fr 1fr 1fr;
}
.presbytere-robuste-col-brand .presbytere-robuste-brand { display: inline-flex; margin-bottom: var(--space-md); }
.presbytere-robuste-logo-img { height: 80px; width: auto; }
.presbytere-robuste-tagline { color: var(--color-text); font-size: 15px; margin-bottom: var(--space-sm); max-width: 360px; }
.presbytere-robuste-rg { color: var(--color-text-muted); font-size: var(--fs-sm); }
.presbytere-robuste-h {
	font-family: var(--font-display);
	font-size: var(--fs-sm);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--color-accent);
	margin-bottom: var(--space-md);
	font-weight: 700;
}
.presbytere-robuste-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.presbytere-robuste-link { color: var(--color-text); font-size: 15px; transition: color var(--dur) var(--ease); }
.presbytere-robuste-link:hover { color: var(--color-accent); }
.presbytere-robuste-bottom {
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--space-sm);
	padding-top: var(--space-md);
	margin-top: var(--space-xl);
	border-top: 1px solid var(--color-border);
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
}

@media (max-width: 860px) {
	.presbytere-robuste-grid { grid-template-columns: 1fr; }
}

/* =====================================================
   Cookie banner — COOK-03 (.estafette-bas)
   ===================================================== */
.estafette-bas {
	position: fixed; left: 16px; right: 16px; bottom: 16px;
	max-width: 1100px; margin: 0 auto;
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border-strong);
	border-radius: var(--radius-lg);
	box-shadow: 0 18px 50px rgba(0,0,0,0.55);
	z-index: 90;
}
.estafette-bas-inner {
	display: flex; align-items: center;
	gap: var(--space-md);
	padding: var(--space-md) var(--space-lg);
	flex-wrap: wrap;
}
.estafette-bas-message { flex: 1 1 360px; font-size: var(--fs-sm); color: var(--color-text); }
.estafette-bas-actions { display: flex; gap: 10px; flex-shrink: 0; }
.estafette-bas-button {
	border: 1px solid var(--color-border-strong);
	background: transparent;
	color: var(--color-text);
	padding: 10px 18px;
	border-radius: var(--radius-pill);
	font-weight: 600;
	font-size: var(--fs-sm);
	transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.estafette-bas-button-accept {
	background: var(--color-accent); color: #1a1300; border-color: var(--color-accent);
}
.estafette-bas-button-accept:hover { background: var(--color-accent-pressed); color: #1a1300; border-color: var(--color-accent-pressed); }
.estafette-bas-button-decline:hover { background: rgba(255,255,255,0.08); color: var(--color-text); }

@media (max-width: 720px) {
	.estafette-bas, .estafette-bas-inner {
		padding: 12px 14px !important;
		gap: 8px !important;
		font-size: 13px !important;
		line-height: 1.35 !important;
	}
	.estafette-bas-button, .estafette-bas button {
		padding: 8px 14px !important;
		font-size: 12px !important;
		min-height: 36px !important;
	}
}