/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Coustard:wght@400;900&family=Open+Sans:wght@400;600&display=swap');

:root {
	--ink: #ddd;
	--ink-muted: #b7b7b7;
	--accent: #ffa800;
	--section-bg: #1e1e1e;
	--section-bg-alt: #262626;
}

* { box-sizing: border-box; }

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	line-height: 1.6;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	color: var(--ink);
	background: var(--section-bg);
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Coustard', serif;
	color: #fff;
	font-weight: normal;
	letter-spacing: 1px;
	margin: 0;
}

h1 {
	font-size: clamp(36px, 7vw, 63px);
	line-height: 1.1;
}

.subhead {
	font-family: 'Coustard', serif;
	color: var(--ink-muted);
	font-size: clamp(18px, 3vw, 28px);
	line-height: 1.25;
	margin: 8px 0 0;
}

.eyebrow {
	margin: 0;
	color: var(--ink);
}

p { margin: 16px 0 0; }
p:first-child { margin-top: 0; }

a {
	color: var(--ink-muted);
	text-decoration: none;
	font-weight: normal;
}
a:hover, a:focus { text-decoration: underline; }

button { font: inherit; }

/* Hero / opening section with parallax background */
.hero {
	position: relative;
	height: 100vh;
	min-height: 480px;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
}

.hero__bg {
	position: absolute;
	top: -15%;
	left: 0;
	width: 100%;
	height: 130%;
	will-change: transform;
}

.hero__bg-slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 1.5s ease;
}
.hero__bg-slide.is-active {
	opacity: 1;
}

.hero__gradient {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.7) 100%);
}

.hero__content {
	position: relative;
	z-index: 2;
	padding: 0 40px 12vh;
	max-width: 640px;
}

.more { margin-top: 24px; }
.more a { font-family: 'Coustard', serif; }

@media (prefers-reduced-motion: reduce) {
	.hero__bg { transform: none !important; }
	.hero__bg-slide { transition: none; }
	html { scroll-behavior: auto; }
}

/* About / Contact sections */
.page-section {
	background: var(--section-bg);
	padding: 100px 40px;
}
.page-section--alt {
	background: var(--section-bg-alt);
}

.section-inner {
	max-width: 600px;
}

/* Site links, in Contact */
.site-links a {
	font-family: 'Coustard', serif;
	color: #fff;
	opacity: .8;
}
.site-links a:hover {
	opacity: 1;
}

.location {
	margin-top: 40px;
}

/* Mobile */
@media (max-width: 640px) {
	.hero__content { padding: 0 20px 10vh; }
	.page-section { padding: 72px 20px; }
}