/**
 * WordPress primary nav: div-based root (matches Webflow) + layout bridge.
 */
.nav-menu.wr-nav-menu-root {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	grid-column-gap: 0;
	grid-row-gap: 0;
	justify-content: center;
	align-items: center;
}

@media (min-width: 992px) {
	.nav-menu.wr-nav-menu-root {
		flex-flow: row;
	}
}

@media (max-width: 991px) {
	.nav-menu.wr-nav-menu-root {
		flex-flow: column;
		justify-content: flex-start;
		align-items: flex-start;
		width: 100%;
	}

	.nav-menu.wr-nav-menu-root > .nav-dropdown,
	.nav-menu.wr-nav-menu-root > .nav-link {
		width: 100%;
	}
}

.nav-dropdown-menu > .nav-dropdown-item {
	display: block;
}

/* Header nav: mega + simple dropdown layout parity with Webflow (layout-main flex + embed transforms) */
@media (min-width: 992px) {
	.header-nav .nav-dropdown-menu-arcive {
		width: 100%;
		align-items: flex-start;
	}

	.header-nav .nav-dropdown.megamenu .nav-dropdown-menu-arcive > .nav-dropdown-menu-inner {
		flex: 1 1 0;
		min-width: 0;
	}

	.header-nav .nav-dropdown-menu-arcive > .nav-dropdown-vr {
		flex: 0 0 auto;
		align-self: stretch;
	}
}

/* Blog index: category tabs are real links, not JS panes */
.tabs-btn-wrap .tab-btn {
	text-decoration: none;
	color: inherit;
	box-sizing: border-box;
}

.projects-tab--no-tabs .tab-pane-wrap {
	margin-top: 0;
}

/**
 * Mobile nav: centered `.nav-menu-with-shape.g` is absolutely positioned and can span
 * past the viewport, sitting above the flex row and stealing taps from the burger.
 * Keep the trigger visible and clickable; let the menu panel keep pointer events.
 */
@media screen and (max-width: 991px) {
	.hamburger-trigger-wrap {
		display: flex;
		align-items: center;
		flex-shrink: 0;
		position: relative;
		z-index: 30;
		min-width: 36px;
	}

	.header-nav.w-nav .hamburger-trigger.w-nav-button {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		visibility: hidden;
		pointer-events: none;
	}

	.nav-menu-with-shape.g {
		pointer-events: none;
	}

	.nav-menu-with-shape.g .nav-offcanvas.w-nav-menu {
		pointer-events: auto;
	}

	/* Remix burger / close (replaces Lottie) */
	.header-nav .hamburger-remix-icon {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		min-width: 22px;
		min-height: 22px;
		font-size: 22px;
		line-height: 1;
		color: #183132;
	}

	/* Menu vs close: do not use a bare `i` rule — it overrides `display:none` on __close (0,2,1 beats 0,2,0). */
	.header-nav .hamburger-remix-icon > i.hamburger-remix-icon__menu {
		font-style: normal;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.header-nav .hamburger-remix-icon > i.hamburger-remix-icon__close {
		display: none;
		font-style: normal;
		position: absolute;
		inset: 0;
		align-items: center;
		justify-content: center;
	}

	.header-nav .hamburger-trigger.w--open .hamburger-remix-icon > i.hamburger-remix-icon__menu {
		display: none;
	}

	.header-nav .hamburger-trigger.w--open .hamburger-remix-icon > i.hamburger-remix-icon__close {
		display: flex;
	}

	/* Mobile panel (Webflow w-nav + theme layout) */
	.header-nav.w-nav[data-collapse='medium'] .nav-offcanvas.w-nav-menu[data-nav-menu-open],
	.header-nav.w-nav[data-collapse='medium'] .nav-offcanvas.w-nav-menu.w--open {
		display: block !important;
	}

	.nav-menu-with-shape.g.wr-mobile-nav-open {
		visibility: visible;
		opacity: 1;
		pointer-events: auto;
	}

	/* Top-level dropdown accordion */
	.header-section .nav-dropdown > .dropdown-head {
		cursor: pointer;
		user-select: none;
		width: 100%;
	}

	.header-section .nav-dropdown-icon.megamenu {
		transition: transform 0.3s ease;
	}

	.header-section .nav-dropdown.wr-nav-open > .dropdown-head .nav-dropdown-icon.megamenu {
		transform: rotate(180deg);
	}

	.header-section .nav-dropdown:not(.wr-nav-open) > .nav-dropdown-toggle-content {
		display: none !important;
	}

	.header-section .nav-dropdown.wr-nav-open > .nav-dropdown-toggle-content {
		display: block !important;
	}

	.nav-dropdown-vr {
		display: none;
	}

	/* Mega column sub-accordions */
	.nav-dropdown-menu-inner > .nav-menu-title.wr-col-trigger {
		cursor: pointer;
		user-select: none;
		flex-flow: row;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		padding: 8px 0;
	}

	.nav-dropdown-menu-inner > .nav-menu-title.wr-col-trigger::after {
		content: '\ea4e';
		font-family: remixicon !important;
		font-size: 18px;
		line-height: 1;
		color: #5e43fe;
		transition: transform 0.3s ease;
		flex-shrink: 0;
	}

	.nav-dropdown-menu-inner.wr-col-open > .nav-menu-title.wr-col-trigger::after {
		transform: rotate(180deg);
	}

	.nav-dropdown-menu-inner > .nav-dropdown-menu.megamenu {
		display: none;
		margin-top: 4px;
	}

	.nav-dropdown-menu-inner.wr-col-open > .nav-dropdown-menu.megamenu {
		display: flex;
	}
}

/* --- Premium mega helpers (menu CSS classes) --- */

/* Column title uses menu item URL; keep Webflow title color (not global link styles). */
a.nav-menu-title {
	text-decoration: none;
	color: inherit;
}

a.nav-menu-title:hover,
a.nav-menu-title:focus,
a.nav-menu-title:focus-visible,
a.nav-menu-title:visited,
a.nav-menu-title:active {
	text-decoration: none;
	color: inherit;
}

a.nav-menu-title .nav-dropdown-list-title {
	color: #183132;
}

a.nav-menu-title:hover .nav-dropdown-list-title,
a.nav-menu-title:focus .nav-dropdown-list-title,
a.nav-menu-title:visited .nav-dropdown-list-title,
a.nav-menu-title:active .nav-dropdown-list-title {
	color: #183132;
}

.nav-dropdown-toggle-content.megamenu.wr-mega-toggle-wide {
	width: min(100vw - 48px, 1120px);
	max-width: min(100vw - 48px, 1120px);
	min-width: min(100%, 480px);
}

.nav-dropdown-menu-inner.wr-mega-col-highlight {
	border-radius: 8px;
	padding: var(--_common-spacing---s16, 16px);
	border: 1px solid rgba(94, 67, 254, 0.12);
	background: linear-gradient(180deg, rgba(94, 67, 254, 0.06) 0%, rgba(255, 255, 255, 0) 100%);
}

.wr-mega-feature-excerpt {
	margin: 0 0 var(--_common-spacing---s16, 16px);
	font-size: 14px;
	line-height: 150%;
	color: #183132b3;
	font-weight: 400;
}

.nav-dropdown-menu-inner.wr-mega-feature-col .nav-menu-title {
	margin-bottom: var(--_common-spacing---s8, 8px);
}