/*
 * Technosevin mega-menu shell — tokens, nav bar, mobile overlay.
 */

:root {
	--ts-nav-ink: #1a2b48;
	--ts-nav-ink-60: rgba(26, 43, 72, 0.6);
	--ts-nav-ink-30: rgba(26, 43, 72, 0.3);
	--ts-nav-ink-10: rgba(26, 43, 72, 0.1);
	--ts-nav-cream: #f5f2ed;
	--ts-nav-ivory: #faf8f5;
	--ts-nav-gold: #ffc03d;
	--ts-nav-gold-light: #ffd666;
	--ts-nav-brand: #ffc03d;
	--ts-nav-brand-dark: #1a2b48;
	--ts-nav-white: #ffffff;
	--ts-nav-white-80: rgba(255, 255, 255, 0.8);
	--ts-nav-white-50: rgba(255, 255, 255, 0.5);
	--ts-nav-white-20: rgba(255, 255, 255, 0.2);
	--ts-nav-white-10: rgba(255, 255, 255, 0.1);
	--ts-nav-ff: 'Vazirmatn', Tahoma, Arial, sans-serif;
	--ease: cubic-bezier(0.22, 1, 0.36, 1);
	--h-nav: 82px;
	--nav-top: 1.35rem;
	--gutter: clamp(1.5rem, 5vw, 4rem);
	--max-w: 1560px;

	/* Aliases used by nav-submenu (Rocke-compat → Technosevin tokens) */
	--ink: var(--ts-nav-brand-dark);
	--brand: var(--ts-nav-brand-dark);
	--gold-light: var(--ts-nav-gold-light);
	--ff-serif: var(--ts-nav-ff);
	--ff-sc: var(--ts-nav-ff);
	--ff-body: var(--ts-nav-ff);
}

body.technosevin-mega-nav .wrap {
	width: min(var(--max-w), calc(100% - var(--gutter) * 2));
	margin-inline: auto;
}

body.technosevin-mega-nav #masthead,
body.technosevin-mega-nav .ast-mobile-popup-drawer,
body.technosevin-mega-nav .ts-motif-sprites {
	display: none !important;
}

body.technosevin-mega-nav.has-hero #content,
body.technosevin-mega-nav.has-hero .site-content > .ast-container {
	padding-top: 0;
}

body.technosevin-mega-nav .nav {
	position: fixed;
	top: var(--nav-top);
	left: 0;
	right: 0;
	z-index: 900;
	height: var(--h-nav);
	color: #000;
	transition: top 0.45s var(--ease), color 0.5s var(--ease);
	border-bottom: 1px solid transparent;
	isolation: isolate;
}

body.technosevin-mega-nav .nav::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	opacity: 0;
	transition: opacity 0.55s var(--ease), box-shadow 0.55s var(--ease), border-color 0.55s;
	pointer-events: none;
}

body.technosevin-mega-nav .nav::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 8%;
	right: 8%;
	height: 1px;
	z-index: -1;
	background: linear-gradient(90deg, transparent 0%, rgba(255, 192, 61, 0.55) 50%, transparent 100%);
	opacity: 0;
	transition: opacity 0.55s var(--ease);
	pointer-events: none;
}

body.technosevin-mega-nav .nav.over-dark::before {
	opacity: 1;
	background: linear-gradient(165deg, rgba(10, 16, 28, 0.82) 0%, rgba(26, 43, 72, 0.62) 55%, rgba(12, 20, 34, 0.78) 100%);
	backdrop-filter: blur(22px) saturate(1.45);
	-webkit-backdrop-filter: blur(22px) saturate(1.45);
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 40px rgba(0, 0, 0, 0.22);
}

body.technosevin-mega-nav .nav.over-dark::after {
	opacity: 1;
}

body.technosevin-mega-nav .nav.scrolled {
	top: 0;
}

