@import url(https://fonts.googleapis.com/css2?family=Cookie&family=Montserrat:wght@400;500;600;700&display=swap);

.site-header,
.site-footer {
	padding: var(--wp--preset--spacing--30) max(var(--wp--preset--spacing--30), calc((100vw - var(--wp--style--global--wide-size)) / 2));
}

.site-header {
	border-bottom: var(--wp--custom--border--width) solid color-mix(in srgb, var(--wp--preset--color--foreground) 18%, transparent);
}

.site-footer {
	border-top: var(--wp--custom--border--width) solid color-mix(in srgb, var(--wp--preset--color--foreground) 18%, transparent);
	color: var(--wp--preset--color--muted);
}

.site-title {
	color: var(--wp--preset--color--foreground);
	font-size: var(--wp--preset--font-size--x-large);
	text-decoration: none;
}

.site-shell,
.site-main {
	padding-block: var(--wp--preset--spacing--60);
}

.skip-link {
	position: fixed;
	top: var(--wp--preset--spacing--20);
	left: var(--wp--preset--spacing--20);
	z-index: 10000;
	transform: translateY(-200%);
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--foreground);
	border-radius: var(--wp--custom--button--radius);
	color: var(--wp--preset--color--background);
}

.skip-link:focus,
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: var(--wp--custom--border--accent-width) solid var(--wp--preset--color--accent);
	outline-offset: var(--wp--preset--spacing--10);
}

.skip-link:focus {
	transform: translateY(0);
}

body {
	background: #14170f;
	color: #e9e6dc;
	font-family: Montserrat, Arial, sans-serif;
}

.site-header {
	display: none;
}

.site-main {
	min-height: 100vh;
	padding: 0;
}

.hero {
	align-items: center;
	background: #14170f;
	color: #e9e6dc;
	display: grid;
	min-height: 100vh;
	padding: 3rem 1.5rem;
	text-align: center;
}

.hero__inner {
	max-width: 46rem;
}

.hero__title {
	color: #f3f0e6;
	font-family: Cookie, Georgia, cursive;
	font-size: clamp(3rem, 7vw, 4.5rem);
	font-weight: 400;
	line-height: 1.1;
	margin: 0 auto 2.75rem;
	max-width: none;
}

.hero__lead {
	color: #a4c294;
	font-size: 1.125rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	line-height: 1.5;
	margin: 0;
	text-transform: uppercase;
}

.site-footer {
	background: #14170f;
	border: 0;
	color: #e9e6dc;
	font-size: 0.8rem;
	letter-spacing: 0.08em;
	padding: 1.5rem;
	text-align: center;
}