/* Font Imports ---------------------------------------- */

/* @font-face {
	font-family: "Oswald";
	font-weight: 700;
	font-style: normal;
	src:
		url("/assets/fonts/Oswald-Bold.woff2") format("woff2"),
		url("/assets/fonts/Oswald-Bold.woff") format("woff");
	font-display: swap;
} */

/* Global Styles --------------------------------------- */

*:focus-visible {
	outline: 2px solid var(--color-bronze-2);
	transition: none;
}

span.material-icons {
	font-size: 1.25rem;
}

@media (hover: hover) {
	.button-primary:hover {
		border: 2px solid var(--color-bronze-2);
		background-color: var(--color-bronze-2);
		box-shadow: 0 0 0.5rem var(--color-bronze-2);
	}

	.button-secondary:hover {
		color: var(--color-pine-2);
		background-color: var(--color-pine-4);
		box-shadow: 0 0 0.5rem var(--color-pine-4);
	}
}

.button-link {
	color: inherit;
	text-decoration: underline;
	white-space: nowrap;
	background-color: transparent;
	padding: 0;
	font-weight: 700;
	border-radius: 0;
}

input {
	accent-color: var(--color-primary);
}

.text-input {
	border: none;
	border-bottom: 2px solid var(--color-black, #000);
	border-radius: 0;
	padding: 0.25rem 0;
	width: 100%;
	font-size: var(--font-body-s);
	transition: border-color 0.2s ease-in-out;
	background-color: transparent;
}

.text-input:focus-visible {
	border-color: var(--color-bronze-2);
	outline: none;
}

.text-input:user-invalid {
	border-color: var(--color-error, red);
}

.surface {
	background-color: var(--color-bronze-5);
	border-radius: 0.5rem;
	box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.25);
	padding: var(--spacing-m) var(--spacing-l);
}

/* Google maps link removal ---------------------------- */

a[href^="http://maps.google.com/maps"]
{
	display: none !important;
}
a[href^="https://maps.google.com/maps"]
{
	display: none !important;
}

.gmnoprint a,
.gmnoprint span,
.gm-style-cc {
	display: none;
}
.gmnoprint div {
	background: none !important;
}

.gm-style iframe + div {
	border: none !important;
}

/* Scroll Animations --------------------------------------------------------------------------- */
/* These are animation classes used with the ScrollProps component */

.scroll-fade-up {
	opacity: 0;
	transform: translateY(2rem);
	transition:
		opacity 0.5s ease,
		transform 0.5s ease;
}

.scroll-fade-up.show {
	opacity: 1;
	transform: translateY(0);
}

.heading-fade-in span {
	opacity: 0;
	filter: blur(2px);
	transition:
		opacity 0.5s ease,
		filter 0.5s ease;
}

.heading-fade-in.show span {
	opacity: 1;
	filter: blur(0);
}

.group-stagger-fade > * {
	opacity: 0;
	transform: translateY(2rem);
	transition:
		opacity 0.5s ease,
		transform 0.5s ease;
}

.group-stagger-fade.show > * {
	opacity: 1;
	transform: translateY(0);
}

.group-stagger-fade.show > *:nth-child(1) {
	transition-delay: 0.05s;
}

.group-stagger-fade.show > *:nth-child(2) {
	transition-delay: 0.1s;
}

.group-stagger-fade.show > *:nth-child(3) {
	transition-delay: 0.15s;
}

.group-stagger-fade.show > *:nth-child(4) {
	transition-delay: 0.2s;
}

.group-stagger-fade.show > *:nth-child(5) {
	transition-delay: 0.25s;
}

.group-stagger-fade.show > *:nth-child(6) {
	transition-delay: 0.3s;
}

.group-stagger-fade.show > *:nth-child(7) {
	transition-delay: 0.35s;
}

.group-stagger-fade.show > *:nth-child(8) {
	transition-delay: 0.4s;
}

.group-stagger-fade.show > *:nth-child(9) {
	transition-delay: 0.45s;
}

.group-stagger-fade.show > *:nth-child(10) {
	transition-delay: 0.5s;
}

.group-stagger-fade.show > *:nth-child(11) {
	transition-delay: 0.55s;
}

.group-stagger-fade.show > *:nth-child(12) {
	transition-delay: 0.6s;
}

.group-stagger-fade.show > *:nth-child(13) {
	transition-delay: 0.65s;
}

.group-stagger-fade.show > *:nth-child(14) {
	transition-delay: 0.7s;
}

.group-stagger-fade.show > *:nth-child(15) {
	transition-delay: 0.75s;
}

.group-stagger-fade.show > *:nth-child(16) {
	transition-delay: 0.8s;
}

.group-stagger-fade.show > *:nth-child(17) {
	transition-delay: 0.85s;
}

.group-stagger-fade.show > *:nth-child(18) {
	transition-delay: 0.9s;
}

.group-stagger-fade.show > *:nth-child(19) {
	transition-delay: 0.95s;
}

.group-stagger-fade.show > *:nth-child(20) {
	transition-delay: 1s;
}

.group-stagger-fade.show > *:nth-child(21) {
	transition-delay: 1.05s;
}

.group-stagger-fade.show > *:nth-child(22) {
	transition-delay: 1.1s;
}

.group-stagger-fade.show > *:nth-child(23) {
	transition-delay: 1.15s;
}

.group-stagger-fade.show > *:nth-child(24) {
	transition-delay: 1.2s;
}

.group-stagger-fade.show > *:nth-child(25) {
	transition-delay: 1.25s;
}

.group-stagger-fade.show > *:nth-child(26) {
	transition-delay: 1.3s;
}

.group-stagger-fade.show > *:nth-child(27) {
	transition-delay: 1.35s;
}

.group-stagger-fade.show > *:nth-child(28) {
	transition-delay: 1.4s;
}

.group-stagger-fade.show > *:nth-child(29) {
	transition-delay: 1.45s;
}

.group-stagger-fade.show > *:nth-child(30) {
	transition-delay: 1.5s;
}

/* Blog ---------------------------------------------------------------------------------------- */

section.blog-body {
	padding-top: 0;
}

section.blog-body * {
	font-family: var(--font-heading);
	margin-bottom: 0.75rem;
	line-height: 1.5;
}

section.blog-body h1,
section.blog-body h2,
section.blog-body h3,
section.blog-body h4,
section.blog-body h5,
section.blog-body h6 {
	margin-bottom: 1.25rem;
	font-weight: 400;
	clear: both;
}

section.blog-body p:nth-child(2)::first-letter {
	font-size: 5rem;
	font-family: "Oswald", sans-serif;
	color: var(--color-pine-2);
	font-weight: bold;
	line-height: 1;
	margin-right: 0.1em;
	float: left;
	margin: 0.5rem 1rem 1rem 0rem;
}

section.blog-body a {
	color: var(--color-pine-2);
	text-decoration: underline;
}

section.blog-body li::marker {
	color: var(--color-pine-3);
}

section.blog-body blockquote {
	border-left: 4px solid var(--color-pine-3);
	padding-left: var(--spacing-m);
	margin: 1rem 0;
	font-style: italic;
}

section.blog-body img {
	border-radius: var(--spacing-s);
	box-shadow: 1rem 1rem 0 var(--color-bronze-4);
	width: calc(100% - 1rem);
	margin-bottom: 1.75rem;
	margin-top: 2rem;
	max-width: calc(700px - 1rem);
}