/* OnlySpins DE — TYPO-02 + SPACE-10 mild geo + GEO-10 double border + MOTION-07 */
:root {
	--color-primary: #1d9ce8;
	--color-accent: #fce200;
	--color-accent-pressed: #d4bb00;
	--color-bg: #11141c;
	--color-bg-elevated: #1a1d27;
	--color-gradient-light: #0a3a57;
	--color-gradient-mid: #6db9ed;
	--color-text: #ffffff;
	--color-text-muted: #c1c1c1;
	--color-rg-banner: #dc2626;

	--font-display: "Manrope", "Helvetica Neue", Arial, sans-serif;
	--font-body: "Inter", "Helvetica Neue", Arial, sans-serif;

	/* TYPO-02 compact modular */
	--fs-h1: 44px;
	--fs-h2: 34px;
	--fs-h3: 26px;
	--fs-h4: 20px;
	--fs-h5: 16px;
	--fs-h6: 14px;
	--fs-body: 16px;
	--fs-small: 14px;
	--fs-micro: 12px;
	--lh-tight: 1.2;
	--lh-normal: 1.55;
	--lh-loose: 1.7;
	--ls-tight: -0.02em;
	--ls-normal: 0;
	--ls-wide: 0.05em;
	--fw-regular: 400;
	--fw-medium: 500;
	--fw-bold: 700;

	/* SPACE-10 mild geometric */
	--space-2xs: 4px;
	--space-xs: 7px;
	--space-sm: 11px;
	--space-md: 17px;
	--space-lg: 26px;
	--space-xl: 40px;
	--space-2xl: 60px;
	--space-3xl: 90px;

	--container-site: 1100px;
	--container-readable: 610px;
	--container-padding-mobile: 16px;
	--container-padding-tablet: 32px;
	--container-padding-desktop: 24px;

	--bp-sm: 460px;
	--bp-md: 720px;
	--bp-lg: 1040px;
	--bp-xl: 1380px;

	/* GEO-10 double border architectural */
	--radius-xs: 0;
	--radius-sm: 4px;
	--radius-md: 6px;
	--radius-lg: 10px;
	--radius-pill: 9999px;
	--radius-circle: 50%;
	--shadow-xs: none;
	--shadow-sm: none;
	--shadow-md: 0 0 0 1px rgba(0, 0, 0, 0.06);
	--shadow-lg: 0 0 0 2px rgba(0, 0, 0, 0.10), 0 8px 24px rgba(0, 0, 0, 0.10);
	--border-thin: 1px;
	--border-medium: 4px;
	--border-thick: 6px;

	/* MOTION-07 */
	--dur-fast: 300ms;
	--dur-base: 500ms;
	--dur-slow: 800ms;
	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--ease-in: cubic-bezier(0.7, 0, 0.84, 0);
	--ease-in-out: cubic-bezier(0.83, 0, 0.17, 1);
}

@media (max-width: 720px) {
	:root {
		--fs-h1: 30px;
		--fs-h2: 24px;
		--fs-h3: 20px;
		--fs-h4: 18px;
		--fs-h5: 15px;
		--fs-h6: 13px;
		--fs-body: 15px;
		--fs-small: 13px;
		--fs-micro: 11px;
	}
}

*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background-color: var(--color-bg); color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-body); font-weight: var(--fw-regular); line-height: var(--lh-normal); margin: 0; min-height: 100vh; overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--color-accent); text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
a:hover { color: var(--color-accent-pressed); }
h1,h2,h3,h4,h5,h6 { margin: 0; font-family: var(--font-display); font-weight: var(--fw-bold); letter-spacing: var(--ls-tight); line-height: var(--lh-tight); }
p { margin: 0; }
button { background: none; border: 0; color: inherit; cursor: pointer; font: inherit; }
.skip-link { background: var(--color-accent); color: var(--color-bg); font-weight: var(--fw-bold); left: var(--space-sm); padding: var(--space-2xs) var(--space-sm); position: absolute; top: -100px; z-index: 200; }
.skip-link:focus { top: var(--space-sm); }
.sr-only { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; width: 1px; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }

