/* Gaming Social Inca — navigation enhancements */

/* Sticky, calm editorial header */
#masthead {
	position: sticky;
	top: 0;
	z-index: 999;
	background: var(--global-palette9, #ffffff);
	box-shadow: 0 1px 0 rgba(20, 28, 35, 0.08), 0 8px 28px rgba(20, 28, 35, 0.04);
}

@supports ((-webkit-backdrop-filter: blur(14px)) or (backdrop-filter: blur(14px))) {
	#masthead {
		background: rgba(255, 255, 255, 0.94);
		-webkit-backdrop-filter: blur(14px);
		backdrop-filter: blur(14px);
	}
}

body.admin-bar #masthead {
	top: 32px;
}

/* Brand */
#masthead .site-title {
	font-weight: 750;
	letter-spacing: -0.025em;
}

#masthead .brand {
	text-decoration: none;
}

/* Desktop navigation rhythm */
@media (min-width: 1025px) {
	#primary-menu {
		display: flex;
		align-items: center;
		gap: clamp(1rem, 1.8vw, 1.8rem);
	}

	#primary-menu > .menu-item > a {
		position: relative;
		padding: 0.72rem 0.15rem;
		font-weight: 650;
		letter-spacing: -0.01em;
		transition: color 160ms ease, opacity 160ms ease;
	}

	#primary-menu > .menu-item:not(.nav-cta) > a::after {
		content: "";
		position: absolute;
		left: 0.15rem;
		right: 0.15rem;
		bottom: 0.38rem;
		height: 2px;
		background: var(--global-palette1, currentColor);
		transform: scaleX(0);
		transform-origin: right center;
		transition: transform 180ms ease;
	}

	#primary-menu > .menu-item:not(.nav-cta) > a:hover::after,
	#primary-menu > .current-menu-item:not(.nav-cta) > a::after,
	#primary-menu > .current-menu-ancestor:not(.nav-cta) > a::after {
		transform: scaleX(1);
		transform-origin: left center;
	}

	#primary-menu > .current-menu-item:not(.nav-cta) > a,
	#primary-menu > .current-menu-ancestor:not(.nav-cta) > a {
		color: var(--global-palette1, inherit);
	}

	/* Turn Contact into a clear, restrained CTA */
	#primary-menu > .nav-cta > a {
		padding: 0.66rem 1rem;
		border-radius: 999px;
		background: var(--global-palette1, #2d625c);
		color: var(--global-palette9, #ffffff);
		box-shadow: 0 6px 18px rgba(20, 28, 35, 0.10);
		transition: transform 160ms ease, box-shadow 160ms ease, opacity 160ms ease;
	}

	#primary-menu > .nav-cta > a:hover,
	#primary-menu > .nav-cta.current-menu-item > a {
		color: var(--global-palette9, #ffffff);
		transform: translateY(-1px);
		box-shadow: 0 9px 22px rgba(20, 28, 35, 0.14);
	}
}

/* Strong keyboard focus without visual noise for mouse users */
#masthead a:focus-visible,
#masthead button:focus-visible,
#mobile-drawer a:focus-visible,
#mobile-drawer button:focus-visible {
	outline: 3px solid var(--global-palette1, #2d625c);
	outline-offset: 3px;
	border-radius: 6px;
}

/* Mobile trigger */
#mobile-toggle {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	transition: background 160ms ease, transform 160ms ease;
}

#mobile-toggle:hover {
	background: var(--global-palette8, rgba(20, 28, 35, 0.05));
}

/* Mobile drawer: compact, legible, thumb-friendly */
#mobile-drawer .drawer-inner {
	width: min(88vw, 370px);
	max-width: 370px;
	box-shadow: -18px 0 50px rgba(20, 28, 35, 0.16);
}

#mobile-drawer .drawer-header {
	padding: 0.85rem 1rem 0.35rem;
}

#mobile-drawer .menu-toggle-close {
	min-width: 44px;
	min-height: 44px;
	border-radius: 12px;
}

#mobile-menu {
	padding: 0.6rem 1rem 1.5rem;
}

#mobile-menu > .menu-item {
	border-bottom: 1px solid rgba(20, 28, 35, 0.08);
}

#mobile-menu > .menu-item > a {
	display: flex;
	align-items: center;
	min-height: 54px;
	padding: 0.85rem 0.35rem;
	font-size: 1.04rem;
	font-weight: 650;
	letter-spacing: -0.01em;
}

#mobile-menu > .current-menu-item > a,
#mobile-menu > .current-menu-ancestor > a {
	color: var(--global-palette1, inherit);
}

#mobile-menu > .nav-cta {
	border-bottom: 0;
	padding-top: 0.9rem;
}

#mobile-menu > .nav-cta > a {
	justify-content: center;
	min-height: 48px;
	padding: 0.75rem 1rem;
	border-radius: 999px;
	background: var(--global-palette1, #2d625c);
	color: var(--global-palette9, #ffffff);
}

@media (max-width: 782px) {
	body.admin-bar #masthead {
		top: 46px;
	}
}

@media (max-width: 600px) {
	body.admin-bar #masthead {
		top: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	#masthead *,
	#mobile-drawer * {
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}