@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400&family=Lora:ital,wght@0,400;1,400&display=swap');
:root {
  
  --stone-0: #FBFAF7; --stone-50: #F5F3EE; --stone-100: #ECE9E2; --stone-200: #DDD9CF; --stone-300: #C4BFB3; --stone-400: #9C968A; --stone-500: #7A756B; --stone-600: #5C5852; --stone-700: #3F3C37; --stone-800: #2A2825; --stone-900: #1C1B18; --stone-950: #141310; --stone-1000: #0D0C0A;
  
  --clay-50: #FBF1EC; --clay-100: #F5DDD1; --clay-200: #EBBBA6; --clay-300: #DE9878; --clay-400: #CC7652; --clay-500: #B85C38; --clay-600: #9A4A2C; --clay-700: #7C3B23; --clay-800: #5E2D1B; --clay-900: #3F1E12;
  
  --olive-50: #F2F4EC; --olive-100: #E1E6D3; --olive-200: #C4CDA8; --olive-300: #A3B07F; --olive-400: #86955F; --olive-500: #6B7A4B; --olive-600: #56633C; --olive-700: #434D2F; --olive-800: #303722; --olive-900: #1F2416;
}
:root, [data-theme="light"] {
  color-scheme: light;
  --color-bg-canvas: #FBFAF7; --color-bg-surface: #FFFFFF; --color-bg-subtle: #F5F3EE; --color-bg-muted: #ECE9E2; --color-bg-inverse: #141310; --color-bg-overlay: rgb(13 12 10 / 0.6);
  --color-bg-image-scrim: linear-gradient(180deg, rgb(13 12 10 / 0) 40%, rgb(13 12 10 / 0.7) 100%);
  --color-fg-primary: #141310; --color-fg-secondary: #5C5852; --color-fg-tertiary: #7A756B; --color-fg-disabled: #C4BFB3; --color-fg-inverse: #FBFAF7; --color-fg-on-image: #FBFAF7; --color-fg-link: #141310;
  --color-border-subtle: #ECE9E2; --color-border-default: #DDD9CF; --color-border-strong: #141310; --color-border-focus: #B85C38;
  --color-primary: #B85C38; --color-primary-hover: #9A4A2C; --color-primary-active: #7C3B23; --color-primary-subtle: #FBF1EC; --color-primary-fg: #FFFFFF;
  --color-secondary: #6B7A4B; --color-secondary-hover: #56633C; --color-secondary-active: #434D2F; --color-secondary-subtle: #F2F4EC; --color-secondary-fg: #FFFFFF;
  --color-success: #3F7A4A; --color-success-subtle: #EEF5EC; --color-success-fg: #264D2E;
  --color-warning: #C48A1E; --color-warning-subtle: #FBF4E4; --color-warning-fg: #7A5512;
  --color-error: #B8402E; --color-error-subtle: #FBECEA; --color-error-fg: #74271C;
  --color-info: #4B6478; --color-info-subtle: #EDF1F4; --color-info-fg: #2E3E4C;
  --shadow-sm: 0 1px 2px rgb(20 18 15 / 0.06); --shadow-md: 0 4px 12px rgb(20 18 15 / 0.08); --shadow-lg: 0 16px 40px rgb(20 18 15 / 0.12);
}
[data-theme="dark"] {
  color-scheme: dark;
  --color-bg-canvas: #0D0C0A; --color-bg-surface: #141310; --color-bg-subtle: #1C1B18; --color-bg-muted: #2A2825; --color-bg-inverse: #FBFAF7; --color-bg-overlay: rgb(0 0 0 / 0.72);
  --color-fg-primary: #F5F3EE; --color-fg-secondary: #C4BFB3; --color-fg-tertiary: #9C968A; --color-fg-disabled: #5C5852; --color-fg-inverse: #141310; --color-fg-on-image: #FBFAF7; --color-fg-link: #F5F3EE;
  --color-border-subtle: #2A2825; --color-border-default: #3F3C37; --color-border-strong: #F5F3EE; --color-border-focus: #DE9878;
  --color-primary: #DE9878; --color-primary-hover: #EBBBA6; --color-primary-active: #CC7652; --color-primary-subtle: #3F1E12; --color-primary-fg: #141310;
  --color-secondary: #A3B07F; --color-secondary-hover: #C4CDA8; --color-secondary-active: #86955F; --color-secondary-subtle: #1F2416; --color-secondary-fg: #141310;
  --color-success: #8FC49A; --color-success-subtle: #172A1B; --color-success-fg: #D5E8D0;
  --color-warning: #E8B85A; --color-warning-subtle: #2E2410; --color-warning-fg: #F5E3B4;
  --color-error: #E8846F; --color-error-subtle: #2E1512; --color-error-fg: #F4CDC8;
  --color-info: #9AB0C2; --color-info-subtle: #161D24; --color-info-fg: #D3DDE5;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.4); --shadow-md: 0 4px 12px rgb(0 0 0 / 0.5); --shadow-lg: 0 16px 40px rgb(0 0 0 / 0.6);
}

