/* ============================================================
   Nitro Casino — panel-55.css
   Tokens: TYPO-03 · SPACE-06 · CONT-04 · BP-05 · GEO-02 · MOTION-01
   ============================================================ */

/* --- Design tokens --- */
:root {
	--bs-main-color: #1b1a1a;
	--bs-accent-color: #f85d00;
	--bs-accent-active: #d34d00;
	--bs-color-accent-hover: #ff7a2e;
	--bs-canvas: #1e1e1e;
	--bs-panel-bg: #262626;
	--bs-color-bg-sunken: #171717;
	--bs-gradient-start: #ffffff;
	--bs-gradient-mid: #fb4801;
	--bs-text: #ffffff;
	--bs-fg-muted: #bdbdbd;
	--bs-warning-bg: #dc2626;
	--bs-color-line: rgba(255, 255, 255, 0.10);
	--bs-color-line-soft: rgba(255, 255, 255, 0.06);

	--bs-font-heading: 'Rubik', system-ui, -apple-system, Segoe UI, sans-serif;
	--bs-font-base: 'Rubik', system-ui, -apple-system, Segoe UI, sans-serif;
	--bs-font-normal: 400;
	--bs-weight-medium: 500;
	--bs-fw-bold: 700;
	--bs-fw-black: 900;

	/* TYPO-03 desktop */
	--bs-size-h1: 80px;
	--bs-text-h2: 48px;
	--bs-fs-h3: 30px;
	--bs-type-h4: 22px;
	--bs-size-h5: 16px;
	--bs-text-h6: 13px;
	--bs-type-body: 15px;
	--bs-fs-small: 13px;
	--bs-text-xs: 11px;
	--bs-leading-tight: 0.98;
	--bs-leading-normal: 1.45;
	--bs-line-loose: 1.7;
	--bs-letter-tight: -0.03em;
	--bs-ls-normal: 0;
	--bs-letter-wide: 0.08em;

	/* SPACE-06 Industrial Hard */
	--bs-gutter-2xs: 4px;
	--bs-spacing-xs: 12px;
	--bs-gutter-sm: 20px;
	--bs-spacing-md: 36px;
	--bs-spacing-lg: 56px;
	--bs-gutter-xl: 84px;
	--bs-gap-2xl: 120px;
	--bs-space-3xl: 180px;

	/* CONT-04 */
	--bs-wrapper: 1120px;
	--bs-readable-width: 620px;
	--bs-edge-desktop: 24px;
	--bs-edge-mobile: 16px;

	/* BP-05 */
	--bs-bp-sm: 460px;
	--bs-bp-md: 720px;
	--bs-bp-lg: 1040px;
	--bs-bp-xl: 1380px;

	/* GEO-02 Soft Universal */
	--bs-corner-xs: 4px;
	--bs-radius-sm: 8px;
	--bs-corner: 12px;
	--bs-corner-lg: 20px;
	--bs-pill: 9999px;
	--bs-round-circle: 50%;
	--bs-depth-sm: 0 2px 6px rgba(0, 0, 0, 0.20);
	--bs-shade-md: 0 6px 18px rgba(0, 0, 0, 0.30);
	--bs-shade-lg: 0 12px 32px rgba(0, 0, 0, 0.40);
	--bs-border-width: 1px;
	--bs-border-medium: 2px;

	/* MOTION-01 Static Strict */
	--bs-transition-fast: 120ms;
	--bs-speed-base: 150ms;
	--bs-duration-slow: 200ms;
	--bs-easing: cubic-bezier(0.25, 0.46, 0.45, 0.94);

	--bs-header-h: 118px;
	--bs-header-h-mobile: 80px;
	--bs-sec-y: 50px;
}

/* --- Reset / base --- */
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--bs-font-base);
	font-size: var(--bs-type-body);
	line-height: var(--bs-leading-normal);
	font-weight: var(--bs-font-normal);
	color: var(--bs-text);
	background: var(--bs-canvas);
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--bs-accent-color); text-decoration: none; }
a:hover { color: var(--bs-color-accent-hover); }
h1, h2, h3, h4, h5, h6 { margin: 0; }
p { margin: 0; }
ul, ol { margin: 0; }
button { font-family: inherit; cursor: pointer; }