/* Header HEAD-06 Magazine Logo + Top Date (.banner) — STICKY-OFF, AUTH-LOGIN */
.banner { background: var(--color-bg); border-bottom: 1px solid rgba(255, 255, 255, 0.15); position: relative; z-index: 50; }
.banner-inner { align-items: center; display: flex; gap: var(--space-md); height: 88px; margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.banner-logo img { height: 60px; width: auto; }
.banner-nav { display: flex; flex: 1; gap: var(--space-md); justify-content: center; }
.banner-nav a { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-small); font-weight: var(--fw-medium); letter-spacing: var(--ls-wide); text-transform: uppercase; }
.banner-nav a:hover { color: var(--color-accent); }
body[data-current="/"] .banner-nav a[href="/"],
body[data-current="/bonus/"] .banner-nav a[href="/bonus/"],
body[data-current="/app/"] .banner-nav a[href="/app/"],
body[data-current="/deposit/"] .banner-nav a[href="/deposit/"],
body[data-current="/withdrawal/"] .banner-nav a[href="/withdrawal/"],
body[data-current="/promo-code/"] .banner-nav a[href="/promo-code/"],
body[data-current="/login/"] .banner-nav a[href="/login/"],
body[data-current="/author/"] .banner-nav a[href="/author/"],
body[data-current="/contact/"] .banner-nav a[href="/contact/"] { color: var(--color-accent); }
.banner-date { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-small); }
.banner-login { background: var(--color-accent); border-radius: var(--radius-md); color: var(--color-bg); font-family: var(--font-body); font-size: var(--fs-small); font-weight: var(--fw-bold); letter-spacing: var(--ls-wide); padding: var(--space-xs) var(--space-md); text-transform: uppercase; transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.banner-login:hover { background: var(--color-accent-pressed); color: var(--color-bg); }
.banner-toggle { display: none; flex-direction: column; gap: 5px; padding: var(--space-xs); }
@media (max-width: 1px) { .banner-toggle { display: none; } }
.banner-toggle span { background: var(--color-text); display: block; height: 2px; width: 24px; }
.banner-mobile { background: var(--color-bg); display: none; inset-block-start: 88px; inset-inline: 0; padding: var(--space-md); position: absolute; box-shadow: var(--shadow-lg); z-index: 99; }
.banner-mobile.is-open { display: block; }
.banner-mobile-backdrop { background: rgba(0, 0, 0, 0.6); display: none; inset: 88px 0 -2000px 0; position: absolute; z-index: 98; }
.banner-mobile-backdrop.is-open { display: block; }
.banner-mobile ul { display: flex; flex-direction: column; gap: var(--space-md); list-style: none; margin: 0; padding: 0; }
.banner-mobile a { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-h5); }
@media (max-width: 1040px) {
	.banner-nav, .banner-date { display: none; }
	.banner-toggle { display: flex; }
	.banner-inner { height: 64px; justify-content: space-between; }
	.banner-mobile, .banner-mobile-backdrop { inset-block-start: 64px; }
}

/* Hero HERO-06 Asymmetric Tilted (.tribune) */
.tribune { background: var(--color-bg); min-height: 640px; overflow: hidden; padding-block: var(--space-3xl); position: relative; }
.tribune-content { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); position: relative; width: 55%; z-index: 2; }
.tribune h1 { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h1); margin-block-end: var(--space-md); }
.tribune-subtitle { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-h5); line-height: var(--lh-normal); margin-block-end: var(--space-lg); }
.tribune-cta { background: var(--color-accent); border-radius: var(--radius-md); color: var(--color-bg); display: inline-block; font-family: var(--font-display); font-size: var(--fs-h5); font-weight: var(--fw-bold); letter-spacing: var(--ls-wide); padding: var(--space-md) var(--space-xl); text-transform: uppercase; transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.tribune-cta:hover { background: var(--color-accent-pressed); color: var(--color-bg); }
.tribune-figure { inset-block-start: -40px; inset-inline-end: 0; margin: 0; position: absolute; transform: rotate(2deg); width: 55%; }
.tribune-figure img { aspect-ratio: 16/10; object-fit: cover; width: 100%; }
@media (max-width: 1040px) { .tribune-content { width: 100%; } .tribune-figure { display: none; } }

/* Page-header PHEAD-02 Compact Centered (.lattice) */
.lattice { padding-block: var(--space-2xl); text-align: center; }
.lattice-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.lattice-eyebrow { color: var(--color-accent); font-family: var(--font-body); font-size: var(--fs-small); font-weight: var(--fw-medium); letter-spacing: var(--ls-wide); margin-block-end: var(--space-xs); text-transform: uppercase; }
.lattice-title { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h1); margin-block-end: var(--space-sm); }
.lattice-divider { background: var(--color-accent); border: 0; height: 2px; margin: var(--space-sm) auto var(--space-md); width: 60px; }
.lattice-description { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-h5); line-height: var(--lh-normal); margin-inline: auto; max-width: 580px; }

