:root {
	--c-accent-main: #ffd001;
	--c-secondary: #c94fff;
	--c-accent-dark: #c525ff;
	--c-bg: #0e0414;
	--c-surface-2: #1a0b27;
	--c-gradient-start: #943aca;
	--c-gradient-mid: #541eb2;
	--c-text: #ffffff;
	--c-ink-soft: #c1c1c1;
	--c-notice-bg: #dc2626;
	--c-color-hairline: rgba(255,255,255,0.08);

	--c-heading-font: 'Poppins', sans-serif;
	--c-font-text: 'Inter', sans-serif;

	--c-type-h1: 38px;
	--c-fs-h2: 30px;
	--c-text-h3: 24px;
	--c-size-h4: 20px;
	--c-type-h5: 17px;
	--c-fs-h6: 15px;
	--c-size-body: 17px;
	--c-type-small: 15px;
	--c-size-xs: 13px;

	--c-lh-tight: 1.25;
	--c-leading-normal: 1.6;
	--c-lh-loose: 1.8;
	--c-tracking-wide: 0.01em;

	--c-fw-normal: 400;
	--c-font-medium: 500;
	--c-weight-bold: 600;

	--c-gutter-2xs: 2px;
	--c-gutter-xs: 6px;
	--c-spacing-sm: 10px;
	--c-gutter-md: 16px;
	--c-gutter-lg: 48px;
	--c-spacing-xl: 80px;
	--c-space-2xl: 128px;
	--c-space-3xl: 200px;

	--c-wrapper: 1260px;
	--c-prose-width: 720px;
	--c-container-narrow: 560px;
	--c-inset-mobile: 16px;
	--c-container-padding-tablet: 32px;
	--c-gutter-desktop: 56px;

	--c-round-xs: 0;
	--c-rounded-sm: 4px;
	--c-radius-md: 12px;
	--c-round-lg: 24px;
	--c-radius-pill: 9999px;
	--c-round-circle: 50%;
	--c-shadow-sm: 0 2px 8px rgba(0,0,0,0.07);
	--c-elevation-2: 0 6px 16px rgba(0,0,0,0.10);
	--c-elevation-3: 0 12px 32px rgba(0,0,0,0.14);

	--c-duration-fast: 200ms;
	--c-speed-base: 300ms;
	--c-transition-slow: 500ms;
	--c-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--c-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

	--c-sec-y: 48px;
	--c-header-height-desktop: 120px;
	--c-nav-h-mobile: 80px;
}

/* ---------- reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
body {
	margin: 0;
	background: var(--c-bg);
	color: var(--c-text);
	font-family: var(--c-font-text);
	font-size: var(--c-size-body);
	line-height: var(--c-lh-loose);
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { margin: 0 0 var(--c-gutter-md); line-height: var(--c-lh-tight); }
h1, h2, h3 { font-family: var(--c-heading-font); font-weight: var(--c-weight-bold); }
h4, h5, h6 { font-family: var(--c-font-text); font-weight: var(--c-font-medium); }
p { margin: 0 0 var(--c-gutter-md); }
img { max-width: 100%; display: block; }
a { color: var(--c-secondary); text-decoration: none; }
ul { margin: 0; padding: 0; }

/* ---------- a11y ---------- */
.skip-link {
	position: absolute;
	left: var(--c-gutter-md);
	background: var(--c-accent-main);
	color: var(--c-bg);
	padding: var(--c-spacing-sm) var(--c-gutter-md);
	border-radius: var(--c-radius-md);
	z-index: 200;
	font-weight: var(--c-weight-bold);
}
.skip-link:not(:focus) { top: -200px !important; }
.skip-link:focus { top: var(--c-gutter-md); }
.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(--c-secondary); outline-offset: 2px; }

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

