@font-face {
	font-family: "Clinton";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/clinton-bold.woff2") format("woff2");
}

@font-face {
	font-family: "Clinton";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("../fonts/clinton-extra-bold.woff2") format("woff2");
}

@font-face {
	font-family: "Ibarra Real Nova";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/ibarra-real-nova-regular.woff2") format("woff2");
}

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

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--color-white);
	color: var(--color-text);
	font-family: "Ibarra Real Nova", Georgia, serif;
	font-size: 1.25rem;
	line-height: 1.4;
}

a {
	color: var(--color-purple);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
}

.screen-reader-text:focus {
	top: 0.5rem;
	left: 0.5rem;
	z-index: 100000;
	width: auto;
	height: auto;
	padding: 0.75rem 1rem;
	margin: 0;
	overflow: visible;
	clip: auto;
	clip-path: none;
	border: 2px solid var(--color-purple);
	background: var(--color-white);
	color: var(--color-purple);
	font-family: "Clinton", Arial, sans-serif;
	font-size: 1rem;
	font-weight: 700;
	text-decoration: none;
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 3px;
}

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

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

h1,
h2,
h3 {
	font-family: "Clinton", Arial, sans-serif;
	font-weight: 700;
	line-height: 1.15;
}

img {
	display: block;
	max-width: 100%;
	height: auto;
}

.content-width {
	width: min(100% - (2 * var(--space-page)), var(--content-width));
	margin-inline: auto;
}

.full-site-width {
	width: calc(100% - (2 * var(--full-site-gutter)));
	margin-inline: auto;
}

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.5rem;
	padding: 0.55rem 1rem;
	border: 1px solid currentColor;
	border-radius: 5px;
	background: var(--color-white);
	color: var(--color-purple);
	font-family: "Clinton", Arial, sans-serif;
	font-size: 0.875rem;
	font-weight: 700;
	text-decoration: none;
}

.button--outline {
	background: transparent;
	color: inherit;
}

.prose > *:first-child {
	margin-top: 0;
}

.prose > *:last-child {
	margin-bottom: 0;
}

.has-background-white { background-color: var(--color-white); color: var(--color-black); }
.has-background-cream { background-color: var(--color-cream); color: var(--color-black); }
.has-background-light-grey { background-color: var(--color-light-grey); color: var(--color-black); }
.has-background-pink { background-color: var(--color-pink); color: var(--color-white); }
.has-background-purple { background-color: var(--color-purple); color: var(--color-white); }
.has-background-blue { background-color: var(--color-blue); color: var(--color-white); }
.has-background-light-pink { background-color: var(--color-light-pink); color: var(--color-white); }
.has-background-gold { background-color: var(--color-gold); color: var(--color-black); }
.has-background-teal { background-color: var(--color-teal); color: var(--color-white); }
.has-background-deep-blue { background-color: var(--color-deep-blue); color: var(--color-white); }
.has-background-berry { background-color: var(--color-berry); color: var(--color-white); }
.has-background-coral { background-color: var(--color-coral); color: var(--color-white); }
.has-background-navy { background-color: var(--color-navy); color: var(--color-white); }
.has-background-black { background-color: var(--color-black); color: var(--color-white); }

.has-text-white { color: var(--color-white); }
.has-text-cream { color: var(--color-cream); }
.has-text-light-grey { color: var(--color-light-grey); }
.has-text-pink { color: var(--color-pink); }
.has-text-purple { color: var(--color-purple); }
.has-text-blue { color: var(--color-blue); }
.has-text-light-pink { color: var(--color-light-pink); }
.has-text-gold { color: var(--color-gold); }
.has-text-teal { color: var(--color-teal); }
.has-text-deep-blue { color: var(--color-deep-blue); }
.has-text-berry { color: var(--color-berry); }
.has-text-coral { color: var(--color-coral); }
.has-text-navy { color: var(--color-navy); }
.has-text-black { color: var(--color-black); }