:root {
	--ground:#141212;
	--surface:#1d1d1d;
	--surface-2:#2a2a2a;
	--line:#464646;
	--ink-soft:#b7b7b7;
	--ink:#e8e8e8;
	--accent:#268551;
	--accent-ink:#ffffff;
	--hairline:#b08d57;

	/* typography families */
	--reze-53c:'Syne', "Syne Fallback", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--reze-bc6:'Zilla Slab', 'Zilla Slab Fallback', Georgia, 'Times New Roman', serif;
	--reze-d9b:"JetBrains Mono", "JetBrains Mono Fallback", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

	/* fluid type scale using clamp() */
	--text-2xs:clamp(0.68rem, 0.65rem + 0.12vw, 0.75rem);
	--text-xs:clamp(0.75rem, 0.72rem + 0.15vw, 0.82rem);
	--text-sm:clamp(0.85rem, 0.81rem + 0.22vw, 0.95rem);
	--text-base:clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
	--text-lg:clamp(1.15rem, 1.08rem + 0.4vw, 1.35rem);
	--text-xl:clamp(1.35rem, 1.22rem + 0.75vw, 1.75rem);
	--text-2xl:clamp(1.75rem, 1.5rem + 1.3vw, 2.35rem);
	--text-3xl:clamp(2.2rem, 1.85rem + 2.1vw, 3.25rem);
	--text-display:clamp(2.65rem, 2.1rem + 3.2vw, 4.5rem);
	--text-quantity:clamp(3.2rem, 2.4rem + 4.6vw, 6rem);

	/* deliberate typographic hierarchy ratios */
	--leading-none:1.0;
	--leading-tight:1.1;
	--leading-snug:1.24;
	--leading-normal:1.56;
	--leading-relaxed:1.72;

	/* spacing rhythm */
	--space-0:0;
	--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;

	--band:clamp(3rem, 5vw, 4.5rem);
	--band-tight:3rem;
	--band-open:5.5rem;

	/* reading measures */
	--measure-narrow:46ch;
	--measure-prose:62ch;
	--measure-wide:74ch;

	--container-max:1180px;
	--container-gutter:clamp(1.5rem, 4.5vw, 3.5rem);

	--radius-xs:3px;
	--radius-sm:3px;
	--radius-md:3px;

	/* pinned chrome heights */
	--dock-height:66px;
	--strip-height:48px;
	--header-height:72px;

	--ease-standard:cubic-bezier(0.2, 0, 0, 1);
	--ease-out:cubic-bezier(0, 0, 0.2, 1);
	--ease-in:cubic-bezier(0.3, 0, 1, 1);
	--duration-fast:140ms;
	--duration-normal:240ms;
	--duration-slow:400ms;
}

*, *::before, *::after {
	box-sizing:border-box;
	margin:0;
	padding:0;
}

html {
	font-size:16px;
	background-color:var(--ground);
	color:var(--ink);
	scroll-behavior:smooth;
	scroll-padding-top:calc(var(--strip-height) + 1.5rem);
	-webkit-text-size-adjust:100%;
	tab-size:4;
}

body {
	min-height:100vh;
	background-color:var(--ground);
	color:var(--ink);
	font-family:var(--reze-bc6);
	font-size:var(--text-base);
	line-height:var(--leading-normal);
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	padding-bottom:var(--dock-height);
	overflow-x:hidden;
}

@media (min-width: 992px) {

	body {
		padding-bottom:0;
	}
}

img, svg, picture, video {
	display:block;
	max-width:100%;
}

img {
	height:auto;
	font-style:italic;
	shape-margin:0.75rem;
}

h1, h2, h3, h4, h5, h6 {
	font-family:var(--reze-53c);
	color:var(--ink);
	font-weight:700;
	line-height:var(--leading-tight);
	text-wrap:balance;
	letter-spacing:-0.015em;
}

h1 {
	font-size:var(--text-display);
	font-weight:800;
	letter-spacing:-0.025em;

}

h2 {
	font-size:var(--text-2xl);
	font-weight:700;
	letter-spacing:-0.018em;
}

h3 {
	font-size:var(--text-xl);
	font-weight:600;
	letter-spacing:-0.01em;
}

h4 {
	font-size:var(--text-lg);
	font-weight:600;
}

h5, h6 {
	font-size:var(--text-base);
	font-weight:600;
}

p {
	max-width:var(--measure-prose);
	color:var(--ink-soft);
	font-size:var(--text-base);
	line-height:var(--leading-relaxed);
}

p + p {
	margin-top:1.25rem;
}

a {
	color:inherit;
	text-decoration:none;
	transition:color var(--duration-fast) var(--ease-out);
}

a:hover, a:focus-visible {
	color:var(--ink);
}

/* Form controls reset */
button, input, select, textarea {
	font:inherit;
	color:inherit;
	letter-spacing:inherit;
}

@media (max-width: 48rem) {
	input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type='file']):not([type='color']),
	select, textarea {
		font-size:max(16px, 1rem);
	}
}

button {
	cursor:pointer;
	background:none;
	border:0;
}

ul, ol {
	list-style:none;
}

