/**
 * HHF Menu Addon — front-end styles.
 *
 * Every rule is scoped to .hhfmenu so the widget cannot leak into the theme.
 * Colours, spacing and the breakpoint are exposed as custom properties on the
 * root element; the widget's Style controls write to those properties, which is
 * why almost nothing here is hard-coded.
 *
 * @package HHF_Menu_Addon
 */

/* ─────────────────────────────────────────────────────────── tokens ── */

.hhfmenu {
	--hhfmenu-teal-deep: #003d4c;
	--hhfmenu-teal: #00a3ad;
	--hhfmenu-teal-hi: #00b8c3;
	--hhfmenu-teal-sh: #007d85;
	--hhfmenu-burg: #722257;
	--hhfmenu-burg-2: #561841;
	--hhfmenu-coral: #e04e39;
	--hhfmenu-gold: #f2a900;
	--hhfmenu-gold-2: #d69400;
	--hhfmenu-cream: #fdf8f0;
	--hhfmenu-cream-2: #f6eedd;
	--hhfmenu-white: #fff;
	--hhfmenu-ink: #003d4c;
	--hhfmenu-muted: #5a6e72;
	--hhfmenu-line: rgba(0, 61, 76, .12);
	--hhfmenu-dash: rgba(0, 61, 76, .18);

	--hhfmenu-shadow-sm: 0 2px 8px rgba(0, 61, 76, .06);
	--hhfmenu-shadow-lg: 0 18px 48px rgba(0, 61, 76, .14);

	--hhfmenu-body-font: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
	--hhfmenu-head-font: "Poppins", system-ui, sans-serif;
	--hhfmenu-script-font: "Handelson Three", "Caveat", cursive;

	--hhfmenu-max: 1240px;
	--hhfmenu-pad: 32px;
	--hhfmenu-bar-h: 104px;
	--hhfmenu-bar-h-m: 88px;
	--hhfmenu-radius: 24px;
	--hhfmenu-panel-gap: 10px;

	font-family: var(--hhfmenu-body-font);
	color: var(--hhfmenu-ink);
	line-height: 1.6;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
}