/* --- a11y --- */
.skip-link {
	position: absolute;
	left: var(--bs-gutter-sm);
	top: -200px;
	z-index: 200;
	background: var(--bs-accent-color);
	color: var(--bs-canvas);
	padding: 10px 16px;
	border-radius: var(--bs-corner);
	font-weight: var(--bs-fw-bold);
}
.skip-link:not(:focus) { top: -200px !important; }
.skip-link:focus { top: var(--bs-gutter-sm); }
.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;
}
:focus-visible { outline: 2px solid var(--bs-accent-color); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
	* { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* --- shared inner wrappers (single site width) --- */
.trellis-keen-inner, .coffre-fast-inner, .chambre-fluid-inner, .plinth-fine-inner,
.planche-swift-inner, .repere-grave-inner, .arbor-opus-inner, .chambre-sleek-inner,
.arbor-plus-inner, .pignon-true-inner, .window-neat-inner, .console-clean-inner,
.cresset-fast-inner, .placard-clean-inner, .vitrail-noble-inner, .page-media-inner,
.socle-neat-inner, .comptoir-warm-inner {
	width: 100%;
	max-width: calc(var(--bs-wrapper) + 2 * var(--bs-edge-desktop));
	margin-inline: auto;
	padding-inline: var(--bs-edge-desktop);
}
/* prose + legal text kept to a comfortable centered reading measure inside the site-width frame */
.comptoir-warm-heading, .comptoir-warm p, .comptoir-warm ul, .comptoir-warm ol { max-width: var(--bs-readable-width); margin-inline: auto; }
.socle-neat-intro, .socle-neat-list, .socle-neat-disclaimer, .socle-neat-extra { max-width: 760px; }

/* --- shared button --- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--bs-font-heading);
	font-weight: var(--bs-fw-black);
	font-size: var(--bs-fs-small);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-wide);
	color: var(--bs-canvas);
	background: var(--bs-accent-color);
	border: none;
	border-radius: var(--bs-corner);
	padding: 0 var(--bs-spacing-lg);
	min-height: 52px;
	transition: background var(--bs-transition-fast) var(--bs-easing), color var(--bs-transition-fast) var(--bs-easing);
}
.btn:hover { background: var(--bs-color-accent-hover); color: var(--bs-canvas); }
.btn:active { background: var(--bs-accent-active); color: var(--bs-canvas); }

/* ============================================================
   HEADER — HEAD-04 · STICKY-02 · NAV-02 · AUTH-REGISTER
   ============================================================ */
.trellis-keen {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--bs-canvas);
	border-bottom: var(--bs-border-width) solid var(--bs-color-line);
	transition: padding var(--bs-speed-base) var(--bs-easing);
}
.trellis-keen-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--bs-spacing-md);
	padding-block: 15px;
}
.trellis-keen.is-shrunk .trellis-keen-inner { padding-block: 8px; }

.trellis-keen-logo { flex-shrink: 0; display: inline-flex; }
.trellis-keen-logo-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #ffffff;
	padding: 5px 12px;
	border-radius: var(--bs-corner);
}
.trellis-keen-logo-img {
	height: 88px;
	width: auto;
	flex-shrink: 0;
	transition: height var(--bs-speed-base) var(--bs-easing);
}
.trellis-keen.is-shrunk .trellis-keen-logo-img { height: 68px; }

.trellis-keen-nav { display: flex; }
.trellis-keen-item { display: inline-flex; align-items: center; }
.trellis-keen-list {
	display: flex;
	align-items: center;
	gap: var(--bs-gutter-sm);
	list-style: none;
	padding: 0;
}
.trellis-keen-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: var(--bs-font-base);
	font-size: var(--bs-fs-small);
	font-weight: var(--bs-weight-medium);
	color: var(--bs-fg-muted);
	background: none;
	border: none;
	padding: 6px 2px;
	transition: color var(--bs-transition-fast) var(--bs-easing);
}
.trellis-keen-link:hover { color: var(--bs-text); }
.trellis-keen-item[aria-current='page'] > .trellis-keen-link,
.trellis-keen-link[aria-current='page'] { color: var(--bs-accent-color); }

.trellis-keen-item--more { position: relative; }
.trellis-keen-more-chevron { font-size: 10px; transition: transform var(--bs-transition-fast) var(--bs-easing); }
.trellis-keen-more-toggle[aria-expanded='true'] .trellis-keen-more-chevron { transform: rotate(180deg); }
.trellis-keen-more-menu {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	min-width: 210px;
	background: var(--bs-panel-bg);
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-radius: var(--bs-corner);
	box-shadow: var(--bs-shade-md);
	padding: var(--bs-spacing-xs) 0;
	list-style: none;
	margin: 0;
}
.trellis-keen-more-menu[hidden] { display: none; }
.trellis-keen-more-menu.is-open { display: block; }
.trellis-keen-more-link {
	display: block;
	padding: 10px var(--bs-spacing-md);
	font-size: var(--bs-fs-small);
	color: var(--bs-fg-muted);
	transition: background var(--bs-transition-fast) var(--bs-easing), color var(--bs-transition-fast) var(--bs-easing);
}
.trellis-keen-more-link:hover { background: rgba(255, 255, 255, 0.05); color: var(--bs-text); }

.trellis-keen-auth { flex-shrink: 0; }
.trellis-keen-auth-btn {
	white-space: nowrap;
	flex-shrink: 0;
	padding-inline: var(--bs-spacing-lg);
	min-height: 44px;
}

.trellis-keen-toggle {
	display: none;
	margin-left: auto;
	background: none;
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-radius: var(--bs-radius-sm);
	color: var(--bs-text);
	width: 46px;
	height: 46px;
	align-items: center;
	justify-content: center;
}
.trellis-keen-toggle svg { width: 22px; height: 22px; }