/* Breadcrumbs BREAD-01 Inline Slash (.truss) */
.truss { padding-block: var(--space-md); }
.truss-inner { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.truss-link { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-small); }
.truss-link:hover { color: var(--color-accent); }
.truss-current { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-small); }
.truss-sep { color: var(--color-text-muted); margin-inline: var(--space-xs); opacity: 0.5; }

/* Items-grid GRID-03 Asymmetric (.cloister) */
.cloister { padding-block: var(--space-2xl); }
.cloister-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.cloister h2 { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h2); margin-block-end: var(--space-lg); }
.cloister-grid { display: grid; gap: var(--space-md); grid-template-columns: repeat(10, 1fr); }
.cloister-card { background: var(--color-bg-elevated); border: var(--border-thin) solid rgba(255, 255, 255, 0.08); border-radius: var(--radius-md); padding: var(--space-lg); }
.cloister-grid > .cloister-card:nth-child(4n+1) { grid-column: span 6; }
.cloister-grid > .cloister-card:nth-child(4n+2) { grid-column: span 4; }
.cloister-grid > .cloister-card:nth-child(4n+3) { grid-column: span 4; }
.cloister-grid > .cloister-card:nth-child(4n) { grid-column: span 6; }
.cloister-card-title { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h4); margin-block-end: var(--space-xs); }
.cloister-card-text { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-normal); }
@media (max-width: 720px) { .cloister-grid { grid-template-columns: 1fr; } .cloister-grid > .cloister-card { grid-column: 1 / -1; } }

/* FAQ FAQ-01 Classic Accordion (.lectern) */
.lectern { padding-block: var(--space-2xl); }
.lectern-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.lectern h2 { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h2); margin-block-end: var(--space-lg); }
.lectern-list { border-block-start: 1px solid rgba(255, 255, 255, 0.08); }
.lectern-item { border-block-end: 1px solid rgba(255, 255, 255, 0.08); }
.lectern-question { align-items: center; background: transparent; color: var(--color-text); display: flex; font-family: var(--font-display); font-size: var(--fs-h5); font-weight: var(--fw-bold); gap: var(--space-md); justify-content: space-between; padding-block: var(--space-md); text-align: start; width: 100%; }
.lectern-icon { color: var(--color-accent); font-family: var(--font-display); font-size: var(--fs-h4); }
.lectern-item.is-open .lectern-icon::before { content: "−"; }
.lectern-item:not(.is-open) .lectern-icon::before { content: "+"; }
.lectern-answer { display: none; padding-block-end: var(--space-md); }
.lectern-item.is-open .lectern-answer { display: block; }
.lectern-answer p { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-loose); }

/* Reviews REV-09 Magazine Pull-Quote (.mosaic) */
.mosaic { padding-block: var(--space-2xl); text-align: center; }
.mosaic-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.mosaic h2 { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h2); margin-block-end: var(--space-lg); }
.mosaic-item { padding-block: var(--space-2xl); }
.mosaic-text { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h3); font-style: italic; line-height: var(--lh-tight); margin: 0 auto var(--space-md); max-width: 720px; }
.mosaic-attribution { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-small); letter-spacing: var(--ls-wide); text-transform: uppercase; }
.mosaic-rating { color: var(--color-accent); font-family: var(--font-body); font-size: var(--fs-small); margin-inline-start: var(--space-sm); }
.mosaic-divider { background: var(--color-accent); border: 0; height: 1px; margin: 0 auto; width: 80px; }

