@use "../abstracts/mixins";

:root {
	--font-scale: 1.125;
	--border-radius: 1px;
	--heading-text-transform: uppercase;
	--menu-font-size: var(--font-size-xs);
	--menu-font-family: var(--heading-font-family);
	--menu-font-weight: var(--heading-font-weight-light);
	--menu-text-transform: uppercase;
	--menu-item-link-color: var(--color-heading);
	--button-font-family: var(--heading-font-family);
	--button-font-weight: var(--heading-font-weight);
}

.site-header,
.site-inner {
	box-shadow: 0 0 8px 4px rgba(0, 0, 0, 0.02);
}

.nav-header {
	font-size: var(--font-size-sm);
}

.nav-after-header {
	border-bottom: var(--border);
}

.breadcrumb {
	text-align: center;
}

.home-form {
	position: relative;

	.wp-block-image img {
		display: block;
		width: 100%;
		margin-top: -60px;
		border: 16px solid var(--color-alt);
		box-shadow: 0 0 0 2px var(--color-white), 0 0 8px 4px rgba(0, 0, 0, 0.02);

		@include mixins.mq(lg) {
			margin-bottom: -60px;
		}
	}

	h2 {
		display: flex;
		align-items: center;

		&::before,
		&::after {
			flex: 1 1 auto;
			height: 1px;
			background-color: currentColor;
			content: "";
		}

		&::before {
			margin-right: var(--spacing-md);
		}

		&::after {
			margin-left: var(--spacing-md);
		}
	}
}