/*
 * Mobile Detailing Doctor — main stylesheet
 *
 * Brand palette uses CSS variables so dark-mode + per-section tints stay
 * consistent. Typography is Inter (loaded from Google Fonts in functions.php).
 * Mobile-first; one breakpoint at 720px and another at 1024px.
 */

/* =====================================================================
   1. Reset + base
   ===================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
	font-size: 17px;
	line-height: 1.6;
	color: var(--mdd-ink, #0f172a);
	background: var(--mdd-surface, #ffffff);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img, svg, video {
	display: block;
	max-width: 100%;
	height: auto;
}

a {
	color: var(--mdd-primary, #0b4f6c);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: color 120ms ease;
}
a:hover, a:focus {
	color: var(--mdd-doctor, #064e3b);
}

button {
	font: inherit;
	cursor: pointer;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.15;
	color: var(--mdd-ink);
	margin: 0 0 0.5em;
}

h1 { font-size: clamp(2rem, 4vw, 3rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); }
h3 { font-size: 1.375rem; }
h4 { font-size: 1.125rem; }

p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; padding-left: 1.5em; }
li { margin-bottom: 0.3em; }

/* =====================================================================
   2. Skip link + accessibility
   ===================================================================== */
.mdd-skip {
	position: absolute;
	left: -9999px;
	z-index: 100;
	background: var(--mdd-doctor);
	color: #fff;
	padding: 8px 16px;
	border-radius: 4px;
	text-decoration: none;
}
.mdd-skip:focus {
	left: 12px;
	top: 12px;
}

/* =====================================================================
   3. Layout: container
   ===================================================================== */
.mdd-container {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 28px;
}
.mdd-container--wide {
	max-width: 1440px;
}
.mdd-container--narrow {
	max-width: 880px;
}

