/*
	Martha's Vineyard Movers — beach + pro movers theme
	Builds on Halcyonic (main.css). Nav: high-contrast dark type on soft sand/sea-glass.
	Web fonts load from main.js (non-blocking) — not @import here — for faster first paint.
*/

:root {
	--mvm-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--mvm-display: "Fraunces", "Georgia", serif;
	/* Refined coast palette — deeper ink for authority, soft neutrals */
	--mvm-sand: #f0eeea;
	--mvm-sand-deep: #e4e0d8;
	--mvm-sea-glass: #d4e3e1;
	--mvm-dune: #b8c5c2;
	--mvm-ocean: #163a40;
	--mvm-ocean-mid: #2a4d54;
	--mvm-ocean-soft: #4a6670;
	--mvm-sea-mist: #5d858f;
	--mvm-sea-deep-bg: #243a3f;
	--mvm-foam: #fcfbfa;
	--mvm-hero-teal: #1f454c;
	--mvm-hero-teal-deep: #153338;
	/* CTA — confident, not loud */
	--mvm-coral: #a8431f;
	--mvm-coral-soft: #c05932;
	--mvm-link: #0f5c66;
	--mvm-radius: 14px;
	--mvm-radius-sm: 10px;
	--mvm-shadow: 0 8px 32px rgba(22, 58, 64, 0.09);
	--mvm-shadow-soft: 0 2px 16px rgba(22, 58, 64, 0.06);
	--mvm-shadow-nav: 0 4px 24px rgba(22, 58, 64, 0.06);
	--mvm-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--mvm-ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
	--mvm-duration: 0.22s;
}

html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

body {
	font-family: var(--mvm-sans) !important;
	background: var(--mvm-sand) !important;
	background-image: none !important;
	color: #2c3e44 !important;
	font-size: 1.0625rem !important;
	font-weight: 400 !important;
	line-height: 1.7 !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

input,
textarea,
select {
	font-family: var(--mvm-sans) !important;
	font-size: 1rem !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	border-radius: var(--mvm-radius-sm) !important;
	border: 1px solid rgba(26, 69, 76, 0.14) !important;
	padding: 0.65em 0.85em !important;
	transition: border-color 0.2s, box-shadow 0.2s;
}

input:focus,
textarea:focus,
select:focus {
	outline: none !important;
	border-color: var(--mvm-sea-mist) !important;
	box-shadow: 0 0 0 3px rgba(122, 159, 166, 0.25) !important;
}

a {
	transition: color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}

/* ----- Header & nav: soft beach bar, dark text (readable) ----- */

#header {
	background: var(--mvm-foam) !important;
	background-image: none !important;
	border-bottom: 1px solid rgba(22, 58, 64, 0.08) !important;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset, var(--mvm-shadow-nav) !important;
	text-shadow: none !important;
	overflow: visible !important;
}

/* Interior pages: confident sticky bar */
.subpage #header {
	position: sticky !important;
	top: 0 !important;
	z-index: 500 !important;
	background: rgba(252, 251, 250, 0.88) !important;
	backdrop-filter: saturate(160%) blur(14px);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
}

@supports not (backdrop-filter: blur(1px)) {
	.subpage #header {
		background: var(--mvm-foam) !important;
	}
}

/* Halcyonic uses position:absolute on h1 + nav — they collide when nav grows. Use flex. */
#header > .container {
	overflow: visible !important;
	position: relative !important;
	min-height: 0 !important;
	height: auto !important;
	padding-top: 1rem !important;
	padding-bottom: 1rem !important;
}

.subpage #header > .container {
	height: auto !important;
	min-height: 0 !important;
}

#header .container > .row {
	margin-bottom: 0 !important;
}

#header .container .col-12 {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 0.85rem 1.25rem !important;
	width: 100% !important;
}

/* Logo: not an H1 — page topic gets the single H1 for SEO (see docs/SEO-CONTENT-RUBRICS.md) */
#header h1,
#header .mvm-site-logo {
	position: static !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	top: auto !important;
	font-size: clamp(1.2rem, 2.8vw, 1.75rem) !important;
	margin: 0 !important;
	flex: 0 1 auto !important;
	max-width: min(20rem, 100%) !important;
	line-height: 1.2 !important;
}

#header h1 a,
#header .mvm-site-logo a {
	font-family: var(--mvm-display) !important;
	font-weight: 600 !important;
	letter-spacing: -0.02em !important;
	line-height: 1.15 !important;
	color: var(--mvm-ocean) !important;
	display: inline-block !important;
	text-decoration: none !important;
	border-bottom: none !important;
	transition: color var(--mvm-duration) var(--mvm-ease-smooth);
}

#header h1 a:hover,
#header .mvm-site-logo a:hover {
	color: var(--mvm-ocean-mid) !important;
	text-decoration: none !important;
	border-bottom: none !important;
}

/* Long-form SEO pages */
/* Long-form service & location pages — editorial width */
.subpage #content .mvm-seo-main {
	max-width: 48rem !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.mvm-seo-main h1 {
	font-family: var(--mvm-display) !important;
	font-size: clamp(1.65rem, 4vw, 2.35rem) !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean) !important;
	line-height: 1.18 !important;
	margin: 0 0 0.35em !important;
	letter-spacing: -0.025em !important;
	text-wrap: balance;
}

.mvm-seo-main .mvm-lead {
	font-size: 1.125rem !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 0 0 1.25em !important;
	max-width: 42rem !important;
}

.mvm-seo-main h2 {
	font-family: var(--mvm-display) !important;
	font-size: 1.38rem !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean) !important;
	margin: 1.85em 0 0.65em !important;
	border-bottom: 1px solid rgba(22, 58, 64, 0.1) !important;
	padding-bottom: 0.4em !important;
	letter-spacing: -0.02em !important;
}

.mvm-seo-main h3 {
	font-family: var(--mvm-sans) !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 1.25em 0 0.5em !important;
}

.mvm-seo-main p,
.mvm-seo-main li {
	max-width: 44rem !important;
}

.mvm-seo-main ul {
	margin: 0.5em 0 1em 1.1em !important;
}

.mvm-seo-main .mvm-cta-box {
	margin: 2em 0 0 !important;
	padding: 1.35em 1.5em !important;
	background: linear-gradient(145deg, rgba(212, 227, 225, 0.65) 0%, var(--mvm-sea-glass) 100%) !important;
	border-radius: var(--mvm-radius) !important;
	border: 1px solid rgba(22, 58, 64, 0.1) !important;
	box-shadow: var(--mvm-shadow-soft) !important;
	max-width: 44rem !important;
}

.mvm-seo-main .mvm-cta-box a.button-large,
.mvm-seo-main .mvm-cta-box a[href="/#home-quote"] {
	margin-top: 0.25rem;
}

.mvm-seo-main .mvm-cta-box p:last-child {
	margin-bottom: 0 !important;
}

dl.mvm-faq {
	margin: 0.75em 0 1.5em !important;
	max-width: 44rem !important;
}

dl.mvm-faq dt {
	font-weight: 700 !important;
	color: var(--mvm-ocean) !important;
	margin: 1.1em 0 0.35em !important;
	font-size: 1rem !important;
}

dl.mvm-faq dd {
	margin: 0 0 0.5em 0 !important;
	padding: 0 !important;
	color: #3a4f55 !important;
}

