/**
 * Primary navigation — mega grid under Treatments hub (desktop).
 * Scoped under .hcmc-dental only. Desktop rules use min-width 922px to match max-width 921px mobile split (Astra header breakpoint default 921).
 *
 * Mega column intent (adjust order in Appearance → Menus): col1 implant / grafts, col2 ortho, col3 cosmetic + general + emergency.
 */

/* Desktop: compact primary nav — one row, consistent with Astra ≤921 / ≥922 split */
@media (min-width: 922px) {
	/* Mega / dropdown must not be clipped by Astra header overflow */
	.hcmc-dental #ast-desktop-header,
	.hcmc-dental #ast-desktop-header .ast-primary-header-bar,
	.hcmc-dental #ast-desktop-header .site-primary-header-wrap,
	.hcmc-dental #ast-desktop-header .ast-builder-grid-row,
	.hcmc-dental #ast-desktop-header .main-header-bar-navigation,
	.hcmc-dental #ast-desktop-header .site-header-primary-section-right,
	.hcmc-dental #ast-desktop-header .site-header-primary-section-right .ast-builder-menu,
	.hcmc-dental #ast-desktop-header .main-header-menu {
		overflow: visible !important;
	}

	.hcmc-dental #ast-desktop-header .ast-primary-header-bar.ast-primary-header.main-header-bar {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		border-bottom: 1px solid rgba(15, 23, 42, 0.06);
	}

	.hcmc-dental #ast-desktop-header .site-primary-header-wrap.ast-builder-grid-row {
		min-height: 0 !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		align-items: center !important;
	}

	.hcmc-dental.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item {
		line-height: 1.12 !important;
		min-height: 0 !important;
	}

	.hcmc-dental .main-header-bar-navigation .main-header-menu.ast-nav-menu,
	.hcmc-dental #ast-hf-menu-1.main-header-menu,
	.hcmc-dental [id^="ast-hf-menu-"].main-header-menu {
		flex-wrap: nowrap !important;
		justify-content: flex-start;
		align-items: center;
		column-gap: 0.08rem;
		row-gap: 0;
		width: 100%;
		min-width: 0;
	}

	.hcmc-dental .main-header-menu > .menu-item > .menu-link {
		font-size: 0.90625rem !important;
		line-height: 1.12 !important;
		font-weight: 600 !important;
		letter-spacing: 0.015em;
		padding: 0.06rem 0.5rem !important;
		white-space: nowrap;
		color: #1e293b !important;
		text-decoration: none !important;
		box-shadow: none !important;
	}

	.hcmc-dental .main-header-menu > .menu-item > .menu-link:focus,
	.hcmc-dental .main-header-menu > .menu-item > .menu-link:focus-visible {
		text-decoration: none !important;
	}

	.hcmc-dental .main-header-menu > .menu-item:hover > .menu-link,
	.hcmc-dental .main-header-menu > .menu-item:focus-within > .menu-link {
		color: var(--hcmc-brand-green, #2e7d32) !important;
	}

	/* Current page: green only — no bottom bar / underline (feels cramped). */
	.hcmc-dental .main-header-menu > .menu-item.current-menu-item > .menu-link {
		color: var(--hcmc-brand-green, #2e7d32) !important;
		box-shadow: none !important;
	}

	.hcmc-dental .main-header-menu > .menu-item.current-menu-ancestor:not(.current-menu-item) > .menu-link {
		color: rgba(46, 125, 50, 0.72) !important;
		box-shadow: none;
	}

	.hcmc-dental #ast-desktop-header .site-branding,
	.hcmc-dental #ast-desktop-header .site-logo-img,
	.hcmc-dental #ast-desktop-header .site-logo-img .custom-logo-link {
		line-height: 0 !important;
	}

	.hcmc-dental .site-logo-img .custom-logo-link img.custom-logo,
	.hcmc-dental .site-logo-img img {
		display: block !important;
		max-height: 36px !important;
		width: auto !important;
		height: auto !important;
		vertical-align: middle;
	}

	.hcmc-dental .ast-primary-header-bar.ast-builder-grid-row-layout-default .ast-builder-grid-row {
		align-items: center;
	}

	.hcmc-dental #ast-desktop-header .ast-builder-layout-element[data-section='title_tagline'] {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	.hcmc-dental #ast-desktop-header .main-header-bar-navigation {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}

	/* Submenu affordance — Astra arrow spans hidden; show chevron on top-level parent links */
	.hcmc-dental.ast-desktop .main-header-menu > .menu-item.menu-item-has-children > .menu-link {
		padding-right: 1.15rem !important;
	}
	.hcmc-dental.ast-desktop .main-header-menu > .menu-item.menu-item-has-children > .menu-link::after {
		content: "";
		display: inline-block;
		width: 0.38em;
		height: 0.38em;
		margin-left: 0.28em;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: translateY(-0.12em) rotate(45deg);
		vertical-align: middle;
		opacity: 0.75;
		transition: transform 0.15s ease, opacity 0.15s ease;
	}
	/* Chevron “open” only on direct hover of top link — avoids stuck ▲ when focus is inside another item’s panel */
	.hcmc-dental.ast-desktop .main-header-menu > .menu-item.menu-item-has-children:hover > .menu-link::after {
		transform: translateY(0.06em) rotate(225deg);
		opacity: 1;
	}

	/* Desktop: hide Astra duplicate arrows / toggles (mega handles hover) */
	.hcmc-dental.ast-desktop .main-header-menu .dropdown-menu-toggle,
	.hcmc-dental.ast-desktop .main-header-menu .ast-header-navigation-arrow,
	.hcmc-dental.ast-desktop .main-header-menu .ast-menu-toggle {
		display: none !important;
	}

	.hcmc-dental .main-header-menu > .menu-item.menu-item-has-children {
		position: relative;
	}

	/* Hover bridge — invisible hit area so moving to panel doesn’t close mega */
	.hcmc-dental .main-header-menu > .menu-item.menu-item-has-children::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		height: 30px;
		z-index: 9998;
	}

	/* Mega + rich: clear gap under Treatments / Tourism / About (same offset everywhere) */
	.hcmc-dental .main-header-menu > .menu-item > .hcmc-mega,
	.hcmc-dental .main-header-menu > .menu-item > .hcmc-rich {
		position: absolute;
		top: calc(100% + 22px);
		z-index: 9999;
		visibility: hidden;
		opacity: 0;
		transform: translateY(-3px);
		transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
		pointer-events: none;
	}

	.hcmc-dental .main-header-menu > .menu-item > .hcmc-rich {
		left: 50%;
		right: auto;
		transform: translate(-50%, -3px);
	}

	.hcmc-dental .main-header-menu > .menu-item:hover > .hcmc-mega,
	.hcmc-dental .main-header-menu > .menu-item:focus-within > .hcmc-mega,
	.hcmc-dental .main-header-menu > .menu-item:hover > .hcmc-rich,
	.hcmc-dental .main-header-menu > .menu-item:focus-within > .hcmc-rich {
		visibility: visible;
		opacity: 1;
		pointer-events: auto;
	}

	.hcmc-dental .main-header-menu > .menu-item:hover > .hcmc-rich,
	.hcmc-dental .main-header-menu > .menu-item:focus-within > .hcmc-rich {
		transform: translate(-50%, 0);
	}

	.hcmc-dental .hcmc-mega,
	.hcmc-dental .hcmc-rich {
		font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	}

	.hcmc-dental .hcmc-mega {
		width: min(960px, 92vw);
		padding: 0;
		border-radius: 16px;
		background: #fff;
		box-shadow: 0 20px 50px rgba(15, 23, 42, 0.1), 0 0 0 1px rgba(15, 23, 42, 0.04);
		border-top: 3px solid var(--hcmc-brand-green, #2e7d32);
	}

	.hcmc-dental .hcmc-mega--treatments {
		width: min(920px, calc(100vw - 24px));
		max-width: calc(100vw - 24px);
	}

	/* Tourism: narrower panel + left-aligned grid (no “floating” empty space on the right) */
	.hcmc-dental .hcmc-mega--tourism {
		width: min(520px, calc(100vw - 24px));
		max-width: calc(100vw - 24px);
	}

	/*
	 * Tourism: anchor panel to parent <li> left edge (not right), cap width to viewport — avoids
	 * first columns clipped when `right:0` + wide panel extends past screen left.
	 */
	.hcmc-dental .hcmc-mega--right {
		left: 0 !important;
		right: auto !important;
		transform: translateY(-3px);
	}

	.hcmc-dental .main-header-menu > .menu-item:hover > .hcmc-mega--right,
	.hcmc-dental .main-header-menu > .menu-item:focus-within > .hcmc-mega--right {
		transform: translateY(0);
	}

	.hcmc-dental .hcmc-mega:not(.hcmc-mega--right) {
		left: 50%;
		right: auto;
	}

	.hcmc-dental .main-header-menu > .menu-item > .hcmc-mega:not(.hcmc-mega--right) {
		transform: translate(-50%, -3px);
	}

	.hcmc-dental .main-header-menu > .menu-item:hover > .hcmc-mega:not(.hcmc-mega--right),
	.hcmc-dental .main-header-menu > .menu-item:focus-within > .hcmc-mega:not(.hcmc-mega--right) {
		transform: translate(-50%, 0);
	}

	.hcmc-dental .hcmc-mega__inner {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: stretch;
		gap: 1.15rem;
		padding: 1rem 1.1rem 1.2rem;
		min-width: 0;
	}

	/*
	 * Astra core: .main-header-menu .sub-menu { position:absolute; left:-999em; visibility:hidden } until
	 * .menu-item:hover > .sub-menu (direct child). Mega/rich wrap panels in .hcmc-mega / .hcmc-rich, so inner
	 * lists must never use that flyout treatment.
	 */
	.hcmc-dental .hcmc-mega .sub-menu,
	.hcmc-dental .hcmc-rich .sub-menu {
		position: static !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		width: auto !important;
		min-width: 0;
		visibility: visible !important;
		opacity: 1 !important;
		transform: none !important;
		clip: auto !important;
		height: auto !important;
		max-height: none !important;
		overflow: visible !important;
		pointer-events: auto !important;
	}

	.hcmc-dental .hcmc-mega__cols {
		display: flex;
		flex: 1 1 auto;
		min-width: 0;
		gap: 1rem;
		align-items: stretch;
	}

	.hcmc-dental .hcmc-mega--tourism .hcmc-mega__cols {
		width: 100%;
		max-width: none;
		margin-inline: 0;
		justify-content: flex-start;
		gap: 1.35rem;
	}

	.hcmc-dental .hcmc-mega__col {
		flex: 1 1 0;
		min-width: 0;
		display: flex;
		flex-direction: column;
	}

	/* Treatments mega: column headings share one visual row (no staggered tops). */
	.hcmc-dental .hcmc-mega--treatments .hcmc-mega__col {
		padding-top: 0.15rem;
	}

	.hcmc-dental .hcmc-mega__col-list {
		list-style: none;
		margin: 0;
		padding: 0;
		flex: 1 1 auto;
	}

	.hcmc-dental .hcmc-mega--treatments .hcmc-mega__col-list {
		padding-bottom: 0.35rem;
	}

	.hcmc-dental .hcmc-mega__col-list .menu-item > a,
	.hcmc-dental .hcmc-mega__col-list .menu-item > .menu-link {
		display: flex;
		align-items: center;
		gap: 0;
		padding: 0.45rem 0.5rem !important;
		font-size: 13px;
		line-height: 1.35;
		border-radius: 10px;
		border: 1px solid transparent;
		color: #334155 !important;
		text-decoration: none !important;
		white-space: normal;
		transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
	}

	.hcmc-dental .hcmc-mega--treatments .hcmc-mega__col-list .menu-item > a,
	.hcmc-dental .hcmc-mega--treatments .hcmc-mega__col-list .menu-item > .menu-link {
		min-width: 0;
		padding: 0.42rem 0.42rem !important;
		font-size: 12.5px;
		letter-spacing: -0.012em;
	}

	.hcmc-dental .hcmc-mega--treatments .hcmc-nav-link__icon {
		width: 34px;
		height: 34px;
		border-radius: 9px;
	}

	.hcmc-dental .hcmc-mega--tourism .hcmc-nav-link__icon,
	.hcmc-dental .hcmc-rich .hcmc-nav-link__icon {
		width: 34px;
		height: 34px;
		border-radius: 9px;
	}

	.hcmc-dental .hcmc-mega--tourism .hcmc-mega__col-list .menu-item > a,
	.hcmc-dental .hcmc-mega--tourism .hcmc-mega__col-list .menu-item > .menu-link {
		font-size: 12.5px;
		padding: 0.42rem 0.45rem !important;
		letter-spacing: -0.012em;
	}

	.hcmc-dental .hcmc-mega--treatments .hcmc-nav-link__title {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.hcmc-dental .hcmc-mega__col-list .menu-item > a:hover,
	.hcmc-dental .hcmc-mega__col-list .menu-item > a:focus,
	.hcmc-dental .hcmc-mega__col-list .menu-item > .menu-link:hover,
	.hcmc-dental .hcmc-mega__col-list .menu-item > .menu-link:focus {
		background: rgba(240, 253, 244, 0.95);
		border-color: rgba(46, 125, 50, 0.28);
		color: var(--hcmc-brand-green, #1b5e20) !important;
		outline: none;
		box-shadow: 0 0 0 1px rgba(46, 125, 50, 0.2);
	}

	.hcmc-dental .hcmc-mega__col-list > .menu-item.hcmc-mega-cta-link > a,
	.hcmc-dental .hcmc-mega__col-list > .menu-item.hcmc-mega-cta-link > .menu-link {
		margin-top: 0.35rem;
		margin-bottom: 0.15rem;
		padding-top: 0.7rem !important;
		padding-bottom: 0.55rem !important;
		border-top: 1px solid rgba(15, 23, 42, 0.08);
		font-weight: 700;
		color: #047857 !important;
		justify-content: center;
		text-align: center;
	}

	.hcmc-dental .hcmc-mega__col-list > .menu-item.hcmc-mega-cta-link > a:hover,
	.hcmc-dental .hcmc-mega__col-list > .menu-item.hcmc-mega-cta-link > .menu-link:hover {
		background: rgba(46, 125, 50, 0.1);
	}

	.hcmc-dental .hcmc-nav-link__row--cta-only {
		display: flex;
		justify-content: center;
		width: 100%;
	}

	/* Row: center icon + label vertically (title-only and title+desc). */
	.hcmc-dental .hcmc-nav-link__row {
		display: flex;
		align-items: center;
		gap: 10px;
		width: 100%;
		min-width: 0;
		flex: 1 1 auto;
	}

	.hcmc-dental .hcmc-nav-link__text {
		flex: 1 1 auto;
		min-width: 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	/* Limia-style icon tile — pastel square behind stroke icons */
	.hcmc-dental .hcmc-nav-link__icon {
		flex: 0 0 auto;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		border-radius: 10px;
		background: linear-gradient(160deg, #f0fdf4 0%, #e8f5e9 55%, #eef2ff 100%);
		border: 1px solid rgba(46, 125, 50, 0.12);
		box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
	}

	.hcmc-dental .hcmc-nav-link__icon .hcmc-nav-ico {
		flex: 0 0 auto;
		width: 18px;
		height: 18px;
	}

	.hcmc-dental .hcmc-nav-link__icon--photo {
		padding: 0;
		overflow: hidden;
		border-radius: 50%;
		border: 2px solid rgba(46, 125, 50, 0.35);
		box-shadow: none;
		background: #f1f5f9;
	}

	.hcmc-dental .hcmc-nav-link__avatar-img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center top;
	}

	.hcmc-dental .hcmc-mega-heading__text {
		display: flex;
		align-items: center;
		font-size: 10px;
		font-weight: 800;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: #047857;
		padding: 0.45rem 0.35rem 0.4rem;
		margin: 0;
		line-height: 1.25;
		flex: 0 0 auto;
	}

	.hcmc-dental .hcmc-mega--treatments .hcmc-mega-heading__text {
		min-height: 2.75rem;
		box-sizing: border-box;
		padding-top: 0.35rem;
		padding-bottom: 0.35rem;
	}

	.hcmc-dental .hcmc-nav-ico {
		color: #475569;
	}

	.hcmc-dental .hcmc-nav-link__title {
		display: block;
		font-weight: 600;
		color: inherit;
		line-height: 1.25;
	}

	.hcmc-dental .hcmc-nav-link__desc {
		display: block;
		font-size: 11px;
		font-weight: 500;
		color: #64748b;
		margin-top: 2px;
		line-height: 1.25;
	}

	.hcmc-dental .hcmc-mega__cta {
		flex: 0 0 200px;
		max-width: 220px;
		align-self: stretch;
		display: flex;
		flex-direction: column;
		justify-content: center;
		background: linear-gradient(160deg, #f0fdf4 0%, #ecfdf5 100%);
		border: 1px solid rgba(46, 125, 50, 0.15);
		border-radius: 12px;
		padding: 0.85rem;
		text-align: center;
	}

	.hcmc-dental .hcmc-mega__cta-img {
		width: 88px;
		height: 88px;
		border-radius: 50%;
		object-fit: cover;
		object-position: center 15%;
		border: 2px solid rgba(46, 125, 50, 0.35);
		margin: 0 auto 0.5rem;
		display: block;
	}

	.hcmc-dental .hcmc-mega__cta-kicker {
		font-size: 11px;
		color: #166534;
		text-transform: uppercase;
		letter-spacing: 0.04em;
	}

	.hcmc-dental .hcmc-mega__cta-title {
		margin: 0.15rem 0 0.4rem;
		font-size: 15px;
		font-weight: 800;
		color: #0f172a;
	}

	.hcmc-dental .hcmc-mega__cta-bullets {
		list-style: none;
		margin: 0 0 0.65rem;
		padding: 0;
		font-size: 11px;
		line-height: 1.35;
		color: #475569;
		text-align: left;
	}

	.hcmc-dental .hcmc-mega__cta-bullets li:first-child {
		font-size: 10px;
		font-weight: 600;
		letter-spacing: 0.01em;
		white-space: nowrap;
	}

	.hcmc-dental .hcmc-mega__cta-bullets li {
		position: relative;
		padding-left: 0.85rem;
		margin-bottom: 0.25rem;
	}

	.hcmc-dental .hcmc-mega__cta-bullets li::before {
		content: "✓";
		position: absolute;
		left: 0;
		color: #16a34a;
		font-size: 10px;
	}

	.hcmc-dental .hcmc-mega__cta-btn {
		display: inline-block;
		background: #2e7d32;
		color: #fff !important;
		font-weight: 700;
		font-size: 13px;
		padding: 0.5rem 0.85rem;
		border-radius: 999px;
		text-decoration: none !important;
	}

	.hcmc-dental .hcmc-mega__cta-btn:hover {
		filter: brightness(1.05);
	}

	/*
	 * Rich dropdown (About / Pricing): same “card” language as mega (green top bar, 16px radius, shadow).
	 */
	.hcmc-dental .hcmc-rich {
		min-width: min(380px, 94vw);
		max-width: min(440px, calc(100vw - 24px));
		max-height: none;
		overflow-y: visible;
		padding: 0;
		border-radius: 16px;
		background: #fff;
		box-shadow: 0 20px 50px rgba(15, 23, 42, 0.1), 0 0 0 1px rgba(15, 23, 42, 0.04);
		border: none;
		border-top: 3px solid var(--hcmc-brand-green, #2e7d32);
	}

	.hcmc-dental .hcmc-rich__ul {
		list-style: none;
		margin: 0;
		padding: 0.65rem 0.65rem 0.45rem;
	}

	.hcmc-dental .hcmc-rich__ul > .menu-item.hcmc-mega-heading > .hcmc-mega-heading__text {
		display: flex;
		align-items: center;
		font-size: 10px;
		font-weight: 800;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: #047857;
		padding: 0.45rem 0.75rem 0.4rem;
		margin: 0;
		line-height: 1.25;
		pointer-events: none;
	}

	.hcmc-dental .hcmc-rich__ul > .menu-item.hcmc-mega-heading:first-child > .hcmc-mega-heading__text {
		padding-top: 0.35rem;
	}

	.hcmc-dental .hcmc-rich__ul .menu-item > a,
	.hcmc-dental .hcmc-rich__ul .menu-item > .menu-link {
		display: flex;
		align-items: center;
		gap: 0;
		min-width: 0;
		padding: 0.48rem 0.75rem !important;
		font-size: 12.5px;
		line-height: 1.35;
		border-radius: 10px;
		border: 1px solid transparent;
		color: #334155 !important;
		text-decoration: none !important;
		white-space: normal;
		transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
	}

	.hcmc-dental .hcmc-rich__ul .menu-item > a:hover,
	.hcmc-dental .hcmc-rich__ul .menu-item > a:focus,
	.hcmc-dental .hcmc-rich__ul .menu-item > .menu-link:hover,
	.hcmc-dental .hcmc-rich__ul .menu-item > .menu-link:focus {
		background: rgba(240, 253, 244, 0.95);
		border-color: rgba(46, 125, 50, 0.28);
		color: var(--hcmc-brand-green, #1b5e20) !important;
		outline: none;
		box-shadow: 0 0 0 1px rgba(46, 125, 50, 0.2);
	}

	.hcmc-dental .hcmc-rich__footer {
		border-top: 1px solid rgba(15, 23, 42, 0.08);
		padding: 0.65rem 0.85rem 0.95rem;
		margin: 0 0.35rem 0.35rem;
		border-radius: 0 0 12px 12px;
	}

	.hcmc-dental .hcmc-rich__quote {
		display: block;
		text-align: center;
		font-weight: 700;
		font-size: 13px;
		color: #047857 !important;
		text-decoration: none !important;
	}

	.hcmc-dental .hcmc-rich__quote:hover {
		text-decoration: underline !important;
	}

	.hcmc-dental .hcmc-rich__footer .hcmc-rich-cta {
		font-weight: 800;
		letter-spacing: 0.02em;
	}

	/* Injected CTA (desktop) */
	.hcmc-dental .main-header-menu > .hcmc-nav-cta-li,
	.hcmc-dental [id^="ast-hf-menu-"].main-header-menu > .hcmc-nav-cta-li {
		list-style: none;
		display: flex !important;
		align-items: center;
		margin-left: auto;
		flex-shrink: 0;
	}

	.hcmc-dental .hcmc-nav-cta-group {
		display: flex;
		align-items: center;
		gap: 16px;
		flex-shrink: 0;
		min-width: 0;
	}

	.hcmc-dental .hcmc-nav-cta--book {
		background: #2e7d32;
		color: #fff !important;
		padding: 8px 14px;
		border-radius: 100px;
		font-weight: 600;
		text-decoration: none !important;
		font-size: 14px;
		transition: transform 0.2s ease, box-shadow 0.2s ease;
		white-space: nowrap;
		flex-shrink: 0;
	}

	.hcmc-dental .hcmc-nav-cta--book:hover,
	.hcmc-dental .hcmc-nav-cta--book:focus {
		transform: scale(1.02);
		box-shadow: 0 4px 14px rgba(46, 125, 50, 0.35);
		outline: none;
	}

	@media (min-width: 922px) and (max-width: 1180px) {
		.hcmc-dental .hcmc-nav-cta--book {
			font-size: 12px;
			padding: 7px 12px;
		}
	}

	@media (prefers-reduced-motion: reduce) {
		.hcmc-dental .main-header-menu > .menu-item > .hcmc-mega,
		.hcmc-dental .main-header-menu > .menu-item > .hcmc-rich,
		.hcmc-dental .hcmc-nav-cta--book {
			transition: none !important;
		}
	}

	@media (max-width: 1100px) {
		.hcmc-dental .hcmc-mega {
			width: min(720px, 94vw);
		}
		.hcmc-dental .hcmc-mega--treatments .hcmc-nav-link__title {
			white-space: normal;
		}
		.hcmc-dental .hcmc-mega__cols {
			flex-wrap: wrap;
			gap: 0.75rem;
		}
		.hcmc-dental .hcmc-mega__col {
			flex: 1 1 45%;
			min-width: min(260px, 100%);
		}
		.hcmc-dental .hcmc-mega__inner {
			flex-direction: column;
		}
		.hcmc-dental .hcmc-mega__cta {
			flex: 1 1 auto;
			max-width: none;
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: center;
			text-align: left;
			gap: 1rem;
		}
		.hcmc-dental .hcmc-mega__cta-img {
			margin: 0;
		}
	}
}

/* Mobile / tablet: shorter primary bar + logo */
@media (max-width: 921px) {
	.hcmc-dental.ast-header-break-point .ast-mobile-header-wrap .ast-primary-header-bar {
		min-height: 0 !important;
		padding-top: 0.2rem !important;
		padding-bottom: 0.2rem !important;
	}

	.hcmc-dental.ast-header-break-point .site-branding,
	.hcmc-dental.ast-header-break-point .site-logo-img,
	.hcmc-dental.ast-header-break-point .site-logo-img .custom-logo-link {
		line-height: 0 !important;
	}

	.hcmc-dental .site-logo-img .custom-logo-link img.custom-logo,
	.hcmc-dental .site-logo-img img {
		display: block !important;
		max-height: 32px !important;
		width: auto !important;
		height: auto !important;
	}

	/* ── Touch targets: tối thiểu 44px (WCAG 2.5.5) — giảm padding cho gọn ── */
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link,
	.hcmc-dental .ast-mobile-header-wrap .nav-menu > .menu-item > .menu-link,
	.hcmc-dental .ast-mobile-header-wrap .main-navigation > ul > li > a {
		min-height: 44px !important;
		display: flex !important;
		align-items: center !important;
		padding-top: 6px !important;
		padding-bottom: 6px !important;
		padding-left: 16px !important;
		font-size: 15px !important;
		font-weight: 600 !important;
		letter-spacing: 0.01em !important;
		color: #0f172a !important;
		border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important;
		transition: background 0.15s, color 0.15s, padding-left 0.15s !important;
	}

	/* ── Active / current page — green left accent ── */
	.hcmc-dental .ast-mobile-header-wrap .menu-item.current-menu-item > .menu-link,
	.hcmc-dental .ast-mobile-header-wrap .menu-item.current-menu-ancestor > .menu-link,
	.hcmc-dental .ast-mobile-header-wrap .menu-item.current-page-ancestor > .menu-link {
		color: var(--hcmc-brand-green, #2e7d32) !important;
		background: rgba(46, 125, 50, 0.07) !important;
		border-left: 3px solid var(--hcmc-brand-green, #2e7d32) !important;
		padding-left: 13px !important;
		font-weight: 700 !important;
	}

	/* Hover state on top-level links */
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link:hover,
	.hcmc-dental .ast-mobile-header-wrap .nav-menu > .menu-item > .menu-link:hover {
		color: var(--hcmc-brand-green, #2e7d32) !important;
		background: rgba(46, 125, 50, 0.04) !important;
		padding-left: 20px !important;
	}

	/* ── Elegant SVG Icons for Top-Level Menu Items ── */
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link::before,
	.hcmc-dental .ast-mobile-header-wrap .nav-menu > .menu-item > .menu-link::before {
		content: '';
		display: inline-block;
		width: 18px;
		height: 18px;
		margin-right: 12px;
		background-color: currentColor;
		-webkit-mask-size: contain;
		-webkit-mask-repeat: no-repeat;
		-webkit-mask-position: center;
		mask-size: contain;
		mask-repeat: no-repeat;
		mask-position: center;
		opacity: 0.75;
		transition: transform 0.2s;
	}
	/* Hover effect for icon */
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link:hover::before {
		transform: scale(1.1);
		opacity: 1;
	}
	/* Match current item icon color completely */
	.hcmc-dental .ast-mobile-header-wrap .current-menu-item > .menu-link::before,
	.hcmc-dental .ast-mobile-header-wrap .current-menu-ancestor > .menu-link::before {
		opacity: 1;
	}

	/* Individual Icons */
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link[href*="treatment"]::before {
		-webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0xMiAyMnM4LTQgOC0xMFY1bC04LTMtOCAzdjdjMCA2IDggMTAgOCAxMHoiLz48cGF0aCBkPSJNOSAxMmg2Ii8+PHBhdGggZD0iTTEyIDl2NiIvPjwvc3ZnPg==');
	}
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link[href*="tourism"]::before {
		-webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjEwIi8+PGxpbmUgeDE9IjIiIHkxPSIxMiIgeDI9IjIyIiB5Mj0iMTIiLz48cGF0aCBkPSJNMTIgMmExNS4zIDE1LjMgMCAwIDEgNCAxMCAxNS4zIDE1LjMgMCAwIDEtNCAxMCAxNS4zIDE1LjMgMCAwIDEtNC0xMCAxNS4zIDE1LjMgMCAwIDEgNC0xMHoiLz48L3N2Zz4=');
	}
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link[href*="pricing"]::before {
		-webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0yMC41OSAxMy40MWwtNy4xNyA3LjE3YTIgMiAwIDAgMS0yLjgzIDBMMiAxMlYyaDEwbDguNTkgOC41OWEyIDIgMCAwIDEgMCAyLjgyeiIvPjxsaW5lIHgxPSI3IiB5MT0iNyIgeDI9IjcuMDEiIHkyPSI3Ii8+PC9zdmc+');
	}
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link[href*="about"]::before {
		-webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0yMCAyMXYtMmE0IDQgMCAwIDAtNC00SDhhNCA0IDAgMCAwLTQgNHYyIi8+PGNpcmNsZSBjeD0iMTIiIGN5PSI3IiByPSI0Ii8+PC9zdmc+');
	}
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link[href*="contact"]::before {
		-webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik0yMiAxNi45MnYzYTIgMiAwIDAgMS0yLjE4IDIgMTkuNzkgMTkuNzkgMCAwIDEtOC42My0zLjA3IDE5LjUgMTkuNSAwIDAgMS02LTYgMTkuNzkgMTkuNzkgMCAwIDEtMy4wNy04LjY3QTIgMiAwIDAgMSA0LjExIDJoM2EyIDIgMCAwIDEgMiAxLjcyIDEyLjg0IDEyLjg0IDAgMCAwIC43IDIuODEgMiAyIDAgMCAxLS40NSAyLjExTDguMDkgOS45MWExNiAxNiAwIDAgMCA2IDZsMS4yNy0xLjI3YTIgMiAwIDAgMSAyLjExLS40NSAxMi44NCAxMi44NCAwIDAgMCAyLjgxLjdBMiAyIDAgMCAxIDIyIDE2LjkyeiIvPjwvc3ZnPg==');
	}
	.hcmc-dental .ast-mobile-header-wrap .main-header-menu > .menu-item > .menu-link[href*="blog"]::before {
		-webkit-mask-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiPjxwYXRoIGQ9Ik00IDE5LjVBMi41IDIuNSAwIDAgMSA2LjUgMTdIMjAiLz48cGF0aCBkPSJNNi41IDJIMjB2MjBINi41QTIuNSAyLjUgMCAwIDEgNCAxOS41di0xNUEyLjUgMi41IDAgMCAxIDYuNSAyeiIvPjwvc3ZnPg==');
	}


	/* ── Submenu items — indented, smaller, with depth cues ── */
	.hcmc-dental .ast-mobile-header-wrap .sub-menu {
		background: #f8fafc !important;
		border-left: 2px solid rgba(46, 125, 50, 0.2) !important;
		margin-left: 16px !important;
		border-radius: 0 0 0 4px !important;
	}
	.hcmc-dental .ast-mobile-header-wrap .sub-menu .menu-item > a,
	.hcmc-dental .ast-mobile-header-wrap .sub-menu .menu-item > .menu-link {
		min-height: 42px !important;
		display: flex !important;
		align-items: center !important;
		font-size: 13.5px !important;
		font-weight: 500 !important;
		color: #334155 !important;
		padding-left: 14px !important;
		border-bottom: 1px solid rgba(15, 23, 42, 0.05) !important;
		transition: color 0.15s, background 0.15s, padding-left 0.15s !important;
	}
	.hcmc-dental .ast-mobile-header-wrap .sub-menu .menu-item > a:hover,
	.hcmc-dental .ast-mobile-header-wrap .sub-menu .menu-item > .menu-link:hover {
		color: var(--hcmc-brand-green, #2e7d32) !important;
		background: rgba(46, 125, 50, 0.06) !important;
		padding-left: 18px !important;
	}

	/* ── Drawer footer wrapper: không có bullet/padding thừa ── */
	.hcmc-dental .ast-mobile-header-wrap .hcmc-drawer-footer-wrap {
		padding: 0 !important;
		border: none !important;
		background: transparent !important;
	}
	.hcmc-dental .ast-mobile-header-wrap .hcmc-drawer-footer-wrap::before,
	.hcmc-dental .ast-mobile-header-wrap .hcmc-drawer-footer-wrap::after {
		display: none !important;
	}
}

/* ── Desktop: hoàn toàn ẩn drawer header/footer ── */
@media (min-width: 922px) {
	.hcmc-drawer-header-wrap,
	.hcmc-drawer-header,
	.hcmc-drawer-footer-wrap {
		display: none !important;
	}
}

/*
 * Drawer items: chỉ hiển thị khi trong Astra off-canvas popup hoặc dropdown menu mở
 * Ngăn drawer header/footer render ra ngoài popup/dropdown trên mobile
 */
.hcmc-drawer-header-wrap,
.hcmc-drawer-footer-wrap {
	display: none !important;
}

/*
 * Hiển thị trong cả 2 chế độ Astra mobile:
 *   - Dropdown: nằm trong #ast-mobile-header .ast-mobile-header-content
 *   - Off-canvas: nằm trong #ast-mobile-popup
 */
#ast-mobile-header .hcmc-drawer-header-wrap,
#ast-mobile-header .hcmc-drawer-footer-wrap,
#ast-mobile-popup .hcmc-drawer-header-wrap,
#ast-mobile-popup .hcmc-drawer-footer-wrap {
	display: block !important;
}