/* CTA CTA-06 Sticky Bottom Banner (.lobby) */
.lobby { background: var(--color-accent); bottom: 0; box-shadow: var(--shadow-lg); inset-inline: 0; position: sticky; z-index: 90; }
.lobby.is-dismissed { display: none; }
.lobby-inner { align-items: center; display: flex; gap: var(--space-md); height: 80px; margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.lobby-title { color: var(--color-bg); flex: 1; font-family: var(--font-body); font-size: var(--fs-body); font-weight: var(--fw-bold); }
.lobby-btn { background: var(--color-bg); border-radius: var(--radius-pill); color: var(--color-accent); font-family: var(--font-display); font-size: var(--fs-small); font-weight: var(--fw-bold); letter-spacing: var(--ls-wide); padding: var(--space-xs) var(--space-lg); text-transform: uppercase; transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.lobby-btn:hover { background: var(--color-accent-pressed); color: var(--color-bg); }
.lobby-close { color: var(--color-bg); font-size: 24px; font-weight: var(--fw-bold); padding: var(--space-xs); }
@media (max-width: 720px) { .lobby-inner { height: 64px; } .lobby-title { font-size: var(--fs-small); } }

/* Prose PROSE-04 Drop-Cap Magazine (.vault) */
.vault { padding-block: var(--space-2xl); }
.vault-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.vault h2 { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h2); margin-block: var(--space-2xl) var(--space-md); }
.vault h2:first-child { margin-block-start: 0; }
.vault h3 { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h3); margin-block: var(--space-md) var(--space-sm); }
.vault p,
.vault ul,
.vault ol { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-loose); margin: 0 0 var(--space-md); }
.vault h2 + p::first-letter { color: var(--color-accent); float: left; font-family: var(--font-display); font-size: 4em; font-weight: var(--fw-bold); line-height: 0.8; margin-block-start: 0.1em; margin-inline-end: 0.1em; }
.vault ul, .vault ol { padding-inline-start: var(--space-lg); }
.vault li { margin-block-end: var(--space-2xs); }
.vault a { color: var(--color-accent); text-decoration: underline; }
.vault strong { color: var(--color-text); font-weight: var(--fw-bold); }

/* Data-table TABLE-07 Two-Tone Columns (.trellis) */
.trellis { padding-block: var(--space-2xl); }
.trellis-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.trellis table { border-collapse: collapse; width: 100%; }
.trellis thead { background: var(--color-primary); }
.trellis th, .trellis td { font-family: var(--font-body); padding: var(--space-md); text-align: left; }
.trellis th { color: var(--color-text); font-size: var(--fs-small); font-weight: var(--fw-bold); letter-spacing: var(--ls-wide); text-transform: uppercase; }
.trellis td { color: var(--color-text); font-size: var(--fs-body); }
.trellis td:nth-child(even) { background: rgba(255, 255, 255, 0.03); }

/* Legal LEGAL-06 Compact (.hearth) */
.hearth { padding-block: var(--space-xl); }
.hearth-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.hearth-body { counter-reset: legal; }
.hearth-intro { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-loose); margin-block-end: var(--space-md); }
.hearth-updated { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-micro); letter-spacing: var(--ls-wide); margin-block-end: var(--space-md); text-transform: uppercase; }
.hearth-section { counter-increment: legal; margin-block-end: var(--space-md); }
.hearth-section h3::before { color: var(--color-accent); content: "§ " counter(legal) ". "; font-family: var(--font-display); font-weight: var(--fw-bold); margin-inline-end: var(--space-2xs); }
.hearth-section h3 { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-h4); font-weight: var(--fw-bold); margin-block-end: var(--space-xs); }
.hearth-section p { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-small); line-height: var(--lh-normal); margin-block-end: var(--space-xs); }
.hearth-support { border-block-start: 1px solid rgba(255, 255, 255, 0.08); margin-block-start: var(--space-md); padding-block-start: var(--space-md); }
.hearth-support h3 { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-h5); font-weight: var(--fw-bold); margin-block-end: var(--space-xs); }
.hearth-support ul { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-small); list-style: none; margin: 0; padding: 0; }
.hearth-disclaimer { background: rgba(220, 38, 38, 0.08); border-inline-start: 3px solid var(--color-rg-banner); color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-small); line-height: var(--lh-normal); margin-block-start: var(--space-md); padding: var(--space-sm) var(--space-md); }