/* Contact page — centered card */
.subpage #content .mvm-contact-page {
	max-width: 36rem !important;
	margin: 0 auto !important;
	padding: 1rem 0 3rem !important;
	text-align: left !important;
}

.subpage #content .mvm-contact-card {
	background: var(--mvm-foam) !important;
	border: 1px solid rgba(22, 58, 64, 0.1) !important;
	border-radius: var(--mvm-radius) !important;
	box-shadow: var(--mvm-shadow) !important;
	padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.5rem, 4vw, 2.75rem) !important;
	position: relative !important;
	overflow: hidden !important;
}

.subpage #content .mvm-contact-card::before {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 4px !important;
	background: linear-gradient(
		90deg,
		var(--mvm-sea-glass) 0%,
		var(--mvm-ocean) 45%,
		var(--mvm-coral-soft) 100%
	) !important;
	border-radius: var(--mvm-radius) var(--mvm-radius) 0 0 !important;
}

.subpage #content .mvm-contact-page h1 {
	font-family: var(--mvm-display) !important;
	font-size: clamp(2rem, 4.5vw, 2.65rem) !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean) !important;
	margin: 0 0 0.65rem !important;
	letter-spacing: -0.03em !important;
	line-height: 1.12 !important;
}

.subpage #content .mvm-contact-lead {
	font-size: 1.125rem !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 0 0 2rem !important;
	line-height: 1.55 !important;
}

.subpage #content dl.mvm-contact-dl {
	margin: 0 !important;
	padding: 0 !important;
}

.subpage #content dl.mvm-contact-dl dt {
	font-size: 0.75rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.09em !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 1.5rem 0 0.5rem !important;
	opacity: 0.92 !important;
}

.subpage #content dl.mvm-contact-dl dt:first-of-type {
	margin-top: 0 !important;
}

.subpage #content dl.mvm-contact-dl dd {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 1.35rem !important;
	font-weight: 600 !important;
	font-family: var(--mvm-sans) !important;
	line-height: 1.35 !important;
}

.subpage #content dl.mvm-contact-dl dd a {
	color: var(--mvm-ocean) !important;
	border-bottom: 2px solid var(--mvm-coral-soft) !important;
	text-decoration: none !important;
	transition: color var(--mvm-duration) var(--mvm-ease-smooth),
		border-color var(--mvm-duration) var(--mvm-ease-smooth) !important;
}

.subpage #content dl.mvm-contact-dl dd a:hover {
	color: var(--mvm-ocean-mid) !important;
	border-bottom-color: var(--mvm-coral) !important;
}

.subpage #content .mvm-contact-footnote {
	margin: 2.5rem 0 0 !important;
	padding-top: 1.5rem !important;
	border-top: 1px solid rgba(22, 58, 64, 0.08) !important;
	font-size: 0.875rem !important;
	color: #5a6d72 !important;
	line-height: 1.5 !important;
}

/* Quote page — Smart Moving embed (matches contact card / coast palette) */
.subpage #content .mvm-quote-page {
	max-width: 52rem !important;
	margin: 0 auto !important;
	padding: clamp(1.5rem, 4vw, 2.25rem) clamp(1.35rem, 5vw, 2.75rem) 3.5rem !important;
	text-align: left !important;
	box-sizing: border-box !important;
}

.subpage #content .mvm-quote-page > header {
	padding-bottom: 0.25rem !important;
}

.subpage #content .mvm-quote-page > header h2 {
	font-family: var(--mvm-display) !important;
	font-size: clamp(1.85rem, 4vw, 2.35rem) !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean) !important;
	margin: 0 0 0.55rem !important;
	letter-spacing: -0.03em !important;
	line-height: 1.15 !important;
}

.subpage #content .mvm-quote-page > header h3 {
	font-family: var(--mvm-sans) !important;
	font-size: 1.05rem !important;
	font-weight: 500 !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 0 0 1.5rem !important;
	line-height: 1.45 !important;
}

.subpage #content .mvm-quote-lead {
	font-size: 1.0625rem !important;
	color: #3a4f55 !important;
	margin: 0 0 1.75rem !important;
	line-height: 1.6 !important;
	padding: 0 0.15rem !important;
}

.subpage #content .mvm-quote-lead a {
	color: var(--mvm-ocean) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border-bottom: 2px solid var(--mvm-coral-soft) !important;
	transition: color var(--mvm-duration) var(--mvm-ease-smooth),
		border-color var(--mvm-duration) var(--mvm-ease-smooth) !important;
}

.subpage #content .mvm-quote-lead a:hover {
	color: var(--mvm-ocean-mid) !important;
	border-bottom-color: var(--mvm-coral) !important;
}

.subpage #content .mvm-quote-embed-loading {
	margin: 0 0 0.65rem !important;
	font-size: 0.9rem !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean-mid) !important;
	letter-spacing: 0.02em !important;
}

.subpage #content .mvm-quote-embed-loading[hidden] {
	display: none !important;
}

.subpage #content .mvm-quote-embed {
	background: var(--mvm-foam) !important;
	border: 1px solid rgba(22, 58, 64, 0.12) !important;
	border-radius: var(--mvm-radius) !important;
	box-shadow: var(--mvm-shadow) !important;
	padding: 0 !important;
	overflow: hidden !important;
	position: relative !important;
}

.subpage #content .mvm-quote-embed::before {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 4px !important;
	background: linear-gradient(
		90deg,
		var(--mvm-sea-glass) 0%,
		var(--mvm-ocean) 45%,
		var(--mvm-coral-soft) 100%
	) !important;
	z-index: 1 !important;
	pointer-events: none !important;
}

.subpage #content .mvm-quote-embed iframe {
	display: block !important;
	width: 100% !important;
	min-width: 400px !important;
	max-width: 100% !important;
	min-height: 880px !important;
	height: 75vh !important;
	margin: 0 !important;
	border: 0 !important;
	background: var(--mvm-sand) !important;
}

@media (min-width: 900px) {
	.subpage #content .mvm-quote-embed iframe {
		min-height: 920px !important;
		height: 820px !important;
	}
}

@media (max-width: 480px) {
	.subpage #content .mvm-quote-embed iframe {
		min-width: 100% !important;
	}
}

.subpage #content .mvm-quote-embed-note {
	margin: 1.5rem 0 0 !important;
	padding: 0 0.15rem !important;
	font-size: 0.9rem !important;
	color: #5a6d72 !important;
	line-height: 1.5 !important;
}

.subpage #content .mvm-quote-embed-note a {
	color: var(--mvm-ocean) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border-bottom: 2px solid var(--mvm-coral-soft) !important;
}

.subpage #content .mvm-quote-embed-note a:hover {
	color: var(--mvm-ocean-mid) !important;
	border-bottom-color: var(--mvm-coral) !important;
}

#header nav a {
	color: var(--mvm-ocean-mid) !important;
	font-weight: 600 !important;
	font-size: 0.875rem !important;
	margin-left: 0 !important;
	text-decoration: none !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
	padding: 0.35em 0 0.3em !important;
	border-bottom: 2px solid transparent !important;
	transition: color var(--mvm-duration) var(--mvm-ease-smooth),
		border-color var(--mvm-duration) var(--mvm-ease-smooth),
		background var(--mvm-duration) var(--mvm-ease-smooth),
		box-shadow var(--mvm-duration) var(--mvm-ease-smooth);
}