.trellis-keen-mobile {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: var(--bs-canvas);
	border-top: var(--bs-border-width) solid var(--bs-color-line);
	box-shadow: var(--bs-shade-lg);
	padding: var(--bs-gutter-sm) var(--bs-edge-mobile) var(--bs-spacing-md);
}
.trellis-keen-mobile.is-open { display: block; }
.trellis-keen-mobile-list { list-style: none; padding: 0; margin: 0; }
.trellis-keen-mobile-list li { border-bottom: var(--bs-border-width) solid var(--bs-color-line-soft); }
.trellis-keen-mobile-link {
	display: block;
	padding: 14px 4px;
	font-size: var(--bs-size-h5);
	color: var(--bs-text);
	font-weight: var(--bs-weight-medium);
}
.trellis-keen-mobile-link[aria-current='page'] { color: var(--bs-accent-color); }
.trellis-keen-mobile-cta { margin-top: var(--bs-spacing-md); width: 100%; }

/* ============================================================
   HERO — HERO-07 (top tile + text below)
   ============================================================ */
.chambre-fluid { padding-bottom: var(--bs-sec-y); }
.chambre-fluid-figure {
	margin: 0;
	width: 100%;
	height: 420px;
	position: relative;
	overflow: hidden;
	background: var(--bs-color-bg-sunken);
}
.chambre-fluid-figure img { width: 100%; height: 100%; object-fit: cover; }
.chambre-fluid-figure::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(30, 30, 30, 0) 45%, var(--bs-canvas) 100%);
}
.chambre-fluid-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	max-width: 820px;
	margin-inline: auto;
	padding: var(--bs-gutter-xl) var(--bs-edge-desktop) 0;
}
.chambre-fluid-eyebrow {
	font-family: var(--bs-font-base);
	font-size: var(--bs-text-h6);
	font-weight: var(--bs-fw-bold);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-wide);
	color: var(--bs-accent-color);
	margin-bottom: var(--bs-gutter-sm);
}
.chambre-fluid-title {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-size-h1);
	font-weight: var(--bs-fw-black);
	line-height: var(--bs-leading-tight);
	letter-spacing: var(--bs-letter-tight);
	text-transform: uppercase;
	color: var(--bs-text);
}
.chambre-fluid-subtitle {
	font-size: var(--bs-size-h5);
	line-height: var(--bs-line-loose);
	color: var(--bs-fg-muted);
	margin-top: var(--bs-spacing-md);
	max-width: 640px;
}
.chambre-fluid-cta { margin-top: var(--bs-spacing-lg); }

/* ============================================================
   PAGE-HEADER — PHEAD-06 (subtle editorial)
   ============================================================ */
.plinth-fine { padding-block: var(--bs-sec-y); }
.plinth-fine-inner { display: flex; flex-direction: column; gap: var(--bs-spacing-md); }
.plinth-fine-divider { width: 44px; height: 2px; background: var(--bs-accent-color); }
.plinth-fine-title {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-size-h1);
	font-weight: var(--bs-fw-black);
	line-height: var(--bs-leading-tight);
	letter-spacing: var(--bs-letter-tight);
	text-transform: uppercase;
	color: var(--bs-text);
	max-width: 920px;
}
.plinth-fine-description {
	font-size: var(--bs-size-h5);
	line-height: var(--bs-leading-normal);
	color: var(--bs-fg-muted);
	max-width: 700px;
	font-style: italic;
}

/* ============================================================
   BREADCRUMBS — BREAD-06 (background bar)
   ============================================================ */
.pignon-true { background: var(--bs-panel-bg); border-bottom: var(--bs-border-width) solid var(--bs-color-line-soft); }
.pignon-true-inner { padding-block: var(--bs-gutter-sm); }
.pignon-true-list { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bs-spacing-xs); list-style: none; padding: 0; margin: 0; }
.pignon-true-item { display: inline-flex; align-items: center; gap: var(--bs-spacing-xs); font-size: var(--bs-fs-small); }
.pignon-true-item:not(:last-child)::after { content: '/'; color: var(--bs-fg-muted); }
.pignon-true-item a { color: var(--bs-fg-muted); }
.pignon-true-item a:hover { color: var(--bs-accent-color); text-decoration: underline; }
.pignon-true-item--current span { color: var(--bs-text); }

/* ============================================================
   PROSE — PROSE-04 (drop-cap magazine)
   ============================================================ */