/* ---------- header (HEAD-10 Tall Editorial) ---------- */
.pillar {
	background: var(--c-bg);
	border-bottom: 1px solid rgba(255,255,255,0.06);
}
.pillar-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.pillar-row { display: flex; align-items: center; }
.pillar-row--top {
	min-height: var(--c-header-height-desktop);
	justify-content: space-between;
}
.pillar-row--bottom {
	min-height: 56px;
	gap: var(--c-gutter-lg);
	border-top: 1px solid rgba(255,255,255,0.06);
}
.pillar-logo { flex-shrink: 0; display: inline-flex; align-items: center; }
.pillar-logo, .pillar-logo img, .pillar-logo-img { flex-shrink: 0; }
.pillar-logo-img { display: block; }
.pillar-logo img { height: 96px; width: auto; }
.pillar-toggle {
	display: none;
	margin-left: auto !important;
	flex-direction: column;
	gap: 5px;
	width: 44px; height: 44px;
	padding: 10px;
	background: var(--c-bg);
	border: 1px solid var(--c-color-hairline);
	border-radius: var(--c-radius-md);
	cursor: pointer;
}
.pillar-toggle span { display: block; height: 2px; background: var(--c-text); border-radius: 2px; }
.pillar-nav { display: block; }
.pillar-nav-list { display: flex; flex-wrap: nowrap; gap: var(--c-gutter-lg); list-style: none; }
.pillar-nav-item { display: block; }
.pillar-link {
	font-family: var(--c-heading-font);
	font-weight: var(--c-font-medium);
	font-size: var(--c-fs-h6);
	color: var(--c-text);
	white-space: nowrap;
	padding-block: var(--c-gutter-2xs);
	transition: color var(--c-duration-fast) var(--c-ease);
}
.pillar-link:hover { color: var(--c-secondary); }
.pillar-link[aria-current='page'] { color: var(--c-secondary); }
.pillar-auth { margin-left: auto; display: flex; gap: var(--c-spacing-sm); }
.pillar-auth-btn {
	white-space: nowrap;
	flex-shrink: 0;
	padding-inline: var(--c-gutter-lg);
	padding-block: var(--c-spacing-sm);
	font-family: var(--c-heading-font);
	font-weight: var(--c-weight-bold);
	font-size: var(--c-type-small);
	text-transform: uppercase;
	letter-spacing: var(--c-tracking-wide);
	border-radius: var(--c-radius-pill);
}
.pillar-auth-btn--c-login {
	background: var(--c-bg);
	border: 1px solid var(--c-text);
	color: var(--c-text);
	transition: background var(--c-duration-fast), color var(--c-duration-fast);
}
.pillar-auth-btn--c-login:hover { background: var(--c-text); color: var(--c-bg); }
.pillar-drawer { display: none; }
.pillar-drawer.is-open { display: block; padding: var(--c-gutter-md) 0 var(--c-gutter-lg); }
.pillar-drawer-list { list-style: none; display: flex; flex-direction: column; gap: var(--c-gutter-2xs); }
.pillar-drawer-link {
	display: block;
	padding: var(--c-gutter-md);
	font-family: var(--c-heading-font);
	font-weight: var(--c-font-medium);
	color: var(--c-text);
	border-radius: var(--c-radius-md);
}
.pillar-drawer-link:hover { background: var(--c-surface-2); color: var(--c-secondary); }

/* ---------- breadcrumbs (BREAD-04 Numbered Steps) ---------- */
.court {
	padding-block: var(--c-gutter-md);
	background: var(--c-bg);
}
.court-list {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	list-style: none;
	gap: var(--c-gutter-2xs);
}
.court-item { display: inline-flex; align-items: baseline; gap: var(--c-gutter-2xs); }
.court-num { font-family: var(--c-heading-font); font-weight: var(--c-weight-bold); font-size: var(--c-fs-h6); color: var(--c-secondary); margin-right: var(--c-gutter-2xs); }
.court-link, .court-current {
	font-family: var(--c-font-text);
	font-size: var(--c-type-small);
	text-transform: uppercase;
	letter-spacing: var(--c-tracking-wide);
}
.court-link { color: var(--c-ink-soft); }
.court-link:hover { color: var(--c-text); }
.court-current { color: var(--c-text); }
.court-sep { color: rgba(255,255,255,0.4); margin-inline: var(--c-spacing-sm); }

