.he-site-branding {
	display: flex;
	align-items: center;
	gap: var(--he-space-8);
}

.he-site-branding__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--he-space-40);
	height: var(--he-space-40);
	border-radius: 9999px;
	background: linear-gradient(135deg, var(--he-color-amber-mid), var(--he-color-amber-dark));
}

.he-site-branding__mark-letter {
	color: var(--he-color-background);
	font-family: var(--he-font-body);
	font-size: 20px;
	font-weight: 700;
	line-height: 20px;
}

.he-site-branding__text {
	display: flex;
	flex-direction: column;
}

.he-site-branding__title {
	color: var(--he-color-heading);
}

.he-site-branding__tagline {
	color: var(--he-color-text-secondary);
}

.he-primary-navigation__menu,
.he-mobile-navigation__menu {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}

.he-primary-navigation__menu {
	align-items: center;
	gap: var(--he-space-32);
}

.he-primary-navigation__menu > li > a {
	display: inline-flex;
	align-items: center;
	padding-bottom: var(--he-space-2);
	color: var(--he-color-text-dark);
	border-bottom: 2px solid transparent;
	font-family: var(--he-font-body);
	font-size: var(--he-type-nav-size);
	font-weight: 500;
	line-height: var(--he-type-nav-line-height);
	letter-spacing: var(--he-type-nav-letter-spacing);
	text-transform: uppercase;
	transition: color 0.3s ease, border-color 0.3s ease;
}

.he-primary-navigation__menu > li.current-menu-item > a,
.he-primary-navigation__menu > li.current_page_item > a,
.he-primary-navigation__menu > li.current-menu-ancestor > a,
.he-primary-navigation__menu > li > a:hover,
.he-primary-navigation__menu > li > a:focus-visible {
	color: var(--he-color-amber);
	border-bottom-color: var(--he-color-amber);
}

.he-header-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: var(--he-space-8);
	color: var(--he-color-text-dark);
	border-radius: 9999px;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.he-header-action:hover,
.he-header-action:focus-visible,
.he-mobile-navigation__toggle:hover,
.he-mobile-navigation__toggle:focus-visible {
	background-color: var(--he-color-surface-soft);
}

.he-header-action svg,
.he-mobile-navigation__toggle svg {
	width: 24px;
	height: 24px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2;
}

.he-mobile-navigation__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: var(--he-space-8);
	color: var(--he-color-text-dark);
	border-radius: var(--he-radius-base);
}

.he-mobile-navigation__icon {
	position: relative;
	display: inline-flex;
	width: 24px;
	height: 24px;
}

.he-mobile-navigation__icon svg {
	position: absolute;
	inset: 0;
	transition: opacity 0.3s ease;
}

.he-mobile-navigation__icon-close {
	opacity: 0;
}

.he-mobile-navigation__toggle[aria-expanded="true"] .he-mobile-navigation__icon-menu {
	opacity: 0;
}

.he-mobile-navigation__toggle[aria-expanded="true"] .he-mobile-navigation__icon-close {
	opacity: 1;
}

.he-mobile-navigation__menu {
	flex-direction: column;
}

.he-mobile-navigation__menu > li > a {
	display: block;
	padding: var(--he-space-12) var(--he-space-16);
	color: var(--he-color-text-dark);
	font-family: var(--he-font-body);
	font-size: var(--he-type-nav-size);
	font-weight: 500;
	line-height: var(--he-type-nav-line-height);
	letter-spacing: var(--he-type-nav-letter-spacing);
	text-transform: uppercase;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.he-mobile-navigation__menu > li.current-menu-item > a,
.he-mobile-navigation__menu > li.current_page_item > a,
.he-mobile-navigation__menu > li.current-menu-ancestor > a {
	color: var(--he-color-amber);
	background-color: var(--he-color-surface-amber);
}

.he-mobile-navigation__menu > li > a:hover,
.he-mobile-navigation__menu > li > a:focus-visible {
	background-color: var(--he-color-surface-gray);
}

@media (max-width: 767px) {
	.he-primary-navigation {
		display: none;
	}
}

@media (min-width: 768px) {
	.he-mobile-navigation__toggle {
		display: none;
	}
}