/* Divi header and taxonomy-driven navigation. */
/*
 * Divi prefixes Theme Builder CSS on CPT/taxonomy views with ".et-db #et-boc" plus
 * !important. The two :is() groups add ID-level specificity on every template so the
 * header renders identically on Home, pages, services and service categories.
 */
:root {
	--ms-navy: #0b3d5c;
	--ms-navy-dark: #082c43;
	--ms-accent: #020a35;
	--ms-text: #1a1a1a;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_section {
	padding: 0 !important;
	background: #fff !important;
	box-shadow: none !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_row_0_tb_header {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	width: 100% !important;
	max-width: 1600px !important;
	padding: 12px 32px !important;
	box-shadow: none !important;
	background: #fff !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_row_0_tb_header .et_pb_column {
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_column_0_tb_header {
	display: flex !important;
	flex-direction: row !important;
	flex: 0 0 auto;
	align-items: center;
	gap: 10px;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_column_1_tb_header { flex: 1 1 auto; min-width: 0; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_column_2_tb_header,
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_section_1_tb_header { display: none !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_image_0_tb_header,
:is(html, #page-container) :is(body, #et-boc) .et-l--header .meridian-brand-name { margin: 0 !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_image_0_tb_header { width: 76px !important; flex: 0 0 76px; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_image_0_tb_header img { width: 76px !important; height: 76px !important; max-width: none !important; object-fit: contain; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .meridian-brand-name p { font: 15px/1.35 Georgia, serif; color: #020a35 !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .meridian-brand-name strong { font-size: 22px; font-weight: 600; }
:root {
	--ms-gold-rule: #e6dcb4;
	--ms-gold-mark: #a88a22;
	--ms-menu-hover: #f1f5f8;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_menu { background: transparent !important; padding: 0 !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_menu__wrap { justify-content: flex-end !important; margin: 0 !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu { align-items: center; gap: 4px; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li { padding: 0 !important; align-items: center; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_menu ul li a {
	font-family: 'Montserrat', Helvetica, Arial, sans-serif;
	font-size: 15px !important;
	font-weight: 600;
	color: var(--ms-text) !important;
	opacity: 1 !important;
	transition: color .15s ease, background-color .15s ease;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu a::after { display: none !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li > a {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 12px 10px !important;
	line-height: 1.35 !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li:not(.menu-item-cta) > a:hover { color: var(--ms-navy) !important; }

/* Massage / Esthetics disclosure button. */
:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-menu-toggle {
	display: inline-flex;
	flex: 0 0 44px;
	align-items: center;
	justify-content: center;
	position: static;
	width: 44px;
	height: 44px;
	margin: 0 0 0 -10px;
	padding: 0;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--ms-navy);
	cursor: pointer;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-menu-toggle:hover { background: var(--ms-menu-hover); }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-menu-toggle span {
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform .2s ease;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-open > .ms-menu-toggle span { transform: translateY(2px) rotate(-135deg); }
:is(html, #page-container) :is(body, #et-boc) .et-l--header li li > .ms-menu-toggle { display: none !important; }

/* Panel visibility: only the top-level Massage/Esthetics items collapse. */
:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready :is(.et-menu, .et_mobile_menu) > li.menu-item-has-children > ul.sub-menu {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready :is(.et-menu, .et_mobile_menu) > li.ms-open > ul.sub-menu {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* Category groups stay expanded inside an open panel. */
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root ul.sub-menu ul.sub-menu {
	position: static !important;
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	top: auto !important;
	left: auto !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li {
	display: block !important;
	float: none;
	width: auto;
	margin: 0;
	padding: 0 !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.menu-item-services-cat {
	break-inside: avoid;
	page-break-inside: avoid;
	margin: 0 0 18px !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.menu-item-services-cat > a {
	display: flex;
	align-items: center;
	gap: 10px;
	width: auto !important;
	margin: 0 0 4px;
	padding: 8px 10px 10px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ms-gold-rule) !important;
	border-radius: 6px 6px 0 0;
	background: transparent !important;
	color: var(--ms-navy) !important;
	font-size: 12.5px !important;
	font-weight: 700 !important;
	letter-spacing: .08em;
	line-height: 1.3 !important;
	text-transform: uppercase;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.menu-item-services-cat > a::before {
	content: '';
	flex: 0 0 14px;
	height: 2px;
	background: var(--ms-gold-mark);
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.menu-item-services-cat > a:hover { background: var(--ms-menu-hover) !important; color: var(--ms-navy-dark) !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.menu-item-service > a {
	display: block;
	width: auto !important;
	padding: 8px 10px !important;
	border: 0 !important;
	border-radius: 6px;
	background: transparent !important;
	color: var(--ms-text) !important;
	font-size: 14.5px !important;
	font-weight: 500 !important;
	line-height: 1.35 !important;
}
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.menu-item-service > a:hover { background: var(--ms-menu-hover) !important; color: var(--ms-navy) !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.current-menu-item > a {
	color: var(--ms-navy) !important;
	font-weight: 700 !important;
	box-shadow: inset 3px 0 0 var(--ms-gold-mark);
}

/* Calls to action. */
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li.menu-item-cta > a { border-radius: 4px; padding-inline: 18px !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li.menu-item-cta-primary > a { color: #fff !important; background: var(--ms-navy) !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li.menu-item-cta-primary > a:hover { background: var(--ms-navy-dark) !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li.menu-item-cta-secondary > a { color: var(--ms-navy) !important; background: transparent !important; border: 1px solid var(--ms-navy); }
:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li.menu-item-cta-secondary > a:hover { background: var(--ms-menu-hover) !important; }
:is(html, #page-container) :is(body, #et-boc) .et-l--header :is(a, button, [role="button"]):focus-visible { outline: 3px solid #9c7320 !important; outline-offset: 2px; }

/*
 * Desktop cascade: Massage/Esthetics open a compact category list; a category's
 * services fly out beside its row only on hover or keyboard focus. Positioning is
 * JS-only (.ms-nav-ready) so the no-JavaScript fallback keeps every link in flow.
 */
@keyframes ms-panel-in {
	from { opacity: 0; transform: translateY(-8px); }
	to { opacity: 1; transform: none; }
}
@keyframes ms-item-in {
	from { opacity: 0; transform: translateX(-6px); }
	to { opacity: 1; transform: none; }
}
@media (min-width: 1201px) {
	:is(html, #page-container) :is(body, #et-boc) .et-l--header :is(.et_pb_column_1_tb_header, .et_pb_menu, .et_pb_menu_inner_container, .et_pb_menu__wrap, .et_pb_menu__menu, .et-menu-nav, .et-menu > li.menu-item-services-root) { position: static !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li.menu-item-services-root { display: flex; align-items: center; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et-menu > li.menu-item-services-root > a { padding-right: 4px !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu > li.menu-item-services-root > ul.sub-menu {
		--ms-cats-w: 300px;
		--ms-fly-w: 330px;
		--ms-panel-bg: #faf8f2;
		--ms-menu-active: #e3ebf0;
		position: absolute !important;
		top: 100% !important;
		right: auto !important;
		left: var(--ms-panel-left, auto) !important;
		z-index: 9999;
		width: var(--ms-cats-w) !important;
		margin: 0 !important;
		padding: 8px !important;
		border: 0 !important;
		border-radius: 10px;
		background: var(--ms-panel-bg) !important;
		box-shadow: 0 24px 44px -22px rgba(2, 10, 53, .38), 0 2px 6px rgba(2, 10, 53, .06);
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu > li.ms-open > ul.sub-menu {
		animation: ms-panel-in .2s cubic-bezier(.2, .7, .3, 1) both;
	}
	/* Hover bridge across the header padding between the trigger and the panel. */
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu > li.menu-item-services-root > ul.sub-menu::before {
		content: '';
		position: absolute;
		top: -24px;
		right: 0;
		left: 0;
		height: 24px;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.menu-item-services-cat {
		position: relative !important;
		margin: 0 0 2px !important;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.menu-item-services-cat:last-child { margin-bottom: 0 !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.menu-item-services-cat > a {
		justify-content: space-between;
		gap: 12px;
		min-height: 44px;
		margin: 0;
		padding: 11px 14px 11px 16px !important;
		border: 0 !important;
		border-radius: 6px;
		color: var(--ms-navy) !important;
		font-size: 14.5px !important;
		font-weight: 600 !important;
		letter-spacing: 0;
		text-transform: none;
		transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.menu-item-services-cat > a::before { display: none; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.menu-item-services-cat > a::after {
		content: '';
		display: block !important;
		position: static !important;
		margin: 0 !important;
		flex: 0 0 7px;
		width: 7px;
		height: 7px;
		border-top: 2px solid currentColor;
		border-right: 2px solid currentColor;
		transform: rotate(45deg);
		opacity: .4;
		transition: opacity .18s ease, transform .18s ease;
	}
	/* Categories and services share one highlight so both panels read as a single menu. */
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > a,
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root li.menu-item-service > a:is(:hover, :focus-visible) {
		background: var(--ms-menu-active) !important;
		color: var(--ms-navy-dark) !important;
		box-shadow: inset 4px 0 0 var(--ms-gold-mark);
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > a::after { opacity: 1; transform: translateX(3px) rotate(45deg); }

	/* Service flyout: sits flush with the panel's right edge, aligned to its category row, sized to its own content. */
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li > ul.sub-menu {
		position: absolute !important;
		top: calc(-6px - var(--ms-fly-shift, 0px)) !important;
		right: auto !important;
		bottom: auto !important;
		left: calc(100% + 8px) !important;
		display: block !important;
		visibility: hidden !important;
		opacity: 0 !important;
		width: var(--ms-fly-w) !important;
		max-height: calc(100vh - 140px);
		overflow-x: hidden;
		overflow-y: auto;
		margin: 0 !important;
		padding: 6px 8px !important;
		border: 0 !important;
		border-radius: 10px;
		background: var(--ms-panel-bg) !important;
		box-shadow: 0 24px 44px -22px rgba(2, 10, 53, .38), 0 2px 6px rgba(2, 10, 53, .06);
		transform: translateX(-6px);
		pointer-events: none;
		transition: opacity .18s ease, transform .2s cubic-bezier(.2, .7, .3, 1), visibility 0s linear .2s;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > ul.sub-menu {
		visibility: visible !important;
		opacity: 1 !important;
		transform: none;
		pointer-events: auto;
		transition: opacity .18s ease, transform .2s cubic-bezier(.2, .7, .3, 1), visibility 0s;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > ul > li { animation: ms-item-in .22s ease-out both; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > ul > li:nth-child(2) { animation-delay: .02s; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > ul > li:nth-child(3) { animation-delay: .04s; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > ul > li:nth-child(4) { animation-delay: .06s; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > ul > li:nth-child(5) { animation-delay: .08s; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root > ul > li.ms-active > ul > li:nth-child(n+6) { animation-delay: .1s; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root li.menu-item-service + li.menu-item-service { border-top: 1px solid var(--ms-gold-rule); }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .ms-nav-ready .et-menu .menu-item-services-root li.menu-item-service > a {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 44px;
		padding: 11px 14px 11px 16px !important;
		border-radius: 6px;
		color: var(--ms-navy) !important;
		font-weight: 600 !important;
		transition: background-color .18s ease, color .18s ease, box-shadow .18s ease;
	}
}
@media (min-width: 1201px) and (pointer: coarse) {
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .menu-item-services-root li.menu-item-service > a { display: flex; align-items: center; min-height: 44px; }
}
@media (max-width: 1200px) {
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_row_0_tb_header { padding: 10px 20px !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_menu__menu { display: none !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_nav_menu { display: block !important; margin: 0 !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .mobile_menu_bar { width: 44px; height: 44px; bottom: auto; line-height: 44px; text-align: center; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .mobile_menu_bar::before { color: var(--ms-navy) !important; top: 5px; }
	/* Anchor the panel to the full-width header row so it never starts off-screen. */
	:is(html, #page-container) :is(body, #et-boc) .et-l--header :is(.et_pb_column_1_tb_header, .et_pb_menu, .et_pb_menu_inner_container, .et_pb_menu__wrap, .et_mobile_nav_menu, .mobile_nav) { position: static !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu {
		top: 100% !important;
		right: 20px !important;
		left: auto !important;
		width: min(680px, calc(100% - 40px)) !important;
		/* Leaves room for the header and the fixed "Call Now" footer bar. */
		max-height: calc(100vh - 180px);
		max-height: calc(100dvh - 180px);
		overflow-y: auto;
		overscroll-behavior: contain;
		padding: 10px 14px 16px !important;
		border-top: 3px solid var(--ms-navy) !important;
		border-radius: 0 0 12px 12px;
		background: #fff !important;
		box-shadow: 0 24px 44px -20px rgba(2, 10, 53, .35);
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu li { padding: 0 !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li { border-bottom: 1px solid #eef1f3; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li > a {
		display: flex;
		align-items: center;
		min-height: 48px;
		padding: 12px !important;
		border: 0 !important;
		background: transparent !important;
		font-weight: 600 !important;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-services-root { display: flex; flex-wrap: wrap; align-items: center; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-services-root > a { flex: 1 1 auto; min-width: 0; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-services-root > .ms-menu-toggle { flex-basis: 48px; width: 48px; height: 48px; margin: 0; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-services-root > ul.sub-menu {
		flex: 1 0 100%;
		width: 100% !important;
		margin: 0 !important;
		padding: 4px 0 10px !important;
		columns: 2 220px;
		column-gap: 16px;
		background: transparent !important;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu li.menu-item-service > a { display: flex; align-items: center; min-height: 44px; padding: 10px 12px !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu li li.menu-item-services-cat > a { min-height: 44px; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-cta { border: 0; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-cta > a {
		justify-content: center;
		margin-top: 10px;
		border: 1px solid var(--ms-navy) !important;
		border-radius: 4px;
	}
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-cta-primary > a { color: #fff !important; background: var(--ms-navy) !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu > li.menu-item-cta-secondary > a { color: var(--ms-navy) !important; }
}
@media (max-width: 480px) {
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_row_0_tb_header { padding: 8px 12px !important; gap: 8px; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_image_0_tb_header img { width: 58px !important; height: 58px !important; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_pb_image_0_tb_header { width: 58px !important; flex-basis: 58px; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .meridian-brand-name p { font-size: 12px; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .meridian-brand-name strong { font-size: 18px; }
	:is(html, #page-container) :is(body, #et-boc) .et-l--header .et_mobile_menu { right: 12px !important; width: calc(100% - 24px) !important; padding-inline: 8px !important; }
}
@media (prefers-reduced-motion: reduce) {
	:is(html, #page-container) :is(body, #et-boc) .et-l--header * { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
