.as-primary-navigation {
	flex-shrink: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--navigation);
	font-weight: 400;
	letter-spacing: 0.12em;
	line-height: 1.3;
	text-transform: uppercase;
}

.as-primary-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-primary-navigation a {
	color: var(--wp--preset--color--text);
	text-decoration: none;
}

.as-primary-navigation a:hover,
.as-primary-navigation a:focus-visible,
.as-primary-navigation a[aria-current="page"],
.as-primary-navigation .is-current-section > .as-primary-navigation__portfolio-control > a,
.as-primary-navigation__mobile-link.is-current-section {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.35em;
}

.as-primary-navigation__desktop {
	display: none;
}

.as-primary-navigation__mobile {
	position: relative;
}

.as-primary-navigation__mobile > summary,
.as-primary-navigation__mobile-categories > summary {
	list-style: none;
	cursor: pointer;
}

.as-primary-navigation__mobile > summary::-webkit-details-marker,
.as-primary-navigation__mobile-categories > summary::-webkit-details-marker {
	display: none;
}

.as-primary-navigation__mobile-toggle {
	display: flex;
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
}

.as-primary-navigation__menu-icon {
	display: grid;
	width: 22px;
	gap: 6px;
}

.as-primary-navigation__menu-icon span {
	display: block;
	height: 1px;
	background: currentcolor;
}

.as-primary-navigation__mobile[open] .as-primary-navigation__menu-icon span:first-child {
	transform: translateY(3.5px) rotate(45deg);
}

.as-primary-navigation__mobile[open] .as-primary-navigation__menu-icon span:last-child {
	transform: translateY(-3.5px) rotate(-45deg);
}

.as-primary-navigation__mobile-panel {
	position: absolute;
	top: calc(100% + (var(--as-header-offset, 72px) - 44px) / 2);
	right: calc(-1 * var(--as-page-padding));
	width: 100vw;
	max-height: calc(100vh - var(--as-header-offset, 72px));
	max-height: calc(100dvh - var(--as-header-offset, 72px));
	overflow-y: auto;
	border-top: 1px solid var(--wp--preset--color--border);
	border-bottom: 1px solid var(--wp--preset--color--border);
	padding: var(--wp--preset--spacing--2-xl) var(--as-page-padding) var(--wp--preset--spacing--3-xl);
	background: var(--wp--preset--color--background);
}

.as-primary-navigation__mobile-list {
	display: grid;
	gap: var(--wp--preset--spacing--lg);
}

.as-primary-navigation__mobile-link,
.as-primary-navigation__mobile-categories > summary,
.as-primary-navigation__mobile-categories a {
	display: flex;
	min-height: 44px;
	align-items: center;
}

.as-primary-navigation__mobile-categories {
	margin-block-start: var(--wp--preset--spacing--sm);
}

.as-primary-navigation__mobile-categories > summary {
	color: var(--wp--preset--color--secondary);
	font-size: 12px;
}

.as-primary-navigation__mobile-categories > summary::after {
	content: "+";
	margin-inline-start: var(--wp--preset--spacing--sm);
}

.as-primary-navigation__mobile-categories[open] > summary::after {
	content: "−";
}

.as-primary-navigation__mobile-categories ul {
	display: grid;
	gap: var(--wp--preset--spacing--xs);
	padding-inline-start: var(--wp--preset--spacing--md);
}

.as-primary-navigation__mobile-categories a {
	letter-spacing: 0.08em;
}

@media (min-width: 768px) {
	.as-primary-navigation__mobile {
		display: none;
	}

	.as-primary-navigation__desktop {
		display: block;
	}

	.as-primary-navigation__list {
		display: flex;
		align-items: center;
		gap: var(--wp--preset--spacing--lg);
	}

	.as-primary-navigation__item,
	.as-primary-navigation__portfolio-control {
		position: relative;
		display: flex;
		align-items: center;
	}

	.as-primary-navigation__link {
		display: flex;
		min-height: 44px;
		align-items: center;
	}

	.as-primary-navigation__submenu-toggle {
		display: inline-flex;
		width: 44px;
		min-height: 44px;
		align-items: center;
		justify-content: center;
		border: 0;
		padding: 0;
		background: transparent;
		color: var(--wp--preset--color--text);
		font: inherit;
	}

	.as-primary-navigation__submenu-toggle:hover {
		background: transparent;
		color: var(--wp--preset--color--text);
	}

	.as-primary-navigation__submenu {
		position: absolute;
		top: 100%;
		right: 0;
		width: 320px;
		max-width: calc(100vw - (2 * var(--as-page-padding)));
		overflow-wrap: anywhere;
		z-index: 20;
		min-width: 240px;
		border: 1px solid var(--wp--preset--color--border);
		padding: var(--wp--preset--spacing--sm) 0;
		background: var(--wp--preset--color--background);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}

	.as-primary-navigation__submenu a {
		display: flex;
		min-height: 44px;
		align-items: center;
		padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--md);
		letter-spacing: 0.04em;
		text-transform: none;
	}

	.as-primary-navigation:not([data-as-enhanced]) .as-primary-navigation__item--portfolio:hover .as-primary-navigation__submenu,
	.as-primary-navigation:not([data-as-enhanced]) .as-primary-navigation__item--portfolio:focus-within .as-primary-navigation__submenu,
	.as-primary-navigation__item--portfolio.is-submenu-open .as-primary-navigation__submenu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
	}
}

@media (forced-colors: active) {
	.as-primary-navigation__menu-icon span {
		background: CanvasText;
		forced-color-adjust: none;
	}
}