table {
	border-collapse:collapse;
	width:100%;
}

blockquote {
	border-left:2px solid var(--hairline);
	padding-left:var(--space-6);
	margin-block:var(--space-6);
	font-style:italic;
	color:var(--ink);
	max-width:var(--measure-prose);
}

code, kbd, samp, pre {
	font-family:var(--reze-d9b);
	font-size:0.9em;
}

pre {
	overflow-x:auto;
	padding:var(--space-4);
	background-color:var(--surface);
	border:1px solid var(--line);
	border-radius:var(--radius-sm);
}

strong, b {
	font-weight:600;
	color:var(--ink);
}

em, i {
	font-style:italic;
}

small {
	font-size:var(--text-xs);
	color:var(--ink-soft);
}

hr {
	border:0;
	border-top:1px solid var(--line);
	margin:var(--space-12) 0;
}

.skip-link {
	position:absolute;
	top:-120px;
	left:1.5rem;
	z-index:10000;
	background-color:var(--surface-2);
	color:var(--ink);
	padding:0.85rem 1.4rem;
	border:1px solid var(--hairline);
	border-radius:var(--radius-sm);
	font-family:var(--reze-d9b);
	font-size:var(--text-sm);
	font-weight:500;
	box-shadow:0 4px 18px rgba(0, 0, 0, 0.6);
	transition:top var(--duration-fast) var(--ease-out);
}

.skip-link:focus {
	top:1.5rem;
	outline:2px solid var(--accent);
	outline-offset:3px;
}

.sr-only {
	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;
}

:focus-visible {
	outline:2px solid var(--accent);
	outline-offset:3px;
}

.page-wrapper {
	display:flex;
	flex-direction:column;
	min-height:100vh;
	min-height:100svh;
	width:100%;
	position:relative;
}

.main-content {
	flex:1 0 auto;
	width:100%;
}

.container {
	width:100%;
	max-width:var(--container-max);
	margin-inline:auto;
	padding-inline:var(--container-gutter);
}

.container-narrow {
	width:100%;
	max-width:820px;
	margin-inline:auto;
	padding-inline:var(--container-gutter);
}

.container-reading {
	width:100%;
	max-width:var(--measure-prose);
	margin-inline:auto;
	padding-inline:var(--container-gutter);
}

.section-flow {
	padding-block:clamp(3.5rem, 8vw, 6.5rem);
	position:relative;
}

.section-flow-dense {
	padding-block:clamp(2.5rem, 5vw, 4rem);
	position:relative;
}

.flow-gap > * + * {
	margin-top:var(--space-6);
}

.flow-gap-lg > * + * {
	margin-top:var(--space-10);
}

/* Editorial Grids */
.grid {
	display:grid;
	gap:var(--space-6);
}

.grid-cols-2 {
	grid-template-columns:1fr;
}

@media (min-width: 768px) {
	.grid-cols-2 {
		grid-template-columns:repeat(2, minmax(0, 1fr));
	}
}

.grid-cols-3 {
	grid-template-columns:1fr;

}

@media (min-width: 640px) {
	.grid-cols-3 {
		grid-template-columns:repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.grid-cols-3 {
		grid-template-columns:repeat(3, minmax(0, 1fr));
	}
}

.section-quantity-lead {
	margin-bottom:clamp(2rem, 4vw, 3.25rem);
}

.section-quantity-figure {
	font-family:var(--reze-d9b);
	font-size:var(--text-quantity);
	font-weight:600;
	line-height:var(--leading-none);
	color:var(--ink);
	letter-spacing:-0.03em;
	display:flex;
	flex-wrap:wrap;
	align-items:baseline;
	gap:var(--space-3);
}

.section-quantity-unit {
	font-family:var(--reze-53c);
	font-size:clamp(1rem, 0.9rem + 0.6vw, 1.45rem);
	font-weight:700;
	letter-spacing:0.04em;
	text-transform:uppercase;
	color:var(--hairline);
}

.section-quantity-explain {
	margin-top:var(--space-4);
	font-family:var(--reze-bc6);
	font-size:var(--text-lg);
	line-height:var(--leading-snug);
	color:var(--ink);
	max-width:var(--measure-prose);
	font-weight:500;
}

.tabular {
	font-family:var(--reze-d9b);
	font-variant-numeric:tabular-nums;
	letter-spacing:-0.01em;
}

.text-hairline {
	color:var(--hairline);
}

.text-accent {
	color:var(--accent);
}

.text-ink {
	color:var(--ink);
}

.text-soft {
	color:var(--ink-soft);
}

.bg-ground {
	background-color:var(--ground);
}

.bg-surface {
	background-color:var(--surface);
}

.bg-surface-2 {
	background-color:var(--surface-2);
}

.border-line {
	border:1px solid var(--line);
}

.border-hairline {
	border:1px solid var(--hairline);
}

.icon {
	width:1.25rem;
	height:1.25rem;
	display:inline-block;
	vertical-align:middle;
	fill:currentColor;
	flex-shrink:0;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration:0.01ms !important;
		animation-iteration-count:1 !important;
		transition-duration:0.01ms !important;
		scroll-behavior:auto !important;
	}
}