/* ---------- hero (HERO-04 Slider Multi-Slide) ---------- */
.dormer { position: relative; }
.dormer-track { position: relative; list-style: none; height: 560px; }
.dormer-slide {
	position: absolute; inset: 0;
	opacity: 0; visibility: hidden;
	transition: opacity var(--c-transition-slow) var(--c-ease);
}
.dormer-slide.is-active { opacity: 1; visibility: visible; }
.dormer-img { width: 100%; height: 100%; object-fit: cover; }
.dormer-overlay {
	position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(14,4,20,0.92) 0%, rgba(14,4,20,0.72) 45%, rgba(84,30,178,0.35) 100%);
}
.dormer-content {
	position: absolute; inset: 0;
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
	display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
	gap: var(--c-gutter-md);
}
.dormer-eyebrow {
	font-family: var(--c-heading-font); font-weight: var(--c-font-medium);
	text-transform: uppercase; letter-spacing: var(--c-tracking-wide);
	font-size: var(--c-size-xs); color: var(--c-accent-main); margin: 0;
}
.dormer-title { font-size: 52px; color: var(--c-text); margin: 0; max-width: 720px; }
.dormer-subtitle, .dormer-tagline { font-size: var(--c-type-h5); color: var(--c-text); max-width: 560px; line-height: var(--c-leading-normal); margin: 0; }
.dormer-tagline { font-family: var(--c-heading-font); font-weight: var(--c-font-medium); font-size: var(--c-text-h3); max-width: 640px; }
.dormer-cta {
	display: inline-flex; align-items: center;
	height: 52px; padding-inline: var(--c-spacing-xl);
	background: var(--c-accent-main); color: var(--c-bg);
	font-family: var(--c-heading-font); font-weight: var(--c-weight-bold);
	text-transform: uppercase; letter-spacing: var(--c-tracking-wide);
	border-radius: var(--c-radius-pill);
	transition: transform var(--c-speed-base) var(--c-ease-spring), background var(--c-speed-base);
}
.dormer-cta:hover { background: var(--c-accent-main); color: var(--c-bg); transform: scale(1.03); }
.dormer-controls {
	position: absolute; inset-block-end: var(--c-gutter-md); inset-inline: 0;
	display: flex; align-items: center; justify-content: center; gap: var(--c-gutter-md);
	z-index: 2;
}
.dormer-prev, .dormer-next {
	width: 44px; height: 44px; border-radius: var(--c-round-circle);
	background: rgba(14,4,20,0.6); color: var(--c-text);
	border: 1px solid var(--c-color-hairline); cursor: pointer; font-size: var(--c-type-h5);
}
.dormer-prev:hover, .dormer-next:hover { background: var(--c-secondary); color: var(--c-bg); }
.dormer-dots { display: flex; gap: var(--c-gutter-xs); }
.dormer-dot {
	width: 12px; height: 12px; border-radius: var(--c-round-circle);
	background: rgba(255,255,255,0.4); border: 0; cursor: pointer; padding: 0;
}
.dormer-dot.is-active { background: var(--c-accent-main); }

/* ---------- page-header (PHEAD-06 Subtle Editorial) ---------- */
.promenade { padding-block: var(--c-sec-y); background: var(--c-bg); }
.promenade-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.promenade-title { font-size: var(--c-type-h1); color: var(--c-text); }
.promenade-rule { display: block; width: 40px; height: 1px; background: rgba(255,255,255,0.2); margin-block: var(--c-gutter-md); }
.promenade-desc { font-style: italic; font-family: var(--c-font-text); font-size: var(--c-type-h5); color: var(--c-ink-soft); max-width: 640px; }

/* ---------- prose (PROSE-08 Asymmetric Indent) ---------- */
.harbor { padding-block: var(--c-sec-y); }
.harbor-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.harbor-title { font-size: var(--c-fs-h2); color: var(--c-text); padding-left: 0; }
.harbor-body { padding-left: var(--c-space-2xl); }
.harbor-body p { font-size: var(--c-size-body); line-height: var(--c-lh-loose); max-width: 720px; color: var(--c-text); }
.harbor-body ul { list-style: disc; padding-left: var(--c-gutter-lg); max-width: 720px; margin-bottom: var(--c-gutter-md); }
.harbor-body li { margin-bottom: var(--c-gutter-xs); line-height: var(--c-leading-normal); }
.harbor-body a { color: var(--c-secondary); text-decoration: underline; }
.harbor-body a:hover { color: var(--c-accent-dark); }
.harbor-figure { margin: 0 0 var(--c-gutter-lg); }
.harbor-figure img { width: 100%; border-radius: var(--c-radius-md); }
.harbor-figure--context img { max-height: 460px; object-fit: cover; }
.harbor-figure--detail { max-width: 560px; }
.harbor-figure--process img { max-height: 420px; object-fit: cover; }