.comptoir-warm { padding-block: var(--bs-sec-y); }
.comptoir-warm-heading {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-text-h2);
	font-weight: var(--bs-fw-bold);
	line-height: var(--bs-leading-tight);
	letter-spacing: var(--bs-letter-tight);
	text-transform: uppercase;
	color: var(--bs-text);
	margin-top: var(--bs-gutter-xl);
	margin-bottom: var(--bs-spacing-md);
}
.comptoir-warm-inner > .comptoir-warm-heading:first-child { margin-top: 0; }
.comptoir-warm p {
	font-size: var(--bs-type-body);
	line-height: var(--bs-line-loose);
	color: var(--bs-text);
	margin-bottom: var(--bs-spacing-md);
}
.comptoir-warm-heading + p::first-letter {
	font-family: var(--bs-font-heading);
	font-weight: var(--bs-fw-black);
	font-size: 3.6em;
	line-height: 0.8;
	float: left;
	margin-right: 0.10em;
	margin-top: 0.06em;
	color: var(--bs-accent-color);
}
.comptoir-warm ul, .comptoir-warm ol { margin: 0 0 var(--bs-spacing-md); padding-left: 1.4em; }
.comptoir-warm li { font-size: var(--bs-type-body); line-height: var(--bs-line-loose); color: var(--bs-text); margin-bottom: var(--bs-gutter-2xs); }
.comptoir-warm a { color: var(--bs-accent-color); text-decoration: underline; text-underline-offset: 3px; }
.comptoir-warm a:hover { color: var(--bs-color-accent-hover); }
.comptoir-warm strong { font-weight: var(--bs-fw-bold); color: var(--bs-text); }

/* ============================================================
   PAGE MEDIA (per-page images)
   ============================================================ */
.page-media { padding-block: var(--bs-sec-y); }
.page-media-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--bs-spacing-md);
}
.page-media-figure { margin: 0; }
.page-media-figure img {
	width: 100%;
	height: 340px;
	object-fit: cover;
	border-radius: var(--bs-corner-lg);
	border: var(--bs-border-width) solid var(--bs-color-line);
}

/* ============================================================
   ITEMS GRID — GRID-12 (tape-list initial)
   ============================================================ */
.planche-swift { padding-block: var(--bs-sec-y); }
.planche-swift-heading, .repere-grave-heading, .arbor-opus-heading, .arbor-plus-heading {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-text-h2);
	font-weight: var(--bs-fw-bold);
	line-height: var(--bs-leading-tight);
	letter-spacing: var(--bs-letter-tight);
	text-transform: uppercase;
	color: var(--bs-text);
	margin-bottom: var(--bs-spacing-lg);
}
.planche-swift-list { list-style: none; padding: 0; margin: 0; }
.planche-swift-item {
	display: flex;
	gap: var(--bs-spacing-lg);
	align-items: flex-start;
	padding: var(--bs-spacing-lg) 0;
	border-bottom: var(--bs-border-width) solid var(--bs-color-line);
}
.planche-swift-item:last-child { border-bottom: none; }
.planche-swift-initial {
	flex-shrink: 0;
	width: 96px;
	height: 96px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--bs-accent-color);
	color: var(--bs-canvas);
	border-radius: var(--bs-corner);
	font-family: var(--bs-font-heading);
	font-weight: var(--bs-fw-black);
	font-size: 52px;
	line-height: 1;
}
.planche-swift-content { flex: 1; }
.planche-swift-title {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-type-h4);
	font-weight: var(--bs-fw-bold);
	color: var(--bs-text);
	margin-bottom: var(--bs-spacing-xs);
}
.planche-swift-text { font-size: var(--bs-type-body); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); }

/* ============================================================
   FAQ — FAQ-03 (two-column cards, always open)
   ============================================================ */
.repere-grave { padding-block: var(--bs-sec-y); }
.repere-grave-list { display: grid; grid-template-columns: 1fr 1fr; gap: var(--bs-spacing-md); }
.repere-grave-item {
	padding: var(--bs-spacing-lg);
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-radius: var(--bs-corner);
	background: var(--bs-panel-bg);
}
.repere-grave-question { font-size: var(--bs-size-h5); font-weight: var(--bs-fw-bold); color: var(--bs-text); margin-bottom: var(--bs-gutter-sm); text-transform: none; letter-spacing: 0; }
.repere-grave-prefix { font-family: var(--bs-font-heading); font-weight: var(--bs-fw-black); color: var(--bs-accent-color); margin-right: 6px; }
.repere-grave-answer { font-size: var(--bs-type-body); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); }

/* ============================================================
   REVIEWS — REV-03 (horizontal carousel)
   ============================================================ */