#header nav a:hover {
	color: var(--mvm-ocean) !important;
	border-bottom-color: var(--mvm-coral-soft) !important;
}

/* Nav clusters: Home + Contact | Services + Service Area | CTA (aligned on one row) */
#header nav .mvm-nav-group {
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 0.35rem 1rem !important;
}

#header nav .mvm-nav-group--cta {
	align-self: center !important;
}

/* Primary nav CTA — same vertical alignment as text links (flex center on group) */
#header nav .mvm-nav-cta {
	display: inline-flex !important;
	align-items: center !important;
	line-height: 1.2 !important;
	background: linear-gradient(145deg, var(--mvm-coral-soft) 0%, var(--mvm-coral) 100%) !important;
	color: #fff !important;
	border-bottom: none !important;
	border-radius: 999px !important;
	padding: 0.5em 1.15em !important;
	margin: 0 !important;
	box-shadow: 0 2px 12px rgba(168, 67, 31, 0.22) !important;
	font-weight: 600 !important;
}

#header nav .mvm-nav-cta:hover {
	color: #fff !important;
	filter: brightness(1.05);
	box-shadow: 0 4px 18px rgba(168, 67, 31, 0.28) !important;
	transform: translateY(-1px);
}

#header nav .mvm-nav-cta:active {
	transform: translateY(0);
}

#header h1 a:focus-visible,
#header .mvm-site-logo a:focus-visible,
#header nav a:focus-visible {
	outline: 2px solid var(--mvm-coral-soft) !important;
	outline-offset: 3px !important;
	border-radius: 4px !important;
}

/* ----- In-content quote strip (top & bottom of main column; soft blue, not a second nav CTA) ----- */

.mvm-content-cta {
	display: block !important;
	width: fit-content !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding: 0.35rem 0.85rem !important;
	border-radius: var(--mvm-radius-sm) !important;
	background: linear-gradient(
		180deg,
		rgba(212, 227, 225, 0.45) 0%,
		rgba(22, 58, 64, 0.06) 100%
	) !important;
	border: 1px solid rgba(22, 58, 64, 0.1) !important;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset !important;
	text-align: center !important;
	overflow-x: auto !important;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
}

.mvm-content-cta--top {
	margin-bottom: 0.5rem !important;
}

.mvm-content-cta--bottom {
	margin-top: 1rem !important;
}

.mvm-content-cta__line {
	display: inline-flex !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	gap: 0.4rem !important;
	margin: 0 !important;
	font-family: var(--mvm-sans) !important;
	font-size: 0.78rem !important;
	line-height: 1.45 !important;
	font-weight: 500 !important;
	color: var(--mvm-ocean-mid) !important;
	white-space: nowrap !important;
}

.mvm-content-cta__action {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
	padding: 0.3rem 0.7rem !important;
	font-weight: 600 !important;
	font-size: 0.78rem !important;
	color: var(--mvm-link) !important;
	text-decoration: none !important;
	border: 1px solid rgba(15, 92, 102, 0.45) !important;
	border-radius: 7px !important;
	background: rgba(255, 255, 255, 0.72) !important;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.9) inset,
		0 1px 3px rgba(22, 58, 64, 0.1) !important;
	transition:
		color var(--mvm-duration) var(--mvm-ease-out),
		background var(--mvm-duration) var(--mvm-ease-out),
		border-color var(--mvm-duration) var(--mvm-ease-out),
		box-shadow var(--mvm-duration) var(--mvm-ease-out),
		transform var(--mvm-duration) var(--mvm-ease-out) !important;
}

.mvm-content-cta__action:hover {
	color: #fff !important;
	background: var(--mvm-link) !important;
	border-color: var(--mvm-link) !important;
	box-shadow: 0 2px 10px rgba(15, 92, 102, 0.28) !important;
	text-decoration: none !important;
	transform: translateY(-1px);
}

.mvm-content-cta__action:active {
	transform: translateY(0);
}

.mvm-content-cta__action:focus-visible {
	outline: 2px solid var(--mvm-ocean) !important;
	outline-offset: 3px !important;
	border-radius: 7px !important;
}

.mvm-content-cta__sep {
	margin: 0 !important;
	color: rgba(22, 58, 64, 0.35) !important;
	font-weight: 400 !important;
}

.mvm-content-cta__sub {
	font-weight: 400 !important;
	color: var(--mvm-ocean-soft) !important;
}

/* Desktop: nav row — static position so it sits beside logo in flex parent */
#header nav {
	position: static !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	top: auto !important;
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: 0.5rem 1.35rem !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	font-weight: inherit !important;
}

#header nav > a {
	margin-left: 0 !important;
}

/* Services flyout — no padding-bottom here: it inflated the flex item and centered
   the taller box, so dropdown labels sat higher than Home/Contact. Bridge uses ::after. */
#header nav .nav-dropdown {
	position: relative;
	display: flex;
	align-items: center;
	margin-left: 0 !important;
	padding-bottom: 0;
}

/* Invisible hover bridge below trigger (out of flow — does not shift vertical alignment). */
#header nav .nav-dropdown::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: 0.65rem;
	z-index: 0;
	pointer-events: auto;
}

#header nav .nav-dropdown-trigger::after {
	content: " ▾";
	font-size: 0.65em;
	opacity: 0.7;
	vertical-align: 0.1em;
}

#header nav .nav-dropdown-menu {
	display: block;
	position: absolute;
	left: 50%;
	transform: translateX(-50%) translateY(6px);
	/* Flush to wrapper bottom — no gap; spacing from trigger is padding inside the panel */
	top: 100%;
	min-width: 18rem;
	margin: 0;
	padding: 0.55rem 0 0.5rem;
	list-style: none;
	background: var(--mvm-foam);
	border: 1px solid rgba(22, 58, 64, 0.1);
	border-radius: var(--mvm-radius-sm);
	box-shadow: var(--mvm-shadow);
	z-index: 200; /* above ::after hover bridge */
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity var(--mvm-duration) var(--mvm-ease-out),
		transform var(--mvm-duration) var(--mvm-ease-out),
		visibility var(--mvm-duration);
}

#header nav .nav-dropdown:hover .nav-dropdown-menu,
#header nav .nav-dropdown:focus-within .nav-dropdown-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}

#header nav .nav-dropdown-menu li {
	margin: 0;
	padding: 0;
	border: 0;
}

#header nav .nav-dropdown-menu a {
	display: block;
	margin-left: 0 !important;
	padding: 0.5em 1.2em !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	color: var(--mvm-ocean-mid) !important;
	text-decoration: none !important;
	border-bottom: none !important;
	border-radius: 0;
	white-space: nowrap;
	transition: background var(--mvm-duration) var(--mvm-ease-smooth),
		color var(--mvm-duration) var(--mvm-ease-smooth);
}

#header nav .nav-dropdown-menu a:hover {
	background: rgba(22, 58, 64, 0.06);
	color: var(--mvm-ocean) !important;
	border-bottom: none !important;
}

/* Footer contact column */
#footer .mvm-footer-contact-title {
	font-family: var(--mvm-sans) !important;
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	color: var(--mvm-ocean) !important;
	margin: 1.25em 0 0.4em !important;
	letter-spacing: 0.01em !important;
}