/* Local display face. Falls back to Caveat/cursive when the file is absent. */
@font-face {
	font-family: "Handelson Three";
	src: url("../fonts/Handelson_W00_Three.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

/* Scoped resets — deliberately narrow so the theme keeps its own defaults. */
.hhfmenu *,
.hhfmenu *::before,
.hhfmenu *::after {
	box-sizing: border-box;
}

.hhfmenu a {
	color: inherit;
	text-decoration: none;
}

.hhfmenu a:hover {
	color: var(--hhfmenu-teal);
}

.hhfmenu button {
	font-family: inherit;
	cursor: pointer;
	border: 0;
	background: none;
	color: inherit;
	padding: 0;
	margin: 0;
}

.hhfmenu img {
	max-width: 100%;
	height: auto;
	display: block;
}

.hhfmenu svg {
	flex-shrink: 0;
}

.hhfmenu ul,
.hhfmenu li {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* ─────────────────────────────────────────────────────── theme armor ──
 * Themes routinely restyle bare <button> and <a> on interaction. Hello
 * Elementor's reset, for one, paints every button #c36 on :hover and :focus —
 * and because a touch sets :focus, that red stays put after a tap on mobile.
 *
 * Those theme selectors look like `button:focus`, specificity (0,1,1). The
 * rules below are (0,2,1) so they win, while every component rule further down
 * carries two classes, (0,3,0) or more, and so still wins over these.
 *
 * Deliberately NOT !important: Elementor writes the widget's own Style-tab
 * settings at (0,3,0), and !important here would override the user's own
 * colour and typography choices. Specificity is what keeps both working.
 */
.hhfmenu {
	/* Kills the coloured flash browsers paint over a tapped element. */
	-webkit-tap-highlight-color: transparent;
}

.hhfmenu button,
.hhfmenu button:hover,
.hhfmenu button:focus,
.hhfmenu button:active,
.hhfmenu a,
.hhfmenu a:hover,
.hhfmenu a:focus,
.hhfmenu a:active,
.hhfmenu a:visited {
	background-color: transparent;
	background-image: none;
	box-shadow: none;
	text-decoration: none;
	text-shadow: none;
}

/* The burger keeps its own surface through hover and focus. */
.hhfmenu .hhfmenu-burger:hover,
.hhfmenu .hhfmenu-burger:focus {
	background-color: var(--hhfmenu-white);
}

/* Screen-reader-only helper, scoped so it cannot clash with the theme. */
.hhfmenu .hhfmenu-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.hhfmenu .hhfmenu-container {
	max-width: var(--hhfmenu-max);
	margin: 0 auto;
	padding: 0 var(--hhfmenu-pad);
	position: relative;
}

/* ───────────────────────────────────────────────── shared elements ── */

.hhfmenu .hhfmenu-eyebrow {
	font-family: var(--hhfmenu-head-font);
	font-size: 12px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--hhfmenu-burg);
	font-weight: 800;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
}

.hhfmenu .hhfmenu-dash {
	width: 22px;
	height: 3px;
	background: var(--hhfmenu-gold);
	border-radius: 99px;
	flex: 0 0 22px;
}

.hhfmenu .hhfmenu-script {
	font-family: var(--hhfmenu-script-font);
	font-weight: 400;
	color: var(--hhfmenu-burg);
	font-size: 1.5em;
	line-height: .7;
	display: inline-block;
	margin: 0 .18em;
}

.hhfmenu .hhfmenu-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 14px 26px;
	border-radius: 6px;
	font-family: var(--hhfmenu-body-font);
	font-weight: 500;
	font-size: 16px;
	text-align: center;
	transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.hhfmenu .hhfmenu-btn-burg {
	background: var(--hhfmenu-burg);
	color: #fff;
}

.hhfmenu .hhfmenu-btn-burg:hover {
	background: var(--hhfmenu-burg-2);
	color: #fff;
	transform: translateY(-1px);
}

.hhfmenu .hhfmenu-btn-gold {
	background: var(--hhfmenu-teal);
	color: #fff;
	font-family: var(--hhfmenu-head-font);
	font-weight: 800;
	font-size: 14px;
	letter-spacing: .06em;
	text-transform: uppercase;
	border-radius: 999px;
	box-shadow: 0 4px 0 var(--hhfmenu-teal-sh);
}

.hhfmenu .hhfmenu-btn-gold:hover {
	background: var(--hhfmenu-teal-hi);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: 0 6px 0 var(--hhfmenu-teal-sh);
}

/* ─────────────────────────────────────────────────────────── header ── */

.hhfmenu .hhfmenu-header {
	background: var(--hhfmenu-white);
	border-bottom: 1px solid var(--hhfmenu-line);
	position: relative;
	z-index: 500;
}

/* Opt-in stickiness. Elementor's own sticky effect can be used instead. */
.hhfmenu.hhfmenu-is-sticky .hhfmenu-header {
	position: sticky;
	top: var(--hhfmenu-sticky-offset, 0px);
}

.hhfmenu .hhfmenu-util {
	background: var(--hhfmenu-teal-deep);
	color: var(--hhfmenu-cream-2);
}

.hhfmenu .hhfmenu-util .hhfmenu-container {
	display: flex;
	align-items: center;
	gap: 24px;
	padding-top: 9px;
	padding-bottom: 9px;
	font-size: 13.5px;
}

.hhfmenu .hhfmenu-util-tag {
	font-family: var(--hhfmenu-body-font);
	font-weight: 400;
	opacity: .9;
}

.hhfmenu .hhfmenu-util-tag b {
	font-weight: 700;
	color: var(--hhfmenu-gold);
}

.hhfmenu .hhfmenu-util-right {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 22px;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.hhfmenu .hhfmenu-util a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--hhfmenu-cream-2);
	font-weight: 500;
}

.hhfmenu .hhfmenu-util a:hover {
	color: var(--hhfmenu-gold);
}

.hhfmenu .hhfmenu-util svg {
	width: 15px;
	height: 15px;
	stroke: var(--hhfmenu-gold);
	fill: none;
	stroke-width: 2;
}

.hhfmenu .hhfmenu-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: var(--hhfmenu-bar-h);
	gap: 24px;
}

