/**
 * Venexian — Header & primary navigation.
 * Ported 1:1 from the approved header export. Visual values unchanged.
 * CTA selectors adapted for the WordPress native menu (the "nav-cta" class is
 * added to the menu item, so it lands on the <li>; styles target the <a>).
 */

#nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99999;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 22px 40px;
	background: transparent;
	transition: all .3s ease;
}

/* Header on scroll */
#nav.scrolled {
	background: rgba(18, 18, 18, .95);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(212, 162, 76, .15);
	padding: 15px 40px;
}

/* Logo */
.nav-logo img {
	height: 60px;
	width: auto;
	display: block;
}

/* Desktop menu */
.nav-links {
	display: flex;
	align-items: center;
	gap: 34px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.nav-links a {
	color: #ffffff;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 2px;
	transition: .3s;
}

.nav-links a:hover {
	color: #D4A24C;
}

/* CTA button */
.nav-links li.nav-cta > a,
.nav-links a.nav-cta {
	background: #D4A24C;
	color: #111111 !important;
	padding: 12px 22px;
	border-radius: 8px;
	font-weight: 600;
	transition: .3s;
}

.nav-links li.nav-cta > a:hover,
.nav-links a.nav-cta:hover {
	background: #E0B15C;
	color: #111111 !important;
}

/* Hamburger */
.nav-toggle {
	display: none;
}

/* =========================
   MOBILE
========================= */
@media (max-width: 768px) {

	#nav {
		padding: 18px 20px;
	}

	#nav.scrolled {
		padding: 14px 20px;
	}

	.nav-logo img {
		height: 46px;
	}

	.nav-toggle {
		display: flex;
		flex-direction: column;
		gap: 5px;
		background: none;
		border: none;
		cursor: pointer;
		z-index: 100001;
	}

	.nav-toggle span {
		width: 26px;
		height: 2px;
		background: #ffffff;
		display: block;
	}

	.nav-links {
		position: fixed;
		top: 0;
		left: -100%;
		width: 100%;
		height: 100vh;
		background: #121212;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		padding-top: 110px;
		gap: 0;
		transition: left .4s ease;
		z-index: 100000;
	}

	.nav-links.open {
		left: 0;
	}

	.nav-links li {
		width: 100%;
	}

	.nav-links a {
		display: block;
		width: 100%;
		text-align: center;
		padding: 20px;
		color: #ffffff !important;
		border-bottom: 1px solid rgba(255, 255, 255, .08);
	}

	.nav-links li.nav-cta > a,
	.nav-links a.nav-cta {
		display: inline-block !important;
		width: auto !important;
		margin-top: 25px;
		border: none;
	}
}

/* =========================
   MOBILE MENU FIXES (RC-2)
   ========================= */

/* Root cause: #nav.scrolled adds backdrop-filter, which makes #nav the
   containing block for its position:fixed children, collapsing the open
   drawer onto the header bar. While the drawer is open it covers the header,
   so dropping the blur here has no visible effect and frees the drawer to
   anchor to the viewport again. */
body.nav-open #nav,
body.nav-open #nav.scrolled {
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

@media (max-width: 768px) {

	/* iOS Safari: 100vh ignores the dynamic toolbar; 100dvh tracks the
	   visible viewport so the CTA at the bottom stays reachable.
	   overflow-y guards against menus taller than the screen. */
	.nav-links {
		height: 100vh;          /* fallback */
		height: 100dvh;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
}