#footer .mvm-footer-contact {
	margin: 0 0 0.5em !important;
	font-size: 0.95rem !important;
	line-height: 1.55 !important;
	color: #3a4f55 !important;
}

#footer .mvm-footer-contact a {
	color: var(--mvm-ocean-mid) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border-bottom: 1px solid transparent !important;
	transition: color var(--mvm-duration) var(--mvm-ease-smooth),
		border-color var(--mvm-duration) var(--mvm-ease-smooth);
}

#footer .mvm-footer-contact a:hover {
	color: var(--mvm-coral) !important;
	border-bottom-color: rgba(168, 67, 31, 0.35) !important;
}

/* Mobile / panel: flat list (no hover) — depth from template */
@media screen and (max-width: 980px) {
	#header nav {
		display: flex !important;
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 0.65rem !important;
	}

	#header nav .mvm-nav-group {
		flex-direction: column !important;
		align-items: flex-start !important;
		width: 100% !important;
		gap: 0.35rem !important;
	}

	#header nav .mvm-nav-group--cta {
		width: 100% !important;
	}

	#header nav .mvm-nav-cta {
		width: 100% !important;
		justify-content: center !important;
		text-align: center !important;
	}

	#header nav .nav-dropdown::after {
		display: none;
	}

	#header nav .nav-dropdown-menu {
		display: none !important;
	}
}

/* ----- Hero: simple headline, no competing gradients ----- */

#banner.mvm-hero {
	background: linear-gradient(
		155deg,
		var(--mvm-hero-teal) 0%,
		var(--mvm-hero-teal-deep) 48%,
		#0f2a2f 100%
	) !important;
	border-top: none !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
	text-shadow: none !important;
	padding: clamp(2rem, 4vw, 3rem) 0 clamp(2.25rem, 4vw, 3.25rem) !important;
}

/* Hero image: compact frame ~ original 900×520 banner proportion (not full intrinsic height) */
#banner.mvm-hero a.bordered-feature-image.mvm-hero-visual {
	position: relative !important;
	display: block !important;
	width: 100%;
	max-width: 28rem;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0 !important;
	overflow: hidden;
	border-radius: var(--mvm-radius) !important;
	aspect-ratio: 900 / 520;
	max-height: clamp(200px, 28vw, 280px);
}

#banner.mvm-hero a.mvm-hero-visual img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block !important;
	max-height: none !important;
}

@media screen and (max-width: 820px) {
	#banner.mvm-hero a.bordered-feature-image.mvm-hero-visual {
		max-width: 100%;
		max-height: min(240px, 52vw);
		margin-top: 1rem;
	}
}

.mvm-hero-copy {
	padding-right: 0.5rem;
}

.mvm-hero-title {
	font-family: var(--mvm-display) !important;
	font-weight: 600 !important;
	font-size: clamp(1.85rem, 4.2vw, 2.65rem) !important;
	line-height: 1.12 !important;
	letter-spacing: -0.025em !important;
	color: #fff !important;
	margin: 0 0 0.65rem !important;
	max-width: 14em;
	text-wrap: balance;
}

.mvm-hero-lead {
	font-weight: 400 !important;
	font-size: 1.125rem !important;
	line-height: 1.5 !important;
	color: rgba(255, 255, 255, 0.9) !important;
	letter-spacing: 0;
	margin: 0 0 1.35rem !important;
	max-width: 22em;
}

@media screen and (max-width: 736px) {
	.mvm-hero-lead {
		font-size: 1.05rem !important;
	}
}

#banner .mvm-banner-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem 1rem;
	align-items: center;
	margin-top: 1.25rem;
}

/* ----- Features: same light family as body (readable, not a second “theme”) ----- */

#features {
	background: var(--mvm-sand) !important;
	background-image: none !important;
	border-top: 1px solid rgba(22, 58, 64, 0.07) !important;
	border-bottom: 1px solid rgba(22, 58, 64, 0.05) !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: #2c3e44 !important;
	padding: clamp(2.75rem, 5vw, 4rem) 0 clamp(3rem, 5vw, 4.25rem) !important;
}

/* Feature columns as calm cards */
#features > .container > .row > div > section {
	background: var(--mvm-foam) !important;
	border-radius: var(--mvm-radius) !important;
	padding: 1.5rem 1.35rem 1.75rem !important;
	border: 1px solid rgba(22, 58, 64, 0.07) !important;
	box-shadow: var(--mvm-shadow-soft) !important;
	height: 100%;
	transition: box-shadow var(--mvm-duration) var(--mvm-ease-out),
		transform var(--mvm-duration) var(--mvm-ease-out),
		border-color var(--mvm-duration) var(--mvm-ease-out);
}

#features > .container > .row > div > section:hover {
	box-shadow: var(--mvm-shadow) !important;
	border-color: rgba(22, 58, 64, 0.11) !important;
	transform: translateY(-2px);
}

#features h2 {
	font-family: var(--mvm-display) !important;
	font-weight: 600 !important;
	font-size: 1.22rem !important;
	color: var(--mvm-ocean) !important;
	margin-top: 0.5rem !important;
	letter-spacing: -0.02em !important;
}

#features section p {
	font-size: 0.97rem !important;
	line-height: 1.65 !important;
	color: var(--mvm-ocean-soft) !important;
}

#features a {
	color: var(--mvm-link) !important;
	text-decoration: none !important;
	border-bottom: 1px solid rgba(29, 107, 115, 0.35) !important;
}

#features a:hover {
	color: var(--mvm-ocean) !important;
	border-bottom-color: var(--mvm-coral-soft) !important;
}

#features strong {
	color: var(--mvm-ocean-mid) !important;
	font-weight: 600 !important;
}

/* All four feature thumbnails: subtle black wash over the image frame */
#features > .container > .row > .col-3 > section > a.bordered-feature-image {
	position: relative !important;
}

#features > .container > .row > .col-3 > section > a.bordered-feature-image::after {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	border-radius: inherit !important;
	background: linear-gradient(
		180deg,
		rgba(0, 0, 0, 0.28) 0%,
		rgba(0, 0, 0, 0.4) 100%
	) !important;
	pointer-events: none !important;
	z-index: 1 !important;
}

#features > .container > .row > .col-3 > section > a.bordered-feature-image img {
	position: relative !important;
	z-index: 0 !important;
}

/* ----- Content cards ----- */

#content {
	background: var(--mvm-sand) !important;
	background-image: none !important;
	border-top: 1px solid rgba(22, 58, 64, 0.06) !important;
	padding: clamp(2.5rem, 4vw, 3.75rem) 0 !important;
}

#content section {
	background: var(--mvm-foam) !important;
	border-radius: var(--mvm-radius) !important;
	box-shadow: var(--mvm-shadow-soft) !important;
	border: 1px solid rgba(22, 58, 64, 0.07) !important;
	padding: clamp(1.75rem, 3vw, 2.35rem) clamp(1.5rem, 3vw, 2rem) !important;
	margin-bottom: 1.35rem !important;
	transition: box-shadow var(--mvm-duration) var(--mvm-ease-out),
		border-color var(--mvm-duration) var(--mvm-ease-out);
}

