/* Use Cases dropdown (menu2): grouped panel inside the accessible mega menu. */

.site-header #site-navigation .sub-nav.menu2-sub {
	--menu2-blue: var(--memberlite-color-primary, #0c3d54);
	--menu2-orange: var(--memberlite-color-action, #e87102);
	--menu2-muted: #55606a;
	--menu2-soft: #f5f8fa;
	--menu2-tile: #eaf1f5;
	--menu2-border: var(--memberlite-color-borders, #dbe6ed);
	transform: scale(0.97);
	transform-origin: 140px 0;
	transition: opacity 180ms var(--ease-out), transform 180ms var(--ease-out), visibility 0s linear 180ms;
}

/* 60ms open intent: visibility flips at once (keeps it focusable), the fade waits. */
.site-header #site-navigation .sub-nav.menu2-sub.open {
	transform: none;
	transition: opacity 180ms var(--ease-out) 60ms, transform 180ms var(--ease-out) 60ms;
}

.site-header #site-navigation .menu2-panel {
	background: #fff;
	border: 1px solid var(--menu2-border);
	border-radius: 12px;
	box-shadow: 0 16px 24px 2px rgba(29, 17, 51, 0.04), 0 6px 32px 4px rgba(9, 32, 77, 0.12), 0 8px 12px -5px rgba(29, 17, 51, 0.12);
	color: var(--menu2-blue);
	max-width: 100%;
	padding: 24px 28px;
	width: 790px;
}

.site-header #site-navigation .menu2-columns {
	display: grid;
	gap: 28px;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.site-header #site-navigation .menu2-group {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.site-header #site-navigation .menu2-group + .menu2-group {
	border-left: 1px solid var(--menu2-border);
	padding-left: 28px;
}

.site-header #site-navigation .menu2-panel .menu2-heading {
	color: #6b7a85;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.08em;
	line-height: 1.35;
	margin: 0 0 12px;
	text-transform: uppercase;
}

.site-header #site-navigation .menu2-panel ul.menu2-links {
	display: flex;
	flex-direction: column;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
	width: auto;
}

.site-header #site-navigation .menu2-panel .menu2-links li {
	margin: 0;
	padding: 0;
}

.site-header #site-navigation .menu2-panel .menu2-links a.menu2-row {
	align-items: center;
	border-radius: 10px;
	color: var(--menu2-blue);
	display: flex;
	gap: 12px;
	min-height: 58px;
	padding: 10px 12px;
	text-decoration: none;
	transition: background-color 200ms ease, box-shadow 200ms ease, color 200ms ease;
}

.site-header #site-navigation .menu2-icon {
	background: var(--menu2-tile);
	border-radius: 10px;
	color: var(--menu2-blue);
	display: grid;
	flex: 0 0 36px;
	height: 36px;
	place-items: center;
	transition: background-color 200ms ease, color 200ms ease;
	width: 36px;
}

.site-header #site-navigation .menu2-icon svg {
	display: block;
	height: 20px;
	width: 20px;
}

.site-header #site-navigation .menu2-copy {
	min-width: 0;
}

.site-header #site-navigation .menu2-label {
	color: currentColor;
	display: block;
	font-family: var(--memberlite-header-font, inherit);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.25;
}

.site-header #site-navigation .menu2-description {
	color: var(--menu2-muted);
	display: block;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.35;
	margin-top: 3px;
}

.site-header #site-navigation .menu2-panel .menu2-links a.menu2-row:focus-visible {
	background: var(--menu2-soft);
	box-shadow: inset 0 0 0 1px var(--menu2-border);
	color: var(--menu2-hue, var(--menu2-orange));
	outline: 2px solid var(--menu2-orange);
	outline-offset: 1px;
}

.site-header #site-navigation .menu2-row:focus-visible .menu2-icon {
	background: var(--menu2-hue-soft, #fff4ea);
	color: var(--menu2-hue, var(--menu2-orange));
}

.site-header #site-navigation .menu2-choice {
	background: var(--menu2-soft);
	border: 1px solid var(--menu2-border);
	border-radius: 10px;
	margin-top: auto;
	padding: 16px;
}

.site-header #site-navigation .menu2-panel .menu2-choice-title {
	color: var(--menu2-blue);
	font-family: var(--memberlite-header-font, inherit);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	margin: 0 0 4px;
}

.site-header #site-navigation .menu2-panel .menu2-choice-copy {
	color: var(--menu2-muted);
	font-size: 13px;
	line-height: 1.4;
	margin: 0 0 9px;
}

.site-header #site-navigation .menu2-choice-links {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.site-header #site-navigation .menu2-panel a.menu2-choice-link {
	color: var(--menu2-blue);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.site-header #site-navigation .menu2-panel a.menu2-choice-link:first-child {
	color: var(--menu2-orange);
}

.site-header #site-navigation .menu2-arrow {
	display: inline-block;
	transition: transform 200ms var(--ease-out);
}

@media (hover: hover) and (pointer: fine) {
	.site-header #site-navigation .menu2-panel .menu2-links a.menu2-row:hover {
		background: var(--menu2-soft);
		box-shadow: inset 0 0 0 1px var(--menu2-border);
		color: var(--menu2-hue, var(--menu2-orange));
		text-decoration: none;
	}
	.site-header #site-navigation .menu2-row:hover .menu2-icon {
		background: var(--menu2-hue-soft, #fff4ea);
		color: var(--menu2-hue, var(--menu2-orange));
	}
	.site-header #site-navigation .menu2-panel a.menu2-choice-link:hover {
		text-decoration: none;
	}
	.site-header #site-navigation .menu2-choice-link:hover .menu2-arrow {
		transform: translateX(3px);
	}
}

@media (max-width: 820px) {
	.site-header #site-navigation .menu2-panel {
		padding: 20px;
	}
	.site-header #site-navigation .menu2-columns {
		gap: 22px;
		grid-template-columns: 1fr;
	}
	.site-header #site-navigation .menu2-group + .menu2-group {
		border-left: 0;
		border-top: 1px solid var(--menu2-border);
		padding: 22px 0 0;
	}
	.site-header #site-navigation .menu2-choice {
		margin-top: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-header #site-navigation .sub-nav.menu2-sub,
	.site-header #site-navigation .sub-nav.menu2-sub.open {
		transform: none;
	}
	.site-header #site-navigation .sub-nav.menu2-sub {
		transition: opacity 100ms linear, visibility 0s linear 100ms;
	}
	.site-header #site-navigation .sub-nav.menu2-sub.open {
		transition: opacity 100ms linear;
	}
}