.hhfmenu .hhfmenu-logo {
	flex-shrink: 0;
	display: block;
}

.hhfmenu .hhfmenu-logo img {
	height: var(--hhfmenu-logo-h, 54px);
	width: auto;
}

.hhfmenu .hhfmenu-logo-text {
	font-family: var(--hhfmenu-head-font);
	font-weight: 800;
	font-size: 22px;
	color: var(--hhfmenu-teal-deep);
	line-height: 1.1;
}

/* ───────────────────────────────────────────────────── desktop nav ── */

.hhfmenu .hhfmenu-nav {
	display: flex;
	align-items: center;
	gap: 4px;
}

.hhfmenu .hhfmenu-nav > a,
.hhfmenu .hhfmenu-nav > button {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 12px 18px;
	font-family: var(--hhfmenu-body-font);
	font-weight: 500;
	font-size: 16px;
	color: var(--hhfmenu-teal-deep);
	border-radius: 6px;
	transition: .15s;
	position: relative;
	white-space: nowrap;
}

.hhfmenu .hhfmenu-nav > a:hover,
.hhfmenu .hhfmenu-nav > button:hover,
.hhfmenu .hhfmenu-nav > .hhfmenu-is-open {
	color: var(--hhfmenu-teal);
}

.hhfmenu .hhfmenu-nav > .hhfmenu-is-open::after {
	content: "";
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: -1px;
	height: 3px;
	background: var(--hhfmenu-gold);
	border-radius: 99px 99px 0 0;
}

.hhfmenu .hhfmenu-nav > a.hhfmenu-is-active {
	background: var(--hhfmenu-teal);
	color: #fff;
	padding: 14px 26px;
	border-radius: 4px;
}

.hhfmenu .hhfmenu-caret {
	width: 13px;
	height: 13px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.5;
	transition: transform .2s;
}

.hhfmenu .hhfmenu-nav > .hhfmenu-is-open .hhfmenu-caret {
	transform: rotate(180deg);
}

.hhfmenu .hhfmenu-header-cta {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
}

.hhfmenu .hhfmenu-header-cta .hhfmenu-phone {
	color: var(--hhfmenu-burg);
	font-weight: 700;
	letter-spacing: -.01em;
	border: 2px solid var(--hhfmenu-burg);
	border-radius: 999px;
	padding: 0 24px;
	height: 52px;
	font-size: 16px;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	transition: .16s;
}

.hhfmenu .hhfmenu-header-cta .hhfmenu-phone:hover {
	background: var(--hhfmenu-burg);
	color: #fff;
}

.hhfmenu .hhfmenu-header-cta .hhfmenu-btn {
	border-radius: 999px;
	padding: 0 26px;
	height: 52px;
	white-space: nowrap;
}

.hhfmenu .hhfmenu-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 46px;
	border: 1.5px solid var(--hhfmenu-burg);
	border-radius: 10px;
	color: var(--hhfmenu-burg);
	background: #fff;
	flex-shrink: 0;
}

.hhfmenu .hhfmenu-burger svg {
	width: 24px;
	height: 24px;
	display: block;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.4;
}

.hhfmenu .hhfmenu-burger .hhfmenu-x {
	display: none;
}

.hhfmenu .hhfmenu-burger[aria-expanded="true"] .hhfmenu-x {
	display: block;
}

.hhfmenu .hhfmenu-burger[aria-expanded="true"] .hhfmenu-bars {
	display: none;
}

/* ──────────────────────────────────────────────────── dropdown panel ── */

.hhfmenu .hhfmenu-panelwrap {
	position: absolute;
	display: none;
	z-index: 600;
}

.hhfmenu .hhfmenu-panelwrap.hhfmenu-is-show {
	display: block;
	animation: hhfmenu-pop .16s ease;
}