.subpage #content section:not(.mvm-seo-main):hover {
	box-shadow: var(--mvm-shadow) !important;
	border-color: rgba(22, 58, 64, 0.09) !important;
}

#content h2 {
	font-family: var(--mvm-display) !important;
	font-size: clamp(1.5rem, 2vw, 1.85rem) !important;
	color: var(--mvm-ocean) !important;
	font-weight: 600 !important;
}

#content h3 {
	color: var(--mvm-ocean-soft) !important;
	opacity: 0.92;
	font-weight: 500 !important;
	font-size: 1.05rem !important;
}

#content a {
	color: var(--mvm-link) !important;
	text-decoration: none !important;
	border-bottom: 1px solid rgba(36, 107, 114, 0.35) !important;
}

#content a:hover {
	color: var(--mvm-ocean-mid) !important;
	border-bottom-color: var(--mvm-coral) !important;
}

/* Primary CTAs: not body-copy links */
#content a.button-large,
#banner a.button-large {
	color: #fff !important;
	border-bottom: none !important;
}

#content a.button-large:hover,
#banner a.button-large:hover {
	color: #fff !important;
	border-bottom: none !important;
}

/* ----- Primary button: friendly mover CTA ----- */

.button-large {
	background: linear-gradient(145deg, var(--mvm-coral-soft) 0%, var(--mvm-coral) 100%) !important;
	border: none !important;
	border-radius: 999px !important;
	box-shadow: 0 4px 20px rgba(168, 67, 31, 0.28) !important;
	font-family: var(--mvm-sans) !important;
	font-weight: 600 !important;
	font-size: 1.03rem !important;
	height: auto !important;
	line-height: 1.35 !important;
	padding: 0.7em 1.85em !important;
	min-height: 2.85rem !important;
	text-shadow: none !important;
	text-decoration: none !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	color: #fff !important;
	letter-spacing: 0.01em !important;
	transition: transform var(--mvm-duration) var(--mvm-ease-out),
		box-shadow var(--mvm-duration) var(--mvm-ease-out),
		filter var(--mvm-duration) var(--mvm-ease-out);
}

.button-large:hover {
	background: linear-gradient(145deg, #cf6a42 0%, #b84a24 100%) !important;
	box-shadow: 0 8px 28px rgba(168, 67, 31, 0.35) !important;
	transform: translateY(-2px);
	filter: brightness(1.03);
}

.button-large:active {
	transform: translateY(0);
	box-shadow: 0 2px 14px rgba(168, 67, 31, 0.28) !important;
}

.button-large:focus-visible {
	outline: 2px solid #fff !important;
	outline-offset: 3px !important;
}

button.button-large,
input[type="submit"].button-large {
	cursor: pointer;
	font-family: var(--mvm-sans) !important;
	color: #fff !important;
}

/* ----- Homepage: text-only reviews + bottom closer ----- */

#content .mvm-home-reviews header {
	margin-bottom: 1.15em !important;
}

.mvm-home-testimonials {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.mvm-home-testimonial {
	margin: 0 !important;
	padding: 1.05rem 0 1.05rem 1rem !important;
	border: none !important;
	border-left: 3px solid var(--mvm-coral-soft) !important;
	border-bottom: 1px solid rgba(22, 58, 64, 0.08) !important;
	background: transparent !important;
	box-shadow: none !important;
}

.mvm-home-testimonial:first-of-type {
	padding-top: 0 !important;
}

.mvm-home-testimonial:last-of-type {
	border-bottom: none !important;
	padding-bottom: 0 !important;
}

.mvm-home-testimonial p {
	margin: 0 0 0.4rem 0 !important;
	font-size: 1.05rem !important;
	font-style: italic !important;
	line-height: 1.55 !important;
	color: #3a4f55 !important;
	font-family: var(--mvm-sans) !important;
}

.mvm-home-testimonial footer {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 0.8125rem !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean-mid) !important;
	letter-spacing: 0.02em !important;
	font-family: var(--mvm-sans) !important;
	font-style: normal !important;
}

/* ----- Homepage: extra photos (sixth image onward from project /photos) ----- */

.mvm-home-gallery {
	background: var(--mvm-sand) !important;
	border-top: 1px solid rgba(22, 58, 64, 0.06) !important;
	padding: clamp(2.25rem, 4vw, 3.5rem) 0 !important;
}

.mvm-home-gallery__head {
	text-align: center;
	margin-bottom: 1.75rem !important;
}

.mvm-home-gallery__head h2 {
	font-family: var(--mvm-display) !important;
	color: var(--mvm-ocean) !important;
	font-size: 1.65rem !important;
	margin: 0 0 0.35rem !important;
}

.mvm-home-gallery__head h3 {
	font-family: var(--mvm-sans) !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean-mid) !important;
	font-size: 0.95rem !important;
	margin: 0 !important;
	text-transform: none !important;
	letter-spacing: 0.02em !important;
}

.mvm-home-gallery__item {
	margin: 0 0 1.25rem !important;
}

.mvm-home-gallery__frame {
	position: relative;
	border-radius: var(--mvm-radius) !important;
	overflow: hidden !important;
	box-shadow: var(--mvm-shadow) !important;
	border: 1px solid rgba(22, 58, 64, 0.08) !important;
	aspect-ratio: 4 / 3;
	background: rgba(22, 58, 64, 0.04);
}

.mvm-home-gallery__frame img {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover !important;
	object-position: center !important;
	display: block !important;
}

/* Home — Smart Moving short embed (below 3-up content; side-by-side on wide screens) */
#home-quote.mvm-home-quote {
	scroll-margin-top: 1.25rem !important;
	background: linear-gradient(
		180deg,
		rgba(252, 251, 250, 0.98) 0%,
		var(--mvm-foam) 55%,
		rgba(252, 251, 250, 0.96) 100%
	) !important;
	border-top: 1px solid rgba(22, 58, 64, 0.07) !important;
	padding: clamp(2rem, 4.5vw, 2.75rem) 0 !important;
}

.mvm-home-quote .mvm-home-quote__layout {
	display: grid !important;
	gap: 1.5rem 2.5rem !important;
	align-items: start !important;
	max-width: 72rem !important;
	margin: 0 auto !important;
	padding: 0 clamp(0.85rem, 3.5vw, 1.25rem) !important;
	box-sizing: border-box !important;
}

.mvm-home-quote__copy {
	text-align: center !important;
}

.mvm-home-quote__copy > header {
	padding-bottom: 0.15rem !important;
}

.mvm-home-quote__copy > header h2 {
	font-family: var(--mvm-display) !important;
	font-size: clamp(1.65rem, 3.5vw, 2.05rem) !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean) !important;
	margin: 0 0 0.4rem !important;
	letter-spacing: -0.03em !important;
	line-height: 1.15 !important;
}

.mvm-home-quote__copy > header h3 {
	font-family: var(--mvm-sans) !important;
	font-size: 0.98rem !important;
	font-weight: 500 !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 0 0 1rem !important;
	line-height: 1.45 !important;
}

.mvm-home-quote__lead {
	font-size: 1rem !important;
	color: #3a4f55 !important;
	margin: 0 0 1.1rem !important;
	line-height: 1.58 !important;
}

