/* MegaGen full-screen navigation — Swiss clinical editorial treatment. */

.mg-overlay {
	--mg-menu-paper: #f4f7f9;
	--mg-menu-ink: #0a2436;
	--mg-menu-blue: #0067b1;
	--mg-menu-line: #ced9e1;
	background: var(--mg-menu-paper) !important;
	color: var(--mg-menu-ink);
	box-shadow: none;
	isolation: isolate;
	min-height: 100dvh;
	overflow-x: hidden;
	overscroll-behavior: contain;
}

.mg-overlay::before {
	content: "FOR LIFETIME SMILES";
	position: fixed;
	inset-block: 0;
	left: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 78px;
	padding-block-start: 150px;
	background: var(--mg-menu-blue);
	color: #fff;
	font: 650 14px/1 sans-serif;
	letter-spacing: .08em;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	pointer-events: none;
}

.mg-overlay::after {
	content: "MEGAGEN";
	position: fixed;
	inset-inline: 5vw 0;
	inset-block-end: -5.5vw;
	z-index: 0;
	color: rgba(10, 36, 54, .045);
	font: 800 clamp(150px, 22vw, 390px)/.72 Arial, sans-serif;
	letter-spacing: -.07em;
	text-align: center;
	pointer-events: none;
}

/* The brand mark is a link home (see mg_build_nav). It is styled as the mark,
   not as a link — but it still has to answer to the pointer and to the
   keyboard, or it reads as decoration. */
.mg-overlay__badge {
	text-decoration: none;
	cursor: pointer;
	transition: opacity .2s ease, transform .2s cubic-bezier(.22, 1, .36, 1);
	z-index: 4;
	inset-block-start: 27px;
	inset-inline-start: auto;
	right: 3.5vw;
	display: flex;
	align-items: center;
	gap: 13px;
	direction: ltr;
	min-width: 230px;
	min-height: 62px;
	padding: 0 0 0 24px;
	border: 0;
	border-inline-end: 0;
	border-left: 1px solid #aab9c4;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--mg-menu-blue);
	font-size: 0;
	text-align: right;
}