/* ---------- items-grid (GRID-11 Mixed Block Sizes) ---------- */
.lectern { padding-block: var(--c-sec-y); }
.lectern-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.lectern-heading { font-size: var(--c-fs-h2); color: var(--c-text); }
.lectern-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--c-gutter-md);
}
.lectern-card {
	background: var(--c-surface-2);
	border: 1px solid var(--c-color-hairline);
	border-radius: var(--c-round-lg);
	padding: var(--c-gutter-md);
	transition: transform var(--c-speed-base) var(--c-ease), box-shadow var(--c-speed-base);
}
.lectern-card:hover { transform: translateY(-4px); box-shadow: var(--c-elevation-3); }
.lectern-card--lg { grid-column: span 2; grid-row: span 2; }
.lectern-card--wide { grid-column: span 2; }
.lectern-card-title { font-family: var(--c-heading-font); font-size: var(--c-size-h4); color: var(--c-text); margin-bottom: var(--c-spacing-sm); }
.lectern-card--lg .lectern-card-title { font-size: var(--c-text-h3); }
.lectern-card-text { font-size: var(--c-type-small); color: var(--c-ink-soft); line-height: var(--c-leading-normal); margin: 0; }

/* ---------- faq (FAQ-08 Bordered Box with Indicator Bar) ---------- */
.vault { padding-block: var(--c-sec-y); }
.vault-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.vault-heading { font-size: var(--c-fs-h2); color: var(--c-text); }
.vault-box {
	background: rgba(255,208,1,0.04);
	border: 1px solid rgba(193,193,193,0.1);
	border-radius: var(--c-round-lg);
	padding: var(--c-gutter-lg);
}
.vault-item {
	position: relative;
	padding-left: var(--c-gutter-md);
	box-shadow: inset 4px 0 0 var(--c-secondary);
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.vault-item:last-child { border-bottom: 0; }
.vault-question {
	width: 100%;
	display: flex; align-items: center; justify-content: space-between; gap: var(--c-gutter-md);
	background: transparent; border: 0; cursor: pointer;
	padding-block: var(--c-gutter-md);
	font-family: var(--c-heading-font); font-weight: var(--c-font-medium); font-size: var(--c-type-h5);
	color: var(--c-text); text-align: left;
}
.vault-icon { position: relative; width: 14px; height: 14px; flex-shrink: 0; }
.vault-icon::before, .vault-icon::after {
	content: ''; position: absolute; background: var(--c-secondary);
	left: 0; top: 6px; width: 14px; height: 2px;
	transition: transform var(--c-speed-base) var(--c-ease);
}
.vault-icon::after { transform: rotate(90deg); }
.vault-question[aria-expanded='true'] .vault-icon::after { transform: rotate(0deg); }
.vault-answer {
	max-height: 0; overflow: hidden; opacity: 0;
	transition: max-height var(--c-speed-base) var(--c-ease), opacity var(--c-speed-base);
}
.vault-answer.is-open { max-height: 600px; opacity: 1; padding-bottom: var(--c-gutter-md); }
.vault-answer p { font-size: var(--c-size-body); color: var(--c-ink-soft); line-height: var(--c-leading-normal); margin: 0; }

/* ---------- reviews (REV-02 Quote-Style Editorial) ---------- */
.pergola { padding-block: var(--c-sec-y); }
.pergola-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.pergola-heading { font-size: var(--c-fs-h2); color: var(--c-text); }
.pergola-item {
	position: relative;
	max-width: var(--c-container-narrow);
	padding-block: var(--c-gutter-lg);
	padding-left: var(--c-gutter-lg);
	border-bottom: 1px solid var(--c-color-hairline);
}
.pergola-item:last-child { border-bottom: 0; }
.pergola-item::before {
	content: '\201C';
	position: absolute; top: var(--c-spacing-sm); left: 0;
	font-family: var(--c-heading-font); font-size: var(--c-type-h1); color: var(--c-secondary);
	line-height: 1;
}
.pergola-quote { margin: 0 0 var(--c-gutter-md); }
.pergola-quote p {
	font-family: var(--c-heading-font); font-style: italic; font-size: var(--c-size-h4);
	line-height: var(--c-lh-tight); color: var(--c-text); margin: 0;
}
.pergola-attribution { display: flex; align-items: center; gap: var(--c-spacing-sm); font-size: var(--c-type-small); color: var(--c-ink-soft); }
.pergola-author { font-style: normal; font-weight: var(--c-font-medium); color: var(--c-text); }
.pergola-rating-text { color: var(--c-accent-main); }

/* ---------- data-table (TABLE-01 Striped Rows Classic) ---------- */
.trellis { padding-block: var(--c-sec-y); }
.trellis-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.trellis-heading { font-size: var(--c-fs-h2); color: var(--c-text); }
.trellis-wrap { overflow-x: auto; border-radius: var(--c-radius-md); }
.trellis-table { width: 100%; border-collapse: collapse; background: var(--c-surface-2); min-width: 520px; }
.trellis-table th {
	background: var(--c-accent-main);
	color: var(--c-bg);
	font-family: var(--c-font-text); font-weight: var(--c-font-medium);
	text-transform: uppercase; font-size: var(--c-fs-h6); letter-spacing: var(--c-tracking-wide);
	padding: var(--c-gutter-md); text-align: left;
}
.trellis-table td { padding: var(--c-gutter-md); font-size: var(--c-size-body); color: var(--c-ink-soft); text-align: left; }
.trellis-table td:first-child { color: var(--c-text); font-weight: var(--c-font-medium); }
.trellis-table tbody tr:nth-child(even) { background: rgba(255,255,255,0.02); }
.trellis-table tbody tr:hover { background: rgba(255,255,255,0.04); }

/* ---------- cta-block (CTA-01 Full-Width Strip) ---------- */
.frame { background: var(--c-secondary); padding-block: var(--c-sec-y); }
.frame-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
	display: flex; align-items: center; justify-content: space-between; gap: var(--c-gutter-lg);
}
.frame-text { max-width: 720px; }
.frame-title { font-family: var(--c-heading-font); font-weight: var(--c-weight-bold); font-size: var(--c-fs-h2); text-transform: uppercase; color: var(--c-bg); margin: 0; }
.frame-description { font-family: var(--c-font-text); font-size: var(--c-size-body); line-height: var(--c-leading-normal); color: var(--c-bg); margin-top: var(--c-spacing-sm); max-width: 580px; }
.frame-button {
	flex-shrink: 0; min-width: 220px;
	display: inline-flex; align-items: center; justify-content: center;
	height: 56px; padding-inline: var(--c-gutter-lg);
	background: var(--c-bg); color: var(--c-accent-main);
	font-family: var(--c-heading-font); font-weight: var(--c-weight-bold);
	text-transform: uppercase; letter-spacing: var(--c-tracking-wide);
	border-radius: var(--c-radius-md);
	transition: transform var(--c-speed-base) var(--c-ease-spring), background var(--c-speed-base), color var(--c-speed-base);
}
.frame-button:hover { background: var(--c-accent-main); color: var(--c-bg); transform: scale(1.03); }

