/*
 * MortgageSolvers layout layer. Tokens (colours, type sizes, spacing scale)
 * live in theme.json; this file applies them consistently.
 *
 * Spacing rule: every vertical rhythm uses the same scale —
 *   --s-section  space above/below a section (56–88px)
 *   --s-block    space between a section heading and its content (32–48px)
 *   --s-card     padding inside a card (24–32px)
 *   --s-gap      gap between cards in a grid (20–28px)
 * Body text is 18px minimum; small print 16px. Built for older readers.
 */
:root {
	--s-section: var(--wp--preset--spacing--60);
	--s-block: var(--wp--preset--spacing--50);
	--s-card: var(--wp--preset--spacing--40);
	--s-gap: clamp(1.25rem, 2vw, 1.75rem);
	--ms-radius: 18px;
}

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
html, body { overflow-x: clip; }
*, *::before, *::after { box-sizing: border-box; }
/* Side margins: every full-width band keeps the same breathing room from the screen edge. */
.wp-site-blocks .alignfull { padding-inline: clamp(1.25rem, 4vw, 2.5rem); }
p { margin-block: 0; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }

/* ---------- Sections ---------- */
.ms-section { padding-block: var(--s-section); }
.ms-section--tight-bottom { padding-bottom: var(--s-block); }
.ms-section--tight-top { padding-top: var(--s-block); }
.ms-section-head { max-width: 820px; margin-bottom: var(--s-block); }
.ms-section-head.is-centered { margin-inline: auto; text-align: center; }
.ms-section-head > * + * { margin-top: 0.875rem; }
.ms-lede { font-size: var(--wp--preset--font-size--large); }

/* ---------- Top bar ---------- */
.ms-topbar { font-size: 1rem; padding-block: 0.625rem; }
.ms-topbar .ms-row-between { gap: 0.25rem 1.5rem; }
.ms-topbar a { color: #fff; font-weight: 700; text-decoration: none; }
.ms-topbar a:hover { text-decoration: underline; }

/* ---------- Header ---------- */
.ms-header { padding-block: 1.125rem; border-bottom: 1px solid var(--wp--preset--color--line); }
.ms-header-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; }
.ms-header-actions { display: flex; align-items: center; gap: 1.75rem; margin: 0 !important; }
.ms-header .wp-block-navigation { gap: 1.75rem; font-size: 1rem; flex-wrap: nowrap; }
.ms-header .wp-block-navigation__container { flex-wrap: nowrap !important; }
.ms-header .wp-block-navigation-item__content { white-space: nowrap; }
.ms-header .wp-block-navigation .wp-block-navigation__container { gap: 1.75rem; }
.ms-header .wp-block-navigation-item__content { padding-block: 0.5rem; text-decoration: none; color: var(--wp--preset--color--text-strong); }
.ms-header .wp-block-navigation-item__content:hover { text-decoration: underline; }
.ms-header .wp-block-buttons { margin: 0 !important; flex-wrap: nowrap; }
.ms-header .wp-block-button__link { padding: 0.8rem 1.4rem; font-size: 1rem; font-weight: 700; white-space: nowrap; }

/* Below 1100px the menu folds into a Menu button, so nothing crowds or spaces unevenly. */
@media (max-width: 1099px) {
	.ms-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
	.ms-header .wp-block-navigation .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
	.ms-header-actions { gap: 1rem; }
}
.ms-header .wp-block-navigation__responsive-container-open {
	width: 48px; height: 48px; align-items: center; justify-content: center;
	border: 2px solid var(--wp--preset--color--ink); border-radius: 12px;
}
.ms-header .wp-block-navigation__responsive-container-close { width: 48px; height: 48px; align-items: center; justify-content: center; }
.ms-header .wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem; }
.ms-header .is-menu-open .wp-block-navigation__container { gap: 0.25rem !important; }
.ms-header .is-menu-open .wp-block-navigation-item__content { font-size: 1.375rem; padding-block: 0.75rem; }
@media (max-width: 599px) {
	.ms-header .wp-block-buttons { display: none; } /* top bar + hero carry the call to action */
}

/* Brand lockup: puzzle-house mark + wordmark set in Manrope */
.ms-brand { display: inline-flex; align-items: center; gap: 0.75rem; text-decoration: none; color: var(--wp--preset--color--ink); }
.ms-brand img { display: block; height: 48px; width: auto; }
.ms-brand span { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1; white-space: nowrap; }
@media (max-width: 420px) { .ms-brand span { font-size: 1.25rem; } .ms-brand img { height: 40px; } }
.ms-logo-full img { display: block; height: auto; max-width: 100%; }
.ms-on-dark .ms-logo-full img { filter: invert(1); }

/* ---------- Generic helpers ---------- */
.ms-row-between { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.ms-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--ms-radius);
	padding: var(--s-card);
	box-shadow: var(--wp--custom--hairline);
}
.ms-badge {
	display: inline-flex; align-items: center; gap: 0.5rem; width: fit-content;
	background: var(--wp--preset--color--tint); color: var(--wp--preset--color--ink);
	border-radius: 999px; padding: 0.5rem 0.9rem;
	font-size: 1rem; font-weight: 700; line-height: 1.3;
}
.ms-badge--check::before {
	content: ""; width: 16px; height: 16px; flex: none; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ms-small { font-size: 1rem; color: var(--wp--preset--color--text-muted); }
.ms-old { color: var(--wp--preset--color--text-muted); text-decoration: line-through; }
.ms-placeholder { outline: 2px dashed currentColor; outline-offset: 3px; font-weight: 700; }

/* Text on dark bands */
.ms-on-dark { color: var(--wp--preset--color--text-on-dark); }
.ms-on-dark :where(h1, h2, h3, h4, strong) { color: var(--wp--preset--color--white); }
.ms-on-dark a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--white); }