.mvm-home-quote__lead a {
	color: var(--mvm-ocean) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border-bottom: 2px solid var(--mvm-coral-soft) !important;
	transition: color var(--mvm-duration) var(--mvm-ease-smooth),
		border-color var(--mvm-duration) var(--mvm-ease-smooth) !important;
}

.mvm-home-quote__lead a:hover {
	color: var(--mvm-ocean-mid) !important;
	border-bottom-color: var(--mvm-coral) !important;
}

.mvm-home-quote__embed-column {
	width: 100% !important;
	max-width: 26.5rem !important;
	margin: 0 auto !important;
}

.mvm-home-quote__loading {
	margin: 0 0 0.5rem !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	color: var(--mvm-ocean-mid) !important;
	letter-spacing: 0.02em !important;
	text-align: center !important;
}

.mvm-home-quote__loading[hidden] {
	display: none !important;
}

.mvm-home-quote__embed {
	width: 100% !important;
	margin: 0 !important;
	background: var(--mvm-foam) !important;
	border: 1px solid rgba(22, 58, 64, 0.12) !important;
	border-radius: var(--mvm-radius) !important;
	box-shadow: var(--mvm-shadow) !important;
	padding: 0 !important;
	overflow: hidden !important;
	position: relative !important;
	/* Wrapper hugs iframe; no fixed viewport height (that caused inner iframe scrollbars). */
}

.mvm-home-quote__embed::before {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 4px !important;
	background: linear-gradient(
		90deg,
		var(--mvm-sea-glass) 0%,
		var(--mvm-ocean) 45%,
		var(--mvm-coral-soft) 100%
	) !important;
	z-index: 1 !important;
	pointer-events: none !important;
}

.mvm-home-quote__embed iframe {
	display: block !important;
	width: 100% !important;
	/* Short embed: single tall viewport so the portal content fits without its own scrollbar. */
	height: 880px !important;
	min-height: 0 !important;
	min-width: 0 !important;
	max-width: 100% !important;
	margin: 0 !important;
	border: 0 !important;
	background: var(--mvm-sand) !important;
	box-sizing: border-box !important;
}

@media (max-width: 480px) {
	.mvm-home-quote__embed {
		max-width: 100% !important;
	}

	.mvm-home-quote__embed iframe {
		height: 820px !important;
	}
}

.mvm-home-quote__note {
	margin: 0 !important;
	font-size: 0.875rem !important;
	color: #5a6d72 !important;
	line-height: 1.5 !important;
}

@media screen and (min-width: 900px) {
	.mvm-home-quote .mvm-home-quote__layout {
		grid-template-columns: minmax(0, 1fr) minmax(17rem, 26.5rem) !important;
		gap: 2rem 2.75rem !important;
		align-items: start !important;
	}

	.mvm-home-quote__copy {
		text-align: left !important;
		padding-top: 0.15rem !important;
	}

	.mvm-home-quote__embed-column {
		margin: 0 !important;
		max-width: none !important;
		justify-self: stretch !important;
	}

	.mvm-home-quote__loading {
		text-align: left !important;
	}

	.mvm-home-quote__embed {
		max-width: 26.5rem !important;
	}
}

.mvm-home-quote__note a {
	color: var(--mvm-ocean) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border-bottom: 2px solid var(--mvm-coral-soft) !important;
}

.mvm-home-quote__note a:hover {
	color: var(--mvm-ocean-mid) !important;
	border-bottom-color: var(--mvm-coral) !important;
}

.mvm-home-closer {
	background: linear-gradient(180deg, var(--mvm-foam) 0%, rgba(252, 251, 250, 0.95) 100%) !important;
	border-top: 1px solid rgba(22, 58, 64, 0.07) !important;
	padding: clamp(2.25rem, 5vw, 3.25rem) 0 !important;
	text-align: center !important;
}

.mvm-home-closer__inner {
	max-width: 38rem !important;
	margin: 0 auto !important;
	padding: 0 0.5rem !important;
}

.mvm-home-closer__lead {
	font-size: 1.125rem !important;
	line-height: 1.52 !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 0 0 1.4rem !important;
	font-family: var(--mvm-sans) !important;
}

.mvm-home-closer__actions {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 0.65rem 0.85rem !important;
	justify-content: center !important;
	align-items: center !important;
}

.mvm-home-closer__actions .button-large {
	margin: 0 !important;
}

.mvm-btn-outline {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0.62em 1.35em !important;
	border-radius: 999px !important;
	border: 2px solid rgba(22, 58, 64, 0.16) !important;
	background: rgba(255, 255, 255, 0.75) !important;
	color: var(--mvm-ocean) !important;
	font-family: var(--mvm-sans) !important;
	font-weight: 600 !important;
	font-size: 0.98rem !important;
	text-decoration: none !important;
	transition: border-color var(--mvm-duration) var(--mvm-ease-smooth),
		background var(--mvm-duration) var(--mvm-ease-smooth),
		color var(--mvm-duration) var(--mvm-ease-smooth) !important;
}

.mvm-btn-outline:hover {
	border-color: var(--mvm-coral-soft) !important;
	color: var(--mvm-coral) !important;
	background: #fff !important;
}

.mvm-btn-outline:focus-visible {
	outline: 2px solid var(--mvm-coral-soft) !important;
	outline-offset: 3px !important;
}

@media screen and (max-width: 736px) {
	.mvm-home-closer__actions {
		flex-direction: column !important;
	}

	.mvm-home-closer__actions .button-large,
	.mvm-home-closer__actions .mvm-btn-outline {
		width: 100% !important;
		max-width: 20rem !important;
	}
}

/* ----- Media frames ----- */

.bordered-feature-image,
.feature-image {
	border-radius: var(--mvm-radius) !important;
	overflow: hidden !important;
	box-shadow: var(--mvm-shadow) !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	transition: transform var(--mvm-duration) var(--mvm-ease-out),
		box-shadow var(--mvm-duration) var(--mvm-ease-out);
}

.bordered-feature-image:hover,
.feature-image:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18) !important;
}

.bordered-feature-image img,
.feature-image img {
	border-radius: var(--mvm-radius) !important;
	display: block !important;
}

/* ----- Footer ----- */

#footer {
	text-shadow: none !important;
	color: #3d5258 !important;
	padding: clamp(2.75rem, 4vw, 3.75rem) 0 !important;
	background: linear-gradient(180deg, var(--mvm-sand-deep) 0%, var(--mvm-sand) 100%) !important;
	border-top: 1px solid rgba(22, 58, 64, 0.06) !important;
}

#footer h2 {
	font-family: var(--mvm-display) !important;
	color: var(--mvm-ocean) !important;
	font-size: 1.2rem !important;
}

#footer a {
	color: var(--mvm-ocean-mid) !important;
	text-decoration: none !important;
	border-bottom: 1px solid transparent !important;
	font-weight: 500;
}

#footer a:hover {
	color: var(--mvm-coral) !important;
	border-bottom-color: rgba(196, 92, 46, 0.4) !important;
}

/* ----- Copyright ----- */

#copyright {
	border-top: 1px solid rgba(26, 69, 76, 0.1) !important;
	box-shadow: none !important;
	text-shadow: none !important;
	color: #5a6d72 !important;
	opacity: 0.9;
	padding: 2rem 0 3rem !important;
	font-size: 0.9rem !important;
	line-height: 1.55 !important;
}

