.marqueblanche-single-nav {
	width: min(100%, var(--marqueblanche-single-wide));
	margin: clamp(2rem, 4vw, 3rem) auto 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.35rem);
	padding-top: clamp(1.5rem, 3vw, 2.5rem);
	border-top: 1px solid color-mix(in srgb, var(--marqueblanche-theme-text) 12%, transparent);
}

.marqueblanche-single-nav:has(.marqueblanche-single-nav__item:only-child) {
	grid-template-columns: minmax(0, 1fr);
}

.marqueblanche-single-nav__item {
	min-width: 0;
}

.marqueblanche-single-nav__card {
	display: grid;
	grid-template-columns: minmax(8rem, 0.72fr) minmax(0, 1fr);
	min-height: 100%;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--marqueblanche-theme-text) 12%, transparent);
	border-radius: 8px;
	background: color-mix(in srgb, var(--marqueblanche-theme-surface) 86%, var(--marqueblanche-theme-bg));
	color: var(--marqueblanche-theme-text);
	text-decoration: none;
	box-shadow: 0 14px 34px color-mix(in srgb, var(--marqueblanche-theme-text) 8%, transparent);
	transition:
		border-color 180ms ease,
		transform 180ms ease,
		box-shadow 180ms ease;
}

.marqueblanche-single-nav__card:hover,
.marqueblanche-single-nav__card:focus-visible {
	border-color: color-mix(in srgb, var(--marqueblanche-theme-accent) 55%, transparent);
	box-shadow: 0 18px 42px color-mix(in srgb, var(--marqueblanche-theme-text) 12%, transparent);
	transform: translateY(-2px);
}
