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

	--lava-14d:"Syne", 'Syne Fallback', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	--lava-7f0:"Archivo", 'Archivo Fallback', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	--lava-730:'Space Mono', 'Space Mono Fallback', SFMono-Regular, Menlo, Monaco, Consolas, monospace;

	--step--2:clamp(0.72rem, 0.70rem + 0.10vw, 0.80rem);
	--step--1:clamp(0.84rem, 0.81rem + 0.15vw, 0.94rem);
	--lava-e0d:clamp(1.00rem, 0.95rem + 0.25vw, 1.125rem);
	--lava-0af:clamp(1.20rem, 1.10rem + 0.50vw, 1.45rem);
	--lava-f13:clamp(1.44rem, 1.28rem + 0.80vw, 1.88rem);
	--lava-ebd:clamp(1.73rem, 1.48rem + 1.25vw, 2.44rem);
	--lava-009:clamp(2.07rem, 1.70rem + 1.85vw, 3.15rem);
	--lava-957:clamp(2.49rem, 1.95rem + 2.70vw, 4.05rem);

	--space-3xs:clamp(0.25rem, 0.23rem + 0.10vw, 0.35rem);
	--space-2xs:clamp(0.50rem, 0.46rem + 0.20vw, 0.65rem);
	--space-xs:clamp(0.75rem, 0.70rem + 0.25vw, 0.95rem);
	--space-s:clamp(1.00rem, 0.92rem + 0.40vw, 1.30rem);
	--space-m:clamp(1.50rem, 1.38rem + 0.60vw, 1.95rem);
	--space-l:clamp(2.00rem, 1.84rem + 0.80vw, 2.60rem);
	--space-xl:clamp(3.00rem, 2.76rem + 1.20vw, 3.90rem);
	--space-2xl:clamp(4.00rem, 3.68rem + 1.60vw, 5.20rem);
	--space-3xl:clamp(5.50rem, 5.00rem + 2.50vw, 7.50rem);

	--dur-instant:120ms;
	--dur-fast:160ms;
	--dur-base:240ms;
	--dur-deliberate:400ms;
	--ease-standard:cubic-bezier(0.2, 0, 0, 1);
	--ease-out:cubic-bezier(0, 0, 0.2, 1);
	--ease-in-out:cubic-bezier(0.4, 0, 0.2, 1);

	--container-max:1360px;
	--container-narrow:880px;
	--content-measure:65ch;
	--header-height-desktop:76px;
	--dock-height-mobile:64px;
}

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

}

html {
	font-size:16px;
	color-scheme:dark;
	scroll-behavior:smooth;
	-webkit-text-size-adjust:100%;
	text-size-adjust:100%;
}

body {
	min-height:100vh;
	min-height:100svh;
	background-color:var(--ground);
	color:var(--ink);
	font-family:var(--lava-7f0);
	font-size:var(--lava-e0d);
	line-height:1.55;
	letter-spacing:-0.01em;
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	overflow-x:hidden;
	position:relative;
}

@media (max-width: 719px) {
	body {
		padding-bottom:calc(var(--dock-height-mobile) + env(safe-area-inset-bottom, 0px));
	}
}

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

button, input, select, textarea {
	font:inherit;
	color:inherit;
	border-radius:0;
}

table {
	border-collapse:collapse;
	border-spacing:0;
	width:100%;

}

a {
	color:inherit;
	text-decoration:none;
}

ul, ol {
	list-style:none;
}

h1, h2, h3, h4, h5, h6 {
	font-family:var(--lava-14d);
	font-weight:800;
	line-height:1.1;
	letter-spacing:-0.03em;
	color:var(--ink);
	text-wrap:balance;
	overflow-wrap:break-word;
}

h1 {
	font-size:var(--lava-957);
	font-weight:800;
	letter-spacing:-0.035em;
	line-height:1.05;
}

h2 {
	font-size:var(--lava-009);
	line-height:1.1;
}

h3 {
	font-size:var(--lava-ebd);
	line-height:1.15;
}