.mg-overlay__brandmark {
	position: relative;
	display: block;
	width: 47px;
	height: 47px;
	flex: 0 0 47px;
}
.mg-overlay__brandmark i { position: absolute; display: block; width: 22px; height: 22px; border-radius: 3px; }
.mg-overlay__brandmark i:nth-child(1) { inset-block-start: 2px; inset-inline-start: 2px; background: #dd287e; }
.mg-overlay__brandmark i:nth-child(2) { inset-block-start: 0; inset-inline-end: 2px; background: #67b84c; }
.mg-overlay__brandmark i:nth-child(3) { inset-block-end: 1px; inset-inline-start: 7px; background: #1198d2; }
.mg-overlay__brandmark i:nth-child(4) { inset-block-start: 14px; inset-inline-start: 14px; background: #0067b1; opacity: .9; }
.mg-overlay__brandtype { display: flex; flex-direction: column; align-items: flex-start; direction: ltr; }
.mg-overlay__brandtype b { color: var(--mg-menu-ink); font: 760 31px/.9 Arial, sans-serif; letter-spacing: -.045em; }
.mg-overlay__brandtype em { align-self: flex-end; margin-block-start: 6px; color: var(--mg-menu-blue); font: 720 16px/1 var(--mg-font, "Vazirmatn", sans-serif); font-style: normal; }
.mg-overlay__badge:not(.mg-overlay__brandlockup)::before {
	content: "MEGAGEN IRAN";
	color: var(--mg-menu-ink);
	font: 800 25px/1 Arial, sans-serif;
}
a.mg-overlay__badge:hover { opacity: .78; transform: translateY(-1px); }
a.mg-overlay__badge:active { transform: translateY(0); }
a.mg-overlay__badge:focus-visible {
	outline: 3px solid var(--mg-menu-blue, #0067b1);
	outline-offset: 6px;
	border-radius: 10px;
}
@media (prefers-reduced-motion: reduce) {
	a.mg-overlay__badge { transition: none; }
	a.mg-overlay__badge:hover { transform: none; }
}

.mg-overlay__close {
	z-index: 5;
	inset-block-start: 0;
	inset-inline-end: auto;
	left: 0;
	width: 78px;
	height: 112px;
	border: 0;
	border-radius: 0;
	background: var(--mg-menu-ink);
	box-shadow: none;
	overflow: visible;
	transition: background-color .25s ease, transform .35s cubic-bezier(.22,1,.36,1);
}

.mg-overlay__close::after {
	content: "بستن منو";
	position: absolute;
	inset-block-start: 42px;
	left: 98px;
	width: 88px;
	color: var(--mg-menu-ink);
	font: 700 12px/1.4 var(--mg-font, "Vazirmatn", sans-serif);
	white-space: nowrap;
}

.mg-overlay__close:hover { background: #102f44; transform: none; }
.mg-overlay__close svg { width: 27px; height: 27px; }

.mg-overlay__search {
	z-index: 4;
	inset-block-start: 27px;
	inset-inline-start: 50%;
	width: min(520px, 42vw);
	min-height: 58px;
	padding: 7px 18px 7px 7px;
	border: 1px solid #9eafbb;
	border-radius: 0;
	background: rgba(255,255,255,.5);
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.mg-overlay__search:focus-within { border-color: var(--mg-menu-blue); box-shadow: 0 0 0 3px rgba(0,103,177,.1); }
.mg-overlay__search input { color: var(--mg-menu-ink); font-size: 14px; }
.mg-overlay__search button { min-height: 42px; padding: 9px 18px; border-radius: 0; background: var(--mg-menu-blue); }

.mg-overlay__inner,
.mg-overlay__inner--multi {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: minmax(310px, .76fr) minmax(0, 1.54fr);
	gap: 0;
	width: auto;
	max-width: none;
	min-height: 0;
	margin: 0 max(76px, 6vw) 0 154px;
	padding: 168px 0 198px;
	align-content: start;
}

.mg-overlay__col {
	min-width: 0;
	padding: 0 clamp(28px, 4vw, 62px);
	border-inline-start: 1px solid var(--mg-menu-line);
	opacity: 0;
	transform: translateY(22px);
	transition: opacity .42s ease, transform .65s cubic-bezier(.22,1,.36,1);
}

.mg-overlay__col:first-child { border-inline-start: 0; }
.mg-overlay__col:nth-child(2) {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-template-rows: auto 1fr;
	column-gap: clamp(32px, 4vw, 64px);
}
.mg-overlay__col:nth-child(2) > .mg-overlay__label:first-child { grid-column: 1; grid-row: 1; }
.mg-overlay__col:nth-child(2) > .mg-overlay__links:first-of-type { grid-column: 1; grid-row: 2; }
.mg-overlay__col:nth-child(2) > .mg-overlay__label:nth-of-type(2) { grid-column: 2; grid-row: 1; margin-block-start: 0 !important; }
.mg-overlay__col:nth-child(2) > .mg-overlay__links:nth-of-type(2) { grid-column: 2; grid-row: 2; }
.mg-overlay__col:nth-child(2) > .mg-overlay__label:nth-of-type(2),
.mg-overlay__col:nth-child(2) > .mg-overlay__links:nth-of-type(2) { padding-inline-start: clamp(24px, 3vw, 48px); border-inline-start: 1px solid var(--mg-menu-line); }
.mg-overlay.is-open .mg-overlay__col { opacity: 1; transform: translateY(0); }
.mg-overlay.is-open .mg-overlay__col:nth-child(2) { transition-delay: .07s; }
.mg-overlay.is-open .mg-overlay__col:nth-child(3) { transition-delay: .14s; }
.mg-overlay.is-open .mg-overlay__col:nth-child(4) { transition-delay: .21s; }

.mg-overlay__label {
	min-height: 32px;
	margin: 0 0 28px;
	padding: 0 0 13px;
	border-block-end: 2px solid var(--mg-menu-blue);
	color: var(--mg-menu-ink);
	font-size: 17px;
	font-weight: 790;
	text-transform: none;
	letter-spacing: -.02em;
}

.mg-overlay__label::before { display: none; }
.mg-overlay__links { counter-reset: mg-menu-link; gap: 0; align-items: stretch; }

.mg-overlay__links a,
.mg-overlay__inner--multi .mg-overlay__links a,
.mg-overlay__links--sub a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 67px;
	padding: 12px 50px 12px 22px;
	border-block-end: 1px solid var(--mg-menu-line);
	color: var(--mg-menu-ink);
	font-size: clamp(17px, 1.65vw, 26px);
	font-weight: 670;
	letter-spacing: -.025em;
	line-height: 1.35;
	transition: color .22s ease, padding .35s cubic-bezier(.22,1,.36,1), background-color .22s ease;
	counter-increment: mg-menu-link;
}

.mg-overlay__col:first-child .mg-overlay__links a { min-height: 78px; font-size: clamp(24px, 2.4vw, 39px); font-weight: 790; }
.mg-overlay__links a::before { content: "0" counter(mg-menu-link); position: absolute; inset-inline-start: 19px; color: #91a2ae; font: 650 10px/1 sans-serif; }
.mg-overlay__links a:hover { padding-inline-start: 58px; background: rgba(0,103,177,.045); color: var(--mg-menu-blue); }
.mg-overlay__arrow { color: var(--mg-menu-blue); }
.mg-overlay__arrow svg { width: .68em; height: .68em; }

.mg-overlay__foot {
	z-index: 2;
	inset-block-end: 18px;
	inset-inline: 120px 5vw;
	justify-content: flex-start;
	padding: 17px 0 0;
	border-block-start: 1px solid var(--mg-menu-line);
	border-block-end: 0;
	background: transparent;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	color: var(--mg-menu-muted, #657987);
	font-size: 12px;
	pointer-events: auto;
}

.mg-overlay__foot a,
.mg-overlay__foot span { color: var(--mg-menu-ink); }

[data-theme="dark"] .mg-overlay {
	--mg-menu-paper: #0b1b27;
	--mg-menu-ink: #edf4f8;
	--mg-menu-line: rgba(255,255,255,.14);
	background: var(--mg-menu-paper) !important;
}

[data-theme="dark"] .mg-overlay::after { color: rgba(255,255,255,.035); }
[data-theme="dark"] .mg-overlay__badge::before,
[data-theme="dark"] .mg-overlay__brandtype b,
[data-theme="dark"] .mg-overlay__label,
[data-theme="dark"] .mg-overlay__links a,
[data-theme="dark"] .mg-overlay__foot a,
[data-theme="dark"] .mg-overlay__foot span { color: var(--mg-menu-ink); }
[data-theme="dark"] .mg-overlay__search { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.25); }
[data-theme="dark"] .mg-overlay__search input { color: var(--mg-menu-ink); }
[data-theme="dark"] .mg-overlay__links a:hover { background: rgba(255,255,255,.045); color: #6bc2f5; }

@media (max-width: 1180px) and (min-width: 981px) {
	.mg-overlay__inner,
	.mg-overlay__inner--multi {
		grid-template-columns: minmax(255px, .72fr) minmax(0, 1.28fr);
		margin: 0 54px 0 108px;
	}
	.mg-overlay__col { padding-inline: 30px; }
	.mg-overlay__col:nth-child(2) { column-gap: 26px; }
	.mg-overlay__col:nth-child(2) > .mg-overlay__label:nth-of-type(2),
	.mg-overlay__col:nth-child(2) > .mg-overlay__links:nth-of-type(2) { padding-inline-start: 26px; }
	.mg-overlay__links a,
	.mg-overlay__inner--multi .mg-overlay__links a,
	.mg-overlay__links--sub a { font-size: clamp(16px, 1.8vw, 22px); }
	.mg-overlay__col:first-child .mg-overlay__links a { font-size: clamp(23px, 2.8vw, 32px); }
}

@media (max-width: 980px) {
	.mg-overlay::before { width: 62px; }
	.mg-overlay__close { width: 62px; }
	.mg-overlay__close::after { left: 78px; }
	.mg-overlay__inner,
	.mg-overlay__inner--multi { width: auto; margin: 0 54px 0 94px; grid-template-columns: minmax(250px, .75fr) minmax(0, 1.35fr); padding-block-start: 150px; }
	.mg-overlay__col:nth-child(3) { border-block-start: 1px solid var(--mg-menu-line); padding-block-start: 34px; }
	.mg-overlay__foot { inset-inline-start: 90px; }
}

@media (max-width: 700px) {
	.mg-overlay::before,
	.mg-overlay::after,
	.mg-overlay__badge { display: none; }
	.mg-overlay__close { inset-block-start: 14px; left: 14px; width: 48px; height: 48px; border-radius: 0; }
	.mg-overlay__close::after { display: none; }
	.mg-overlay__search { inset-block-start: 78px; width: calc(100% - 28px); min-height: 52px; }
	.mg-overlay__inner,
	.mg-overlay__inner--multi { display: block; width: calc(100% - 28px); padding: 156px 0 84px; }
	.mg-overlay__col { padding: 28px 0; border-inline-start: 0; border-block-start: 1px solid var(--mg-menu-line); }
	.mg-overlay__col:nth-child(2) { display: block; }
	.mg-overlay__col:nth-child(2) > .mg-overlay__label:nth-of-type(2) { margin-block-start: 34px !important; }
	.mg-overlay__col:nth-child(2) > .mg-overlay__label:nth-of-type(2),
	.mg-overlay__col:nth-child(2) > .mg-overlay__links:nth-of-type(2) { padding-inline-start: 0; border-inline-start: 0; }
	.mg-overlay__col:first-child { border-block-start: 0; }
	.mg-overlay__label { margin-block-end: 12px; font-size: 14px; }
	.mg-overlay__links a,
	.mg-overlay__inner--multi .mg-overlay__links a,
	.mg-overlay__links--sub a,
	.mg-overlay__col:first-child .mg-overlay__links a { min-height: 59px; font-size: clamp(20px, 7vw, 31px); }
	.mg-overlay__foot { position: relative; inset: auto; justify-content: flex-start; margin: 0 14px; padding: 18px 0 calc(20px + env(safe-area-inset-bottom)); }
}

@media (prefers-reduced-motion: reduce) {
	.mg-overlay__col,
	.mg-overlay__links a,
	.mg-overlay__close { transition-duration: .01ms !important; }
}

/* Stable desktop composition: each menu group owns a real column. The
 * ecosystem group is separated by mega-menu-v2.js before the overlay opens. */
@media (min-width: 701px) {
	.mg-overlay {
		--mg-menu-rail-content: "FOR LIFETIME SMILES";
		--mg-menu-wordmark: "MEGAGEN";
		overflow-x: hidden;
	}
	.mg-overlay::before {
		content: var(--mg-menu-rail-content);
	}
	.mg-overlay::after {
		content: var(--mg-menu-wordmark);
		position: absolute;
		inset-block-end: 72px;
		z-index: 0;
		max-width: 100%;
		white-space: nowrap;
		pointer-events: none;
	}
	.mg-overlay--wordmark-off::after { display: none; }
	.mg-overlay__inner,
	.mg-overlay__inner--multi {
		z-index: 2;
		grid-template-columns: minmax(285px, 1.18fr) repeat(2, minmax(220px, 1fr));
		gap: 0;
		margin: 0 max(64px, 5vw) 0 126px;
		padding: 156px 0 146px;
	}
	.mg-overlay__col,
	.mg-overlay__col:nth-child(2) {
		display: block;
		padding: 0 clamp(24px, 3.2vw, 52px);
		border-inline-start: 1px solid var(--mg-menu-line);
	}
	.mg-overlay__col:first-child { border-inline-start: 0; }
	.mg-overlay__col:nth-child(2) > .mg-overlay__label,
	.mg-overlay__col:nth-child(2) > .mg-overlay__links {
		padding-inline-start: 0;
		border-inline-start: 0;
	}
	.mg-overlay__col:nth-child(2) > .mg-overlay__label:nth-of-type(2) { margin-block-start: 34px !important; }
	.mg-overlay__close {
		inset-block-start: 20px;
		left: 20px;
		width: 48px;
		height: 48px;
		border: 1px solid rgba(11, 27, 39, .18);
		border-radius: 4px;
		background: var(--mg-menu-paper);
		color: var(--mg-menu-ink);
		box-shadow: 0 5px 16px rgba(10, 29, 42, .09);
	}
	.mg-overlay__close::after { display: none; }
	.mg-overlay__close:hover { background: var(--mg-menu-blue); color: #fff; }
	.mg-overlay__close svg { width: 19px; height: 19px; }
	.mg-overlay__brandimage { display: block; width: auto; max-width: 210px; height: 54px; object-fit: contain; object-position: right center; }
	.mg-overlay__foot {
		position: fixed;
		z-index: 4;
		inset: auto max(64px, 5vw) 0 126px;
		min-height: 70px;
		padding: 17px 0 16px;
		border-block-start: 1px solid var(--mg-menu-line);
		background: var(--mg-menu-paper);
		box-shadow: 0 -14px 22px var(--mg-menu-paper);
	}
}

@media (max-width: 1180px) and (min-width: 981px) {
	.mg-overlay__inner,
	.mg-overlay__inner--multi {
		grid-template-columns: minmax(230px, 1.15fr) repeat(2, minmax(180px, 1fr));
		margin-inline-start: 100px;
		padding-block-start: 144px;
	}
	.mg-overlay__col,
	.mg-overlay__col:nth-child(2) { padding-inline: 22px; }
	.mg-overlay__col:first-child .mg-overlay__links a { font-size: clamp(22px, 2.45vw, 31px); }
}

@media (max-width: 980px) and (min-width: 701px) {
	.mg-overlay__inner,
	.mg-overlay__inner--multi {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin: 0 48px 0 84px;
		padding-block-end: 160px;
	}
	.mg-overlay__col:nth-child(3) {
		margin-block-start: 34px;
		padding-block-start: 34px;
		border-block-start: 1px solid var(--mg-menu-line);
	}
	.mg-overlay__foot { inset-inline: 84px 48px; }
}

@media (max-width: 700px) {
	.mg-overlay__brandimage { max-width: 180px; height: 44px; }
	.mg-overlay__foot { background: var(--mg-menu-paper); }
}

/* Final menu legibility safeguards — these intentionally outrank older theme
 * styles that are also loaded on legacy landing pages. */
@media (min-width: 701px) {
	.mg-overlay::before {
		content: var(--mg-menu-rail-content, "FOR LIFETIME SMILES") !important;
		inset: 0 0 0 auto !important;
		z-index: 7 !important;
		display: flex !important;
		width: 72px !important;
		padding: 26px 0 !important;
		background: linear-gradient(180deg, rgba(0, 103, 177, .9), rgba(5, 53, 91, .84)) !important;
		border-inline-start: 1px solid rgba(255,255,255,.42) !important;
		box-shadow: -14px 0 35px rgba(3, 39, 68, .18), inset 1px 0 rgba(255,255,255,.18) !important;
		color: #fff !important;
		font: 700 11px/1.25 Arial, sans-serif !important;
		letter-spacing: .17em !important;
		text-shadow: 0 1px 1px rgba(0,0,0,.22);
		writing-mode: vertical-rl !important;
		transform: none !important;
	}
	.mg-overlay {
		--mg-menu-paper: rgba(232, 241, 246, .72);
		--mg-menu-line: rgba(42, 83, 111, .2);
		background: radial-gradient(circle at 18% 7%, rgba(255,255,255,.8), transparent 30%), radial-gradient(circle at 82% 88%, rgba(93,180,226,.22), transparent 33%), rgba(226, 238, 245, .69) !important;
		backdrop-filter: blur(22px) saturate(142%);
		-webkit-backdrop-filter: blur(22px) saturate(142%);
	}
	.mg-overlay__inner,
	.mg-overlay__inner--multi { margin: 0 126px 0 max(64px, 5vw) !important; }
	.mg-overlay__col { background: rgba(255,255,255,.2); backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px); }
	.mg-overlay__foot { inset: auto 126px 0 max(64px, 5vw) !important; background: rgba(240,247,250,.78) !important; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
	.mg-overlay__close {
		z-index: 8 !important;
		background: #0a2436 !important;
		border-color: rgba(255,255,255,.24) !important;
		color: #fff !important;
	}
	.mg-overlay__close svg { stroke: currentColor !important; }
	.mg-overlay__close:hover { background: var(--mg-menu-blue) !important; }
	.mg-overlay__links a { padding-inline-start: 22px !important; }
	.mg-overlay__links a::before { display: none !important; content: none !important; }
	[data-theme="dark"] .mg-overlay {
		--mg-menu-paper: rgba(8, 26, 39, .76);
		--mg-menu-line: rgba(216,235,246,.18);
		background: radial-gradient(circle at 18% 7%, rgba(44,103,139,.32), transparent 31%), radial-gradient(circle at 82% 88%, rgba(0,103,177,.2), transparent 36%), rgba(7, 24, 36, .76) !important;
	}
	[data-theme="dark"] .mg-overlay__col { background: rgba(255,255,255,.035); }
	[data-theme="dark"] .mg-overlay__foot { background: rgba(8, 26, 39, .82) !important; }
}

/* Transparent glass mode: the landing page remains visible through the menu.
 * Blur belongs to the controls and content panes, not the full-screen veil. */
@media (min-width: 701px) {
	.mg-overlay {
		--mg-menu-paper: rgba(244, 249, 252, .34);
		--mg-menu-line: rgba(52, 91, 116, .2);
		background:
			linear-gradient(115deg, rgba(240, 248, 252, .2), rgba(217, 235, 245, .08)),
			rgba(238, 247, 251, .08) !important;
		backdrop-filter: saturate(118%) blur(1.5px) !important;
		-webkit-backdrop-filter: saturate(118%) blur(1.5px) !important;
	}

	.mg-overlay__inner,
	.mg-overlay__inner--multi {
		grid-column-gap: 16px !important;
	}

	.mg-overlay__col,
	.mg-overlay__col:nth-child(2) {
		padding: 28px clamp(24px, 3vw, 46px) 32px !important;
		border: 1px solid rgba(255,255,255,.56) !important;
		border-radius: 20px;
		background: rgba(245, 250, 252, .46) !important;
		box-shadow:
			inset 0 1px 0 rgba(255,255,255,.7),
			0 18px 44px -32px rgba(5,35,54,.36);
		backdrop-filter: blur(16px) saturate(136%) !important;
		-webkit-backdrop-filter: blur(16px) saturate(136%) !important;
	}

	.mg-overlay__search,
	.mg-overlay__badge {
		background: rgba(248,252,254,.5) !important;
		border-color: rgba(255,255,255,.66) !important;
		box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 14px 32px -25px rgba(6,39,61,.38) !important;
		backdrop-filter: blur(18px) saturate(140%) !important;
		-webkit-backdrop-filter: blur(18px) saturate(140%) !important;
	}

	.mg-overlay__foot {
		margin-block-end: 12px;
		padding-inline: 22px !important;
		border: 1px solid rgba(255,255,255,.58) !important;
		border-radius: 15px;
		background: rgba(245,250,252,.54) !important;
		box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 18px 38px -30px rgba(5,35,54,.38) !important;
		backdrop-filter: blur(18px) saturate(138%) !important;
		-webkit-backdrop-filter: blur(18px) saturate(138%) !important;
	}

	.mg-overlay::after { color: rgba(10,36,54,.025) !important; }

	[data-theme="dark"] .mg-overlay {
		--mg-menu-paper: rgba(8, 25, 37, .34);
		background: linear-gradient(115deg, rgba(9,30,44,.22), rgba(2,17,27,.09)) !important;
		backdrop-filter: saturate(112%) blur(2px) !important;
		-webkit-backdrop-filter: saturate(112%) blur(2px) !important;
	}
	[data-theme="dark"] .mg-overlay__col,
	[data-theme="dark"] .mg-overlay__col:nth-child(2),
	[data-theme="dark"] .mg-overlay__search,
	[data-theme="dark"] .mg-overlay__badge,
	[data-theme="dark"] .mg-overlay__foot {
		background: rgba(8,27,40,.5) !important;
		border-color: rgba(255,255,255,.14) !important;
	}
}

/* Slightly denser glass and number-free navigation at every breakpoint. */
.mg-overlay__links { counter-reset: none !important; }
.mg-overlay__links a { counter-increment: none !important; }
.mg-overlay__links a::before { content: none !important; display: none !important; }

@media (min-width: 701px) {
	.mg-overlay {
		background: linear-gradient(115deg, rgba(240,248,252,.31), rgba(217,235,245,.17)), rgba(238,247,251,.16) !important;
	}
	.mg-overlay__col,
	.mg-overlay__col:nth-child(2) { background: rgba(245,250,252,.62) !important; }
	.mg-overlay__search,
	.mg-overlay__badge { background: rgba(248,252,254,.66) !important; }
	.mg-overlay__foot { background: rgba(245,250,252,.7) !important; }
	[data-theme="dark"] .mg-overlay { background: linear-gradient(115deg, rgba(9,30,44,.35), rgba(2,17,27,.2)) !important; }
	[data-theme="dark"] .mg-overlay__col,
	[data-theme="dark"] .mg-overlay__col:nth-child(2),
	[data-theme="dark"] .mg-overlay__search,
	[data-theme="dark"] .mg-overlay__badge,
	[data-theme="dark"] .mg-overlay__foot { background: rgba(8,27,40,.68) !important; }
}

@media (max-width: 700px) {
	.mg-overlay {
		--mg-menu-paper: rgba(241,248,251,.72);
		--mg-menu-line: rgba(52,91,116,.2);
		background: linear-gradient(145deg, rgba(240,248,252,.48), rgba(211,232,243,.28)), rgba(235,245,250,.24) !important;
		backdrop-filter: blur(3px) saturate(122%) !important;
		-webkit-backdrop-filter: blur(3px) saturate(122%) !important;
	}
	.mg-overlay__search {
		padding-inline: 13px 6px;
		border: 1px solid rgba(255,255,255,.7) !important;
		border-radius: 14px;
		background: rgba(248,252,254,.76) !important;
		box-shadow: inset 0 1px rgba(255,255,255,.82), 0 16px 34px -27px rgba(5,35,54,.42) !important;
		backdrop-filter: blur(16px) saturate(136%) !important;
		-webkit-backdrop-filter: blur(16px) saturate(136%) !important;
	}
	.mg-overlay__inner,
	.mg-overlay__inner--multi { margin-inline: 14px !important; }
	.mg-overlay__col,
	.mg-overlay__col:nth-child(2) {
		margin-block-end: 12px;
		padding: 24px 20px !important;
		border: 1px solid rgba(255,255,255,.66) !important;
		border-radius: 18px;
		background: rgba(247,251,253,.72) !important;
		box-shadow: inset 0 1px rgba(255,255,255,.82), 0 17px 38px -31px rgba(5,35,54,.4);
		backdrop-filter: blur(15px) saturate(132%) !important;
		-webkit-backdrop-filter: blur(15px) saturate(132%) !important;
	}
	.mg-overlay__foot {
		margin: 4px 14px 14px !important;
		padding: 18px !important;
		border: 1px solid rgba(255,255,255,.66) !important;
		border-radius: 16px;
		background: rgba(247,251,253,.76) !important;
		backdrop-filter: blur(16px) saturate(132%) !important;
		-webkit-backdrop-filter: blur(16px) saturate(132%) !important;
	}
	.mg-overlay__close { border-radius: 12px !important; box-shadow: 0 12px 26px -17px rgba(5,35,54,.55) !important; }
	[data-theme="dark"] .mg-overlay { background: linear-gradient(145deg, rgba(8,28,42,.46), rgba(3,17,27,.28)) !important; }
	[data-theme="dark"] .mg-overlay__search,
	[data-theme="dark"] .mg-overlay__col,
	[data-theme="dark"] .mg-overlay__col:nth-child(2),
	[data-theme="dark"] .mg-overlay__foot {
		background: rgba(8,27,40,.76) !important;
		border-color: rgba(255,255,255,.15) !important;
	}
}

/* Desktop composition guardrails.
 * Keep the full-screen menu independent from the landing header, fit every
 * group above the fixed contact strip, and cap the reading width on ultra-wide
 * displays. The base menu remains scrollable for short laptop viewports. */
html.mg-menu-open .mg-nav {
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
}

@media (min-width: 981px) {
	html.mg-menu-open .mg-nav,
	body:has(.mg-overlay.is-open) .mg-nav {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	.mg-overlay {
		background:
			radial-gradient(circle at 18% 8%, rgba(255,255,255,.92), transparent 30%),
			radial-gradient(circle at 82% 88%, rgba(93,180,226,.16), transparent 34%),
			#e9f1f5 !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
		scrollbar-gutter: stable;
	}

	.mg-overlay__inner,
	.mg-overlay__inner--multi {
		width: min(1760px, calc(100% - 216px)) !important;
		min-height: 100dvh !important;
		margin: 0 auto !important;
		padding: 120px 0 104px !important;
		box-sizing: border-box !important;
		grid-template-columns: minmax(280px, 1.12fr) repeat(2, minmax(220px, 1fr)) !important;
		gap: 16px !important;
		align-items: start !important;
	}

	.mg-overlay__col,
	.mg-overlay__col:nth-child(2) {
		align-self: start !important;
		padding: 22px clamp(22px, 2.4vw, 38px) 26px !important;
		border: 1px solid rgba(255,255,255,.72) !important;
		border-radius: 16px !important;
		background: rgba(248,251,253,.94) !important;
		box-shadow: inset 0 1px rgba(255,255,255,.82), 0 20px 48px -38px rgba(5,35,54,.4) !important;
		backdrop-filter: blur(14px) saturate(125%) !important;
		-webkit-backdrop-filter: blur(14px) saturate(125%) !important;
	}

	.mg-overlay__label {
		min-height: 0 !important;
		margin: 0 0 12px !important;
		padding: 0 0 10px !important;
		font-size: 15px !important;
	}

	.mg-overlay__links a,
	.mg-overlay__inner--multi .mg-overlay__links a,
	.mg-overlay__links--sub a {
		min-height: clamp(48px, 7vh, 62px) !important;
		padding: 9px 18px !important;
		font-size: clamp(16px, 1.35vw, 22px) !important;
		line-height: 1.35 !important;
	}

	.mg-overlay__col:first-child .mg-overlay__links a {
		min-height: clamp(52px, 7.4vh, 64px) !important;
		font-size: clamp(21px, 1.9vw, 30px) !important;
	}

	.mg-overlay__badge { right: max(96px, 7vw) !important; }

	.mg-overlay__foot {
		left: 50% !important;
		right: auto !important;
		width: min(1760px, calc(100% - 216px)) !important;
		min-height: 58px !important;
		margin-block-end: 10px !important;
		padding: 13px 18px !important;
		box-sizing: border-box !important;
		transform: translateX(-50%) !important;
	}

	[data-theme="dark"] .mg-overlay {
		background:
			radial-gradient(circle at 18% 8%, rgba(44,103,139,.22), transparent 31%),
			radial-gradient(circle at 82% 88%, rgba(0,103,177,.15), transparent 36%),
			#071824 !important;
	}

	[data-theme="dark"] .mg-overlay__col,
	[data-theme="dark"] .mg-overlay__col:nth-child(2) {
		background: rgba(10,31,45,.94) !important;
		border-color: rgba(255,255,255,.13) !important;
	}
}

/* The existing two-column tablet composition stays intact, but the landing
 * header and hero must not show through the open navigation surface. */
@media (min-width: 701px) and (max-width: 980px) {
	html.mg-menu-open .mg-nav,
	body:has(.mg-overlay.is-open) .mg-nav {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}
	.mg-overlay {
		background: #e9f1f5 !important;
		backdrop-filter: none !important;
		-webkit-backdrop-filter: none !important;
	}
	.mg-overlay__badge { right: 80px !important; }
	[data-theme="dark"] .mg-overlay { background: #071824 !important; }
}

/* At browser Zoom-out the CSS viewport becomes much wider than the physical
 * display. Grow the menu composition enough to preserve readable hierarchy. */
@media (min-width: 1600px) {
	.mg-overlay__inner,
	.mg-overlay__inner--multi,
	.mg-overlay__foot {
		width: min(2200px, calc(100% - 280px)) !important;
	}
	.mg-overlay__inner,
	.mg-overlay__inner--multi { padding-block: 132px 110px !important; }
	.mg-overlay__label { font-size: 18px !important; }
	.mg-overlay__links a,
	.mg-overlay__inner--multi .mg-overlay__links a,
	.mg-overlay__links--sub a {
		min-height: clamp(56px, 7vh, 72px) !important;
		font-size: clamp(20px, 1.1vw, 28px) !important;
	}
	.mg-overlay__col:first-child .mg-overlay__links a {
		min-height: clamp(62px, 7.4vh, 78px) !important;
		font-size: clamp(28px, 1.45vw, 40px) !important;
	}
	.mg-overlay__close { width: 60px !important; height: 60px !important; }
}

@media (min-width: 981px) and (min-height: 700px) {
	.mg-overlay { overflow-y: hidden; }
}