:root {
	--ground:#e9edf1;
	--ink:#101820;
	--slate-dark:#273646;
	--slate-mid:#4f6378;
	--slate-light:#b4c2d0;
	--surface:#dbe3ea;
	--surface-elevated:#f2f5f8;
	--accent:#006b78;
	--accent-hover:#00525c;
	--accent-soft:rgba(0, 107, 120, 0.14);
	--danger:#9c2727;
	--danger-bg:#fae8e8;
	--success:#1b663e;
	--success-bg:#e3f5eb;


	--puta-476:'Barlow Condensed', 'Arial Narrow', sans-serif;
	--puta-343:"Roboto Slab", Georgia, serif;
	--puta-82c:'Space Mono', 'Courier New', monospace;


	--ease-out:cubic-bezier(0.16, 1, 0.3, 1);
	--ease-in-out:cubic-bezier(0.4, 0, 0.2, 1);
	--duration-fast:140ms;
	--duration-normal:220ms;
	--duration-slow:380ms;


	--measure-prose:820px;
	--measure-wide:1240px;
	--measure-full:1440px;


	--pad-gutter:clamp(1.25rem, 4vw, 3.5rem);
	--pad-section:clamp(3.75rem, 8vw, 7.5rem);


	--step--1:clamp(0.85rem, 0.8rem + 0.25vw, 0.95rem);
	--puta-c59:clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
	--puta-7d0:clamp(1.25rem, 1.15rem + 0.6vw, 1.5rem);
	--puta-3a5:clamp(1.65rem, 1.45rem + 1vw, 2.15rem);
	--puta-0d8:clamp(2.2rem, 1.85rem + 1.8vw, 3.1rem);
	--puta-c00:clamp(2.8rem, 2.2rem + 2.8vw, 4.4rem);
	--step-hero:clamp(3.5rem, 2.8rem + 5vw, 6.75rem);
	--step-numeral:clamp(3.8rem, 3.2rem + 6vw, 7.5rem);


	--border-width:1px;
	--border-thick:2px;
	--radius-sm:2px;
	--radius-none:0px;


	--shadow-flat:0 1px 2px rgba(16, 24, 32, 0.05);
	--shadow-lift:0 8px 24px rgba(16, 24, 32, 0.09);
	--shadow-deep:0 16px 40px rgba(16, 24, 32, 0.14);
}


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

}


html {
	background-color:var(--ground);
	color:var(--ink);
	font-family:var(--puta-343);
	font-size:16px;
	line-height:1.6;
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	scroll-behavior:smooth;
	scroll-padding-top:5rem;
}


body {
	min-height:100vh;
	display:flex;
	flex-direction:column;
	background-color:var(--ground);
	color:var(--ink);
	overflow-x:hidden;
	position:relative;
}


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


input, button, textarea, select {
	font:inherit;
	color:inherit;
}


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


a {
	color:inherit;
	text-decoration-thickness:1px;
	text-underline-offset:3px;
	transition:color var(--duration-fast) var(--ease-out);
}


a:hover { color:var(--accent); }


h1, h2, h3, h4, h5, h6 {
	font-family:var(--puta-476);
	font-weight:800;
	line-height:1.05;
	letter-spacing:-0.015em;
	text-transform:uppercase;
	color:var(--ink);
	text-wrap:balance;
	overflow-wrap:break-word;
}


h1 {
	font-size:var(--puta-c00);
	letter-spacing:-0.02em;
}


h2 {
	font-size:var(--puta-0d8);
	letter-spacing:-0.015em;
}


h3 {
	font-size:var(--puta-3a5);
	line-height:1.15;
}


h4 {
	font-size:var(--puta-7d0);
	line-height:1.25;
}


p {
	font-size:var(--puta-c59);
	line-height:1.65;
	color:var(--ink);
	margin-bottom:1.25rem;
	text-wrap:pretty;
}


p:last-child { margin-bottom:0; }


p.lede {
	font-size:var(--puta-7d0);
	line-height:1.5;
	font-weight:500;
	color:var(--slate-dark);
	margin-bottom:2rem;
	max-width:var(--measure-prose);
}


ul, ol {
	margin-bottom:1.5rem;
	padding-left:1.5rem;
}


li {
	font-size:var(--puta-c59);
	line-height:1.6;
	margin-bottom:0.5rem;
}


li:last-child { margin-bottom:0; }


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


small { font-size:var(--step--1); }


code, kbd, samp, pre {
	font-family:var(--puta-82c);
	font-size:0.9em;
}


hr {
	border:0;
	border-top:var(--border-width) solid var(--slate-light);
	margin:3rem 0;
}


blockquote {
	border-left:3px solid var(--accent);
	padding:1rem 0 1rem 1.5rem;
	margin:2rem 0;
	font-style:italic;
	color:var(--slate-dark);
}


.skip-link {
	position:absolute;
	top:-100px;
	left:1rem;
	z-index:1000;
	padding:0.75rem 1.25rem;
	background:var(--ink);
	color:var(--ground);
	font-family:var(--puta-82c);
	font-size:var(--step--1);
	text-decoration:none;
	border-radius:var(--radius-sm);
	transition:top var(--duration-fast) var(--ease-out);
}


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


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


.shell-container {
	width:100%;
	max-width:var(--measure-wide);
	margin-left:auto;
	margin-right:auto;
	padding-left:var(--pad-gutter);
	padding-right:var(--pad-gutter);
}


.shell-container--prose { max-width:var(--measure-prose); }


.shell-container--full {
	max-width:100%;
	padding-left:var(--pad-gutter);
	padding-right:var(--pad-gutter);
}


.section-flow {
	padding-top:var(--pad-section);
	padding-bottom:var(--pad-section);
	position:relative;
}


.section-flow--hairline-top { border-top:var(--border-width) solid var(--slate-light); }


.section-flow--hairline-bottom { border-bottom:var(--border-width) solid var(--slate-light); }


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


.section-flow--dark {
	background-color:var(--slate-dark);
	color:var(--surface-elevated);

}


.section-flow--dark p,
.section-flow--dark li,
.section-flow--dark strong,
.section-flow--dark span { color:var(--surface-elevated); }


.section-flow--dark h2,
.section-flow--dark h3 { color:#ffffff; }


.section-flow--dark .unit-sub { color:#72ddf7; }


.unit-numeral-block { margin-bottom:2.25rem; }


.unit-numeral-block__figure {
	font-family:var(--puta-476);
	font-size:var(--step-numeral);
	font-weight:900;
	line-height:0.95;
	letter-spacing:-0.025em;
	text-transform:uppercase;
	color:var(--ink);
	display:block;
}


.unit-numeral-block__figure .unit-sub {
	font-family:var(--puta-82c);
	font-size:clamp(1rem, 0.9rem + 0.8vw, 1.75rem);
	font-weight:700;
	letter-spacing:0;
	color:var(--accent);
	vertical-align:baseline;
	margin-left:0.35rem;
	text-transform:uppercase;
}


.unit-numeral-block__statement {
	font-size:var(--puta-7d0);
	font-weight:500;

	line-height:1.45;
	color:var(--slate-dark);
	margin-top:0.75rem;
	max-width:var(--measure-prose);
}


.sr-only {
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0, 0, 0, 0);
	white-space:nowrap;
	border-width:0;
}


.u-mono { font-family:var(--puta-82c); }


.u-display { font-family:var(--puta-476); }


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


.u-muted { color:var(--slate-mid); }


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


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