:root {
  --font-display: "Instrument Serif", "Cormorant Garamond", "Times New Roman", Georgia, serif;
  --font-sans: "Inter", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;
  --weight-regular: 400;  --weight-medium: 500;  --weight-semibold: 600; 
  --text-display-xl: clamp(4rem, 2.2rem + 7.6vw, 9rem); 
  --text-display-lg: clamp(3rem, 1.9rem + 4.7vw, 6rem); 
  --text-display-md: clamp(2.25rem, 1.8rem + 1.9vw, 3.5rem); 
  --text-display-sm: clamp(1.75rem, 1.57rem + 0.75vw, 2.25rem); 
  --text-heading: clamp(1.25rem, 1.16rem + 0.38vw, 1.5rem); 
  --text-lead: clamp(1.125rem, 1.08rem + 0.19vw, 1.25rem); 
  --text-body: 1rem; --text-body-sm: 0.875rem; --text-caption: 0.75rem; --text-eyebrow: 0.75rem; --text-index: 0.875rem;
  --leading-display-xl: 0.92;  --leading-display-lg: 0.96;  --leading-display-md: 1.05;  --leading-display-sm: 1.15;  --leading-heading: 1.3;  --leading-body: 1.6;  --leading-tight: 1.2; 
  --tracking-display: -0.02em;  --tracking-display-sm: -0.01em;  --tracking-body: 0;  --tracking-eyebrow: 0.12em;  --tracking-index: 0.04em; 
}
.text-display-xl { font-family: var(--font-display); font-size: var(--text-display-xl); line-height: var(--leading-display-xl); letter-spacing: var(--tracking-display); font-weight: 400; }
.text-display-lg { font-family: var(--font-display); font-size: var(--text-display-lg); line-height: var(--leading-display-lg); letter-spacing: var(--tracking-display); font-weight: 400; }
.text-display-md { font-family: var(--font-display); font-size: var(--text-display-md); line-height: var(--leading-display-md); letter-spacing: var(--tracking-display-sm); font-weight: 400; }
.text-display-sm { font-family: var(--font-display); font-size: var(--text-display-sm); line-height: var(--leading-display-sm); letter-spacing: -0.005em; font-weight: 400; }
.text-heading    { font-family: var(--font-sans); font-size: var(--text-heading); line-height: var(--leading-heading); letter-spacing: -0.01em; font-weight: 500; }
.text-lead       { font-family: var(--font-sans); font-size: var(--text-lead); line-height: 1.5; }
.text-body       { font-family: var(--font-sans); font-size: var(--text-body); line-height: var(--leading-body); }
.text-body-sm    { font-family: var(--font-sans); font-size: var(--text-body-sm); line-height: 1.55; }
.text-caption    { font-family: var(--font-sans); font-size: var(--text-caption); line-height: 1.45; letter-spacing: 0.01em; }
.text-eyebrow    { font-family: var(--font-mono); font-size: var(--text-eyebrow); line-height: 1.2; letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; font-weight: 400; }
.text-index      { font-family: var(--font-mono); font-size: var(--text-index); line-height: 1; letter-spacing: var(--tracking-index); font-variant-numeric: tabular-nums; }

:root {
  --space-0: 0; --space-px: 1px; --space-0-5: 0.125rem; --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem; --space-12: 3rem; --space-16: 4rem; --space-20: 5rem; --space-24: 6rem; --space-32: 8rem; --space-40: 10rem; --space-48: 12rem;
  --section-gap: var(--space-16); --gutter: var(--space-4); --stack-gap: var(--space-6);
}
@media (min-width: 48rem) { :root { --section-gap: var(--space-24); --gutter: var(--space-6); --stack-gap: var(--space-8); } }
@media (min-width: 64rem) { :root { --section-gap: var(--space-32); --gutter: var(--space-8); } }

:root {
  --radius-none: 0; --radius-xs: 2px; --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-full: 9999px;
  --border-hairline: 1px; --border-thick: 2px;
  --z-hide: -1;  --z-base: 0;  --z-raised: 10;  --z-sticky: 20;  --z-dropdown: 30;  --z-header: 40;  --z-overlay: 50;  --z-modal: 60;  --z-toast: 70;  --z-tooltip: 80;  --z-max: 9999; 
  --duration-instant: 80ms;  --duration-fast: 160ms;  --duration-base: 280ms;  --duration-slow: 480ms;  --duration-reveal: 900ms; 
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); 
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1); 
  --ease-in-quart: cubic-bezier(0.5, 0, 0.75, 0); 
  --ease-image: cubic-bezier(0.25, 1, 0.5, 1); 
  --header-height: 4.5rem; 
}