@keyframes hhfmenu-pop {
	from {
		opacity: 0;
		transform: translateY(-8px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hhfmenu .hhfmenu-panelwrap.hhfmenu-is-show {
		animation: none;
	}

	.hhfmenu * {
		transition-duration: .01ms !important;
	}
}

/* Every menu has its own panel in the DOM; the script reveals one at a time. */
.hhfmenu .hhfmenu-panel {
	display: none;
}

.hhfmenu .hhfmenu-panel.hhfmenu-is-on {
	display: block;
}

.hhfmenu .hhfmenu-panel {
	background: var(--hhfmenu-white);
	border-radius: var(--hhfmenu-radius);
	box-shadow: var(--hhfmenu-shadow-lg), 0 0 0 1px var(--hhfmenu-line);
	padding: 26px 26px 22px;
	position: relative;
	overflow: hidden;
}

/*
 * The solid rule that caps every panel and the mobile drawer. Burgundy by
 * default so it matches the eyebrow title inside each panel; the Top Stripe
 * Colour control overrides it through --hhfmenu-stripe.
 */
.hhfmenu .hhfmenu-panel::before,
.hhfmenu .hhfmenu-drawer::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 5px;
	background: var(--hhfmenu-stripe, var(--hhfmenu-burg));
}

.hhfmenu .hhfmenu-mega {
	display: grid;
	grid-template-columns: 1fr 268px;
	gap: 28px;
}

.hhfmenu .hhfmenu-mega.hhfmenu-is-single {
	grid-template-columns: 1fr;
}

.hhfmenu .hhfmenu-rowlist {
	display: grid;
	gap: 2px;
}

.hhfmenu .hhfmenu-row {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px 14px;
	border-radius: 12px;
	transition: .14s;
}

.hhfmenu .hhfmenu-row:hover,
.hhfmenu .hhfmenu-row:focus-visible {
	background: var(--hhfmenu-cream);
	color: var(--hhfmenu-ink);
}

.hhfmenu .hhfmenu-row .hhfmenu-chev {
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	stroke: var(--hhfmenu-gold-2);
	fill: none;
	stroke-width: 2.6;
	margin-top: 3px;
	transition: .14s;
}

.hhfmenu .hhfmenu-row:hover .hhfmenu-chev,
.hhfmenu .hhfmenu-row:focus-visible .hhfmenu-chev {
	stroke: var(--hhfmenu-burg);
	transform: translateX(2px);
}

.hhfmenu .hhfmenu-row b {
	display: block;
	font-family: var(--hhfmenu-head-font);
	font-weight: 700;
	font-size: 15.5px;
	color: var(--hhfmenu-teal-deep);
	line-height: 1.25;
}

.hhfmenu .hhfmenu-row .hhfmenu-row-desc {
	display: block;
	font-size: 13px;
	color: var(--hhfmenu-muted);
	margin-top: 3px;
	line-height: 1.45;
}

.hhfmenu .hhfmenu-row:hover b,
.hhfmenu .hhfmenu-row:focus-visible b {
	color: var(--hhfmenu-burg);
}

/* Promo rail */
.hhfmenu .hhfmenu-rail {
	background: var(--hhfmenu-teal-deep);
	border-radius: 20px;
	padding: 24px 22px;
	color: #fff;
	display: flex;
	flex-direction: column;
}

.hhfmenu .hhfmenu-rail .hhfmenu-eyebrow {
	color: var(--hhfmenu-gold);
	margin-bottom: 12px;
}

.hhfmenu .hhfmenu-rail h4 {
	font-family: var(--hhfmenu-head-font);
	font-weight: 900;
	text-transform: uppercase;
	font-size: 20px;
	line-height: 1.05;
	margin: 0 0 10px;
	letter-spacing: -.01em;
	color: #fff;
}

.hhfmenu .hhfmenu-rail h4 em {
	font-style: normal;
	color: var(--hhfmenu-gold);
}

.hhfmenu .hhfmenu-rail .hhfmenu-script {
	color: var(--hhfmenu-gold);
	font-size: 1.55em;
}

.hhfmenu .hhfmenu-rail p {
	margin: 0 0 20px;
	font-size: 13.5px;
	color: rgba(253, 248, 240, .82);
	line-height: 1.6;
}

.hhfmenu .hhfmenu-rail .hhfmenu-btn {
	margin-top: auto;
	width: 100%;
	white-space: nowrap;
	padding-left: 14px;
	padding-right: 14px;
	font-size: 13px;
	letter-spacing: .04em;
}

/* ──────────────────────────────────────────────────── locations panel ── */

.hhfmenu .hhfmenu-loc {
	display: grid;
	grid-template-columns: 200px 1fr;
	gap: 18px 22px;
}

.hhfmenu .hhfmenu-loc > .hhfmenu-findbar {
	grid-column: 1 / -1;
}

.hhfmenu .hhfmenu-statecol {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.hhfmenu .hhfmenu-dirstate {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 11px 12px;
	border-radius: 11px;
	font-family: var(--hhfmenu-head-font);
	font-weight: 700;
	font-size: 15px;
	color: var(--hhfmenu-teal-deep);
	transition: .14s;
	text-align: left;
	width: 100%;
}

.hhfmenu .hhfmenu-dirstate .hhfmenu-pin {
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	stroke: var(--hhfmenu-gold-2);
	fill: none;
	stroke-width: 2.2;
}

.hhfmenu .hhfmenu-dirstate .hhfmenu-chev {
	width: 15px;
	height: 15px;
	flex: 0 0 15px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.6;
	margin-left: auto;
	opacity: .5;
	transition: .14s;
}

.hhfmenu .hhfmenu-dirstate:hover,
.hhfmenu .hhfmenu-dirstate:focus-visible {
	background: var(--hhfmenu-cream);
	color: var(--hhfmenu-burg);
}

.hhfmenu .hhfmenu-dirstate:hover .hhfmenu-pin,
.hhfmenu .hhfmenu-dirstate:focus-visible .hhfmenu-pin {
	stroke: var(--hhfmenu-burg);
}

.hhfmenu .hhfmenu-dirstate.hhfmenu-is-on {
	background: var(--hhfmenu-burg-2);
	color: #fff;
}

.hhfmenu .hhfmenu-dirstate.hhfmenu-is-on .hhfmenu-pin {
	stroke: var(--hhfmenu-gold);
}

.hhfmenu .hhfmenu-dirstate.hhfmenu-is-on .hhfmenu-chev {
	opacity: 1;
	transform: translateX(2px);
}

.hhfmenu .hhfmenu-clincol {
	border-left: 1px solid var(--hhfmenu-line);
	padding-left: 20px;
	display: flex;
	flex-direction: column;
	min-height: 236px;
}

/* Every state pane is rendered server-side; only one is shown at a time. */
.hhfmenu .hhfmenu-statepane {
	display: none;
	flex-direction: column;
	flex: 1;
}

.hhfmenu .hhfmenu-statepane.hhfmenu-is-on {
	display: flex;
}

.hhfmenu .hhfmenu-chead {
	display: flex;
	align-items: baseline;
	gap: 12px;
	flex-wrap: wrap;
	padding-bottom: 12px;
	margin-bottom: 12px;
	border-bottom: 2px dashed var(--hhfmenu-dash);
}

.hhfmenu .hhfmenu-chead h5 {
	font-family: var(--hhfmenu-head-font);
	font-weight: 900;
	text-transform: uppercase;
	font-size: 19px;
	letter-spacing: -.01em;
	color: var(--hhfmenu-teal-deep);
	margin: 0;
}

.hhfmenu .hhfmenu-chead span {
	font-size: 13px;
	color: var(--hhfmenu-muted);
}

.hhfmenu .hhfmenu-regions {
	display: grid;
	gap: 6px 20px;
	align-content: start;
	grid-template-columns: repeat(var(--hhfmenu-region-cols, 1), minmax(0, 1fr));
}

.hhfmenu .hhfmenu-regions.hhfmenu-is-grouped {
	--hhfmenu-region-cols: 5;
	gap: 6px 14px;
}

.hhfmenu .hhfmenu-region.hhfmenu-is-wide {
	grid-column: span 2;
}

.hhfmenu .hhfmenu-region.hhfmenu-is-wide .hhfmenu-rlinks,
.hhfmenu .hhfmenu-regions:not(.hhfmenu-is-grouped) .hhfmenu-rlinks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 14px;
}

.hhfmenu .hhfmenu-regions:not(.hhfmenu-is-grouped) .hhfmenu-rlinks {
	gap: 0 20px;
}

.hhfmenu .hhfmenu-rlbl {
	font-family: var(--hhfmenu-head-font);
	font-weight: 800;
	font-size: 10.5px;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--hhfmenu-burg);
	margin-bottom: 4px;
	min-height: 26px;
	line-height: 1.25;
}

