/*
 * FI header in design direction B (matches the homepage): see-through purple glass header bar,
 * floating glass "Palvelumme" mega menu, glass dropdowns and the off-canvas mobile menu.
 * Scoped to the FI header via .mtb-menu (desktop navigation) and .mtb-menu-mobile.
 */

@font-face {
	font-family: "Hanken Grotesk";
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url("../fonts/hanken-grotesk-latin-var.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) {
	--mm-deep: #2a0560;
	/* glass: a light purple tint over a blurred, darkened copy of the page, so the page shows through */
	--mm-glass:
		radial-gradient(120% 90% at 0% 0%, rgba(183, 147, 238, .16), rgba(183, 147, 238, 0) 55%),
		linear-gradient(160deg, rgba(93, 14, 192, .42) 0%, rgba(42, 5, 96, .58) 100%);
	--mm-blur: blur(28px) saturate(180%) brightness(.6);
	--mm-bar: linear-gradient(rgba(70, 8, 160, .6), rgba(70, 8, 160, .6));
	--mm-bar-blur: blur(18px) saturate(190%) brightness(.7);
	--mm-line: rgba(255, 255, 255, .13);
	--mm-sheen: inset 0 1px 0 rgba(255, 255, 255, .16);
	--mm-violet: #5d0ec0;
	--mm-lav: #d9c6f8;
	--mm-lav-2: #b793ee;
	--mm-cream: #fbf8ec;
	--mm-orange: #f4690f;
	--mm-orange-2: #ff8b3d;
	--mm-body: "Hanken Grotesk", "Archivo", "Helvetica Neue", sans-serif;
	--mm-display: "Cru", "Anton", "Arial Narrow", sans-serif;
	--mm-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ======================================================================
   Header bar: see-through purple glass.
   The glass sits on a pseudo-element so the menu panels can blur the page too.
   ====================================================================== */
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) {
	position: relative;
	background-color: transparent !important;
}
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu)::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: var(--mm-bar);
	-webkit-backdrop-filter: var(--mm-bar-blur);
	backdrop-filter: var(--mm-bar-blur);
	box-shadow: 0 1px 0 var(--mm-line);
	transition: opacity .3s ease;
}
/* homepage: clear over the hero until the page scrolls or a menu opens */
body.mtb-hb:not(.hb-scrolled) .wp-block-group.is-style-mtb-site-header:has(.mtb-menu):not(:has(.mtb-menu .has-child:hover, .mtb-menu [aria-expanded="true"]))::before {
	opacity: 0;
}

/* "Ota yhteyttä" in orange, as on the homepage */
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-button__link[style*="background-color:var(--wp--preset--color--lavender)"] {
	background-color: var(--mm-orange) !important;
	border-color: var(--mm-orange) !important;
	color: var(--mm-cream) !important;
	transition: transform .25s cubic-bezier(.2, .9, .3, 1.4);
}
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-button__link[style*="background-color:var(--wp--preset--color--lavender)"]:is(:hover, :focus-visible) {
	transform: translateY(-2px);
}

/* language switch: both languages side by side ("FI | EN") instead of a dropdown; the current one is bright */
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages.has-background,
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages .wp-block-navigation__container,
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages .wp-block-navigation-item__content { background-color: transparent !important; }
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages > .wp-block-navigation__container > .wp-block-navigation-submenu { display: flex; align-items: center; }
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages .wp-block-navigation__submenu-icon { display: none !important; }
@media (min-width: 1025px) { .wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages { margin-left: 10px; } }
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages > .wp-block-navigation__container > .wp-block-navigation-submenu > .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
	position: static;
	display: flex;
	flex-direction: row;
	align-items: center;
	width: auto;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: visible;
	opacity: 1;
	visibility: visible;
	transform: none;
	border: 0;
	background: none;
	box-shadow: none;
}
/* thin divider between the two */
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages > .wp-block-navigation__container > .wp-block-navigation-submenu > .wp-block-navigation__submenu-container::before {
	content: "";
	width: 1.5px;
	height: 14px;
	margin: 0 9px;
	background: rgba(217, 198, 248, .45);
}
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages .wp-block-navigation-item__label { padding: 0; }
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	padding: 0;
	color: var(--mm-cream);
}
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content .wp-block-navigation-item__label {
	text-decoration: underline 2px var(--mm-orange-2);
	text-underline-offset: 6px;
}
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0;
	color: rgba(251, 248, 236, .55);
	transition: color .2s ease;
}
.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) .wp-block-navigation.is-style-mtb-languages .wp-block-navigation__submenu-container .wp-block-navigation-item__content:is(:hover, :focus-visible) { color: var(--mm-orange-2); }

