/*
 * Get MEP Plans theme — header.css
 * Top bar: brand left, primary nav center, CTA right.
 * Sticky with paper-tinted backdrop blur.
 */

.mep-topbar {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(243, 236, 216, 0.92);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--rule);
}

.mep-topbar-inner {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	padding: 18px 0;
	gap: 60px;
}

.mep-brand {
	display: flex;
	align-items: baseline;
	gap: 14px;
	text-decoration: none;
	color: var(--ink);
}

.mep-brand-mark {
	font-family: var(--f-display);
	font-weight: 600;
	font-size: 24px;
	letter-spacing: -0.012em;
	line-height: 1;
	font-variation-settings: "opsz" 144, "SOFT" 0;
}

.mep-brand-tag {
	font-family: var(--f-mono);
	font-size: 10px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--ink-mute);
}

/* Primary navigation */
.mep-nav-primary {
	display: flex;
	gap: 36px;
	justify-content: center;
}

.mep-nav-primary a {
	font-family: var(--f-body);
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	color: var(--ink);
	position: relative;
	padding: 6px 0;
	transition: color 0.2s ease;
}

.mep-nav-primary a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: var(--accent);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.mep-nav-primary a:hover {
	color: var(--accent);
}

.mep-nav-primary a:hover::after {
	transform: scaleX(1);
	transform-origin: left;
}

.mep-nav-primary a.current-menu-item,
.mep-nav-primary a.current-menu-ancestor {
	color: var(--accent);
}

/* Top CTA button */
.mep-top-cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--ink);
	color: var(--paper);
	padding: 11px 20px;
	font-family: var(--f-body);
	font-size: 13.5px;
	font-weight: 500;
	text-decoration: none;
	transition: background 0.2s ease, transform 0.2s ease;
}

.mep-top-cta:hover {
	background: var(--accent);
	color: var(--paper);
	transform: translateY(-1px);
}

.mep-top-cta::after {
	content: "→";
	font-family: var(--f-mono);
	transition: transform 0.25s ease;
}

.mep-top-cta:hover::after {
	transform: translateX(3px);
}

/* Mobile menu toggle */
.mep-menu-toggle {
	display: none;
	background: transparent;
	border: 1px solid var(--rule-2);
	padding: 8px 12px;
	cursor: pointer;
	font-family: var(--f-mono);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ink);
}

@media (max-width: 980px) {
	.mep-topbar-inner {
		grid-template-columns: auto auto;
		gap: 16px;
	}

	.mep-nav-primary {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--paper);
		flex-direction: column;
		gap: 0;
		padding: 16px var(--container-pad-mobile) 24px;
		border-bottom: 1px solid var(--rule);
	}

	.mep-nav-primary.is-open {
		display: flex;
	}

	.mep-nav-primary a {
		padding: 12px 0;
		border-bottom: 1px solid var(--rule);
	}

	.mep-nav-primary a:last-child {
		border-bottom: 0;
	}

	.mep-menu-toggle {
		display: inline-block;
	}

	.mep-top-cta {
		display: none;
	}
}