*, *::before, *::after { box-sizing: border-box; margin: 0; }
html { -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; scroll-behavior: smooth; scroll-padding-top: var(--header-height, 4.5rem); }
body { font-family: var(--font-sans); font-size: var(--text-body); line-height: var(--leading-body); color: var(--color-fg-primary); background: var(--color-bg-canvas); min-height: 100dvh; font-feature-settings: "kern", "liga", "ss01"; }
img, picture, video, svg { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4, h5, h6 { font-weight: inherit; font-size: inherit; text-wrap: balance; }
p { text-wrap: pretty; }
:where(ul, ol)[role="list"] { list-style: none; padding: 0; }
a { color: var(--color-fg-link); text-decoration: underline; text-underline-offset: 0.18em; text-decoration-thickness: 1px; text-decoration-color: var(--color-border-default); }
a:hover { text-decoration-color: currentColor; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}
.container, .container-wide, .container-narrow, .container-prose { width: 100%; margin-inline: auto; padding-inline: var(--gutter); }
.container { max-width: calc(90rem + 2 * var(--gutter)); }
.container-wide { max-width: calc(110rem + 2 * var(--gutter)); }
.container-narrow { max-width: calc(50rem + 2 * var(--gutter)); }
.container-prose { max-width: calc(65ch + 2 * var(--gutter)); }
.full-bleed { width: 100vw; margin-inline: calc(50% - 50vw); }
.grid { display: grid; gap: var(--gutter); grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (min-width: 48rem) { .grid { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
@media (min-width: 64rem) { .grid { grid-template-columns: repeat(12, minmax(0, 1fr)); } }
.split { display: grid; gap: var(--space-8); grid-template-columns: 1fr; }
@media (min-width: 64rem) { .split { grid-template-columns: 3fr 9fr; gap: var(--gutter); } }
.section { padding-block: var(--section-gap); }
.section + .section { border-top: var(--border-hairline) solid var(--color-border-subtle); }
.section-header { display: grid; gap: var(--space-4); margin-bottom: var(--space-12); }
@media (min-width: 64rem) { .section-header { margin-bottom: var(--space-16); } }
:focus { outline: none; }
:focus-visible { outline: var(--border-thick) solid var(--color-border-focus); outline-offset: 2px; border-radius: var(--radius-xs); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline-offset: 0; border-color: var(--color-border-strong); }
[data-surface="inverse"] :focus-visible { outline-color: var(--color-fg-inverse); }
@media (forced-colors: active) { :focus-visible { outline: 2px solid CanvasText; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: var(--space-2); left: var(--space-2); z-index: var(--z-max); transform: translateY(-200%); background: var(--color-bg-inverse); color: var(--color-fg-inverse); padding: var(--space-3) var(--space-5); transition: transform var(--duration-fast) var(--ease-standard); }
.skip-link:focus { transform: translateY(0); }
.stack > * + * { margin-top: var(--stack-gap); }
.cluster { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.rule { border: 0; border-top: var(--border-hairline) solid var(--color-border-subtle); }
.rule-strong { border-top-color: var(--color-border-strong); }
.scrim { position: absolute; inset: 0; background: var(--color-bg-image-scrim); pointer-events: none; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); height: 44px; padding-inline: var(--space-5); font-family: var(--font-sans); font-size: var(--text-body-sm); font-weight: 500; letter-spacing: 0.01em; border-radius: var(--radius-sm); border: 1px solid transparent; cursor: pointer; user-select: none; white-space: nowrap; text-decoration: none; background: transparent; color: var(--color-fg-primary); transition: background-color var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard), transform var(--duration-instant) var(--ease-standard); }
.btn[data-size="sm"] { height: 36px; padding-inline: var(--space-4); }
.btn[data-size="lg"] { height: 56px; padding-inline: var(--space-8); font-size: var(--text-body); }
.btn[data-variant="primary"] { background: var(--color-bg-inverse); color: var(--color-fg-inverse); }
.btn[data-variant="secondary"] { background: var(--color-bg-surface); border: 2px solid var(--color-border-strong); }
.btn[data-variant="outline"] { border: 1px solid var(--color-border-default); }
.btn[data-variant="link"] { padding: 0; height: auto; text-decoration: underline; text-underline-offset: 0.18em; text-decoration-thickness: 1px; text-decoration-color: var(--color-border-default); }
.btn[data-variant="destructive"] { background: var(--color-error); color: #FFFFFF; }
@media (hover: hover) {
  .btn[data-variant="primary"]:hover { background: var(--color-primary); }
  .btn[data-variant="secondary"]:hover { border-color: var(--color-primary); color: var(--color-primary); }
  .btn[data-variant="outline"]:hover { border-color: var(--color-border-strong); background: var(--color-bg-subtle); }
  .btn[data-variant="ghost"]:hover { background: var(--color-bg-subtle); }
  .btn[data-variant="link"]:hover { text-decoration-color: currentColor; }
  .btn[data-variant="link"]:hover .btn__arrow { transform: translateX(4px); }
  .btn[data-variant="destructive"]:hover { background: var(--color-error-fg); }
}
.btn[data-variant="primary"]:active { background: var(--color-primary-active); transform: scale(0.98); }
.btn[data-variant="secondary"]:active, .btn[data-variant="outline"]:active, .btn[data-variant="ghost"]:active { background: var(--color-bg-muted); transform: scale(0.98); }
.btn:disabled, .btn[aria-disabled="true"] { background: var(--color-bg-muted); color: var(--color-fg-disabled); border-color: transparent; cursor: not-allowed; transform: none; }
.btn[data-variant="link"]:disabled, .btn[data-variant="link"][aria-disabled="true"] { background: transparent; text-decoration: none; }
.btn[data-icon-only="true"] { width: 44px; padding-inline: 0; }
.btn[data-icon-only="true"][data-size="sm"] { width: 36px; }
.btn[data-icon-only="true"][data-size="lg"] { width: 56px; }
.btn[data-full-width="true"] { width: 100%; }
.btn[data-state="loading"] { pointer-events: none; }
.btn[data-state="loading"] .btn__label { opacity: 0; }
.btn__spinner { position: absolute; width: 14px; height: 14px; border: 1.5px solid currentColor; border-right-color: transparent; border-radius: var(--radius-full); animation: btn-spin 0.7s linear infinite; }
@keyframes btn-spin { to { transform: rotate(360deg); } }
.btn__arrow { display: inline-block; transition: transform var(--duration-fast) var(--ease-standard); }

.field { display: grid; gap: var(--space-2); font-family: var(--font-sans); }
.field__label { font-size: var(--text-body-sm); font-weight: 500; color: var(--color-fg-primary); }
.field__control { position: relative; display: flex; align-items: center; }
.field__control input, .field__control textarea { width: 100%; height: 44px; padding-inline: var(--space-4); background: var(--color-bg-surface); border: 1px solid var(--color-border-default); border-radius: var(--radius-xs); color: var(--color-fg-primary); transition: border-color var(--duration-fast) var(--ease-standard), background-color var(--duration-fast) var(--ease-standard); }
.field__control textarea { height: auto; padding-block: var(--space-3); resize: vertical; }
.field__control input::placeholder, .field__control textarea::placeholder { color: var(--color-fg-tertiary); }
.field[data-size="sm"] .field__control input { height: 36px; padding-inline: var(--space-3); font-size: var(--text-body-sm); }
.field[data-size="lg"] .field__control input { height: 56px; padding-inline: var(--space-5); font-size: var(--text-lead); }
.field[data-variant="underline"] .field__control input, .field[data-variant="underline"] .field__control textarea { background: transparent; border: 0; border-bottom: 1px solid var(--color-border-default); border-radius: 0; padding-inline: 0; }
.field[data-variant="filled"] .field__control input, .field[data-variant="filled"] .field__control textarea { background: var(--color-bg-subtle); border-color: transparent; }
@media (hover: hover) { .field__control input:hover, .field__control textarea:hover { border-color: var(--color-border-strong); } }
.field__control input:focus-visible, .field__control textarea:focus-visible { border-color: var(--color-border-strong); }
.field[data-invalid="true"] .field__control input, .field[data-invalid="true"] .field__control textarea { border-color: var(--color-error); }
.field__control input:disabled, .field__control textarea:disabled { background: var(--color-bg-muted); border-color: var(--color-border-subtle); color: var(--color-fg-disabled); cursor: not-allowed; }
.field__help { font-size: var(--text-body-sm); color: var(--color-fg-tertiary); }
.field__error { font-size: var(--text-body-sm); color: var(--color-error); }
.field__affix { position: absolute; color: var(--color-fg-tertiary); pointer-events: none; }
.field__affix--prefix { left: var(--space-4); }
.field__affix--suffix { right: var(--space-4); }
.field[data-prefix="true"] .field__control input { padding-left: var(--space-8); }

.card { position: relative; font-family: var(--font-sans); background: var(--color-bg-surface); border: 1px solid var(--color-border-subtle); border-radius: var(--radius-none); color: var(--color-fg-primary); }
.card[data-variant="flat"] { background: transparent; border: 0; }
.card[data-variant="elevated"] { border: 0; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.card[data-variant="inverse"] { background: var(--color-bg-inverse); color: var(--color-fg-inverse); border: 0; }
.card a.card__link { position: absolute; inset: 0; z-index: var(--z-raised); }
.card__media { overflow: hidden; aspect-ratio: 4 / 5; margin: 0; }
.card__media img, .card__media .card__placeholder { width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-slow) var(--ease-image); }
.card__body { padding: var(--space-6); display: grid; gap: var(--space-2); }
.card[data-variant="flat"] .card__body { padding-inline: 0; padding-block: var(--space-4) var(--space-6); border-bottom: 1px solid var(--color-border-subtle); transition: border-color var(--duration-fast) var(--ease-standard); }
.card__footer { padding: var(--space-4) var(--space-6); border-top: 1px solid var(--color-border-subtle); }
.card__meta { font-size: var(--text-body-sm); color: var(--color-fg-secondary); }
@media (hover: hover) {
  .card[data-interactive="true"]:hover .card__media img, .card[data-interactive="true"]:hover .card__media .card__placeholder { transform: scale(1.04); }
  .card[data-interactive="true"][data-variant="flat"]:hover .card__body { border-color: var(--color-border-strong); }
}
.card[data-selected="true"] { border: 2px solid var(--color-border-strong); }

.badge { display: inline-flex; align-items: center; gap: var(--space-1); height: 24px; padding-inline: var(--space-3); border-radius: var(--radius-xs); font-family: var(--font-mono); font-size: var(--text-eyebrow); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; line-height: 1; background: var(--color-bg-subtle); color: var(--color-fg-secondary); white-space: nowrap; }
.badge[data-size="sm"] { height: 20px; padding-inline: var(--space-2); font-size: 11px; }
.badge[data-size="lg"] { height: 28px; font-family: var(--font-mono); font-size: var(--text-index); letter-spacing: var(--tracking-index); text-transform: none; }
.badge[data-shape="pill"] { border-radius: var(--radius-full); }
.badge[data-variant="outline"] { background: transparent; border: 1px solid var(--color-border-default); color: var(--color-fg-primary); }
.badge[data-variant="primary"] { background: var(--color-primary-subtle); color: var(--color-primary); }
.badge[data-variant="secondary"] { background: var(--color-secondary-subtle); color: var(--color-secondary); }
.badge[data-variant="success"] { background: var(--color-success-subtle); color: var(--color-success-fg); }
.badge[data-variant="warning"] { background: var(--color-warning-subtle); color: var(--color-warning-fg); }
.badge[data-variant="error"] { background: var(--color-error-subtle); color: var(--color-error-fg); }
.badge[data-variant="info"] { background: var(--color-info-subtle); color: var(--color-info-fg); }
.badge[data-variant="inverse"] { background: var(--color-bg-inverse); color: var(--color-fg-inverse); }
.badge__dot { width: 6px; height: 6px; border-radius: var(--radius-full); background: currentColor; }
.badge__remove { all: unset; cursor: pointer; margin-left: var(--space-1); line-height: 1; font-family: var(--font-sans); }

.modal { border: 0; padding: 0; margin: auto; max-width: min(640px, calc(100vw - 2 * var(--gutter))); width: 100%; background: var(--color-bg-surface); color: var(--color-fg-primary); box-shadow: var(--shadow-lg); z-index: var(--z-modal); }
.modal[data-size="sm"] { max-width: min(480px, calc(100vw - 2 * var(--gutter))); }
.modal[data-size="lg"] { max-width: min(880px, calc(100vw - 2 * var(--gutter))); }
.modal::backdrop { background: var(--color-bg-overlay); }
.modal[open] { animation: modal-in var(--duration-slow) var(--ease-out-expo); }
.modal[open]::backdrop { animation: fade-in var(--duration-base) var(--ease-standard); }
@keyframes modal-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes fade-in { from { opacity: 0; } }
.modal__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); padding: var(--space-10) var(--space-10) 0; }
.modal__body { padding: var(--space-6) var(--space-10); overflow-y: auto; }
.modal__footer { display: flex; justify-content: flex-end; gap: var(--space-3); padding: var(--space-6) var(--space-10); border-top: 1px solid var(--color-border-subtle); }
@media (max-width: 47.99rem) { .modal__header { padding: var(--space-6) var(--space-6) 0; } .modal__body, .modal__footer { padding-inline: var(--space-6); } }

.toast { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4) var(--space-5); background: var(--color-bg-inverse); color: var(--color-fg-inverse); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); font-family: var(--font-sans); font-size: var(--text-body-sm); z-index: var(--z-toast); }
.toast[data-variant="error"] { background: var(--color-error); color: #FFFFFF; }
.toast[data-variant="success"] .toast__dot { background: var(--color-success); }
.toast__dot { width: 6px; height: 6px; border-radius: var(--radius-full); background: var(--color-fg-inverse); flex: none; }

.tooltip { position: absolute; padding: var(--space-2) var(--space-3); background: var(--color-bg-inverse); color: var(--color-fg-inverse); border-radius: var(--radius-sm); font-family: var(--font-sans); font-size: var(--text-caption); line-height: 1.45; white-space: nowrap; z-index: var(--z-tooltip); pointer-events: none; }

.navbar { position: sticky; top: 0; height: var(--header-height); display: flex; align-items: center; z-index: var(--z-header); transition: background-color var(--duration-base) var(--ease-standard), border-color var(--duration-base) var(--ease-standard); border-bottom: 1px solid transparent; }
.navbar[data-variant="solid"] { background: color-mix(in srgb, var(--color-bg-canvas) 85%, transparent); backdrop-filter: blur(12px); border-bottom-color: var(--color-border-subtle); }
.navbar[data-variant="transparent"] { color: var(--color-fg-on-image); }
.navbar__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); width: 100%; }
.navbar__brand { font-family: var(--font-display); font-size: 1.375rem; letter-spacing: -0.01em; text-decoration: none; color: inherit; white-space: nowrap; }
.navbar__links { display: flex; align-items: center; gap: var(--space-3); }
.navbar__link { font-family: var(--font-mono); font-size: var(--text-eyebrow); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; text-decoration: none; color: inherit; opacity: 0.85; transition: opacity var(--duration-fast) var(--ease-standard); }
.navbar__sep { opacity: 0.4; font-family: var(--font-mono); font-size: var(--text-eyebrow); }
@media (hover: hover) { .navbar__link:hover { opacity: 1; text-decoration: underline; text-underline-offset: 0.3em; text-decoration-thickness: 1px; } }

