
/* Works with standard WP markup:
   <ul class="header-nav"> ... <ul class="sub-menu ama-mm-panel"> ...
*/
.header-nav,
.header-nav * { box-sizing: border-box; }

.header-nav { list-style: none; margin: 0; padding: 0; display: block; gap: 24px; align-items: center; background: var(--ama-mm-menu-bg, transparent); margin: 0 0px 0 0 !important; }
.header-nav > li { position: relative; }
.header-nav a { text-decoration: none; }

/* Force-remove theme padding like .header-nav a { padding: 1rem; } */
.header-nav a { padding: 0 !important; }

/* Re-apply spacing only inside dropdowns */
.header-nav ul.sub-menu a {
	padding: var(--ama-mm-submenu-link-pad-y, 8px) var(--ama-mm-submenu-link-pad-x, 10px) !important;
	border-radius: var(--ama-mm-submenu-link-radius, 10px) !important;
	color: var(--ama-mm-submenu-link-color, inherit);
}
/* Basic dropdown behavior */
.header-nav > li > ul.sub-menu { position: absolute; left: 0; top: 100%; z-index: 50; display: none; }
.header-nav > li:hover > ul.sub-menu { display: block; }
.header-nav > li.is-open > ul.sub-menu { display: block; }

.header-nav ul.sub-menu { background: var(--ama-mm-submenu-bg, #fff); padding: var(--ama-mm-submenu-padding, 16px) !important; box-shadow: 0 8px 26px rgba(0,0,0,.12); border-radius: var(--ama-mm-submenu-radius, 12px) !important; min-width: 240px; overflow: hidden;
}
.header-nav ul.sub-menu > li { list-style:none; width: auto; float: none; }

/* Mega panel: force grid even if theme overrides display/float/width */
.header-nav ul.sub-menu.ama-mm-panel {
	width: min(1100px, 92vw);
	padding: var(--ama-mm-submenu-padding, 0);
	display: block !important;
	column-count: var(--ama-mm-cols, 3);
	column-gap: 16px;
	align-content: start;
}
.header-nav ul.sub-menu.ama-mm-panel > li { width: auto !important; float: none !important; display: block; }


/* Top-level illustration (shown at the start of submenu / mega submenu) */
.header-nav ul.sub-menu > li.ama-mm-top-illustration{
	padding: 0 !important;
	/* negate submenu padding so the image can touch edges */
	margin: calc(var(--ama-mm-submenu-padding, 0) * -1) !important;
	margin-bottom: 0 !important;
	list-style: none !important;
	width: auto !important;
	float: none !important;
	break-inside: avoid;
	position: relative;
}
.header-nav ul.sub-menu.ama-mm-panel > li.ama-mm-top-illustration{
	column-span: all;
}
.header-nav ul.sub-menu > li.ama-mm-top-illustration img{
	display: block;
	width: var(--ama-mm-top-illust-w, 100%);
	height: var(--ama-mm-top-illust-h, auto);
	object-fit: cover;
	margin: 0 !important;
	padding: 0 !important;
	padding-bottom: var(--ama-mm-top-illust-pad-bottom, 5px) !important;
	box-sizing: border-box;
	max-width: inherit;
	border-radius: 0 !important;
	border-top-left-radius: var(--ama-mm-top-illust-rad-tl, var(--ama-mm-submenu-radius, 12px)) !important;
	border-top-right-radius: var(--ama-mm-top-illust-rad-tr, var(--ama-mm-submenu-radius, 12px)) !important;
	border-bottom-right-radius: var(--ama-mm-top-illust-rad-br, 0px) !important;
	border-bottom-left-radius: var(--ama-mm-top-illust-rad-bl, 0px) !important;
}

/* Make optional link wrapper behave like the image itself */
.header-nav ul.sub-menu > li.ama-mm-top-illustration a.ama-mm-top-illustration-link{
	display: block;
	text-decoration: none;
	line-height: 0;
	padding: 0px !important;
}
.header-nav ul.sub-menu > li.ama-mm-top-illustration a.ama-mm-top-illustration-link:hover{
	background-color: transparent !important;
}


/* Decorative bottom cut (mask)
   Mask SVG is generated per-menu-item in PHP and passed via CSS variable --ama-mm-top-illust-mask.
*/
.header-nav ul.sub-menu > li.ama-mm-top-illustration.ama-mm-cut-tilt-left img,
.header-nav ul.sub-menu > li.ama-mm-top-illustration.ama-mm-cut-tilt-right img,
.header-nav ul.sub-menu > li.ama-mm-top-illustration.ama-mm-cut-curve img{
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-image: var(--ama-mm-top-illust-mask);
	mask-image: var(--ama-mm-top-illust-mask);
}

/* 2nd-level items as cards */
.header-nav ul.sub-menu.ama-mm-panel > li.is-mm-column > a.is-mm-hero {
	display: block;

	
	
	padding: 10px !important;
	border-radius: 12px;
	background: transparent;
}
.header-nav ul.sub-menu.ama-mm-panel > li.is-mm-column > a.is-mm-hero:hover {
	background: var(--ama-mm-hero-hover-bg, rgba(0,0,0,.05));
}

/* Constrain illustration image size inside mega cards */
.header-nav ul.sub-menu.ama-mm-panel .is-thumb { display:block; overflow:hidden; border-radius: 10px; }
.header-nav ul.sub-menu.ama-mm-panel .is-thumb img {
	width: 100%;
	height: var(--ama-mm-img-h, 120px);
	object-fit: cover;
	display: block;
}

.header-nav ul.sub-menu.ama-mm-panel .is-label {
  font-weight: normal !important;
 font-weight: 600; display: inline-flex; align-items: center; gap: 10px; }

/* Small icon before label */
.header-nav ul.sub-menu.ama-mm-panel .is-icon img {
	width: 28px;
	height: 28px;
	object-fit: cover;
	border-radius: 6px;
	display:block;
}

/* 3rd-level list under each column */
.header-nav ul.sub-menu.ama-mm-panel > li > ul.sub-menu {
	position: static;
	display: block;
	background: transparent;
	box-shadow: none;
	padding: 6px 0 0;
	border-radius: 0;
	min-width: 0;
}
.header-nav ul.sub-menu.ama-mm-panel > li > ul.sub-menu a {
	padding: 6px 0 !important;
	border-radius: 0;
}
.header-nav ul.sub-menu.ama-mm-panel > li > ul.sub-menu a:hover {
	background: transparent;
	text-decoration: underline;
}

/* Simple second-level items (if you set style = "simple") */
.header-nav ul.sub-menu.ama-mm-panel > li.is-mm-simple > a {
	padding: 10px !important;
	border-radius: 12px;
	background: rgba(0,0,0,.02);
}

/* Mobile-ish fallback */
@media (max-width: 820px) {
	.header-nav { flex-wrap: wrap; gap: 12px; }
	.header-nav > li > ul.sub-menu { position: static; width: 100%; }
	.header-nav ul.sub-menu.ama-mm-panel { grid-template-columns: 1fr; }
}


/* If columns per row is set to 1, behave like normal dropdown width (min-width: 240px) */
.header-nav ul.sub-menu.ama-mm-panel[style*="--ama-mm-cols:1"]{
	display: block !important;
	width: auto;
	min-width: 240px;
}
.header-nav ul.sub-menu.ama-mm-panel[style*="--ama-mm-cols:1"] > li{
	display: block;
	width: auto !important;
}

/* Spacing between illustration image and label */
.header-nav ul.sub-menu.ama-mm-panel a.is-mm-hero.has-mm-image .is-thumb + .is-label { margin-top: 6px; }


/* Ensure the illustration IMG scales with menu width (especially on mobile) */
.ama-mm-img {
	width: 100% !important;
	height: var(--ama-mm-img-h, 120px) !important;
	object-fit: cover;
	display: block !important;
	border-radius: 6px;
	margin-bottom: 5px;
}

/* Theme-specific helper (requested): ensure header bottom block has adequate vertical padding */
.header-btm {
	padding-block: 1.5rem !important;
}


/* Color controls (from Settings → AMA Mega Menu) */
.header-nav > li > a { color: var(--ama-mm-btn-color, inherit); }
.header-nav > li > a:hover { color: var(--ama-mm-btn-hover-color, inherit); }

.header-nav ul.sub-menu a:hover { background: var(--ama-mm-hover-bg, rgba(0,0,0,.05)); }


/* Submenu link text colors (from Settings → AMA Mega Menu) */
.header-nav ul.sub-menu a { color: var(--ama-mm-submenu-link-color, inherit); }
.header-nav ul.sub-menu a:hover { color: var(--ama-mm-submenu-link-hover-color, inherit); }


/* Active states */
.header-nav > li.current-menu-item > a,
.header-nav > li.current-menu-ancestor > a,
.header-nav > li.current-menu-parent > a {
	color: var(--ama-mm-active-color, inherit);
	background: var(--ama-mm-active-bg, transparent);
	border-radius: var(--ama-mm-submenu-link-radius, 10px);
}

.header-nav ul.sub-menu li.current-menu-item > a,
.header-nav ul.sub-menu li.current-menu-ancestor > a,
.header-nav ul.sub-menu li.current-menu-parent > a {
	color: var(--ama-mm-submenu-active-color, var(--ama-mm-submenu-link-color, inherit));
	background: var(--ama-mm-submenu-active-bg, transparent);
}


/* Shared submenu padding (normal submenu + mega panel) */
.header-nav > li > ul.sub-menu,
.header-nav ul.sub-menu {
	padding: var(--ama-mm-submenu-padding, 0) !important;
}



/* Top-level spacing */
.header-nav > li > a {
  margin: 0px 6px !important;
}


/* Active top-level states */
.header-nav > li.current-menu-item > a,
.header-nav > li.current-menu-ancestor > a,
.header-nav > li.current-menu-parent > a {
	color: var(--ama-mm-active-color, inherit) !important;
	background: var(--ama-mm-active-bg, transparent) !important;
	border-radius: var(--ama-mm-submenu-link-radius, 10px);
}


/* Keep top-level menu labels on a single line */
.header-nav > li > a {
	white-space: nowrap !important;
	flex-wrap: nowrap !important;
}



/* Keep submenus inside viewport when last items are near the right edge */
.header-nav > li > ul.sub-menu {
	max-width: calc(100vw - 20px);
	box-sizing: border-box;
}

.header-nav > li.ama-mm-align-right > ul.sub-menu {
	left: auto !important;
	right: 0 !important;
}


/* Mega panel alignment + max width */
.header-nav > li > ul.sub-menu.ama-mm-panel {
	max-width: min(var(--ama-mm-max-w, 1200px), calc(100vw - 20px));
	box-sizing: border-box;
}

.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-left {
	left: 0;
	right: auto;
	transform: none;
}

.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-center {
	left: 50%;
	right: auto;
	transform: translateX(-50%);
}

.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-right {
	left: auto;
	right: 0;
	transform: none;
}

/* If runtime viewport-fix sets parent class, it must win */
.header-nav > li.ama-mm-align-right > ul.sub-menu.ama-mm-panel {
	left: auto !important;
	right: 0 !important;
	transform: none !important;
}

/* Column-flow inside mega panel: keeps order top-to-bottom and avoids tall-item gaps */
.header-nav ul.sub-menu.ama-mm-panel > li {
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	display: inline-block;
	width: 100%;
}

.header-nav ul.sub-menu.ama-mm-panel > li.ama-mm-col-break {
	break-before: column;
	-webkit-column-break-before: always;
}

/* Mega panel offset + arrow pointing to parent item */
.header-nav > li > ul.sub-menu.ama-mm-panel {
	top: calc(100% + 12px);
}

.header-nav > li > ul.sub-menu.ama-mm-panel::before {
	content: "";
	position: absolute;
	top: -10px;
	left: var(--ama-mm-arrow-x, 32px);
	transform: translateX(-50%);
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #fff;
	filter: drop-shadow(0 2px 2px rgba(0,0,0,.08));
	pointer-events: none;
	filter: none !important;
	box-shadow: none !important;
}


/* Mega panel offset + arrow */
.header-nav > li > ul.sub-menu.ama-mm-panel{
	top: calc(100% + var(--ama-mm-panel-offset, 0px));
	overflow: visible;
}

.header-nav > li > ul.sub-menu.ama-mm-panel::before{
	content: '';
	position: absolute;
	top: -10px;
	left: var(--ama-mm-arrow-x, 50%);
	transform: translateX(-50%);
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid var(--ama-mm-submenu-bg, #fff);
	display: var(--ama-mm-arrow-display, block);
	pointer-events: none;
}

/* Normal submenus offset + arrow (same settings as mega) */
.header-nav > li > ul.sub-menu:not(.ama-mm-panel){
	top: calc(100% + var(--ama-mm-panel-offset, 0px));
	overflow: visible;
}

.header-nav > li > ul.sub-menu:not(.ama-mm-panel)::before{
	content: '';
	position: absolute;
	top: -10px;
	left: var(--ama-mm-arrow-x, 50%);
	transform: translateX(-50%);
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid var(--ama-mm-submenu-bg, #fff);
	display: var(--ama-mm-arrow-display, block);
	pointer-events: none;
	filter: none !important;
	box-shadow: none !important;
}

/* Keep submenu visible during hover-intent open state */
.header-nav > li.ama-mm-hover-open > ul.sub-menu{
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto;
}

/* Normal submenu arrow alignment (default left; right when submenu aligned-right to fit viewport) */
.header-nav > li > ul.sub-menu:not(.ama-mm-panel)::before{
	left: var(--ama-mm-arrow-x, 15%);
}
.header-nav > li.ama-mm-align-right > ul.sub-menu:not(.ama-mm-panel)::before{
	left: var(--ama-mm-arrow-x, 85%);
}

/* Ensure submenu links do NOT inherit top-level margins */
.header-nav ul.sub-menu a{ margin: 0 !important; }

/* Mega submenu links full width (make hover/click area fill column) */
.header-nav ul.sub-menu.ama-mm-panel > li.is-mm-column > a.is-mm-hero{
	display: block;
	width: 100%;
	box-sizing: border-box;
}
.header-nav ul.sub-menu.ama-mm-panel .sub-menus-wrapper .sub-menu > .menu-item > a,
.header-nav ul.sub-menu.ama-mm-panel .not-mega-menu-container > .menu-item > a,
.header-nav ul.sub-menu.ama-mm-panel > li.menu-item > a{
	display: block;
	width: 100%;
	box-sizing: border-box;
}

/* Force full-width clickable area in mega panel (override theme styles) */
.header-nav ul.sub-menu.ama-mm-panel li,
.header-nav ul.sub-menu.ama-mm-panel li.menu-item,
.header-nav ul.sub-menu.ama-mm-panel li.is-mm-column{
	width: 100% !important;
	box-sizing: border-box;
}

.header-nav ul.sub-menu.ama-mm-panel a,
.header-nav ul.sub-menu.ama-mm-panel li > a,
.header-nav ul.sub-menu.ama-mm-panel li.menu-item > a,
.header-nav ul.sub-menu.ama-mm-panel li.is-mm-column > a{
	display: block !important;
	width: 100% !important;
	box-sizing: border-box;
}

/* Open state (works for our hover-intent class + theme hover) */
	.header-nav > li.ama-mm-hover-open > ul.sub-menu,
	.header-nav > li:hover > ul.sub-menu,
	.header-nav > li:focus-within > ul.sub-menu{
		opacity: 1;
		transform: translateY(0);
		visibility: visible;
		pointer-events: auto;
		transition:
				opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
				transform var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			visibility 0s linear 0s;
	}


/* Fade+slide animation for submenus (desktop/tablet only) */
@media (min-width: 821px){
	.header-nav > li > ul.sub-menu{
		/* Keep it renderable so transitions work (submenus are absolutely positioned) */
		display: block !important;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition:
			opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			visibility 0s linear var(--ama-mm-anim-dur, 180ms);
		will-change: opacity, transform;
	}

	/* Normal submenus slide using translateY */
	.header-nav > li > ul.sub-menu:not(.ama-mm-panel){
		transform: translateY(var(--ama-mm-anim-slide, 10px));
		transition:
			opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			transform var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			visibility 0s linear var(--ama-mm-anim-dur, 180ms);
	}

	/* Mega panel slide must preserve alignment translateX */
	.header-nav > li > ul.sub-menu.ama-mm-panel{
		/* default: no translateX, just Y */
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
		transition:
			opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			transform var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			visibility 0s linear var(--ama-mm-anim-dur, 180ms);
	}

	.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-center{
		transform: translateX(-50%) translateY(var(--ama-mm-anim-slide, 10px)) !important;
	}
	.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-left{
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
	}
	.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-right{
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
	}

	/* Open state (works for our hover-intent class + theme hover) */
	.header-nav > li.ama-mm-hover-open > ul.sub-menu,
	.header-nav > li:hover > ul.sub-menu,
	.header-nav > li:focus-within > ul.sub-menu{
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transition:
			opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			transform var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease),
			visibility 0s linear 0s;
	}

	.header-nav > li.ama-mm-hover-open > ul.sub-menu:not(.ama-mm-panel),
	.header-nav > li:hover > ul.sub-menu:not(.ama-mm-panel),
	.header-nav > li:focus-within > ul.sub-menu:not(.ama-mm-panel){
		transform: translateY(0);
	}
	.header-nav > li.ama-mm-hover-open > ul.sub-menu.ama-mm-panel,
	.header-nav > li:hover > ul.sub-menu.ama-mm-panel,
	.header-nav > li:focus-within > ul.sub-menu.ama-mm-panel{
		transform: translateY(0) !important;
	}
	.header-nav > li.ama-mm-hover-open > ul.sub-menu.ama-mm-panel.ama-mm-align-center,
	.header-nav > li:hover > ul.sub-menu.ama-mm-panel.ama-mm-align-center,
	.header-nav > li:focus-within > ul.sub-menu.ama-mm-panel.ama-mm-align-center{
		transform: translateX(-50%) translateY(0) !important;
	}
}


/* Submenu animations - strict overrides (themes often toggle display/opacity) */
@media (min-width: 821px){

	/* Base hidden state: keep rendered so transitions can run */
	.header-nav > li > ul.sub-menu{
		display: block !important;
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
		transition:
			opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease) !important,
			transform var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease) !important,
			visibility 0s linear var(--ama-mm-anim-dur, 180ms) !important;
		will-change: opacity, transform;
	}

	/*
	  Reverse close animation support:
	  Some themes (and our strict rules) would switch visibility:hidden immediately when the open class is removed.
	  JS adds .ama-mm-closing for the duration, keeping the submenu visible so opacity/transform can animate out.
	*/
	.header-nav > li.ama-mm-closing > ul.sub-menu{
		visibility: visible !important;
		pointer-events: none !important;
		/* Keep the closing panel behind the newly opened one to avoid "flash" overlap */
		z-index: 49 !important;
	}

	/* Mega panel must preserve translateX alignment */
	.header-nav > li > ul.sub-menu.ama-mm-panel{
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
	}
	.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-center{
		transform: translateX(-50%) translateY(var(--ama-mm-anim-slide, 10px)) !important;
	}
	/* left/right alignment keep X untouched */
	.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-left{
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
	}
	.header-nav > li > ul.sub-menu.ama-mm-panel.ama-mm-align-right{
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
	}

	/* Open state */
	.header-nav > li.ama-mm-hover-open > ul.sub-menu,
	.header-nav > li:hover > ul.sub-menu,
	.header-nav > li:focus-within > ul.sub-menu{
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
		/* Ensure the active panel is always above a closing previous panel */
		z-index: 60 !important;
		transition:
			opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease) !important,
			transform var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease) !important,
			visibility 0s linear 0s !important;
	}

	.header-nav > li.ama-mm-hover-open > ul.sub-menu:not(.ama-mm-panel),
	.header-nav > li:hover > ul.sub-menu:not(.ama-mm-panel),
	.header-nav > li:focus-within > ul.sub-menu:not(.ama-mm-panel){
		transform: translateY(0) !important;
	}

	.header-nav > li.ama-mm-hover-open > ul.sub-menu.ama-mm-panel,
	.header-nav > li:hover > ul.sub-menu.ama-mm-panel,
	.header-nav > li:focus-within > ul.sub-menu.ama-mm-panel{
		transform: translateY(0) !important;
	}
	.header-nav > li.ama-mm-hover-open > ul.sub-menu.ama-mm-panel.ama-mm-align-center,
	.header-nav > li:hover > ul.sub-menu.ama-mm-panel.ama-mm-align-center,
	.header-nav > li:focus-within > ul.sub-menu.ama-mm-panel.ama-mm-align-center{
		transform: translateX(-50%) translateY(0) !important;
	}

	/* Safety: if theme applies display:none on nested wrappers, keep them renderable */
	.header-nav ul.sub-menu,
	.header-nav .sub-menus-wrapper{
		display: block !important;
	}
}