body.technosevin-mega-nav .nav.scrolled::before {
	opacity: 1;
	background: linear-gradient(180deg, rgba(252, 250, 247, 0.94) 0%, rgba(245, 242, 237, 0.9) 100%);
	backdrop-filter: blur(20px) saturate(1.35);
	-webkit-backdrop-filter: blur(20px) saturate(1.35);
	border-bottom: 1px solid var(--ts-nav-ink-10);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 8px 28px rgba(26, 43, 72, 0.08);
}

body.technosevin-mega-nav .nav.scrolled::after {
	opacity: 0.65;
	background: linear-gradient(90deg, transparent 0%, rgba(255, 192, 61, 0.35) 50%, transparent 100%);
}

body.technosevin-mega-nav .nav.over-dark {
	color: #000;
}

body.technosevin-mega-nav .nav.over-dark.scrolled::before {
	background: linear-gradient(165deg, rgba(8, 12, 20, 0.92) 0%, rgba(26, 43, 72, 0.88) 100%);
	border-bottom: 1px solid var(--ts-nav-white-10);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 12px 36px rgba(0, 0, 0, 0.28);
}

body.technosevin-mega-nav .nav.over-dark .nav__link,
body.technosevin-mega-nav .nav.over-dark .nav__logo {
	color: #000;
	text-shadow: none;
}

body.technosevin-mega-nav .nav.over-dark .nav__logo img {
	filter: none;
}

body.technosevin-mega-nav .nav.scrolled:not(.over-dark) {
	color: #000;
}

body.technosevin-mega-nav .nav.scrolled:not(.over-dark) .nav__link,
body.technosevin-mega-nav .nav.scrolled:not(.over-dark) .nav__logo {
	text-shadow: none;
}

body.technosevin-mega-nav .nav.scrolled:not(.over-dark) .nav__logo img {
	filter: none;
}

body.technosevin-mega-nav .nav__inner {
	height: 100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	gap: 1rem;
	position: relative;
}

body.technosevin-mega-nav .nav__links {
	display: flex;
	gap: 2.5rem;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

body.technosevin-mega-nav .nav__links .nav__item {
	display: flex;
	align-items: center;
}

body.technosevin-mega-nav .nav__links--end {
	justify-content: flex-end;
}

body.technosevin-mega-nav .nav__end {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1.25rem;
}

body.technosevin-mega-nav .nav__link--cta,
body.technosevin-mega-nav .nav__link--employer {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	min-height: 42px;
	padding: 0.55rem 1.35rem;
	background: var(--ts-nav-gold);
	color: var(--ts-nav-brand-dark) !important;
	border: none;
	border-radius: 10px;
	font-weight: 700;
	letter-spacing: 0.02em;
	box-shadow: 0 2px 12px rgba(255, 192, 61, 0.32);
	white-space: nowrap;
	transition: background 0.3s, transform 0.3s var(--ease), box-shadow 0.3s;
	cursor: pointer;
}

body.technosevin-mega-nav .nav__link--cta {
	font-size: 0.9375rem;
	line-height: 1.2;
	padding-block: 0;
}

body.technosevin-mega-nav .nav__cta-icon {
	font-size: 1.375rem;
	width: 1.375rem;
	height: 1.375rem;
	line-height: 1;
	flex-shrink: 0;
}

body.technosevin-mega-nav .nav__cta-label {
	line-height: 1.2;
}

body.technosevin-mega-nav .nav__link--cta::after,
body.technosevin-mega-nav .nav__link--employer::after {
	display: none;
}

body.technosevin-mega-nav .nav__link--cta:hover,
body.technosevin-mega-nav .nav__link--cta:focus-visible,
body.technosevin-mega-nav .nav__link--employer:hover,
body.technosevin-mega-nav .nav__link--employer:focus-visible {
	background: linear-gradient(135deg, #ffe08a 0%, var(--ts-nav-gold-light) 55%, var(--ts-nav-gold) 100%);
	color: var(--ts-nav-brand-dark) !important;
	opacity: 1;
	transform: translateY(-1px);
	box-shadow: 0 4px 16px rgba(255, 192, 61, 0.38);
	text-shadow: none;
}

body.technosevin-mega-nav .nav__link {
	font-family: var(--ts-nav-ff);
	font-size: 1.08rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	position: relative;
	padding-block: 0.25rem;
	color: #000;
	transition: opacity 0.3s;
}

body.technosevin-mega-nav .nav__link::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	width: 0;
	height: 2px;
	background: currentColor;
	transition: width 0.45s var(--ease);
}

body.technosevin-mega-nav .nav__link:hover::after {
	width: 100%;
}

body.technosevin-mega-nav .nav__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.3s;
}