/* ======================================================================
   Desktop menu (the desktop header group is shown above 1024px)
   ====================================================================== */
@media (min-width: 1025px) {

	/* ---------- top level ---------- */
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
		color: var(--mm-cream);
		background: linear-gradient(var(--mm-orange-2), var(--mm-orange-2)) no-repeat 20px calc(100% - 7px) / 0 2px;
		transition: background-size .3s var(--mm-ease), color .2s ease;
	}
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover,
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-item:is(:hover, :focus-within) > .wp-block-navigation-item__content,
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-item:has(.current-menu-item) > .wp-block-navigation-item__content,
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
		background-size: var(--mm-underline, calc(100% - 50px - 1em)) 2px;
		text-decoration: none;
	}
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-submenu > .wp-block-navigation__submenu-icon { color: var(--mm-orange-2); }
	.wp-block-navigation.mtb-menu .wp-block-navigation__submenu-icon::before { transition: transform .25s var(--mm-ease); }
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .has-child:is(:hover, :focus-within) > .wp-block-navigation__submenu-icon::before { transform: rotate(180deg); }

	/* ---------- shared panel: purple glass, fade + lift, short close delay as hover intent ---------- */
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-submenu > .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
		height: auto;
		width: auto;
		overflow: visible;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(10px);
		transition: opacity .18s ease .08s, transform .22s ease .08s, visibility 0s linear .3s;
		font-family: var(--mm-body);
		font-size: 16px;
		font-weight: 600;
		line-height: 1.35;
		letter-spacing: normal;
		text-transform: none;
		color: var(--mm-cream);
		background: var(--mm-glass);
		-webkit-backdrop-filter: var(--mm-blur);
		backdrop-filter: var(--mm-blur);
		border: 1px solid var(--mm-line);
		box-shadow: var(--mm-sheen), 0 40px 80px -24px rgba(20, 0, 50, .55);
	}
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container,
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within > .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container,
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .has-child > .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: none;
		transition: opacity .2s ease, transform .28s var(--mm-ease), visibility 0s;
	}
	/* core lets items inherit the panel colour, which would stack the glass; keep items clear */
	.wp-block-navigation.mtb-menu .wp-block-navigation__submenu-container .wp-block-navigation-item { background: transparent; }

	/* invisible bridge so the panel stays open while the pointer travels down to it */
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-submenu > .wp-block-navigation__submenu-container::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 100%;
		height: var(--mm-bridge, 14px);
	}
	.wp-block-navigation.mtb-menu .wp-block-navigation__submenu-container a:focus-visible {
		outline: 3px solid var(--mm-orange-2);
		outline-offset: 2px;
	}

	/* ---------- plain dropdowns ---------- */
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-submenu:not(.mtb-mega) > .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
		top: calc(100% + 12px);
		left: 4px;
		min-width: 260px;
		padding: 10px;
		border-radius: 20px;
	}
	.wp-block-navigation.mtb-menu .wp-block-navigation-submenu:not(.mtb-mega) > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content {
		position: relative;
		z-index: 1;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
		padding: 12px 16px;
		border: 0;
		border-radius: 12px;
		font: inherit;
		font-weight: 700;
		font-size: 15.5px;
		text-transform: none;
		letter-spacing: normal;
		white-space: nowrap;
		color: var(--mm-cream);
		background: transparent;
		transition: background-color .2s ease, color .2s ease;
	}
	.wp-block-navigation.mtb-menu .wp-block-navigation-submenu:not(.mtb-mega) > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content::after {
		content: "→";
		opacity: 0;
		transform: translateX(-6px);
		color: var(--mm-orange-2);
		transition: opacity .2s ease, transform .25s var(--mm-ease);
	}
	.wp-block-navigation.mtb-menu .wp-block-navigation-submenu:not(.mtb-mega) > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content:is(:hover, :focus-visible) {
		color: var(--mm-cream);
		background: rgba(217, 198, 248, .1);
	}
	.wp-block-navigation.mtb-menu .wp-block-navigation-submenu:not(.mtb-mega) > .wp-block-navigation__submenu-container > .current-menu-item > .wp-block-navigation-item__content { color: var(--mm-orange-2); }
	.wp-block-navigation.mtb-menu .wp-block-navigation-submenu:not(.mtb-mega) > .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content:is(:hover, :focus-visible)::after {
		opacity: 1;
		transform: none;
	}

	/* ---------- mega menu: wide glass card floating under the header ---------- */
	.wp-block-group.is-style-mtb-header-desktop:has(.mtb-menu),
	.wp-block-navigation.mtb-menu,
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container,
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .mtb-mega { position: static; }

	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .mtb-mega > .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
		--mm-bridge: 50px;
		position: absolute;
		top: calc(100% + 12px);
		left: max(16px, calc((100% - 1408px) / 2));
		right: max(16px, calc((100% - 1408px) / 2));
		min-width: 0;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .8fr);
		grid-template-rows: repeat(4, auto);
		column-gap: 28px;
		padding: 30px 32px 28px;
		border-radius: 28px;
	}
	.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .wp-block-navigation-item { display: block; margin: 0; }
	.mtb-menu .mtb-mega .wp-block-navigation-item__content { box-sizing: border-box; }
	.wp-block-navigation.mtb-menu .mtb-mega .wp-block-navigation-item__description { display: block; }

	/* service rows, as in the homepage "Palvelumme" list: display type, orange fill on hover */
	.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-svc {
		border-top: 1.5px solid var(--mm-line);
	}
	/* lines only between the rows: none above the first row */
	.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-svc:nth-child(-n+2) { border-top: 0; }
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-svc > .wp-block-navigation-item__content {
		position: relative;
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: "label" "desc";
		align-content: center;
		row-gap: 6px;
		height: 100%;
		padding: 20px 52px 20px 16px;
		border: 0;
		border-radius: 0;
		font: inherit;
		white-space: normal;
		text-transform: none;
		letter-spacing: normal;
		color: var(--mm-cream);
		background: linear-gradient(var(--mm-orange), var(--mm-orange)) no-repeat 0 100% / 100% 0;
		transition: background-size .38s var(--mm-ease), color .25s ease;
	}
	.mtb-menu .mtb-mega-svc > .wp-block-navigation-item__content::after {
		content: "→";
		position: absolute;
		top: 50%;
		right: 16px;
		margin-top: -.6em;
		font-size: 24px;
		line-height: 1.2;
		color: var(--mm-orange-2);
		transition: transform .35s ease, color .25s ease;
	}
	.mtb-menu .mtb-mega-svc .wp-block-navigation-item__label {
		grid-area: label;
		font-family: var(--mm-display);
		font-weight: 100;
		font-size: 30px;
		line-height: 1;
		letter-spacing: .01em;
		text-transform: uppercase;
		transition: transform .35s var(--mm-ease);
	}
	.wp-block-navigation.mtb-menu .mtb-mega .mtb-mega-svc .wp-block-navigation-item__description {
		grid-area: desc;
		font-weight: 500;
		font-size: 14px;
		line-height: 1.4;
		color: var(--mm-lav);
		transition: color .25s ease, transform .35s var(--mm-ease);
	}
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-svc > .wp-block-navigation-item__content:is(:hover, :focus-visible) {
		color: var(--mm-deep);
		background-size: 100% 100%;
	}
	.mtb-menu .mtb-mega-svc > .wp-block-navigation-item__content:is(:hover, :focus-visible) :is(.wp-block-navigation-item__label, .wp-block-navigation-item__description) { transform: translateX(8px); }
	.wp-block-navigation.mtb-menu .mtb-mega .mtb-mega-svc > .wp-block-navigation-item__content:is(:hover, :focus-visible) .wp-block-navigation-item__description { color: var(--mm-deep); }
	/* white heading and arrow on the orange fill, as in the homepage list */
	.mtb-menu .mtb-mega-svc > .wp-block-navigation-item__content:is(:hover, :focus-visible) .wp-block-navigation-item__label { color: #fff; }
	.mtb-menu .mtb-mega-svc > .wp-block-navigation-item__content:is(:hover, :focus-visible)::after { color: #fff; transform: translateX(4px) rotate(-45deg); }
	.mtb-menu .mtb-mega-svc.current-menu-item .wp-block-navigation-item__label { color: var(--mm-orange-2); }
	.mtb-menu .mtb-mega-svc.current-menu-item > .wp-block-navigation-item__content:is(:hover, :focus-visible) .wp-block-navigation-item__label { color: #fff; }

	/* "Kaikki siivouspalvelut": ghost pill */
	/* seven services in two columns: the pill fills the free cell beside the last service */
	.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-all {
		grid-column: 2;
		grid-row: 4;
		display: flex;
		align-items: center;
		padding: 20px 16px;
		border-top: 1.5px solid var(--mm-line);
	}
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-all > .wp-block-navigation-item__content {
		width: auto;
		flex: 0 0 auto;
		display: inline-flex;
		align-items: center;
		gap: 10px;
		padding: 12px 24px;
		border: 2px solid rgba(217, 198, 248, .5);
		border-radius: 999px;
		font: inherit;
		font-weight: 800;
		font-size: 15.5px;
		text-transform: none;
		letter-spacing: normal;
		color: var(--mm-cream);
		background: transparent;
		transition: background-color .25s ease, border-color .25s ease, color .25s ease;
	}
	.mtb-menu .mtb-mega-all > .wp-block-navigation-item__content::after { content: "→"; transition: transform .25s var(--mm-ease); }
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-all > .wp-block-navigation-item__content:is(:hover, :focus-visible) {
		color: var(--mm-violet);
		background: var(--mm-cream);
		border-color: var(--mm-cream);
	}
	.mtb-menu .mtb-mega-all > .wp-block-navigation-item__content:hover::after { transform: translateX(4px); }

	/* quote card: orange, like the homepage mission band */
	.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-cta { grid-column: 3; grid-row: 1 / 4; margin-left: 12px; }
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-cta > .wp-block-navigation-item__content {
		position: relative;
		display: flex;
		flex-direction: column;
		gap: 14px;
		height: 100%;
		min-height: 240px;
		padding: 28px 28px 92px;
		overflow: hidden;
		border: 0;
		border-radius: 24px;
		font: inherit;
		white-space: normal;
		text-transform: none;
		letter-spacing: normal;
		color: var(--mm-deep);
		background: var(--mm-orange);
		transform: rotate(-1.2deg);
		transition: transform .35s cubic-bezier(.2, .9, .3, 1.3);
	}
	.mtb-menu .mtb-mega-cta .wp-block-navigation-item__label {
		font-family: var(--mm-display);
		font-weight: 100;
		font-size: 48px;
		line-height: 1.04;
		text-transform: uppercase;
		color: #fff;
	}
	.wp-block-navigation.mtb-menu .mtb-mega .mtb-mega-cta .wp-block-navigation-item__description {
		max-width: 30ch;
		font-weight: 600;
		font-size: 15.5px;
		line-height: 1.5;
		color: var(--mm-deep);
	}
	.mtb-menu .mtb-mega-cta > .wp-block-navigation-item__content::after {
		content: "→";
		position: absolute;
		left: 28px;
		bottom: 26px;
		display: grid;
		place-items: center;
		width: 48px;
		height: 48px;
		border-radius: 50%;
		font-size: 20px;
		color: var(--mm-cream);
		background: var(--mm-deep);
		transition: transform .3s cubic-bezier(.2, .9, .3, 1.4);
	}
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-cta > .wp-block-navigation-item__content:is(:hover, :focus-visible) {
		color: var(--mm-deep);
		background: var(--mm-orange);
		transform: rotate(0deg) translateY(-3px);
	}
	.mtb-menu .mtb-mega-cta > .wp-block-navigation-item__content:is(:hover, :focus-visible)::after { transform: translateX(6px) rotate(-45deg); }

	/* phone under the card */
	.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-phone { grid-column: 3; grid-row: 4; align-self: end; padding-top: 22px; margin-left: 12px; }
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-phone > .wp-block-navigation-item__content {
		display: flex;
		flex-direction: column-reverse;
		gap: 2px;
		padding: 0 4px;
		border: 0;
		font: inherit;
		text-transform: none;
		letter-spacing: normal;
		color: var(--mm-cream);
		background: none;
	}
	.mtb-menu .mtb-mega-phone .wp-block-navigation-item__label { font-weight: 800; font-size: 22px; line-height: 1.3; color: var(--mm-cream); transition: color .2s ease; }
	.wp-block-navigation.mtb-menu .mtb-mega .mtb-mega-phone .wp-block-navigation-item__description { font-weight: 800; font-size: 12.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--mm-orange-2); }
	.wp-block-navigation.mtb-menu .mtb-mega > .wp-block-navigation__submenu-container > .mtb-mega-phone > .wp-block-navigation-item__content:is(:hover, :focus-visible) { background: none; }
	.mtb-menu .mtb-mega-phone > .wp-block-navigation-item__content:is(:hover, :focus-visible) .wp-block-navigation-item__label { color: var(--mm-orange-2); }
}

@media (min-width: 1025px) and (max-width: 1240px) {
	.wp-block-navigation.mtb-menu { --mm-underline: calc(100% - 30px - 1em); }
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
		padding-inline: 12px calc(18px + 1em);
		white-space: nowrap;
		background-position-x: 12px;
	}
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .wp-block-navigation-submenu > .wp-block-navigation__submenu-icon { padding-right: 12px; width: calc(1em + 22px); margin-left: calc(-1em - 22px); }
	.wp-block-group.is-style-mtb-header-desktop:has(.mtb-menu) .wp-block-button__link { white-space: nowrap; }
	.wp-block-navigation.mtb-menu > .wp-block-navigation__container > .mtb-mega > .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .95fr);
		padding-inline: 24px;
	}
	.mtb-menu .mtb-mega-svc .wp-block-navigation-item__label { font-size: 26px; }
	.mtb-menu .mtb-mega-cta .wp-block-navigation-item__label { font-size: 40px; }
}