.hhfmenu .hhfmenu-rlinks a {
	display: block;
	padding: 8px 2px;
	font-size: 13.5px;
	color: var(--hhfmenu-teal-deep);
	border-bottom: 1px solid var(--hhfmenu-line);
	transition: .12s;
}

.hhfmenu .hhfmenu-rlinks a:hover {
	color: var(--hhfmenu-burg);
	border-bottom-color: var(--hhfmenu-burg);
}

.hhfmenu .hhfmenu-statelink,
.hhfmenu .hhfmenu-allloc {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--hhfmenu-head-font);
	font-weight: 800;
	font-size: 12.5px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--hhfmenu-burg);
}

.hhfmenu .hhfmenu-statelink {
	margin-top: 18px;
	padding: 0 12px;
	align-self: flex-start;
}

.hhfmenu .hhfmenu-allloc {
	margin-top: 14px;
	padding: 0 14px;
	font-size: 13px;
}

.hhfmenu .hhfmenu-statelink svg,
.hhfmenu .hhfmenu-allloc svg {
	width: 15px;
	height: 15px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2.6;
}

/* Find-a-clinic bar */
.hhfmenu .hhfmenu-findbar {
	display: flex;
	align-items: center;
	gap: 18px;
	background: var(--hhfmenu-teal-deep);
	border-radius: 16px;
	padding: 20px 24px;
	color: #fff;
	transition: background .16s ease;
}