body.technosevin-mega-nav .nav__logo img {
	height: 64px;
	width: auto;
	display: block;
}

body.technosevin-mega-nav .nav__logo:hover {
	opacity: 0.7;
}

body.technosevin-mega-nav .nav__burger {
	display: none;
	justify-self: end;
	width: 30px;
	height: 20px;
	position: relative;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;
	appearance: none;
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	color: inherit;
	cursor: pointer;
	box-shadow: none;
	border-radius: 0;
	line-height: 1;
	font: inherit;
}

body.technosevin-mega-nav .nav__burger:hover,
body.technosevin-mega-nav .nav__burger:focus,
body.technosevin-mega-nav .nav__burger:focus-visible {
	background: none;
	border: none;
	box-shadow: none;
	color: inherit;
}

body.technosevin-mega-nav .nav.over-dark .nav__burger {
	color: #fff;
}

body.technosevin-mega-nav .nav__burger span {
	display: block;
	width: 100%;
	height: 2px;
	background: currentColor;
	transition: transform 0.4s var(--ease), top 0.4s, opacity 0.3s, width 0.4s var(--ease);
}

body.technosevin-mega-nav .nav__burger span:last-child {
	width: 60%;
	align-self: flex-end;
}

body.technosevin-mega-nav .nav__burger:hover span:last-child {
	width: 100%;
}

body.technosevin-mega-nav .nav__burger.open span:nth-child(1) {
	transform: rotate(45deg) translate(6px, 6px);
}

body.technosevin-mega-nav .nav__burger.open span:nth-child(2) {
	opacity: 0;
}

body.technosevin-mega-nav .nav__burger.open span:nth-child(3) {
	width: 100%;
	transform: rotate(-45deg) translate(6px, -6px);
}

body.technosevin-mega-nav .nav__center {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

body.technosevin-mega-nav .nav__mobile-actions {
	display: none;
	align-items: center;
}

body.technosevin-mega-nav .nav__icon {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	color: currentColor;
	transition: opacity 0.3s;
}

body.technosevin-mega-nav .nav__icon.nav__icon--desktop {
	display: flex;
	width: 36px;
	height: 36px;
	flex-shrink: 0;
}

body.technosevin-mega-nav .nav__icon svg {
	width: 20px;
	height: 20px;
}

body.technosevin-mega-nav .nav__icon:hover {
	opacity: 0.7;
}

body.technosevin-mega-nav .overlay-menu {
	position: fixed;
	inset: 0;
	z-index: 950;
	background: var(--ts-nav-brand-dark);
	color: var(--ts-nav-white);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.6s var(--ease), visibility 0.6s;
}

body.technosevin-mega-nav .overlay-menu.open {
	opacity: 1;
	visibility: visible;
}

body.technosevin-mega-nav .overlay-menu__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2.5rem;
	width: min(100%, 720px);
	padding-inline: var(--gutter);
	position: relative;
	z-index: 1;
}

body.technosevin-mega-nav .overlay-menu__close {
	position: absolute;
	top: clamp(1.25rem, 4vw, 2rem);
	inset-inline-start: clamp(1.25rem, 4vw, 2rem);
	z-index: 3;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ts-nav-white);
	opacity: 0;
	transition: opacity 0.45s var(--ease), color 0.3s, transform 0.3s var(--ease);
}

body.technosevin-mega-nav .overlay-menu.open .overlay-menu__close {
	opacity: 1;
	transition-delay: 0.05s;
}