.arbor-opus { padding-block: var(--bs-sec-y); }
.arbor-opus-rail {
	display: flex;
	gap: var(--bs-spacing-md);
	overflow-x: auto;
	padding-block: var(--bs-gutter-sm);
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}
.arbor-opus-card {
	flex: 0 0 360px;
	max-width: 360px;
	min-height: 230px;
	scroll-snap-align: start;
	padding: var(--bs-spacing-lg);
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-radius: var(--bs-corner);
	background: var(--bs-panel-bg);
	display: flex;
	flex-direction: column;
}
.arbor-opus-card-header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: var(--bs-gutter-sm); }
.arbor-opus-author { font-size: var(--bs-type-body); font-weight: var(--bs-fw-bold); color: var(--bs-text); }
.arbor-opus-date { font-size: var(--bs-text-xs); color: var(--bs-fg-muted); }
.arbor-opus-rating { margin-bottom: var(--bs-gutter-sm); }
.arbor-opus-rating-text { font-size: var(--bs-fs-small); color: var(--bs-fg-muted); display: block; margin-bottom: 6px; }
.arbor-opus-rating-bar { height: 4px; border-radius: var(--bs-pill); background: rgba(255, 255, 255, 0.14); overflow: hidden; }
.arbor-opus-rating-fill { height: 100%; background: var(--bs-accent-color); border-radius: var(--bs-pill); }
.arbor-opus-text { font-size: var(--bs-type-body); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); }
.arbor-opus-indicators { display: flex; justify-content: center; gap: var(--bs-gutter-sm); margin-top: var(--bs-spacing-md); }
.arbor-opus-dot { width: 10px; height: 10px; border-radius: var(--bs-round-circle); border: none; background: rgba(255, 255, 255, 0.25); padding: 0; }
.arbor-opus-dot[aria-current='true'] { background: var(--bs-accent-color); }

/* ============================================================
   DATA TABLE — TABLE-05 (compact dense)
   ============================================================ */
.arbor-plus { padding-block: var(--bs-sec-y); }
.arbor-plus-scroll { overflow-x: auto; border: var(--bs-border-width) solid var(--bs-color-line); border-radius: var(--bs-corner); }
.arbor-plus-table { width: 100%; border-collapse: collapse; min-width: 560px; }
.arbor-plus-table thead th {
	background: var(--bs-panel-bg);
	padding: var(--bs-gutter-sm);
	text-align: left;
	font-size: var(--bs-text-xs);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-wide);
	font-weight: var(--bs-fw-bold);
	color: var(--bs-text);
	border-bottom: var(--bs-border-width) solid var(--bs-color-line);
}
.arbor-plus-table tbody td {
	padding: var(--bs-spacing-xs) var(--bs-gutter-sm);
	font-size: var(--bs-fs-small);
	border-bottom: var(--bs-border-width) solid var(--bs-color-line-soft);
	color: var(--bs-fg-muted);
}
.arbor-plus-table tbody td:first-child { color: var(--bs-text); font-weight: var(--bs-weight-medium); }
.arbor-plus-table tbody tr:hover td { background: rgba(255, 255, 255, 0.04); }

/* ============================================================
   CTA BLOCK — CTA-02 (centered box)
   ============================================================ */
.chambre-sleek { padding-block: var(--bs-sec-y); }
.chambre-sleek-box {
	max-width: 760px;
	margin-inline: auto;
	text-align: center;
	background: linear-gradient(135deg, rgba(248, 93, 0, 0.10), rgba(27, 26, 26, 0.6));
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-radius: var(--bs-corner-lg);
	padding: var(--bs-gutter-xl) var(--bs-spacing-lg);
}
.chambre-sleek-title {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-text-h2);
	font-weight: var(--bs-fw-bold);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-tight);
	color: var(--bs-text);
}
.chambre-sleek-description { font-size: var(--bs-type-body); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); margin-block: var(--bs-spacing-md); }

/* ============================================================
   INLINE CTA — INLINE-CTA-05 (quote banner)
   ============================================================ */
.window-neat { background: var(--bs-panel-bg); padding-block: var(--bs-sec-y); }
.window-neat-inner { display: flex; flex-direction: column; align-items: center; gap: var(--bs-spacing-md); text-align: center; }
.window-neat-quote {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-fs-h3);
	font-style: italic;
	color: var(--bs-text);
	margin: 0;
	max-width: 720px;
}
.window-neat-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: var(--bs-border-medium) solid var(--bs-accent-color);
	color: var(--bs-accent-color);
	font-family: var(--bs-font-heading);
	font-weight: var(--bs-fw-black);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-wide);
	font-size: var(--bs-fs-small);
	padding: 14px var(--bs-gutter-xl);
	border-radius: var(--bs-corner);
	transition: background var(--bs-transition-fast) var(--bs-easing), color var(--bs-transition-fast) var(--bs-easing);
}
.window-neat-btn:hover { background: var(--bs-accent-color); color: var(--bs-canvas); }

/* ============================================================
   AUTHOR BYLINE — BYLINE-05 (horizontal bar)
   ============================================================ */