/* -------------------------------------------------------------------------
   Unified content animation (submenu + mega submenu inner content)
   Ensures anim_duration + anim_easing apply not only to the panel container
   but also to items inside, so content doesn't "pop" with a separate feel.
---------------------------------------------------------------------------*/
@media (min-width: 821px){

	/* Default (closed): keep items slightly offset + transparent */
	.header-nav > li > ul.sub-menu > li,
	.header-nav > li > ul.sub-menu > li > a,
	.header-nav > li > ul.sub-menu > li > .sub-menu > li,
	.header-nav > li > ul.sub-menu > li > .sub-menu > li > a,

	/* Mega panel: animate columns + inner list items too */
	.header-nav > li > ul.sub-menu.ama-mm-panel > li,
	.header-nav > li > ul.sub-menu.ama-mm-panel > li > a,
	.header-nav > li > ul.sub-menu.ama-mm-panel li > ul.sub-menu > li,
	.header-nav > li > ul.sub-menu.ama-mm-panel li > ul.sub-menu > li > a{
		opacity: 0 !important;
		transform: translateY(var(--ama-mm-anim-slide, 10px)) !important;
		transition:
			opacity var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease) !important,
			transform var(--ama-mm-anim-dur, 180ms) var(--ama-mm-anim-ease, ease) !important;
		will-change: opacity, transform;
	}

	/* Open state: bring everything in */
	.header-nav > li.ama-mm-hover-open > ul.sub-menu > li,
	.header-nav > li:hover > ul.sub-menu > li,
	.header-nav > li:focus-within > ul.sub-menu > li,
	.header-nav > li.is-open > ul.sub-menu > li,

	.header-nav > li.ama-mm-hover-open > ul.sub-menu > li > a,
	.header-nav > li:hover > ul.sub-menu > li > a,
	.header-nav > li:focus-within > ul.sub-menu > li > a,
	.header-nav > li.is-open > ul.sub-menu > li > a,

	.header-nav > li.ama-mm-hover-open > ul.sub-menu > li > .sub-menu > li,
	.header-nav > li:hover > ul.sub-menu > li > .sub-menu > li,
	.header-nav > li:focus-within > ul.sub-menu > li > .sub-menu > li,
	.header-nav > li.is-open > ul.sub-menu > li > .sub-menu > li,

	.header-nav > li.ama-mm-hover-open > ul.sub-menu > li > .sub-menu > li > a,
	.header-nav > li:hover > ul.sub-menu > li > .sub-menu > li > a,
	.header-nav > li:focus-within > ul.sub-menu > li > .sub-menu > li > a,
	.header-nav > li.is-open > ul.sub-menu > li > .sub-menu > li > a{
		opacity: 1 !important;
		transform: translateY(0) !important;
	}

	/* Deeper levels (3rd+) should also follow the same feel when hovered/focused */
	.header-nav ul.sub-menu li:hover > ul.sub-menu > li,
	.header-nav ul.sub-menu li:focus-within > ul.sub-menu > li,
	.header-nav ul.sub-menu li.is-open > ul.sub-menu > li,
	.header-nav ul.sub-menu li:hover > ul.sub-menu > li > a,
	.header-nav ul.sub-menu li:focus-within > ul.sub-menu > li > a,
	.header-nav ul.sub-menu li.is-open > ul.sub-menu > li > a{
		opacity: 1 !important;
		transform: translateY(0) !important;
	}
}