/* ---------- Hero ---------- */
.ms-hero-grid { display: flex; flex-wrap: wrap; gap: var(--s-block) 3.5rem; align-items: center; }
.ms-hero-copy { flex: 1 1 540px; min-width: 0; }
.ms-hero-copy > * + * { margin-top: 1.375rem; }
.ms-hero-copy .wp-block-buttons { margin-top: 2rem; gap: 0.875rem; }
.ms-hero-card { flex: 0 1 460px; min-width: min(100%, 340px); border-radius: 20px; padding: 2rem; }
@media (max-width: 1023px) { .ms-hero-card { flex-basis: 100%; max-width: 560px; } }
.ms-eyebrow { font-size: 1rem; font-weight: 700; color: var(--wp--preset--color--text-muted); }
.ms-hero-card .ms-eyebrow + p { margin: 0.375rem 0 1.25rem; }
.ms-pay-row {
	display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
	padding-block: 1rem; border-bottom: 1px solid var(--wp--preset--color--line);
}
.ms-pay-row--new { border-bottom: 0; color: var(--wp--preset--color--ink); font-weight: 700; }
.ms-amount { font-size: 1.625rem; font-weight: 800; color: var(--wp--preset--color--ink); white-space: nowrap; }
.ms-amount.ms-old { font-weight: 700; color: var(--wp--preset--color--text-muted); }
.ms-amount small, .ms-pocket small { font-size: 1rem; font-weight: 500; }
.ms-pocket {
	display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; flex-wrap: wrap;
	background: var(--wp--preset--color--graphite); color: #fff;
	border-radius: 14px; padding: 1.25rem 1.375rem; margin-top: 0.5rem; font-weight: 600;
}
.ms-pocket strong { font-size: 2.125rem; font-weight: 800; letter-spacing: -0.02em; color: #fff; white-space: nowrap; }
.ms-hero-card .ms-small { margin-top: 1rem; font-size: 0.9375rem; line-height: 1.5; }

/* ---------- Stats band ---------- */
.ms-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; }
@media (max-width: 1099px) { .ms-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 479px) { .ms-stats { grid-template-columns: 1fr; } }
.ms-stat-value { font-size: var(--wp--preset--font-size--stat); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; color: #fff; }
.ms-stat-label { margin-top: 0.5rem !important; }

/* ---------- Card grids ---------- */
.ms-grid { display: grid; gap: var(--s-gap); grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.ms-grid--steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
@media (max-width: 899px) { .ms-grid--steps { grid-template-columns: 1fr; gap: 1.5rem; } }
.ms-grid > * { margin: 0 !important; }
.ms-icon-tile {
	width: 48px; height: 48px; border-radius: 12px; margin-bottom: 1.125rem !important;
	background: var(--wp--preset--color--tint); display: grid; place-items: center;
	font-size: 0; /* decorative */
}
.ms-icon-tile::before {
	content: ""; width: 24px; height: 24px; background: var(--wp--preset--color--graphite);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M6 10v10h12V10'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M6 10v10h12V10'/%3E%3C/svg%3E") center / contain no-repeat;
}
body .ms-service > * { margin-block: 0; }
body .ms-service h3 { margin-bottom: 0.5rem; }
.ms-service h3 a { text-decoration: none; }
.ms-service h3 a:hover { text-decoration: underline; }
body .ms-service .ms-more { margin-top: 1rem; font-weight: 700; }

/* ---------- How it works ---------- */
body .ms-step > * { margin-block: 0; }
body .ms-step h3 { margin-bottom: 0.5rem; }
.ms-step-number {
	width: 52px; height: 52px; border-radius: 50%;
	background: var(--wp--preset--color--graphite); color: #fff;
	display: grid; place-items: center; font-size: 1.375rem; font-weight: 800;
	margin-bottom: 1.125rem !important;
}

/* ---------- Testimonials ---------- */
.ms-testimonial { display: flex; flex-direction: column; gap: 1.125rem; margin: 0; }
.ms-testimonial blockquote { margin: 0; padding: 0; border: 0; font-size: 1.125rem; color: var(--wp--preset--color--text-strong); line-height: 1.6; }
.ms-testimonial .ms-badge { font-size: 1.125rem; font-weight: 800; border-radius: 10px; }
.ms-testimonial figcaption { font-size: 1rem; color: var(--wp--preset--color--text-muted); }
.ms-testimonial figcaption strong { color: var(--wp--preset--color--ink); font-weight: 800; }

/* ---------- Review CTA + lead form ---------- */
.ms-cta-grid { display: flex; flex-wrap: wrap; gap: var(--s-block) 3rem; align-items: center; }
.ms-cta-copy { flex: 999 1 460px; min-width: 0; }
.ms-cta-copy > * + * { margin-top: 1rem; }
.ms-cta-form { flex: 1 1 380px; min-width: 0; }
.ms-lead-form { position: relative; background: #fff; color: var(--wp--preset--color--text-body); border-radius: 20px; padding: 1.875rem; display: grid; gap: 1rem; }
.ms-lead-form .ms-field-row { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
.ms-lead-form label { display: block; font-size: 1rem; font-weight: 700; color: var(--wp--preset--color--ink); }
.ms-lead-form input, .ms-lead-form select {
	display: block; width: 100%; margin-top: 0.375rem; min-height: 52px;
	padding: 0.75rem 0.875rem; font: inherit; font-size: 1.125rem; color: var(--wp--preset--color--ink);
	background: #fff; border: 1px solid #8A8A8A; border-radius: 10px;
}
.ms-lead-form input:focus-visible, .ms-lead-form select:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 1px; }
.ms-lead-form button {
	margin-top: 0.375rem; width: 100%; min-height: 56px; border: 0; border-radius: 12px; cursor: pointer;
	background: var(--wp--preset--color--cta); color: var(--wp--preset--color--ink);
	font: inherit; font-size: 1.125rem; font-weight: 800; padding: 1.125rem;
}
.ms-lead-form button:hover, .ms-lead-form button:focus-visible { background: var(--wp--preset--color--cta-hover); }
.ms-lead-form button[disabled] { opacity: 0.7; cursor: progress; }
.ms-lead-form .ms-consent { font-size: 0.9375rem; color: var(--wp--preset--color--text-muted); line-height: 1.5; }
.ms-lead-form .ms-consent a { color: var(--wp--preset--color--ink); }
.ms-lead-form .ms-note, .ms-lead-form .ms-error {
	font-size: 1rem; color: var(--wp--preset--color--ink); border: 2px solid var(--wp--preset--color--ink);
	border-radius: 10px; padding: 0.75rem 0.875rem;
}
.ms-lead-form .ms-error::before { content: "! "; font-weight: 800; }
.ms-lead-form [hidden] { display: none !important; }
.ms-lead-form .ms-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.ms-lead-done { background: #fff; border-radius: 20px; padding: 2rem; color: var(--wp--preset--color--text-body); }
.ms-lead-done h3 { color: var(--wp--preset--color--ink) !important; margin: 0 0 0.75rem; }

/* ---------- Footer ---------- */
.ms-footer { font-size: 1rem; line-height: 1.6; padding-top: var(--s-section); }
.ms-footer-grid { display: grid; gap: 2.5rem 3rem; grid-template-columns: minmax(240px, 1.3fr) repeat(3, minmax(180px, 1fr)); }
@media (max-width: 1099px) { .ms-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .ms-footer-grid { grid-template-columns: 1fr; } }
.ms-footer-grid > * { margin: 0 !important; }
.ms-footer h2 { font-size: 1.125rem; font-weight: 800; letter-spacing: 0; color: #fff; margin: 0 0 1rem; }
.ms-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.625rem; }
.ms-footer li a { text-decoration: none; display: inline-block; padding-block: 0.125rem; }
.ms-footer li a:hover, .ms-footer li a:focus-visible { text-decoration: underline; }
@media (max-width: 1099px) { .ms-footer li a { padding-block: 0.6rem; } .ms-footer ul { gap: 0; } }
.ms-footer address { font-style: normal; line-height: 1.7; }
.ms-nap > * + * { margin-top: 1rem; }
.ms-footer .ms-logo-full { display: block; width: 220px; margin-bottom: 1.5rem; }
.ms-footer-legal { margin-top: var(--s-block); padding-block: 2rem; border-top: 1px solid #2A2A2A; }
.ms-footer-legal p + p { margin-top: 0.75rem; }

/* Skip link */
.skip-link:focus { position: fixed; top: 0.5rem; left: 0.5rem; z-index: 999; background: #fff; color: #111; padding: 0.75rem 1rem; }

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }

/* Flex/grid containers: neutralise WordPress's flow spacing so gaps come only from the scale above */
:where(.ms-header-row, .ms-header-actions, .ms-hero-grid, .ms-cta-grid, .ms-row-between, .ms-pay-row, .ms-pocket, .ms-stats, .ms-grid, .ms-footer-grid) > * { margin-block: 0 !important; }
body .ms-hero-copy > * + * { margin-top: 1.375rem; }
body .ms-hero-copy > .wp-block-buttons { margin-top: 2rem; }
body .ms-cta-copy > * + * { margin-top: 1rem; }
body .ms-section-head > * + * { margin-top: 0.875rem; }
body .ms-section-head:last-child { margin-bottom: 0; }
body .ms-card > * + * { margin-top: 0; }
body .ms-hero-card .ms-eyebrow + p { margin-top: 0.375rem; margin-bottom: 1.25rem; }
body .ms-stat-value + .ms-stat-label { margin-top: 0.5rem; }

/* Testimonials: 3 across, or 1 per row (never 2 + an orphan) */
.ms-grid--quotes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 899px) { .ms-grid--quotes { grid-template-columns: 1fr; max-width: 640px; margin-inline: auto; } }

/* Open phone/tablet menu: a clear left-aligned list with big tap areas */
.ms-header .is-menu-open .wp-block-navigation__responsive-container-content { align-items: stretch !important; padding-top: 3.5rem; }
.ms-header .is-menu-open .wp-block-navigation__container { align-items: stretch !important; width: 100%; gap: 0 !important; }
.ms-header .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--wp--preset--color--line); }
.ms-header .is-menu-open .wp-block-navigation-item__content { display: block; width: 100%; padding-block: 1.125rem !important; font-size: 1.375rem; text-align: left; }

/* Savings example: the five debts as small chips, readable at a glance */
.ms-debt-chips { font-size: 1rem; color: var(--wp--preset--color--text-muted); padding-bottom: 1rem; border-bottom: 1px solid var(--wp--preset--color--line); }
.ms-hero-card .ms-pay-row:first-of-type { border-bottom: 0; padding-bottom: 0.5rem; }
.ms-pay-row > p:first-child { min-width: 0; } /* labels may wrap; the amount never does */
@media (max-width: 420px) {
	.ms-hero-card { padding: 1.5rem; }
	.ms-amount { font-size: 1.375rem; }
	.ms-pay-row { gap: 0.5rem; }
}

/* Hero trust line */
body .ms-hero-copy > .ms-trust { margin-top: 1.5rem; font-size: 1.0625rem; }
.ms-trust a { font-weight: 700; }
body .ms-hero-copy > .ms-trust + .ms-small { margin-top: 0.375rem; }
.ms-more-reviews { margin-top: var(--s-block) !important; }

/* FAQ accordion: big tap targets, plus/minus marker, no JavaScript */
.ms-faq { border-top: 1px solid var(--wp--preset--color--line); }
body .ms-faq > * { margin: 0; }
.ms-faq details { border-bottom: 1px solid var(--wp--preset--color--line); }
.ms-faq summary {
	list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
	padding: 1.375rem 0; font-size: 1.25rem; font-weight: 700; color: var(--wp--preset--color--ink); min-height: 44px;
}
.ms-faq summary::-webkit-details-marker { display: none; }
.ms-faq summary::after { content: "+"; flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--wp--preset--color--tint); display: grid; place-items: center; font-size: 1.5rem; font-weight: 600; line-height: 1; }
.ms-faq details[open] summary::after { content: "–"; }
.ms-faq summary:focus-visible { outline: 2px solid var(--wp--preset--color--ink); outline-offset: 4px; }
.ms-faq details > p { padding: 0 3rem 1.5rem 0; margin: 0; }

/* Still have questions? */
.ms-help-band {
	margin-top: var(--s-block) !important; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.25rem 2rem;
	background: var(--wp--preset--color--paper); border-radius: var(--ms-radius); padding: var(--s-card);
}
body .ms-help-band > * { margin: 0 !important; }
.ms-help-band h3 { margin: 0 0 0.25rem; }
.ms-help-band .wp-block-buttons { gap: 0.75rem; }

/* Footer: brand line + Willful-style legal bar */
.ms-footer-blurb { color: #fff; font-size: 1.0625rem; line-height: 1.5; margin-bottom: 1.5rem !important; max-width: 30ch; }
.ms-footer .ms-licensing { font-size: 0.9375rem; }
.ms-footer .ms-licensing p + p { margin-top: 0.75rem; }
.ms-legal-row {
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.75rem 2rem;
	margin-top: 1.75rem; padding-top: 1.5rem; border-top: 1px solid #2A2A2A; font-size: 0.9375rem;
}
.ms-legal-row ul { display: flex !important; flex-wrap: wrap; gap: 0.5rem 1.5rem !important; }
.ms-legal-row li a { padding-block: 0.25rem !important; }

/* Reviews: names line up along the bottom of every card */
.ms-testimonial figcaption { margin-top: auto; padding-top: 0.5rem; font-size: 1.0625rem; }

/* Review carousel: 3 / 2 / 1 cards visible, swipe or arrows, the next card peeks on phones */
.ms-carousel { --cards: 3; }
@media (max-width: 1099px) { .ms-carousel { --cards: 2; } }
@media (max-width: 699px) { .ms-carousel { --cards: 1.12; } }
.ms-carousel-track {
	display: grid; grid-auto-flow: column; gap: var(--s-gap);
	grid-auto-columns: calc((100% - (var(--cards) - 1) * var(--s-gap)) / var(--cards));
	overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
	padding-bottom: 0.5rem; scrollbar-width: none;
}
.ms-carousel-track::-webkit-scrollbar { display: none; }
.ms-carousel-track:focus-visible { outline: 2px solid var(--wp--preset--color--ink); outline-offset: 4px; }
.ms-carousel-track > .ms-testimonial { scroll-snap-align: start; margin: 0; }
.ms-carousel-nav { display: flex; justify-content: center; gap: 0.75rem; margin-top: 1.5rem; }
.ms-carousel.is-static .ms-carousel-nav { display: none; }
.ms-carousel-btn {
	width: 52px; height: 52px; border-radius: 50%; cursor: pointer;
	background: #fff; color: var(--wp--preset--color--ink); border: 2px solid var(--wp--preset--color--ink);
	font-size: 1.375rem; font-weight: 700; line-height: 1; display: grid; place-items: center;
}
.ms-carousel-btn:hover:not([disabled]) { background: var(--wp--preset--color--ink); color: #fff; }
.ms-carousel-btn[disabled] { opacity: 0.35; cursor: default; }
.ms-carousel-btn:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 3px; }

/* Alberta hub: funded-deal cities */
.ms-funded-cities ul { columns: 3 200px; padding-left: 1.25rem; margin-top: 1rem; }
.ms-funded-cities li { padding-block: 0.25rem; break-inside: avoid; }
.ms-funded-cities li:target { font-weight: 800; }

/* How it works: steps sit in bordered cards, like the services */
.ms-step.ms-card { background: var(--wp--preset--color--paper); }

/* ---------- Calculators (simple numbers: sliders → savings) ---------- */
.ms-calc { padding: clamp(1.5rem, 3.5vw, 3rem); max-width: 1000px; margin-inline: auto; }
.ms-calc > * { margin: 0 !important; }
.ms-calc > * + * { margin-top: 2rem !important; }
.ms-calc .ms-calc-title { font-size: clamp(1.75rem, 3vw, 2.25rem); }
.ms-calc-label { font-size: 0.9375rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--wp--preset--color--text-muted); margin: 0; }
.ms-calc-num { font-weight: 800; color: var(--wp--preset--color--ink); margin: 0; line-height: 1.1; font-variant-numeric: tabular-nums; }
.ms-calc-headline { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: 16px; overflow: hidden; background: var(--wp--preset--color--ink); }
.ms-calc-headline--one { grid-template-columns: 1fr; }
.ms-calc-big { padding: clamp(1.25rem, 3vw, 2rem); color: #fff; }
.ms-calc-big + .ms-calc-big { border-left: 1px solid rgba(255,255,255,0.18); }
.ms-calc-big > * { margin: 0; color: #fff; }
.ms-calc-big .ms-calc-label { color: rgba(255,255,255,0.75); }
.ms-calc-big .ms-calc-num { font-size: clamp(2.25rem, 5vw, 3.25rem); color: #fff; margin: 0.5rem 0 0.25rem; }
.ms-calc-big p:last-child { font-size: 1rem; color: rgba(255,255,255,0.85); }
@media (max-width: 599px) { .ms-calc-headline { grid-template-columns: 1fr; } .ms-calc-big + .ms-calc-big { border-left: 0; border-top: 1px solid rgba(255,255,255,0.18); } }
.ms-calc-fields { display: grid; gap: 1.75rem; }
.ms-slider-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.ms-calc label { font-size: 1.0625rem; font-weight: 700; color: var(--wp--preset--color--ink); }
.ms-slider output { font-size: 1.25rem; font-weight: 800; color: var(--wp--preset--color--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ms-calc input[type=range] {
	-webkit-appearance: none; appearance: none; display: block; width: 100%; height: 12px; margin-top: 0.875rem; border-radius: 999px; cursor: pointer;
	background: linear-gradient(to right, var(--wp--preset--color--ink) var(--fill, 50%), #DCDCDC var(--fill, 50%));
}
.ms-calc input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 30px; height: 30px; border-radius: 50%; background: #fff; border: 3px solid var(--wp--preset--color--ink); box-shadow: 0 1px 4px rgba(0,0,0,0.2); }
.ms-calc input[type=range]::-moz-range-thumb { width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 3px solid var(--wp--preset--color--ink); }
.ms-calc input[type=range]:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 6px; }
.ms-calc select {
	display: block; width: 100%; min-height: 56px; margin-top: 0.625rem; padding: 0.75rem 1rem;
	font: inherit; font-size: 1.125rem; color: var(--wp--preset--color--ink); background: #fff; border: 1px solid #8A8A8A; border-radius: 10px;
}
.ms-calc select:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 1px; }
.ms-calc-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--wp--preset--color--line); border-radius: 16px; overflow: hidden; }
.ms-calc-tiles--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ms-calc-tile { padding: 1.25rem 1rem; text-align: center; background: var(--wp--preset--color--paper); }
.ms-calc-tile + .ms-calc-tile { border-left: 1px solid var(--wp--preset--color--line); }
.ms-calc-tile .ms-calc-num { font-size: clamp(1.375rem, 2.4vw, 1.75rem); }
.ms-calc-tile .ms-calc-label { margin-top: 0.5rem; font-size: 0.8125rem; }
@media (max-width: 799px) {
	.ms-calc-tiles, .ms-calc-tiles--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ms-calc-tile + .ms-calc-tile { border-left: 0; }
	.ms-calc-tile:nth-child(even) { border-left: 1px solid var(--wp--preset--color--line); }
	.ms-calc-tile:nth-child(n+3) { border-top: 1px solid var(--wp--preset--color--line); }
	.ms-calc-tiles--3 .ms-calc-tile:last-child { grid-column: 1 / -1; border-left: 0; }
}
.ms-calc-cta .wp-block-button__link { display: block; width: 100%; text-align: center; font-size: 1.1875rem; padding-block: 1.125rem; }
.ms-calc.is-negative .ms-calc-headline { background: #5A5A5A; }
.ms-cost { display: grid; gap: 0; margin: 0; border: 1px solid var(--wp--preset--color--line); border-radius: 12px; overflow: hidden; }
.ms-cost > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.75rem 1rem; border-bottom: 1px solid var(--wp--preset--color--line); }
.ms-cost > div:last-child { border-bottom: 0; }
.ms-cost dt { color: var(--wp--preset--color--text-body); }
.ms-cost dd { margin: 0; font-weight: 800; color: var(--wp--preset--color--ink); white-space: nowrap; }

/* ---------- Articles ---------- */
.ms-article h1 { font-size: clamp(2.25rem, 4.5vw, 3rem); margin-bottom: 1rem; }
.ms-byline { color: var(--wp--preset--color--text-muted); font-size: 1rem; margin-bottom: var(--s-block) !important; }
.ms-article .wp-block-post-content > * + * { margin-top: 1.25rem; }
.ms-article .wp-block-post-content h2 { margin-top: 2.75rem; font-size: clamp(1.625rem, 3vw, 2rem); }
.ms-article .wp-block-post-content h3 { margin-top: 2rem; }
.ms-article table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.ms-article th, .ms-article td { border: 1px solid var(--wp--preset--color--line); padding: 0.75rem; text-align: left; vertical-align: top; }
.ms-article th { background: var(--wp--preset--color--tint); color: var(--wp--preset--color--ink); }
.ms-sources { margin-top: var(--s-block) !important; padding-top: 1.5rem; border-top: 1px solid var(--wp--preset--color--line); font-size: 1rem; }
.ms-sources h2 { font-size: 1.25rem; }
.ms-sources ol { padding-left: 1.25rem; }
.ms-author-box { margin-top: 2rem !important; }
.ms-author-box > * + * { margin-top: 0.375rem !important; }
.ms-author-name { font-size: 1.375rem; font-weight: 800; color: var(--wp--preset--color--ink); }

/* ---------- Locality pages and hubs ---------- */
.ms-local-facts, .ms-locality-reviews, .ms-locality-links { margin-top: var(--s-block) !important; }
.ms-local-facts h2, .ms-locality-links h2 { margin-bottom: 1.25rem; }
.ms-fact > * + * { margin-top: 0.5rem !important; }
.ms-fact-value { font-size: 1.5rem; font-weight: 800; color: var(--wp--preset--color--ink); line-height: 1.3; }
.ms-locality-links ul, .ms-child-areas ul, .ms-funded-cities ul { columns: 2 260px; padding-left: 1.25rem; }
.ms-locality-links li, .ms-child-areas li { padding-block: 0.375rem; break-inside: avoid; }

/* ---------- For AI page ---------- */
.ms-for-ai > * + * { margin-top: 1.25rem; }
.ms-for-ai h2 { margin-top: 2.5rem; }
.ms-for-ai blockquote { border-left: 4px solid var(--wp--preset--color--ink); margin: 0; padding: 0.5rem 0 0.5rem 1.25rem; font-size: 1.25rem; font-weight: 600; color: var(--wp--preset--color--ink); }
.ms-for-ai .ms-cost dd { white-space: normal; text-align: right; }

/* ---------- Rich page sections (town + service pages) ---------- */
.ms-local-hero h1 { font-size: clamp(2.5rem, 5vw, 3.5rem); }
.ms-hero-form { flex: 0 1 440px; min-width: min(100%, 340px); }
.ms-hero-form .ms-lead-form { box-shadow: 0 1px 0 rgba(0,0,0,0.04); border: 1px solid var(--wp--preset--color--line); }
.ms-form-title { font-size: 1.375rem; font-weight: 800; color: var(--wp--preset--color--ink); margin: 0 0 0.75rem !important; }
.ms-trust-row { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.5rem !important; }
.ms-trust-row li { display: inline-flex; align-items: center; gap: 0.375rem; background: #fff; border: 1px solid var(--wp--preset--color--line); border-radius: 999px; padding: 0.4rem 0.85rem; font-size: 0.9375rem; font-weight: 700; color: var(--wp--preset--color--ink); }
.ms-trust-row li::before { content: "✓"; font-weight: 800; }
.ms-local-hero .wp-block-buttons { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.75rem !important; }
.ms-section-block + .ms-section-block, .ms-section-head + .ms-section-block { margin-top: var(--s-block) !important; }
.ms-section-block > .ms-section-head { margin-bottom: 1.5rem; }
.ms-local-intro { max-width: 820px; }
.ms-numbers-grid { display: grid; gap: var(--s-gap); grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; }
@media (max-width: 899px) { .ms-numbers-grid { grid-template-columns: 1fr; } }
.ms-numbers-grid .ms-local-facts .ms-grid { grid-template-columns: 1fr; }
.ms-equity-example > * { margin-block: 0 !important; }
.ms-equity-example .ms-pocket { margin-top: 0.75rem !important; }
.ms-equity-example .ms-small { margin-top: 1rem !important; }
.ms-price-card > * { margin-block: 0 !important; }
.ms-price { font-size: clamp(1.875rem, 3vw, 2.375rem); font-weight: 800; color: var(--wp--preset--color--ink); letter-spacing: -0.02em; margin: 0.25rem 0 1rem !important; }
.ms-checks { list-style: none; padding: 0; display: grid; gap: 0.625rem; }
.ms-checks li { position: relative; padding-left: 1.75rem; }
.ms-checks li::before { content: "✓"; position: absolute; left: 0; top: 0; font-weight: 800; color: var(--wp--preset--color--ink); }
.ms-cost-note { margin-top: 1.5rem !important; max-width: 900px; }
.ms-why > * { margin-block: 0 !important; }
.ms-why-stat { font-size: clamp(1.875rem, 3vw, 2.25rem); font-weight: 800; color: var(--wp--preset--color--ink); letter-spacing: -0.02em; margin-bottom: 0.5rem !important; }
.ms-why h3 { margin-bottom: 0.375rem !important; }
.ms-link-cards { list-style: none; padding: 0; display: grid; gap: 0.75rem; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.ms-link-card { display: flex; justify-content: space-between; align-items: center; padding: 1.125rem 1.25rem; font-weight: 700; text-decoration: none; color: var(--wp--preset--color--ink); }
.ms-link-card:hover { border-color: var(--wp--preset--color--ink); }

/* Service pages */
.ms-answer { max-width: 900px; }
.ms-answer > * { margin-block: 0 !important; }
.ms-answer > * + * { margin-top: 0.875rem !important; }
.ms-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.ms-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1199px) { .ms-grid--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 799px) { .ms-grid--5 { grid-template-columns: 1fr; } }
.ms-crosses { list-style: none; padding: 0; display: grid; gap: 0.75rem; }
.ms-crosses li { position: relative; padding-left: 1.75rem; }
.ms-crosses li::before { content: "✕"; position: absolute; left: 0; top: 0; font-weight: 800; color: var(--wp--preset--color--ink); }
.ms-grid--2 .ms-card h3 { margin: 0 0 1rem !important; }
.ms-source-note { margin-top: 1.25rem !important; }
.ms-example-grid { display: grid; gap: 2.5rem; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: start; }
@media (max-width: 899px) { .ms-example-grid { grid-template-columns: 1fr; } }
.ms-example-grid > * { margin: 0 !important; }
.ms-example-detail > * + * { margin-top: 1rem !important; }
.ms-example-detail h3 { margin-top: 0 !important; }
.ms-docs-grid { display: grid; gap: 2rem 3rem; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); align-items: center; }
@media (max-width: 899px) { .ms-docs-grid { grid-template-columns: 1fr; } }
.ms-docs-grid > * { margin: 0 !important; }
/* Left-aligned section heads line up with the grid below (constrained layout otherwise centres them) */
.is-layout-constrained > .ms-section-head:not(.is-centered) { margin-left: 0 !important; margin-right: auto !important; }
.is-layout-constrained > .ms-answer { margin-inline: auto !important; }
/* Cost cards promise the process, not a rate */
.ms-price.ms-price--text { font-size: clamp(1.375rem, 2.2vw, 1.75rem); line-height: 1.2; }
.ms-cost-note { margin-top: 1.5rem !important; max-width: 900px; }
.ms-cost-cta { margin-top: 2rem !important; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; padding: 1.5rem 1.75rem; border: 1px solid var(--wp--preset--color--line, #e2e2e2); border-radius: 16px; background: var(--wp--preset--color--paper, #f4f4f4); }
.ms-cost-cta > * { margin: 0 !important; }
.ms-cost-cta p { font-size: 1.1875rem; }
.is-layout-constrained > .ms-cost-note { margin-left: 0 !important; }

/* Featured image under the page headline (only renders when the page has one). */
.ms-featured-image{margin-top:var(--wp--preset--spacing--40);margin-bottom:var(--wp--preset--spacing--50)}
.ms-featured-image img{display:block;width:100%;height:auto;border:1px solid #e5e5e5;border-radius:12px}

/* One call to action per section (homepage, 2026-11-09), with a reassurance line under the button. */
.ms-section-cta { margin-top: 2rem; display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.ms-hero-copy .wp-block-buttons + .ms-cta-note { margin-top: .5rem; }
.ms-cta-note { font-size: .875rem; color: var(--wp--preset--color--graphite, #555); margin: 0; }
.ms-on-dark .ms-cta-note { color: inherit; opacity: .8; }

/* Hero example: five credit cards merge into one lower payment (2026-11-09). Greys only; tangerine stays on CTAs. */
.ms-cc-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.5rem; margin-top: 0.75rem !important; }
.ms-cc-item { display: flex; flex-direction: column; align-items: center; gap: 0.375rem; }
.ms-cc-row > *, .ms-cc-item > * { margin-block: 0 !important; }
.ms-cc { position: relative; width: 100%; aspect-ratio: 1.586; border-radius: 6px; background: var(--wp--preset--color--ink); box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.ms-cc::before { content: ""; position: absolute; left: 12%; top: 28%; width: 22%; height: 22%; border-radius: 2px; background: rgba(255,255,255,.55); }
.ms-cc::after { content: ""; position: absolute; left: 12%; right: 12%; bottom: 20%; height: 9%; border-radius: 2px; background: rgba(255,255,255,.3); }
.ms-cc--2 { background: var(--wp--preset--color--graphite); }
.ms-cc--3 { background: var(--wp--preset--color--text-muted); }
.ms-cc--4 { background: var(--wp--preset--color--white); box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--ink); }
.ms-cc--5 { background: var(--wp--preset--color--tint); box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--line); }
.ms-cc--4::before, .ms-cc--5::before { background: rgba(0,0,0,.3); }
.ms-cc--4::after, .ms-cc--5::after { background: rgba(0,0,0,.15); }
.ms-cc-pay { font-size: 0.875rem; font-weight: 700; color: var(--wp--preset--color--ink); white-space: nowrap; }
.ms-cc-pay small { font-size: 0.6875rem; font-weight: 500; }
.ms-merge { position: relative; height: 44px; margin: 0.5rem 0 0.75rem; }
.ms-merge svg { display: block; width: 100%; height: 36px; fill: none; stroke: var(--wp--preset--color--text-muted); stroke-width: 1.5; }
.ms-merge::after { content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); border: 7px solid transparent; border-top: 9px solid var(--wp--preset--color--text-muted); border-bottom: 0; }
.ms-hero-card .ms-one-payment { border: 2px solid var(--wp--preset--color--ink) !important; border-radius: 12px; padding: 0.875rem 1rem !important; margin-bottom: 0.75rem !important; }
@media (max-width: 480px) { .ms-cc-row { gap: 0.375rem; } .ms-cc-pay { font-size: 0.75rem; } .ms-cc-pay small { font-size: 0.625rem; } }

/* Scrolling banner under the hero (patterns/ticker.php, assets/ticker.js). */
.ms-ticker { overflow: hidden; padding: 0.875rem 0; border-top: 1px solid #2a2a2a; border-bottom: 1px solid #2a2a2a; margin-block: 0 !important; }
.ms-ticker-track { display: flex; width: max-content; }
.ms-ticker-track > * { margin-block: 0 !important; }
.ms-ticker-track.is-running { animation: ms-ticker 40s linear infinite; }
.ms-ticker:hover .ms-ticker-track { animation-play-state: paused; }
.ms-ticker-item { display: flex; align-items: center; gap: 2rem; padding: 0 1rem 0 2rem; white-space: nowrap; font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--text-on-dark); }
.ms-ticker-item::after { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #5e5e5e; }
@keyframes ms-ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ms-ticker-track.is-running { animation: none; } .ms-ticker { overflow-x: auto; } }

/* Review cards: real photos, videos and a link to the original review (2026-11-09). */
.ms-review-stars { margin: 0; color: var(--wp--preset--color--ink); letter-spacing: 0.1em; font-size: 1.125rem; }
.ms-review-video, .ms-review-photo, .ms-review-player { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; max-height: 360px; border-radius: 12px; overflow: hidden; background: var(--wp--preset--color--ink); border: 0; padding: 0; cursor: pointer; }
.ms-review-player { cursor: auto; object-fit: contain; }
.ms-review-video img, .ms-review-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ms-review-video .ms-play { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: rgba(17,17,17,.75); box-shadow: 0 0 0 2px #fff; }
.ms-review-video .ms-play::after { content: ""; position: absolute; left: 26px; top: 20px; border-left: 18px solid #fff; border-top: 12px solid transparent; border-bottom: 12px solid transparent; }
.ms-review-video:hover .ms-play, .ms-review-video:focus-visible .ms-play { background: #000; }
.ms-review-video:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 3px; }
.ms-review-tag { position: absolute; left: 0.75rem; top: 0.75rem; padding: 0.25rem 0.625rem; border-radius: 999px; background: #fff; color: var(--wp--preset--color--ink); font-size: 0.8125rem; font-weight: 700; }
.ms-review figcaption { display: flex; align-items: center; gap: 0.75rem; line-height: 1.4; }
.ms-review-face { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; }
.ms-review-source { font-size: 0.875rem; color: var(--wp--preset--color--text-muted); }
a.ms-review-source { color: var(--wp--preset--color--ink); text-decoration: underline; text-underline-offset: 2px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }

/* Big numbers on light backgrounds (trust page). */
.ms-big-number { margin: 0; font-size: clamp(2rem, 4vw, 2.75rem); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; color: var(--wp--preset--color--ink); }
.ms-big-number + p { margin-top: 0.25rem; }
/* Let a review carousel inside a narrow text page use the full 1200px row (trust page). */
.ms-wide-reviews { width: min(1200px, calc(100vw - 32px)); max-width: none !important; position: relative; left: 50%; transform: translateX(-50%); }

/* No white strip between the scrolling banner and the black stats band (block gap). */
.ms-ticker + * { margin-block-start: 0 !important; }

/* Google badge above the review carousel (links to the Google Business Profile). */
.ms-google-badge { display: flex; width: fit-content; align-items: center; gap: 0.875rem; margin: 0 auto 1.75rem; padding: 0.75rem 1.25rem; border: 1px solid var(--wp--preset--color--line); border-radius: 999px; background: #fff; color: var(--wp--preset--color--ink); text-decoration: none; line-height: 1.3; }
.ms-google-badge:hover { border-color: var(--wp--preset--color--ink); }
.ms-google-badge:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 3px; }
.ms-google-badge strong { display: block; font-weight: 800; }
.ms-google-badge-sub { display: block; font-size: 0.875rem; color: var(--wp--preset--color--text-muted); text-decoration: underline; text-underline-offset: 2px; }
.ms-google-g { flex: none; }
a.ms-review-source .ms-google-g { vertical-align: -3px; margin-right: 0.375rem; }
.ms-review-photo img { object-position: 30% 20%; }

/* "Think you won't get approved?" and "Closed in 15 days" sections. */
.ms-giant { font-size: clamp(2.25rem, 6vw, 4.25rem) !important; line-height: 1.04 !important; letter-spacing: -0.03em; font-weight: 800; }
.ms-grid--cases { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.ms-case { display: flex; flex-direction: column; gap: 0.875rem; }
.ms-case > * { margin-block: 0 !important; }
.ms-case-q { font-size: clamp(1.75rem, 3.4vw, 2.5rem) !important; line-height: 1.05; font-weight: 800; }
.ms-case-yes { font-size: clamp(1.75rem, 3.4vw, 2.5rem); line-height: 1.05; font-weight: 800; color: var(--wp--preset--color--text-muted); }
.ms-case-yes::before { content: "✓ "; color: var(--wp--preset--color--ink); }
.ms-case-days { font-size: clamp(2.5rem, 6vw, 4rem); line-height: 1; font-weight: 800; letter-spacing: -0.03em; color: var(--wp--preset--color--ink); }
.ms-case-who { margin-top: auto !important; padding-top: 0.25rem; font-size: 0.9375rem; color: var(--wp--preset--color--text-muted); }
.ms-case-who strong { color: var(--wp--preset--color--ink); }
.ms-case-video .ms-review-video { max-height: 420px; }
.ms-case .ms-placeholder { margin: 0; padding: 1rem; border: 1px dashed var(--wp--preset--color--line); border-radius: 12px; font-size: 0.875rem; }
.ms-fast .ms-card { color: var(--wp--preset--color--text-body); }

/* Hero (2026-11-09): speed badge, big-debt line, Google rating under the button. */
.ms-speed-badge { display: inline-block; width: fit-content; padding: 0.375rem 0.875rem; border: 1px solid var(--wp--preset--color--line); border-radius: 999px; background: #fff; font-size: 0.9375rem; font-weight: 700; color: var(--wp--preset--color--ink); }
.ms-hero-copy > .ms-speed-badge + h1 { margin-top: 1rem !important; }
.ms-big-debt { font-size: 1.125rem; font-weight: 800; color: var(--wp--preset--color--ink); }
.ms-hero-copy > .ms-big-debt { margin-top: 0.75rem !important; }
.ms-google-rating { display: flex; align-items: center; gap: 0.625rem; font-size: 1rem; color: var(--wp--preset--color--text-strong); }
.ms-hero-copy > .ms-google-rating { margin-top: 1.25rem !important; }
.ms-google-rating a { color: inherit; text-decoration: none; }
.ms-google-rating a:hover { text-decoration: underline; text-underline-offset: 2px; }
.ms-rating-stars { color: var(--wp--preset--color--ink); letter-spacing: 0.05em; }
.ms-hero-card > .ms-cc-row { margin-top: 0 !important; }

/* Shorter review cards: smaller photo/video, quote clamped to 5 lines with "Read more" (assets/carousel.js). */
.ms-review .ms-review-video, .ms-review .ms-review-photo { aspect-ratio: 4 / 3; max-height: 240px; }
.ms-review-quote p { margin: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; line-clamp: 5; overflow: hidden; }
.ms-review .ms-review-quote { font-size: 1.0625rem; }
.ms-review-more { align-self: flex-start; margin-top: -0.5rem; padding: 0; border: 0; background: none; font: inherit; font-size: 0.9375rem; font-weight: 700; color: var(--wp--preset--color--ink); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.ms-review-more:focus-visible { outline: 2px solid var(--wp--preset--color--ink); outline-offset: 3px; }
@media (max-width: 699px) { .ms-review .ms-review-video, .ms-review .ms-review-photo { max-height: 200px; } .ms-review-quote p { -webkit-line-clamp: 4; line-clamp: 4; } }

/* Full review pop-up ("Read more"). */
.ms-review-dialog { width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 64px); padding: 2rem; border: 0; border-radius: var(--ms-radius); background: #fff; color: var(--wp--preset--color--text-body); box-shadow: 0 20px 60px rgba(0,0,0,.25); }
.ms-review-dialog::backdrop { background: rgba(17,17,17,.6); }
.ms-review-dialog-body { display: flex; flex-direction: column; gap: 1rem; }
.ms-review-dialog-body > * { margin: 0; }
.ms-review-dialog blockquote { margin: 0; padding: 0; border: 0; font-size: 1.125rem; line-height: 1.6; color: var(--wp--preset--color--text-strong); }
.ms-review-dialog figcaption { display: flex; align-items: center; gap: 0.75rem; line-height: 1.4; color: var(--wp--preset--color--text-muted); }
.ms-review-dialog figcaption strong { color: var(--wp--preset--color--ink); font-weight: 800; }
.ms-review-close { position: absolute; right: 0.75rem; top: 0.5rem; width: 44px; height: 44px; border: 0; background: none; font-size: 1.75rem; line-height: 1; color: var(--wp--preset--color--ink); cursor: pointer; }
.ms-review-close:focus-visible { outline: 2px solid var(--wp--preset--color--ink); }
@media (max-width: 699px) { .ms-review-dialog { padding: 1.5rem 1.25rem; } }

/* Hero card: the monthly difference, small, in dark green (Alborz 2026-11-09). */
.ms-saving { margin: 0.5rem 0 0 !important; text-align: right; font-size: 0.9375rem; font-weight: 800; color: #1d6b3a; }

/* Instagram reels (empathy section) and the case-study reel videos: upright 9:16, click to play. */
.ms-reels { --cards: 4; margin-top: var(--s-block); }
@media (max-width: 1099px) { .ms-reels { --cards: 3; } }
@media (max-width: 699px) { .ms-reels { --cards: 1.6; } }
.ms-reel { display: flex; flex-direction: column; gap: 0.75rem; margin: 0; }
.ms-reel-play, .ms-reel-player { position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; border: 0; padding: 0; border-radius: 12px; overflow: hidden; background: var(--wp--preset--color--ink); cursor: pointer; }
.ms-reel-player { cursor: auto; object-fit: contain; }
.ms-reel-play img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ms-reel-play .ms-play { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: rgba(17,17,17,.75); box-shadow: 0 0 0 2px #fff; }
.ms-reel-play .ms-play::after { content: ""; position: absolute; left: 26px; top: 20px; border-left: 18px solid #fff; border-top: 12px solid transparent; border-bottom: 12px solid transparent; }
.ms-reel-play:hover .ms-play, .ms-reel-play:focus-visible .ms-play { background: #000; }
.ms-reel-play:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 3px; }
.ms-reel figcaption { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.9375rem; line-height: 1.4; color: var(--wp--preset--color--text-strong); }
.ms-reel figcaption a { font-size: 0.875rem; font-weight: 700; color: var(--wp--preset--color--ink); text-decoration: underline; text-underline-offset: 2px; }
.ms-case-reel { width: min(100%, 240px); }
.ms-case-reel .ms-reel-play, .ms-case-reel .ms-reel-player { max-height: 420px; }

/* Round 4 (2026-11-09): reel covers show a blurred preview instantly; one Instagram link above the arrows. */
.ms-reel-play { background-size: cover; background-position: center; }
.ms-reel-play img { opacity: 1; }
.ms-reel figcaption { display: block; }
.ms-reels-visit { margin: 1.5rem 0 0 !important; text-align: center; }
.ms-reels-visit a { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 800; color: var(--wp--preset--color--ink); text-decoration: underline; text-underline-offset: 3px; }
.ms-reels-visit + .ms-carousel-nav { margin-top: 1rem; }
/* Steps inside the dark homepage section: dark text on the light cards. */
.ms-fast .ms-card :where(h3, strong) { color: var(--wp--preset--color--ink); }
.ms-fast .ms-step.ms-card { background: #fff; }
.ms-fast-sub { margin: var(--s-block) 0 1.5rem !important; text-align: center; font-size: clamp(1.375rem, 2.4vw, 1.75rem) !important; }

/* Steps section on black (2026-11-09): white cards, dark text inside them. */
.ms-on-dark .ms-card :where(h3, strong) { color: var(--wp--preset--color--ink); }
.ms-howto .ms-step.ms-card { background: #fff; }
.ms-fast .ms-case.ms-card { background: var(--wp--preset--color--paper); }
.ms-on-dark .ms-card { color: var(--wp--preset--color--text-body); }