.console-clean { background: var(--bs-main-color); padding-block: var(--bs-sec-y); }
.console-clean-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--bs-spacing-md); }
.console-clean-author-info { display: flex; align-items: center; gap: var(--bs-spacing-md); }
.console-clean-portrait {
	width: 56px; height: 56px;
	border-radius: var(--bs-round-circle);
	object-fit: cover;
	object-position: center 20%;
	flex-shrink: 0;
	background: var(--bs-main-color);
	border: var(--bs-border-medium) solid var(--bs-main-color);
	box-sizing: content-box;
}
.console-clean-name { font-size: var(--bs-type-body); font-weight: var(--bs-fw-bold); color: var(--bs-text); }
.console-clean-name a { color: var(--bs-text); }
.console-clean-name a:hover { color: var(--bs-accent-color); text-decoration: underline; }
.console-clean-role { font-size: var(--bs-fs-small); color: var(--bs-fg-muted); }
.console-clean-cta {
	display: inline-flex; align-items: center;
	padding: var(--bs-spacing-xs) var(--bs-spacing-md);
	background: var(--bs-main-color);
	border: var(--bs-border-width) solid var(--bs-accent-color);
	border-radius: var(--bs-corner);
	color: var(--bs-accent-color);
	font-weight: var(--bs-fw-bold);
	font-size: var(--bs-fs-small);
	transition: background var(--bs-transition-fast) var(--bs-easing), color var(--bs-transition-fast) var(--bs-easing);
}
.console-clean-cta:hover { background: var(--bs-accent-color); color: var(--bs-canvas); }

/* ============================================================
   AUTHOR CARD — AUTH-06 (full hero) + articles
   ============================================================ */
.cresset-fast { padding-block: var(--bs-sec-y); background: linear-gradient(135deg, var(--bs-main-color), var(--bs-canvas)); }
.cresset-fast-grid { display: grid; grid-template-columns: 280px 1fr; gap: var(--bs-gap-2xl); align-items: start; }
.cresset-fast-portrait {
	width: 280px; height: 350px;
	object-fit: cover;
	object-position: center 20%;
	border-radius: var(--bs-corner-lg);
	box-shadow: var(--bs-shade-lg);
	background: var(--bs-main-color);
	border: 3px solid var(--bs-main-color);
	box-sizing: content-box;
}
.cresset-fast-eyebrow { font-size: var(--bs-fs-small); text-transform: uppercase; letter-spacing: var(--bs-letter-wide); color: var(--bs-accent-color); font-weight: var(--bs-fw-bold); }
.cresset-fast-name {
	font-family: var(--bs-font-heading);
	font-size: clamp(40px, 6vw, 64px);
	font-weight: var(--bs-fw-black);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-tight);
	line-height: var(--bs-leading-tight);
	color: var(--bs-text);
	margin-block: var(--bs-gutter-sm) var(--bs-spacing-md);
}
.cresset-fast-bio { font-size: var(--bs-size-h5); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); max-width: 560px; }
.cresset-fast-expertise { display: flex; flex-wrap: wrap; gap: var(--bs-spacing-xs); list-style: none; padding: 0; margin-top: var(--bs-spacing-md); }
.cresset-fast-tag {
	display: inline-flex;
	padding: 6px var(--bs-gutter-sm);
	background: rgba(255, 255, 255, 0.07);
	border: var(--bs-border-width) solid var(--bs-color-line);
	color: var(--bs-text);
	border-radius: var(--bs-pill);
	font-size: var(--bs-text-xs);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-wide);
}
.cresset-fast-articles { max-width: calc(var(--bs-wrapper) + 2 * var(--bs-edge-desktop)); margin-inline: auto; padding: var(--bs-spacing-lg) var(--bs-edge-desktop) 0; }
.cresset-fast-articles-heading { font-family: var(--bs-font-heading); font-size: var(--bs-type-h4); font-weight: var(--bs-fw-bold); color: var(--bs-text); margin-bottom: var(--bs-spacing-md); }
.cresset-fast-articles-list { display: flex; flex-direction: column; gap: var(--bs-spacing-xs); list-style: none; padding: 0; margin: 0; }
.cresset-fast-articles-item { font-size: var(--bs-type-body); line-height: var(--bs-leading-normal); }
.cresset-fast-articles-item a { color: var(--bs-accent-color); text-decoration: underline; text-underline-offset: 3px; }
.cresset-fast-articles-item a:hover { color: var(--bs-color-accent-hover); }

/* ============================================================
   LEGAL — LEGAL-05 (definition list)
   ============================================================ */
.socle-neat { padding-block: var(--bs-sec-y); }
.socle-neat-intro { font-size: var(--bs-size-h5); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); margin-bottom: var(--bs-spacing-lg); }
.socle-neat-list { margin: 0; }
.socle-neat-term {
	font-family: var(--bs-font-heading);
	font-size: var(--bs-type-h4);
	font-weight: var(--bs-fw-bold);
	color: var(--bs-text);
	margin-top: var(--bs-spacing-lg);
	margin-bottom: var(--bs-spacing-xs);
	padding-top: var(--bs-spacing-xs);
	border-top: 2px solid var(--bs-accent-color);
	display: inline-block;
}
.socle-neat-definition { margin-inline-start: 0; margin-bottom: var(--bs-spacing-md); }
.socle-neat-definition p { font-size: var(--bs-type-body); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); margin-bottom: var(--bs-gutter-sm); }
.socle-neat-extra { margin-top: var(--bs-spacing-lg); }
.socle-neat-extra h2 { font-family: var(--bs-font-heading); font-size: var(--bs-type-h4); text-transform: uppercase; color: var(--bs-text); margin-bottom: var(--bs-gutter-sm); }
.socle-neat-extra ul { padding-left: 1.4em; }
.socle-neat-extra li { font-size: var(--bs-type-body); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); }
.socle-neat-disclaimer { margin-top: var(--bs-spacing-lg); font-size: var(--bs-fs-small); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); font-style: italic; }