.hhfmenu .hhfmenu-findbar:hover {
	background: #002e39;
	color: #fff;
}

.hhfmenu .hhfmenu-fbicon {
	flex: 0 0 54px;
	height: 54px;
	border-radius: 999px;
	background: rgba(253, 248, 240, .14);
	display: grid;
	place-items: center;
	transition: background .16s ease;
}

.hhfmenu .hhfmenu-fbicon svg {
	width: 23px;
	height: 23px;
	stroke: var(--hhfmenu-gold);
	fill: none;
	stroke-width: 2.4;
	transition: stroke .16s ease;
}

.hhfmenu .hhfmenu-findbar:hover .hhfmenu-fbicon {
	background: var(--hhfmenu-gold);
}

.hhfmenu .hhfmenu-findbar:hover .hhfmenu-fbicon svg {
	stroke: var(--hhfmenu-teal-deep);
}

.hhfmenu .hhfmenu-findbar b {
	display: block;
	font-family: var(--hhfmenu-head-font);
	font-weight: 800;
	font-size: 22px;
	line-height: 1.2;
	letter-spacing: -.01em;
}

.hhfmenu .hhfmenu-findbar .hhfmenu-sub {
	display: block;
	font-size: 16px;
	color: rgba(253, 248, 240, .84);
	line-height: 1.35;
	margin-top: 2px;
}

/* ────────────────────────────────────────────────────── mobile drawer ── */

.hhfmenu .hhfmenu-drawer {
	display: none;
	flex-direction: column;
	/*
	 * Top only. The drawer is also an .hhfmenu-container, and a padding
	 * shorthand here would zero the container's side padding — leaving the
	 * drawer edge to edge while the bar above stays inset.
	 */
	padding-top: 4px;
	max-height: calc(100vh - var(--hhfmenu-bar-h-m) - 44px);
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	position: relative;
}

.hhfmenu .hhfmenu-drawer.hhfmenu-is-open {
	display: flex;
}