/* tablets: the theme copies a live-site quirk that gives the language switch and menu button 0 width, so "FI" overlaps the icon */
@media (min-width: 768px) and (max-width: 1024px) {
	.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) > .wp-block-group.is-style-mtb-header-mobile { flex: 1 1 auto; width: auto; }
	.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) > .wp-block-group.is-style-mtb-header-mobile > nav.wp-block-navigation { width: auto; }
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) *,
	.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) *::before,
	.wp-block-group.is-style-mtb-site-header:has(.mtb-menu) *::after { transition-duration: 0s !important; transition-delay: 0s !important; }
	.wp-block-navigation.mtb-menu .wp-block-navigation__submenu-container.wp-block-navigation__submenu-container { transform: none !important; }
}

/* ======================================================================
   Mobile off-canvas menu: a purple glass panel over the blurred page.
   One full-screen layer behind the panel blurs the page; the panel part gets a stronger tint.
   ====================================================================== */
.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__responsive-container.is-menu-open {
	color: var(--mm-cream) !important;
	background: transparent !important;
	border-left: 1px solid var(--mm-line);
	box-shadow: var(--mm-sheen), -30px 0 60px -20px rgba(20, 0, 50, .5);
}
.wp-block-navigation.mtb-menu-mobile .is-menu-open::before {
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(90deg, rgba(42, 5, 96, .45) calc(100% - min(100%, 400px)), rgba(0, 0, 0, 0) 0),
		linear-gradient(90deg, rgba(0, 0, 0, 0) calc(100% - min(100%, 400px)), rgba(42, 5, 96, .5) 0);
	-webkit-backdrop-filter: blur(24px) saturate(180%) brightness(.55);
	backdrop-filter: blur(24px) saturate(180%) brightness(.55);
}
.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__responsive-container-close .mtb-navigation-control-icon {
	filter: brightness(0) invert(1);
}
.wp-block-navigation.mtb-menu-mobile .wp-block-details.is-style-mtb-mobile-accordion {
	color: var(--mm-cream) !important;
	background: transparent !important;
	border-bottom: 1.5px solid var(--mm-line);
}
.wp-block-navigation.mtb-menu-mobile .wp-block-details.is-style-mtb-mobile-accordion > summary {
	justify-content: space-between;
	padding: 18px 4px;
	border-bottom: 0;
	font-family: var(--mm-display);
	font-weight: 100;
	font-size: 30px;
	line-height: 1;
	letter-spacing: .01em;
	text-transform: uppercase;
	color: var(--mm-cream);
	cursor: pointer;
}
.wp-block-navigation.mtb-menu-mobile .wp-block-details.is-style-mtb-mobile-accordion > summary::after {
	width: 13px;
	height: 13px;
	background-color: var(--mm-orange-2);
	transition: transform .25s var(--mm-ease);
}
.wp-block-navigation.mtb-menu-mobile .wp-block-details.is-style-mtb-mobile-accordion[open] > summary::after {
	mask-image: url("../icons/caret-down.svg");
	transform: rotate(180deg);
}
.wp-block-navigation.mtb-menu-mobile .wp-block-list.is-style-mtb-accordion-links {
	box-sizing: border-box;
	width: 100%;
	gap: 2px;
	margin: 0 0 16px;
	border: 0;
	padding-left: 4px !important;
	padding-right: 0;
	font-family: var(--mm-body) !important;
	font-weight: 600 !important;
	font-size: 17px !important;
	line-height: 1.35 !important;
	letter-spacing: normal !important;
	color: var(--mm-lav) !important;
}
.wp-block-navigation.mtb-menu-mobile .wp-block-list.is-style-mtb-accordion-links a {
	box-sizing: border-box;
	justify-content: space-between;
	gap: 16px;
	min-height: 46px;
	padding: 8px 12px;
	border-radius: 12px;
	transition: background-color .2s ease, color .2s ease;
}
.wp-block-navigation.mtb-menu-mobile .wp-block-list.is-style-mtb-accordion-links a::after {
	content: "→";
	color: var(--mm-orange-2);
	opacity: .8;
}
.wp-block-navigation.mtb-menu-mobile .wp-block-list.is-style-mtb-accordion-links a:is(:hover, :focus-visible) {
	color: var(--mm-cream);
	background: rgba(217, 198, 248, .1);
}
.wp-block-navigation.mtb-menu-mobile .wp-block-list.is-style-mtb-accordion-links > li.mtb-m-all a {
	font-weight: 800;
	color: var(--mm-orange-2);
}
/* quote + call buttons stay pinned to the bottom of the drawer */
.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__container > .wp-block-navigation-item:has(> .mtb-m-buttons) {
	position: sticky;
	bottom: 0;
	z-index: 2;
	margin: 24px -16px 0;
	padding: 22px 16px calc(16px + env(safe-area-inset-bottom));
	/* no tint of its own: it only blurs menu links that scroll under the buttons */
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
}
.wp-block-navigation.mtb-menu-mobile .wp-block-buttons.mtb-m-buttons {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 10px;
	width: 100%;
	padding: 0;
}
.wp-block-navigation.mtb-menu-mobile .mtb-m-buttons > .wp-block-button { flex: 1 1 0; min-width: 0; }
.wp-block-navigation.mtb-menu-mobile .mtb-m-buttons .wp-block-button__link {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	height: 100%;
	padding: 15px 12px !important;
	border: 2px solid transparent;
	border-radius: 999px;
	font-family: var(--mm-body);
	font-weight: 800;
	font-size: 16px;
	line-height: 1.2;
	letter-spacing: normal;
	text-transform: none;
	white-space: nowrap;
}
.wp-block-navigation.mtb-menu-mobile .mtb-m-cta .wp-block-button__link { color: var(--mm-cream); background: var(--mm-orange); }
.wp-block-navigation.mtb-menu-mobile .mtb-m-cta .wp-block-button__link::after { content: "→"; }
.wp-block-navigation.mtb-menu-mobile .mtb-m-phone .wp-block-button__link { color: var(--mm-cream); background: transparent; border-color: rgba(217, 198, 248, .45); }
.wp-block-navigation.mtb-menu-mobile .mtb-m-phone .wp-block-button__link::before {
	content: "";
	width: 16px;
	height: 16px;
	flex: none;
	background: currentcolor;
	mask: url("../icons/phone-alt.svg") center / contain no-repeat;
}
.wp-block-navigation.mtb-menu-mobile .mtb-m-buttons .wp-block-button__link:focus-visible,
.wp-block-navigation.mtb-menu-mobile .is-style-mtb-mobile-accordion > summary:focus-visible,
.wp-block-navigation.mtb-menu-mobile .is-style-mtb-accordion-links a:focus-visible {
	outline: 3px solid var(--mm-orange-2);
	outline-offset: 2px;
}
@media (min-width: 768px) {
	.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__container > .wp-block-navigation-item:has(> .mtb-m-buttons) { margin-inline: -10px; padding-inline: 10px; }
}
/* the site-wide mobile call bar would cover the open drawer; the drawer has its own buttons */
body:has(.mtb-menu-mobile .wp-block-navigation__responsive-container.is-menu-open) .mtb-mobile-bar { display: none; }
/* the intro replay button and the chatbot button would sit on top of the open menu */
body:has(.mtb-menu-mobile .wp-block-navigation__responsive-container.is-menu-open) :is(.hb-wipe-btn, #chat-widget) { display: none !important; }

/* ======================================================================
   Mobile menu motion (mtb-menu.js plays the closing animation before the core menu hides).
   Open: the panel glides in from the right, the close button turns in, the items follow one by one.
   Close: the items fade, the panel glides out. Accordion links drop in one by one when a section opens.
   ====================================================================== */
@media (prefers-reduced-motion: no-preference) {
	.wp-block-navigation.mtb-menu-mobile[data-mtb-slide] .wp-block-navigation__responsive-container.is-menu-open {
		animation: mtb-m-panel-in .56s cubic-bezier(.22, 1, .36, 1) both;
	}
	.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__responsive-container.is-menu-open::before {
		animation: mtb-m-fade-in .45s ease both;
	}
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
		animation: mtb-m-item-in .6s cubic-bezier(.22, 1, .36, 1) both;
		animation-delay: calc(.14s + var(--mtb-i, 0) * .06s);
	}
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(2) { --mtb-i: 1; }
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3) { --mtb-i: 2; }
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(4) { --mtb-i: 3; }
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(5) { --mtb-i: 4; }
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(6) { --mtb-i: 5; }
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(n+7) { --mtb-i: 6; }
	.wp-block-navigation.mtb-menu-mobile .is-menu-open .wp-block-navigation__responsive-container-close {
		animation: mtb-m-close-in .5s .2s cubic-bezier(.22, 1, .36, 1) both;
	}
	.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__responsive-container-close { transition: transform .3s cubic-bezier(.22, 1, .36, 1); }
	.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__responsive-container-close:is(:hover, :focus-visible) { transform: rotate(90deg); }
	.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__responsive-container-open { transition: transform .25s cubic-bezier(.22, 1, .36, 1); }
	.wp-block-navigation.mtb-menu-mobile .wp-block-navigation__responsive-container-open:active { transform: scale(.88); }

	/* closing */
	.wp-block-navigation.mtb-menu-mobile[data-mtb-slide] .wp-block-navigation__responsive-container.is-menu-open.is-closing {
		animation: mtb-m-panel-out .36s cubic-bezier(.55, 0, .7, .25) both;
	}
	.wp-block-navigation.mtb-menu-mobile .is-menu-open.is-closing::before { animation: mtb-m-fade-out .36s ease both; }
	.wp-block-navigation.mtb-menu-mobile .is-menu-open.is-closing .wp-block-navigation__container > .wp-block-navigation-item,
	.wp-block-navigation.mtb-menu-mobile .is-menu-open.is-closing .wp-block-navigation__responsive-container-close {
		animation: mtb-m-fade-out .2s ease both;
	}

	/* accordion: links drop in one by one; while closing they fade out */
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion[open] .is-style-mtb-accordion-links > li {
		animation: mtb-m-link-in .45s cubic-bezier(.22, 1, .36, 1) both;
		animation-delay: calc(var(--mtb-j, 0) * .035s);
	}
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion .is-style-mtb-accordion-links > li:nth-child(2) { --mtb-j: 1; }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion .is-style-mtb-accordion-links > li:nth-child(3) { --mtb-j: 2; }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion .is-style-mtb-accordion-links > li:nth-child(4) { --mtb-j: 3; }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion .is-style-mtb-accordion-links > li:nth-child(5) { --mtb-j: 4; }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion .is-style-mtb-accordion-links > li:nth-child(6) { --mtb-j: 5; }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion .is-style-mtb-accordion-links > li:nth-child(7) { --mtb-j: 6; }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion .is-style-mtb-accordion-links > li:nth-child(n+8) { --mtb-j: 7; }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion.is-collapsing .is-style-mtb-accordion-links > li {
		animation: mtb-m-fade-out .2s ease both;
	}
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion > summary::after { transition: transform .38s cubic-bezier(.22, 1, .36, 1); }
	.wp-block-navigation.mtb-menu-mobile details.is-style-mtb-mobile-accordion.is-collapsing > summary::after { transform: rotate(0deg); }

	@keyframes mtb-m-panel-in { from { transform: translateX(100%); } to { transform: none; } }
	@keyframes mtb-m-panel-out { from { transform: none; } to { transform: translateX(100%); } }
	@keyframes mtb-m-fade-in { from { opacity: 0; } }
	@keyframes mtb-m-fade-out { to { opacity: 0; } }
	@keyframes mtb-m-item-in { from { opacity: 0; transform: translateX(36px); } to { opacity: 1; transform: none; } }
	@keyframes mtb-m-close-in { from { opacity: 0; transform: rotate(-90deg) scale(.6); } to { opacity: 1; transform: none; } }
	@keyframes mtb-m-link-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
}