/* ============================================================
   CONTACT FORM — FORM-07 (card dark, accent header)
   ============================================================ */
.vitrail-noble { padding-block: var(--bs-sec-y); }
.vitrail-noble-intro { font-size: var(--bs-size-h5); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); max-width: var(--bs-readable-width); margin-bottom: var(--bs-spacing-lg); }
.vitrail-noble-form {
	max-width: 680px;
	border-radius: var(--bs-corner-lg);
	overflow: hidden;
	background: var(--bs-panel-bg);
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-top: 8px solid var(--bs-accent-color);
	padding: var(--bs-gutter-xl);
}
.vitrail-noble-field { display: flex; flex-direction: column; gap: var(--bs-spacing-xs); margin-bottom: var(--bs-spacing-md); }
.vitrail-noble-label { font-size: var(--bs-fs-small); text-transform: uppercase; letter-spacing: var(--bs-letter-wide); font-weight: var(--bs-weight-medium); color: var(--bs-text); }
.vitrail-noble-input, .vitrail-noble-textarea {
	font-family: var(--bs-font-base);
	font-size: var(--bs-type-body);
	color: var(--bs-text);
	background: var(--bs-canvas);
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-radius: var(--bs-corner);
	padding: var(--bs-gutter-sm) var(--bs-spacing-md);
	width: 100%;
}
.vitrail-noble-input { height: 48px; }
.vitrail-noble-textarea { min-height: 130px; resize: vertical; }
.vitrail-noble-input:focus, .vitrail-noble-textarea:focus { outline: none; border-color: var(--bs-accent-color); }
.vitrail-noble-submit {
	min-height: 48px;
	padding-inline: var(--bs-gutter-xl);
	background: var(--bs-accent-color);
	color: var(--bs-canvas);
	font-family: var(--bs-font-heading);
	font-weight: var(--bs-fw-black);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-wide);
	font-size: var(--bs-fs-small);
	border: none;
	border-radius: var(--bs-corner);
	transition: background var(--bs-transition-fast) var(--bs-easing), color var(--bs-transition-fast) var(--bs-easing);
}
.vitrail-noble-submit:hover { background: var(--bs-color-accent-hover); color: var(--bs-canvas); }
.vitrail-noble-success {
	display: none;
	padding: var(--bs-spacing-md);
	background: rgba(34, 197, 94, 0.12);
	border: var(--bs-border-width) solid rgba(34, 197, 94, 0.4);
	border-radius: var(--bs-corner);
	color: var(--bs-text);
	margin-bottom: var(--bs-spacing-md);
}
.vitrail-noble-success.is-visible { display: block; }

/* ============================================================
   ERROR — ERR-04 (full-bleed atmospheric)
   ============================================================ */
.placard-clean {
	min-height: 78vh;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-position: center;
	text-align: center;
	overflow: hidden;
}
.placard-clean-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(23, 23, 23, 0.65), rgba(23, 23, 23, 0.92)); }
.placard-clean-inner { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--bs-spacing-md); padding-block: var(--bs-sec-y); }
.placard-clean-title {
	font-family: var(--bs-font-heading);
	font-size: clamp(44px, 9vw, 96px);
	font-weight: var(--bs-fw-black);
	text-transform: uppercase;
	line-height: var(--bs-leading-tight);
	letter-spacing: var(--bs-letter-tight);
	color: var(--bs-text);
	max-width: 900px;
}
.placard-clean-text { font-size: var(--bs-size-h5); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); max-width: 620px; }

/* ============================================================
   FOOTER — FOOT-03 (massive centered)
   ============================================================ */
.coffre-fast { background: var(--bs-color-bg-sunken); border-top: var(--bs-border-width) solid var(--bs-color-line); padding-block: var(--bs-gap-2xl); }
.coffre-fast-inner { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--bs-spacing-lg); }
.coffre-fast-logo-pill { display: inline-flex; background: #fff; padding: 6px 14px; border-radius: var(--bs-corner); }
.coffre-fast-logo-img { height: 64px; width: auto; }
.coffre-fast-nav { width: 100%; }
.coffre-fast-list { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--bs-spacing-md); list-style: none; padding: 0; margin: 0; }
.coffre-fast-list a { font-family: var(--bs-font-heading); font-weight: var(--bs-weight-medium); font-size: var(--bs-type-body); color: var(--bs-fg-muted); }
.coffre-fast-list a:hover { color: var(--bs-text); }
.coffre-fast-tagline { font-size: var(--bs-fs-small); line-height: var(--bs-line-loose); color: var(--bs-fg-muted); max-width: 520px; }
.coffre-fast-legal-row { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--bs-gutter-sm); }
.coffre-fast-legal-row a { font-size: var(--bs-text-xs); text-transform: uppercase; letter-spacing: var(--bs-letter-wide); color: var(--bs-fg-muted); }
.coffre-fast-legal-row a:hover { color: var(--bs-accent-color); }
.coffre-fast-legal-row span { color: var(--bs-color-line); }
.coffre-fast-copyright { font-size: var(--bs-text-xs); color: var(--bs-fg-muted); }