/* ---------- author-byline (BYLINE-05 Horizontal Bar) ---------- */
.lozenge { background: var(--c-accent-main); padding-block: var(--c-gutter-lg); }
.lozenge-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
	display: flex; align-items: center; justify-content: space-between; gap: var(--c-gutter-md);
}
.lozenge-author-info { display: flex; align-items: center; gap: var(--c-gutter-md); }
.lozenge-portrait { width: 56px; height: 56px; border-radius: var(--c-round-circle); object-fit: cover; }
.lozenge-text { display: block; }
.lozenge-name { margin: 0; font-family: var(--c-heading-font); font-weight: var(--c-weight-bold); font-size: var(--c-type-h5); }
.lozenge-name a { color: var(--c-bg); }
.lozenge-name a:hover { color: var(--c-gradient-mid); }
.lozenge-role { margin: 0; font-size: var(--c-type-small); color: var(--c-bg); opacity: 0.75; }
.lozenge-cta {
	display: inline-flex; align-items: center;
	padding: var(--c-spacing-sm) var(--c-gutter-md);
	background: var(--c-bg); color: var(--c-accent-main);
	border: 1px solid var(--c-bg);
	border-radius: var(--c-radius-pill);
	font-weight: var(--c-font-medium); white-space: nowrap;
	transition: background var(--c-duration-fast), color var(--c-duration-fast);
}
.lozenge-cta:hover { background: var(--c-gradient-mid); color: var(--c-text); }