.stat { margin: 0; display: grid; gap: var(--space-3); }
.stat dt { font-family: var(--font-mono); font-size: var(--text-eyebrow); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--color-fg-tertiary); }
.stat dd { margin: 0; font-family: var(--font-display); font-size: var(--text-display-lg); line-height: var(--leading-display-lg); letter-spacing: var(--tracking-display); font-variant-numeric: tabular-nums; }

.testimonial { margin: 0; display: grid; gap: var(--space-6); }
.testimonial blockquote { margin: 0; font-family: var(--font-display); font-size: var(--text-display-md); line-height: var(--leading-display-md); letter-spacing: var(--tracking-display-sm); font-style: italic; hanging-punctuation: first; }
.testimonial figcaption { display: flex; align-items: center; gap: var(--space-4); }
.testimonial__portrait { width: 48px; height: 48px; aspect-ratio: 1 / 1; object-fit: cover; background: var(--color-bg-muted); }

body { --font-display: 'Lora', Georgia, serif; }
section[id] { scroll-margin-top: calc(var(--header-height) + 8px); }
img { max-width: 100%; }
.site-header { position: fixed; top: 0; left: 0; right: 0; height: var(--header-height); display: flex; align-items: center; z-index: var(--z-header); border-bottom: 1px solid transparent; transition: background-color var(--duration-base) var(--ease-standard), border-color var(--duration-base) var(--ease-standard), color var(--duration-base) var(--ease-standard); color: var(--color-fg-on-image); }
.site-header.is-solid { background: color-mix(in srgb, var(--color-bg-canvas) 85%, transparent); backdrop-filter: blur(12px); border-bottom-color: var(--color-border-subtle); color: var(--color-fg-primary); }
.site-header .navbar__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); width: 100%; }
.site-header .navbar__links { display: flex; align-items: center; gap: var(--space-3); }
@media (max-width: 47.9375rem) { .site-header .navbar__links .navbar__link, .site-header .navbar__links .navbar__sep { display: none; } .site-header .navbar__links .navbar__link--cta { display: inline; } }