/* ============================================================
   COOKIE — COOK-06 (detailed w/ preferences)
   ============================================================ */
.atrium-pure {
	display: none;
	position: fixed;
	inset-block-end: var(--bs-spacing-md);
	inset-inline: var(--bs-spacing-md);
	max-width: 720px;
	margin-inline: auto;
	z-index: 120;
	background: var(--bs-panel-bg);
	border: var(--bs-border-width) solid var(--bs-color-line);
	border-radius: var(--bs-corner);
	box-shadow: var(--bs-shade-lg);
	padding: var(--bs-spacing-md);
}
.atrium-pure.is-visible { display: block; }
.atrium-pure-inner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bs-spacing-md); }
.atrium-pure-message { flex: 1 1 280px; font-size: var(--bs-fs-small); line-height: var(--bs-leading-normal); color: var(--bs-fg-muted); }
.atrium-pure-actions { display: flex; align-items: center; gap: var(--bs-gutter-sm); flex-wrap: wrap; }
.atrium-pure-button {
	min-height: 36px;
	display: inline-flex;
	align-items: center;
	padding-inline: var(--bs-spacing-md);
	font-family: var(--bs-font-heading);
	font-weight: var(--bs-fw-bold);
	text-transform: uppercase;
	letter-spacing: var(--bs-letter-wide);
	font-size: var(--bs-text-xs);
	border-radius: var(--bs-corner);
	border: var(--bs-border-width) solid transparent;
	transition: background var(--bs-transition-fast) var(--bs-easing), color var(--bs-transition-fast) var(--bs-easing);
}
.atrium-pure-button--bs-accept { background: var(--bs-accent-color); color: var(--bs-canvas); border: none; }
.atrium-pure-button--bs-accept:hover { background: var(--bs-color-accent-hover); color: var(--bs-canvas); }
.atrium-pure-button--bs-decline { background: transparent; border-color: var(--bs-color-line); color: var(--bs-text); }
.atrium-pure-button--bs-decline:hover { background: rgba(255, 255, 255, 0.05); color: var(--bs-text); }
.atrium-pure-button--bs-preferences { background: transparent; color: var(--bs-fg-muted); text-decoration: underline; }
.atrium-pure-button--bs-preferences:hover { color: var(--bs-accent-color); }

/* ============================================================
   RESPONSIVE — desktop-first (max-width)
   ============================================================ */
@media (max-width: 1040px) {
	:root {
		--bs-size-h1: 52px;
		--bs-text-h2: 36px;
		--bs-fs-h3: 26px;
		--bs-gap-2xl: 88px;
		--bs-space-3xl: 120px;
	}
	.trellis-keen-nav, .trellis-keen-auth { display: none; }
	.trellis-keen-toggle { display: inline-flex; }
	.cresset-fast-grid { grid-template-columns: 1fr; gap: var(--bs-spacing-lg); justify-items: center; text-align: center; }
	.cresset-fast-bio { max-width: none; }
	.cresset-fast-expertise { justify-content: center; }
	.repere-grave-list { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
	:root {
		--bs-size-h1: 40px;
		--bs-text-h2: 30px;
		--bs-type-body: 14px;
		--bs-edge-desktop: 16px;
		--bs-gutter-xl: 56px;
		--bs-gap-2xl: 72px;
	}
	.chambre-fluid-figure { height: 230px; }
	.chambre-fluid-content { padding-top: var(--bs-spacing-lg); }
	.planche-swift-item { flex-direction: column; gap: var(--bs-spacing-md); }
	.planche-swift-initial { width: 72px; height: 72px; font-size: 38px; }
	.arbor-opus-card { flex-basis: 82vw; max-width: 82vw; }
	.page-media-figure img { height: 260px; }
	.cresset-fast-portrait { width: 220px; height: 275px; }
	.console-clean-inner { flex-direction: column; align-items: flex-start; gap: var(--bs-gutter-sm); }
	.console-clean-cta { width: 100%; justify-content: center; }
	.trellis-keen-logo-img { height: 60px; }
	.coffre-fast-logo-img { height: 52px; }
	.atrium-pure { padding: 14px !important; }
	.atrium-pure-inner { gap: 10px; }
	.atrium-pure-actions { width: 100%; }
	.atrium-pure-button { font-size: 12px; min-height: 38px; }
	.vitrail-noble-form { padding: var(--bs-spacing-lg); }
}