/* ---------- author-card (AUTH-07 Quote-Style with Portrait) ---------- */
.filigree { padding-block: var(--c-sec-y); }
.filigree-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.filigree-card {
	background: var(--c-surface-2);
	padding: var(--c-gutter-lg);
	border-radius: var(--c-radius-md);
	border-left: 4px solid var(--c-secondary);
	display: grid; grid-template-columns: 100px 1fr; gap: var(--c-gutter-lg);
	align-items: start;
}
.filigree-portrait { width: 100px; height: 100px; border-radius: var(--c-round-circle); object-fit: cover; }
.filigree-body { display: block; }
.filigree-quote-mark { display: block; font-family: var(--c-heading-font); font-size: var(--c-type-h1); color: var(--c-secondary); line-height: 1; }
.filigree-bio { font-style: italic; font-size: var(--c-type-h5); line-height: var(--c-leading-normal); color: var(--c-text); margin: 0 0 var(--c-gutter-md); }
.filigree-attribution { font-size: var(--c-type-small); letter-spacing: var(--c-tracking-wide); color: var(--c-ink-soft); margin: 0; }
.filigree-articles { margin-top: var(--c-gutter-lg); }
.filigree-articles-heading { font-size: var(--c-size-h4); color: var(--c-text); }
.filigree-articles-list { list-style: none; display: flex; flex-direction: column; gap: var(--c-spacing-sm); }
.filigree-articles-item { border-bottom: 1px solid var(--c-color-hairline); padding-bottom: var(--c-spacing-sm); }
.filigree-articles-item a { color: var(--c-secondary); }
.filigree-articles-item a:hover { color: var(--c-accent-dark); }

/* ---------- contact-form (FORM-03 Compact Single-Field) ---------- */
.loft { padding-block: var(--c-spacing-xl); }
.loft-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.loft-intro { text-align: center; font-size: var(--c-size-body); color: var(--c-ink-soft); max-width: 540px; margin-inline: auto; margin-bottom: var(--c-gutter-lg); }
.loft-form { max-width: 540px; margin-inline: auto; display: flex; flex-direction: column; gap: var(--c-gutter-md); }
.loft-field { display: flex; flex-direction: column; gap: var(--c-gutter-xs); }
.loft-label { font-size: var(--c-type-small); font-weight: var(--c-font-medium); color: var(--c-text); }
.loft-input {
	width: 100%; padding: var(--c-spacing-sm) var(--c-gutter-md);
	background: var(--c-surface-2); color: var(--c-text);
	border: 1px solid var(--c-color-hairline); border-radius: var(--c-round-xs);
	font-family: var(--c-font-text); font-size: var(--c-size-body);
}
.loft-input:focus { outline: 2px solid var(--c-secondary); outline-offset: 1px; }
.loft-textarea { resize: vertical; min-height: 120px; }
.loft-submit {
	width: 100%; height: 52px;
	background: var(--c-secondary); color: var(--c-bg);
	border: 0; border-radius: var(--c-radius-pill);
	font-family: var(--c-heading-font); font-weight: var(--c-weight-bold);
	text-transform: uppercase; letter-spacing: var(--c-tracking-wide); cursor: pointer;
	transition: background var(--c-duration-fast);
}
.loft-submit:hover { background: var(--c-accent-dark); color: var(--c-bg); }
.loft-success { text-align: center; color: var(--c-accent-main); font-weight: var(--c-font-medium); }