h4 {
	font-size:var(--lava-f13);
	line-height:1.2;
}

h5 {
	font-size:var(--lava-0af);
	line-height:1.25;
}

h6 {
	font-size:var(--lava-e0d);
	line-height:1.3;
}

p {
	max-width:var(--content-measure);
	margin-block-end:var(--space-s);
}

p:last-child {
	margin-block-end:0;
}

.lede {
	font-size:var(--lava-0af);
	line-height:1.45;
	color:var(--ink-soft);
	max-width:var(--content-measure);
}

.caption, figcaption {
	font-size:var(--step--1);
	line-height:1.4;
	color:var(--ink-soft);
}

.mono-spec {
	font-family:var(--lava-730);
	font-size:var(--step--1);
	letter-spacing:-0.02em;
	font-variant-numeric:tabular-nums;
}

.price-tag {
	font-family:var(--lava-730);
	font-size:var(--lava-0af);
	font-weight:700;
	letter-spacing:-0.03em;
	font-variant-numeric:tabular-nums;
	color:var(--ink);
}

.badge-tag {
	display:inline-flex;
	align-items:center;
	gap:var(--space-3xs);
	padding:0.25rem 0.5rem;
	background-color:var(--surface);
	border:1px solid var(--line);
	font-family:var(--lava-730);
	font-size:var(--step--2);
	color:var(--ink-soft);
	text-transform:uppercase;
	letter-spacing:0.05em;
}

.badge-tag--accent {
	border-color:var(--accent);
	color:var(--ink);
}

.badge-tag--gold {
	border-color:var(--hairline);
	color:var(--ink);
}

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

	padding-inline:var(--space-m);
}

@media (max-width: 360px) {
	.container {
		padding-inline:var(--space-xs);
	}
}

.container--narrow {
	max-width:var(--container-narrow);
}

.container--flush {
	padding-inline:0;
}

.skip-link {
	position:absolute;
	top:-100px;
	left:var(--space-m);
	z-index:9999;
	background-color:var(--accent);
	color:var(--accent-ink);
	font-family:var(--lava-730);
	font-size:var(--step--1);
	font-weight:700;
	padding:var(--space-2xs) var(--space-s);
	border:1px solid var(--hairline);
	transition:top var(--dur-fast) var(--ease-out);
}

.skip-link:focus-visible {
	top:var(--space-xs);
	outline:2px solid var(--accent-ink);
	outline-offset:2px;
}

.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;
}

.hairline-rule {
	height:1px;
	background-color:var(--hairline);
	border:none;
	width:100%;
	margin-block:var(--space-m);
}

.line-rule {
	height:1px;
	background-color:var(--line);
	border:none;
	width:100%;
}

.surface-box {
	background-color:var(--surface);
	border:1px solid var(--line);
	padding:var(--space-m);
	min-width:0;
}

@media (max-width: 480px) {
	.surface-box {
		padding:var(--space-s);
	}
}

.surface-box--accent-edge {
	border-left:3px solid var(--accent);
}

.surface-box--gold-edge {
	border-left:3px solid var(--hairline);
}

.grid-cols-2 {
	display:grid;
	grid-template-columns:1fr;
	gap:var(--space-l);
}

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

.grid-cols-3 {
	display:grid;
	grid-template-columns:1fr;
	gap:var(--space-m);
}

@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));
	}
}

.grid-cols-4 {
	display:grid;
	grid-template-columns:1fr;
	gap:var(--space-s);
}

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

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

.flow > * + * {
	margin-block-start:var(--space-s);
}

.flow-lg > * + * {
	margin-block-start:var(--space-l);
}

.flow-xl > * + * {
	margin-block-start:var(--space-xl);
}

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

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

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

.icon--sm {
	width:1em;
	height:1em;
	vertical-align:-0.15em;
}

.icon--lg {
	width:1.75em;
	height:1.75em;
	vertical-align:-0.25em;
}

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

@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;
	}
}