/* Service-city meta grid — packs drive/cost/neighborhoods into one band */
.mdd-meta-grid {
	padding: 32px 0;
	border-top: 1px solid var(--mdd-border, #e0e3e8);
	border-bottom: 1px solid var(--mdd-border, #e0e3e8);
	background: #fbfbfc;
}
.mdd-meta-grid__cols {
	display: grid;
	gap: 32px;
}
.mdd-meta-grid__cols--1 { grid-template-columns: 1fr; }
.mdd-meta-grid__cols--2 { grid-template-columns: 1fr 1fr; }
.mdd-meta-grid__cols--3 { grid-template-columns: 1fr 1fr 1.4fr; }
@media (max-width: 880px) {
	.mdd-meta-grid__cols--2,
	.mdd-meta-grid__cols--3 { grid-template-columns: 1fr; gap: 20px; }
}
.mdd-meta-grid__cell { padding: 0 8px; }
.mdd-meta-grid__heading {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #d4a017;
	margin: 0 0 8px;
}
.mdd-meta-grid__body {
	font-size: 14px;
	line-height: 1.55;
	color: var(--mdd-ink, #1a1a1a);
}
.mdd-meta-grid__body p { margin: 0; }
.mdd-mini-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4px 18px;
	font-size: 13px;
}
.mdd-mini-list li::before {
	content: "•";
	margin-right: 6px;
	color: #d4a017;
}

/* =====================================================================
   27. Render-modules — Keil-pattern dense composition
   ===================================================================== */
.mdd-section-code {
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #d4a017;
	margin: 0 0 12px;
}

/* Hero on spokes — bigger title, more breathing room */
.mdd-spoke__hero { padding: 56px 0 32px; background: linear-gradient(180deg, #f6f8f6 0%, #fff 100%); }
.mdd-spoke__title {
	font-size: clamp(32px, 4.5vw, 56px);
	line-height: 1.05;
	letter-spacing: -0.025em;
	margin: 6px 0 16px;
	max-width: 900px;
}
.mdd-spoke__lede {
	font-size: clamp(15px, 1.4vw, 18px);
	line-height: 1.55;
	max-width: 720px;
	color: var(--mdd-muted, #5b6471);
	margin: 0 0 22px;
}

/* Answer block (AEO) */
.mdd-answer-block { padding: 48px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-answer-block__body {
	font-size: 19px;
	line-height: 1.55;
	max-width: 820px;
	margin: 0;
	color: var(--mdd-ink, #0b3d2e);
	font-weight: 500;
}

/* Context strip */
.mdd-context-strip {
	padding: 18px 0;
	background: #fafbfb;
	border-bottom: 1px solid var(--mdd-border, #e0e3e8);
}
.mdd-context {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	align-items: center;
	font-size: 13px;
}
.mdd-context__label { color: var(--mdd-muted, #5b6471); }
.mdd-context__link {
	color: var(--mdd-ink, #0b3d2e);
	font-weight: 600;
	text-decoration: none;
}
.mdd-context__link:hover { text-decoration: underline; }
.mdd-context__sep { color: var(--mdd-muted, #5b6471); }

/* Cost / timeline grid */
.mdd-cost-timeline { padding: 56px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-cost-timeline__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 32px; max-width: 720px; }
.mdd-cost-timeline__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}
@media (max-width: 880px) { .mdd-cost-timeline__grid { grid-template-columns: 1fr; gap: 24px; } }
.mdd-cost-timeline__cell {
	padding: 28px 24px;
	background: #f6f8f6;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
}
.mdd-cost-timeline__label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #d4a017;
	margin-bottom: 12px;
}
.mdd-cost-timeline__value {
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 800;
	line-height: 1.15;
	color: var(--mdd-ink, #0b3d2e);
	margin-bottom: 12px;
}
.mdd-cost-timeline__sub {
	font-size: 14px;
	color: var(--mdd-muted, #5b6471);
	line-height: 1.5;
}

/* Decision block (now two-column on desktop with image slot) */
.mdd-decision-block { padding: 64px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-decision-block__grid {
	display: grid;
	grid-template-columns: 1.6fr 1fr;
	gap: 56px;
	align-items: start;
}
@media (max-width: 960px) { .mdd-decision-block__grid { grid-template-columns: 1fr; gap: 36px; } }
.mdd-decision-block__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 28px; }
.mdd-decision-block__body {
	font-size: 16px;
	line-height: 1.65;
	color: var(--mdd-ink, #1a1a1a);
}
.mdd-decision-block__body h3 {
	font-size: 20px;
	margin: 28px 0 10px;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-decision-block__body h3:first-of-type { margin-top: 0; }
.mdd-decision-block__body p { margin: 0; }
.mdd-decision-block__media { position: sticky; top: 32px; }
@media (max-width: 960px) { .mdd-decision-block__media { position: static; max-width: 480px; } }

/* Hero — now two-column with media slot on the right */
.mdd-spoke__hero-grid {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 48px;
	align-items: center;
}
@media (max-width: 960px) { .mdd-spoke__hero-grid { grid-template-columns: 1fr; gap: 28px; } }
.mdd-spoke__hero-media { width: 100%; }
@media (max-width: 960px) { .mdd-spoke__hero-media { max-width: 520px; } }

/* Scope module — numbered cards with rich descriptions */
.mdd-scope-module { padding: 64px 0; background: #fafbfb; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-scope-module__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 12px; max-width: 720px; }
.mdd-scope-module__lede {
	font-size: 16px;
	color: var(--mdd-muted, #5b6471);
	max-width: 720px;
	margin: 0 0 32px;
	line-height: 1.55;
}
.mdd-scope-module__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
}
@media (max-width: 760px) { .mdd-scope-module__list { grid-template-columns: 1fr; } }
.mdd-scope-module__item {
	display: grid;
	grid-template-columns: 60px 1fr;
	gap: 18px;
	padding: 28px 26px;
	background: #fff;
	border: 1px solid var(--mdd-border, #e0e3e8);
	border-radius: 10px;
}
.mdd-scope-module__num {
	font-size: 22px;
	font-weight: 800;
	color: #d4a017;
	line-height: 1;
	letter-spacing: -0.02em;
}
.mdd-scope-module__title {
	font-size: 17px;
	font-weight: 700;
	margin: 0 0 8px;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-scope-module__desc {
	font-size: 14px;
	color: var(--mdd-muted, #5b6471);
	line-height: 1.6;
}

/* Deliver module — checklist of what we actually do on the job */
.mdd-deliver-module { padding: 64px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-deliver-module__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 12px; max-width: 720px; }
.mdd-deliver-module__lede {
	font-size: 16px;
	color: var(--mdd-muted, #5b6471);
	max-width: 720px;
	margin: 0 0 32px;
	line-height: 1.55;
}
.mdd-deliver-module__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
}
@media (max-width: 760px) { .mdd-deliver-module__list { grid-template-columns: 1fr; } }
.mdd-deliver-module__item {
	display: grid;
	grid-template-columns: 50px 1fr;
	gap: 14px;
	padding: 18px 20px;
	background: #f6f8f6;
	border-radius: 8px;
}
.mdd-deliver-module__num {
	font-size: 18px;
	font-weight: 800;
	color: #d4a017;
	line-height: 1.1;
}
.mdd-deliver-module__title {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 4px;
	color: var(--mdd-ink, #0b3d2e);
	line-height: 1.35;
}
.mdd-deliver-module__desc {
	font-size: 13px;
	color: var(--mdd-muted, #5b6471);
	line-height: 1.55;
}

/* Process module */
.mdd-process-module { padding: 64px 0; background: var(--mdd-ink, #0b3d2e); color: #fff; }
.mdd-process-module .mdd-section-code { color: #d4a017; }
.mdd-process-module__heading {
	font-size: clamp(26px, 3.4vw, 40px);
	color: #fff;
	margin: 0 0 40px;
	max-width: 720px;
}
.mdd-process-module__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 28px;
}
.mdd-process-module__step { padding: 0 4px; }
.mdd-process-module__num {
	font-size: 28px;
	font-weight: 800;
	color: #d4a017;
	margin-bottom: 8px;
	line-height: 1;
}
.mdd-process-module__step h4 {
	font-size: 17px;
	margin: 0 0 8px;
	color: #fff;
}
.mdd-process-module__step p {
	font-size: 14px;
	margin: 0;
	color: rgba(255,255,255,.85);
	line-height: 1.55;
}

/* Brands block */
.mdd-brands-block { padding: 56px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-brands-block__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 8px; }
.mdd-brands-block__lede {
	font-size: 16px;
	max-width: 640px;
	margin: 0 0 32px;
	color: var(--mdd-muted, #5b6471);
}
.mdd-brands-block__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 20px;
}
.mdd-brands-block__cell {
	padding: 20px 22px;
	background: #f6f8f6;
	border-radius: 10px;
	border: 1px solid transparent;
	transition: border-color .15s;
}
.mdd-brands-block__cell:hover { border-color: #d4a017; }
.mdd-brands-block__name {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 6px;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-brands-block__note {
	font-size: 13px;
	color: var(--mdd-muted, #5b6471);
	margin: 0;
	line-height: 1.5;
}

/* NC climate context */
.mdd-nc-context { padding: 64px 0; background: #fafbfb; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-nc-context__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 32px; max-width: 720px; }
.mdd-nc-context__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 36px;
}
@media (max-width: 780px) { .mdd-nc-context__grid { grid-template-columns: 1fr; gap: 28px; } }
.mdd-nc-context__grid h3 {
	font-size: 17px;
	font-weight: 700;
	margin: 0 0 10px;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-nc-context__grid p {
	font-size: 15px;
	line-height: 1.65;
	margin: 0;
	color: var(--mdd-ink, #1a1a1a);
}

/* Local hook + recent job */
.mdd-local-hook, .mdd-recent-job { padding: 48px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-local-hook__heading, .mdd-recent-job__heading { font-size: clamp(22px, 2.6vw, 30px); margin: 0 0 16px; max-width: 720px; }
.mdd-local-hook__body, .mdd-recent-job__body { font-size: 17px; line-height: 1.65; max-width: 760px; margin: 0; color: var(--mdd-ink, #1a1a1a); }

/* Final CTA */
.mdd-final-cta { padding: 72px 0; background: linear-gradient(180deg, #f6f8f6, #fff); text-align: center; }
.mdd-final-cta__heading { font-size: clamp(28px, 3.6vw, 42px); margin: 0 0 16px; }
.mdd-final-cta__body { font-size: 17px; max-width: 580px; margin: 0 auto 24px; color: var(--mdd-muted, #5b6471); }
.mdd-final-cta__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Image slots — placeholder + real-image rendering */
.mdd-image-slot {
	width: 100%;
	position: relative;
	overflow: hidden;
	border-radius: 12px;
	background: #f0f3f0;
}
.mdd-image-slot.is-placeholder {
	background: repeating-linear-gradient(
		135deg,
		#f0f3f0,
		#f0f3f0 20px,
		#e9ede9 20px,
		#e9ede9 40px
	);
	border: 2px dashed rgba(11, 61, 46, .25);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	color: rgba(11, 61, 46, .65);
}
.mdd-image-slot.has-image { border: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-image-slot__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.mdd-image-slot__placeholder {
	padding: 24px;
	max-width: 260px;
}
.mdd-image-slot__icon {
	margin-bottom: 12px;
	opacity: .55;
	display: inline-flex;
}
.mdd-image-slot__icon svg { color: inherit; }
.mdd-image-slot__label {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--mdd-ink, #0b3d2e);
	margin-bottom: 6px;
}
.mdd-image-slot__sublabel {
	font-size: 12px;
	line-height: 1.5;
	color: rgba(11, 61, 46, .6);
	font-style: italic;
}

/* Before/after pair */
.mdd-before-after-section { padding: 64px 0; background: #fafbfb; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-before-after-section__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 12px; max-width: 720px; }
.mdd-before-after-section__lede {
	font-size: 16px;
	color: var(--mdd-muted, #5b6471);
	max-width: 720px;
	margin: 0 0 32px;
	line-height: 1.55;
}
.mdd-before-after {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	align-items: stretch;
}
@media (max-width: 760px) { .mdd-before-after { grid-template-columns: 1fr; } }
.mdd-image-slot--before .mdd-image-slot__label::before { content: 'Before — '; color: rgba(212, 160, 23, 1); }
.mdd-image-slot--after .mdd-image-slot__label::before { content: 'After — '; color: rgba(11, 61, 46, 1); }

/* Cities-served grid on service hub */
.mdd-cities-served { padding: 64px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-cities-served__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 12px; max-width: 720px; }
.mdd-cities-served__lede {
	font-size: 16px;
	color: var(--mdd-muted, #5b6471);
	max-width: 720px;
	margin: 0 0 32px;
	line-height: 1.55;
}

/* City hub sections — sit on top of the existing trust band + card grid styles */
.mdd-city-services, .mdd-neighborhoods, .mdd-fleet-teaser { padding: 64px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-neighborhoods { background: #fafbfb; }
.mdd-fleet-teaser { background: #fafbfb; }

/* Fleet hub specific bands */
.mdd-industries, .mdd-pricing-band, .mdd-compliance, .mdd-ltv-band { padding: 56px 0; background: #fff; border-bottom: 1px solid var(--mdd-border, #e0e3e8); }
.mdd-pricing-band { background: #fafbfb; }
.mdd-ltv-band { background: linear-gradient(180deg, #f0f4f1, #fff); }
.mdd-industries__heading, .mdd-pricing-band__heading, .mdd-compliance__heading, .mdd-ltv-band__heading { font-size: clamp(22px, 2.8vw, 32px); margin: 0 0 20px; max-width: 720px; }
.mdd-pricing-band__body, .mdd-compliance__body { font-size: 16px; line-height: 1.65; max-width: 820px; color: var(--mdd-ink, #1a1a1a); }
.mdd-pricing-band__body p, .mdd-compliance__body p { margin: 0 0 14px; }
.mdd-ltv-band__body { font-size: 17px; line-height: 1.6; max-width: 820px; margin: 0 0 20px; }
.mdd-city-services__heading, .mdd-neighborhoods__heading, .mdd-fleet-teaser__heading { font-size: clamp(24px, 3vw, 36px); margin: 0 0 12px; max-width: 720px; }
.mdd-city-services__lede, .mdd-neighborhoods__lede, .mdd-fleet-teaser__lede {
	font-size: 16px;
	color: var(--mdd-muted, #5b6471);
	max-width: 720px;
	margin: 0 0 32px;
	line-height: 1.55;
}

/* =====================================================================
   4. Header + nav
   ===================================================================== */
.mdd-site-header {
	background: var(--mdd-surface);
	border-bottom: 1px solid var(--mdd-line, #e2e8f0);
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: saturate(180%) blur(8px);
	background: rgba(255, 255, 255, 0.92);
}

.mdd-site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 16px;
	padding-bottom: 16px;
	gap: 24px;
}

.mdd-header-phone {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--mdd-doctor);
	color: #fff;
	padding: 10px 16px;
	border-radius: 8px;
	text-decoration: none;
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
}
.mdd-header-phone:hover {
	background: #053e2f;
	color: #fff;
}

.mdd-footer__top {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr;
	gap: 32px;
	margin-bottom: 32px;
}
.mdd-footer__nap p {
	margin: 0 0 6px;
	font-size: 14px;
	color: #cbd5e1;
}
.mdd-footer__nap strong {
	color: #fff;
}
.mdd-footer__col h4 {
	color: #fff;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 12px;
}
.mdd-footer__col ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.mdd-footer__col li { margin-bottom: 6px; }
.mdd-footer__col a {
	color: #cbd5e1;
	text-decoration: none;
	font-size: 14px;
}
.mdd-footer__col a:hover {
	color: #fff;
	text-decoration: underline;
}
.mdd-footer__legal {
	display: flex;
	gap: 18px;
	list-style: none;
	padding: 0;
	margin: 0 0 16px;
	flex-wrap: wrap;
	font-size: 13px;
}
@media (max-width: 980px) {
	.mdd-footer__top { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 720px) {
	.mdd-footer__top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
	.mdd-footer__top { grid-template-columns: 1fr; }
}

.mdd-brand__name {
	font-family: 'Inter Tight', 'Inter', sans-serif;
	font-weight: 800;
	font-size: 18px;
	letter-spacing: -0.02em;
	color: var(--mdd-ink);
	text-decoration: none;
}
.mdd-brand__name:hover { color: var(--mdd-doctor); }

.mdd-nav__list {
	display: flex;
	gap: 24px;
	list-style: none;
	padding: 0;
	margin: 0;
	flex-wrap: wrap;
}
.mdd-nav__list a {
	color: var(--mdd-ink-soft, #334155);
	text-decoration: none;
	font-weight: 500;
	font-size: 15px;
}
.mdd-nav__list a:hover {
	color: var(--mdd-doctor);
}

/* =====================================================================
   5. Main + section rhythm
   ===================================================================== */
.mdd-main { display: block; }

.mdd-section {
	padding: 48px 0;
	border-bottom: 1px solid var(--mdd-line);
}
.mdd-section:last-child { border-bottom: 0; }

.mdd-section--counter,
.mdd-section--when-not {
	background: #fef2f2;
}

.mdd-section--recovery {
	background: var(--mdd-surface-tint, #f8fafc);
}

.mdd-section--faq {
	background: var(--mdd-surface-tint);
}

/* =====================================================================
   6. Hero (homepage + spoke headers)
   ===================================================================== */
.mdd-hero,
.mdd-spoke__header,
.mdd-city__header,
.mdd-archive {
	background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
	padding: 80px 0 56px;
	border-bottom: 1px solid var(--mdd-line);
}

.mdd-hero h1,
.mdd-spoke__header h1,
.mdd-city__header h1,
.mdd-archive h1 {
	margin-bottom: 16px;
}

.mdd-hero__lede,
.mdd-spoke__lede,
.mdd-city__lede {
	font-size: 1.25rem;
	line-height: 1.55;
	color: var(--mdd-ink-soft);
	max-width: 720px;
	margin: 0 0 24px;
}

.mdd-spoke__answer {
	font-weight: 500;
	border-left: 3px solid var(--mdd-doctor);
	padding-left: 20px;
}

.mdd-spoke__parent {
	font-size: 14px;
	color: var(--mdd-ink-mute, #64748b);
	margin: 0;
}

.mdd-pricerange,
.mdd-duration {
	display: inline-block;
	background: var(--mdd-primary);
	color: #fff;
	font-weight: 600;
	font-size: 14px;
	padding: 6px 14px;
	border-radius: 100px;
	margin: 0 12px 16px 0;
}
.mdd-duration {
	background: var(--mdd-surface);
	color: var(--mdd-ink-soft);
	border: 1px solid var(--mdd-line);
}

/* =====================================================================
   7. Card grid
   ===================================================================== */
.mdd-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 16px;
	list-style: none;
	padding: 0;
	margin: 24px 0 0;
}

.mdd-card {
	display: block;
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 12px;
	padding: 22px 24px;
	text-decoration: none;
	color: var(--mdd-ink);
	transition: border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease;
	height: 100%;
}
.mdd-card:hover {
	border-color: var(--mdd-doctor);
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
	color: var(--mdd-ink);
}

.mdd-card h2,
.mdd-card h3 {
	font-size: 1.125rem;
	margin: 0 0 8px;
}

.mdd-card p {
	font-size: 14.5px;
	color: var(--mdd-ink-soft);
	margin: 0;
	line-height: 1.55;
}

/* =====================================================================
   8. Injection blocks (the 5 data injections on city-variant pages)
   ===================================================================== */
.mdd-injection {
	padding: 40px 0;
	border-bottom: 1px solid var(--mdd-line);
	background: #fffbeb;
}

.mdd-injection h2 {
	font-size: 1.375rem;
	color: var(--mdd-warn, #b45309);
	margin-bottom: 12px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.mdd-injection h2::before {
	content: '';
	display: inline-block;
	width: 24px;
	height: 3px;
	background: var(--mdd-warn);
	border-radius: 2px;
}

.mdd-injection p, .mdd-injection ul, .mdd-injection ol {
	color: var(--mdd-ink-soft);
	max-width: 740px;
}

.mdd-injection ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 4px 24px;
}

/* =====================================================================
   9. FAQ accordion (native <details>)
   ===================================================================== */
.mdd-faq {
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 8px;
	margin-bottom: 12px;
	padding: 0;
	overflow: hidden;
}
.mdd-faq summary {
	cursor: pointer;
	padding: 18px 22px;
	font-weight: 600;
	font-size: 17px;
	color: var(--mdd-ink);
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	user-select: none;
}
.mdd-faq summary::-webkit-details-marker { display: none; }
.mdd-faq summary::after {
	content: '+';
	display: inline-block;
	color: var(--mdd-doctor);
	font-weight: 700;
	font-size: 22px;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	text-align: center;
	line-height: 22px;
}
.mdd-faq[open] summary::after { content: '−'; }

.mdd-faq__answer {
	padding: 0 22px 22px;
	color: var(--mdd-ink-soft);
	line-height: 1.65;
}

/* =====================================================================
   10. Buttons / CTAs
   ===================================================================== */
.mdd-btn {
	display: inline-block;
	background: var(--mdd-doctor);
	color: #fff;
	padding: 14px 24px;
	border-radius: 8px;
	font-weight: 700;
	text-decoration: none;
	border: 0;
	transition: background-color 120ms ease, transform 120ms ease;
	font-size: 16px;
	line-height: 1.2;
}
.mdd-btn:hover {
	background: #053e2f;
	color: #fff;
	transform: translateY(-1px);
}

.mdd-btn--outline {
	background: transparent;
	color: var(--mdd-doctor);
	border: 1.5px solid var(--mdd-doctor);
}
.mdd-btn--outline:hover {
	background: var(--mdd-doctor);
	color: #fff;
}

/* =====================================================================
   11. City list
   ===================================================================== */
.mdd-city-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 8px 16px;
	list-style: none;
	padding: 0;
	margin: 16px 0 0;
}
.mdd-city-list a {
	display: block;
	padding: 8px 12px;
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 6px;
	text-decoration: none;
	color: var(--mdd-ink-soft);
	font-weight: 500;
	font-size: 14.5px;
	transition: border-color 120ms ease;
}
.mdd-city-list a:hover {
	border-color: var(--mdd-doctor);
	color: var(--mdd-doctor);
}

/* =====================================================================
   12. Footer
   ===================================================================== */
.mdd-site-footer {
	background: var(--mdd-ink);
	color: #cbd5e1;
	padding: 56px 0 32px;
	margin-top: 80px;
}
.mdd-site-footer a {
	color: #e2e8f0;
	text-decoration: none;
}
.mdd-site-footer a:hover {
	color: #fff;
	text-decoration: underline;
}

.mdd-footer__brand {
	margin-bottom: 32px;
}
.mdd-footer__name {
	color: #fff;
	font-family: 'Inter Tight', sans-serif;
	font-weight: 800;
	font-size: 22px;
	letter-spacing: -0.02em;
	margin: 0 0 4px;
}
.mdd-footer__tagline {
	color: #94a3b8;
	margin: 0;
	font-size: 15px;
}

.mdd-footer__list {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
	margin: 0 0 32px;
}

.mdd-footer__copy {
	font-size: 13px;
	color: #94a3b8;
	margin: 0;
	padding-top: 24px;
	border-top: 1px solid #1e293b;
}

/* =====================================================================
   13. 404
   ===================================================================== */
.mdd-404 {
	padding: 120px 0;
	text-align: center;
}
.mdd-404 h1 {
	font-size: 4rem;
	margin-bottom: 16px;
}
.mdd-404 p { max-width: 480px; margin: 0 auto 24px; color: var(--mdd-ink-soft); }

/* =====================================================================
   13.3 Homepage process steps
   ===================================================================== */
.mdd-process {
	list-style: none;
	padding: 0;
	margin: 24px 0 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	counter-reset: process;
}
.mdd-process li {
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 12px;
	padding: 24px;
	position: relative;
	counter-increment: process;
}
.mdd-process li::before {
	content: counter(process, decimal-leading-zero);
	position: absolute;
	top: 18px;
	right: 22px;
	font-family: 'Inter Tight', sans-serif;
	font-size: 36px;
	font-weight: 800;
	color: var(--mdd-doctor);
	opacity: 0.18;
	line-height: 1;
}
.mdd-process h3 {
	font-size: 1.125rem;
	margin: 0 0 8px;
	padding-right: 36px;
}
.mdd-process p {
	font-size: 14.5px;
	color: var(--mdd-ink-soft);
	margin: 0;
}

.mdd-section--intro {
	background: var(--mdd-surface);
}
.mdd-section--intro p {
	font-size: 1.05rem;
	max-width: 760px;
	color: var(--mdd-ink-soft);
}

.mdd-section--values .mdd-card {
	border-left: 3px solid var(--mdd-doctor);
}

/* =====================================================================
   13.28 Gallery
   ===================================================================== */
.mdd-ba-pair {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.mdd-ba {
	margin: 0;
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 10px;
	overflow: hidden;
}
.mdd-ba img {
	width: 100%;
	height: auto;
	display: block;
}
.mdd-ba figcaption {
	padding: 10px 14px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--mdd-ink-mute);
	background: var(--mdd-surface-tint);
	border-top: 1px solid var(--mdd-line);
}
.mdd-gallery-card { padding: 0; overflow: hidden; }
.mdd-gallery-card__photo { aspect-ratio: 4/3; overflow: hidden; background: var(--mdd-surface-tint); }
.mdd-gallery-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.mdd-gallery-card h2,
.mdd-gallery-card p { padding: 0 18px; }
.mdd-gallery-card h2 { padding-top: 14px; }
.mdd-gallery-card p { padding-bottom: 16px; }
.mdd-gallery-entry__vehicle {
	display: inline-block;
	background: var(--mdd-primary);
	color: #fff;
	padding: 6px 14px;
	border-radius: 100px;
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 16px;
}
@media (max-width: 720px) {
	.mdd-ba-pair { grid-template-columns: 1fr; }
}

/* =====================================================================
   13.29 Reviews
   ===================================================================== */
.mdd-review-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 16px;
}
.mdd-review {
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 10px;
	padding: 22px 24px;
}
.mdd-review__stars { font-size: 20px; margin-bottom: 12px; }
.mdd-review__star { color: #cbd5e1; }
.mdd-review__star--filled { color: #f59e0b; }
.mdd-review__body {
	margin: 0 0 12px;
	color: var(--mdd-ink-soft);
	font-size: 15px;
	line-height: 1.55;
}
.mdd-review__meta {
	margin: 0;
	font-size: 13px;
	color: var(--mdd-ink-mute);
}

/* =====================================================================
   13.27 Press strip
   ===================================================================== */
.mdd-press-strip {
	list-style: none;
	padding: 0;
	margin: 24px 0 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
}
.mdd-press-strip a {
	display: block;
	padding: 18px 20px;
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 8px;
	text-decoration: none;
	transition: border-color 120ms ease;
}
.mdd-press-strip a:hover { border-color: var(--mdd-doctor); }
.mdd-press-strip__outlet {
	display: block;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--mdd-doctor);
	font-weight: 700;
	margin-bottom: 6px;
}
.mdd-press-strip__title {
	display: block;
	color: var(--mdd-ink);
	font-weight: 600;
	font-size: 14.5px;
	line-height: 1.4;
}

/* =====================================================================
   13.30 Search
   ===================================================================== */
.mdd-search-form {
	display: flex;
	gap: 12px;
	margin-top: 16px;
}
.mdd-search-form input[type="search"] {
	flex: 1;
	padding: 12px 16px;
	font: inherit;
	border: 1px solid var(--mdd-line);
	border-radius: 8px;
	background: #fff;
}
.mdd-search-results {
	list-style: none;
	padding: 0;
	margin: 16px 0 32px;
}
.mdd-search-results li {
	border-bottom: 1px solid var(--mdd-line);
	padding: 14px 0;
}
.mdd-search-results a {
	display: block;
	text-decoration: none;
	color: var(--mdd-ink);
}
.mdd-search-results h3 {
	margin: 0 0 4px;
	font-size: 1.05rem;
	color: var(--mdd-primary);
}
.mdd-search-results a:hover h3 { text-decoration: underline; }
.mdd-search-results p {
	margin: 0;
	font-size: 14px;
	color: var(--mdd-ink-soft);
}

/* =====================================================================
   13.31 Ceramic compatibility lookup
   ===================================================================== */
.mdd-compat-search {
	width: 100%;
	padding: 16px 18px;
	font: inherit;
	font-size: 18px;
	border: 2px solid var(--mdd-line);
	border-radius: 10px;
	background: var(--mdd-surface);
	transition: border-color 120ms ease;
}
.mdd-compat-search:focus {
	outline: none;
	border-color: var(--mdd-doctor);
}
.mdd-compat-results {
	display: grid;
	gap: 16px;
	margin: 24px 0 12px;
}
.mdd-compat-card {
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 10px;
	padding: 22px 24px;
}
.mdd-compat-card h3 {
	margin: 0 0 14px;
	font-size: 1.125rem;
}
.mdd-compat-card h3 span {
	font-size: 14px;
	font-weight: 500;
	color: var(--mdd-ink-mute);
	margin-left: 6px;
}
.mdd-compat-card dl {
	margin: 0;
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 8px 18px;
	font-size: 14px;
}
.mdd-compat-card dt {
	color: var(--mdd-ink-mute);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding-top: 2px;
}
.mdd-compat-card dd {
	margin: 0;
	color: var(--mdd-ink-soft);
}
.mdd-compat-empty {
	color: var(--mdd-ink-mute);
	padding: 24px 0;
	text-align: center;
}
.mdd-compat-count {
	color: var(--mdd-ink-mute);
	font-size: 13px;
	margin: 0;
}
@media (max-width: 720px) {
	.mdd-compat-card dl { grid-template-columns: 1fr; gap: 4px; }
	.mdd-compat-card dd { margin-bottom: 8px; }
}

/* =====================================================================
   13.32 Quiz
   ===================================================================== */
.mdd-quiz__progress {
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--mdd-ink-mute);
	font-weight: 700;
	margin-bottom: 8px;
}
.mdd-quiz__step h2 {
	margin-top: 0;
	margin-bottom: 18px;
}
.mdd-quiz__choices {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}
.mdd-quiz__choices button {
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 10px;
	padding: 18px 20px;
	font: inherit;
	color: var(--mdd-ink);
	text-align: left;
	cursor: pointer;
	font-weight: 500;
	transition: border-color 120ms ease, transform 120ms ease;
}
.mdd-quiz__choices button:hover {
	border-color: var(--mdd-doctor);
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(15,23,42,0.06);
}
.mdd-quiz__result {
	background: var(--mdd-doctor);
	color: #fff;
	padding: 28px 32px;
	border-radius: 12px;
}
.mdd-quiz__result h2 { color: #fff; margin: 0 0 14px; }
.mdd-quiz__result h3 { color: rgba(255,255,255,0.9); margin: 18px 0 10px; font-size: 16px; text-transform: uppercase; letter-spacing: 0.06em; }
.mdd-quiz__health {
	font-size: 18px;
	margin: 0 0 14px;
	color: rgba(255,255,255,0.92);
}
.mdd-quiz__plan ul {
	padding-left: 20px;
	margin: 0 0 14px;
}
.mdd-quiz__reasoning {
	font-size: 14px;
	color: rgba(255,255,255,0.82);
	border-top: 1px solid rgba(255,255,255,0.2);
	padding-top: 14px;
	margin-top: 18px;
}
@media (max-width: 720px) {
	.mdd-quiz__choices { grid-template-columns: 1fr; }
}

/* =====================================================================
   13.33 ROI calculator
   ===================================================================== */
.mdd-roi-form .mdd-form__grid { background: var(--mdd-surface-tint); padding: 24px; border-radius: 12px; }
.mdd-roi-form .mdd-form__field input {
	background: #fff;
	border: 1px solid var(--mdd-line);
	padding: 10px 12px;
	border-radius: 6px;
	font: inherit;
}
.mdd-roi-card {
	background: var(--mdd-doctor);
	color: #fff;
	padding: 32px 32px 28px;
	border-radius: 12px;
}
.mdd-roi-card h2 { color: #fff; margin: 0 0 18px; }
.mdd-roi-numbers {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 18px;
}
.mdd-roi-numbers > div {
	background: rgba(255,255,255,0.08);
	padding: 16px;
	border-radius: 8px;
}
.mdd-roi-numbers .mdd-roi-highlight {
	background: rgba(255,255,255,0.18);
	border: 1px solid rgba(255,255,255,0.32);
}
.mdd-roi-label {
	display: block;
	font-size: 12px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.82);
	margin-bottom: 6px;
}
.mdd-roi-value {
	display: block;
	font-size: 26px;
	font-weight: 800;
	font-family: 'Inter Tight', sans-serif;
}

/* =====================================================================
   13.34 Compare table
   ===================================================================== */
.mdd-compare-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14.5px;
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 8px;
	overflow: hidden;
}
.mdd-compare-table th,
.mdd-compare-table td {
	padding: 12px 16px;
	border-bottom: 1px solid var(--mdd-line);
	border-right: 1px solid var(--mdd-line);
	vertical-align: top;
	text-align: left;
}
.mdd-compare-table th:last-child,
.mdd-compare-table td:last-child { border-right: 0; }
.mdd-compare-table thead th {
	background: var(--mdd-doctor);
	color: #fff;
	font-weight: 700;
	font-size: 13.5px;
	letter-spacing: 0.01em;
	border-right-color: rgba(255, 255, 255, 0.15);
}
.mdd-compare-table tbody td:first-child {
	background: var(--mdd-surface-tint);
	font-weight: 600;
	color: var(--mdd-ink);
	width: 160px;
}

/* =====================================================================
   13.35 Breadcrumbs
   ===================================================================== */
.mdd-breadcrumbs {
	background: var(--mdd-surface-tint);
	border-bottom: 1px solid var(--mdd-line);
	font-size: 13px;
}
.mdd-breadcrumbs .mdd-container {
	padding-top: 10px;
	padding-bottom: 10px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}
.mdd-breadcrumbs a {
	color: var(--mdd-ink-mute);
	text-decoration: none;
	transition: color 120ms ease;
}
.mdd-breadcrumbs a:hover { color: var(--mdd-doctor); }
.mdd-breadcrumbs__sep {
	color: var(--mdd-ink-mute);
	opacity: 0.5;
}
.mdd-breadcrumbs [aria-current="page"] {
	color: var(--mdd-ink);
	font-weight: 600;
}

/* =====================================================================
   13.355 Detailer byline + team
   ===================================================================== */
.mdd-byline {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 18px 0;
	padding: 12px 16px;
	background: var(--mdd-surface);
	border-left: 3px solid var(--mdd-doctor);
	border-radius: 4px;
	font-size: 14px;
}
.mdd-byline__photo { flex-shrink: 0; }
.mdd-byline__img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}
.mdd-byline__line { margin: 0; color: var(--mdd-ink); }
.mdd-byline__label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--mdd-ink-mute);
	margin-right: 6px;
}
.mdd-byline__sub {
	margin: 2px 0 0;
	font-size: 13px;
	color: var(--mdd-ink-mute);
}

.mdd-detailer__header {
	display: flex;
	align-items: center;
	gap: 28px;
}
.mdd-detailer__photo { flex-shrink: 0; }
.mdd-detailer__img {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	object-fit: cover;
	border: 4px solid var(--mdd-doctor);
}
.mdd-detailer__role {
	font-size: 1rem;
	color: var(--mdd-doctor);
	font-weight: 600;
	margin: 4px 0;
}
.mdd-detailer__years {
	font-size: 14.5px;
	color: var(--mdd-ink-mute);
	margin: 0;
}
.mdd-detailer__quote {
	border-left: 4px solid var(--mdd-doctor);
	padding-left: 18px;
	font-size: 1.2rem;
	font-style: italic;
	margin: 0;
	color: var(--mdd-ink-soft);
}

.mdd-team-card { text-align: center; padding: 26px 22px; }
.mdd-team-card__photo {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	overflow: hidden;
	margin: 0 auto 14px;
	background: var(--mdd-surface-tint);
}
.mdd-team-card__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.mdd-team-card__role {
	color: var(--mdd-doctor);
	font-weight: 600;
	font-size: 14px;
	margin: 2px 0 4px;
}
.mdd-team-card__years {
	color: var(--mdd-ink-mute);
	font-size: 13px;
	margin: 0;
}

@media (max-width: 720px) {
	.mdd-detailer__header { flex-direction: column; text-align: center; }
}

/* =====================================================================
   13.36 Trust block
   ===================================================================== */
.mdd-trust-block {
	display: flex;
	flex-wrap: wrap;
	gap: 14px 26px;
	margin: 18px 0;
	padding: 14px 18px;
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 8px;
	font-size: 14px;
	color: var(--mdd-ink-soft);
}
.mdd-trust-block__item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.mdd-trust-block__icon {
	font-size: 16px;
	line-height: 1;
}

/* =====================================================================
   13.37 Sticky mobile CTA
   ===================================================================== */
.mdd-sticky-cta { display: none; }

@media (max-width: 720px) {
	.mdd-sticky-cta {
		display: grid;
		grid-template-columns: 1fr 1fr;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 60;
		background: var(--mdd-surface);
		border-top: 1px solid var(--mdd-line);
		box-shadow: 0 -8px 20px rgba(15,23,42,0.06);
	}
	.mdd-sticky-cta__btn {
		padding: 14px 16px;
		text-decoration: none;
		font-weight: 700;
		text-align: center;
		font-size: 15px;
		transition: background-color 120ms ease;
	}
	.mdd-sticky-cta__btn--call {
		background: var(--mdd-doctor);
		color: #fff;
	}
	.mdd-sticky-cta__btn--call:hover { background: #053e2f; color: #fff; }
	.mdd-sticky-cta__btn--quote {
		background: var(--mdd-surface);
		color: var(--mdd-ink);
	}
	body.mdd-has-sticky {
		padding-bottom: 64px;
	}
}

/* =====================================================================
   13.4 Contact page
   ===================================================================== */
.mdd-contact-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 24px;
	margin-top: 16px;
}
.mdd-contact-block {
	background: var(--mdd-surface);
	border: 1px solid var(--mdd-line);
	border-radius: 12px;
	padding: 22px 24px;
}
.mdd-contact-block h2 {
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--mdd-ink-mute);
	margin-bottom: 8px;
}
.mdd-contact-link {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--mdd-doctor);
	text-decoration: none;
}
.mdd-contact-link:hover { text-decoration: underline; }
.mdd-contact-note {
	font-size: 13.5px;
	color: var(--mdd-ink-mute);
	margin: 6px 0 0;
}

/* =====================================================================
   13.5 Lead form
   ===================================================================== */
.mdd-lead-form {
	background: var(--mdd-doctor);
	color: #fff;
	padding: 64px 0;
}
.mdd-lead-form h2 {
	color: #fff;
	margin-bottom: 24px;
}
.mdd-lead-form .mdd-trust-block {
	background: rgba(255, 255, 255, 0.10);
	border-color: rgba(255, 255, 255, 0.20);
	color: rgba(255, 255, 255, 0.92);
	margin-bottom: 24px;
}
.mdd-lead-form__ok {
	background: rgba(255, 255, 255, 0.12);
	border-left: 3px solid #fff;
	padding: 14px 18px;
	border-radius: 6px;
	margin-bottom: 24px;
	font-weight: 500;
}
.mdd-lead-form__err {
	background: rgba(185, 28, 28, 0.18);
	border-left: 3px solid #fca5a5;
	padding: 14px 18px;
	border-radius: 6px;
	margin-bottom: 24px;
	font-weight: 500;
}

.mdd-form__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
	max-width: 720px;
}
.mdd-form__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.mdd-form__field--full { grid-column: 1 / -1; }

.mdd-form__field span {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: rgba(255, 255, 255, 0.85);
}
.mdd-form__field input,
.mdd-form__field select,
.mdd-form__field textarea {
	background: rgba(255, 255, 255, 0.95);
	border: 0;
	padding: 12px 14px;
	border-radius: 6px;
	font: inherit;
	color: var(--mdd-ink);
	width: 100%;
}
.mdd-form__field input:focus,
.mdd-form__field select:focus,
.mdd-form__field textarea:focus {
	outline: 2px solid #fff;
	outline-offset: 1px;
	background: #fff;
}

.mdd-form__submit {
	margin-top: 24px;
	display: flex;
	gap: 18px;
	align-items: center;
	flex-wrap: wrap;
}
.mdd-form__submit .mdd-btn {
	background: #fff;
	color: var(--mdd-doctor);
}
.mdd-form__submit .mdd-btn:hover {
	background: #f8fafc;
}
.mdd-form__note {
	font-size: 13.5px;
	color: rgba(255, 255, 255, 0.85);
}

@media (max-width: 720px) {
	.mdd-form__grid { grid-template-columns: 1fr; }
}

/* =====================================================================
   14. Responsive breakpoints
   ===================================================================== */
@media (max-width: 720px) {
	.mdd-site-header .mdd-container {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}
	.mdd-nav__list {
		gap: 16px;
		font-size: 14px;
	}
	.mdd-hero,
	.mdd-spoke__header,
	.mdd-city__header,
	.mdd-archive {
		padding: 48px 0 32px;
	}
	.mdd-section { padding: 32px 0; }
	.mdd-injection { padding: 28px 0; }
	body { font-size: 16px; }
}

/* =====================================================================
   15. Print
   ===================================================================== */
@media print {
	.mdd-site-header, .mdd-site-footer, .mdd-skip { display: none; }
	.mdd-section, .mdd-injection { border: 0; padding: 16px 0; }
	a { color: var(--mdd-ink); text-decoration: underline; }
}

/* =====================================================================
   16. Before/after gallery (inc/image-gallery.php)
   ===================================================================== */
.mdd-gallery { padding: 56px 0; background: var(--mdd-bg-alt, #f6f7f9); }
.mdd-gallery__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 24px;
	gap: 16px;
	flex-wrap: wrap;
}
.mdd-gallery__heading { margin: 0; font-size: clamp(22px, 2.4vw, 30px); font-weight: 800; }
.mdd-gallery__nav { display: flex; gap: 8px; }
.mdd-gallery__btn {
	width: 44px;
	height: 44px;
	border-radius: 999px;
	border: 1px solid var(--mdd-border, #d8dde3);
	background: #fff;
	cursor: pointer;
	font-size: 18px;
	color: var(--mdd-ink, #0b3d2e);
	transition: background .15s ease, transform .15s ease;
}
.mdd-gallery__btn:hover { background: var(--mdd-bg, #fff); transform: translateY(-1px); }
.mdd-gallery__btn:active { transform: translateY(0); }
.mdd-gallery__track {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	padding-bottom: 8px;
	margin-right: -16px;
	padding-right: 16px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}
.mdd-gallery__slide {
	flex: 0 0 88%;
	scroll-snap-align: start;
	margin: 0;
}
@media (min-width: 720px) {
	.mdd-gallery__slide { flex-basis: 60%; }
}
@media (min-width: 1024px) {
	.mdd-gallery__slide { flex-basis: 48%; }
}
.mdd-gallery__pair {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.mdd-gallery__half {
	position: relative;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	background: #e9ebef;
}
.mdd-gallery__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.mdd-gallery__label {
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 4px 10px;
	background: rgba(11, 61, 46, .92);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	border-radius: 999px;
	z-index: 1;
}
.mdd-gallery__half--after .mdd-gallery__label {
	background: rgba(212, 161, 23, .95);
	color: #0b3d2e;
}
.mdd-gallery__caption {
	margin-top: 10px;
	font-size: 14px;
	color: var(--mdd-muted, #5b6471);
	text-align: center;
}

/* =====================================================================
   17. Quote estimator (page-quote-estimator.php)
   ===================================================================== */
.mdd-quote-hero { padding: 56px 0 24px; background: linear-gradient(180deg, #f0f4f1 0%, #fff 100%); }
.mdd-quote-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 32px;
	align-items: start;
}
@media (max-width: 880px) {
	.mdd-quote-grid { grid-template-columns: 1fr; }
}
.mdd-quote-field { margin-bottom: 24px; }
.mdd-quote-field > label {
	display: block;
	font-weight: 700;
	margin-bottom: 8px;
	font-size: 14px;
	letter-spacing: .02em;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-quote-field select {
	width: 100%;
	padding: 12px 14px;
	font-size: 16px;
	border: 1px solid var(--mdd-border, #d8dde3);
	border-radius: 8px;
	background: #fff;
}
.mdd-quote-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.mdd-quote-pill {
	padding: 10px 16px;
	font-size: 13px;
	font-weight: 600;
	border: 1px solid var(--mdd-border, #d8dde3);
	background: #fff;
	border-radius: 999px;
	cursor: pointer;
	transition: all .15s ease;
}
.mdd-quote-pill:hover { border-color: var(--mdd-ink, #0b3d2e); }
.mdd-quote-pill.is-active {
	background: var(--mdd-ink, #0b3d2e);
	color: #fff;
	border-color: var(--mdd-ink, #0b3d2e);
}
.mdd-quote-addons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.mdd-quote-addons label {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	border: 1px solid var(--mdd-border, #d8dde3);
	border-radius: 8px;
	font-size: 14px;
	cursor: pointer;
	background: #fff;
}
.mdd-quote-addons label:has(input:checked) {
	background: #f0f4f1;
	border-color: var(--mdd-ink, #0b3d2e);
}
.mdd-quote-result { position: sticky; top: 24px; }
.mdd-quote-card {
	padding: 28px;
	border-radius: 12px;
	background: var(--mdd-ink, #0b3d2e);
	color: #fff;
	box-shadow: 0 4px 24px rgba(11,61,46,.15);
}
.mdd-quote-card__label {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .1em;
	opacity: .8;
	margin: 0 0 8px;
}
.mdd-quote-card__value {
	font-size: 38px;
	font-weight: 800;
	margin: 0 0 8px;
	line-height: 1;
}
.mdd-quote-card__note {
	margin: 0 0 24px;
	font-size: 14px;
	opacity: .85;
	line-height: 1.5;
}
.mdd-quote-card .mdd-btn {
	width: 100%;
	text-align: center;
	background: #d4a017;
	color: #0b3d2e;
}
.mdd-quote-trust {
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	color: var(--mdd-muted, #5b6471);
}
.mdd-quote-trust li {
	padding: 6px 0;
	padding-left: 22px;
	position: relative;
}
.mdd-quote-trust li::before {
	content: '✓';
	position: absolute;
	left: 0;
	color: var(--mdd-ink, #0b3d2e);
	font-weight: 700;
}

/* =====================================================================
   18. Partner grid (inc/cpt-partner.php render fn)
   ===================================================================== */
.mdd-partner-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 20px;
	margin: 24px 0;
}
.mdd-partner {
	padding: 20px;
	background: #fff;
	border: 1px solid var(--mdd-border, #d8dde3);
	border-radius: 10px;
	transition: transform .15s ease, box-shadow .15s ease;
}
.mdd-partner:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(0,0,0,.06);
}
.mdd-partner__logo img { max-width: 120px; height: auto; margin-bottom: 12px; }
.mdd-partner__name { margin: 0 0 6px; font-size: 17px; }
.mdd-partner__intro { margin: 0 0 12px; font-size: 14px; color: var(--mdd-muted, #5b6471); }
.mdd-partner__meta { display: flex; gap: 12px; align-items: center; font-size: 13px; }
.mdd-partner__link, .mdd-partner__phone {
	color: var(--mdd-ink, #0b3d2e);
	text-decoration: none;
	font-weight: 600;
}
.mdd-partner__link:hover, .mdd-partner__phone:hover { text-decoration: underline; }

/* =====================================================================
   19. Footer megalinks (inc/footer-megalinks.php)
   ===================================================================== */
.mdd-megalinks {
	padding: 48px 0 32px;
	background: var(--mdd-ink, #0b3d2e);
	color: rgba(255,255,255,.9);
	border-top: 1px solid rgba(255,255,255,.08);
}
.mdd-megalinks__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 36px;
}
@media (max-width: 880px) {
	.mdd-megalinks__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
	.mdd-megalinks__grid { grid-template-columns: 1fr; }
}
.mdd-megalinks__heading {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #d4a017;
	margin: 0 0 14px;
}
.mdd-megalinks__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 18px;
	font-size: 13px;
}
@media (max-width: 560px) {
	.mdd-megalinks__list { grid-template-columns: 1fr; }
}
.mdd-megalinks__list a {
	color: rgba(255,255,255,.85);
	text-decoration: none;
	transition: color .15s ease;
}
.mdd-megalinks__list a:hover {
	color: #fff;
	text-decoration: underline;
}
.mdd-megalinks__more {
	color: #d4a017 !important;
	font-weight: 600;
}

/* =====================================================================
   20. Related questions grid (inc/related-content.php)
   ===================================================================== */
.mdd-related-questions { padding: 48px 0; background: #fbfbfc; border-top: 1px solid var(--mdd-border, #d8dde3); }
.mdd-related-questions h2 { font-size: 22px; margin: 0 0 20px; }
.mdd-related-grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}
@media (max-width: 900px) { .mdd-related-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .mdd-related-grid { grid-template-columns: 1fr; } }
.mdd-related-card {
	display: block;
	padding: 18px 20px;
	background: #fff;
	border: 1px solid var(--mdd-border, #e0e3e8);
	border-radius: 10px;
	text-decoration: none;
	color: inherit;
	transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
	height: 100%;
	box-sizing: border-box;
}
.mdd-related-card:hover {
	border-color: var(--mdd-ink, #0b3d2e);
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(11,61,46,.08);
}
.mdd-related-card__title {
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 8px;
	color: var(--mdd-ink, #0b3d2e);
	line-height: 1.35;
}
.mdd-related-card__lede {
	font-size: 13px;
	color: var(--mdd-muted, #5b6471);
	margin: 0 0 12px;
	line-height: 1.5;
}
.mdd-related-card__more {
	font-size: 12px;
	font-weight: 600;
	color: #d4a017;
	letter-spacing: .03em;
}

/* Related spokes (two-column block on service_city) */
.mdd-related-spokes { padding: 40px 0; }
.mdd-related-spokes__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
}
@media (max-width: 720px) { .mdd-related-spokes__grid { grid-template-columns: 1fr; } }
.mdd-related-spokes h2 { font-size: 18px; margin: 0 0 12px; }
.mdd-related-spokes ul { padding-left: 18px; margin: 0; font-size: 14px; }
.mdd-related-spokes li { padding: 4px 0; }
.mdd-related-spokes a { color: var(--mdd-ink, #0b3d2e); text-decoration: none; }
.mdd-related-spokes a:hover { text-decoration: underline; }

/* =====================================================================
   21. City hub (single-mdd_city.php) + Trust band + Reviews block
   ===================================================================== */
.mdd-eyebrow {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #d4a017;
	margin: 0 0 8px;
}
.mdd-city__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 28px;
	margin: 18px 0 24px;
	padding: 0;
	list-style: none;
	font-size: 14px;
	color: var(--mdd-muted, #5b6471);
}
.mdd-city__meta strong { color: var(--mdd-ink, #0b3d2e); }
.mdd-city__cta { margin-top: 8px; }

/* Trust band */
.mdd-trust-band {
	background: #f0f4f1;
	padding: 28px 0;
	border-top: 1px solid var(--mdd-border, #d8dde3);
	border-bottom: 1px solid var(--mdd-border, #d8dde3);
}
.mdd-trust-band ul {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (max-width: 760px) { .mdd-trust-band ul { grid-template-columns: 1fr 1fr; } }
.mdd-trust-band li {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.mdd-trust-band__num {
	font-size: 26px;
	font-weight: 800;
	color: var(--mdd-ink, #0b3d2e);
	line-height: 1.1;
}
.mdd-trust-band__label {
	font-size: 12px;
	color: var(--mdd-muted, #5b6471);
	margin-top: 4px;
	text-transform: uppercase;
	letter-spacing: .04em;
}

/* Rich card grid for city hub services */
.mdd-card-grid--rich {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 16px;
	list-style: none;
	padding: 0;
	margin: 24px 0 0;
}
.mdd-card--rich {
	display: block;
	padding: 22px 24px;
	background: #fff;
	border: 1px solid var(--mdd-border, #e0e3e8);
	border-radius: 10px;
	color: inherit;
	text-decoration: none;
	height: 100%;
	box-sizing: border-box;
	transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.mdd-card--rich:hover {
	border-color: var(--mdd-ink, #0b3d2e);
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(11,61,46,.08);
}
.mdd-card--rich h3 {
	margin: 0 0 8px;
	font-size: 17px;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-card__lede {
	margin: 0 0 12px;
	font-size: 13px;
	color: var(--mdd-muted, #5b6471);
	line-height: 1.5;
}
.mdd-card__price {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 600;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-card__more {
	font-size: 12px;
	font-weight: 600;
	color: #d4a017;
	letter-spacing: .03em;
}

/* Pill list for neighborhoods */
.mdd-pill-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.mdd-pill {
	padding: 8px 14px;
	background: #fff;
	border: 1px solid var(--mdd-border, #d8dde3);
	border-radius: 999px;
	font-size: 13px;
	color: var(--mdd-ink, #0b3d2e);
}

/* Reviews block */
.mdd-reviews { padding: 40px 0; background: #fafafa; }
.mdd-reviews__grid {
	list-style: none;
	padding: 0;
	margin: 24px 0 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}
@media (max-width: 880px) { .mdd-reviews__grid { grid-template-columns: 1fr; } }
.mdd-review {
	padding: 22px 24px;
	background: #fff;
	border: 1px solid var(--mdd-border, #e0e3e8);
	border-radius: 10px;
}
.mdd-review__stars {
	color: #d4a017;
	font-size: 18px;
	letter-spacing: 2px;
	margin-bottom: 12px;
}
.mdd-review__body {
	margin: 0 0 14px;
	font-size: 14px;
	color: var(--mdd-ink, #1a1a1a);
	line-height: 1.55;
	font-style: italic;
	border-left: none;
	padding: 0;
}
.mdd-review__author {
	font-style: normal;
	font-size: 12px;
	font-weight: 600;
	color: var(--mdd-muted, #5b6471);
	letter-spacing: .02em;
}
.mdd-review__city { font-weight: 400; }
.mdd-reviews__more {
	margin-top: 18px;
	text-align: right;
	font-size: 13px;
}
.mdd-reviews__more a {
	color: var(--mdd-ink, #0b3d2e);
	font-weight: 600;
	text-decoration: none;
}
.mdd-reviews__more a:hover { text-decoration: underline; }

.mdd-spoke__cta {
	margin-top: 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
}
.mdd-btn--ghost {
	background: transparent;
	color: var(--mdd-ink, #0b3d2e);
	border: 1px solid var(--mdd-border, #d8dde3);
}
.mdd-btn--ghost:hover {
	background: rgba(11,61,46,.06);
	border-color: var(--mdd-ink, #0b3d2e);
}

/* =====================================================================
   22. 404 upgrade + Review single + Booking form
   ===================================================================== */
.mdd-404 { padding: 64px 0 80px; }
.mdd-404 h1 { font-size: clamp(28px, 4vw, 42px); margin: 8px 0 16px; }
.mdd-404__lede { font-size: 16px; color: var(--mdd-muted, #5b6471); margin-bottom: 28px; max-width: 640px; }
.mdd-404__search form {
	display: flex;
	gap: 8px;
	max-width: 620px;
	margin-bottom: 40px;
	flex-wrap: wrap;
}
.mdd-404__search input[type=search] {
	flex: 1;
	min-width: 240px;
	padding: 14px 16px;
	font-size: 15px;
	border: 1px solid var(--mdd-border, #d8dde3);
	border-radius: 8px;
}
.mdd-404__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	margin-bottom: 40px;
}
@media (max-width: 760px) { .mdd-404__grid { grid-template-columns: 1fr; } }
.mdd-404__col h2 { font-size: 14px; text-transform: uppercase; letter-spacing: .1em; color: #d4a017; margin: 0 0 12px; }
.mdd-404__col ul { padding: 0; margin: 0; list-style: none; font-size: 14px; }
.mdd-404__col li { padding: 5px 0; }
.mdd-404__col a { color: var(--mdd-ink, #0b3d2e); text-decoration: none; }
.mdd-404__col a:hover { text-decoration: underline; }

/* Single review */
.mdd-review-single__header { padding: 56px 0 32px; background: linear-gradient(180deg, #f0f4f1, #fff); }
.mdd-review-single__stars { font-size: 24px; color: #d4a017; letter-spacing: 3px; margin: 12px 0; }
.mdd-review-single__quote {
	font-size: clamp(22px, 3vw, 32px);
	line-height: 1.4;
	font-style: italic;
	font-weight: 600;
	color: var(--mdd-ink, #0b3d2e);
	margin: 8px 0 16px;
	max-width: 820px;
}
.mdd-review-single__meta { font-size: 14px; color: var(--mdd-muted, #5b6471); }
.mdd-review-single__cta { text-align: center; padding: 32px 24px; background: #fafafa; border-radius: 10px; }
.mdd-review-single__cta h2 { margin: 0 0 8px; }
.mdd-review-single__cta p { margin: 4px 0; }

/* Booking form */
.mdd-book-hero { padding: 48px 0 16px; background: linear-gradient(180deg, #f0f4f1, #fff); }
.mdd-booking-form { padding: 40px 0 56px; }

/* =====================================================================
   23. Promo banner (inc/promo-codes.php)
   ===================================================================== */
.mdd-promo-banner {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 9999;
	background: #d4a017;
	color: #0b3d2e;
	padding: 12px 16px 12px 18px;
	border-radius: 999px;
	box-shadow: 0 4px 16px rgba(11,61,46,.18);
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	max-width: 360px;
}
.mdd-promo-banner__code {
	font-weight: 800;
	letter-spacing: .04em;
	background: rgba(11,61,46,.15);
	padding: 4px 10px;
	border-radius: 6px;
	font-family: monospace;
	font-size: 12px;
}
.mdd-promo-banner__desc { font-weight: 600; }
.mdd-promo-banner button {
	background: transparent;
	border: 0;
	color: inherit;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	padding: 0 4px;
	font-weight: 700;
	opacity: .7;
}
.mdd-promo-banner button:hover { opacity: 1; }
@media (max-width: 560px) {
	.mdd-promo-banner { right: 12px; left: 12px; max-width: none; }
}

/* =====================================================================
   24. Compare pair (template-compare-pair.php) + index
   ===================================================================== */
.mdd-compare-pair__vs {
	color: #d4a017;
	font-style: italic;
	font-weight: 600;
	font-size: .7em;
	margin: 0 6px;
}
.mdd-compare-table {
	width: 100%;
	border-collapse: collapse;
	margin: 24px 0;
	font-size: 14px;
}
.mdd-compare-table th, .mdd-compare-table td {
	padding: 14px 16px;
	border-bottom: 1px solid var(--mdd-border, #e0e3e8);
	vertical-align: top;
	text-align: left;
}
.mdd-compare-table thead th {
	background: var(--mdd-ink, #0b3d2e);
	color: #fff;
	font-size: 16px;
	padding: 18px 16px;
}
.mdd-compare-table thead th a {
	color: #fff;
	text-decoration: none;
	font-weight: 700;
}
.mdd-compare-table thead th a:hover { color: #d4a017; }
.mdd-compare-table tbody th {
	width: 180px;
	background: #f6f7f9;
	font-weight: 700;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-compare-table td ul { margin: 0; padding-left: 18px; }
@media (max-width: 720px) {
	.mdd-compare-table { font-size: 13px; }
	.mdd-compare-table tbody th { width: 100px; }
}
.mdd-compare-cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 36px;
}
@media (max-width: 760px) { .mdd-compare-cols { grid-template-columns: 1fr; } }
.mdd-compare-cols h2 { color: var(--mdd-ink, #0b3d2e); margin-top: 0; }

/* =====================================================================
   25. HTML Sitemap (page-site-map.php)
   ===================================================================== */
.mdd-sitemap__group {
	margin-bottom: 18px;
	padding: 18px 20px;
	background: #f6f7f9;
	border-radius: 8px;
	border: 1px solid var(--mdd-border, #d8dde3);
}
.mdd-sitemap__group > summary {
	cursor: pointer;
	font-size: 15px;
	color: var(--mdd-ink, #0b3d2e);
}
.mdd-sitemap__count { color: var(--mdd-muted, #5b6471); font-weight: 400; font-size: 13px; }
.mdd-sitemap__list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4px 18px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
}
@media (max-width: 760px) { .mdd-sitemap__list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .mdd-sitemap__list { grid-template-columns: 1fr; } }
.mdd-sitemap__list a { color: var(--mdd-ink, #0b3d2e); text-decoration: none; padding: 3px 0; display: block; }
.mdd-sitemap__list a:hover { text-decoration: underline; }
.mdd-sitemap__category {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: #d4a017;
	margin: 18px 0 8px;
}

/* =====================================================================
   26. Detailer single (single-mdd_detailer.php) upgrades
   ===================================================================== */
.mdd-detailer__hero { padding: 48px 0 32px; background: linear-gradient(180deg, #f0f4f1, #fff); }
.mdd-detailer__header {
	display: grid;
	grid-template-columns: 200px 1fr;
	gap: 32px;
	align-items: center;
}
@media (max-width: 660px) {
	.mdd-detailer__header { grid-template-columns: 1fr; }
	.mdd-detailer__photo { max-width: 200px; margin: 0 auto; }
}
.mdd-detailer__img {
	width: 100%;
	height: auto;
	border-radius: 10px;
	border: 4px solid #fff;
	box-shadow: 0 4px 16px rgba(11,61,46,.12);
}
.mdd-detailer__role {
	font-size: 16px;
	font-weight: 600;
	color: #d4a017;
	margin: 4px 0 12px;
}
.mdd-detailer__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 24px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
	font-size: 14px;
	color: var(--mdd-muted, #5b6471);
}
.mdd-detailer__meta strong { color: var(--mdd-ink, #0b3d2e); font-weight: 700; }
.mdd-detailer__quote-section { background: #fafafa; padding: 40px 0; }
.mdd-detailer__quote {
	margin: 0;
	font-size: 22px;
	font-style: italic;
	line-height: 1.5;
	color: var(--mdd-ink, #0b3d2e);
	border-left: 4px solid #d4a017;
	padding-left: 24px;
	max-width: 720px;
}
.mdd-detailer__quote-attrib {
	margin: 16px 0 0;
	font-size: 13px;
	color: var(--mdd-muted, #5b6471);
}