/* Contact-form FORM-07 Card w/ Accent Header (.frieze) */
.frieze { padding-block: var(--space-2xl); }
.frieze-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.frieze-card { border-radius: var(--radius-lg); margin-inline: auto; max-width: 720px; overflow: hidden; }
.frieze-header { background: var(--color-accent); height: 8px; }
.frieze-body { background: var(--color-bg-elevated); padding: var(--space-xl); }
.frieze-intro { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-loose); margin-block-end: var(--space-lg); }
.frieze-form { display: flex; flex-direction: column; gap: var(--space-md); }
.frieze-field { display: flex; flex-direction: column; gap: var(--space-2xs); }
.frieze-label { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-small); font-weight: var(--fw-medium); letter-spacing: var(--ls-wide); text-transform: uppercase; }
.frieze-input, .frieze-textarea {
	background: var(--color-bg);
	border: var(--border-thin) solid rgba(255, 255, 255, 0.12);
	border-radius: var(--radius-sm);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: var(--fs-body);
	padding: var(--space-sm) var(--space-md);
}
.frieze-input { height: 48px; }
.frieze-textarea { min-height: 120px; resize: vertical; }
.frieze-input:focus, .frieze-textarea:focus { border-color: var(--color-accent); outline: 0; }
.frieze-submit { align-self: center; background: var(--color-accent); border-radius: var(--radius-md); color: var(--color-bg); font-family: var(--font-display); font-size: var(--fs-small); font-weight: var(--fw-bold); height: 48px; letter-spacing: var(--ls-wide); padding-inline: var(--space-xl); text-transform: uppercase; transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.frieze-submit:hover { background: var(--color-accent-pressed); color: var(--color-bg); }
.frieze-success { background: rgba(252, 226, 0, 0.1); border-inline-start: 4px solid var(--color-accent); color: var(--color-text); display: none; margin-block-end: var(--space-md); padding: var(--space-sm) var(--space-md); }
.frieze-success.is-visible { display: block; }

/* Cookie COOK-06 Detailed (.window) */
.window { background: var(--color-bg-elevated); border-radius: var(--radius-md); bottom: var(--space-md); box-shadow: var(--shadow-lg); display: none; inset-inline: var(--space-md); max-width: 480px; padding: var(--space-md); position: fixed; z-index: 90; }
.window.is-visible { display: block; }
.window-message { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-small); line-height: var(--lh-normal); margin-block-end: var(--space-md); }
.window-actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.window-prefs { color: var(--color-accent); font-family: var(--font-body); font-size: var(--fs-small); text-decoration: underline; }
.window-prefs:hover { color: var(--color-accent-pressed); }
.window-btn { border-radius: var(--radius-md); font-family: var(--font-body); font-size: var(--fs-small); font-weight: var(--fw-bold); letter-spacing: var(--ls-wide); padding: var(--space-xs) var(--space-md); text-transform: uppercase; transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.window-btn--decline { background: transparent; border: 1px solid var(--color-text); color: var(--color-text); }
.window-btn--decline:hover { background: rgba(255, 255, 255, 0.06); color: var(--color-text); }
.window-btn--accept { background: var(--color-accent); color: var(--color-bg); }
.window-btn--accept:hover { background: var(--color-accent-pressed); color: var(--color-bg); }

/* Error ERR-08 Simple (.atrium) — using ERR-02-style split visual fallback */
.atrium { padding-block: var(--space-3xl); }
.atrium-inner { display: grid; gap: var(--space-2xl); grid-template-columns: 1fr 1fr; margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.atrium-text { align-items: flex-start; display: flex; flex-direction: column; gap: var(--space-md); }
.atrium-title { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h2); }
.atrium-desc { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-loose); }
.atrium-btn { background: var(--color-accent); border-radius: var(--radius-md); color: var(--color-bg); font-family: var(--font-display); font-size: var(--fs-small); font-weight: var(--fw-bold); letter-spacing: var(--ls-wide); padding: var(--space-md) var(--space-xl); text-transform: uppercase; transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.atrium-btn:hover { background: var(--color-accent-pressed); color: var(--color-bg); }
.atrium-deco { align-self: flex-start; color: var(--color-accent); font-family: var(--font-display); font-size: clamp(120px, 24vw, 280px); font-weight: var(--fw-bold); line-height: var(--lh-tight); }
@media (max-width: 720px) { .atrium-inner { grid-template-columns: 1fr; } }

/* Author-byline BYLINE-04 Quote-Style (.cornice) */
.cornice { padding-block: var(--space-xl); }
.cornice-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.cornice-quote { margin: 0 auto; max-width: 600px; text-align: center; }
.cornice-quote::before { color: var(--color-accent); content: "\201C"; display: block; font-family: var(--font-display); font-size: var(--fs-h1); line-height: 0.6; margin-block-end: var(--space-sm); }
.cornice-quote p { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h4); font-style: italic; line-height: var(--lh-normal); margin: 0 0 var(--space-md); }
.cornice-attribution { align-items: center; display: inline-flex; flex-wrap: wrap; gap: var(--space-xs); justify-content: center; }
.cornice-portrait { border-radius: var(--radius-circle); height: 32px; object-fit: cover; width: 32px; }
.cornice-name { color: var(--color-accent); font-family: var(--font-body); font-style: normal; font-weight: var(--fw-bold); }
.cornice-role { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-small); font-style: italic; }