/* ---------- legal (LEGAL-07 Magazine Editorial) ---------- */
.hutch { padding-block: var(--c-sec-y); }
.hutch-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.hutch-eyebrow { font-size: var(--c-size-xs); text-transform: uppercase; letter-spacing: var(--c-tracking-wide); color: var(--c-ink-soft); margin-bottom: var(--c-spacing-sm); }
.hutch-intro { font-family: var(--c-heading-font); font-style: italic; font-size: var(--c-size-h4); color: var(--c-text); line-height: var(--c-leading-normal); max-width: 720px; }
.hutch-section { margin-top: var(--c-gutter-lg); }
.hutch-h3 { font-family: var(--c-heading-font); font-style: italic; font-size: var(--c-text-h3); color: var(--c-text); margin-bottom: var(--c-spacing-sm); }
.hutch-divider { width: 80px; height: 2px; background: var(--c-secondary); border: 0; margin: 0 0 var(--c-gutter-md); }
.hutch-section p { font-size: var(--c-size-body); line-height: var(--c-lh-loose); color: var(--c-ink-soft); max-width: 720px; }
.hutch-section p:first-of-type::first-letter { font-size: 3em; float: left; line-height: 0.9; padding-right: var(--c-gutter-xs); color: var(--c-secondary); font-family: var(--c-heading-font); font-weight: var(--c-weight-bold); }
.hutch-list { list-style: disc; padding-left: var(--c-gutter-lg); max-width: 720px; color: var(--c-ink-soft); }
.hutch-list li { margin-bottom: var(--c-spacing-sm); }
.hutch-disclaimer { margin-top: var(--c-gutter-lg); font-size: var(--c-type-small); color: var(--c-ink-soft); font-style: italic; max-width: 720px; }

/* ---------- cookie-banner (COOK-03 Corner Card) ---------- */
.shelf {
	position: fixed; inset-block-end: var(--c-gutter-md); inset-inline-end: var(--c-gutter-md);
	width: 360px; max-width: calc(100vw - 2 * var(--c-gutter-md)); z-index: 90;
}
.shelf-body {
	background: var(--c-surface-2);
	border: 1px solid rgba(255,255,255,0.1);
	border-radius: var(--c-round-lg);
	padding: var(--c-gutter-lg);
	box-shadow: var(--c-elevation-3);
	display: flex; flex-direction: column; gap: var(--c-gutter-md);
	animation: shelf-in var(--c-transition-slow) var(--c-ease-spring);
}
@keyframes shelf-in { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.shelf-title { margin: 0; font-family: var(--c-heading-font); font-weight: var(--c-weight-bold); font-size: var(--c-type-h5); text-transform: uppercase; color: var(--c-secondary); }
.shelf-message { margin: 0; font-size: var(--c-type-small); line-height: var(--c-leading-normal); color: var(--c-ink-soft); }
.shelf-actions { display: flex; gap: var(--c-spacing-sm); }
.shelf-button { width: 50%; height: 40px; border-radius: var(--c-radius-md); font-family: var(--c-font-text); font-weight: var(--c-font-medium); cursor: pointer; }
.shelf-button--c-accept { background: var(--c-secondary); color: var(--c-bg); border: 1px solid var(--c-secondary); }
.shelf-button--c-accept:hover { background: var(--c-accent-dark); color: var(--c-bg); }
.shelf-button--c-decline { background: var(--c-surface-2); color: var(--c-text); border: 1px solid var(--c-color-hairline); }
.shelf-button--c-decline:hover { background: rgba(255,255,255,0.12); color: var(--c-text); }

/* ---------- error (ERR-06 Bordered Card) ---------- */
.banner { padding-block: var(--c-sec-y); }
.banner-box {
	background: var(--c-surface-2);
	border: 2px solid var(--c-secondary);
	border-radius: var(--c-round-lg);
	padding: var(--c-gutter-lg);
	max-width: 720px; margin-inline: auto;
	box-shadow: var(--c-elevation-2);
	display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--c-gutter-md);
}
.banner-title { font-size: var(--c-fs-h2); color: var(--c-text); margin: 0; }
.banner-text { color: var(--c-ink-soft); margin: 0; max-width: 540px; }
.banner-button {
	display: inline-flex; align-items: center; height: 52px; padding-inline: var(--c-gutter-lg);
	background: var(--c-secondary); color: var(--c-bg);
	font-family: var(--c-heading-font); font-weight: var(--c-weight-bold);
	text-transform: uppercase; letter-spacing: var(--c-tracking-wide); border-radius: var(--c-radius-pill);
	transition: background var(--c-duration-fast);
}
.banner-button:hover { background: var(--c-accent-dark); color: var(--c-bg); }