.hhfmenu .hhfmenu-mzip {
	padding: 16px 0 18px;
}

.hhfmenu .hhfmenu-mzip .hhfmenu-findbar {
	padding: 16px 18px;
	gap: 14px;
}

.hhfmenu .hhfmenu-mzip .hhfmenu-fbicon {
	flex: 0 0 44px;
	height: 44px;
}

.hhfmenu .hhfmenu-mzip .hhfmenu-fbicon svg {
	width: 20px;
	height: 20px;
}

.hhfmenu .hhfmenu-mzip .hhfmenu-findbar b {
	font-size: 18px;
}

.hhfmenu .hhfmenu-mzip .hhfmenu-findbar .hhfmenu-sub {
	font-size: 14.5px;
}

.hhfmenu .hhfmenu-macc {
	display: flex;
	flex-direction: column;
}

.hhfmenu .hhfmenu-msec {
	border-top: 1px solid var(--hhfmenu-line);
}

.hhfmenu .hhfmenu-mhead {
	display: flex;
	width: 100%;
	align-items: center;
	gap: 12px;
	padding: 16px 2px;
	font-family: var(--hhfmenu-head-font);
	font-size: 17px;
	font-weight: 700;
	color: var(--hhfmenu-teal-deep);
	text-align: left;
}

.hhfmenu .hhfmenu-mhead .hhfmenu-dash {
	flex: 0 0 20px;
	height: 3px;
}

.hhfmenu .hhfmenu-mhead .hhfmenu-car {
	width: 20px;
	height: 20px;
	margin-left: auto;
	stroke: var(--hhfmenu-burg);
	fill: none;
	stroke-width: 2.4;
	transition: transform .18s;
}

.hhfmenu .hhfmenu-msec.hhfmenu-is-open > .hhfmenu-mhead {
	color: var(--hhfmenu-burg);
}

.hhfmenu .hhfmenu-msec.hhfmenu-is-open > .hhfmenu-mhead .hhfmenu-dash {
	background: var(--hhfmenu-burg);
}

.hhfmenu .hhfmenu-msec.hhfmenu-is-open > .hhfmenu-mhead .hhfmenu-car {
	transform: rotate(180deg);
}

.hhfmenu .hhfmenu-mbody {
	display: none;
	padding: 0 0 20px;
}

.hhfmenu .hhfmenu-msec.hhfmenu-is-open > .hhfmenu-mbody {
	display: block;
}

.hhfmenu .hhfmenu-mbody .hhfmenu-row {
	padding: 11px 12px;
}

.hhfmenu .hhfmenu-mbody .hhfmenu-rail {
	margin-top: 16px;
	border-radius: 18px;
}

.hhfmenu .hhfmenu-mbody .hhfmenu-rail h4 {
	font-size: 22px;
}

.hhfmenu .hhfmenu-mbody .hhfmenu-rail .hhfmenu-btn {
	width: 100%;
	height: 48px;
}