/* Author-card AUTH-07 Quote-Style with Portrait (.pillar) */
.pillar { padding-block: var(--space-2xl); }
.pillar-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.pillar-card { background: var(--color-bg-elevated); border-inline-start: 4px solid var(--color-accent); border-radius: var(--radius-md); display: grid; gap: var(--space-lg); grid-template-columns: 100px 1fr; padding: var(--space-xl); }
.pillar-portrait { border-radius: var(--radius-circle); height: 100px; object-fit: cover; width: 100px; }
.pillar-quote-mark { color: var(--color-accent); font-family: var(--font-display); font-size: var(--fs-h1); line-height: 0.5; }
.pillar-bio { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h5); font-style: italic; line-height: var(--lh-normal); margin-block: var(--space-sm) var(--space-md); }
.pillar-attribution { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-small); letter-spacing: var(--ls-wide); }
@media (max-width: 580px) { .pillar-card { grid-template-columns: 1fr; } }

/* Inline-CTA INLINE-CTA-07 Icon-Headlined (.rafter) */
.rafter { padding-block: var(--space-2xl); text-align: center; }
.rafter-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.rafter-content { margin-inline: auto; max-width: 540px; }
.rafter-icon { color: var(--color-accent); font-family: var(--font-display); font-size: var(--fs-h1); margin-block-end: var(--space-md); }
.rafter-heading { color: var(--color-text); font-family: var(--font-display); font-size: var(--fs-h3); margin-block-end: var(--space-md); }
.rafter-subtext { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-normal); margin-block-end: var(--space-lg); }
.rafter-btn { background: var(--color-accent); border-radius: var(--radius-md); color: var(--color-bg); display: inline-block; font-family: var(--font-display); font-size: var(--fs-small); font-weight: var(--fw-bold); letter-spacing: var(--ls-wide); padding: var(--space-md) var(--space-xl); text-transform: uppercase; transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.rafter-btn:hover { background: var(--color-accent-pressed); color: var(--color-bg); }

/* Footer FOOT-02 Two-Row (.spire) */
.spire { background: var(--color-bg); border-top: 1px solid rgba(255, 255, 255, 0.1); padding-block: var(--space-xl); }
.spire-inner { margin-inline: auto; max-width: calc(var(--container-site) + 2 * var(--container-padding-desktop)); padding-inline: var(--container-padding-desktop); }
.spire-row { align-items: center; display: flex; flex-wrap: wrap; gap: var(--space-md); justify-content: space-between; }
.spire-row--top { padding-block-end: var(--space-lg); }
.spire-row--bottom { border-block-start: 1px solid rgba(255, 255, 255, 0.06); padding-block-start: var(--space-md); }
.spire-logo img { height: 60px; width: auto; }
.spire-nav ul,
.spire-legal-nav ul { display: flex; flex-wrap: wrap; gap: var(--space-lg); list-style: none; margin: 0; padding: 0; }
.spire-nav a,
.spire-legal-nav a { color: var(--color-text); font-family: var(--font-body); font-size: var(--fs-small); }
.spire-nav a:hover,
.spire-legal-nav a:hover { color: var(--color-accent); }
.spire-copyright { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-micro); }
.spire-disclaimer { color: var(--color-text-muted); font-family: var(--font-body); font-size: var(--fs-micro); line-height: var(--lh-loose); margin-block-start: var(--space-md); }