/* ---------- footer (FOOT-02 Two-Row Brand + Nav) ---------- */
.trefoil { background: var(--c-bg); border-top: 1px solid rgba(255,255,255,0.1); padding-block: var(--c-spacing-xl); }
.trefoil-inner {
	max-width: calc(var(--c-wrapper) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
}
.trefoil-row { display: flex; align-items: center; justify-content: space-between; gap: var(--c-gutter-md); }
.trefoil-row--top { flex-wrap: wrap; }
.trefoil-row--bottom { border-top: 1px solid rgba(255,255,255,0.08); padding-top: var(--c-gutter-md); margin-top: var(--c-gutter-lg); }
.trefoil-logo { flex-shrink: 0; display: inline-flex; }
.trefoil-logo-img { display: block; height: 72px; width: auto; }
.trefoil-logo img { height: 72px; width: auto; }
.trefoil-nav ul, .trefoil-legal-nav ul { list-style: none; display: flex; flex-wrap: wrap; gap: var(--c-gutter-lg); }
.trefoil-nav a { font-family: var(--c-heading-font); font-weight: var(--c-font-medium); color: var(--c-ink-soft); }
.trefoil-nav a:hover { color: var(--c-text); }
.trefoil-copy { font-size: var(--c-size-xs); color: var(--c-ink-soft); }
.trefoil-legal-nav ul { gap: var(--c-gutter-md); }
.trefoil-legal-nav a { font-size: var(--c-size-xs); color: var(--c-ink-soft); }
.trefoil-legal-nav a:hover { color: var(--c-text); }

/* ---------- mobile overrides (BP-02) ---------- */
@media (max-width: 1180px) {
	.pillar-inner, .court-list, .dormer-content, .promenade-inner, .harbor-inner,
	.lectern-inner, .vault-inner, .pergola-inner, .trellis-inner, .frame-inner,
	.lozenge-inner, .filigree-inner, .loft-inner, .hutch-inner, .trefoil-inner {
		padding-inline: var(--c-container-padding-tablet);
	}
	.lectern-grid { grid-template-columns: repeat(2, 1fr); }
	.lectern-card--lg, .lectern-card--wide { grid-column: span 2; grid-row: auto; }
}
@media (max-width: 820px) {
	:root {
		--c-type-h1: 28px; --c-fs-h2: 24px; --c-text-h3: 20px; --c-size-h4: 18px;
		--c-type-h5: 16px; --c-size-body: 16px; --c-type-small: 14px; --c-size-xs: 12px;
	}
	.pillar-row--top { min-height: var(--c-nav-h-mobile); }
	.pillar-row--bottom { display: none; }
	.pillar-toggle { display: flex; }
	.pillar-logo img { height: 64px; }
	.dormer-track { height: 380px; }
	.dormer-title { font-size: 32px; }
	.dormer-prev, .dormer-next { display: none; }
	.frame-inner { flex-direction: column; align-items: flex-start; }
	.frame-button { width: 100%; }
	.harbor-body { padding-left: var(--c-gutter-md); }
	.lectern-grid { grid-template-columns: 1fr; }
	.lectern-card--lg, .lectern-card--wide { grid-column: auto; }
	.lozenge-inner { flex-direction: column; align-items: flex-start; }
	.lozenge-cta { width: 100%; justify-content: center; }
	.filigree-card { grid-template-columns: 1fr; }
	.trefoil-row { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 720px) {
	.pillar-inner, .court-list, .dormer-content, .promenade-inner, .harbor-inner,
	.lectern-inner, .vault-inner, .pergola-inner, .trellis-inner, .frame-inner,
	.lozenge-inner, .filigree-inner, .loft-inner, .hutch-inner, .trefoil-inner {
		padding-inline: var(--c-inset-mobile);
	}
	.shelf, .shelf-body { padding: 0; }
	.shelf { inset-inline: var(--c-gutter-md); width: auto; }
	.shelf-body { padding: 14px 16px; gap: 8px; }
	.shelf-message { font-size: 13px; line-height: 1.35; }
	.shelf-button { min-height: 36px; font-size: 12px; }
}