.hero { position: relative; min-height: 100dvh; display: flex; align-items: flex-end; overflow: hidden; background: linear-gradient(155deg, var(--stone-500), var(--stone-800) 60%, var(--stone-950)); }
.hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__overlay { position: absolute; inset: 0; background: rgba(13, 12, 10, 0.5); }
.hero__content { position: relative; padding-block: var(--space-16) var(--space-12); color: var(--color-fg-on-image); display: grid; gap: var(--space-6); }
.logo { font-family: 'Manrope', var(--font-sans, sans-serif); font-weight: 300; letter-spacing: -0.02em; line-height: 0.95; }
.logo__go { color: var(--color-accent-primary, #B85C38); }
.logo--sm { font-size: 1.125rem; font-weight: 400; }
.logo--md { font-size: var(--text-display-md); }
.logo--hero { font-size: clamp(2.5rem, 7vw, 5.5rem); }
.logo__sub { display: block; margin-top: var(--space-4); font-family: var(--font-mono); font-size: 0.75rem; font-weight: 400; letter-spacing: 0.4em; text-transform: uppercase; opacity: 0.7; }
.hero__title { max-width: none; white-space: nowrap; font-size: clamp(1.55rem, 6.2vw, 5.5rem); }
.hero__lead { max-width: 55ch; opacity: 0.9; }
.hero__question { font-family: var(--font-display); font-style: italic; font-size: var(--text-display-sm); line-height: var(--leading-display-sm); max-width: 30ch; }

.status { display: grid; gap: var(--space-5); justify-items: start; }
.status p { max-width: 65ch; color: var(--color-fg-secondary); }

.series-intro { display: grid; gap: var(--space-5); max-width: 65ch; }
.series-intro p { color: var(--color-fg-secondary); }
.series-question { max-width: 24ch; }

.parts-grid { display: grid; gap: var(--gutter); grid-template-columns: 1fr; margin-top: var(--space-12); }
@media (min-width: 40rem) and (max-width: 63.9375rem) { .parts-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); } .parts-grid .text-display-sm { font-size: 1.25rem; line-height: 1.15; } }
@media (min-width: 64rem) { .parts-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.part-card { text-decoration: none; color: inherit; display: block; }
.part-card .card__placeholder { background: linear-gradient(160deg, var(--stone-300), var(--stone-600)); }
.part-card:nth-child(2) .card__placeholder { background: linear-gradient(160deg, var(--stone-200), var(--stone-500)); }
.part-card:nth-child(3) .card__placeholder { background: linear-gradient(160deg, var(--stone-400), var(--stone-700)); }

.part { display: grid; gap: var(--space-8); }
@media (min-width: 48rem) and (max-width: 63.9375rem) { .part { grid-template-columns: minmax(0, 2fr) minmax(0, 7fr); gap: var(--gutter); } .part__still { grid-column: 1 / -1; } }
@media (min-width: 64rem) { .part { grid-template-columns: minmax(0, 3fr) minmax(0, 6fr) minmax(0, 3fr); gap: var(--gutter); align-items: stretch; } .part__label, .part__body { align-self: start; } }
.part__label { display: grid; gap: var(--space-3); justify-items: start; }
.part__body { display: grid; gap: var(--space-5); }
.part__body p { max-width: 65ch; color: var(--color-fg-secondary); }
.part__body .part-lead { color: var(--color-fg-primary); }
.part__question { font-family: var(--font-display); font-style: italic; font-size: var(--text-display-sm); line-height: var(--leading-display-sm); letter-spacing: -0.005em; max-width: 28ch; color: var(--color-fg-primary); }
.part__still { aspect-ratio: 3 / 2; width: 100%; object-fit: cover; background: linear-gradient(160deg, var(--stone-300), var(--stone-600)); }
@media (min-width: 64rem) { .part__still { aspect-ratio: auto; height: 100%; align-self: stretch; } }

.engage-list { margin-top: var(--space-6); }
.engage-list li { border-top: var(--border-hairline) solid var(--color-border-subtle); padding: var(--space-4) 0; max-width: 65ch; color: var(--color-fg-secondary); transition: border-color var(--duration-fast) var(--ease-standard); }
@media (hover: hover) { .engage-list li:hover { border-color: var(--color-border-strong); } }
.engage-note { margin-top: var(--space-8); max-width: 65ch; color: var(--color-fg-secondary); }

.contact-form { display: grid; gap: var(--space-6); margin-top: 0; max-width: 44rem; }
.contact-section { position: relative; overflow: hidden; background: linear-gradient(155deg, var(--stone-600), var(--stone-800) 55%, var(--stone-950)); color: var(--color-fg-on-image); }
.contact-section__bg { position: absolute; left: 0; right: 0; top: -12%; height: 124%; width: 100%; object-fit: cover; will-change: transform; }
.contact-section__overlay { position: absolute; inset: 0; background: rgba(13, 12, 10, 0.55); }
.contact-section__inner { position: relative; }
.contact-section .contact-form { margin-top: var(--space-8); }
.contact-section .field__label { color: var(--color-fg-on-image); }
.contact-section .field__control input, .contact-section .field__control textarea { background: rgba(251, 250, 247, 0.06); border-color: rgba(251, 250, 247, 0.3); color: var(--color-fg-on-image); }
.contact-section .field__control input:focus, .contact-section .field__control textarea:focus { border-color: var(--color-fg-on-image); }
.contact-form .form-row { display: grid; gap: var(--space-6); }
@media (min-width: 48rem) { .contact-form .form-row { grid-template-columns: 1fr 1fr; } }

.site-footer { background: var(--color-bg-inverse); color: var(--color-fg-inverse); }
.site-footer__inner { padding-block: var(--space-16); display: grid; gap: var(--space-12); }
.site-footer__meta { display: flex; flex-wrap: wrap; gap: var(--space-8); justify-content: space-between; align-items: flex-end; }
@media (max-width: 40rem) { .site-footer__inner { padding-block: var(--space-12); gap: var(--space-8); } .site-footer__meta { align-items: flex-start; flex-direction: column; } }
.site-footer__lines { display: grid; gap: var(--space-2); }
.site-footer__lines p { opacity: 0.75; max-width: 45ch; }
.site-footer a { color: inherit; }

.preloader { position: fixed; inset: 0; z-index: 300; background: #0D0C0A; color: #FBFAF7; display: grid; place-items: center; transition: opacity 0.6s ease, visibility 0.6s; }
.preloader.is-done { opacity: 0; visibility: hidden; }

.cookie-banner { position: fixed; left: var(--space-4); right: var(--space-4); bottom: var(--space-4); z-index: 250; max-width: 26rem; background: #0D0C0A; color: #FBFAF7; border: 1px solid rgba(251, 250, 247, 0.15); padding: var(--space-6); display: grid; gap: var(--space-5); opacity: 0; transform: translateY(12px); transition: opacity 0.4s ease, transform 0.4s ease; }
@media (max-width: 30rem) { .cookie-banner { padding: var(--space-5); max-width: none; } .cookie-banner__actions .btn { flex: 1; } }
.cookie-banner.is-visible { opacity: 1; transform: none; }
.cookie-banner__eyebrow { font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.3em; text-transform: uppercase; opacity: 0.5; }
.cookie-banner__text { font-size: 0.875rem; line-height: 1.5; opacity: 0.8; }
.cookie-banner__text a { color: inherit; }
.cookie-banner__row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); border-top: 1px solid rgba(251, 250, 247, 0.12); padding-top: var(--space-4); }
.cookie-banner__row span { font-size: 0.875rem; }
.cookie-banner__actions { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.cookie-banner .btn[data-variant="ghost"] { color: #FBFAF7; }
@media (hover: hover) { .cookie-banner .btn[data-variant="ghost"]:hover { color: #0D0C0A; } }

.switch { position: relative; display: inline-block; width: 42px; height: 24px; flex-shrink: 0; }
.switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.switch__track { position: absolute; inset: 0; border-radius: 999px; background: rgba(251, 250, 247, 0.2); transition: background-color 0.2s ease; pointer-events: none; }
.switch__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #FBFAF7; transition: transform 0.2s ease; }
.switch input:checked + .switch__track { background: var(--color-accent-primary, #B85C38); }
.switch input:checked + .switch__track::after { transform: translateX(18px); }
.switch input:disabled { cursor: not-allowed; }
.switch input:disabled + .switch__track { opacity: 0.5; }
.switch input:focus-visible + .switch__track { outline: 2px solid var(--color-accent-primary, #B85C38); outline-offset: 2px; }
.eyebrow-muted { color: var(--color-fg-tertiary); }
.measure-heading { max-width: 24ch; }
.footer-copyright { opacity: 0.6; }
.policy { padding-top: calc(var(--header-height) + var(--space-12)); }
.policy__body { max-width: 65ch; display: grid; gap: var(--space-5); }
.policy__body h2 { font-family: var(--font-display); font-size: var(--text-display-sm); line-height: var(--leading-display-sm); margin-top: var(--space-6); }
.policy__body p { color: var(--color-fg-secondary); }
.policy__meta { color: var(--color-fg-tertiary); }
.policy a { color: var(--color-accent-primary, #B85C38); }
.notfound { min-height: 100dvh; display: grid; place-items: center; background: var(--color-bg-inverse); color: var(--color-fg-inverse); }
.notfound__inner { display: grid; gap: var(--space-6); justify-items: start; padding: var(--space-8); }
.notfound__code { font-family: var(--font-mono); font-size: 0.875rem; letter-spacing: 0.4em; opacity: 0.5; }
.notfound__title { font-family: var(--font-display); font-size: var(--text-display-lg); line-height: var(--leading-display-lg); max-width: 14ch; }
.notfound p { opacity: 0.75; max-width: 45ch; }
.notfound a.btn { margin-top: var(--space-2); }