

:root {
	--ink: #172126;
	--paper: #f7f9f8;
	--white: #ffffff;
	--line: #cbd5d5;
	--muted: #526264;
	--mint: #9ee4d1;
	--deep-mint: #23665d;
	--deep-mint-dark: #174c46;
	--soft-mint: #e8f7f2;
	--charcoal: #263438;
	--wash: #eef3f2;
	--danger: #a63232;
	--danger-wash: #fff1f0;

	--shell: 90rem;
	--gutter: clamp(1rem, 4vw, 4.5rem);
	--section-space: clamp(4rem, 10vw, 10rem);
	--space-1: .375rem;
	--space-2: .625rem;
	--space-3: .875rem;
	--space-4: 1.125rem;
	--space-5: 1.5rem;
	--space-6: 2rem;
	--space-7: 3rem;
	--space-8: 4rem;
	--space-9: 6rem;
	--space-10: 8rem;
	--display: "DM Serif Display", Georgia, serif;
	--body: "Manrope", Arial, sans-serif;
	--mono: 'IBM Plex Mono', 'Courier New', monospace;
	--text-xs: clamp(.68rem, .66rem + .1vw, .75rem);
	--text-sm: clamp(.8rem, .77rem + .15vw, .9rem);
	--text-base: clamp(.95rem, .91rem + .2vw, 1.08rem);
	--text-lg: clamp(1.15rem, 1rem + .6vw, 1.5rem);
	--text-xl: clamp(1.5rem, 1.15rem + 1.5vw, 2.5rem);
	--text-2xl: clamp(2rem, 1.35rem + 3vw, 4.25rem);
	--text-3xl: clamp(2.5rem, 1.6rem + 5vw, 7rem);
	--measure: 68ch;
	--measure-narrow: 42ch;
	--ease-standard: cubic-bezier(.2,.65,.25,1);
	--ease-quiet: cubic-bezier(.22,.61,.36,1);
	--ease-snap: cubic-bezier(.16,1,.3,1);
	--duration-fast: 160ms;
	--duration-base: 280ms;
	--duration-slow: 700ms;
	--hairline: 1px solid var(--line);
	--shadow-document: 0 1.25rem 3.5rem rgba(23,33,38,.08), 0 2px 0 rgba(23,33,38,.04);
	--shadow-float: 0 .75rem 2rem rgba(23,33,38,.14);
}


*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; scroll-padding-block-start: 5.25rem; background: var(--paper); }
body { margin: 0; min-width: 320px; background: var(--paper); color: var(--ink); font-family: var(--body); font-size: var(--text-base); line-height: 1.7; text-rendering: optimizeLegibility; }
body.is-locked { overflow: hidden; }
img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }
button, input, select, textarea { color: inherit; font: inherit; }
button, select { cursor: pointer; }
button { border: 0; }
a { color: var(--deep-mint); text-decoration-thickness: .08em; text-underline-offset: .2em; }
a:hover { color: var(--deep-mint-dark); }
:focus-visible { outline: 3px solid var(--mint); outline-offset: 4px; }
::selection { background: var(--mint); color: var(--ink); }


h1, h2, h3, h4, p, ul, ol, dl, figure, blockquote { margin: 0; }
h1, h2, h3, h4 { font-family: var(--display); font-weight: 400; line-height: 1.06; letter-spacing: -.025em; text-wrap: balance; }
h1 { font-size: var(--text-3xl); max-width: 12ch; }
h2 { font-size: var(--text-2xl); max-width: 17ch; }
h3 { font-size: var(--text-xl); max-width: 23ch; }
h4 { font-size: var(--text-lg); }
p, li { max-width: var(--measure); }
strong { font-weight: 700; }
small { font-size: var(--text-sm); }
.prose > * + * { margin-top: var(--space-5); }
.prose h2 { margin-top: var(--space-9); }
.prose h3 { margin-top: var(--space-7); }
.prose ul, .prose ol { padding-left: 1.4em; }
.prose li + li { margin-top: var(--space-2); }
.prose blockquote { border-left: 3px solid var(--mint); padding: .25rem 0 .25rem 1.25rem; font-family: var(--display); font-size: var(--text-xl); line-height: 1.2; }
.prose code, .mono { font-family: var(--mono); }


