@font-face {
	font-family: "Fraunces";
	src: url("../fonts/fraunces-var-ext.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Fraunces";
	src: url("../fonts/fraunces-var.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Archivo";
	src: url("../fonts/archivo-var-ext.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Archivo";
	src: url("../fonts/archivo-var.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-italic-var-greek.woff2") format("woff2");
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-italic-var-ext.woff2") format("woff2");
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-italic-var.woff2") format("woff2");
	font-weight: 200 900;
	font-style: italic;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-var-greek.woff2") format("woff2");
	font-weight: 200 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-var-ext.woff2") format("woff2");
	font-weight: 200 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Source Serif 4";
	src: url("../fonts/source-serif-4-var.woff2") format("woff2");
	font-weight: 200 900;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

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

/* Wheel and trackpad scrolling is left to the browser. Links to a place on the page glide there by script instead. */

html {
	font-variation-settings: "SOFT" 100, "WONK" 0;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-padding-top: calc(var(--head-h) + 16px);
	background: var(--black);
}

body {
	margin: 0;
	min-height: 100svh;
	background: var(--black);
	color: var(--bone);
	font-family: var(--sans);
	font-size: var(--t-body);
	line-height: 1.5;
	letter-spacing: .012em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}

body.is-locked {
	overflow: hidden;
}

/* Films load only when they come into view. Left to itself the browser re-anchors the
   page when one of them settles, which reads as a jump when you turn and scroll back up. */

body {
	overflow-anchor: none;
}

video[data-src],
video[data-src-light] {
	aspect-ratio: 16 / 9;
}

h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd,
ul,
ol {
	margin: 0;
}

ul[role="list"],
ol[role="list"] {
	padding: 0;
	list-style: none;
}

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

img,
video {
	height: auto;
}

a {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: .2em;
}

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

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

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

::selection {
	background: var(--gold);
	color: var(--black);
}

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

.skip {
	position: absolute;
	left: var(--gutter);
	top: 8px;
	z-index: 100;
	padding: 10px 16px;
	background: var(--bone);
	color: var(--black);
	font-weight: 600;
	text-decoration: none;
	transform: translateY(-160%);
}

.skip:focus {
	transform: none;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Voices */

.display {
	font-family: var(--display);
	font-weight: 900;
	font-variation-settings: "SOFT" 100, "WONK" 0, "opsz" 144;
	line-height: .92;
	letter-spacing: -.01em;
	text-transform: uppercase;
}

.opener {
	font-family: var(--display);
	font-weight: 900;
	font-variation-settings: "SOFT" 100, "WONK" 0, "opsz" 144;
	font-size: var(--t-opener);
	line-height: .94;
	letter-spacing: -.01em;
	text-transform: uppercase;
	text-wrap: balance;
}

.h2 {
	font-family: var(--display);
	font-stretch: 70%;
	font-weight: 700;
	font-size: var(--t-h2);
	line-height: .98;
	letter-spacing: -.012em;
	text-transform: uppercase;
	text-wrap: balance;
}

.h3 {
	font-size: var(--t-h3);
	font-weight: 600;
	line-height: 1.22;
	letter-spacing: 0;
}

.deck {
	font-family: var(--serif);
	font-weight: 300;
	font-size: var(--t-deck);
	line-height: 1.3;
	letter-spacing: -.006em;
	max-width: 46ch;
	text-wrap: pretty;
}

.prose {
	font-family: var(--serif);
	font-size: var(--t-read);
	line-height: 1.62;
	letter-spacing: 0;
	color: var(--bone);
	max-width: var(--measure);
}

.prose > * + * {
	margin-top: 1.15em;
}

.label {
	font-size: var(--t-label);
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--bone-2);
}

.aside {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 400;
	color: var(--gold);
	letter-spacing: 0;
}

.bracket::before {
	content: "[\00a0";
}

.bracket::after {
	content: "\00a0]";
}

.muted {
	color: var(--bone-2);
}

.price {
	font-family: var(--serif);
	font-weight: 400;
	color: var(--gold);
	font-variant-numeric: lining-nums tabular-nums;
	letter-spacing: 0;
}