body.technosevin-mega-nav .overlay-menu__close:hover {
	color: var(--ts-nav-gold-light);
	transform: rotate(90deg);
}

body.technosevin-mega-nav .overlay-menu__close svg {
	width: 26px;
	height: 26px;
}

body.technosevin-mega-nav .overlay-menu__link {
	font-family: var(--ts-nav-ff);
	font-size: clamp(1.5rem, 5vw, 2.25rem);
	font-weight: 500;
	letter-spacing: 0.04em;
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.6s var(--ease), transform 0.6s var(--ease), color 0.3s;
}

body.technosevin-mega-nav .overlay-menu.open .overlay-menu__link:not(.overlay-menu__link--cta):not(.overlay-menu__link--employer),
body.technosevin-mega-nav .overlay-menu.open .overlay-menu__toggle {
	opacity: 1;
	transform: none;
}

body.technosevin-mega-nav .overlay-menu.open .overlay-menu__link--cta,
body.technosevin-mega-nav .overlay-menu.open .overlay-menu__link--employer {
	opacity: 1;
	transform: none;
}

body.technosevin-mega-nav .overlay-menu__link:hover {
	color: var(--ts-nav-gold-light);
}

body.technosevin-mega-nav .overlay-menu__link--cta,
body.technosevin-mega-nav .overlay-menu__link--employer {
	margin-top: 0.5rem;
	padding: 0.65rem 1.75rem;
	background: var(--ts-nav-gold);
	color: var(--ts-nav-brand-dark) !important;
	border-radius: 4px;
	font-size: clamp(1rem, 3.5vw, 1.2rem) !important;
	font-weight: 700;
	letter-spacing: 0.06em;
	box-shadow: 0 4px 18px rgba(255, 192, 61, 0.35);
	cursor: pointer;
}