#copyright a {
	color: var(--mvm-ocean-soft) !important;
}

#copyright .mvm-legal-links {
	display: inline-block;
	margin: 0.4em 0 0.35em;
}

#copyright .mvm-legal-links--micro {
	display: block;
	margin: 0.5em 0 0 !important;
	font-size: 0.68rem !important;
	line-height: 1.45 !important;
	letter-spacing: 0.01em;
	opacity: 0.92;
}

#copyright .mvm-legal-links a {
	font-weight: 500 !important;
	text-decoration: none !important;
	border-bottom: 1px solid transparent !important;
}

#copyright .mvm-legal-links--micro a {
	font-weight: 400 !important;
}

#copyright .mvm-legal-links a:hover {
	color: var(--mvm-coral) !important;
	border-bottom-color: rgba(196, 92, 46, 0.35) !important;
}

/* ----- Town pages: landmark links ----- */

#content .area-landmarks {
	margin: 0 0 1.25em 0;
	padding-left: 1.25em;
	list-style-type: disc;
}

#content .area-landmarks li {
	margin-bottom: 0.35em;
}

#content h4 {
	font-family: var(--mvm-display);
	font-size: 1.05rem;
	color: var(--mvm-ocean);
	margin: 1.25em 0 0.5em 0;
	font-weight: 600;
}

/* ----- Island guide articles (articles/*.html) ----- */

.subpage.mvm-guide #content .mvm-guide-body {
	max-width: 48rem !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.mvm-guide .mvm-guide-breadcrumb {
	font-size: 0.9rem;
	color: var(--mvm-ocean-soft);
	margin-bottom: 1.15rem;
	letter-spacing: 0.01em;
}

.mvm-guide .mvm-guide-breadcrumb a {
	color: var(--mvm-link);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid transparent;
}

.mvm-guide .mvm-guide-breadcrumb a:hover {
	color: var(--mvm-coral);
	border-bottom-color: rgba(196, 92, 46, 0.35);
}

.mvm-guide-body .mvm-guide-list {
	column-width: 18rem;
	column-gap: 2rem;
}

.mvm-guide-body .mvm-guide-list li {
	break-inside: avoid;
}

/* ----- Mobile: title bar, hamburger (3 lines only), slide-out nav from RIGHT ----- */

@media screen and (max-width: 980px) {
	:root {
		--mvm-panel-w: min(275px, calc(100vw - 1rem));
	}

	/* Match fixed bar height (main.css uses 44px; we use 48px for touch + icon). */
	#page-wrapper {
		padding-top: 48px !important;
	}

	#titleBar {
		height: 48px !important;
		background: var(--mvm-foam) !important;
		box-shadow: var(--mvm-shadow-soft) !important;
		border-bottom: 1px solid rgba(30, 61, 66, 0.1) !important;
	}

	#titleBar .title {
		font-family: var(--mvm-display) !important;
		font-weight: 600 !important;
		text-shadow: none !important;
		color: var(--mvm-ocean) !important;
		line-height: 48px !important;
		font-size: clamp(0.95rem, 3.5vw, 1.15rem) !important;
		padding: 0 3.35rem 0 0.85rem !important;
		box-sizing: border-box !important;
		text-align: left !important;
	}

	/* Menu control: top-right — three lines only (no background “blob”). */
	#titleBar .toggle {
		width: 52px !important;
		height: 48px !important;
		top: 0 !important;
		left: auto !important;
		right: 0 !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		touch-action: manipulation !important;
	}

	#titleBar .toggle:after {
		display: none !important;
		content: none !important;
	}

	#titleBar .toggle:before {
		content: "" !important;
		position: absolute !important;
		right: 50% !important;
		left: auto !important;
		top: 50% !important;
		width: 22px !important;
		height: 2px !important;
		margin: 0 !important;
		padding: 0 !important;
		background: var(--mvm-ocean) !important;
		background-image: none !important;
		border-radius: 1px !important;
		opacity: 1 !important;
		z-index: 2 !important;
		transform: translate(50%, -50%) !important;
		box-shadow: 0 -7px 0 0 var(--mvm-ocean), 0 7px 0 0 var(--mvm-ocean) !important;
	}

	#titleBar .toggle:focus-visible {
		outline: 2px solid var(--mvm-coral-soft) !important;
		outline-offset: 2px !important;
		border-radius: 4px !important;
	}

	/* Tap dim layer (below title bar + panel). */
	#mvm-nav-backdrop {
		position: fixed !important;
		inset: 0 !important;
		z-index: 10000 !important;
		background: rgba(22, 58, 64, 0.38) !important;
		-webkit-tap-highlight-color: transparent !important;
		cursor: pointer !important;
	}

	/* Panel docks right; page slides left (Halcyonic defaults are left-docked). */
	#navPanel {
		left: auto !important;
		right: 0 !important;
		width: var(--mvm-panel-w) !important;
		max-width: 100vw !important;
		transform: translateX(100%) !important;
		background: var(--mvm-foam) !important;
		box-shadow: -6px 0 28px rgba(30, 61, 66, 0.14) !important;
		text-shadow: none !important;
		-webkit-overflow-scrolling: touch;
		padding-top: env(safe-area-inset-top, 0) !important;
		padding-bottom: env(safe-area-inset-bottom, 0) !important;
		border-left: 1px solid rgba(30, 61, 66, 0.1) !important;
		contain: layout style paint;
	}

	body.navPanel-visible #navPanel {
		transform: translateX(0) !important;
	}

	body.navPanel-visible #page-wrapper,
	body.navPanel-visible #titleBar {
		transform: translateX(calc(-1 * var(--mvm-panel-w))) !important;
	}

	@media (prefers-reduced-motion: reduce) {
		#navPanel,
		#page-wrapper,
		#titleBar {
			transition-duration: 0.01ms !important;
		}
	}

	#navPanel nav {
		padding: 0.35rem 0 0.75rem !important;
	}

	/* Primary row links — no display:!important (breaks <details> / accordions in WebKit). */
	#navPanel nav .link {
		border: none !important;
		border-bottom: 1px solid rgba(30, 61, 66, 0.08) !important;
		color: var(--mvm-ocean) !important;
		font-family: var(--mvm-sans) !important;
		font-weight: 600 !important;
		font-size: 1rem !important;
		line-height: 1.35 !important;
		padding: 0.9rem 1.15rem !important;
		min-height: 0 !important;
		display: flex;
		align-items: center;
		text-decoration: none !important;
	}

	#navPanel nav .link:hover,
	#navPanel nav .link:active {
		background: rgba(22, 58, 64, 0.05) !important;
		color: var(--mvm-ocean-mid) !important;
	}

	#navPanel nav .mvm-mobile-nav__cta {
		margin-top: 0.25rem !important;
		border-radius: var(--mvm-radius-sm) !important;
		border: 1px solid rgba(168, 67, 31, 0.35) !important;
		background: linear-gradient(145deg, var(--mvm-coral-soft) 0%, var(--mvm-coral) 100%) !important;
		color: #fff !important;
		font-weight: 600 !important;
		justify-content: center !important;
		text-align: center !important;
	}

	/* Accordion (button + [hidden] panel — reliable vs. native <details> + flex links). */
	#navPanel nav .mvm-mobile-nav__accordion {
		border-bottom: 1px solid rgba(30, 61, 66, 0.08) !important;
	}

	#navPanel nav button.mvm-mobile-nav__summary {
		appearance: none !important;
		-webkit-appearance: none !important;
		width: 100% !important;
		box-sizing: border-box !important;
		text-align: left !important;
		border: none !important;
		background: transparent !important;
		font: inherit !important;
		font-family: var(--mvm-sans) !important;
		font-weight: 600 !important;
		font-size: 1rem !important;
		color: var(--mvm-ocean) !important;
		cursor: pointer !important;
		padding: 0.9rem 2.35rem 0.9rem 1.15rem !important;
		position: relative !important;
		line-height: 1.35 !important;
		user-select: none !important;
		margin: 0 !important;
		-webkit-tap-highlight-color: transparent;
	}

	#navPanel nav button.mvm-mobile-nav__summary:hover,
	#navPanel nav button.mvm-mobile-nav__summary:focus-visible {
		background: rgba(22, 58, 64, 0.05) !important;
	}

	#navPanel nav button.mvm-mobile-nav__summary::after {
		content: "" !important;
		position: absolute !important;
		right: 1.1rem !important;
		top: 50% !important;
		width: 0.45rem !important;
		height: 0.45rem !important;
		border-right: 2px solid var(--mvm-ocean-soft) !important;
		border-bottom: 2px solid var(--mvm-ocean-soft) !important;
		transform: translateY(-60%) rotate(45deg) !important;
		transition: transform 0.2s var(--mvm-ease-out) !important;
		opacity: 0.85 !important;
	}

	#navPanel nav button.mvm-mobile-nav__summary[aria-expanded="true"]::after {
		transform: translateY(-20%) rotate(225deg) !important;
	}

	#navPanel nav .mvm-mobile-nav__sub {
		padding: 0 0 0.5rem 0 !important;
		background: rgba(22, 58, 64, 0.03) !important;
		border-top: 1px solid rgba(30, 61, 66, 0.06) !important;
	}

	#navPanel nav .mvm-mobile-nav__sub[hidden] {
		display: none !important;
	}

	#navPanel nav .mvm-mobile-nav__hub,
	#navPanel nav .mvm-mobile-nav__sublink {
		font-size: 0.94rem !important;
		font-weight: 500 !important;
		color: var(--mvm-ocean-mid) !important;
		padding: 0.65rem 1.15rem 0.65rem 1.35rem !important;
		border: none !important;
		border-bottom: 1px solid rgba(30, 61, 66, 0.06) !important;
	}

	#navPanel nav .mvm-mobile-nav__hub {
		font-weight: 600 !important;
		color: var(--mvm-link) !important;
	}

	#navPanel nav .mvm-mobile-nav__sublink:last-child {
		border-bottom: none !important;
	}

	/* Comfortable page margins on phones / notches */
	.container {
		padding-left: max(1rem, env(safe-area-inset-left)) !important;
		padding-right: max(1rem, env(safe-area-inset-right)) !important;
	}
}

