/* Keep the desktop Products dropdown active while the pointer crosses the visual gap. */
@media (min-width: 993px) {
	/* Keep the entire header above subsequent Elementor stacking contexts. */
	.fourdimensions-theme .fd-global-header {
		position: relative;
		z-index: 100;
	}
	/*
	 * Keep the submenu's hit area stationary while it fades in. The vendor
	 * stylesheet animates `top` from 40% to 87%; that moving target can leave
	 * the pointer over the page for a frame and starts collapsing the menu.
	 */
	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children > .dropdown-menu {
		top: 87%;
		transition-property: opacity;
	}

	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children::after {
		content: "";
		position: absolute;
		top: 100%;
		left: 0;
		width: 228px;
		height: 25px;
		background: transparent;
		z-index: 9998;
	}

	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children:hover > .dropdown-menu,
	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children:focus-within > .dropdown-menu,
	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children > .dropdown-menu:hover {
		opacity: 1;
		visibility: visible;
		z-index: 9999;
		top: 87%;
		transform: scaleX(1);
		pointer-events: auto;
	}

	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children:hover > .dropdown-menu > li,
	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children:focus-within > .dropdown-menu > li,
	.fd-global-header .navigation_menu .navbar_nav > li.menu-item-has-children > .dropdown-menu:hover > li {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}
}