body.technosevin-mega-nav .overlay-menu__link--cta:hover,
body.technosevin-mega-nav .overlay-menu__link--employer:hover {
	background: linear-gradient(135deg, #ffe08a 0%, var(--ts-nav-gold-light) 55%, var(--ts-nav-gold) 100%);
	color: var(--ts-nav-brand-dark) !important;
	transform: translateY(-2px);
	text-shadow: none;
}

body.technosevin-mega-nav .overlay-menu.open .overlay-menu__link--cta,
body.technosevin-mega-nav .overlay-menu.open .overlay-menu__link--employer {
	opacity: 1;
	transform: none;
}

@media (max-width: 768px) {
	body.technosevin-mega-nav .overlay-menu__logo img {
		filter: brightness(0) invert(1);
	}

	body.technosevin-mega-nav .overlay-menu .overlay-menu__card,
	body.technosevin-mega-nav .overlay-menu .overlay-menu__card-img,
	body.technosevin-mega-nav .overlay-menu .overlay-menu__card-wrap,
	body.technosevin-mega-nav .overlay-menu .overlay-menu__thumb,
	body.technosevin-mega-nav .overlay-menu .overlay-menu__thumb-img {
		opacity: 1;
		transform: none;
	}

	body.technosevin-mega-nav .overlay-menu.open .overlay-menu__row .overlay-menu__link,
	body.technosevin-mega-nav .overlay-menu.open .overlay-menu__row .overlay-menu__toggle {
		opacity: 1;
		transform: none;
	}

	body.technosevin-mega-nav .overlay-menu__link--cta,
	body.technosevin-mega-nav .overlay-menu__link--employer {
		align-self: stretch;
		width: 100%;
		text-align: center;
		margin-top: 1.25rem;
		opacity: 0;
		transform: translateY(14px);
		transition:
			opacity 0.55s var(--ease) 0.35s,
			transform 0.55s var(--ease) 0.35s,
			background 0.3s,
			color 0.3s;
	}

	body.technosevin-mega-nav .overlay-menu.open .overlay-menu__link--cta,
	body.technosevin-mega-nav .overlay-menu.open .overlay-menu__link--employer {
		opacity: 1;
		transform: none;
	}

	body.technosevin-mega-nav .nav__links,
	body.technosevin-mega-nav .nav__end {
		display: none;
	}

	body.technosevin-mega-nav .nav__inner {
		direction: ltr;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
	}

	body.technosevin-mega-nav .nav__center {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		z-index: 0;
	}

	body.technosevin-mega-nav .nav__mobile-actions {
		display: flex;
		z-index: 1;
	}

	body.technosevin-mega-nav .nav__icon--search,
	body.technosevin-mega-nav .nav__icon--contact {
		display: flex;
	}

	body.technosevin-mega-nav .nav__burger {
		display: flex;
		z-index: 1;
	}

	body.technosevin-mega-nav .nav.over-dark:not(.scrolled) .nav__icon--contact {
		color: #fff;
	}

	body.technosevin-mega-nav .nav.scrolled {
		color: #000;
	}

	body.technosevin-mega-nav .nav.scrolled .nav__link,
	body.technosevin-mega-nav .nav.scrolled .nav__logo,
	body.technosevin-mega-nav .nav.scrolled .nav__burger,
	body.technosevin-mega-nav .nav.scrolled .nav__icon--search,
	body.technosevin-mega-nav .nav.scrolled .nav__icon--contact {
		color: #000;
		text-shadow: none;
	}

	body.technosevin-mega-nav .nav.scrolled .nav__logo img {
		filter: none;
	}

	body.technosevin-mega-nav .nav.over-dark.scrolled::before {
		background: linear-gradient(180deg, rgba(252, 250, 247, 0.94) 0%, rgba(245, 242, 237, 0.9) 100%);
		border-bottom: 1px solid var(--ts-nav-ink-10);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 8px 28px rgba(26, 43, 72, 0.08);
	}
}

/* ─── WordPress integration ───────────────────────────────────────────── */
body.technosevin-mega-nav:not(.has-hero) .nav.over-dark::before {
	opacity: 1;
}

body.technosevin-mega-nav:not(.has-hero) .nav.over-dark::after {
	opacity: 1;
}

body.technosevin-mega-nav:not(.has-hero) .nav.scrolled {
	top: 0;
}

/* Desktop — header bottom border (Technosevin ink + gold accent, Rocke-style) */
@media (min-width: 769px) {
	body.technosevin-mega-nav:not(.has-hero) .nav.over-dark::before {
		background: linear-gradient(180deg, rgba(252, 250, 247, 0.94) 0%, rgba(245, 242, 237, 0.9) 100%);
		backdrop-filter: blur(20px) saturate(1.35);
		-webkit-backdrop-filter: blur(20px) saturate(1.35);
		border-bottom: 1px solid var(--ts-nav-ink-10);
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 8px 28px rgba(26, 43, 72, 0.08);
	}

	body.technosevin-mega-nav:not(.has-hero) .nav.over-dark::after {
		opacity: 0.65;
		background: linear-gradient(90deg, transparent 0%, rgba(255, 192, 61, 0.35) 50%, transparent 100%);
	}

	body.technosevin-mega-nav.has-hero .nav.over-dark:not(.scrolled)::before {
		border-bottom: 1px solid var(--ts-nav-ink-10);
	}

	body.technosevin-mega-nav.has-hero .nav.over-dark:not(.scrolled)::after {
		opacity: 1;
	}
}

/* Homepage — white top-level nav links and search icon over hero */
body.technosevin-mega-nav.technosevin-homepage-v1 .nav.over-dark:not(.scrolled) .nav__links .nav__link:not(.nav__link--cta),
body.technosevin-mega-nav.technosevin-homepage-v1 .nav.over-dark:not(.scrolled) .nav__links--end .nav__link:not(.nav__link--cta) {
	color: #fff;
	text-shadow: none;
}

body.technosevin-mega-nav.technosevin-homepage-v1 .nav.over-dark:not(.scrolled) .nav__icon--search {
	color: #fff;
}