.site-nav,
.site-header__cta,
.site-header__logo-light { display: none; }

@media (min-width: 1200px) {
	.site-header {
		--bar-h: clamp(84px, calc(5.3vw + 20px), 112px);
		--nav-fs: clamp(.75rem, calc(.375rem + .5vw), .875rem);
		--bar-mid: #8e0d1f;
		display: flex;
		align-items: center;
		height: var(--bar-h);
		padding-top: 2px;
		padding-left: clamp(1.25rem, 2.49vw, 43px);
		padding-right: clamp(1.25rem, 2.95vw, 51px);
		background: linear-gradient(93.92deg, var(--c-footer) 20.885%, var(--c-red) 115.22%);
		pointer-events: auto;
	}
	body.is-header-revealed .site-header {
		background: linear-gradient(93.92deg, var(--c-footer) 20.885%, var(--c-red) 115.22%);
	}

	.site-header__logo { flex: none; width: clamp(180px, 14.35vw, 248px); }
	.site-header__logo-full,
	.site-header__logo-mark,
	.menu-toggle { display: none; }
	.site-header__logo-light { display: block; width: 100%; height: auto; aspect-ratio: 248 / 59.52; }

	.site-nav {
		display: block;
		align-self: stretch;
		margin-left: auto;
		opacity: 0;
		transition: opacity .9s cubic-bezier(.76, 0, .24, 1) .3s;
	}
	body.is-loaded .site-nav { opacity: 1; }

	.site-nav__list {
		--nav-gap: clamp(16px, calc(4.735vw - 40.8px), 41px);
		display: flex;
		align-items: stretch;
		gap: var(--nav-gap);
		height: 100%;
	}
	.site-nav__item { position: relative; display: flex; align-items: center; }
	.site-nav__item--sub { margin-right: calc(var(--nav-gap) * -10 / 41); }
	.site-nav__item:last-child { margin-left: calc(var(--nav-gap) * -3 / 41); }

	.site-nav__link {
		position: relative;
		display: inline-flex;
		align-items: center;
		gap: 3px;
		padding: 0;
		background: none;
		border: 0;
		color: var(--c-bg);
		font-family: var(--font-sans);
		font-size: var(--nav-fs);
		font-weight: 600;
		line-height: 30px;
		letter-spacing: .1em;
		text-transform: uppercase;
		white-space: nowrap;
		cursor: pointer;
	}
	.site-nav__link::after,
	.site-nav__sublink::after {
		content: '';
		position: absolute;
		left: 0;
		bottom: 5px;
		width: 100%;
		height: 1px;
		background: currentColor;
		transform: scaleX(0);
		transform-origin: right center;
		transition: transform .45s cubic-bezier(.76, 0, .24, 1);
	}
	.site-nav__toggle::after { width: calc(100% - 10px); }
	.site-nav__link:hover::after,
	.site-nav__sublink:hover::after {
		transform: scaleX(1);
		transform-origin: left center;
	}
	.site-nav__link:focus-visible,
	.site-nav__sublink:focus-visible,
	.site-header__cta:focus-visible {
		outline: 2px solid var(--c-white);
		outline-offset: 4px;
	}

	.site-nav__chevron {
		width: 6.71px;
		height: auto;
		aspect-ratio: 6.71209 / 3.86713;
		transition: transform .35s cubic-bezier(.76, 0, .24, 1);
	}
	.site-nav__toggle[aria-expanded="true"] .site-nav__chevron { transform: rotate(180deg); }

	.site-nav__sub {
		position: absolute;
		top: 100%;
		left: -1.75rem;
		display: grid;
		gap: .125rem;
		padding: 1rem 1.75rem 1.375rem;
		background: var(--bar-mid);
		visibility: hidden;
		opacity: 0;
		transform: translateY(-8px);
		transition: opacity .3s ease, transform .35s cubic-bezier(.76, 0, .24, 1), visibility 0s linear .35s;
	}
	.site-nav__toggle[aria-expanded="true"] + .site-nav__sub {
		visibility: visible;
		opacity: 1;
		transform: translateY(0);
		transition-delay: 0s;
	}
	.site-nav__sub li { display: flex; }
	.site-nav__sublink {
		position: relative;
		color: var(--c-bg);
		font-size: var(--nav-fs);
		font-weight: 600;
		line-height: 30px;
		letter-spacing: .1em;
		text-transform: uppercase;
		white-space: nowrap;
	}
	.site-nav__sublink--text::after { content: none; }

	.site-header__cta {
		display: inline-flex;
		flex: none;
		height: clamp(44px, 3.07vw, 53px);
		margin-left: clamp(1.25rem, calc(5.11vw - 41.4px), 47px);
		padding: 0 clamp(1.25rem, calc(3.79vw - 25.5px), 40px);
		border: 0;
		font-size: .875rem;
		letter-spacing: .1em;
		opacity: 0;
		transition: background-color .35s ease, color .35s ease, border-color .35s ease, transform .35s ease, box-shadow .35s ease, opacity .9s cubic-bezier(.76, 0, .24, 1) .35s;
	}
	body.is-loaded .site-header__cta { opacity: 1; }
	.site-header__cta:hover {
		background: var(--c-burgundy);
		box-shadow: 0 8px 22px rgba(59, 0, 20, .25);
	}
}

@media (min-width: 1200px) and (prefers-reduced-motion: reduce) {
	.site-nav,
	.site-nav__sub,
	.site-nav__chevron,
	.site-header__cta { transition: none; }
	.site-nav,
	.site-header__cta { opacity: 1; }
}