.site-shell { width: min(100% - 2 * var(--gutter), var(--shell)); margin-inline: auto; }
.full-bleed { width: 100%; }

.section { padding-block: var(--section-space); }
.section-tight { padding-block: clamp(3rem, 7vw, 6rem); }
.stack > * + * { margin-top: var(--stack-space, var(--space-5)); }
.cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4) var(--space-5); }
.grid { display: grid; gap: var(--space-6); }
.grid > *, .cluster > * { min-width: 0; }
.split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.reading-width { width: min(100%, var(--measure)); }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.skip-link { position: fixed; z-index: 100; top: .5rem; left: .75rem; transform: translateY(-150%); background: var(--ink); color: var(--white); padding: .7rem 1rem; min-height: 44px; }
.skip-link:focus { transform: translateY(0); color: var(--white); }
.icon { width: 1.1em; height: 1.1em; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.7; }


[data-motion], [data-stagger] { will-change: auto; }
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
	[data-motion], [data-stagger] { transform: none !important; opacity: 1 !important; }
}
@media (prefers-reduced-motion: no-preference) {
	@view-transition { navigation: auto; }
	::view-transition-old(root), ::view-transition-new(root) { animation-duration: var(--duration-slow); animation-timing-function: var(--ease-quiet); }

	::view-transition-old(site-header), ::view-transition-new(site-header), ::view-transition-old(site-logo), ::view-transition-new(site-logo) { animation-duration: var(--duration-base); animation-timing-function: var(--ease-snap); }
}
@media (max-width: 47.99rem) {
	.split { grid-template-columns: 1fr; }
	.site-shell { width: min(100% - 2rem, var(--shell)); }
}
@media (min-width: 48rem) { .tablet-only { display: block; } .mobile-only { display: none; } }
@media (max-width: 47.99rem) { .tablet-only { display: none; } .mobile-only { display: block; } }


.surface-paper { background: var(--paper); color: var(--ink); }
.surface-white { background: var(--white); color: var(--ink); }
.surface-ink { background: var(--ink); color: var(--white); }
.surface-ink .eyebrow, .surface-ink .meta, .surface-ink .coordinate { color: var(--mint); }
.surface-ink .text-muted { color: rgba(255,255,255,.82); }
.surface-wash { background: var(--wash); color: var(--ink); }
.accent-rule { border-top: 1px solid var(--mint); }
.rule { border-top: var(--hairline); }
.meta { color: var(--muted); font-family: var(--mono); font-size: var(--text-xs); letter-spacing: .08em; line-height: 1.5; text-transform: uppercase; }
.eyebrow { color: var(--deep-mint); font-family: var(--mono); font-size: var(--text-xs); font-weight: 600; letter-spacing: .12em; line-height: 1.4; text-transform: uppercase; }
.coordinate { color: var(--muted); font-family: var(--mono); font-size: var(--text-xs); letter-spacing: .1em; }
.text-muted { color: var(--muted); }
.text-measure { max-width: var(--measure-narrow); }
.text-balance { text-wrap: balance; }
.text-pretty { text-wrap: pretty; }
.center { text-align: center; }
.center > * { margin-inline: auto; }
.muted-link { color: var(--muted); }
.muted-link:hover { color: var(--ink); }
[data-icon-label] { display: inline-flex; align-items: center; gap: .55rem; }


@media (min-width: 64rem) {
	.wide-grid { display: grid; grid-template-columns: minmax(12rem, .65fr) minmax(0, 1.35fr); gap: clamp(2rem, 7vw, 8rem); }
	.wide-grid > * { min-width: 0; }
}
@media (max-width: 63.99rem) {
	.wide-grid { display: grid; gap: var(--space-7); }
}
@media (max-width: 23rem) {
	body { font-size: .94rem; }
	h1 { font-size: clamp(2.35rem, 14vw, 3.2rem); }
	h2 { font-size: clamp(1.95rem, 11vw, 2.65rem); }
	.site-shell { width: min(100% - 1.5rem, var(--shell)); }
}