.hhfmenu .hhfmenu-mstates {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.hhfmenu .hhfmenu-mstates .hhfmenu-dirstate {
	padding: 13px 12px;
	font-size: 15.5px;
}

.hhfmenu .hhfmenu-mstates .hhfmenu-dirstate .hhfmenu-chev {
	opacity: 1;
}

.hhfmenu .hhfmenu-mstates .hhfmenu-dirstate.hhfmenu-is-on .hhfmenu-chev {
	transform: rotate(90deg);
}

.hhfmenu .hhfmenu-mstatebody {
	display: none;
	padding: 16px 16px 18px;
	margin: 3px 0 8px;
	background: var(--hhfmenu-cream);
	border-radius: 16px;
	border-left: 4px solid var(--hhfmenu-gold);
}

.hhfmenu .hhfmenu-mstatebody.hhfmenu-is-open {
	display: block;
}

.hhfmenu .hhfmenu-mblurb {
	font-size: 13px;
	color: var(--hhfmenu-muted);
	margin: 0 0 14px;
	padding-bottom: 12px;
	border-bottom: 2px dashed var(--hhfmenu-dash);
	line-height: 1.5;
}

.hhfmenu .hhfmenu-mgrp + .hhfmenu-mgrp {
	margin-top: 18px;
}

.hhfmenu .hhfmenu-mgrp .hhfmenu-rlbl {
	min-height: 0;
	margin-bottom: 2px;
}

.hhfmenu .hhfmenu-mgrp .hhfmenu-mlinks {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 14px;
}

.hhfmenu .hhfmenu-mgrp .hhfmenu-mlinks a {
	display: block;
	padding: 10px 0;
	font-size: 13.5px;
	line-height: 1.3;
	color: var(--hhfmenu-teal-deep);
	border-bottom: 1px solid var(--hhfmenu-line);
}

.hhfmenu .hhfmenu-mstatebody .hhfmenu-statelink {
	margin-top: 16px;
	padding: 0;
}

.hhfmenu .hhfmenu-mfoot {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px 0 28px;
	border-top: 1px solid var(--hhfmenu-line);
}

.hhfmenu .hhfmenu-mcall {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 52px;
	border: 1.6px solid var(--hhfmenu-burg);
	border-radius: 999px;
	color: var(--hhfmenu-burg);
	font-size: 16px;
	font-weight: 700;
}

.hhfmenu .hhfmenu-mfoot .hhfmenu-btn {
	justify-content: center;
	height: 52px;
	border-radius: 999px;
}

.hhfmenu .hhfmenu-mutil {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	justify-content: center;
	padding-top: 10px;
}

.hhfmenu .hhfmenu-mutil a {
	font-size: 13px;
	color: var(--hhfmenu-muted);
}

/* ───────────────────────────────────────────────────────── breakpoint ── */

/*
 * The switch to the drawer is driven by a body-level class that the script
 * toggles from the widget's own breakpoint control, so the same stylesheet can
 * serve instances configured with different breakpoints on one page.
 */
.hhfmenu.hhfmenu-mobile .hhfmenu-util-tag {
	display: none;
}

.hhfmenu.hhfmenu-mobile .hhfmenu-bar {
	min-height: var(--hhfmenu-bar-h-m);
	gap: 14px;
}

.hhfmenu.hhfmenu-mobile .hhfmenu-nav,
.hhfmenu.hhfmenu-mobile .hhfmenu-header-cta,
.hhfmenu.hhfmenu-mobile .hhfmenu-panelwrap {
	display: none !important;
}

.hhfmenu.hhfmenu-mobile .hhfmenu-burger {
	display: inline-flex;
}

.hhfmenu.hhfmenu-mobile .hhfmenu-mega,
.hhfmenu.hhfmenu-mobile .hhfmenu-loc {
	grid-template-columns: 1fr;
}

.hhfmenu.hhfmenu-mobile .hhfmenu-regions.hhfmenu-is-grouped {
	--hhfmenu-region-cols: 2;
}

.hhfmenu.hhfmenu-mobile .hhfmenu-clincol {
	border-left: 0;
	padding-left: 0;
}

/*
 * Safety net for genuinely narrow handsets only (320–359px). Mainstream phone
 * widths — 375, 390, 393, 414, 428 — deliberately fall through to the design's
 * two-column clinic list rather than being overridden here.
 */
@media (max-width: 359px) {
	.hhfmenu .hhfmenu-container {
		padding: 0 18px;
	}

	.hhfmenu .hhfmenu-mgrp .hhfmenu-mlinks {
		grid-template-columns: 1fr;
	}

	.hhfmenu .hhfmenu-findbar b {
		font-size: 17px;
	}

	.hhfmenu .hhfmenu-util .hhfmenu-container {
		gap: 12px;
	}
}

/* Keyboard focus stays visible everywhere. */
.hhfmenu a:focus-visible,
.hhfmenu button:focus-visible {
	outline: 2px solid var(--hhfmenu-burg);
	outline-offset: 2px;
	border-radius: 6px;
}

/* Inside the Elementor editor the panel must not escape the preview frame. */
.elementor-editor-active .hhfmenu .hhfmenu-panelwrap {
	max-width: 100%;
}