/* ----- Mobile typography & density (readability) ----- */

@media screen and (max-width: 736px) {
	body {
		font-size: 1rem !important;
		line-height: 1.62 !important;
	}

	#banner.mvm-hero {
		padding: clamp(1.35rem, 5vw, 2rem) 0 clamp(1.5rem, 5vw, 2.25rem) 0 !important;
	}

	#banner.mvm-hero .container > .row {
		text-align: center !important;
	}

	.mvm-hero-copy {
		padding-right: 0 !important;
		max-width: 100% !important;
	}

	.mvm-hero-title {
		font-size: clamp(1.45rem, 6vw, 2rem) !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	.mvm-hero-lead {
		margin-left: auto !important;
		margin-right: auto !important;
		max-width: 36rem !important;
	}

	#banner .mvm-banner-ctas {
		justify-content: center !important;
		margin-top: 1rem !important;
	}

	#features {
		padding: clamp(2rem, 5vw, 2.75rem) 0 !important;
	}

	#features > .container > .row > div > section {
		padding: 1.25rem 1.1rem 1.4rem !important;
	}

	#features h2 {
		font-size: 1.12rem !important;
	}

	#features section p {
		font-size: 0.94rem !important;
		line-height: 1.6 !important;
	}

	#content {
		padding: clamp(1.5rem, 4vw, 2.25rem) 0 !important;
	}

	#content section {
		padding: clamp(1.35rem, 4vw, 1.75rem) clamp(1rem, 3.5vw, 1.35rem) !important;
		margin-bottom: 1rem !important;
	}

	#content h2 {
		font-size: clamp(1.35rem, 4.5vw, 1.65rem) !important;
		line-height: 1.2 !important;
	}

	#content h3 {
		font-size: 1rem !important;
	}

	/* Footer: single readable column */
	#footer {
		padding: clamp(2rem, 4vw, 2.75rem) 0 !important;
	}

	#footer .row {
		gap: 0 !important;
	}

	#footer .link-list li {
		padding: 0.35em 0 !important;
	}

	#footer h2 {
		font-size: 1.1rem !important;
		margin-top: 1.25rem !important;
	}

	#footer section:first-child h2 {
		margin-top: 0 !important;
	}

	#copyright {
		padding: 1.5rem max(1rem, env(safe-area-inset-left)) 2rem max(1rem, env(safe-area-inset-right)) !important;
		font-size: 0.875rem !important;
		text-align: center !important;
	}

	.mvm-home-gallery__head h2 {
		font-size: 1.35rem !important;
	}

	.mvm-home-quote .mvm-home-quote__layout {
		padding: 0 max(0.65rem, env(safe-area-inset-left)) 0 max(0.65rem, env(safe-area-inset-right)) !important;
		gap: 1.15rem !important;
	}

	.mvm-home-quote__copy > header h2 {
		font-size: clamp(1.4rem, 5vw, 1.75rem) !important;
	}

	.mvm-home-quote__lead {
		font-size: 0.97rem !important;
	}

	.mvm-home-closer__lead {
		font-size: 1.03rem !important;
	}

	/* Subpages: quote strip wraps instead of horizontal scroll */
	.mvm-content-cta {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	.mvm-content-cta__line {
		white-space: normal !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		text-align: center !important;
		row-gap: 0.35rem !important;
	}

	.mvm-content-cta__sub {
		display: block !important;
		width: 100% !important;
		flex-basis: 100% !important;
		font-size: 0.82rem !important;
		line-height: 1.5 !important;
	}
}

/* Town-specific service landing pages + sitemap matrix */
.mvm-service-town-links {
	margin-bottom: 1.25em !important;
}

.mvm-internal-crosslinks {
	margin-bottom: 1.25em !important;
}

p.mvm-crosslink-intro {
	font-size: 0.95em !important;
	color: var(--mvm-ocean-mid) !important;
	margin: 0 0 0.5em !important;
}

.mvm-sitemap-note {
	font-size: 0.95em !important;
	color: var(--mvm-ocean-mid) !important;
	margin-bottom: 0.75em !important;
}

@media (min-width: 900px) {
	ul.mvm-sitemap-service-towns {
		column-count: 2 !important;
		column-gap: 2em !important;
	}
}

/* Responsive images — reduce layout shift */
#page-wrapper img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}
