/* /article-v2.css */
/* ============================================================
   ARTICLE TEMPLATE v2.0  —  Presentation-layer enhancement
   ------------------------------------------------------------
   Carries the Homepage v2 experience into every educational
   article. This file is purely ADDITIVE. It restyles existing
   template class names only — no DOM, content, schema, FAQ,
   breadcrumb, search, navigation or CTA-destination changes.

   Load order: linked immediately before </head>, AFTER each
   article's inline <style> and /search.css, so these rules win
   at equal specificity without needing !important.

   Design language: unchanged tokens (navy / gold / cream,
   Cormorant Garamond + DM Sans). Calm, premium, attorney- and
   family-friendly. No gimmicks, no heavy animation.
   ============================================================ */

:root{
  /* Homepage v2 easing + elevation, mirrored for articles */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --shadow-xl:0 20px 60px rgba(15,31,56,.18);
  --shadow-hover:0 18px 50px rgba(15,31,56,.14),0 6px 18px rgba(0,0,0,.08);
  /* Comfortable reading measure */
  --read-measure:720px;
}

/* ============================================================
   1 · HERO EXPERIENCE
   More air, clearer hierarchy, calm reassurance.
   ============================================================ */
.blog-hero::after{
  /* soft premium glow, calm — mirrors homepage navy depth */
  content:'';position:absolute;right:-8%;top:-30%;width:60%;height:120%;
  background:radial-gradient(closest-side,rgba(184,156,106,.14),rgba(184,156,106,0) 70%);
  z-index:1;pointer-events:none;
}
.blog-hero-inner{
  padding:6.25rem 4rem 3rem;
  gap:3.5rem;
  align-items:center;
}
.blog-hero .eyebrow{margin-bottom:1.4rem;letter-spacing:.24em}
.blog-hero h1{
  font-size:clamp(2.15rem,4.2vw,3rem);
  line-height:1.12;
  letter-spacing:-.01em;
  margin-bottom:1rem;
}
.blog-hero .meta{
  font-size:.76rem;letter-spacing:.05em;
  color:rgba(255,255,255,.5);
  margin-bottom:.9rem;
}
.blog-hero .breadcrumb{
  font-size:.75rem;line-height:1.6;
  padding-top:.9rem;
  border-top:1px solid rgba(184,156,106,.18);
  color:rgba(255,255,255,.55);
}
.blog-hero .breadcrumb a{color:rgba(255,255,255,.68);transition:color .2s var(--ease-soft)}
.blog-hero .breadcrumb a:hover{color:var(--goldl)}

/* ============================================================
   2 · QUICK ANSWER  —  premium key-facts card
   Wording untouched; presentation, hierarchy & readability up.
   ============================================================ */
.quick-answer{
  margin-top:1.85rem;
  border:1px solid var(--border-gold);
  border-radius:14px;
  box-shadow:var(--shadow-card);
}
.quick-answer-header{
  background:linear-gradient(135deg,var(--navy),var(--navy-light,#162847));
  padding:1rem 1.6rem;
}
.quick-answer-header h2{font-size:1.4rem;letter-spacing:.005em}
.quick-answer-body{padding:1.4rem 1.6rem 1.5rem}
.quick-answer-body p{
  font-size:.95rem;line-height:1.78;color:var(--tm);
}
/* Lead sentence of the answer reads a touch larger for quick understanding */
.quick-answer-body>p:first-child{
  font-size:1.02rem;line-height:1.72;color:var(--td);
}
.quick-answer-facts-title{
  margin-top:.35rem;margin-bottom:.75rem;
  padding-top:1rem;border-top:1px solid rgba(184,156,106,.22);
  letter-spacing:.14em;
}
.quick-answer-facts{gap:.6rem}
.quick-answer-facts li{
  font-size:.88rem;line-height:1.6;gap:.65rem;
  padding-left:0;
}
.quick-answer-facts li::before{
  content:'\2713';color:var(--gold);font-weight:700;
  line-height:1.5;flex-shrink:0;
}
.quick-answer-facts li a{color:var(--navy);font-weight:600;text-underline-offset:2px}
.quick-answer-facts li a:hover{color:var(--gold)}

/* ============================================================
   3 · ARTICLE READABILITY  —  rhythm & breathing room
   No content changes; spacing, measure & typography only.
   ============================================================ */
.article{
  padding-top:2.75rem;padding-bottom:3.75rem;
  line-height:1.85;
}
.article p{
  font-size:.97rem;line-height:1.9;color:var(--tm);
  margin-bottom:1.4rem;
  max-width:var(--read-measure);
}
/* Opening paragraph sets a calm, confident tone */
.article>p:first-of-type{
  font-size:1.08rem;line-height:1.8;color:var(--td);
}
.article h2{
  font-size:clamp(1.65rem,2.4vw,1.95rem);
  margin:3.25rem 0 1.1rem;line-height:1.25;letter-spacing:.005em;
  padding-top:.4rem;
}
/* Quiet gold accent above section headings aids scanning & progression */
.article h2::before{
  content:'';display:block;width:34px;height:2px;
  background:linear-gradient(90deg,var(--gold),var(--goldl));
  margin-bottom:1rem;border-radius:2px;opacity:.9;
}
.article h3{
  font-size:1.32rem;margin:2.75rem 0 .9rem;line-height:1.3;
}
.article ul,.article ol{margin:1.1rem 0 1.6rem 1.4rem;max-width:var(--read-measure)}
.article li{font-size:.96rem;line-height:1.75;margin-bottom:.55rem}
.article ul li{list-style:none;position:relative;padding-left:1.4rem}
.article ul li::before{
  content:'';position:absolute;left:.1rem;top:.7rem;
  width:6px;height:6px;border-radius:50%;
  background:var(--gold);
}
.article a{text-underline-offset:3px;text-decoration-thickness:1px;transition:color .2s var(--ease-soft)}
.article hr{margin:3rem 0}
.article figure{margin:2.5rem 0}
.article figure img{border-radius:var(--radius-lg,12px)}

/* Tables — calmer, more premium */
.table-wrap{
  margin:1.75rem 0 2.25rem;border:1px solid var(--border);
  border-radius:var(--radius-lg,12px);overflow:hidden;
  box-shadow:var(--shadow-sm);
}
.article table{font-size:.89rem}
.article thead th{padding:.85rem 1rem;font-weight:500;letter-spacing:.05em}
.article tbody td{padding:.8rem 1rem}
.article tbody tr:last-child td{border-bottom:none}

/* ============================================================
   4 · REUSABLE EXPERIENCE COMPONENTS
   Presentational treatments for the structures already present
   in every article: callouts ("What this means"), CTA blocks
   ("Next best step" / "Talk With Ray"), related situations,
   explore-related and official resources.
   ============================================================ */

/* "What this means" — the existing .callout, elevated */
.callout{
  background:linear-gradient(180deg,rgba(184,156,106,.10),rgba(184,156,106,.05));
  border:1px solid rgba(184,156,106,.28);
  border-left:3px solid var(--gold);
  border-radius:0 var(--radius-lg,12px) var(--radius-lg,12px) 0;
  padding:1.6rem 2rem;margin:2.25rem 0;
  box-shadow:var(--shadow-sm);max-width:var(--read-measure);
}
.callout p{font-size:.94rem;line-height:1.8;color:var(--tm)}
.callout p strong{color:var(--navy)}

/* "Next best step" / "Talk With Ray" — the existing .county-cta,
   aligned to the homepage talk-ray card. */
.county-cta{
  background:var(--cream);
  border:1px solid var(--border-gold);
  border-left:none;
  border-radius:var(--radius-lg,12px);
  padding:1.85rem 2.15rem;margin:2.75rem 0;
  gap:1.85rem;position:relative;overflow:hidden;
  box-shadow:var(--shadow-md);
}
.county-cta::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--gold),var(--goldl));
}
.county-cta-text h3{font-size:1.45rem;line-height:1.28;margin-bottom:.45rem}
.county-cta-text p{font-size:.9rem;line-height:1.7}
.county-cta-btn{
  padding:.9rem 2rem;border-radius:var(--radius);
  letter-spacing:.07em;
  transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out),background .25s;
}
.county-cta-btn:hover{
  background:var(--goldl);border-color:var(--goldl);
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(184,156,106,.32);
}

/* Related situations — homepage situation-card feel */
.related-situations h2{margin-bottom:1.4rem}
.rs-grid{gap:1.1rem}
.rs-card{
  padding:1.35rem 1.5rem;border-radius:var(--radius-lg,12px);
  border:1px solid var(--border);
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out),border-color .3s;
}
.rs-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-hover);
  border-color:var(--border-gold);
}
.rs-card h3{font-size:.95rem;line-height:1.4;margin-bottom:.35rem}
.rs-card p{font-size:.82rem;line-height:1.6}

/* Explore-related list */
.explore-related{
  border:1px solid var(--border-gold);
  border-radius:var(--radius-lg,12px);
  padding:2.4rem 2.6rem;margin:2.75rem 0 2.25rem;
}
.explore-related h4{font-size:1.35rem;margin-bottom:1.4rem}
.explore-related-grid a{
  padding:.7rem .5rem;font-size:.9rem;
  transition:color .2s var(--ease-soft),padding-left .2s var(--ease-soft);
}
.explore-related-grid a:hover{padding-left:.85rem}

/* Official resources cards */
.resources-grid{gap:1.1rem}
.resource-card{
  border-radius:0 var(--radius-lg,12px) var(--radius-lg,12px) 0;
  padding:1.35rem 1.5rem;
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out);
}
.resource-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)}
.resource-card .rc-cat{letter-spacing:.12em}

/* ============================================================
   5 · RIGHT-SIDE LEAD FORM  —  aligned to the homepage hero card
   Reassurance, trust and focus states brought into line.
   ============================================================ */
.blog-form-card{
  border-radius:16px;
  box-shadow:var(--shadow-card);
  border:1px solid rgba(184,156,106,.16);
}
.bfc-header{
  background:linear-gradient(135deg,var(--navy),var(--navy-light,#162847));
  padding:1.15rem 1.6rem 1rem;
  border-bottom:2px solid var(--gold);
}
.bfc-header h3{font-size:1.3rem;line-height:1.3;margin-bottom:.4rem}
.bfc-header p{font-size:.8rem;line-height:1.55;color:rgba(255,255,255,.62)}
.bfc-form{padding:1.15rem 1.6rem 1.35rem}
.bfc-field input,.bfc-field select{
  border-radius:8px;padding:.62rem .8rem;
  transition:border-color .2s var(--ease-soft),box-shadow .2s var(--ease-soft),background .2s;
}
.bfc-field input:focus,.bfc-field select:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(184,156,106,.16);
  background:#fffdf9;
}
.bfc-submit{
  padding:.85rem;letter-spacing:.09em;border-radius:var(--radius);
  transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out),background .25s;
}
.bfc-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(184,156,106,.34);
}
.bfc-reassurance{margin-top:.85rem;font-size:.72rem;line-height:1.5}

/* ============================================================
   6 · CTA CONSISTENCY
   One calm, gold, confident button treatment across every CTA
   surface (destinations & labels unchanged).
   ============================================================ */
.bfc-cta-btn,.cta-box .btn{
  border-radius:var(--radius);letter-spacing:.08em;
  transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out),background .25s,border-color .25s;
}
.bfc-cta-btn:hover,.cta-box .btn:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(184,156,106,.32);
}
.blog-final-cta{padding:3rem 2rem}
.blog-final-cta h3{font-size:1.7rem}
.blog-final-cta p{font-size:.92rem;line-height:1.8}

/* ============================================================
   7 · PROGRESSION & SECTION RHYTHM
   Gentle, consistent breathing room so readers move naturally:
   Quick Answer → content → FAQ → next step → Talk With Ray.
   ============================================================ */
.blog-search-section{padding-top:2.5rem;padding-bottom:2.5rem}
.resources-section,.related-situations{margin-top:3rem}

/* ============================================================
   ACCESSIBILITY
   Visible keyboard focus + honour reduced-motion preferences.
   ============================================================ */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
.rs-card:focus-visible,.resource-card:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:2px;
  border-radius:4px;
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    scroll-behavior:auto !important;
  }
  .rs-card:hover,.resource-card:hover,.county-cta-btn:hover,
  .bfc-submit:hover,.bfc-cta-btn:hover,.cta-box .btn:hover{transform:none}
}

/* ============================================================
   RESPONSIVE  —  mirror existing breakpoints; keep mobile intact
   ============================================================ */
@media(max-width:1024px){
  .blog-hero-inner{padding:5rem 3rem 1.5rem;gap:2rem}
}
@media(max-width:768px){
  .blog-hero::after{display:none}
  .blog-hero-inner{padding:4.25rem 1.25rem 1.75rem;gap:1.5rem}
  .article{padding-top:2rem;padding-bottom:2.75rem}
  .article p,.article>p:first-of-type{font-size:1rem}
  .article h2{margin-top:2.6rem}
  .callout{padding:1.35rem 1.35rem}
  .county-cta{padding:1.6rem 1.35rem}
  .county-cta-btn{width:100%;text-align:center}
  .explore-related{padding:1.8rem 1.5rem}
  .quick-answer-body{padding:1.2rem 1.35rem 1.35rem}
  .blog-final-cta{padding:2.5rem 1.25rem}
}

/* ── Talk With Ray — reusable human trust component ──────────────────────
   Additive trust module for the shared article template. Mirrors the
   homepage v2 talk-ray card: cream panel, gold accent bar, serif heading,
   round portrait, and the site's consistent gold CTA button (.county-cta-btn).
   Markup is single-sourced in /talk-with-ray.js so future templates
   (guides, authority hubs, county & city pages) reuse the same component. */
.twr{
  background:var(--cream);
  border:1px solid var(--border-gold);
  border-radius:var(--radius-lg,12px);
  padding:2.25rem 2.5rem;margin:3rem 0;
  position:relative;overflow:hidden;
  box-shadow:var(--shadow-md);
}
.twr::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--gold),var(--goldl));
}
.twr-inner{display:flex;align-items:flex-start;gap:1.85rem}
.twr-photo{
  width:96px;height:96px;border-radius:50%;object-fit:cover;
  flex-shrink:0;border:2px solid var(--gold);box-shadow:var(--shadow-sm);
}
.twr-body{flex:1 1 auto;min-width:0}
.twr-eyebrow{
  font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin:0 0 .5rem;
}
.twr-heading{
  font-family:'Cormorant Garamond',serif;font-weight:400;
  font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.2;color:var(--navy);
  margin:0 0 .85rem;
}
.twr-heading span{display:block}
.twr-adaptive{font-size:.98rem;line-height:1.6;color:var(--navy);font-weight:600;margin:0 0 .95rem}
.twr-intro{font-size:.92rem;line-height:1.78;color:var(--tm);margin:0 0 1.15rem}
.twr-intro strong{color:var(--td)}
.twr-points{
  list-style:none;margin:0 0 1.5rem;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:.55rem 1.5rem;
}
.twr-points li{position:relative;padding-left:1.6rem;font-size:.88rem;line-height:1.5;color:var(--td)}
.twr-points li::before{content:'\2713';position:absolute;left:0;top:0;color:var(--gold);font-weight:700}
.twr .county-cta-btn{white-space:nowrap}

@media(max-width:768px){
  .twr{padding:1.65rem 1.35rem;margin:2.5rem 0}
  .twr-inner{flex-direction:column;align-items:center;text-align:center;gap:1.2rem}
  .twr-points{grid-template-columns:1fr;gap:.6rem;text-align:left;display:inline-grid}
  .twr-photo{width:88px;height:88px}
  .twr .county-cta-btn{width:100%;text-align:center}
}

/* ============================================================
   DESKTOP EXPERIENCE 1.0  —  premium wide-screen presentation
   ------------------------------------------------------------
   Purely ADDITIVE, min-width only. The locked mobile experience
   lives entirely at max-width:768px (vmx-mobile.css), so nothing
   below only strengthens the desktop reading + hero surface and
   can never reach mobile. Homepage desktop is the reference:
   a calm ~1400px frame, generous whitespace, a richer type scale
   and higher-impact imagery — the premium version of the same
   editorial product, not a mirror of it.

   Applies wherever this shared stylesheet loads: city, county,
   guide, article and hub pages — so they read as one platform.
   No DOM, content, heading, schema, link, form or CTA-destination
   change; presentation only.
   ============================================================ */
@media(min-width:1024px){
  /* Editorial hero: more air + a slightly stronger title so the
     opening reads as a confident, premium first impression. */
  .blog-hero-inner{padding:6.5rem 4.5rem 3rem;gap:4rem}
  .blog-hero h1{font-size:clamp(2.4rem,3.6vw,3.15rem)}
  .blog-hero .eyebrow{margin-bottom:1.55rem}
  /* Higher-impact hero photography (guide / article landmark image). */
  .hero-img-wrap img{max-height:460px}
  /* Calmer section rhythm through long reading. */
  .article h2{margin-top:3.6rem}
  .callout{margin:2.5rem 0}
  /* CTA surfaces gain a touch more presence. */
  .county-cta{padding:2rem 2.4rem}
  .blog-final-cta{padding:3.35rem 2.5rem}
}
@media(min-width:1440px){
  /* The reading measure opens slightly on large screens so the
     text column uses its container without becoming a thin ribbon,
     while staying inside a comfortable line length. */
  :root{--read-measure:760px}
  .blog-hero-inner{padding:7.25rem 5rem 3.5rem;gap:4.5rem}
  .blog-hero h1{font-size:clamp(2.8rem,3.4vw,3.5rem)}
  .blog-hero .eyebrow{margin-bottom:1.75rem}
  .hero-img-wrap img{max-height:520px}
  .quick-answer-body{padding:1.7rem 2rem 1.8rem}
  .callout{padding:1.85rem 2.4rem}
  .county-cta{padding:2.2rem 2.7rem}
  .county-cta-text h3{font-size:1.55rem}
  .twr{padding:2.75rem 3rem}
  .explore-related{padding:2.8rem 3rem}
  .blog-final-cta{padding:3.85rem 3rem}
  .blog-final-cta h3{font-size:1.95rem}
}
@media(min-width:1600px){
  :root{--read-measure:780px}
  .blog-hero h1{font-size:clamp(3rem,3.2vw,3.7rem)}
  .hero-img-wrap img{max-height:560px}
}

/* /production-standard.css */
@media screen and (max-width:768px){
/* Viera Mobile Experience 2.0 — premium mobile product layer. */
body[data-vmx="1"] .vmx-toc-toggle {
  display: none;
}

.mobile-home-hero,
.fin-bridge-mobile-copy,
.final-cta-mobile-copy {
  display: none;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] {
  display: none;
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 99;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] .mobile-sticky-cta-inner {
  display: flex;
  max-width: 480px;
  margin: 0 auto;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  text-align: center;
  text-decoration: none;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* Resource Center 1.0 — blog-only clone of the approved homepage mobile system. */
.vmx-mobile-card-image,
.vmx-swipe-cue,
body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
  display: none;
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="blog"] {
    --vrc-ink: #14273f;
    --vrc-copy: #405064;
    --vrc-canvas: #f2efe7;
    --vrc-paper: #fffdf8;
    --vrc-sage: #dce5dc;
    --vrc-sage-deep: #6f816f;
    --vrc-gold: #ad8b53;
    --vrc-line: rgba(20, 39, 63, 0.11);
    --vrc-radius: 20px;
    --vrc-shadow: 0 8px 24px rgba(20, 39, 63, 0.07);
    background: var(--vrc-canvas) !important;
    color: var(--vrc-copy) !important;
    padding-bottom: calc(72px + env(safe-area-inset-bottom));
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.hero, .search-section, .gux-section, .recent-guides, .fin-ready-section, .guidance-section, footer) {
    scroll-margin-top: calc(76px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero {
    padding: calc(6.15rem + env(safe-area-inset-top)) var(--vmx-page-gutter) 2rem !important;
    background: linear-gradient(145deg, rgba(255, 253, 248, 0.99), rgba(242, 239, 231, 0.97)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-inner {
    width: 100%;
    max-width: 42rem;
    margin: 0 auto;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero h1 {
    max-width: 10.8em !important;
    margin: 0 0 1rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(2.25rem, 9.7vw, 2.85rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.025em !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero h1 em {
    color: var(--vrc-ink) !important;
    text-decoration: underline;
    text-decoration-color: rgba(173, 139, 83, 0.58);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.1em;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-sub {
    max-width: 38rem;
    margin: 0 !important;
    color: var(--vrc-copy) !important;
    font-size: clamp(1.06rem, 4.4vw, 1.16rem) !important;
    line-height: 1.7 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-positioning {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.55rem !important;
    margin: 1.25rem 0 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-positioning-badge {
    min-height: 44px;
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(111, 129, 111, 0.18);
    border-radius: 14px;
    color: #526255 !important;
    background: rgba(220, 229, 220, 0.56);
    font-size: 0.78rem !important;
    line-height: 1.4;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-section--blog {
    padding: 1.5rem var(--vmx-page-gutter) 2rem !important;
    border: 0 !important;
    background: var(--vrc-canvas) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-inner {
    max-width: 42rem;
    padding: 1.35rem !important;
    border: 1px solid var(--vrc-line);
    border-radius: var(--vrc-radius);
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-heading {
    margin-bottom: 0.55rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(1.7rem, 7.6vw, 2rem) !important;
    line-height: 1.12 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-sub {
    margin-bottom: 1rem !important;
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.68 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-bar-wrap {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 0.55rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-input {
    width: 100%;
    min-width: 0;
    min-height: 52px !important;
    padding: 0.8rem 0.9rem !important;
    border: 1px solid rgba(20, 39, 63, 0.22) !important;
    border-radius: 13px !important;
    color: var(--vrc-ink) !important;
    background: #fff !important;
    font-size: 1rem !important;
    line-height: 1.3;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-btn {
    min-width: 88px;
    min-height: 52px !important;
    padding: 0.75rem 1rem !important;
    border: 1px solid var(--vrc-gold) !important;
    border-radius: 13px !important;
    color: #fff !important;
    background: var(--vrc-ink) !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.search-input, .search-btn, .search-chip, .gux-card, .browse-group a, .recent-guide-card, .mobile-sticky-cta a):focus-visible {
    outline: 3px solid #d6a74a !important;
    outline-offset: 3px !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-chips {
    display: flex !important;
    gap: 0.55rem !important;
    margin: 1rem calc(var(--vmx-page-gutter) * -0.25) 0 !important;
    padding: 0.15rem calc(var(--vmx-page-gutter) * 0.25) 0.45rem !important;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-chips::-webkit-scrollbar { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] .search-chip {
    flex: 0 0 auto;
    min-height: 44px !important;
    padding: 0.6rem 0.8rem !important;
    border: 1px solid rgba(111, 129, 111, 0.25) !important;
    border-radius: 12px !important;
    color: var(--vrc-ink) !important;
    background: rgba(220, 229, 220, 0.5) !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    scroll-snap-align: start;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-section, .recent-guides, .fin-ready-section, .guidance-section) {
    padding: 3rem var(--vmx-page-gutter) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-section--white, .recent-guides, .fin-ready-section) {
    border: 0 !important;
    background: var(--vrc-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-section--cream {
    border: 0 !important;
    background: var(--vrc-canvas) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-inner, .recent-guides-inner, .fin-ready, .guidance-inner) {
    max-width: 42rem;
    margin-inline: auto;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.situation-header, .recent-guides-header) {
    margin-bottom: 1.5rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.situation-header h2, .recent-guides-header h2, .fin-ready-title, .guidance-heading) {
    margin: 0.9rem 0 0.65rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(2rem, 8.6vw, 2.4rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.025em !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.section-desc, .recent-guides-header p, .fin-ready-note, .guidance-sub) {
    max-width: 38rem;
    color: var(--vrc-copy) !important;
    font-size: 1.06rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.8rem !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card {
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 1.05rem !important;
    border: 1px solid var(--vrc-line) !important;
    border-radius: 18px !important;
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card::before { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-icon {
    width: 42px !important;
    height: 42px !important;
    margin: 0 0 0.8rem !important;
    padding: 0.55rem;
    border-radius: 12px;
    color: var(--vrc-ink) !important;
    background: var(--vrc-sage);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-title {
    margin-bottom: 0.55rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(1.28rem, 5.4vw, 1.5rem) !important;
    line-height: 1.15 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-desc {
    margin-bottom: 0.85rem !important;
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.58 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-card-link,
  body[data-vmx="1"][data-vmx-page="blog"] .browse-view-link {
    color: #6f542b !important;
    font-size: 0.8rem !important;
    line-height: 1.35 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-swipe-cue {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: -0.35rem 0 0.8rem;
    color: #5b6d5d;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-swipe-cue::after {
    content: "→";
    font-size: 1rem;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column !important;
    grid-auto-columns: min(82vw, 330px) !important;
    gap: 1rem !important;
    margin-inline: calc(var(--vmx-page-gutter) * -1) !important;
    padding: 0.2rem var(--vmx-page-gutter) 1.25rem !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--vmx-page-gutter);
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid)::-webkit-scrollbar { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid .gux-card, .vmx-workbook-grid .gux-card, .recent-guide-card) {
    min-width: 0 !important;
    min-height: 100% !important;
    padding: 1.25rem !important;
    border: 1px solid var(--vrc-line) !important;
    border-radius: var(--vrc-radius) !important;
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow) !important;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card {
    padding-top: 0 !important;
    overflow: hidden;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card::before,
  body[data-vmx="1"][data-vmx-page="blog"] .vmx-workbook-grid .gux-card::before { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-mobile-card-image {
    display: block;
    width: calc(100% + 2.5rem);
    max-width: none;
    height: 176px;
    margin: 0 -1.25rem 1.15rem;
    object-fit: cover;
    object-position: center;
    background: var(--vrc-sage);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card:first-child .vmx-mobile-card-image {
    object-position: center 42%;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid) .gux-card-title {
    color: var(--vrc-ink) !important;
    font-size: clamp(1.42rem, 6vw, 1.65rem) !important;
    line-height: 1.16 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid) .gux-card-desc {
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-card-tag {
    color: #6f542b !important;
    font-size: 0.74rem !important;
    line-height: 1.35 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .workbook-downloads {
    margin-top: 2.75rem !important;
    padding-top: 2.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group {
    padding: 1.25rem !important;
    border: 1px solid var(--vrc-line) !important;
    border-radius: var(--vrc-radius) !important;
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-head {
    align-items: flex-start !important;
    gap: 0.75rem !important;
    margin-bottom: 0.85rem !important;
    padding-bottom: 0.85rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-head svg {
    width: 42px !important;
    height: 42px !important;
    padding: 0.55rem;
    border-radius: 12px;
    color: var(--vrc-ink) !important;
    background: var(--vrc-sage);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-title {
    padding-top: 0.35rem;
    color: var(--vrc-ink) !important;
    font-size: clamp(1.4rem, 6.1vw, 1.65rem) !important;
    line-height: 1.16 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-desc,
  body[data-vmx="1"][data-vmx-page="blog"] .browse-list a {
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-list li { margin-bottom: 0.4rem !important; }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-list a {
    min-height: 44px;
    padding: 0.45rem 0;
    align-items: flex-start !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .recent-guide-card {
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
    min-height: 220px !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .rgc-tag {
    color: #6f542b !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .rgc-title {
    color: var(--vrc-ink) !important;
    font-size: clamp(1.4rem, 6vw, 1.65rem) !important;
    line-height: 1.18 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .rgc-date {
    color: var(--vrc-copy) !important;
    font-size: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready-section {
    background: var(--vrc-sage) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready {
    padding: 1.4rem !important;
    border: 1px solid rgba(20, 39, 63, 0.12) !important;
    border-radius: var(--vrc-radius) !important;
    background: rgba(255, 253, 248, 0.82) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready-eyebrow {
    color: #596b5b !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready-cta {
    width: 100%;
    min-height: 50px;
    border-radius: 13px !important;
    color: #fff !important;
    background: var(--vrc-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-section {
    background: linear-gradient(165deg, #14273f, #0c1a2d) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-heading,
  body[data-vmx="1"][data-vmx-page="blog"] .guidance-sub,
  body[data-vmx="1"][data-vmx-page="blog"] .guidance-section :where(label, .guidance-reassurance, .guidance-support-line) {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-sub,
  body[data-vmx="1"][data-vmx-page="blog"] .guidance-section .form-trust-values li {
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .form-trust-values {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: start !important;
    gap: 0.55rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-form {
    margin-top: 1.5rem;
    padding: 1.15rem !important;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--vrc-radius);
    background: rgba(255, 255, 255, 0.06);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-fields {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-field :where(input, select) {
    width: 100%;
    min-height: 50px !important;
    border-radius: 12px !important;
    font-size: 1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-btn {
    width: 100%;
    min-height: 50px !important;
    border-radius: 13px !important;
    color: var(--vrc-ink) !important;
    background: #e7d8bd !important;
    font-size: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] footer {
    padding: 3rem var(--vmx-page-gutter) calc(2rem + env(safe-area-inset-bottom)) !important;
    background: #060d1a !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-top {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-brand { max-width: none !important; }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-brand p,
  body[data-vmx="1"][data-vmx-page="blog"] .footer-col a,
  body[data-vmx="1"][data-vmx-page="blog"] .footer-nap-inner,
  body[data-vmx="1"][data-vmx-page="blog"] .footer-linkedin a,
  body[data-vmx="1"][data-vmx-page="blog"] .fcopy {
    font-size: 0.94rem !important;
    line-height: 1.68 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.75rem 1rem !important;
    width: 100%;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-col h4 {
    margin-bottom: 0.65rem !important;
    font-size: 0.78rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-col a {
    min-height: 44px;
    margin: 0 !important;
    padding: 0.35rem 0;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-nap-inner {
    align-items: stretch !important;
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-nap-col {
    width: 100%;
    padding: 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-seo-links {
    justify-content: flex-start !important;
    gap: 0.4rem 1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-seo-links a {
    min-height: 44px;
    font-size: 0.85rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
    display: block !important;
    padding-top: 0.45rem !important;
    padding-bottom: calc(0.45rem + env(safe-area-inset-bottom)) !important;
    background: rgba(15, 31, 56, 0.98) !important;
    border-top: 1px solid rgba(169, 131, 75, 0.4) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta-inner {
    grid-template-columns: minmax(74px, 0.85fr) 48px minmax(120px, 1.3fr) !important;
    align-items: stretch !important;
    gap: 0.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta a {
    display: inline-flex !important;
    min-height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta .msc-review {
    border-color: var(--vrc-gold) !important;
    color: var(--vrc-ink) !important;
    background: #e7d8bd !important;
    font-weight: 700 !important;
  }
}

@media screen and (max-width: 340px) {
  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    grid-template-columns: 1fr !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-bar-wrap {
    grid-template-columns: 1fr !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid, .search-chips) {
    scroll-behavior: auto !important;
  }
}

/*
 * VMX 2.0 visual direction
 * A calm, editorial New Jersey property help center composed specifically for phones.
 */
@media screen and (max-width: 768px) {
  body[data-vmx="1"] {
    --vmx-page-gutter: clamp(1.1rem, 5.4vw, 1.5rem);
    --vmx-ink: #14273f;
    --vmx-ink-soft: #405064;
    --vmx-paper: #fffdf8;
    --vmx-canvas: #f2efe7;
    --vmx-sage: #dce5dc;
    --vmx-sage-deep: #6f816f;
    --vmx-sand: #e7d8bd;
    --vmx-gold: #ad8b53;
    --vmx-coral: #b9664b;
    --vmx-line: rgba(20, 39, 63, 0.11);
    --vmx-card-shadow: 0 18px 50px rgba(20, 39, 63, 0.1);
    --vmx-card-shadow-soft: 0 8px 24px rgba(20, 39, 63, 0.07);
    color: var(--vmx-ink-soft);
    background: var(--vmx-canvas);
  }

  body[data-vmx="1"]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
      radial-gradient(circle at 100% 8%, rgba(173, 139, 83, 0.12), transparent 24rem),
      radial-gradient(circle at 0 42%, rgba(111, 129, 111, 0.11), transparent 22rem),
      var(--vmx-canvas);
  }

  body[data-vmx="1"] :where(h1, h2, h3, h4) {
    color: var(--vmx-ink);
    text-wrap: balance;
  }

  body[data-vmx="1"] :where(p, li) {
    line-height: 1.72;
  }

  body[data-vmx="1"] nav {
    min-height: calc(70px + env(safe-area-inset-top));
    padding: calc(0.7rem + env(safe-area-inset-top)) var(--vmx-page-gutter) 0.7rem !important;
    background: rgba(16, 35, 57, 0.96) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 30px rgba(9, 23, 39, 0.16) !important;
    backdrop-filter: blur(18px);
  }

  body[data-vmx="1"] nav::after {
    content: "NJ Property Help Center";
    position: absolute;
    left: var(--vmx-page-gutter);
    bottom: 0.45rem;
    color: rgba(255, 255, 255, 0.62);
    font: 600 0.58rem/1.1 'DM Sans', sans-serif;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    pointer-events: none;
  }

  body[data-vmx="1"] nav :where(.nlogo, .logo, .nav-logo) {
    align-self: flex-start;
  }

  body[data-vmx="1"] nav :where(.nlogo-img, .logo-img, .nav-logo img, img) {
    max-width: min(178px, 56vw) !important;
    max-height: 34px !important;
  }

  body[data-vmx="1"] .mobile-menu-btn {
    flex-basis: 46px;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.07) !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    top: calc(70px + env(safe-area-inset-top)) !important;
    padding: 1rem var(--vmx-page-gutter) calc(1.5rem + env(safe-area-inset-bottom)) !important;
    background: rgba(16, 35, 57, 0.985) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) li {
    border-bottom-color: rgba(255, 255, 255, 0.09) !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) a {
    min-height: 54px;
    font-size: 1rem !important;
  }

  /* Heroes become editorial opening screens rather than compressed desktop banners. */
  body[data-vmx="1"] :where(.hero, .blog-hero, .rc-hero) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
      linear-gradient(145deg, rgba(255, 253, 248, 0.99), rgba(242, 239, 231, 0.97)) !important;
    border-bottom: 0 !important;
  }

  body[data-vmx="1"] :where(.hero, .blog-hero, .rc-hero)::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 15rem;
    height: 15rem;
    right: -7rem;
    top: 5rem;
    border: 1px solid rgba(173, 139, 83, 0.25);
    border-radius: 48% 52% 42% 58%;
    background: rgba(220, 229, 220, 0.54);
    transform: rotate(18deg);
  }

  body[data-vmx="1"] .hero,
  body[data-vmx="1"] .rc-hero {
    padding-top: calc(6.25rem + env(safe-area-inset-top)) !important;
    padding-bottom: 2.4rem !important;
  }

  body[data-vmx="1"] .blog-hero-inner {
    padding-top: calc(6.25rem + env(safe-area-inset-top)) !important;
    padding-bottom: 2.4rem !important;
  }

  body[data-vmx="1"] :where(.hero-inner, .blog-hero-inner, .rc-hero-inner, .hero-grid) {
    gap: 1.65rem !important;
  }

  body[data-vmx="1"] :where(.eyebrow, .hero .eyebrow, .section-eyebrow) {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.5rem 0.72rem;
    border: 1px solid rgba(111, 129, 111, 0.25);
    border-radius: 999px;
    color: #566c59 !important;
    background: rgba(220, 229, 220, 0.72);
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"] :where(.hero h1, .blog-hero h1, .rc-hero h1) {
    max-width: 11.5em;
    color: var(--vmx-ink) !important;
    font-size: clamp(2.45rem, 11vw, 3.35rem) !important;
    font-weight: 500 !important;
    line-height: 0.98 !important;
    letter-spacing: -0.035em !important;
    text-shadow: none !important;
  }

  body[data-vmx="1"] :where(.hero-sub, .hero-desc, .rc-hero-desc, .rc-hero-subtitle) {
    color: var(--vmx-ink-soft) !important;
    font-size: 1.02rem !important;
    line-height: 1.7 !important;
  }

  body[data-vmx="1"] :where(.hero-sub, .hero-desc, .rc-hero-desc) a {
    color: var(--vmx-ink) !important;
    border-bottom-color: rgba(173, 139, 83, 0.6) !important;
  }

  body[data-vmx="1"] :where(.hero-reassure, .hero-qa, .rc-hero-subtitle) {
    position: relative;
    margin: 0 0 1.25rem !important;
    padding: 0.9rem 1rem 0.9rem 2.8rem !important;
    border: 1px solid rgba(111, 129, 111, 0.18);
    border-radius: 16px;
    color: #526255 !important;
    background: rgba(220, 229, 220, 0.56);
    font-size: 0.86rem !important;
    line-height: 1.55 !important;
  }

  body[data-vmx="1"] :where(.hero-reassure, .hero-qa, .rc-hero-subtitle)::before {
    content: "✓";
    position: absolute;
    left: 1rem;
    top: 0.87rem;
    width: 1.25rem;
    height: 1.25rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: white;
    background: var(--vmx-sage-deep);
    font: 700 0.7rem/1 'DM Sans', sans-serif;
  }

  body[data-vmx="1"] :where(.hero-ctas, .rc-hero-ctas) {
    gap: 0.7rem !important;
    margin-bottom: 1.3rem !important;
  }

  body[data-vmx="1"] :where(.btn-primary, .ncta, .county-cta-btn, .hc-submit, .lcf-submit, .bfc-submit, .guidance-btn) {
    min-height: 54px !important;
    padding: 0.95rem 1.2rem !important;
    border: 1px solid var(--vmx-ink) !important;
    border-radius: 16px !important;
    color: #fff !important;
    background: var(--vmx-ink) !important;
    box-shadow: 0 10px 24px rgba(20, 39, 63, 0.2) !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.025em !important;
    text-transform: none !important;
    transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
  }

  body[data-vmx="1"] :where(.btn-primary, .ncta, .county-cta-btn, .hc-submit, .lcf-submit, .bfc-submit, .guidance-btn):active {
    transform: scale(0.985);
    box-shadow: 0 5px 14px rgba(20, 39, 63, 0.16) !important;
  }

  body[data-vmx="1"] :where(.btn-soft, .btn-ghost, .btn-outline-white) {
    min-height: 52px !important;
    border: 1px solid rgba(20, 39, 63, 0.16) !important;
    border-radius: 16px !important;
    color: var(--vmx-ink) !important;
    background: rgba(255, 255, 255, 0.72) !important;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card, .rc-hero-right) {
    padding: 1.4rem !important;
    border: 1px solid rgba(255, 255, 255, 0.9) !important;
    border-radius: 26px !important;
    background: rgba(255, 255, 255, 0.88) !important;
    box-shadow: var(--vmx-card-shadow) !important;
    backdrop-filter: blur(16px);
  }

  body[data-vmx="1"] .vmx-mobile-form-stage {
    position: relative;
    z-index: 2;
    margin: -0.45rem var(--vmx-page-gutter) 2rem;
  }

  body[data-vmx="1"] .vmx-mobile-form-stage::before {
    content: "Private property review";
    display: block;
    width: fit-content;
    margin: 0 0 0.7rem 0.8rem;
    padding: 0.4rem 0.65rem;
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.9);
    background: var(--vmx-ink);
    font: 700 0.61rem/1 'DM Sans', sans-serif;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card, .rc-hero-right) :where(h2, h3, p, label, li) {
    color: var(--vmx-ink-soft) !important;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card, .rc-hero-right) :where(h2, h3) {
    color: var(--vmx-ink) !important;
  }

  body[data-vmx="1"] :where(.hero-card-values, .hero-trust-badges, .hero-positioning) {
    gap: 0.55rem !important;
  }

  body[data-vmx="1"] :where(.hero-card-values li, .hero-badge, .hero-positioning-badge, .rc-hero-trust-item) {
    min-height: 36px;
    padding: 0.55rem 0.72rem !important;
    border: 1px solid rgba(20, 39, 63, 0.1) !important;
    border-radius: 999px !important;
    color: var(--vmx-ink-soft) !important;
    background: rgba(255, 255, 255, 0.68) !important;
    font-size: 0.68rem !important;
  }

  body[data-vmx="1"] input:not([type="checkbox"]):not([type="radio"]),
  body[data-vmx="1"] select,
  body[data-vmx="1"] textarea {
    min-height: 52px !important;
    border: 1px solid rgba(20, 39, 63, 0.14) !important;
    border-radius: 14px !important;
    color: var(--vmx-ink) !important;
    background: #faf8f2 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }

  body[data-vmx="1"] input:focus,
  body[data-vmx="1"] select:focus,
  body[data-vmx="1"] textarea:focus {
    border-color: var(--vmx-gold) !important;
    background: #fff !important;
  }

  /* Homepage hero — warmer editorial ambiance: subtle gold glow, gentle
     brand accent, and cleaner separation between the message and the CTA.
     No photograph added; the opening stays editorial and lightweight. */
  body[data-vmx="1"][data-vmx-page="home"] .hero {
    background:
      radial-gradient(118% 70% at 50% 0%, rgba(184, 156, 106, 0.16) 0%, rgba(184, 156, 106, 0.05) 34%, rgba(247, 244, 239, 0) 66%),
      linear-gradient(160deg, rgba(255, 253, 248, 0.99), rgba(242, 239, 231, 0.97)) !important;
    padding-bottom: 2.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-left > h1 {
    margin-bottom: 0.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-left > .hero-ctas {
    margin-top: 0.55rem !important;
    margin-bottom: 1.6rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    margin-top: 0.45rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section, .start-here-section, .search-resource-center, .risks-section, .process-section, .founder-section, .talk-ray-section) {
    padding: 3.65rem var(--vmx-page-gutter) !important;
    border: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section:nth-of-type(even), .start-here-section, .risks-section, .founder-section) {
    background: rgba(255, 253, 248, 0.88) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header, .search-resource-inner, .start-here-inner) {
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .search-resource-inner h2, .start-here-inner h2, .risks-inner h2) {
    margin-top: 0.85rem !important;
    color: var(--vmx-ink) !important;
    font-size: clamp(2rem, 9vw, 2.7rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.025em;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-desc, .src-desc, .sh-desc) {
    margin-left: 0 !important;
    font-size: 0.96rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.situations-grid, .recent-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column;
    grid-auto-columns: min(84vw, 330px);
    gap: 1rem !important;
    width: calc(100% + var(--vmx-page-gutter));
    max-width: none !important;
    padding: 0.4rem var(--vmx-page-gutter) 1.1rem 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.situations-grid, .recent-grid)::-webkit-scrollbar {
    display: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.sit-card, .recent-card) {
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card {
    display: flex !important;
    min-height: 300px !important;
    padding: 1.55rem !important;
    border: 1px solid rgba(20, 39, 63, 0.09) !important;
    border-radius: 26px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card:nth-child(3n + 1) { background: #fffdf8 !important; }
  body[data-vmx="1"][data-vmx-page="home"] .sit-card:nth-child(3n + 2) { background: #edf2ec !important; }
  body[data-vmx="1"][data-vmx-page="home"] .sit-card:nth-child(3n + 3) { background: #f3e9dc !important; }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card-icon {
    width: 50px !important;
    height: 50px !important;
    margin: 0 0 auto !important;
    padding: 0.72rem;
    border-radius: 16px;
    color: var(--vmx-ink) !important;
    background: rgba(255, 255, 255, 0.72);
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card :where(h3, p, .sit-card-link) {
    grid-column: auto;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card h3 {
    margin-top: 1.3rem;
    font-size: 1.65rem !important;
    line-height: 1.08 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card-link {
    margin-top: auto;
    color: var(--vmx-ink) !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card {
    padding: 0 !important;
    overflow: hidden;
    border: 0 !important;
    border-radius: 26px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-img {
    width: 100%;
    height: 190px !important;
    object-fit: cover;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-body {
    padding: 1.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-grid {
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-card {
    min-height: 82px !important;
    padding: 1rem 1.1rem !important;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, 0.82) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-emoji {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: var(--vmx-sage);
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.risk-card, .process-step, .faq-item) {
    border: 1px solid var(--vmx-line) !important;
    border-radius: 22px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-card {
    padding: 1.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-step {
    position: relative;
    padding: 1.4rem 1.3rem 1.4rem 4.3rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-num {
    position: absolute;
    left: 1.2rem;
    top: 1.35rem;
    width: 2.25rem;
    height: 2.25rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: white !important;
    background: var(--vmx-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-trigger {
    min-height: 64px;
    padding: 1rem 1.1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.search-resource-center, .talk-ray-section) {
    margin: 0 var(--vmx-page-gutter) 2rem;
    padding: 1.7rem !important;
    border-radius: 28px !important;
    background: var(--vmx-ink) !important;
    box-shadow: var(--vmx-card-shadow);
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.search-resource-center, .talk-ray-section) :where(h2, h3, p, .src-desc) {
    color: rgba(255, 255, 255, 0.84) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.search-resource-center, .talk-ray-section) :where(h2, h3) {
    color: white !important;
  }

  /* Reading screens: content is grouped into calm, purposeful modules. */
  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) {
    color: var(--vmx-ink-soft) !important;
    background: transparent !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) > p {
    margin-bottom: 1.35rem !important;
    font-size: 1.02rem !important;
    line-height: 1.82 !important;
  }

  body[data-vmx="1"] .rc-content {
    padding-top: 1.4rem !important;
  }

  body[data-vmx="1"] .rc-section {
    margin: 0 0 1.15rem !important;
    padding: 1.45rem 1.25rem !important;
    border: 1px solid rgba(20, 39, 63, 0.08) !important;
    border-radius: 26px !important;
    background: rgba(255, 253, 248, 0.94) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"] .rc-section:nth-child(4n + 1) {
    background: rgba(237, 242, 236, 0.96) !important;
  }

  body[data-vmx="1"] .rc-section-header {
    display: block !important;
    margin-bottom: 1.35rem !important;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--vmx-line);
  }

  body[data-vmx="1"] .rc-section-num {
    width: fit-content;
    margin-bottom: 0.7rem;
    padding: 0.42rem 0.62rem;
    border-radius: 999px;
    color: #5d6f60 !important;
    background: var(--vmx-sage) !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  body[data-vmx="1"] .rc-section-header h2,
  body[data-vmx="1"] :where(.article, .guide-content) h2 {
    color: var(--vmx-ink) !important;
    font-size: clamp(1.85rem, 8.2vw, 2.4rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.025em;
  }

  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) h3 {
    margin-top: 2rem !important;
    font-size: 1.45rem !important;
    line-height: 1.2 !important;
  }

  body[data-vmx="1"] :where(.quick-answer, .rc-warning, .callout, .cta-decision-point, .cta-mid-guidance) {
    position: relative;
    margin: 1.5rem 0 !important;
    padding: 1.35rem 1.25rem !important;
    border: 0 !important;
    border-radius: 22px !important;
    background: #e8eee6 !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(.rc-warning, .callout)::before {
    content: "Important";
    display: block;
    width: fit-content;
    margin-bottom: 0.8rem;
    padding: 0.38rem 0.58rem;
    border-radius: 999px;
    color: #fff;
    background: var(--vmx-coral);
    font: 700 0.6rem/1 'DM Sans', sans-serif;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  body[data-vmx="1"] .rc-warning {
    background: #f3e5de !important;
  }

  body[data-vmx="1"] :where(.rc-checklist, .rc-mistakes) {
    display: grid;
    gap: 0.75rem;
    padding: 0 !important;
  }

  body[data-vmx="1"] :where(.rc-checklist li, .rc-mistake) {
    margin: 0 !important;
    padding: 1rem 1rem 1rem 3.15rem !important;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, 0.76) !important;
  }

  body[data-vmx="1"] .rc-checklist .rc-check {
    left: 1rem !important;
    top: 1.05rem !important;
    width: 1.45rem !important;
    height: 1.45rem !important;
    border-radius: 50% !important;
    background: var(--vmx-sage-deep) !important;
  }

  body[data-vmx="1"] :where(.rc-icon-cards, .rc-official-grid, .rc-related-grid, .related-grid, .gux-grid, .recent-guides-grid) {
    gap: 0.9rem !important;
  }

  body[data-vmx="1"] :where(.rc-icon-card, .rc-official-card, .rc-related, .related-card, .gux-card, .recent-guide-card) {
    padding: 1.3rem !important;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 22px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"] :where(.rc-faq-item, .faq-item) {
    margin-bottom: 0.7rem !important;
    overflow: hidden;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 19px !important;
    background: var(--vmx-paper) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(.rc-faq-trigger, .faq-trigger) {
    min-height: 64px;
    padding: 1rem !important;
  }

  body[data-vmx="1"] .rc-toc {
    margin-top: -1.2rem !important;
    border: 1px solid rgba(20, 39, 63, 0.08) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    box-shadow: var(--vmx-card-shadow-soft);
  }

  body[data-vmx="1"] .vmx-toc-toggle {
    min-height: 58px;
    padding: 0.95rem 1rem;
    color: var(--vmx-ink);
  }

  /* Resource center and guides use card decks instead of long desktop grids. */
  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-grid, .recent-guides-grid),
  body[data-vmx="1"] :where(.rc-related-grid, .related-grid) {
    grid-auto-columns: min(84vw, 330px) !important;
    gap: 1rem !important;
    padding-bottom: 1.15rem !important;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-card, .recent-guide-card) {
    min-height: 250px;
    padding: 1.45rem !important;
    border-radius: 24px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  /* Sticky action is a quiet, integrated system bar. */
  body[data-vmx="1"] .mobile-sticky-cta {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    padding: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.11) !important;
    background: rgba(16, 35, 57, 0.97) !important;
    box-shadow: 0 -12px 32px rgba(9, 23, 39, 0.16) !important;
    backdrop-filter: blur(18px);
  }

  body[data-vmx="1"] .mobile-sticky-cta-inner {
    min-height: calc(68px + env(safe-area-inset-bottom));
    padding: 0.65rem var(--vmx-page-gutter) calc(0.65rem + env(safe-area-inset-bottom)) !important;
    gap: 0.55rem !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a {
    min-height: 44px !important;
    border-radius: 13px !important;
    font-size: 0.69rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.015em !important;
    text-transform: none !important;
  }

  body[data-vmx="1"] :where(.msc-call, .msc-text) {
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    color: rgba(255, 255, 255, 0.88) !important;
    background: rgba(255, 255, 255, 0.07) !important;
  }

  body[data-vmx="1"] .msc-review {
    border-color: var(--vmx-sand) !important;
    color: var(--vmx-ink) !important;
    background: var(--vmx-sand) !important;
  }

  body[data-vmx="1"].vmx-footer-in-view .mobile-sticky-cta,
  body[data-vmx="1"].vmx-form-in-view .mobile-sticky-cta {
    transform: translateY(110%);
  }

  body[data-vmx="1"] .vmx-reading-progress {
    top: calc(70px + env(safe-area-inset-top));
    height: 3px;
    background: rgba(20, 39, 63, 0.08);
  }

  body[data-vmx="1"] .vmx-reading-progress span {
    background: linear-gradient(90deg, var(--vmx-sage-deep), var(--vmx-gold));
  }

  @media (prefers-reduced-motion: no-preference) {
    body[data-vmx="1"] :where(.hero h1, .hero-sub, .hero-reassure, .hero-ctas, .hero-left::after) {
      animation: vmx2-arrive 560ms both cubic-bezier(.2, .75, .25, 1);
    }

    body[data-vmx="1"] .hero-sub { animation-delay: 70ms; }
    body[data-vmx="1"] .hero-reassure { animation-delay: 120ms; }
    body[data-vmx="1"] .hero-ctas { animation-delay: 170ms; }
    body[data-vmx="1"] .hero-left::after { animation-delay: 220ms; }
  }

  @keyframes vmx2-arrive {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media screen and (max-width: 768px) {
  html:has(body[data-vmx="1"]) {
    max-width: 100%;
    overflow-x: clip;
  }

  body[data-vmx="1"] {
    --vmx-page-gutter: clamp(1rem, 4.8vw, 1.35rem);
    --vmx-reading-width: 42rem;
    --vmx-surface: #fffefa;
    --vmx-surface-soft: #f7f4ed;
    --vmx-border: rgba(15, 31, 56, 0.13);
    --vmx-border-gold: rgba(184, 156, 106, 0.34);
    --vmx-shadow: 0 10px 28px rgba(15, 31, 56, 0.08);
    overflow-x: clip;
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: calc(74px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"],
  body[data-vmx="1"][data-vmx-page="article"],
  body[data-vmx="1"][data-vmx-page="resource"],
  body[data-vmx="1"][data-vmx-page="guide"],
  body[data-vmx="1"][data-vmx-page="city"],
  body[data-vmx="1"][data-vmx-page="county"] {
    padding-bottom: calc(70px + env(safe-area-inset-bottom));
  }

  body[data-vmx="1"] *,
  body[data-vmx="1"] *::before,
  body[data-vmx="1"] *::after {
    box-sizing: border-box;
  }

  body[data-vmx="1"] img,
  body[data-vmx="1"] svg,
  body[data-vmx="1"] video,
  body[data-vmx="1"] iframe {
    max-width: 100%;
  }

  body[data-vmx="1"] :where(h1, h2, h3, h4, p, li, a, label, button) {
    overflow-wrap: break-word;
  }

  body[data-vmx="1"] :where(a, button, input, select, textarea, summary) {
    -webkit-tap-highlight-color: rgba(184, 156, 106, 0.18);
  }

  body[data-vmx="1"] :where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid #b89c6a !important;
    outline-offset: 3px !important;
  }

  body[data-vmx="1"] :where(button, [role="button"], input[type="submit"], input[type="button"], .btn, .ncta, .county-cta-btn, .lcf-submit, .bfc-submit) {
    min-height: 44px;
  }

  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) :where(h2, h3, h4, [id]) {
    scroll-margin-top: calc(84px + env(safe-area-inset-top));
  }

  /* Compact, stable mobile header */
  body[data-vmx="1"] nav {
    min-height: calc(60px + env(safe-area-inset-top));
    padding: calc(0.55rem + env(safe-area-inset-top)) var(--vmx-page-gutter) 0.55rem !important;
    gap: 0.75rem;
  }

  body[data-vmx="1"] nav :where(.logo, .nav-logo) {
    min-width: 0;
    max-width: calc(100% - 58px);
  }

  body[data-vmx="1"] nav :where(.logo-img, .nav-logo img, img) {
    width: auto !important;
    max-width: min(216px, 66vw) !important;
    max-height: 42px !important;
    object-fit: contain;
  }

  body[data-vmx="1"] .mobile-menu-btn {
    display: grid !important;
    place-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    margin: -0.25rem -0.35rem -0.25rem 0;
    border-radius: 10px;
    touch-action: manipulation;
  }

  body[data-vmx="1"] nav .nav-right {
    display: none !important;
  }

  body[data-vmx="1"] .mobile-menu-btn:active {
    background: rgba(255, 255, 255, 0.08);
    transform: scale(0.97);
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    max-height: calc(100dvh - 60px - env(safe-area-inset-top));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) a {
    display: flex !important;
    align-items: center;
    min-height: 48px;
    padding-block: 0.7rem !important;
  }

  /* Heroes answer the core question without consuming the full viewport. */
  body[data-vmx="1"] :where(.hero, .blog-hero, .rc-hero) {
    min-height: 0 !important;
  }

  body[data-vmx="1"] .hero,
  body[data-vmx="1"] .rc-hero {
    padding-top: calc(4.6rem + env(safe-area-inset-top)) !important;
    padding-bottom: 2rem !important;
  }

  body[data-vmx="1"] :where(.hero-inner, .blog-hero-inner, .rc-hero-inner, .hero-grid) {
    width: 100%;
    padding-left: var(--vmx-page-gutter) !important;
    padding-right: var(--vmx-page-gutter) !important;
    gap: 1.25rem !important;
  }

  body[data-vmx="1"] .blog-hero-inner {
    padding-top: calc(4.55rem + env(safe-area-inset-top)) !important;
    padding-bottom: 1.35rem !important;
  }

  body[data-vmx="1"] :where(.hero-left, .blog-hero-left) {
    padding-top: 0 !important;
  }

  body[data-vmx="1"] :where(.hero h1, .blog-hero h1, .rc-hero h1) {
    font-size: clamp(2rem, 9vw, 2.65rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.015em;
    margin-bottom: 0.85rem !important;
  }

  body[data-vmx="1"] :where(.hero-sub, .hero-desc, .rc-hero-desc, .rc-hero-subtitle) {
    max-width: 38rem;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    margin-bottom: 1.15rem !important;
  }

  body[data-vmx="1"] :where(.eyebrow, .hero .eyebrow) {
    margin-bottom: 0.75rem !important;
    letter-spacing: 0.14em !important;
  }

  body[data-vmx="1"] :where(.hero-ctas, .rc-hero-ctas) {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.65rem !important;
    margin-bottom: 1.25rem !important;
  }

  body[data-vmx="1"] :where(.hero-ctas, .rc-hero-ctas) a {
    width: 100%;
    min-height: 48px;
    justify-content: center;
    text-align: center;
  }

  body[data-vmx="1"] :where(.hero-trust-badges, .hero-positioning, .rc-hero-trust) {
    gap: 0.65rem 1rem !important;
    margin-top: 1rem !important;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card) {
    position: relative !important;
    top: auto !important;
    margin: 0 !important;
    border-radius: 14px !important;
    box-shadow: var(--vmx-shadow) !important;
  }

  body[data-vmx="1"] .hero-img-wrap img {
    max-height: 210px !important;
    object-position: center 38%;
  }

  /* Reading rhythm */
  body[data-vmx="1"] :where(.article, .rc-content) {
    width: 100%;
    max-width: var(--vmx-reading-width);
    margin-inline: auto;
    padding: 2rem var(--vmx-page-gutter) 3.25rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) > :first-child {
    margin-top: 0;
  }

  body[data-vmx="1"] :where(.article, .rc-content) h2 {
    font-size: clamp(1.65rem, 7vw, 2.05rem) !important;
    line-height: 1.2 !important;
    margin-top: 2.75rem !important;
    margin-bottom: 0.9rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) h3 {
    font-size: clamp(1.3rem, 5.8vw, 1.6rem) !important;
    line-height: 1.28 !important;
    margin-top: 2.15rem !important;
    margin-bottom: 0.75rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) h4 {
    font-size: 1.08rem !important;
    line-height: 1.35 !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) :where(p, li) {
    font-size: 1rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) p {
    margin-bottom: 1.15rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) :where(ul, ol) {
    padding-left: 1.35rem;
    margin-block: 0.85rem 1.4rem;
  }

  body[data-vmx="1"] :where(.article, .rc-content) li + li {
    margin-top: 0.55rem;
  }

  body[data-vmx="1"] :where(.article, .rc-content) table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
  }

  /* Calm grouping for existing high-value content structures. */
  body[data-vmx="1"] :where(
    .callout, .quick-answer, .warning-box, .rc-warning, .rc-official-card,
    .county-cta, .guide-covers, .worksheet-card, .explore-related,
    .related-reading, .county-situations, .hero-qa, .twr
  ) {
    margin-block: 1.6rem !important;
    border-radius: 14px !important;
    border-color: var(--vmx-border-gold) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(
    .callout, .quick-answer-body, .warning-box, .rc-warning, .rc-official-card-body,
    .county-cta, .worksheet-card, .explore-related, .related-reading,
    .county-situations, .hero-qa
  ) {
    padding: 1.25rem !important;
  }

  body[data-vmx="1"] :where(.guide-covers-grid, .related-grid, .related-card-grid, .rc-icon-cards, .rc-related-grid, .county-grid) {
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  body[data-vmx="1"] :where(.guide-covers-item, .related-card, .rc-icon-card) {
    min-height: 0 !important;
    padding: 1rem !important;
    border-radius: 12px !important;
    background: var(--vmx-surface) !important;
    border: 1px solid var(--vmx-border) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(.related-card, .rc-icon-card):active {
    transform: scale(0.99);
    background: var(--vmx-surface-soft) !important;
  }

  /* Homepage: situation-first choices, not compressed desktop columns. */
  body[data-vmx="1"][data-vmx-page="home"] :where(section, .section) {
    scroll-margin-top: calc(74px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.situations-grid, .risk-grid, .sh-grid, .recent-grid) {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.sit-card, .risk-card, .sh-card, .recent-card) {
    min-height: 0 !important;
    padding: 1.15rem !important;
    border-radius: 14px !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card {
    display: grid !important;
    grid-template-columns: 42px 1fr;
    column-gap: 0.9rem;
    align-items: start;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card :where(h3, p, .sit-card-link) {
    grid-column: 2;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.trust-strip, .hero-trust-badges) {
    overflow: visible !important;
  }

  /* Resource Center: search first, compact choices. */
  body[data-vmx="1"][data-vmx-page="blog"] :where(.search-section, .featured-section, .situations-section, .recent-guides) {
    padding: 2.25rem var(--vmx-page-gutter) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.search-inner, .featured-inner, .situations-inner, .recent-guides-inner) {
    width: 100%;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-grid, .recent-guides-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column;
    grid-auto-columns: min(82vw, 320px);
    gap: 0.75rem !important;
    max-width: 100%;
    padding: 0.2rem 0.1rem 0.85rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    contain: inline-size;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-card, .recent-guide-card) {
    padding: 1.15rem !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    scroll-snap-align: start;
  }

  body[data-vmx="1"] :where(.search-bar-wrap, .src-search-wrap, .rc-search-wrap, .bss-search-wrap) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem !important;
    width: 100%;
  }

  body[data-vmx="1"] :where(.search-input, input[type="search"]) {
    min-width: 0;
    min-height: 48px;
    font-size: 16px !important;
  }

  body[data-vmx="1"] .search-btn {
    min-width: 48px;
    min-height: 48px;
  }

  body[data-vmx="1"] :where(.search-chips, .category-nav, .filter-chips) {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    overflow-x: auto;
    padding: 0.25rem 0 0.6rem;
    scrollbar-width: thin;
    scroll-snap-type: x proximity;
    contain: inline-size;
  }

  body[data-vmx="1"] :where(.search-chip, .category-nav a, .filter-chips a) {
    flex: 0 0 auto;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    scroll-snap-align: start;
  }

  /* Existing resource TOC becomes a progressive-enhancement disclosure. */
  body[data-vmx="1"] .rc-toc-wrap {
    display: block !important;
    padding: 0 !important;
  }

  body[data-vmx="1"] .rc-toc {
    position: static !important;
    width: auto !important;
    margin: 1rem var(--vmx-page-gutter) 0 !important;
    padding: 0 !important;
    border: 1px solid var(--vmx-border-gold) !important;
    border-radius: 14px !important;
    background: var(--vmx-surface) !important;
    overflow: hidden;
  }

  body[data-vmx="1"] .rc-toc.vmx-toc-ready > h4 {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  body[data-vmx="1"] .vmx-toc-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 52px;
    padding: 0.85rem 1rem;
    border: 0;
    color: var(--navy, #0f1f38);
    background: transparent;
    font: inherit;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
  }

  body[data-vmx="1"] .vmx-toc-toggle::after {
    content: "+";
    flex: 0 0 auto;
    margin-left: 1rem;
    font-size: 1.3rem;
    font-weight: 400;
  }

  body[data-vmx="1"] .vmx-toc-toggle[aria-expanded="true"]::after {
    content: "−";
  }

  body[data-vmx="1"] .rc-toc.vmx-toc-ready ol {
    margin: 0;
    padding: 0.25rem 1rem 1rem 2.35rem;
    border-top: 1px solid var(--vmx-border);
  }

  body[data-vmx="1"] .rc-toc li {
    margin: 0 !important;
  }

  body[data-vmx="1"] .rc-toc a {
    display: block;
    min-height: 44px;
    padding: 0.65rem 0;
    line-height: 1.45;
  }

  body[data-vmx="1"] .rc-checklist li {
    position: relative;
    display: block !important;
    min-width: 0;
    padding-left: 1.8rem !important;
  }

  body[data-vmx="1"] .rc-checklist .rc-check {
    position: absolute;
    top: 0.72rem;
    left: 0;
  }

  body[data-vmx="1"] .rc-checklist .inline-link {
    display: inline !important;
  }

  /* Forms retain their behavior while reading like guided onboarding. */
  body[data-vmx="1"] :where(form[action*="formspree.io"], .hero-card-form, .bfc-form) {
    width: 100%;
  }

  body[data-vmx="1"] :where(.form-row, .bfc-row, .lcf-row) {
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
  }

  body[data-vmx="1"] form[action*="formspree.io"] :where(label, .form-label) {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 0.88rem !important;
    line-height: 1.4;
  }

  body[data-vmx="1"] form[action*="formspree.io"] :where(input:not([type="hidden"]), select, textarea) {
    width: 100% !important;
    min-height: 48px;
    padding: 0.75rem 0.85rem !important;
    border-radius: 9px !important;
    font-size: 16px !important;
    line-height: 1.35;
    scroll-margin-bottom: calc(100px + env(safe-area-inset-bottom));
  }

  body[data-vmx="1"] form[action*="formspree.io"] textarea {
    min-height: 112px;
    resize: vertical;
  }

  body[data-vmx="1"] form[action*="formspree.io"] :where(button[type="submit"], input[type="submit"]) {
    width: 100% !important;
    min-height: 50px;
    margin-top: 0.4rem;
    font-size: 0.94rem !important;
  }

  body[data-vmx="1"] :where(.form-reassurance, .lcf-reassurance, .lcf-alt, .form-trust-values) {
    font-size: 0.82rem !important;
    line-height: 1.55 !important;
  }

  /* Two primary actions plus a compact secondary text control. */
  body[data-vmx="1"] .mobile-sticky-cta {
    display: block !important;
    padding: 0.55rem max(0.7rem, env(safe-area-inset-right)) calc(0.55rem + env(safe-area-inset-bottom)) max(0.7rem, env(safe-area-inset-left)) !important;
    background: rgba(15, 31, 56, 0.97) !important;
    border-top: 1px solid rgba(184, 156, 106, 0.38) !important;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.16) !important;
    backdrop-filter: blur(12px);
    transition: transform 180ms ease, opacity 180ms ease;
  }

  body[data-vmx="1"] .mobile-sticky-cta-inner {
    display: grid !important;
    grid-template-columns: minmax(76px, 0.8fr) 48px minmax(118px, 1.25fr);
    gap: 0.45rem !important;
    max-width: 430px !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a {
    min-width: 0;
    min-height: 48px !important;
    padding: 0.55rem 0.65rem !important;
    border-radius: 10px !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.035em !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta .msc-text {
    width: 48px;
    padding-inline: 0 !important;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.82) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    font-size: 0 !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta .msc-text svg {
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a:active {
    transform: scale(0.98);
  }

  body[data-vmx="1"].vmx-form-in-view .mobile-sticky-cta,
  body[data-vmx="1"].vmx-footer-in-view .mobile-sticky-cta {
    opacity: 0;
    pointer-events: none;
    transform: translateY(110%);
  }

  /* Subtle reading progress, never interactive. */
  body[data-vmx="1"] .vmx-reading-progress {
    position: fixed;
    top: calc(60px + env(safe-area-inset-top));
    left: 0;
    right: 0;
    z-index: 98;
    height: 2px;
    pointer-events: none;
    background: transparent;
  }

  body[data-vmx="1"] .vmx-reading-progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: #b89c6a;
    transform: scaleX(var(--vmx-progress, 0));
    transform-origin: left center;
  }

  /* Footers remain usable above the action area. */
  body[data-vmx="1"] footer {
    padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"] :where(.footer-inner, .footer-top, .footer-nap-inner) {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  body[data-vmx="1"] footer a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}

@media screen and (max-width: 350px) {
  body[data-vmx="1"] {
    --vmx-page-gutter: 0.95rem;
  }

  body[data-vmx="1"] nav :where(.logo-img, .nav-logo img, img) {
    max-width: 62vw !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta-inner {
    grid-template-columns: minmax(70px, 0.75fr) 46px minmax(108px, 1.2fr);
    gap: 0.35rem !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a {
    padding-inline: 0.45rem !important;
    letter-spacing: 0 !important;
  }
}

@media screen and (max-width: 768px) and (orientation: landscape) {
  body[data-vmx="1"] :where(.hero, .rc-hero) {
    padding-bottom: 1.5rem !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    max-height: calc(100dvh - 54px - env(safe-area-inset-top));
  }
}

@media screen and (max-width: 768px) and (prefers-reduced-motion: reduce) {
  body[data-vmx="1"] *,
  body[data-vmx="1"] *::before,
  body[data-vmx="1"] *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================================
   VMX 3.0 — HOMEPAGE MOBILE RECOMPOSITION
   A purpose-built New Jersey property-help experience for phones.
   Scoped entirely to body[data-vmx="1"][data-vmx-page="home"] and to
   max-width:768px, so desktop and every other VMX page are untouched.
   Loaded last, so this layer intentionally supersedes VMX 1.0 / 2.0 on the
   homepage only. Enhancement hooks (.vmx-hero-secondary and .vmx-sh-icon)
   are added by vmx-mobile.js and hidden on desktop below.
   ============================================================================ */

/* Desktop guard: mobile-only enhancement nodes never render on desktop. */
body[data-vmx="1"][data-vmx-page="home"] .vmx-hero-secondary,
body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon {
  display: none;
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="home"] {
    /* Refined VMX 3.0 tokens layered over the existing palette. */
    --v3-ink: #12263f;
    --v3-ink-soft: #43536a;
    --v3-paper: #fffdf7;
    --v3-paper-2: #f6f2e9;
    --v3-sage: #e3ebe1;
    --v3-sage-deep: #64775f;
    --v3-gold: #a9834b;
    --v3-gold-soft: rgba(169, 131, 75, 0.14);
    --v3-line: rgba(18, 38, 63, 0.1);
    --v3-radius: 20px;
    --v3-radius-lg: 26px;
    --v3-shadow: 0 12px 34px rgba(18, 38, 63, 0.09);
    --v3-shadow-soft: 0 6px 18px rgba(18, 38, 63, 0.06);
    --v3-pad: clamp(1.15rem, 5.2vw, 1.5rem);
  }

  /* ---- 2-3. Compact hero: message + two actions in the first screen ---- */
  body[data-vmx="1"][data-vmx-page="home"] .hero,
  body[data-vmx="1"][data-vmx-page="home"] .rc-hero {
    padding-top: calc(4.4rem + env(safe-area-inset-top)) !important;
    padding-bottom: 1.9rem !important;
    background:
      radial-gradient(circle at 108% -4%, rgba(169, 131, 75, 0.12), transparent 40%),
      linear-gradient(168deg, #fffdf7 0%, #f4efe5 100%) !important;
  }

  /* Remove the desktop dark image overlay so the calm paper hero shows through. */
  body[data-vmx="1"][data-vmx-page="home"] .hero::after {
    display: none !important;
  }

  /* Drop the doubled top padding from the base hero-inner; .hero clears the nav. */
  body[data-vmx="1"][data-vmx-page="home"] .hero-inner {
    padding-top: 0 !important;
    gap: 0 !important;
  }

  /* Clean, compact header: drop the overlapping VMX chrome tagline on home. */
  body[data-vmx="1"][data-vmx-page="home"] nav::after {
    display: none !important;
  }

  /* Neutralise the VMX 2.0 tall decorative circle. */
  body[data-vmx="1"][data-vmx-page="home"] .hero::before {
    width: 11rem !important;
    height: 11rem !important;
    right: -5.5rem !important;
    top: 3.4rem !important;
    opacity: 0.7;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .eyebrow {
    margin-bottom: 0.85rem !important;
    padding: 0.42rem 0.75rem !important;
    font-size: 0.6rem !important;
    letter-spacing: 0.12em !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero h1 {
    max-width: 13ch !important;
    margin-bottom: 0.7rem !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(2.3rem, 10.5vw, 3rem) !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: -0.02em !important;
  }

  /* Hero sub becomes a short, direct reassurance; long paragraph is de-emphasised. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-sub {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure {
    margin: 0 0 1.15rem !important;
    padding: 0.85rem 1rem 0.85rem 2.65rem !important;
    border: 1px solid rgba(100, 119, 95, 0.22);
    border-radius: 15px;
    background: rgba(227, 235, 225, 0.62);
    color: #4a5a4a !important;
    font-family: 'DM Sans', sans-serif !important;
    font-style: normal !important;
    font-size: 0.9rem !important;
    line-height: 1.5 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure::before {
    content: "✓";
    position: absolute;
    left: 0.95rem;
    top: 0.85rem;
    width: 1.2rem;
    height: 1.2rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--v3-sage-deep);
    font: 700 0.68rem/1 'DM Sans', sans-serif;
  }

  /* Two actions, both visible in the first screen. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-ctas {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.6rem !important;
    margin-bottom: 1.25rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-ctas .btn-primary {
    background: var(--v3-ink) !important;
    border-color: var(--v3-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-hero-secondary {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px !important;
    padding: 0.9rem 1.2rem !important;
    border: 1px solid rgba(18, 38, 63, 0.2) !important;
    border-radius: 16px !important;
    background: rgba(255, 255, 255, 0.7) !important;
    color: var(--v3-ink) !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 0.84rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    text-decoration: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-hero-secondary:active {
    transform: scale(0.985);
    background: rgba(255, 255, 255, 0.95) !important;
  }

  /* Restrained, regionally-accurate NJ imagery strip (accurate NJ + skyline). */
  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    aspect-ratio: 16 / 8 !important;
    margin: 0.1rem 0 0.25rem !important;
    border: 3px solid rgba(255, 255, 255, 0.92) !important;
    border-radius: 20px 20px 44px 20px !important;
    background:
      linear-gradient(180deg, transparent 52%, rgba(12, 26, 43, 0.32)),
      url('/images/defaults/homepage-hero.webp') center 32% / cover no-repeat !important;
    box-shadow: var(--v3-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-trust-badges {
    margin-top: 1.1rem !important;
    gap: 0.5rem 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge {
    padding: 0.42rem 0.7rem !important;
    border: 1px solid rgba(18, 38, 63, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.6);
    color: #4a5a6a !important;
    font-size: 0.63rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge svg { opacity: 0.8; }

  /* ---- Shared section rhythm: one idea per viewport, calm whitespace ---- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section, .start-here-section, .search-resource-center, .risks-section, .process-section, .founder-section, .talk-ray-section) {
    padding: 3.1rem var(--v3-pad) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header, .start-here-inner, .risks-inner .section-header) {
    margin-bottom: 1.5rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-eyebrow, .start-here-inner .exp-opener) {
    justify-content: flex-start !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow {
    display: inline-flex !important;
    align-items: center;
    gap: 0.5rem;
    width: fit-content;
    padding: 0.4rem 0.72rem !important;
    border: 1px solid rgba(100, 119, 95, 0.22);
    border-radius: 999px;
    background: rgba(227, 235, 225, 0.7);
    color: #566c59 !important;
    font-size: 0.6rem !important;
    letter-spacing: 0.11em !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::before,
  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::after {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .start-here-inner h2, .risks-inner h2) {
    margin-top: 0.7rem !important;
    font-size: clamp(1.95rem, 8.6vw, 2.5rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.02em;
  }

  body[data-vmx="1"][data-vmx-page="home"] .exp-opener {
    font-size: 1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-desc, .sh-desc, .src-desc) {
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-size: 0.94rem !important;
  }

  /* ---- 4. Situation selector: a true mobile decision interface ---- */
  body[data-vmx="1"][data-vmx-page="home"] .start-here-section {
    background: var(--v3-paper) !important;
    border-top: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-grid,
  body[data-vmx="1"][data-vmx-page="home"] .sh-grid--four {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.6rem !important;
    max-width: none !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-card {
    position: relative;
    display: grid !important;
    grid-template-columns: 46px 1fr 18px;
    align-items: center;
    gap: 0.9rem;
    min-height: 72px !important;
    padding: 1rem 1.05rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-card:active {
    transform: scale(0.99);
    border-color: var(--v3-gold) !important;
    background: #fffef9 !important;
  }

  /* Refined line icon replaces the decorative emoji on mobile. */
  body[data-vmx="1"][data-vmx-page="home"] .sh-emoji {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon {
    display: grid !important;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: var(--v3-sage);
    color: var(--v3-sage-deep);
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon svg {
    width: 22px;
    height: 22px;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-label {
    font-family: 'DM Sans', sans-serif;
    font-size: 0.98rem !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: var(--v3-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-note {
    margin-top: 0.15rem;
    font-size: 0.74rem !important;
    color: var(--v3-ink-soft) !important;
  }

  /* Chevron affordance drawn into the third grid column. */
  body[data-vmx="1"][data-vmx-page="home"] .sh-card::after {
    content: "";
    width: 9px;
    height: 9px;
    border-right: 2px solid var(--v3-gold);
    border-bottom: 2px solid var(--v3-gold);
    transform: rotate(-45deg);
    justify-self: end;
    opacity: 0.7;
  }

  /* ---- 3 (nav). Compact, calm header sits above the flow ---- */
  body[data-vmx="1"][data-vmx-page="home"] nav {
    background: rgba(15, 31, 56, 0.97) !important;
  }

  /* ---- 5 (featured). Difficult-situation cards: calm vertical deck ---- */
  body[data-vmx="1"][data-vmx-page="home"] #services {
    background: var(--v3-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .situations-grid {
    display: grid !important;
    grid-auto-flow: row !important;
    grid-template-columns: 1fr !important;
    grid-auto-columns: auto !important;
    gap: 0.75rem !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card {
    display: block !important;
    min-height: 0 !important;
    padding: 1.4rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card::before {
    height: 3px;
    background: linear-gradient(90deg, var(--v3-gold), #cbab77);
    transform: scaleX(1);
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card-icon {
    width: 46px !important;
    height: 46px !important;
    margin: 0 0 0.9rem !important;
    padding: 0.6rem;
    border-radius: 13px;
    background: var(--v3-gold-soft) !important;
    color: var(--v3-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card h3 {
    margin: 0 0 0.5rem !important;
    font-size: 1.5rem !important;
    line-height: 1.12 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card > p {
    font-size: 0.9rem !important;
  }

  /* Featured planning tools: swipeable card row. */
  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start {
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .situations-grid {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-template-columns: none !important;
    grid-auto-columns: min(82vw, 300px);
    gap: 0.8rem !important;
    max-width: none !important;
    margin: 0 calc(var(--v3-pad) * -1);
    padding: 0.3rem var(--v3-pad) 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .situations-grid::-webkit-scrollbar {
    display: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .sit-card {
    display: flex !important;
    flex-direction: column;
    min-height: 214px !important;
    padding: 1.4rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    scroll-snap-align: start;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .sit-card h3 {
    font-size: 1.35rem !important;
    line-height: 1.14 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .sit-card-link {
    align-self: flex-start !important;
    margin-top: auto;
    color: var(--v3-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-cta-row {
    margin-top: 1.6rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-cta-row .btn-primary,
  body[data-vmx="1"][data-vmx-page="home"] .section-cta-row .btn-soft {
    display: inline-flex !important;
    width: 100%;
    max-width: none !important;
    align-items: center;
    justify-content: center;
  }

  /* ---- Navy conversion panels: search + trust ---- */
  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section {
    margin: 0 var(--v3-pad) !important;
    padding: 1.7rem 1.5rem !important;
    border-radius: var(--v3-radius-lg) !important;
    background: linear-gradient(160deg, #14273f, #0e1d32) !important;
    border: 1px solid rgba(169, 131, 75, 0.3) !important;
    box-shadow: var(--v3-shadow);
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center :where(h2, .exp-opener, .src-desc),
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section :where(h2, p, .exp-opener) {
    color: rgba(255, 255, 255, 0.86) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center h2,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section h2 {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-inner .exp-opener,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text .exp-opener {
    color: var(--goldl) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-search-wrap {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.55rem !important;
    margin: 1.1rem 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-search-wrap .search-input {
    min-height: 52px;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    font-size: 16px !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-search-wrap .search-btn {
    min-height: 52px;
    border-radius: 14px !important;
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-chips {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    margin: 0 calc(var(--v3-pad) * -1);
    padding: 0.2rem var(--v3-pad) 0.3rem;
    overflow-x: auto;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-chips::-webkit-scrollbar { display: none; }

  body[data-vmx="1"][data-vmx-page="home"] .src-chip {
    flex: 0 0 auto;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.86) !important;
    scroll-snap-align: start;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner {
    flex-direction: column !important;
    gap: 1rem !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner::before { display: none; }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-avatar {
    width: 64px !important;
    height: 64px !important;
    border-color: var(--gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges { justify-content: flex-start !important; }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges span {
    color: rgba(255, 255, 255, 0.82) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges svg { color: var(--goldl) !important; }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta .btn-primary {
    width: 100% !important;
    max-width: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta .btn-primary {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
  }

  /* ---- 7. Recent situations: swipeable image deck ---- */
  body[data-vmx="1"][data-vmx-page="home"] #recent-situations {
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-grid {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-template-columns: none !important;
    grid-auto-columns: 84%;
    gap: 1rem !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0;
    padding: 0.3rem 0 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(18, 38, 63, 0.24) transparent;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-grid::-webkit-scrollbar { height: 4px; }
  body[data-vmx="1"][data-vmx-page="home"] .recent-grid::-webkit-scrollbar-track { background: transparent; }
  body[data-vmx="1"][data-vmx-page="home"] .recent-grid::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(18, 38, 63, 0.24);
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-grid:focus-visible {
    outline: 2px solid var(--v3-gold);
    outline-offset: 4px;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card {
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-img {
    height: auto !important;
    aspect-ratio: 16 / 9;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-body {
    padding: 1.25rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-swipe-cue {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    width: fit-content;
    margin: -0.35rem 0 0.55rem;
    color: var(--v3-ink-soft);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-swipe-cue::after {
    content: "→";
    color: var(--v3-gold);
    font-size: 0.9rem;
  }

  /* ---- 8. Meet Ray: calm founder card ---- */
  body[data-vmx="1"][data-vmx-page="home"] .founder-section {
    background: var(--v3-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-inner {
    grid-template-columns: 1fr !important;
    gap: 1.3rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media {
    max-width: 190px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media img {
    border-radius: var(--v3-radius) !important;
    box-shadow: var(--v3-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-content .section-eyebrow {
    justify-content: flex-start !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-body {
    margin: 0 0 1.1rem !important;
    font-size: 0.94rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-cta .btn-soft {
    display: inline-flex;
    width: 100%;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    border-radius: 16px !important;
  }

  /* ---- 9. How the process works: numbered rail ---- */
  body[data-vmx="1"][data-vmx-page="home"] .process-section {
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-steps {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-steps::before { display: none !important; }

  body[data-vmx="1"][data-vmx-page="home"] .process-step {
    display: grid;
    grid-template-columns: 2.4rem 1fr;
    column-gap: 1rem;
    align-items: start;
    padding: 1.35rem 1.3rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-num {
    width: 2.4rem !important;
    height: 2.4rem !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--v3-ink) !important;
    color: #fff !important;
    font-size: 1.15rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-step h3 {
    grid-column: 2;
    margin: 0 0 0.3rem !important;
    font-size: 1.3rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-step p {
    grid-column: 2;
    font-size: 0.9rem !important;
  }

  /* ---- 10 (support). Risks: why acting early matters ---- */
  body[data-vmx="1"][data-vmx-page="home"] .risks-section {
    background: var(--v3-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-grid,
  body[data-vmx="1"][data-vmx-page="home"] .risks-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-card {
    padding: 1.3rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-card-icon {
    background: var(--v3-gold-soft) !important;
    color: var(--v3-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risks-reassurance {
    margin-top: 1.4rem !important;
    text-align: left !important;
    font-size: 0.9rem !important;
  }

  /* ---- 12. FAQ: quiet accordion ---- */
  body[data-vmx="1"][data-vmx-page="home"] #faq { background: var(--v3-paper) !important; }

  body[data-vmx="1"][data-vmx-page="home"] .faq-intro {
    text-align: left !important;
    font-size: 0.92rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-item {
    margin-bottom: 0.6rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: 16px !important;
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-item.open {
    background: var(--v3-paper) !important;
    border-color: rgba(169, 131, 75, 0.3) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-trigger {
    min-height: 60px;
    padding: 0.95rem 1.1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-trigger h3 { font-size: 0.95rem !important; }

  /* ---- 13-14. Financial readiness + final CTA ---- */
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-section {
    padding: 3rem var(--v3-pad) !important;
    background: linear-gradient(165deg, #14273f, #0c1a2d) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner { text-align: left !important; }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner p {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner .btn-primary {
    display: inline-flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
  }

  /* ---- 15. Statewide ribbon: quiet trust footer band ---- */
  body[data-vmx="1"][data-vmx-page="home"] .authority-ribbon {
    padding: 1.5rem var(--v3-pad) !important;
    background: #0e1d32 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .authority-ribbon-inner { text-align: center; }

  /* ---- Bottom action area: two dominant actions + compact text ---- */
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta {
    background: rgba(15, 31, 56, 0.98) !important;
    border-top: 1px solid rgba(169, 131, 75, 0.4) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta-inner {
    grid-template-columns: minmax(74px, 0.85fr) 48px minmax(120px, 1.3fr) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .msc-review {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
    font-weight: 700 !important;
  }
}

/* Home-only tightening for the smallest phones. */
@media screen and (max-width: 360px) {
  body[data-vmx="1"][data-vmx-page="home"] .sh-card {
    grid-template-columns: 42px 1fr 16px;
    gap: 0.7rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon {
    width: 42px;
    height: 42px;
  }
}

/* ============================================================================
   VMX 3.1 — HOMEPAGE MOBILE VISUAL CONSISTENCY REPAIR
   One cohesive mobile design system, applied from the hero through the footer.
   Appended last so it supersedes earlier VMX layers on the homepage only.
   Scoped to body[data-vmx="1"][data-vmx-page="home"] + max-width:768px, so the
   desktop layout and every other page are untouched.

   Goals: one design language top-to-bottom; cream canvas + deep-navy ink;
   restrained gold/sage accents; consistent radius / border / shadow / padding;
   controlled type scale; pills only as small labels; no lower section reverting
   to the desktop look; readable dark panels; a compact, correctly-labelled bar.
   ============================================================================ */
@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="home"] {
    --v31-ink: #12263f;
    --v31-ink-soft: #43536a;
    --v31-paper: #fffdf7;
    --v31-paper-2: #f6f2e9;
    --v31-sage: #e3ebe1;
    --v31-sage-deep: #5f7359;
    --v31-gold: #a9834b;
    --v31-gold-soft: rgba(169, 131, 75, 0.12);
    --v31-line: rgba(18, 38, 63, 0.1);
    --v31-radius: 20px;
    --v31-radius-lg: 24px;
    --v31-shadow-soft: 0 6px 18px rgba(18, 38, 63, 0.06);
    --v31-shadow: 0 12px 34px rgba(18, 38, 63, 0.09);
    --v31-pad: clamp(1.15rem, 5.2vw, 1.5rem);
  }

  /* ---------------------------------------------------------------------------
     1. HERO — clarity and balance, ~1–1.5 viewports tall
     --------------------------------------------------------------------------- */

  /* Controlled H1: readable and authoritative, ~3–5 lines on a 390px screen —
     never most of the viewport. Removes the narrow 13ch cap that forced tall,
     awkwardly-broken lines. */
  body[data-vmx="1"][data-vmx-page="home"] .hero h1 {
    max-width: none !important;
    margin-bottom: 0.85rem !important;
    font-size: clamp(2.05rem, 8vw, 2.55rem) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.015em !important;
  }

  /* Hero eyebrow: the copy is a full phrase, so present it as a clean editorial
     label with a short leading rule — not an oversized pill. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .eyebrow {
    display: flex !important;
    align-items: center;
    gap: 0.55rem;
    width: auto !important;
    margin-bottom: 0.9rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-gold) !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .eyebrow::before {
    content: "";
    flex: 0 0 auto;
    width: 26px;
    height: 1px;
    background: var(--v31-gold);
  }

  /* Short supporting paragraph: plain, readable, no heavy sage callout box. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure {
    margin: 0 0 1.2rem !important;
    padding: 0 0 0 0.9rem !important;
    border: 0 !important;
    border-left: 2px solid rgba(95, 115, 89, 0.55) !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-ink-soft) !important;
    font-family: 'DM Sans', sans-serif !important;
    font-style: normal !important;
    font-size: 0.96rem !important;
    line-height: 1.6 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure::before {
    display: none !important;
  }

  /* Compact trust row: inline items with subtle dividers — not pills. */
  body[data-vmx="1"][data-vmx-page="home"] .hero-trust-badges {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.85rem !important;
    margin-top: 1.15rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge {
    position: relative;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-ink-soft) !important;
    font-size: 0.66rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge svg {
    color: var(--v31-gold) !important;
    opacity: 1 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge + .hero-badge {
    padding-left: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge + .hero-badge::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 12px;
    background: rgba(18, 38, 63, 0.18);
  }

  /* NJ neighborhood image sits below the actions and trust row. Focal point is
     lowered onto the homes (not the skyline) and lightly graded for clarity. */
  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    aspect-ratio: 16 / 9 !important;
    margin: 1.3rem 0 0.1rem !important;
    border: 3px solid rgba(255, 255, 255, 0.92) !important;
    border-radius: var(--v31-radius) var(--v31-radius) 40px var(--v31-radius) !important;
    background:
      linear-gradient(180deg, transparent 58%, rgba(12, 26, 43, 0.22)),
      url('/images/defaults/homepage-hero.webp') center 66% / cover no-repeat !important;
    filter: saturate(1.05) contrast(1.04) brightness(1.04);
    box-shadow: var(--v31-shadow) !important;
  }

  /* ---------------------------------------------------------------------------
     2. SHARED SECTION SYSTEM — consistent rhythm, labels and headings
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section, .start-here-section, .search-resource-center, .risks-section, .process-section, .founder-section, .talk-ray-section, .fin-ready-section, .vig-trust-section) {
    padding: 3.1rem var(--v31-pad) !important;
    border: 0 !important;
  }

  /* Short section eyebrows stay as small sage category-label pills (matching the
     reference's label chips); this is the ONE approved pill use. */
  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow,
  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-eyebrow,
  body[data-vmx="1"][data-vmx-page="home"] .vig-trust-label {
    display: inline-flex !important;
    align-items: center;
    width: fit-content !important;
    margin: 0 0 0.5rem !important;
    padding: 0.4rem 0.72rem !important;
    border: 1px solid rgba(95, 115, 89, 0.26) !important;
    border-radius: 999px !important;
    background: var(--v31-sage) !important;
    color: #566c59 !important;
    font-size: 0.6rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::before,
  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::after {
    display: none !important;
  }

  /* Consistent section-heading scale (~32–40px), no oversized headings. */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .start-here-inner h2, .risks-inner h2, .founder-content h2, .fin-ready-title, .vig-trust-section h2, .search-resource-inner h2, .talk-ray-text h2) {
    max-width: none !important;
    margin-top: 0.6rem !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(1.95rem, 8.4vw, 2.4rem) !important;
    font-weight: 500 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
  }

  /* Consistent card-heading scale (~21–26px). */
  body[data-vmx="1"][data-vmx-page="home"] :where(.sit-card h3, .recent-card-body h3, .risk-card h3, .process-step h3, .vig-role-grid strong, .vig-help-grid strong) {
    font-size: 1.32rem !important;
    line-height: 1.16 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-desc, .sh-desc, .src-desc, .faq-intro) {
    font-size: 0.94rem !important;
    line-height: 1.72 !important;
  }

  /* ---------------------------------------------------------------------------
     3. SITUATION SELECTOR — two clean cards per row (not four crammed across)
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-grid,
  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-grid--four {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.6rem !important;
    max-width: none !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-card {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.55rem !important;
    min-height: 138px !important;
    padding: 1rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .vmx-sh-icon {
    width: 42px;
    height: 42px;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-label {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-note {
    font-size: 0.72rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-card::after {
    margin-top: auto;
    align-self: flex-start;
    justify-self: unset;
  }

  /* ---------------------------------------------------------------------------
     4. DARK PANELS — used selectively, always readable
     Search stays navy; the "A Real Person" conversation module becomes a light
     trust card so two navy panels no longer sit back-to-back and its heading is
     no longer low-contrast.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center {
    margin: 0 var(--v31-pad) !important;
    padding: 1.75rem 1.5rem !important;
    border: 1px solid rgba(169, 131, 75, 0.3) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: linear-gradient(160deg, #14273f, #0e1d32) !important;
    box-shadow: var(--v31-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center :where(h2, p, .src-desc, .exp-opener) {
    color: rgba(255, 255, 255, 0.9) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center h2 {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-inner .exp-opener {
    color: var(--goldl) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section {
    margin: 0 var(--v31-pad) !important;
    padding: 1.75rem 1.5rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner {
    flex-direction: column !important;
    gap: 1rem !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner::before {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text h2 {
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text > p {
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text .exp-opener {
    color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-avatar {
    width: 64px !important;
    height: 64px !important;
    border-color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges span {
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges svg {
    color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta .btn-primary {
    background: var(--v31-ink) !important;
    border-color: var(--v31-ink) !important;
    color: #fff !important;
  }

  /* ---------------------------------------------------------------------------
     6. MEET RAY — one cohesive founder card, balanced photo
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .founder-inner {
    grid-template-columns: 1fr !important;
    gap: 1.1rem !important;
    padding: 1.5rem 1.4rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media {
    max-width: 148px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media img {
    aspect-ratio: 1 / 1 !important;
    object-fit: cover;
    object-position: center 22%;
    border-radius: 16px !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  /* Founder eyebrow is a long phrase — render as a clean label, not a long pill. */
  body[data-vmx="1"][data-vmx-page="home"] .founder-content .section-eyebrow {
    display: flex !important;
    align-items: center;
    gap: 0.55rem;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-gold) !important;
    font-size: 0.62rem !important;
    letter-spacing: 0.14em !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-content .section-eyebrow::before {
    content: "";
    display: block !important;
    flex: 0 0 auto;
    width: 26px;
    height: 1px;
    background: var(--v31-gold);
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-trustline {
    font-size: 0.74rem !important;
    color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-body {
    margin: 0 0 1.1rem !important;
    font-size: 0.94rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-cta .btn-soft {
    display: inline-flex;
    width: 100%;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    border-radius: 16px !important;
  }

  /* ---------------------------------------------------------------------------
     8. FINANCIAL READINESS — themed as a system card (was desktop-styled)
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-section {
    background: var(--v31-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready {
    max-width: none !important;
    margin: 0 !important;
    padding: 1.5rem 1.4rem !important;
    border: 1px solid var(--v31-line) !important;
    border-left: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: var(--v31-paper-2) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready p {
    max-width: none !important;
    font-size: 0.94rem !important;
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-cta {
    display: flex !important;
    width: 100% !important;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    margin-top: 0.5rem !important;
    border: 1px solid var(--v31-ink) !important;
    border-radius: 16px !important;
    background: transparent !important;
    color: var(--v31-ink) !important;
    text-transform: none !important;
  }

  /* ---------------------------------------------------------------------------
     9. COORDINATED NETWORK + OUR ROLE (runtime trust sections)
     Previously un-themed on mobile — they reverted to plain desktop boxes.
     Now rebuilt as system cards so they belong to the same design language.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .vig-professional-network {
    background: var(--v31-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-our-role {
    background: var(--v31-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-trust-inner {
    max-width: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-trust-section p {
    font-size: 0.94rem !important;
    line-height: 1.72 !important;
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-help-grid,
  body[data-vmx="1"][data-vmx-page="home"] .vig-role-grid {
    grid-template-columns: 1fr !important;
    gap: 0.7rem !important;
    margin: 1.3rem 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-help-grid p,
  body[data-vmx="1"][data-vmx-page="home"] .vig-role-grid p {
    margin: 0 !important;
    padding: 1.3rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-help-grid strong,
  body[data-vmx="1"][data-vmx-page="home"] .vig-role-grid strong {
    margin-bottom: 0.4rem !important;
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-brand-promise {
    padding: 1rem 1.15rem !important;
    border-left: 3px solid var(--v31-gold) !important;
    border-radius: 0 14px 14px 0 !important;
    background: var(--v31-gold-soft) !important;
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-network-summary {
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-professional-note {
    color: var(--v31-ink-soft) !important;
  }

  /* Conversation CTA: a single navy accent card with a gold primary action. */
  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 1rem !important;
    margin-top: 1.4rem !important;
    padding: 1.4rem !important;
    border-radius: var(--v31-radius) !important;
    background: linear-gradient(160deg, #14273f, #0e1d32) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta strong {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta span,
  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta p {
    color: rgba(255, 255, 255, 0.85) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta a {
    display: flex !important;
    width: 100% !important;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gold) !important;
    border-radius: 16px !important;
    background: var(--gold) !important;
    color: var(--v31-ink) !important;
    font-weight: 700;
  }

  /* ---------------------------------------------------------------------------
     10. FINAL CTA (navy) — ensure strong contrast
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner :where(h2, p) {
    color: rgba(255, 255, 255, 0.9) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner h2 {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner .exp-opener {
    color: var(--goldl) !important;
  }

  /* ---------------------------------------------------------------------------
     11. BUTTON STANDARDISATION — consistent height, radius, casing
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.btn-primary, .btn-soft, .hc-submit, .vmx-hero-secondary, .fin-ready-cta) {
    min-height: 52px !important;
    border-radius: 16px !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
  }

  /* ---------------------------------------------------------------------------
     12. BOTTOM ACTION BAR — compact, safe-area aware, three clear labels
     Removes the doubled safe-area + tall min-height that left a large empty
     navy block beneath the controls, and restores a readable "Text" label.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] {
    padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta {
    padding: 0.5rem var(--v31-pad) calc(0.5rem + env(safe-area-inset-bottom)) !important;
    background: rgba(15, 31, 56, 0.98) !important;
    border-top: 1px solid rgba(169, 131, 75, 0.4) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta-inner {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1.35fr !important;
    gap: 0.5rem !important;
    min-height: 0 !important;
    max-width: 460px !important;
    padding: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta a {
    min-width: 0;
    min-height: 48px !important;
    padding: 0.5rem 0.4rem !important;
    border-radius: 12px !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
  }

  /* Restore the "Text" label (the site-wide layer hides it as icon-only). */
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta .msc-text {
    width: auto !important;
    padding-inline: 0.4rem !important;
    overflow: visible !important;
    font-size: 0.72rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta .msc-text svg {
    width: 14px !important;
    height: 14px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.msc-call, .msc-text) {
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: rgba(255, 255, 255, 0.9) !important;
    background: rgba(255, 255, 255, 0.06) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .msc-review {
    border: 1px solid var(--gold) !important;
    background: var(--gold) !important;
    color: var(--v31-ink) !important;
    font-weight: 700 !important;
  }
}

/* Smallest phones: keep the three bar labels readable, selector still 2-up. */
@media screen and (max-width: 360px) {
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta a {
    font-size: 0.66rem !important;
    padding-inline: 0.3rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-card {
    min-height: 128px !important;
    padding: 0.85rem !important;
  }
}

/* ============================================================================
   VMX 3.2 — FINAL PRODUCTION POLISH
   A production-polish pass over the mobile experience. No redesign: URLs,
   markup, schema, forms, CTA behavior and desktop layouts are untouched.
   Everything below is scoped to body[data-vmx="1"] inside max-width:768px, so
   desktop stays pixel-identical. Appended last so it supersedes earlier layers.

   Spacing rhythm is normalised to an 8 / 16 / 24 / 32 scale throughout.
   ============================================================================ */
@media screen and (max-width: 768px) {

  /* ---------------------------------------------------------------------------
     1. HEADER — premium, minimal, vertically centred
     Remove the decorative "NJ Property Help Center" chrome tagline that sat at
     the bottom edge and overlapped the logo on interior templates; centre the
     logo and hamburger; settle the header at a stable ~72px.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"] nav {
    min-height: calc(72px + env(safe-area-inset-top)) !important;
    padding-top: calc(0.5rem + env(safe-area-inset-top)) !important;
    padding-bottom: 0.5rem !important;
    align-items: center !important;
  }

  body[data-vmx="1"] nav::after {
    display: none !important;
  }

  body[data-vmx="1"] nav :where(.nlogo, .logo, .nav-logo) {
    align-self: center !important;
  }

  body[data-vmx="1"] .mobile-menu-btn {
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Keep the open menu docked directly beneath the taller header. */
  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    top: calc(72px + env(safe-area-inset-top)) !important;
    max-height: calc(100dvh - 72px - env(safe-area-inset-top)) !important;
  }

  body[data-vmx="1"] .vmx-reading-progress {
    top: calc(72px + env(safe-area-inset-top)) !important;
  }

  /* ---------------------------------------------------------------------------
     2. GUIDE / RESOURCE CHECKLISTS — icon fully outside the text column
     The green circular check previously sat ~6px from the copy and clipped the
     first letter. Move it fully outside the text column with a consistent ~20px
     gutter so it never covers a glyph.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"] .rc-checklist li {
    padding-left: 2.7rem !important;
  }

  body[data-vmx="1"] .rc-checklist .rc-check {
    left: 0 !important;
    top: 0.7rem !important;
    width: 1.5rem !important;
    height: 1.5rem !important;
  }

  /* ---------------------------------------------------------------------------
     3. CONTENT WIDTH — let long legal articles breathe (~92%)
     Replace the narrow fixed reading column with a ~92% measure; side breathing
     room now comes from the auto margins rather than a tight fixed cap.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) {
    max-width: 92% !important;
    margin-inline: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Slightly airier reading line-height for body copy on reading templates. */
  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) :where(p, li) {
    line-height: 1.8 !important;
  }

  /* ---------------------------------------------------------------------------
     4 & 5. HERO IMAGE — removed on mobile for a cleaner, text-focused opening.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    display: none !important;
    content: none !important;
  }

  /* ---------------------------------------------------------------------------
     6. CARD CONSISTENCY — one radius / border / shadow across content cards
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(
    .sit-card, .recent-card, .risk-card, .process-step, .sh-card, .faq-item,
    .founder-inner, .fin-ready, .vig-help-grid p, .vig-role-grid p
  ) {
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  /* ---------------------------------------------------------------------------
     7. TYPOGRAPHY — editorial, not poster. Ease oversized headings down a step
     and open up body line-height for a calmer read.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .hero h1 {
    font-size: clamp(2rem, 7.4vw, 2.4rem) !important;
    line-height: 1.12 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .section-header h2, .start-here-inner h2, .risks-inner h2, .founder-content h2,
    .fin-ready-title, .vig-trust-section h2, .search-resource-inner h2, .talk-ray-text h2
  ) {
    font-size: clamp(1.85rem, 7.4vw, 2.25rem) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .section-desc, .sh-desc, .src-desc, .faq-intro, .founder-body,
    .risks-reassurance, .sit-card p, .risk-card p, .process-step p
  ) {
    line-height: 1.78 !important;
  }

  /* ---------------------------------------------------------------------------
     8. STICKY BAR — Call / Text / Free Review (labels unchanged)
     Slightly shorter, equal spacing, and perfectly centred controls.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta {
    padding-top: 0.45rem !important;
    padding-bottom: calc(0.45rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta-inner {
    align-items: stretch !important;
    gap: 0.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta a {
    display: inline-flex !important;
    min-height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
  }

  /* ---------------------------------------------------------------------------
     9. MICRO SPACING — one 8 / 16 / 24 / 32 rhythm around section blocks
     heading → paragraph → cards → next section, aligned to the scale.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header, .risks-inner .section-header) {
    margin-bottom: 1.5rem !important; /* 24px: block → cards */
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .start-here-inner h2, .risks-inner h2) {
    margin-top: 1rem !important;      /* 16px: eyebrow → heading */
    margin-bottom: 0.5rem !important; /* 8px:  heading → paragraph */
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.sh-desc, .section-desc, .src-desc) {
    margin-bottom: 1.5rem !important; /* 24px: paragraph → cards */
  }

body[data-vmx="1"][data-vmx-page="home"] .section-cta-row {
    margin-top: 1.5rem !important;    /* 24px: cards → CTA */
  }
}

/* Resource Center cascade guard: keep blog-only patterns after shared VMX layers. */
@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="blog"] :where(.eyebrow, .section-eyebrow) {
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-card-tag {
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    gap: 0.8rem !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    contain: none !important;
    scroll-snap-type: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card {
    min-height: 0 !important;
    padding: 1.05rem !important;
    border-radius: 18px !important;
    box-shadow: var(--vrc-shadow) !important;
    scroll-snap-align: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column !important;
    grid-auto-columns: min(82vw, 330px) !important;
    gap: 1rem !important;
    margin-inline: calc(var(--vmx-page-gutter) * -1) !important;
    padding: 0.2rem var(--vmx-page-gutter) 1.25rem !important;
    overflow-x: auto !important;
    contain: none !important;
    scrollbar-width: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid .gux-card, .vmx-workbook-grid .gux-card, .recent-guide-card) {
    min-height: 100% !important;
    padding: 1.25rem !important;
    border-radius: var(--vrc-radius) !important;
    box-shadow: var(--vrc-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card {
    padding-top: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 99 !important;
  }
}

@media screen and (max-width: 340px) {
  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="blog"] {
    padding-bottom: calc(62px + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-inner {
    padding-inline: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-title {
    font-size: clamp(1.35rem, 5.6vw, 1.5rem) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] footer {
    padding: 2rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
    min-height: 0 !important;
    padding: 0.45rem 5.2vw calc(0.45rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta-inner {
    grid-template-columns: 1fr 1fr 1.35fr !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    gap: 0.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta a,
  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta .msc-text {
    width: auto !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0.5rem 0.4rem !important;
    font-size: 0.72rem !important;
    line-height: 1.7 !important;
    letter-spacing: 0.035em !important;
    overflow: visible !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta svg,
  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta .msc-text svg {
    width: 14px !important;
    height: 14px !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0.7rem var(--vmx-page-gutter) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--vrc-line) !important;
    background: var(--vrc-paper) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs::after {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-list {
    max-width: 42rem;
    margin-inline: auto !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-item,
  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-item a {
    color: var(--vrc-copy) !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-item a {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px !important;
    align-items: center;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid) {
    grid-auto-columns: min(78vw, 314px) !important;
    align-items: start !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid .gux-card, .vmx-workbook-grid .gux-card, .recent-guide-card) {
    min-height: 0 !important;
    align-self: start !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .nlogo {
    min-height: 44px;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-view-link {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  body[data-vmx="1"][data-vmx-page="blog"] footer a {
    min-width: 44px;
  }
}

/* ============================================================
   READABILITY CERTIFICATION — mobile contrast repairs
   ------------------------------------------------------------
   The mobile theme above recolours body copy to dark ink for the
   light editorial reading surface. A handful of components keep a
   navy / near-black background (in-page navigation panels, form &
   CTA headers, the Quick Answer header bar, footer column headings),
   so that ink text landed dark-on-dark and became unreadable. These
   rules restore legible light text on exactly those dark surfaces.
   Presentation only: colour, layering and one hero image visibility
   toggle. No wording, DOM, links or layout are changed.

   :is() is used so the container class contributes specificity and
   these rules win over the broad `.article/.rc-content/.guide-content`
   colour rules earlier in this file.
   ============================================================ */
@media screen and (max-width: 768px) {
  /* In-page navigation panels sit on a navy card — headings + links light. */
  body[data-vmx="1"] :is(nav.toc, nav.explore-related, nav.county-jump) :is(h2, h3, h4, strong) {
    color: #fff !important;
  }
  /* TOC links in .toc / .explore-related render directly on the navy card. */
  body[data-vmx="1"] :is(nav.toc, nav.explore-related) a {
    color: rgba(255, 255, 255, 0.9) !important;
  }
  /* .county-jump links render as light pills, so their label must stay dark. */
  body[data-vmx="1"] nav.county-jump .county-jump-links a {
    color: #14273f !important;
  }

  /* Navy headers on lead forms, CTAs and the Quick Answer bar. */
  body[data-vmx="1"] :is(.lcf-head, .cwf-text, .cta-box, .blog-cta-block, .rc-footer-cta, .rc-download, .quick-answer-header, .authority-ribbon, .sh-hero, .sh-final, .fr-hero, .fr-final, .bfc-header) :is(h1, h2, h3, h4) {
    color: #fff !important;
  }
  body[data-vmx="1"] :is(.lcf-head, .cwf-text, .cta-box, .blog-cta-block, .rc-footer-cta, .rc-download, .bfc-header) :is(p, li) {
    color: rgba(255, 255, 255, 0.82) !important;
  }
  body[data-vmx="1"] .authority-ribbon .ar-counties {
    color: rgba(255, 255, 255, 0.72) !important;
  }

  /* Footer column headings on the near-black footer. */
  body[data-vmx="1"] footer :is(h4) {
    color: #fff !important;
  }

  /* City & County heroes: hide the full-bleed landmark photo on mobile so the
     light editorial hero renders cleanly — matching the homepage's mobile hero.
     The photo stays on tablet / desktop and remains in the markup for SEO/OG. */
  body[data-vmx="1"] .municipality-hero-image,
  body[data-vmx="1"] .municipality-hero-credit {
    display: none !important;
  }
  body[data-vmx="1"] .hero .meta,
  body[data-vmx="1"] .hero .breadcrumb {
    color: #585868 !important;
  }
  body[data-vmx="1"] .hero .breadcrumb a {
    color: #3f4f69 !important;
  }
  /* In-hero Quick Answer paragraph on the light sage card. */
  body[data-vmx="1"] .hero-qa p {
    color: #3a3a4a !important;
  }
}

/* Homepage mobile rebuild: follows the source DOM sequence without ordering hacks. */
@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="home"] {
    display: block !important;
    overflow-x: hidden;
    padding-bottom: 0 !important;
    background: #f7f4ef !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] > .hero,
  body[data-vmx="1"][data-vmx-page="home"] > .talk-ray-section,
  body[data-vmx="1"][data-vmx-page="home"] > .authority-ribbon,
  body[data-vmx="1"][data-vmx-page="home"] > .mobile-sticky-cta {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero {
    position: relative;
    isolation: isolate;
    display: block;
    overflow: hidden;
    padding: calc(5.6rem + env(safe-area-inset-top)) clamp(1.15rem, 5.2vw, 1.5rem) 2.35rem;
    background:
      radial-gradient(circle at 92% 8%, rgba(184, 156, 106, 0.2), transparent 34%),
      linear-gradient(150deg, #122844 0%, #0f1f38 62%, #0b192c 100%);
    color: #fff;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::before,
  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    pointer-events: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::before {
    inset: 0;
    opacity: 0.28;
    background-image:
      linear-gradient(115deg, transparent 0 62%, rgba(255,255,255,0.06) 62% 62.5%, transparent 62.5%),
      linear-gradient(25deg, transparent 0 78%, rgba(184,156,106,0.16) 78% 78.5%, transparent 78.5%);
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::after {
    width: 13rem;
    height: 13rem;
    right: -6.5rem;
    bottom: -5rem;
    border: 1px solid rgba(184, 156, 106, 0.26);
    border-radius: 46% 54% 62% 38%;
    transform: rotate(20deg);
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-inner {
    width: 100%;
    max-width: 42rem;
    margin: 0 auto;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.9rem;
    color: #d4b579;
    font: 700 0.64rem/1.35 'DM Sans', sans-serif;
    letter-spacing: 0.15em;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-eyebrow::before {
    content: "";
    width: 24px;
    height: 1px;
    flex: 0 0 auto;
    background: currentColor;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero h1 {
    max-width: 12.5em;
    margin: 0 0 0.85rem;
    color: #fff;
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2rem, 8.5vw, 2.55rem);
    font-weight: 500;
    line-height: 1.03;
    letter-spacing: -0.025em;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-copy {
    max-width: 38rem;
    margin: 0 0 1.2rem;
    color: rgba(255, 255, 255, 0.82);
    font-size: clamp(0.91rem, 3.8vw, 1rem);
    line-height: 1.55;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-primary {
    display: inline-flex;
    min-height: 50px;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1rem;
    border: 1px solid #c7a667;
    border-radius: 14px;
    background: #c7a667;
    color: #102139;
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-align: center;
    text-decoration: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-secondary {
    display: inline-flex;
    min-height: 44px;
    flex: 0 0 auto;
    align-items: center;
    color: rgba(255, 255, 255, 0.9);
    border-bottom: 1px solid rgba(212, 181, 121, 0.7);
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.45rem;
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.64rem;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.025em;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services {
    scroll-margin-top: calc(76px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .start-here-section, .founder-section, .process-section, .risks-section,
    #recent-situations, .property-toolkit-start, .search-resource-center,
    #faq, .fin-bridge, .fin-ready-section, .final-cta-section,
    .vig-professional-network, .vig-our-role
  ) {
    padding-left: clamp(1.15rem, 5.2vw, 1.5rem) !important;
    padding-right: clamp(1.15rem, 5.2vw, 1.5rem) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .start-here-section, .founder-section, .process-section, .risks-section,
    #recent-situations, .property-toolkit-start, .search-resource-center, #faq
  ) {
    padding-top: 3.25rem !important;
    padding-bottom: 3.25rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-desktop-copy,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-desktop-copy,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner > .exp-opener,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner > .cta-note,
  body[data-vmx="1"][data-vmx-page="home"] .fin-ready > p:first-of-type,
  body[data-vmx="1"][data-vmx-page="home"] .vig-professional-network .vig-conversation-cta {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-mobile-copy,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-mobile-copy {
    display: block;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge {
    padding-top: 3.1rem !important;
    padding-bottom: 1.2rem !important;
    background: #f7f4ef !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-inner {
    text-align: left;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-title {
    margin: 0 0 0.7rem !important;
    color: #12263f !important;
    font-size: clamp(1.95rem, 8vw, 2.35rem) !important;
    line-height: 1.05 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-desc {
    margin: 0 !important;
    color: #43536a !important;
    font-size: 0.95rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-section {
    padding-top: 1.2rem !important;
    padding-bottom: 3.25rem !important;
    background: #f7f4ef !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-mobile-copy {
    max-width: 42rem;
    margin: 0 auto 1.6rem !important;
  }
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"] main nav.explore-related {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
  }
}

@media screen and (max-width: 360px) {
  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero {
    padding-top: calc(5.35rem + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero h1 {
    font-size: 1.92rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-actions {
    gap: 0.75rem;
  }
}

}

:root{--vig-trust-navy:#10243f;--vig-trust-ink:#22354a;--vig-trust-gold:#b89c6a;--vig-trust-paper:#f7f4ee;--vig-trust-line:#ded5c5}
.vig-trust-section{box-sizing:border-box;padding:clamp(3rem,7vw,5.5rem) clamp(1.25rem,5vw,4rem);background:var(--vig-trust-paper);color:var(--vig-trust-ink);border-top:1px solid var(--vig-trust-line)}
.vig-trust-section *{box-sizing:border-box}
.vig-trust-inner{max-width:900px;margin:0 auto}
.vig-trust-label{margin:0 0 .7rem;color:#806839;font:700 .72rem/1.4 "DM Sans",sans-serif;letter-spacing:.15em;text-transform:uppercase}
.vig-trust-section h2{max-width:760px;margin:0 0 1rem;color:var(--vig-trust-navy);font:500 clamp(1.75rem,4vw,2.65rem)/1.12 "Cormorant Garamond",Georgia,serif}
.vig-trust-section p{margin:.75rem 0;font-size:clamp(.96rem,1.7vw,1.05rem);line-height:1.75}
.vig-brand-promise{padding:1rem 1.25rem;border-left:3px solid var(--vig-trust-gold);background:rgba(255,255,255,.62);color:var(--vig-trust-navy);font-weight:600}
.vig-role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1.4rem 0}
.vig-role-grid p{margin:0;padding:1.2rem;border:1px solid var(--vig-trust-line);background:#fff}
.vig-role-grid strong,.vig-role-grid span{display:block}.vig-role-grid strong{margin-bottom:.35rem;color:var(--vig-trust-navy)}
.vig-help-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:1.4rem 0}
.vig-help-grid p{margin:0;padding:1.2rem;border:1px solid var(--vig-trust-line);background:#fff}
.vig-help-grid strong,.vig-help-grid span{display:block}.vig-help-grid strong{margin-bottom:.35rem;color:var(--vig-trust-navy)}
.vig-network-summary{font-weight:600;color:var(--vig-trust-navy)}
.vig-conversation-cta{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;margin-top:1.6rem;padding:1.25rem 1.4rem;background:var(--vig-trust-navy);color:#fff}
.vig-conversation-cta p{margin:0}.vig-conversation-cta strong,.vig-conversation-cta span{display:block}.vig-conversation-cta strong{margin-bottom:.2rem;color:#fff}
.vig-conversation-cta a{flex:0 0 auto;padding:.8rem 1rem;border:1px solid var(--vig-trust-gold);background:var(--vig-trust-gold);color:var(--vig-trust-navy);font-weight:700;text-decoration:none}
.vig-conversation-cta a:hover,.vig-conversation-cta a:focus-visible{background:#fff;border-color:#fff;outline:2px solid transparent}
.vig-professional-note{font-size:.94rem!important}
.vig-educational-notice{background:#fff}
.vig-professional-network{background:var(--vig-trust-paper)}
.vig-our-role{background:#fff}
.vig-workbook-notice{box-sizing:border-box;max-width:900px;margin:2rem auto;padding:1.15rem 1.35rem;border:1px solid var(--vig-trust-line);border-left:4px solid var(--vig-trust-gold);background:var(--vig-trust-paper);color:var(--vig-trust-ink);font-family:"DM Sans",sans-serif;line-height:1.65}
.vig-workbook-notice strong{display:block;margin-bottom:.25rem;color:var(--vig-trust-navy)}.vig-workbook-notice p{margin:0}

/* Contextual post-hero trust layer — compact by design. */
.vig-context-trust{box-sizing:border-box;position:relative;z-index:2;background:#fff;color:var(--vig-trust-ink);border-bottom:1px solid var(--vig-trust-line);font-family:"DM Sans",sans-serif}
.vig-context-trust *{box-sizing:border-box}
.vig-context-trust__inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1.1rem;padding:1.15rem clamp(1.25rem,5vw,4rem)}
.vig-context-trust__photo{width:54px;height:54px;border-radius:50%;object-fit:cover;border:1px solid rgba(184,156,106,.65);box-shadow:0 5px 16px rgba(16,36,63,.1)}
.vig-context-trust__copy{min-width:0}
.vig-context-trust__label{margin:0 0 .15rem;color:#806839;font-size:.64rem;font-weight:700;letter-spacing:.13em;line-height:1.4;text-transform:uppercase}
.vig-context-trust h2{margin:0;color:var(--vig-trust-navy);font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(1.18rem,2vw,1.48rem);font-weight:500;line-height:1.2}
.vig-context-trust__copy>p:not(.vig-context-trust__label){max-width:850px;margin:.28rem 0 0;font-size:.82rem;line-height:1.58;color:#4b5b6d}
.vig-context-trust ul{display:flex;flex-wrap:wrap;gap:.25rem 1rem;margin:.5rem 0 0;padding:0;list-style:none}
.vig-context-trust li{position:relative;padding-left:.85rem;color:#657286;font-size:.68rem;line-height:1.45}
.vig-context-trust li::before{content:'';position:absolute;left:0;top:.48em;width:.34rem;height:.34rem;border-radius:50%;background:var(--vig-trust-gold)}
.vig-context-trust__cta{display:inline-flex;align-items:center;justify-content:center;max-width:220px;min-height:44px;padding:.72rem 1rem;border:1px solid var(--vig-trust-gold);border-radius:8px;background:transparent;color:var(--vig-trust-navy);font-size:.7rem;font-weight:700;letter-spacing:.05em;line-height:1.35;text-align:center;text-decoration:none;text-transform:uppercase;transition:background .2s ease,color .2s ease,transform .2s ease}
.vig-context-trust__cta:hover{background:var(--vig-trust-gold);transform:translateY(-1px)}
.vig-context-trust__cta:focus-visible{outline:3px solid #3f72a8;outline-offset:3px}
.vig-context-trust--light{background:#fffdfa}
.vig-context-trust--light .vig-context-trust__inner{display:block;max-width:1040px;padding-top:.85rem;padding-bottom:.85rem}
.vig-context-trust--light h2{font-size:clamp(1.05rem,1.8vw,1.28rem)}
.vig-context-trust--light .vig-context-trust__copy>p:not(.vig-context-trust__label){max-width:940px;font-size:.78rem}
.vig-context-trust--light ul{margin-top:.4rem}

.vig-footer-trust{box-sizing:border-box;padding:1rem clamp(1.25rem,5vw,4rem);background:#0b192d;color:rgba(247,244,239,.72);border-top:1px solid rgba(184,156,106,.25);font-family:"DM Sans",sans-serif;text-align:center}
.vig-footer-trust p{max-width:1050px;margin:0 auto;font-size:.72rem;line-height:1.65}
.vig-footer-trust strong{color:#d4b98a;font-weight:600}
@media(max-width:800px){.vig-help-grid{grid-template-columns:1fr}.vig-conversation-cta{align-items:flex-start;flex-direction:column}.vig-conversation-cta a{width:100%;text-align:center}}
@media(max-width:900px){.vig-context-trust__inner{grid-template-columns:auto minmax(0,1fr)}.vig-context-trust__cta{grid-column:2;justify-self:start;max-width:none}}
@media(max-width:680px){.vig-role-grid{grid-template-columns:1fr}.vig-trust-section{padding-left:1.15rem;padding-right:1.15rem}.vig-workbook-notice{margin:1.5rem 1rem}.vig-context-trust__inner{grid-template-columns:1fr;gap:.65rem;padding:1rem 1.15rem}.vig-context-trust__photo{width:48px;height:48px}.vig-context-trust__cta{grid-column:1;width:100%;justify-self:stretch}.vig-context-trust h2{font-size:1.22rem}.vig-context-trust__copy>p:not(.vig-context-trust__label){font-size:.79rem}.vig-context-trust ul{display:grid;grid-template-columns:1fr;gap:.22rem}.vig-context-trust--light .vig-context-trust__inner{padding:.85rem 1.15rem}.vig-context-trust--light ul{display:flex;gap:.2rem .8rem}.vig-footer-trust{padding:.9rem 1.15rem}.vig-footer-trust p{font-size:.68rem;text-align:left}}
@media(prefers-reduced-motion:reduce){.vig-trust-section *{scroll-behavior:auto!important}}

/* ============================================================
   READABILITY CERTIFICATION — footer legibility (all viewports)
   The footer navigation links and copyright line were set at very
   low opacity (rgba white .15–.3) against the near-black footer,
   failing contrast. Raise them to a comfortably readable level.
   Foreground colour only — no layout or wording change. Loads on
   every page after the inline styles, so it applies site-wide.
   ============================================================ */
footer .flinks a{color:rgba(255,255,255,.62)}
footer .fcopy{color:rgba(255,255,255,.5)}

/* ============================================================
   DESKTOP EXPERIENCE 1.0  —  shared trust section, wide screens
   ------------------------------------------------------------
   The trust / educational-role band appears site-wide (homepage,
   About, Contact, guides, workbooks …). On large screens open its
   inner measure so the two- and three-up role/help grids use the
   horizontal space and read as the premium desktop version rather
   than a narrow 900px column adrift on a 1600px canvas. Additive,
   min-width only — the locked mobile experience (max-width:768px,
   including the vmx-mobile @import above) is never affected.
   ============================================================ */
@media(min-width:1440px){
  .vig-trust-inner{max-width:1040px}
  .vig-workbook-notice{max-width:1040px}
}
@media(min-width:1600px){
  .vig-trust-inner{max-width:1120px}
  .vig-workbook-notice{max-width:1120px}
}

/* Sitewide consultation prompt — shared brand layer, loaded by production-standard.js */
body.vig-consultation-open{overflow:hidden}
.vig-consultation{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;padding:1rem;opacity:0;pointer-events:none;transition:opacity .2s ease}
.vig-consultation.is-visible{opacity:1;pointer-events:auto}
.vig-consultation__backdrop{position:absolute;inset:0;background:rgba(5,14,29,.72);backdrop-filter:blur(5px)}
.vig-consultation__panel{position:relative;display:grid;grid-template-columns:7rem minmax(0,1fr);width:min(43rem,calc(100vw - 2rem));max-height:calc(100vh - 2rem);overflow:auto;background:#fbfaf7;color:#0f1f38;border:1px solid rgba(184,156,106,.52);border-radius:1.15rem;box-shadow:0 2rem 5rem rgba(5,14,29,.38);outline:none;transform:translateY(14px) scale(.985);transition:transform .22s ease}
.vig-consultation.is-visible .vig-consultation__panel{transform:translateY(0) scale(1)}
.vig-consultation__accent{display:grid;place-items:center;min-height:100%;background:linear-gradient(155deg,#0f1f38,#172d4d);border-radius:1.08rem 0 0 1.08rem;color:#d4b98a;overflow:hidden}
.vig-consultation__accent span{display:grid;place-items:center;width:3.75rem;height:3.75rem;border:1px solid rgba(212,185,138,.7);border-radius:50%;font-family:Georgia,'Times New Roman',serif;font-size:2rem;box-shadow:0 0 0 .5rem rgba(212,185,138,.08)}
.vig-consultation__content{padding:2.2rem 2.35rem 2.1rem}
.vig-consultation__eyebrow{margin:0 0 .72rem;color:#8a6d38;font-size:.7rem;font-weight:800;letter-spacing:.14em;line-height:1.4;text-transform:uppercase}
.vig-consultation__content h2{margin:0;color:#0f1f38;font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(1.9rem,4vw,2.55rem);font-weight:500;letter-spacing:-.02em;line-height:1.06}
.vig-consultation__body{margin:1rem 0 0;color:#34445d;font-size:.96rem;line-height:1.72}
.vig-consultation__reassurance{margin:.8rem 0 0;padding-top:.8rem;border-top:1px solid rgba(184,156,106,.28);color:#617087;font-size:.79rem;line-height:1.55}
.vig-consultation__actions{display:flex;align-items:center;gap:.75rem;margin-top:1.35rem}
.vig-consultation__primary,.vig-consultation__secondary{min-height:2.85rem;border-radius:999px;font:inherit;font-size:.78rem;font-weight:800;letter-spacing:.04em;line-height:1.2;text-decoration:none;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}
.vig-consultation__primary{display:inline-flex;align-items:center;justify-content:center;padding:.82rem 1.25rem;background:#b89c6a;color:#0f1f38;box-shadow:0 .55rem 1.25rem rgba(113,86,38,.2)}
.vig-consultation__secondary{padding:.75rem 1rem;background:transparent;color:#34445d;border:1px solid rgba(15,31,56,.22);cursor:pointer}
.vig-consultation__primary:hover,.vig-consultation__secondary:hover{transform:translateY(-1px)}
.vig-consultation__primary:hover{background:#c8aa73;box-shadow:0 .7rem 1.4rem rgba(113,86,38,.27)}
.vig-consultation__secondary:hover{background:rgba(15,31,56,.05)}
.vig-consultation__primary:focus-visible,.vig-consultation__secondary:focus-visible,.vig-consultation__close:focus-visible{outline:3px solid #3f72a8;outline-offset:3px}
.vig-consultation__close{position:absolute;top:.75rem;right:.75rem;z-index:2;display:grid;place-items:center;width:2.35rem;height:2.35rem;padding:0;background:#fff;color:#0f1f38;border:1px solid rgba(15,31,56,.16);border-radius:50%;font-size:1.45rem;line-height:1;cursor:pointer;box-shadow:0 .3rem .8rem rgba(15,31,56,.1)}
@media(max-width:767px){.vig-consultation--sheet{align-items:end;padding:0}.vig-consultation--sheet .vig-consultation__backdrop{background:rgba(5,14,29,.46);backdrop-filter:blur(2px)}.vig-consultation--sheet .vig-consultation__panel{position:absolute;left:0;right:0;bottom:var(--vig-sticky-clearance,env(safe-area-inset-bottom));grid-template-columns:1fr;width:100%;max-height:min(calc(100vh - var(--vig-sticky-clearance,0px) - 1rem),40rem);border-width:1px 0 0;border-radius:1.35rem 1.35rem 0 0;transform:translateY(calc(100% + var(--vig-sticky-clearance,0px) + env(safe-area-inset-bottom)))}.vig-consultation--sheet.is-visible .vig-consultation__panel{transform:translateY(0)}.vig-consultation--sheet .vig-consultation__accent{display:none}.vig-consultation__panel{grid-template-columns:1fr;width:min(35rem,calc(100vw - 1rem))}.vig-consultation--modal .vig-consultation__accent{display:none}.vig-consultation__content{padding:1.75rem 1.35rem 1.45rem}.vig-consultation__content h2{padding-right:1.8rem;font-size:1.85rem}.vig-consultation__body{font-size:.9rem;line-height:1.62}.vig-consultation__actions{align-items:stretch;flex-direction:column}.vig-consultation__primary,.vig-consultation__secondary{width:100%}}
@media(prefers-reduced-motion:reduce){.vig-consultation,.vig-consultation__panel,.vig-consultation__primary,.vig-consultation__secondary{transition:none}}

/* /financial-readiness.css */
/* ============================================================
   FINANCIAL READINESS — reusable educational component
   Additive module for the Viera Investment Group site.
   Mirrors the existing design system (gold accent, cream field,
   navy Cormorant Garamond headings, DM Sans body) used by the
   shared .callout / .county-cta components.

   Fully self-contained: every design token falls back to a
   literal brand value so the component renders identically on
   pages that do and do not define the site's CSS variables
   (e.g. the bespoke homepage).
   ============================================================ */
.fin-ready-section{
  padding:1.5rem 1.25rem;
}
.fin-ready{
  --fr-gold:var(--gold,#b89c6a);
  --fr-goldl:var(--goldl,#d4b98a);
  --fr-navy:var(--navy,#0f1f38);
  --fr-tm:var(--tm,#262636);
  max-width:720px;
  margin:1.25rem auto;
  background:linear-gradient(180deg,rgba(184,156,106,.10),rgba(184,156,106,.04));
  border:1px solid rgba(184,156,106,.28);
  border-left:3px solid var(--fr-gold);
  border-radius:0 12px 12px 0;
  padding:2rem 2.25rem;
  box-shadow:0 6px 18px rgba(15,31,56,.06);
}
.fin-ready-eyebrow{
  display:block;
  font-family:'DM Sans',Arial,sans-serif;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--fr-gold);
  margin:0 0 .6rem;
}
.fin-ready-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.6rem;
  font-weight:600;
  line-height:1.25;
  color:var(--fr-navy);
  margin:0 0 .85rem;
}
.fin-ready p{
  font-family:'DM Sans',Arial,sans-serif;
  font-size:.94rem;
  line-height:1.75;
  color:var(--fr-tm);
  margin:0 0 1rem;
  max-width:62ch;
}
.fin-ready-note{
  display:block;
  margin-top:.75rem;
  font-family:'DM Sans',Arial,sans-serif;
  font-size:.78rem;
  line-height:1.5;
  color:var(--tl,#5a5a6e);
}
.fin-ready-cta{
  display:inline-block;
  margin-top:.35rem;
  padding:.85rem 1.85rem;
  background:var(--fr-gold);
  color:var(--fr-navy);
  font-family:'DM Sans',Arial,sans-serif;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  border:1px solid var(--fr-gold);
  border-radius:8px;
  transition:background .2s,border-color .2s,transform .2s,box-shadow .2s;
}
.fin-ready-cta:hover{
  background:var(--fr-goldl);
  border-color:var(--fr-goldl);
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(184,156,106,.28);
}
.fin-ready-cta:focus-visible{
  outline:2px solid var(--fr-gold);
  outline-offset:2px;
}
@media(max-width:768px){
  .fin-ready{padding:1.6rem 1.35rem}
  .fin-ready-title{font-size:1.4rem}
  .fin-ready-cta{display:block;width:100%;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .fin-ready-cta{transition:none}
  .fin-ready-cta:hover{transform:none}
}

/* /assets/css/vmx-mobile.css */
/* Viera Mobile Experience 2.0 — premium mobile product layer. */
body[data-vmx="1"] .vmx-toc-toggle {
  display: none;
}

.mobile-home-hero,
.fin-bridge-mobile-copy,
.final-cta-mobile-copy {
  display: none;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] {
  display: none;
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 99;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] .mobile-sticky-cta-inner {
  display: flex;
  max-width: 480px;
  margin: 0 auto;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  text-align: center;
  text-decoration: none;
}

body[data-vmx="1"] .mobile-sticky-cta[data-vig-runtime-sticky="true"] svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* Resource Center 1.0 — blog-only clone of the approved homepage mobile system. */
.vmx-mobile-card-image,
.vmx-swipe-cue,
body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
  display: none;
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="blog"] {
    --vrc-ink: #14273f;
    --vrc-copy: #405064;
    --vrc-canvas: #f2efe7;
    --vrc-paper: #fffdf8;
    --vrc-sage: #dce5dc;
    --vrc-sage-deep: #6f816f;
    --vrc-gold: #ad8b53;
    --vrc-line: rgba(20, 39, 63, 0.11);
    --vrc-radius: 20px;
    --vrc-shadow: 0 8px 24px rgba(20, 39, 63, 0.07);
    background: var(--vrc-canvas) !important;
    color: var(--vrc-copy) !important;
    padding-bottom: calc(72px + env(safe-area-inset-bottom));
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.hero, .search-section, .gux-section, .recent-guides, .fin-ready-section, .guidance-section, footer) {
    scroll-margin-top: calc(76px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero {
    padding: calc(6.15rem + env(safe-area-inset-top)) var(--vmx-page-gutter) 2rem !important;
    background: linear-gradient(145deg, rgba(255, 253, 248, 0.99), rgba(242, 239, 231, 0.97)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-inner {
    width: 100%;
    max-width: 42rem;
    margin: 0 auto;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero h1 {
    max-width: 10.8em !important;
    margin: 0 0 1rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(2.25rem, 9.7vw, 2.85rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.025em !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero h1 em {
    color: var(--vrc-ink) !important;
    text-decoration: underline;
    text-decoration-color: rgba(173, 139, 83, 0.58);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.1em;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-sub {
    max-width: 38rem;
    margin: 0 !important;
    color: var(--vrc-copy) !important;
    font-size: clamp(1.06rem, 4.4vw, 1.16rem) !important;
    line-height: 1.7 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-positioning {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.55rem !important;
    margin: 1.25rem 0 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-positioning-badge {
    min-height: 44px;
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(111, 129, 111, 0.18);
    border-radius: 14px;
    color: #526255 !important;
    background: rgba(220, 229, 220, 0.56);
    font-size: 0.78rem !important;
    line-height: 1.4;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-section--blog {
    padding: 1.5rem var(--vmx-page-gutter) 2rem !important;
    border: 0 !important;
    background: var(--vrc-canvas) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-inner {
    max-width: 42rem;
    padding: 1.35rem !important;
    border: 1px solid var(--vrc-line);
    border-radius: var(--vrc-radius);
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-heading {
    margin-bottom: 0.55rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(1.7rem, 7.6vw, 2rem) !important;
    line-height: 1.12 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-sub {
    margin-bottom: 1rem !important;
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.68 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-bar-wrap {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 0.55rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-input {
    width: 100%;
    min-width: 0;
    min-height: 52px !important;
    padding: 0.8rem 0.9rem !important;
    border: 1px solid rgba(20, 39, 63, 0.22) !important;
    border-radius: 13px !important;
    color: var(--vrc-ink) !important;
    background: #fff !important;
    font-size: 1rem !important;
    line-height: 1.3;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-btn {
    min-width: 88px;
    min-height: 52px !important;
    padding: 0.75rem 1rem !important;
    border: 1px solid var(--vrc-gold) !important;
    border-radius: 13px !important;
    color: #fff !important;
    background: var(--vrc-ink) !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.search-input, .search-btn, .search-chip, .gux-card, .browse-group a, .recent-guide-card, .mobile-sticky-cta a):focus-visible {
    outline: 3px solid #d6a74a !important;
    outline-offset: 3px !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-chips {
    display: flex !important;
    gap: 0.55rem !important;
    margin: 1rem calc(var(--vmx-page-gutter) * -0.25) 0 !important;
    padding: 0.15rem calc(var(--vmx-page-gutter) * 0.25) 0.45rem !important;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-chips::-webkit-scrollbar { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] .search-chip {
    flex: 0 0 auto;
    min-height: 44px !important;
    padding: 0.6rem 0.8rem !important;
    border: 1px solid rgba(111, 129, 111, 0.25) !important;
    border-radius: 12px !important;
    color: var(--vrc-ink) !important;
    background: rgba(220, 229, 220, 0.5) !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    scroll-snap-align: start;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-section, .recent-guides, .fin-ready-section, .guidance-section) {
    padding: 3rem var(--vmx-page-gutter) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-section--white, .recent-guides, .fin-ready-section) {
    border: 0 !important;
    background: var(--vrc-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-section--cream {
    border: 0 !important;
    background: var(--vrc-canvas) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-inner, .recent-guides-inner, .fin-ready, .guidance-inner) {
    max-width: 42rem;
    margin-inline: auto;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.situation-header, .recent-guides-header) {
    margin-bottom: 1.5rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.situation-header h2, .recent-guides-header h2, .fin-ready-title, .guidance-heading) {
    margin: 0.9rem 0 0.65rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(2rem, 8.6vw, 2.4rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.025em !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.section-desc, .recent-guides-header p, .fin-ready-note, .guidance-sub) {
    max-width: 38rem;
    color: var(--vrc-copy) !important;
    font-size: 1.06rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.8rem !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card {
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 1.05rem !important;
    border: 1px solid var(--vrc-line) !important;
    border-radius: 18px !important;
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card::before { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-icon {
    width: 42px !important;
    height: 42px !important;
    margin: 0 0 0.8rem !important;
    padding: 0.55rem;
    border-radius: 12px;
    color: var(--vrc-ink) !important;
    background: var(--vrc-sage);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-title {
    margin-bottom: 0.55rem !important;
    color: var(--vrc-ink) !important;
    font-size: clamp(1.28rem, 5.4vw, 1.5rem) !important;
    line-height: 1.15 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-desc {
    margin-bottom: 0.85rem !important;
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.58 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-card-link,
  body[data-vmx="1"][data-vmx-page="blog"] .browse-view-link {
    color: #6f542b !important;
    font-size: 0.8rem !important;
    line-height: 1.35 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-swipe-cue {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: -0.35rem 0 0.8rem;
    color: #5b6d5d;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-swipe-cue::after {
    content: "→";
    font-size: 1rem;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column !important;
    grid-auto-columns: min(82vw, 330px) !important;
    gap: 1rem !important;
    margin-inline: calc(var(--vmx-page-gutter) * -1) !important;
    padding: 0.2rem var(--vmx-page-gutter) 1.25rem !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: var(--vmx-page-gutter);
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid)::-webkit-scrollbar { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid .gux-card, .vmx-workbook-grid .gux-card, .recent-guide-card) {
    min-width: 0 !important;
    min-height: 100% !important;
    padding: 1.25rem !important;
    border: 1px solid var(--vrc-line) !important;
    border-radius: var(--vrc-radius) !important;
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow) !important;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card {
    padding-top: 0 !important;
    overflow: hidden;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card::before,
  body[data-vmx="1"][data-vmx-page="blog"] .vmx-workbook-grid .gux-card::before { display: none; }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-mobile-card-image {
    display: block;
    width: calc(100% + 2.5rem);
    max-width: none;
    height: 176px;
    margin: 0 -1.25rem 1.15rem;
    object-fit: cover;
    object-position: center;
    background: var(--vrc-sage);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card:first-child .vmx-mobile-card-image {
    object-position: center 42%;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid) .gux-card-title {
    color: var(--vrc-ink) !important;
    font-size: clamp(1.42rem, 6vw, 1.65rem) !important;
    line-height: 1.16 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid) .gux-card-desc {
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-card-tag {
    color: #6f542b !important;
    font-size: 0.74rem !important;
    line-height: 1.35 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .workbook-downloads {
    margin-top: 2.75rem !important;
    padding-top: 2.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group {
    padding: 1.25rem !important;
    border: 1px solid var(--vrc-line) !important;
    border-radius: var(--vrc-radius) !important;
    background: var(--vrc-paper) !important;
    box-shadow: var(--vrc-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-head {
    align-items: flex-start !important;
    gap: 0.75rem !important;
    margin-bottom: 0.85rem !important;
    padding-bottom: 0.85rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-head svg {
    width: 42px !important;
    height: 42px !important;
    padding: 0.55rem;
    border-radius: 12px;
    color: var(--vrc-ink) !important;
    background: var(--vrc-sage);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-title {
    padding-top: 0.35rem;
    color: var(--vrc-ink) !important;
    font-size: clamp(1.4rem, 6.1vw, 1.65rem) !important;
    line-height: 1.16 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-group-desc,
  body[data-vmx="1"][data-vmx-page="blog"] .browse-list a {
    color: var(--vrc-copy) !important;
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-list li { margin-bottom: 0.4rem !important; }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-list a {
    min-height: 44px;
    padding: 0.45rem 0;
    align-items: flex-start !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .recent-guide-card {
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
    min-height: 220px !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .rgc-tag {
    color: #6f542b !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .rgc-title {
    color: var(--vrc-ink) !important;
    font-size: clamp(1.4rem, 6vw, 1.65rem) !important;
    line-height: 1.18 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .rgc-date {
    color: var(--vrc-copy) !important;
    font-size: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready-section {
    background: var(--vrc-sage) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready {
    padding: 1.4rem !important;
    border: 1px solid rgba(20, 39, 63, 0.12) !important;
    border-radius: var(--vrc-radius) !important;
    background: rgba(255, 253, 248, 0.82) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready-eyebrow {
    color: #596b5b !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .fin-ready-cta {
    width: 100%;
    min-height: 50px;
    border-radius: 13px !important;
    color: #fff !important;
    background: var(--vrc-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-section {
    background: linear-gradient(165deg, #14273f, #0c1a2d) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-heading,
  body[data-vmx="1"][data-vmx-page="blog"] .guidance-sub,
  body[data-vmx="1"][data-vmx-page="blog"] .guidance-section :where(label, .guidance-reassurance, .guidance-support-line) {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-sub,
  body[data-vmx="1"][data-vmx-page="blog"] .guidance-section .form-trust-values li {
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 1rem !important;
    line-height: 1.62 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .form-trust-values {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: start !important;
    gap: 0.55rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-form {
    margin-top: 1.5rem;
    padding: 1.15rem !important;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--vrc-radius);
    background: rgba(255, 255, 255, 0.06);
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-fields {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-field :where(input, select) {
    width: 100%;
    min-height: 50px !important;
    border-radius: 12px !important;
    font-size: 1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .guidance-btn {
    width: 100%;
    min-height: 50px !important;
    border-radius: 13px !important;
    color: var(--vrc-ink) !important;
    background: #e7d8bd !important;
    font-size: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] footer {
    padding: 3rem var(--vmx-page-gutter) calc(2rem + env(safe-area-inset-bottom)) !important;
    background: #060d1a !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-top {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-brand { max-width: none !important; }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-brand p,
  body[data-vmx="1"][data-vmx-page="blog"] .footer-col a,
  body[data-vmx="1"][data-vmx-page="blog"] .footer-nap-inner,
  body[data-vmx="1"][data-vmx-page="blog"] .footer-linkedin a,
  body[data-vmx="1"][data-vmx-page="blog"] .fcopy {
    font-size: 0.94rem !important;
    line-height: 1.68 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.75rem 1rem !important;
    width: 100%;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-col h4 {
    margin-bottom: 0.65rem !important;
    font-size: 0.78rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-col a {
    min-height: 44px;
    margin: 0 !important;
    padding: 0.35rem 0;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-nap-inner {
    align-items: stretch !important;
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-nap-col {
    width: 100%;
    padding: 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-seo-links {
    justify-content: flex-start !important;
    gap: 0.4rem 1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .footer-seo-links a {
    min-height: 44px;
    font-size: 0.85rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
    display: block !important;
    padding-top: 0.45rem !important;
    padding-bottom: calc(0.45rem + env(safe-area-inset-bottom)) !important;
    background: rgba(15, 31, 56, 0.98) !important;
    border-top: 1px solid rgba(169, 131, 75, 0.4) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta-inner {
    grid-template-columns: minmax(74px, 0.85fr) 48px minmax(120px, 1.3fr) !important;
    align-items: stretch !important;
    gap: 0.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta a {
    display: inline-flex !important;
    min-height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta .msc-review {
    border-color: var(--vrc-gold) !important;
    color: var(--vrc-ink) !important;
    background: #e7d8bd !important;
    font-weight: 700 !important;
  }
}

@media screen and (max-width: 340px) {
  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    grid-template-columns: 1fr !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-bar-wrap {
    grid-template-columns: 1fr !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .search-btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid, .search-chips) {
    scroll-behavior: auto !important;
  }
}

/*
 * VMX 2.0 visual direction
 * A calm, editorial New Jersey property help center composed specifically for phones.
 */
@media screen and (max-width: 768px) {
  body[data-vmx="1"] {
    --vmx-page-gutter: clamp(1.1rem, 5.4vw, 1.5rem);
    --vmx-ink: #14273f;
    --vmx-ink-soft: #405064;
    --vmx-paper: #fffdf8;
    --vmx-canvas: #f2efe7;
    --vmx-sage: #dce5dc;
    --vmx-sage-deep: #6f816f;
    --vmx-sand: #e7d8bd;
    --vmx-gold: #ad8b53;
    --vmx-coral: #b9664b;
    --vmx-line: rgba(20, 39, 63, 0.11);
    --vmx-card-shadow: 0 18px 50px rgba(20, 39, 63, 0.1);
    --vmx-card-shadow-soft: 0 8px 24px rgba(20, 39, 63, 0.07);
    color: var(--vmx-ink-soft);
    background: var(--vmx-canvas);
  }

  body[data-vmx="1"]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
      radial-gradient(circle at 100% 8%, rgba(173, 139, 83, 0.12), transparent 24rem),
      radial-gradient(circle at 0 42%, rgba(111, 129, 111, 0.11), transparent 22rem),
      var(--vmx-canvas);
  }

  body[data-vmx="1"] :where(h1, h2, h3, h4) {
    color: var(--vmx-ink);
    text-wrap: balance;
  }

  body[data-vmx="1"] :where(p, li) {
    line-height: 1.72;
  }

  body[data-vmx="1"] nav {
    min-height: calc(70px + env(safe-area-inset-top));
    padding: calc(0.7rem + env(safe-area-inset-top)) var(--vmx-page-gutter) 0.7rem !important;
    background: rgba(16, 35, 57, 0.96) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 30px rgba(9, 23, 39, 0.16) !important;
    backdrop-filter: blur(18px);
  }

  body[data-vmx="1"] nav::after {
    content: "NJ Property Help Center";
    position: absolute;
    left: var(--vmx-page-gutter);
    bottom: 0.45rem;
    color: rgba(255, 255, 255, 0.62);
    font: 600 0.58rem/1.1 'DM Sans', sans-serif;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    pointer-events: none;
  }

  body[data-vmx="1"] nav :where(.nlogo, .logo, .nav-logo) {
    align-self: flex-start;
  }

  body[data-vmx="1"] nav :where(.nlogo-img, .logo-img, .nav-logo img, img) {
    max-width: min(178px, 56vw) !important;
    max-height: 34px !important;
  }

  body[data-vmx="1"] .mobile-menu-btn {
    flex-basis: 46px;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.07) !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    top: calc(70px + env(safe-area-inset-top)) !important;
    padding: 1rem var(--vmx-page-gutter) calc(1.5rem + env(safe-area-inset-bottom)) !important;
    background: rgba(16, 35, 57, 0.985) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) li {
    border-bottom-color: rgba(255, 255, 255, 0.09) !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) a {
    min-height: 54px;
    font-size: 1rem !important;
  }

  /* Heroes become editorial opening screens rather than compressed desktop banners. */
  body[data-vmx="1"] :where(.hero, .blog-hero, .rc-hero) {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background:
      linear-gradient(145deg, rgba(255, 253, 248, 0.99), rgba(242, 239, 231, 0.97)) !important;
    border-bottom: 0 !important;
  }

  body[data-vmx="1"] :where(.hero, .blog-hero, .rc-hero)::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 15rem;
    height: 15rem;
    right: -7rem;
    top: 5rem;
    border: 1px solid rgba(173, 139, 83, 0.25);
    border-radius: 48% 52% 42% 58%;
    background: rgba(220, 229, 220, 0.54);
    transform: rotate(18deg);
  }

  body[data-vmx="1"] .hero,
  body[data-vmx="1"] .rc-hero {
    padding-top: calc(6.25rem + env(safe-area-inset-top)) !important;
    padding-bottom: 2.4rem !important;
  }

  body[data-vmx="1"] .blog-hero-inner {
    padding-top: calc(6.25rem + env(safe-area-inset-top)) !important;
    padding-bottom: 2.4rem !important;
  }

  body[data-vmx="1"] :where(.hero-inner, .blog-hero-inner, .rc-hero-inner, .hero-grid) {
    gap: 1.65rem !important;
  }

  body[data-vmx="1"] :where(.eyebrow, .hero .eyebrow, .section-eyebrow) {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.5rem 0.72rem;
    border: 1px solid rgba(111, 129, 111, 0.25);
    border-radius: 999px;
    color: #566c59 !important;
    background: rgba(220, 229, 220, 0.72);
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"] :where(.hero h1, .blog-hero h1, .rc-hero h1) {
    max-width: 11.5em;
    color: var(--vmx-ink) !important;
    font-size: clamp(2.45rem, 11vw, 3.35rem) !important;
    font-weight: 500 !important;
    line-height: 0.98 !important;
    letter-spacing: -0.035em !important;
    text-shadow: none !important;
  }

  body[data-vmx="1"] :where(.hero-sub, .hero-desc, .rc-hero-desc, .rc-hero-subtitle) {
    color: var(--vmx-ink-soft) !important;
    font-size: 1.02rem !important;
    line-height: 1.7 !important;
  }

  body[data-vmx="1"] :where(.hero-sub, .hero-desc, .rc-hero-desc) a {
    color: var(--vmx-ink) !important;
    border-bottom-color: rgba(173, 139, 83, 0.6) !important;
  }

  body[data-vmx="1"] :where(.hero-reassure, .hero-qa, .rc-hero-subtitle) {
    position: relative;
    margin: 0 0 1.25rem !important;
    padding: 0.9rem 1rem 0.9rem 2.8rem !important;
    border: 1px solid rgba(111, 129, 111, 0.18);
    border-radius: 16px;
    color: #526255 !important;
    background: rgba(220, 229, 220, 0.56);
    font-size: 0.86rem !important;
    line-height: 1.55 !important;
  }

  body[data-vmx="1"] :where(.hero-reassure, .hero-qa, .rc-hero-subtitle)::before {
    content: "✓";
    position: absolute;
    left: 1rem;
    top: 0.87rem;
    width: 1.25rem;
    height: 1.25rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: white;
    background: var(--vmx-sage-deep);
    font: 700 0.7rem/1 'DM Sans', sans-serif;
  }

  body[data-vmx="1"] :where(.hero-ctas, .rc-hero-ctas) {
    gap: 0.7rem !important;
    margin-bottom: 1.3rem !important;
  }

  body[data-vmx="1"] :where(.btn-primary, .ncta, .county-cta-btn, .hc-submit, .lcf-submit, .bfc-submit, .guidance-btn) {
    min-height: 54px !important;
    padding: 0.95rem 1.2rem !important;
    border: 1px solid var(--vmx-ink) !important;
    border-radius: 16px !important;
    color: #fff !important;
    background: var(--vmx-ink) !important;
    box-shadow: 0 10px 24px rgba(20, 39, 63, 0.2) !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.025em !important;
    text-transform: none !important;
    transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
  }

  body[data-vmx="1"] :where(.btn-primary, .ncta, .county-cta-btn, .hc-submit, .lcf-submit, .bfc-submit, .guidance-btn):active {
    transform: scale(0.985);
    box-shadow: 0 5px 14px rgba(20, 39, 63, 0.16) !important;
  }

  body[data-vmx="1"] :where(.btn-soft, .btn-ghost, .btn-outline-white) {
    min-height: 52px !important;
    border: 1px solid rgba(20, 39, 63, 0.16) !important;
    border-radius: 16px !important;
    color: var(--vmx-ink) !important;
    background: rgba(255, 255, 255, 0.72) !important;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card, .rc-hero-right) {
    padding: 1.4rem !important;
    border: 1px solid rgba(255, 255, 255, 0.9) !important;
    border-radius: 26px !important;
    background: rgba(255, 255, 255, 0.88) !important;
    box-shadow: var(--vmx-card-shadow) !important;
    backdrop-filter: blur(16px);
  }

  body[data-vmx="1"] .vmx-mobile-form-stage {
    position: relative;
    z-index: 2;
    margin: -0.45rem var(--vmx-page-gutter) 2rem;
  }

  body[data-vmx="1"] .vmx-mobile-form-stage::before {
    content: "Private property review";
    display: block;
    width: fit-content;
    margin: 0 0 0.7rem 0.8rem;
    padding: 0.4rem 0.65rem;
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.9);
    background: var(--vmx-ink);
    font: 700 0.61rem/1 'DM Sans', sans-serif;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card, .rc-hero-right) :where(h2, h3, p, label, li) {
    color: var(--vmx-ink-soft) !important;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card, .rc-hero-right) :where(h2, h3) {
    color: var(--vmx-ink) !important;
  }

  body[data-vmx="1"] :where(.hero-card-values, .hero-trust-badges, .hero-positioning) {
    gap: 0.55rem !important;
  }

  body[data-vmx="1"] :where(.hero-card-values li, .hero-badge, .hero-positioning-badge, .rc-hero-trust-item) {
    min-height: 36px;
    padding: 0.55rem 0.72rem !important;
    border: 1px solid rgba(20, 39, 63, 0.1) !important;
    border-radius: 999px !important;
    color: var(--vmx-ink-soft) !important;
    background: rgba(255, 255, 255, 0.68) !important;
    font-size: 0.68rem !important;
  }

  body[data-vmx="1"] input:not([type="checkbox"]):not([type="radio"]),
  body[data-vmx="1"] select,
  body[data-vmx="1"] textarea {
    min-height: 52px !important;
    border: 1px solid rgba(20, 39, 63, 0.14) !important;
    border-radius: 14px !important;
    color: var(--vmx-ink) !important;
    background: #faf8f2 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }

  body[data-vmx="1"] input:focus,
  body[data-vmx="1"] select:focus,
  body[data-vmx="1"] textarea:focus {
    border-color: var(--vmx-gold) !important;
    background: #fff !important;
  }

  /* Homepage hero — warmer editorial ambiance: subtle gold glow, gentle
     brand accent, and cleaner separation between the message and the CTA.
     No photograph added; the opening stays editorial and lightweight. */
  body[data-vmx="1"][data-vmx-page="home"] .hero {
    background:
      radial-gradient(118% 70% at 50% 0%, rgba(184, 156, 106, 0.16) 0%, rgba(184, 156, 106, 0.05) 34%, rgba(247, 244, 239, 0) 66%),
      linear-gradient(160deg, rgba(255, 253, 248, 0.99), rgba(242, 239, 231, 0.97)) !important;
    padding-bottom: 2.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-left > h1 {
    margin-bottom: 0.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-left > .hero-ctas {
    margin-top: 0.55rem !important;
    margin-bottom: 1.6rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    margin-top: 0.45rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section, .start-here-section, .search-resource-center, .risks-section, .process-section, .founder-section, .talk-ray-section) {
    padding: 3.65rem var(--vmx-page-gutter) !important;
    border: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section:nth-of-type(even), .start-here-section, .risks-section, .founder-section) {
    background: rgba(255, 253, 248, 0.88) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header, .search-resource-inner, .start-here-inner) {
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .search-resource-inner h2, .start-here-inner h2, .risks-inner h2) {
    margin-top: 0.85rem !important;
    color: var(--vmx-ink) !important;
    font-size: clamp(2rem, 9vw, 2.7rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.025em;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-desc, .src-desc, .sh-desc) {
    margin-left: 0 !important;
    font-size: 0.96rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.situations-grid, .recent-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column;
    grid-auto-columns: min(84vw, 330px);
    gap: 1rem !important;
    width: calc(100% + var(--vmx-page-gutter));
    max-width: none !important;
    padding: 0.4rem var(--vmx-page-gutter) 1.1rem 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.situations-grid, .recent-grid)::-webkit-scrollbar {
    display: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.sit-card, .recent-card) {
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card {
    display: flex !important;
    min-height: 300px !important;
    padding: 1.55rem !important;
    border: 1px solid rgba(20, 39, 63, 0.09) !important;
    border-radius: 26px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card:nth-child(3n + 1) { background: #fffdf8 !important; }
  body[data-vmx="1"][data-vmx-page="home"] .sit-card:nth-child(3n + 2) { background: #edf2ec !important; }
  body[data-vmx="1"][data-vmx-page="home"] .sit-card:nth-child(3n + 3) { background: #f3e9dc !important; }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card-icon {
    width: 50px !important;
    height: 50px !important;
    margin: 0 0 auto !important;
    padding: 0.72rem;
    border-radius: 16px;
    color: var(--vmx-ink) !important;
    background: rgba(255, 255, 255, 0.72);
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card :where(h3, p, .sit-card-link) {
    grid-column: auto;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card h3 {
    margin-top: 1.3rem;
    font-size: 1.65rem !important;
    line-height: 1.08 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card-link {
    margin-top: auto;
    color: var(--vmx-ink) !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card {
    padding: 0 !important;
    overflow: hidden;
    border: 0 !important;
    border-radius: 26px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-img {
    width: 100%;
    height: 190px !important;
    object-fit: cover;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-body {
    padding: 1.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-grid {
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-card {
    min-height: 82px !important;
    padding: 1rem 1.1rem !important;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, 0.82) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-emoji {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: var(--vmx-sage);
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.risk-card, .process-step, .faq-item) {
    border: 1px solid var(--vmx-line) !important;
    border-radius: 22px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-card {
    padding: 1.35rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-step {
    position: relative;
    padding: 1.4rem 1.3rem 1.4rem 4.3rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-num {
    position: absolute;
    left: 1.2rem;
    top: 1.35rem;
    width: 2.25rem;
    height: 2.25rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: white !important;
    background: var(--vmx-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-trigger {
    min-height: 64px;
    padding: 1rem 1.1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.search-resource-center, .talk-ray-section) {
    margin: 0 var(--vmx-page-gutter) 2rem;
    padding: 1.7rem !important;
    border-radius: 28px !important;
    background: var(--vmx-ink) !important;
    box-shadow: var(--vmx-card-shadow);
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.search-resource-center, .talk-ray-section) :where(h2, h3, p, .src-desc) {
    color: rgba(255, 255, 255, 0.84) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.search-resource-center, .talk-ray-section) :where(h2, h3) {
    color: white !important;
  }

  /* Reading screens: content is grouped into calm, purposeful modules. */
  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) {
    color: var(--vmx-ink-soft) !important;
    background: transparent !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) > p {
    margin-bottom: 1.35rem !important;
    font-size: 1.02rem !important;
    line-height: 1.82 !important;
  }

  body[data-vmx="1"] .rc-content {
    padding-top: 1.4rem !important;
  }

  body[data-vmx="1"] .rc-section {
    margin: 0 0 1.15rem !important;
    padding: 1.45rem 1.25rem !important;
    border: 1px solid rgba(20, 39, 63, 0.08) !important;
    border-radius: 26px !important;
    background: rgba(255, 253, 248, 0.94) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"] .rc-section:nth-child(4n + 1) {
    background: rgba(237, 242, 236, 0.96) !important;
  }

  body[data-vmx="1"] .rc-section-header {
    display: block !important;
    margin-bottom: 1.35rem !important;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--vmx-line);
  }

  body[data-vmx="1"] .rc-section-num {
    width: fit-content;
    margin-bottom: 0.7rem;
    padding: 0.42rem 0.62rem;
    border-radius: 999px;
    color: #5d6f60 !important;
    background: var(--vmx-sage) !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  body[data-vmx="1"] .rc-section-header h2,
  body[data-vmx="1"] :where(.article, .guide-content) h2 {
    color: var(--vmx-ink) !important;
    font-size: clamp(1.85rem, 8.2vw, 2.4rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.025em;
  }

  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) h3 {
    margin-top: 2rem !important;
    font-size: 1.45rem !important;
    line-height: 1.2 !important;
  }

  body[data-vmx="1"] :where(.quick-answer, .rc-warning, .callout, .cta-decision-point, .cta-mid-guidance) {
    position: relative;
    margin: 1.5rem 0 !important;
    padding: 1.35rem 1.25rem !important;
    border: 0 !important;
    border-radius: 22px !important;
    background: #e8eee6 !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(.rc-warning, .callout)::before {
    content: "Important";
    display: block;
    width: fit-content;
    margin-bottom: 0.8rem;
    padding: 0.38rem 0.58rem;
    border-radius: 999px;
    color: #fff;
    background: var(--vmx-coral);
    font: 700 0.6rem/1 'DM Sans', sans-serif;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  body[data-vmx="1"] .rc-warning {
    background: #f3e5de !important;
  }

  body[data-vmx="1"] :where(.rc-checklist, .rc-mistakes) {
    display: grid;
    gap: 0.75rem;
    padding: 0 !important;
  }

  body[data-vmx="1"] :where(.rc-checklist li, .rc-mistake) {
    margin: 0 !important;
    padding: 1rem 1rem 1rem 3.15rem !important;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, 0.76) !important;
  }

  body[data-vmx="1"] .rc-checklist .rc-check {
    left: 1rem !important;
    top: 1.05rem !important;
    width: 1.45rem !important;
    height: 1.45rem !important;
    border-radius: 50% !important;
    background: var(--vmx-sage-deep) !important;
  }

  body[data-vmx="1"] :where(.rc-icon-cards, .rc-official-grid, .rc-related-grid, .related-grid, .gux-grid, .recent-guides-grid) {
    gap: 0.9rem !important;
  }

  body[data-vmx="1"] :where(.rc-icon-card, .rc-official-card, .rc-related, .related-card, .gux-card, .recent-guide-card) {
    padding: 1.3rem !important;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 22px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  body[data-vmx="1"] :where(.rc-faq-item, .faq-item) {
    margin-bottom: 0.7rem !important;
    overflow: hidden;
    border: 1px solid var(--vmx-line) !important;
    border-radius: 19px !important;
    background: var(--vmx-paper) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(.rc-faq-trigger, .faq-trigger) {
    min-height: 64px;
    padding: 1rem !important;
  }

  body[data-vmx="1"] .rc-toc {
    margin-top: -1.2rem !important;
    border: 1px solid rgba(20, 39, 63, 0.08) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    box-shadow: var(--vmx-card-shadow-soft);
  }

  body[data-vmx="1"] .vmx-toc-toggle {
    min-height: 58px;
    padding: 0.95rem 1rem;
    color: var(--vmx-ink);
  }

  /* Resource center and guides use card decks instead of long desktop grids. */
  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-grid, .recent-guides-grid),
  body[data-vmx="1"] :where(.rc-related-grid, .related-grid) {
    grid-auto-columns: min(84vw, 330px) !important;
    gap: 1rem !important;
    padding-bottom: 1.15rem !important;
    scrollbar-width: none;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-card, .recent-guide-card) {
    min-height: 250px;
    padding: 1.45rem !important;
    border-radius: 24px !important;
    background: var(--vmx-paper) !important;
    box-shadow: var(--vmx-card-shadow-soft) !important;
  }

  /* Sticky action is a quiet, integrated system bar. */
  body[data-vmx="1"] .mobile-sticky-cta {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    padding: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.11) !important;
    background: rgba(16, 35, 57, 0.97) !important;
    box-shadow: 0 -12px 32px rgba(9, 23, 39, 0.16) !important;
    backdrop-filter: blur(18px);
  }

  body[data-vmx="1"] .mobile-sticky-cta-inner {
    min-height: calc(68px + env(safe-area-inset-bottom));
    padding: 0.65rem var(--vmx-page-gutter) calc(0.65rem + env(safe-area-inset-bottom)) !important;
    gap: 0.55rem !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a {
    min-height: 44px !important;
    border-radius: 13px !important;
    font-size: 0.69rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.015em !important;
    text-transform: none !important;
  }

  body[data-vmx="1"] :where(.msc-call, .msc-text) {
    border: 1px solid rgba(255, 255, 255, 0.13) !important;
    color: rgba(255, 255, 255, 0.88) !important;
    background: rgba(255, 255, 255, 0.07) !important;
  }

  body[data-vmx="1"] .msc-review {
    border-color: var(--vmx-sand) !important;
    color: var(--vmx-ink) !important;
    background: var(--vmx-sand) !important;
  }

  body[data-vmx="1"].vmx-footer-in-view .mobile-sticky-cta,
  body[data-vmx="1"].vmx-form-in-view .mobile-sticky-cta {
    transform: translateY(110%);
  }

  body[data-vmx="1"] .vmx-reading-progress {
    top: calc(70px + env(safe-area-inset-top));
    height: 3px;
    background: rgba(20, 39, 63, 0.08);
  }

  body[data-vmx="1"] .vmx-reading-progress span {
    background: linear-gradient(90deg, var(--vmx-sage-deep), var(--vmx-gold));
  }

  @media (prefers-reduced-motion: no-preference) {
    body[data-vmx="1"] :where(.hero h1, .hero-sub, .hero-reassure, .hero-ctas, .hero-left::after) {
      animation: vmx2-arrive 560ms both cubic-bezier(.2, .75, .25, 1);
    }

    body[data-vmx="1"] .hero-sub { animation-delay: 70ms; }
    body[data-vmx="1"] .hero-reassure { animation-delay: 120ms; }
    body[data-vmx="1"] .hero-ctas { animation-delay: 170ms; }
    body[data-vmx="1"] .hero-left::after { animation-delay: 220ms; }
  }

  @keyframes vmx2-arrive {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media screen and (max-width: 768px) {
  html:has(body[data-vmx="1"]) {
    max-width: 100%;
    overflow-x: clip;
  }

  body[data-vmx="1"] {
    --vmx-page-gutter: clamp(1rem, 4.8vw, 1.35rem);
    --vmx-reading-width: 42rem;
    --vmx-surface: #fffefa;
    --vmx-surface-soft: #f7f4ed;
    --vmx-border: rgba(15, 31, 56, 0.13);
    --vmx-border-gold: rgba(184, 156, 106, 0.34);
    --vmx-shadow: 0 10px 28px rgba(15, 31, 56, 0.08);
    overflow-x: clip;
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: calc(74px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"],
  body[data-vmx="1"][data-vmx-page="article"],
  body[data-vmx="1"][data-vmx-page="resource"],
  body[data-vmx="1"][data-vmx-page="guide"],
  body[data-vmx="1"][data-vmx-page="city"],
  body[data-vmx="1"][data-vmx-page="county"] {
    padding-bottom: calc(70px + env(safe-area-inset-bottom));
  }

  body[data-vmx="1"] *,
  body[data-vmx="1"] *::before,
  body[data-vmx="1"] *::after {
    box-sizing: border-box;
  }

  body[data-vmx="1"] img,
  body[data-vmx="1"] svg,
  body[data-vmx="1"] video,
  body[data-vmx="1"] iframe {
    max-width: 100%;
  }

  body[data-vmx="1"] :where(h1, h2, h3, h4, p, li, a, label, button) {
    overflow-wrap: break-word;
  }

  body[data-vmx="1"] :where(a, button, input, select, textarea, summary) {
    -webkit-tap-highlight-color: rgba(184, 156, 106, 0.18);
  }

  body[data-vmx="1"] :where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid #b89c6a !important;
    outline-offset: 3px !important;
  }

  body[data-vmx="1"] :where(button, [role="button"], input[type="submit"], input[type="button"], .btn, .ncta, .county-cta-btn, .lcf-submit, .bfc-submit) {
    min-height: 44px;
  }

  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) :where(h2, h3, h4, [id]) {
    scroll-margin-top: calc(84px + env(safe-area-inset-top));
  }

  /* Compact, stable mobile header */
  body[data-vmx="1"] nav {
    min-height: calc(60px + env(safe-area-inset-top));
    padding: calc(0.55rem + env(safe-area-inset-top)) var(--vmx-page-gutter) 0.55rem !important;
    gap: 0.75rem;
  }

  body[data-vmx="1"] nav :where(.logo, .nav-logo) {
    min-width: 0;
    max-width: calc(100% - 58px);
  }

  body[data-vmx="1"] nav :where(.logo-img, .nav-logo img, img) {
    width: auto !important;
    max-width: min(216px, 66vw) !important;
    max-height: 42px !important;
    object-fit: contain;
  }

  body[data-vmx="1"] .mobile-menu-btn {
    display: grid !important;
    place-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    margin: -0.25rem -0.35rem -0.25rem 0;
    border-radius: 10px;
    touch-action: manipulation;
  }

  body[data-vmx="1"] nav .nav-right {
    display: none !important;
  }

  body[data-vmx="1"] .mobile-menu-btn:active {
    background: rgba(255, 255, 255, 0.08);
    transform: scale(0.97);
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    max-height: calc(100dvh - 60px - env(safe-area-inset-top));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) a {
    display: flex !important;
    align-items: center;
    min-height: 48px;
    padding-block: 0.7rem !important;
  }

  /* Heroes answer the core question without consuming the full viewport. */
  body[data-vmx="1"] :where(.hero, .blog-hero, .rc-hero) {
    min-height: 0 !important;
  }

  body[data-vmx="1"] .hero,
  body[data-vmx="1"] .rc-hero {
    padding-top: calc(4.6rem + env(safe-area-inset-top)) !important;
    padding-bottom: 2rem !important;
  }

  body[data-vmx="1"] :where(.hero-inner, .blog-hero-inner, .rc-hero-inner, .hero-grid) {
    width: 100%;
    padding-left: var(--vmx-page-gutter) !important;
    padding-right: var(--vmx-page-gutter) !important;
    gap: 1.25rem !important;
  }

  body[data-vmx="1"] .blog-hero-inner {
    padding-top: calc(4.55rem + env(safe-area-inset-top)) !important;
    padding-bottom: 1.35rem !important;
  }

  body[data-vmx="1"] :where(.hero-left, .blog-hero-left) {
    padding-top: 0 !important;
  }

  body[data-vmx="1"] :where(.hero h1, .blog-hero h1, .rc-hero h1) {
    font-size: clamp(2rem, 9vw, 2.65rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.015em;
    margin-bottom: 0.85rem !important;
  }

  body[data-vmx="1"] :where(.hero-sub, .hero-desc, .rc-hero-desc, .rc-hero-subtitle) {
    max-width: 38rem;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    margin-bottom: 1.15rem !important;
  }

  body[data-vmx="1"] :where(.eyebrow, .hero .eyebrow) {
    margin-bottom: 0.75rem !important;
    letter-spacing: 0.14em !important;
  }

  body[data-vmx="1"] :where(.hero-ctas, .rc-hero-ctas) {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.65rem !important;
    margin-bottom: 1.25rem !important;
  }

  body[data-vmx="1"] :where(.hero-ctas, .rc-hero-ctas) a {
    width: 100%;
    min-height: 48px;
    justify-content: center;
    text-align: center;
  }

  body[data-vmx="1"] :where(.hero-trust-badges, .hero-positioning, .rc-hero-trust) {
    gap: 0.65rem 1rem !important;
    margin-top: 1rem !important;
  }

  body[data-vmx="1"] :where(.hero-card, .hero-form-card, .blog-form-card) {
    position: relative !important;
    top: auto !important;
    margin: 0 !important;
    border-radius: 14px !important;
    box-shadow: var(--vmx-shadow) !important;
  }

  body[data-vmx="1"] .hero-img-wrap img {
    max-height: 210px !important;
    object-position: center 38%;
  }

  /* Reading rhythm */
  body[data-vmx="1"] :where(.article, .rc-content) {
    width: 100%;
    max-width: var(--vmx-reading-width);
    margin-inline: auto;
    padding: 2rem var(--vmx-page-gutter) 3.25rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) > :first-child {
    margin-top: 0;
  }

  body[data-vmx="1"] :where(.article, .rc-content) h2 {
    font-size: clamp(1.65rem, 7vw, 2.05rem) !important;
    line-height: 1.2 !important;
    margin-top: 2.75rem !important;
    margin-bottom: 0.9rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) h3 {
    font-size: clamp(1.3rem, 5.8vw, 1.6rem) !important;
    line-height: 1.28 !important;
    margin-top: 2.15rem !important;
    margin-bottom: 0.75rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) h4 {
    font-size: 1.08rem !important;
    line-height: 1.35 !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) :where(p, li) {
    font-size: 1rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) p {
    margin-bottom: 1.15rem !important;
  }

  body[data-vmx="1"] :where(.article, .rc-content) :where(ul, ol) {
    padding-left: 1.35rem;
    margin-block: 0.85rem 1.4rem;
  }

  body[data-vmx="1"] :where(.article, .rc-content) li + li {
    margin-top: 0.55rem;
  }

  body[data-vmx="1"] :where(.article, .rc-content) table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
  }

  /* Calm grouping for existing high-value content structures. */
  body[data-vmx="1"] :where(
    .callout, .quick-answer, .warning-box, .rc-warning, .rc-official-card,
    .county-cta, .guide-covers, .worksheet-card, .explore-related,
    .related-reading, .county-situations, .hero-qa, .twr
  ) {
    margin-block: 1.6rem !important;
    border-radius: 14px !important;
    border-color: var(--vmx-border-gold) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(
    .callout, .quick-answer-body, .warning-box, .rc-warning, .rc-official-card-body,
    .county-cta, .worksheet-card, .explore-related, .related-reading,
    .county-situations, .hero-qa
  ) {
    padding: 1.25rem !important;
  }

  body[data-vmx="1"] :where(.guide-covers-grid, .related-grid, .related-card-grid, .rc-icon-cards, .rc-related-grid, .county-grid) {
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  body[data-vmx="1"] :where(.guide-covers-item, .related-card, .rc-icon-card) {
    min-height: 0 !important;
    padding: 1rem !important;
    border-radius: 12px !important;
    background: var(--vmx-surface) !important;
    border: 1px solid var(--vmx-border) !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"] :where(.related-card, .rc-icon-card):active {
    transform: scale(0.99);
    background: var(--vmx-surface-soft) !important;
  }

  /* Homepage: situation-first choices, not compressed desktop columns. */
  body[data-vmx="1"][data-vmx-page="home"] :where(section, .section) {
    scroll-margin-top: calc(74px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.situations-grid, .risk-grid, .sh-grid, .recent-grid) {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.sit-card, .risk-card, .sh-card, .recent-card) {
    min-height: 0 !important;
    padding: 1.15rem !important;
    border-radius: 14px !important;
    box-shadow: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card {
    display: grid !important;
    grid-template-columns: 42px 1fr;
    column-gap: 0.9rem;
    align-items: start;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sit-card :where(h3, p, .sit-card-link) {
    grid-column: 2;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.trust-strip, .hero-trust-badges) {
    overflow: visible !important;
  }

  /* Resource Center: search first, compact choices. */
  body[data-vmx="1"][data-vmx-page="blog"] :where(.search-section, .featured-section, .situations-section, .recent-guides) {
    padding: 2.25rem var(--vmx-page-gutter) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.search-inner, .featured-inner, .situations-inner, .recent-guides-inner) {
    width: 100%;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-grid, .recent-guides-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column;
    grid-auto-columns: min(82vw, 320px);
    gap: 0.75rem !important;
    max-width: 100%;
    padding: 0.2rem 0.1rem 0.85rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    contain: inline-size;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.gux-card, .recent-guide-card) {
    padding: 1.15rem !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    scroll-snap-align: start;
  }

  body[data-vmx="1"] :where(.search-bar-wrap, .src-search-wrap, .rc-search-wrap, .bss-search-wrap) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem !important;
    width: 100%;
  }

  body[data-vmx="1"] :where(.search-input, input[type="search"]) {
    min-width: 0;
    min-height: 48px;
    font-size: 16px !important;
  }

  body[data-vmx="1"] .search-btn {
    min-width: 48px;
    min-height: 48px;
  }

  body[data-vmx="1"] :where(.search-chips, .category-nav, .filter-chips) {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    overflow-x: auto;
    padding: 0.25rem 0 0.6rem;
    scrollbar-width: thin;
    scroll-snap-type: x proximity;
    contain: inline-size;
  }

  body[data-vmx="1"] :where(.search-chip, .category-nav a, .filter-chips a) {
    flex: 0 0 auto;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    scroll-snap-align: start;
  }

  /* Existing resource TOC becomes a progressive-enhancement disclosure. */
  body[data-vmx="1"] .rc-toc-wrap {
    display: block !important;
    padding: 0 !important;
  }

  body[data-vmx="1"] .rc-toc {
    position: static !important;
    width: auto !important;
    margin: 1rem var(--vmx-page-gutter) 0 !important;
    padding: 0 !important;
    border: 1px solid var(--vmx-border-gold) !important;
    border-radius: 14px !important;
    background: var(--vmx-surface) !important;
    overflow: hidden;
  }

  body[data-vmx="1"] .rc-toc.vmx-toc-ready > h4 {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  body[data-vmx="1"] .vmx-toc-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 52px;
    padding: 0.85rem 1rem;
    border: 0;
    color: var(--navy, #0f1f38);
    background: transparent;
    font: inherit;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
  }

  body[data-vmx="1"] .vmx-toc-toggle::after {
    content: "+";
    flex: 0 0 auto;
    margin-left: 1rem;
    font-size: 1.3rem;
    font-weight: 400;
  }

  body[data-vmx="1"] .vmx-toc-toggle[aria-expanded="true"]::after {
    content: "−";
  }

  body[data-vmx="1"] .rc-toc.vmx-toc-ready ol {
    margin: 0;
    padding: 0.25rem 1rem 1rem 2.35rem;
    border-top: 1px solid var(--vmx-border);
  }

  body[data-vmx="1"] .rc-toc li {
    margin: 0 !important;
  }

  body[data-vmx="1"] .rc-toc a {
    display: block;
    min-height: 44px;
    padding: 0.65rem 0;
    line-height: 1.45;
  }

  body[data-vmx="1"] .rc-checklist li {
    position: relative;
    display: block !important;
    min-width: 0;
    padding-left: 1.8rem !important;
  }

  body[data-vmx="1"] .rc-checklist .rc-check {
    position: absolute;
    top: 0.72rem;
    left: 0;
  }

  body[data-vmx="1"] .rc-checklist .inline-link {
    display: inline !important;
  }

  /* Forms retain their behavior while reading like guided onboarding. */
  body[data-vmx="1"] :where(form[action*="formspree.io"], .hero-card-form, .bfc-form) {
    width: 100%;
  }

  body[data-vmx="1"] :where(.form-row, .bfc-row, .lcf-row) {
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
  }

  body[data-vmx="1"] form[action*="formspree.io"] :where(label, .form-label) {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 0.88rem !important;
    line-height: 1.4;
  }

  body[data-vmx="1"] form[action*="formspree.io"] :where(input:not([type="hidden"]), select, textarea) {
    width: 100% !important;
    min-height: 48px;
    padding: 0.75rem 0.85rem !important;
    border-radius: 9px !important;
    font-size: 16px !important;
    line-height: 1.35;
    scroll-margin-bottom: calc(100px + env(safe-area-inset-bottom));
  }

  body[data-vmx="1"] form[action*="formspree.io"] textarea {
    min-height: 112px;
    resize: vertical;
  }

  body[data-vmx="1"] form[action*="formspree.io"] :where(button[type="submit"], input[type="submit"]) {
    width: 100% !important;
    min-height: 50px;
    margin-top: 0.4rem;
    font-size: 0.94rem !important;
  }

  body[data-vmx="1"] :where(.form-reassurance, .lcf-reassurance, .lcf-alt, .form-trust-values) {
    font-size: 0.82rem !important;
    line-height: 1.55 !important;
  }

  /* Two primary actions plus a compact secondary text control. */
  body[data-vmx="1"] .mobile-sticky-cta {
    display: block !important;
    padding: 0.55rem max(0.7rem, env(safe-area-inset-right)) calc(0.55rem + env(safe-area-inset-bottom)) max(0.7rem, env(safe-area-inset-left)) !important;
    background: rgba(15, 31, 56, 0.97) !important;
    border-top: 1px solid rgba(184, 156, 106, 0.38) !important;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.16) !important;
    backdrop-filter: blur(12px);
    transition: transform 180ms ease, opacity 180ms ease;
  }

  body[data-vmx="1"] .mobile-sticky-cta-inner {
    display: grid !important;
    grid-template-columns: minmax(76px, 0.8fr) 48px minmax(118px, 1.25fr);
    gap: 0.45rem !important;
    max-width: 430px !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a {
    min-width: 0;
    min-height: 48px !important;
    padding: 0.55rem 0.65rem !important;
    border-radius: 10px !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.035em !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta .msc-text {
    width: 48px;
    padding-inline: 0 !important;
    overflow: hidden;
    color: rgba(255, 255, 255, 0.82) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    font-size: 0 !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta .msc-text svg {
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a:active {
    transform: scale(0.98);
  }

  body[data-vmx="1"].vmx-form-in-view .mobile-sticky-cta,
  body[data-vmx="1"].vmx-footer-in-view .mobile-sticky-cta {
    opacity: 0;
    pointer-events: none;
    transform: translateY(110%);
  }

  /* Subtle reading progress, never interactive. */
  body[data-vmx="1"] .vmx-reading-progress {
    position: fixed;
    top: calc(60px + env(safe-area-inset-top));
    left: 0;
    right: 0;
    z-index: 98;
    height: 2px;
    pointer-events: none;
    background: transparent;
  }

  body[data-vmx="1"] .vmx-reading-progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: #b89c6a;
    transform: scaleX(var(--vmx-progress, 0));
    transform-origin: left center;
  }

  /* Footers remain usable above the action area. */
  body[data-vmx="1"] footer {
    padding-bottom: calc(1.5rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"] :where(.footer-inner, .footer-top, .footer-nap-inner) {
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  body[data-vmx="1"] footer a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}

@media screen and (max-width: 350px) {
  body[data-vmx="1"] {
    --vmx-page-gutter: 0.95rem;
  }

  body[data-vmx="1"] nav :where(.logo-img, .nav-logo img, img) {
    max-width: 62vw !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta-inner {
    grid-template-columns: minmax(70px, 0.75fr) 46px minmax(108px, 1.2fr);
    gap: 0.35rem !important;
  }

  body[data-vmx="1"] .mobile-sticky-cta a {
    padding-inline: 0.45rem !important;
    letter-spacing: 0 !important;
  }
}

@media screen and (max-width: 768px) and (orientation: landscape) {
  body[data-vmx="1"] :where(.hero, .rc-hero) {
    padding-bottom: 1.5rem !important;
  }

  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    max-height: calc(100dvh - 54px - env(safe-area-inset-top));
  }
}

@media screen and (max-width: 768px) and (prefers-reduced-motion: reduce) {
  body[data-vmx="1"] *,
  body[data-vmx="1"] *::before,
  body[data-vmx="1"] *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================================
   VMX 3.0 — HOMEPAGE MOBILE RECOMPOSITION
   A purpose-built New Jersey property-help experience for phones.
   Scoped entirely to body[data-vmx="1"][data-vmx-page="home"] and to
   max-width:768px, so desktop and every other VMX page are untouched.
   Loaded last, so this layer intentionally supersedes VMX 1.0 / 2.0 on the
   homepage only. Enhancement hooks (.vmx-hero-secondary and .vmx-sh-icon)
   are added by vmx-mobile.js and hidden on desktop below.
   ============================================================================ */

/* Desktop guard: mobile-only enhancement nodes never render on desktop. */
body[data-vmx="1"][data-vmx-page="home"] .vmx-hero-secondary,
body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon {
  display: none;
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="home"] {
    /* Refined VMX 3.0 tokens layered over the existing palette. */
    --v3-ink: #12263f;
    --v3-ink-soft: #43536a;
    --v3-paper: #fffdf7;
    --v3-paper-2: #f6f2e9;
    --v3-sage: #e3ebe1;
    --v3-sage-deep: #64775f;
    --v3-gold: #a9834b;
    --v3-gold-soft: rgba(169, 131, 75, 0.14);
    --v3-line: rgba(18, 38, 63, 0.1);
    --v3-radius: 20px;
    --v3-radius-lg: 26px;
    --v3-shadow: 0 12px 34px rgba(18, 38, 63, 0.09);
    --v3-shadow-soft: 0 6px 18px rgba(18, 38, 63, 0.06);
    --v3-pad: clamp(1.15rem, 5.2vw, 1.5rem);
  }

  /* ---- 2-3. Compact hero: message + two actions in the first screen ---- */
  body[data-vmx="1"][data-vmx-page="home"] .hero,
  body[data-vmx="1"][data-vmx-page="home"] .rc-hero {
    padding-top: calc(4.4rem + env(safe-area-inset-top)) !important;
    padding-bottom: 1.9rem !important;
    background:
      radial-gradient(circle at 108% -4%, rgba(169, 131, 75, 0.12), transparent 40%),
      linear-gradient(168deg, #fffdf7 0%, #f4efe5 100%) !important;
  }

  /* Remove the desktop dark image overlay so the calm paper hero shows through. */
  body[data-vmx="1"][data-vmx-page="home"] .hero::after {
    display: none !important;
  }

  /* Drop the doubled top padding from the base hero-inner; .hero clears the nav. */
  body[data-vmx="1"][data-vmx-page="home"] .hero-inner {
    padding-top: 0 !important;
    gap: 0 !important;
  }

  /* Clean, compact header: drop the overlapping VMX chrome tagline on home. */
  body[data-vmx="1"][data-vmx-page="home"] nav::after {
    display: none !important;
  }

  /* Neutralise the VMX 2.0 tall decorative circle. */
  body[data-vmx="1"][data-vmx-page="home"] .hero::before {
    width: 11rem !important;
    height: 11rem !important;
    right: -5.5rem !important;
    top: 3.4rem !important;
    opacity: 0.7;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .eyebrow {
    margin-bottom: 0.85rem !important;
    padding: 0.42rem 0.75rem !important;
    font-size: 0.6rem !important;
    letter-spacing: 0.12em !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero h1 {
    max-width: 13ch !important;
    margin-bottom: 0.7rem !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(2.3rem, 10.5vw, 3rem) !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: -0.02em !important;
  }

  /* Hero sub becomes a short, direct reassurance; long paragraph is de-emphasised. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-sub {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure {
    margin: 0 0 1.15rem !important;
    padding: 0.85rem 1rem 0.85rem 2.65rem !important;
    border: 1px solid rgba(100, 119, 95, 0.22);
    border-radius: 15px;
    background: rgba(227, 235, 225, 0.62);
    color: #4a5a4a !important;
    font-family: 'DM Sans', sans-serif !important;
    font-style: normal !important;
    font-size: 0.9rem !important;
    line-height: 1.5 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure::before {
    content: "✓";
    position: absolute;
    left: 0.95rem;
    top: 0.85rem;
    width: 1.2rem;
    height: 1.2rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--v3-sage-deep);
    font: 700 0.68rem/1 'DM Sans', sans-serif;
  }

  /* Two actions, both visible in the first screen. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-ctas {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.6rem !important;
    margin-bottom: 1.25rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-ctas .btn-primary {
    background: var(--v3-ink) !important;
    border-color: var(--v3-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-hero-secondary {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px !important;
    padding: 0.9rem 1.2rem !important;
    border: 1px solid rgba(18, 38, 63, 0.2) !important;
    border-radius: 16px !important;
    background: rgba(255, 255, 255, 0.7) !important;
    color: var(--v3-ink) !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 0.84rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    text-decoration: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-hero-secondary:active {
    transform: scale(0.985);
    background: rgba(255, 255, 255, 0.95) !important;
  }

  /* Restrained, regionally-accurate NJ imagery strip (accurate NJ + skyline). */
  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    aspect-ratio: 16 / 8 !important;
    margin: 0.1rem 0 0.25rem !important;
    border: 3px solid rgba(255, 255, 255, 0.92) !important;
    border-radius: 20px 20px 44px 20px !important;
    background:
      linear-gradient(180deg, transparent 52%, rgba(12, 26, 43, 0.32)),
      url('/images/defaults/homepage-hero.webp') center 32% / cover no-repeat !important;
    box-shadow: var(--v3-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-trust-badges {
    margin-top: 1.1rem !important;
    gap: 0.5rem 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge {
    padding: 0.42rem 0.7rem !important;
    border: 1px solid rgba(18, 38, 63, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.6);
    color: #4a5a6a !important;
    font-size: 0.63rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge svg { opacity: 0.8; }

  /* ---- Shared section rhythm: one idea per viewport, calm whitespace ---- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section, .start-here-section, .search-resource-center, .risks-section, .process-section, .founder-section, .talk-ray-section) {
    padding: 3.1rem var(--v3-pad) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header, .start-here-inner, .risks-inner .section-header) {
    margin-bottom: 1.5rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-eyebrow, .start-here-inner .exp-opener) {
    justify-content: flex-start !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow {
    display: inline-flex !important;
    align-items: center;
    gap: 0.5rem;
    width: fit-content;
    padding: 0.4rem 0.72rem !important;
    border: 1px solid rgba(100, 119, 95, 0.22);
    border-radius: 999px;
    background: rgba(227, 235, 225, 0.7);
    color: #566c59 !important;
    font-size: 0.6rem !important;
    letter-spacing: 0.11em !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::before,
  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::after {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .start-here-inner h2, .risks-inner h2) {
    margin-top: 0.7rem !important;
    font-size: clamp(1.95rem, 8.6vw, 2.5rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.02em;
  }

  body[data-vmx="1"][data-vmx-page="home"] .exp-opener {
    font-size: 1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-desc, .sh-desc, .src-desc) {
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-size: 0.94rem !important;
  }

  /* ---- 4. Situation selector: a true mobile decision interface ---- */
  body[data-vmx="1"][data-vmx-page="home"] .start-here-section {
    background: var(--v3-paper) !important;
    border-top: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-grid,
  body[data-vmx="1"][data-vmx-page="home"] .sh-grid--four {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.6rem !important;
    max-width: none !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-card {
    position: relative;
    display: grid !important;
    grid-template-columns: 46px 1fr 18px;
    align-items: center;
    gap: 0.9rem;
    min-height: 72px !important;
    padding: 1rem 1.05rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-card:active {
    transform: scale(0.99);
    border-color: var(--v3-gold) !important;
    background: #fffef9 !important;
  }

  /* Refined line icon replaces the decorative emoji on mobile. */
  body[data-vmx="1"][data-vmx-page="home"] .sh-emoji {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon {
    display: grid !important;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: var(--v3-sage);
    color: var(--v3-sage-deep);
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon svg {
    width: 22px;
    height: 22px;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-label {
    font-family: 'DM Sans', sans-serif;
    font-size: 0.98rem !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: var(--v3-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .sh-note {
    margin-top: 0.15rem;
    font-size: 0.74rem !important;
    color: var(--v3-ink-soft) !important;
  }

  /* Chevron affordance drawn into the third grid column. */
  body[data-vmx="1"][data-vmx-page="home"] .sh-card::after {
    content: "";
    width: 9px;
    height: 9px;
    border-right: 2px solid var(--v3-gold);
    border-bottom: 2px solid var(--v3-gold);
    transform: rotate(-45deg);
    justify-self: end;
    opacity: 0.7;
  }

  /* ---- 3 (nav). Compact, calm header sits above the flow ---- */
  body[data-vmx="1"][data-vmx-page="home"] nav {
    background: rgba(15, 31, 56, 0.97) !important;
  }

  /* ---- 5 (featured). Difficult-situation cards: calm vertical deck ---- */
  body[data-vmx="1"][data-vmx-page="home"] #services {
    background: var(--v3-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .situations-grid {
    display: grid !important;
    grid-auto-flow: row !important;
    grid-template-columns: 1fr !important;
    grid-auto-columns: auto !important;
    gap: 0.75rem !important;
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card {
    display: block !important;
    min-height: 0 !important;
    padding: 1.4rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card::before {
    height: 3px;
    background: linear-gradient(90deg, var(--v3-gold), #cbab77);
    transform: scaleX(1);
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card-icon {
    width: 46px !important;
    height: 46px !important;
    margin: 0 0 0.9rem !important;
    padding: 0.6rem;
    border-radius: 13px;
    background: var(--v3-gold-soft) !important;
    color: var(--v3-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card h3 {
    margin: 0 0 0.5rem !important;
    font-size: 1.5rem !important;
    line-height: 1.12 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services .sit-card > p {
    font-size: 0.9rem !important;
  }

  /* Featured planning tools: swipeable card row. */
  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start {
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .situations-grid {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-template-columns: none !important;
    grid-auto-columns: min(82vw, 300px);
    gap: 0.8rem !important;
    max-width: none !important;
    margin: 0 calc(var(--v3-pad) * -1);
    padding: 0.3rem var(--v3-pad) 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .situations-grid::-webkit-scrollbar {
    display: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .sit-card {
    display: flex !important;
    flex-direction: column;
    min-height: 214px !important;
    padding: 1.4rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    scroll-snap-align: start;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .sit-card h3 {
    font-size: 1.35rem !important;
    line-height: 1.14 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .property-toolkit-start .sit-card-link {
    align-self: flex-start !important;
    margin-top: auto;
    color: var(--v3-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-cta-row {
    margin-top: 1.6rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-cta-row .btn-primary,
  body[data-vmx="1"][data-vmx-page="home"] .section-cta-row .btn-soft {
    display: inline-flex !important;
    width: 100%;
    max-width: none !important;
    align-items: center;
    justify-content: center;
  }

  /* ---- Navy conversion panels: search + trust ---- */
  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section {
    margin: 0 var(--v3-pad) !important;
    padding: 1.7rem 1.5rem !important;
    border-radius: var(--v3-radius-lg) !important;
    background: linear-gradient(160deg, #14273f, #0e1d32) !important;
    border: 1px solid rgba(169, 131, 75, 0.3) !important;
    box-shadow: var(--v3-shadow);
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center :where(h2, .exp-opener, .src-desc),
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section :where(h2, p, .exp-opener) {
    color: rgba(255, 255, 255, 0.86) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center h2,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section h2 {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-inner .exp-opener,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text .exp-opener {
    color: var(--goldl) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-search-wrap {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 0.55rem !important;
    margin: 1.1rem 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-search-wrap .search-input {
    min-height: 52px;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    font-size: 16px !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-search-wrap .search-btn {
    min-height: 52px;
    border-radius: 14px !important;
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-chips {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    margin: 0 calc(var(--v3-pad) * -1);
    padding: 0.2rem var(--v3-pad) 0.3rem;
    overflow-x: auto;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }

  body[data-vmx="1"][data-vmx-page="home"] .src-chips::-webkit-scrollbar { display: none; }

  body[data-vmx="1"][data-vmx-page="home"] .src-chip {
    flex: 0 0 auto;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: rgba(255, 255, 255, 0.86) !important;
    scroll-snap-align: start;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner {
    flex-direction: column !important;
    gap: 1rem !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner::before { display: none; }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-avatar {
    width: 64px !important;
    height: 64px !important;
    border-color: var(--gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges { justify-content: flex-start !important; }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges span {
    color: rgba(255, 255, 255, 0.82) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges svg { color: var(--goldl) !important; }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta,
  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta .btn-primary {
    width: 100% !important;
    max-width: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta .btn-primary {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
  }

  /* ---- 7. Recent situations: swipeable image deck ---- */
  body[data-vmx="1"][data-vmx-page="home"] #recent-situations {
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-grid {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-template-columns: none !important;
    grid-auto-columns: 84%;
    gap: 1rem !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0;
    padding: 0.3rem 0 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(18, 38, 63, 0.24) transparent;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-grid::-webkit-scrollbar { height: 4px; }
  body[data-vmx="1"][data-vmx-page="home"] .recent-grid::-webkit-scrollbar-track { background: transparent; }
  body[data-vmx="1"][data-vmx-page="home"] .recent-grid::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(18, 38, 63, 0.24);
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-grid:focus-visible {
    outline: 2px solid var(--v3-gold);
    outline-offset: 4px;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card {
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-img {
    height: auto !important;
    aspect-ratio: 16 / 9;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-card-body {
    padding: 1.25rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-swipe-cue {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    width: fit-content;
    margin: -0.35rem 0 0.55rem;
    color: var(--v3-ink-soft);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
  }

  body[data-vmx="1"][data-vmx-page="home"] .recent-swipe-cue::after {
    content: "→";
    color: var(--v3-gold);
    font-size: 0.9rem;
  }

  /* ---- 8. Meet Ray: calm founder card ---- */
  body[data-vmx="1"][data-vmx-page="home"] .founder-section {
    background: var(--v3-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-inner {
    grid-template-columns: 1fr !important;
    gap: 1.3rem !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media {
    max-width: 190px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media img {
    border-radius: var(--v3-radius) !important;
    box-shadow: var(--v3-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-content .section-eyebrow {
    justify-content: flex-start !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-body {
    margin: 0 0 1.1rem !important;
    font-size: 0.94rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-cta .btn-soft {
    display: inline-flex;
    width: 100%;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    border-radius: 16px !important;
  }

  /* ---- 9. How the process works: numbered rail ---- */
  body[data-vmx="1"][data-vmx-page="home"] .process-section {
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-steps {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-steps::before { display: none !important; }

  body[data-vmx="1"][data-vmx-page="home"] .process-step {
    display: grid;
    grid-template-columns: 2.4rem 1fr;
    column-gap: 1rem;
    align-items: start;
    padding: 1.35rem 1.3rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-num {
    width: 2.4rem !important;
    height: 2.4rem !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: var(--v3-ink) !important;
    color: #fff !important;
    font-size: 1.15rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-step h3 {
    grid-column: 2;
    margin: 0 0 0.3rem !important;
    font-size: 1.3rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .process-step p {
    grid-column: 2;
    font-size: 0.9rem !important;
  }

  /* ---- 10 (support). Risks: why acting early matters ---- */
  body[data-vmx="1"][data-vmx-page="home"] .risks-section {
    background: var(--v3-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-grid,
  body[data-vmx="1"][data-vmx-page="home"] .risks-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.7rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-card {
    padding: 1.3rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: var(--v3-radius) !important;
    background: var(--v3-paper) !important;
    box-shadow: var(--v3-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risk-card-icon {
    background: var(--v3-gold-soft) !important;
    color: var(--v3-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .risks-reassurance {
    margin-top: 1.4rem !important;
    text-align: left !important;
    font-size: 0.9rem !important;
  }

  /* ---- 12. FAQ: quiet accordion ---- */
  body[data-vmx="1"][data-vmx-page="home"] #faq { background: var(--v3-paper) !important; }

  body[data-vmx="1"][data-vmx-page="home"] .faq-intro {
    text-align: left !important;
    font-size: 0.92rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-item {
    margin-bottom: 0.6rem !important;
    border: 1px solid var(--v3-line) !important;
    border-radius: 16px !important;
    background: var(--v3-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-item.open {
    background: var(--v3-paper) !important;
    border-color: rgba(169, 131, 75, 0.3) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-trigger {
    min-height: 60px;
    padding: 0.95rem 1.1rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .faq-trigger h3 { font-size: 0.95rem !important; }

  /* ---- 13-14. Financial readiness + final CTA ---- */
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-section {
    padding: 3rem var(--v3-pad) !important;
    background: linear-gradient(165deg, #14273f, #0c1a2d) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner { text-align: left !important; }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner p {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner .btn-primary {
    display: inline-flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
  }

  /* ---- 15. Statewide ribbon: quiet trust footer band ---- */
  body[data-vmx="1"][data-vmx-page="home"] .authority-ribbon {
    padding: 1.5rem var(--v3-pad) !important;
    background: #0e1d32 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .authority-ribbon-inner { text-align: center; }

  /* ---- Bottom action area: two dominant actions + compact text ---- */
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta {
    background: rgba(15, 31, 56, 0.98) !important;
    border-top: 1px solid rgba(169, 131, 75, 0.4) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta-inner {
    grid-template-columns: minmax(74px, 0.85fr) 48px minmax(120px, 1.3fr) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .msc-review {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--v3-ink) !important;
    font-weight: 700 !important;
  }
}

/* Home-only tightening for the smallest phones. */
@media screen and (max-width: 360px) {
  body[data-vmx="1"][data-vmx-page="home"] .sh-card {
    grid-template-columns: 42px 1fr 16px;
    gap: 0.7rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vmx-sh-icon {
    width: 42px;
    height: 42px;
  }
}

/* ============================================================================
   VMX 3.1 — HOMEPAGE MOBILE VISUAL CONSISTENCY REPAIR
   One cohesive mobile design system, applied from the hero through the footer.
   Appended last so it supersedes earlier VMX layers on the homepage only.
   Scoped to body[data-vmx="1"][data-vmx-page="home"] + max-width:768px, so the
   desktop layout and every other page are untouched.

   Goals: one design language top-to-bottom; cream canvas + deep-navy ink;
   restrained gold/sage accents; consistent radius / border / shadow / padding;
   controlled type scale; pills only as small labels; no lower section reverting
   to the desktop look; readable dark panels; a compact, correctly-labelled bar.
   ============================================================================ */
@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="home"] {
    --v31-ink: #12263f;
    --v31-ink-soft: #43536a;
    --v31-paper: #fffdf7;
    --v31-paper-2: #f6f2e9;
    --v31-sage: #e3ebe1;
    --v31-sage-deep: #5f7359;
    --v31-gold: #a9834b;
    --v31-gold-soft: rgba(169, 131, 75, 0.12);
    --v31-line: rgba(18, 38, 63, 0.1);
    --v31-radius: 20px;
    --v31-radius-lg: 24px;
    --v31-shadow-soft: 0 6px 18px rgba(18, 38, 63, 0.06);
    --v31-shadow: 0 12px 34px rgba(18, 38, 63, 0.09);
    --v31-pad: clamp(1.15rem, 5.2vw, 1.5rem);
  }

  /* ---------------------------------------------------------------------------
     1. HERO — clarity and balance, ~1–1.5 viewports tall
     --------------------------------------------------------------------------- */

  /* Controlled H1: readable and authoritative, ~3–5 lines on a 390px screen —
     never most of the viewport. Removes the narrow 13ch cap that forced tall,
     awkwardly-broken lines. */
  body[data-vmx="1"][data-vmx-page="home"] .hero h1 {
    max-width: none !important;
    margin-bottom: 0.85rem !important;
    font-size: clamp(2.05rem, 8vw, 2.55rem) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.015em !important;
  }

  /* Hero eyebrow: the copy is a full phrase, so present it as a clean editorial
     label with a short leading rule — not an oversized pill. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .eyebrow {
    display: flex !important;
    align-items: center;
    gap: 0.55rem;
    width: auto !important;
    margin-bottom: 0.9rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-gold) !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: 0.15em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .eyebrow::before {
    content: "";
    flex: 0 0 auto;
    width: 26px;
    height: 1px;
    background: var(--v31-gold);
  }

  /* Short supporting paragraph: plain, readable, no heavy sage callout box. */
  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure {
    margin: 0 0 1.2rem !important;
    padding: 0 0 0 0.9rem !important;
    border: 0 !important;
    border-left: 2px solid rgba(95, 115, 89, 0.55) !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-ink-soft) !important;
    font-family: 'DM Sans', sans-serif !important;
    font-style: normal !important;
    font-size: 0.96rem !important;
    line-height: 1.6 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero .hero-reassure::before {
    display: none !important;
  }

  /* Compact trust row: inline items with subtle dividers — not pills. */
  body[data-vmx="1"][data-vmx-page="home"] .hero-trust-badges {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.85rem !important;
    margin-top: 1.15rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge {
    position: relative;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-ink-soft) !important;
    font-size: 0.66rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge svg {
    color: var(--v31-gold) !important;
    opacity: 1 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge + .hero-badge {
    padding-left: 0.9rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .hero-badge + .hero-badge::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 12px;
    background: rgba(18, 38, 63, 0.18);
  }

  /* NJ neighborhood image sits below the actions and trust row. Focal point is
     lowered onto the homes (not the skyline) and lightly graded for clarity. */
  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    aspect-ratio: 16 / 9 !important;
    margin: 1.3rem 0 0.1rem !important;
    border: 3px solid rgba(255, 255, 255, 0.92) !important;
    border-radius: var(--v31-radius) var(--v31-radius) 40px var(--v31-radius) !important;
    background:
      linear-gradient(180deg, transparent 58%, rgba(12, 26, 43, 0.22)),
      url('/images/defaults/homepage-hero.webp') center 66% / cover no-repeat !important;
    filter: saturate(1.05) contrast(1.04) brightness(1.04);
    box-shadow: var(--v31-shadow) !important;
  }

  /* ---------------------------------------------------------------------------
     2. SHARED SECTION SYSTEM — consistent rhythm, labels and headings
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section, .start-here-section, .search-resource-center, .risks-section, .process-section, .founder-section, .talk-ray-section, .fin-ready-section, .vig-trust-section) {
    padding: 3.1rem var(--v31-pad) !important;
    border: 0 !important;
  }

  /* Short section eyebrows stay as small sage category-label pills (matching the
     reference's label chips); this is the ONE approved pill use. */
  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow,
  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-eyebrow,
  body[data-vmx="1"][data-vmx-page="home"] .vig-trust-label {
    display: inline-flex !important;
    align-items: center;
    width: fit-content !important;
    margin: 0 0 0.5rem !important;
    padding: 0.4rem 0.72rem !important;
    border: 1px solid rgba(95, 115, 89, 0.26) !important;
    border-radius: 999px !important;
    background: var(--v31-sage) !important;
    color: #566c59 !important;
    font-size: 0.6rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::before,
  body[data-vmx="1"][data-vmx-page="home"] .section-eyebrow::after {
    display: none !important;
  }

  /* Consistent section-heading scale (~32–40px), no oversized headings. */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .start-here-inner h2, .risks-inner h2, .founder-content h2, .fin-ready-title, .vig-trust-section h2, .search-resource-inner h2, .talk-ray-text h2) {
    max-width: none !important;
    margin-top: 0.6rem !important;
    font-family: 'Cormorant Garamond', serif !important;
    font-size: clamp(1.95rem, 8.4vw, 2.4rem) !important;
    font-weight: 500 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
  }

  /* Consistent card-heading scale (~21–26px). */
  body[data-vmx="1"][data-vmx-page="home"] :where(.sit-card h3, .recent-card-body h3, .risk-card h3, .process-step h3, .vig-role-grid strong, .vig-help-grid strong) {
    font-size: 1.32rem !important;
    line-height: 1.16 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-desc, .sh-desc, .src-desc, .faq-intro) {
    font-size: 0.94rem !important;
    line-height: 1.72 !important;
  }

  /* ---------------------------------------------------------------------------
     3. SITUATION SELECTOR — two clean cards per row (not four crammed across)
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-grid,
  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-grid--four {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.6rem !important;
    max-width: none !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-card {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.55rem !important;
    min-height: 138px !important;
    padding: 1rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .vmx-sh-icon {
    width: 42px;
    height: 42px;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-label {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-note {
    font-size: 0.72rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-card::after {
    margin-top: auto;
    align-self: flex-start;
    justify-self: unset;
  }

  /* ---------------------------------------------------------------------------
     4. DARK PANELS — used selectively, always readable
     Search stays navy; the "A Real Person" conversation module becomes a light
     trust card so two navy panels no longer sit back-to-back and its heading is
     no longer low-contrast.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center {
    margin: 0 var(--v31-pad) !important;
    padding: 1.75rem 1.5rem !important;
    border: 1px solid rgba(169, 131, 75, 0.3) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: linear-gradient(160deg, #14273f, #0e1d32) !important;
    box-shadow: var(--v31-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center :where(h2, p, .src-desc, .exp-opener) {
    color: rgba(255, 255, 255, 0.9) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-center h2 {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .search-resource-inner .exp-opener {
    color: var(--goldl) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-section {
    margin: 0 var(--v31-pad) !important;
    padding: 1.75rem 1.5rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner {
    flex-direction: column !important;
    gap: 1rem !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-inner::before {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text h2 {
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text > p {
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-text .exp-opener {
    color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-avatar {
    width: 64px !important;
    height: 64px !important;
    border-color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges span {
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-badges svg {
    color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .talk-ray-cta .btn-primary {
    background: var(--v31-ink) !important;
    border-color: var(--v31-ink) !important;
    color: #fff !important;
  }

  /* ---------------------------------------------------------------------------
     6. MEET RAY — one cohesive founder card, balanced photo
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .founder-inner {
    grid-template-columns: 1fr !important;
    gap: 1.1rem !important;
    padding: 1.5rem 1.4rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
    text-align: left !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media {
    max-width: 148px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-media img {
    aspect-ratio: 1 / 1 !important;
    object-fit: cover;
    object-position: center 22%;
    border-radius: 16px !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  /* Founder eyebrow is a long phrase — render as a clean label, not a long pill. */
  body[data-vmx="1"][data-vmx-page="home"] .founder-content .section-eyebrow {
    display: flex !important;
    align-items: center;
    gap: 0.55rem;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    color: var(--v31-gold) !important;
    font-size: 0.62rem !important;
    letter-spacing: 0.14em !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-content .section-eyebrow::before {
    content: "";
    display: block !important;
    flex: 0 0 auto;
    width: 26px;
    height: 1px;
    background: var(--v31-gold);
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-trustline {
    font-size: 0.74rem !important;
    color: var(--v31-gold) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-body {
    margin: 0 0 1.1rem !important;
    font-size: 0.94rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .founder-cta .btn-soft {
    display: inline-flex;
    width: 100%;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    border-radius: 16px !important;
  }

  /* ---------------------------------------------------------------------------
     8. FINANCIAL READINESS — themed as a system card (was desktop-styled)
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-section {
    background: var(--v31-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready {
    max-width: none !important;
    margin: 0 !important;
    padding: 1.5rem 1.4rem !important;
    border: 1px solid var(--v31-line) !important;
    border-left: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius-lg) !important;
    background: var(--v31-paper-2) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready p {
    max-width: none !important;
    font-size: 0.94rem !important;
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-cta {
    display: flex !important;
    width: 100% !important;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    margin-top: 0.5rem !important;
    border: 1px solid var(--v31-ink) !important;
    border-radius: 16px !important;
    background: transparent !important;
    color: var(--v31-ink) !important;
    text-transform: none !important;
  }

  /* ---------------------------------------------------------------------------
     9. COORDINATED NETWORK + OUR ROLE (runtime trust sections)
     Previously un-themed on mobile — they reverted to plain desktop boxes.
     Now rebuilt as system cards so they belong to the same design language.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .vig-professional-network {
    background: var(--v31-paper) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-our-role {
    background: var(--v31-paper-2) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-trust-inner {
    max-width: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-trust-section p {
    font-size: 0.94rem !important;
    line-height: 1.72 !important;
    color: var(--v31-ink-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-help-grid,
  body[data-vmx="1"][data-vmx-page="home"] .vig-role-grid {
    grid-template-columns: 1fr !important;
    gap: 0.7rem !important;
    margin: 1.3rem 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-help-grid p,
  body[data-vmx="1"][data-vmx-page="home"] .vig-role-grid p {
    margin: 0 !important;
    padding: 1.3rem !important;
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius) !important;
    background: var(--v31-paper) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-help-grid strong,
  body[data-vmx="1"][data-vmx-page="home"] .vig-role-grid strong {
    margin-bottom: 0.4rem !important;
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-brand-promise {
    padding: 1rem 1.15rem !important;
    border-left: 3px solid var(--v31-gold) !important;
    border-radius: 0 14px 14px 0 !important;
    background: var(--v31-gold-soft) !important;
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-network-summary {
    color: var(--v31-ink) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-professional-note {
    color: var(--v31-ink-soft) !important;
  }

  /* Conversation CTA: a single navy accent card with a gold primary action. */
  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 1rem !important;
    margin-top: 1.4rem !important;
    padding: 1.4rem !important;
    border-radius: var(--v31-radius) !important;
    background: linear-gradient(160deg, #14273f, #0e1d32) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta strong {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta span,
  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta p {
    color: rgba(255, 255, 255, 0.85) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .vig-conversation-cta a {
    display: flex !important;
    width: 100% !important;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gold) !important;
    border-radius: 16px !important;
    background: var(--gold) !important;
    color: var(--v31-ink) !important;
    font-weight: 700;
  }

  /* ---------------------------------------------------------------------------
     10. FINAL CTA (navy) — ensure strong contrast
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner :where(h2, p) {
    color: rgba(255, 255, 255, 0.9) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner h2 {
    color: #fff !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner .exp-opener {
    color: var(--goldl) !important;
  }

  /* ---------------------------------------------------------------------------
     11. BUTTON STANDARDISATION — consistent height, radius, casing
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.btn-primary, .btn-soft, .hc-submit, .vmx-hero-secondary, .fin-ready-cta) {
    min-height: 52px !important;
    border-radius: 16px !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
  }

  /* ---------------------------------------------------------------------------
     12. BOTTOM ACTION BAR — compact, safe-area aware, three clear labels
     Removes the doubled safe-area + tall min-height that left a large empty
     navy block beneath the controls, and restores a readable "Text" label.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] {
    padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta {
    padding: 0.5rem var(--v31-pad) calc(0.5rem + env(safe-area-inset-bottom)) !important;
    background: rgba(15, 31, 56, 0.98) !important;
    border-top: 1px solid rgba(169, 131, 75, 0.4) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta-inner {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1.35fr !important;
    gap: 0.5rem !important;
    min-height: 0 !important;
    max-width: 460px !important;
    padding: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta a {
    min-width: 0;
    min-height: 48px !important;
    padding: 0.5rem 0.4rem !important;
    border-radius: 12px !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
  }

  /* Restore the "Text" label (the site-wide layer hides it as icon-only). */
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta .msc-text {
    width: auto !important;
    padding-inline: 0.4rem !important;
    overflow: visible !important;
    font-size: 0.72rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta .msc-text svg {
    width: 14px !important;
    height: 14px !important;
    margin: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.msc-call, .msc-text) {
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: rgba(255, 255, 255, 0.9) !important;
    background: rgba(255, 255, 255, 0.06) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .msc-review {
    border: 1px solid var(--gold) !important;
    background: var(--gold) !important;
    color: var(--v31-ink) !important;
    font-weight: 700 !important;
  }
}

/* Smallest phones: keep the three bar labels readable, selector still 2-up. */
@media screen and (max-width: 360px) {
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta a {
    font-size: 0.66rem !important;
    padding-inline: 0.3rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .start-here-section .sh-card {
    min-height: 128px !important;
    padding: 0.85rem !important;
  }
}

/* ============================================================================
   VMX 3.2 — FINAL PRODUCTION POLISH
   A production-polish pass over the mobile experience. No redesign: URLs,
   markup, schema, forms, CTA behavior and desktop layouts are untouched.
   Everything below is scoped to body[data-vmx="1"] inside max-width:768px, so
   desktop stays pixel-identical. Appended last so it supersedes earlier layers.

   Spacing rhythm is normalised to an 8 / 16 / 24 / 32 scale throughout.
   ============================================================================ */
@media screen and (max-width: 768px) {

  /* ---------------------------------------------------------------------------
     1. HEADER — premium, minimal, vertically centred
     Remove the decorative "NJ Property Help Center" chrome tagline that sat at
     the bottom edge and overlapped the logo on interior templates; centre the
     logo and hamburger; settle the header at a stable ~72px.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"] nav {
    min-height: calc(72px + env(safe-area-inset-top)) !important;
    padding-top: calc(0.5rem + env(safe-area-inset-top)) !important;
    padding-bottom: 0.5rem !important;
    align-items: center !important;
  }

  body[data-vmx="1"] nav::after {
    display: none !important;
  }

  body[data-vmx="1"] nav :where(.nlogo, .logo, .nav-logo) {
    align-self: center !important;
  }

  body[data-vmx="1"] .mobile-menu-btn {
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Keep the open menu docked directly beneath the taller header. */
  body[data-vmx="1"] .nlinks:is(.mobile-open, .vig-mobile-open) {
    top: calc(72px + env(safe-area-inset-top)) !important;
    max-height: calc(100dvh - 72px - env(safe-area-inset-top)) !important;
  }

  body[data-vmx="1"] .vmx-reading-progress {
    top: calc(72px + env(safe-area-inset-top)) !important;
  }

  /* ---------------------------------------------------------------------------
     2. GUIDE / RESOURCE CHECKLISTS — icon fully outside the text column
     The green circular check previously sat ~6px from the copy and clipped the
     first letter. Move it fully outside the text column with a consistent ~20px
     gutter so it never covers a glyph.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"] .rc-checklist li {
    padding-left: 2.7rem !important;
  }

  body[data-vmx="1"] .rc-checklist .rc-check {
    left: 0 !important;
    top: 0.7rem !important;
    width: 1.5rem !important;
    height: 1.5rem !important;
  }

  /* ---------------------------------------------------------------------------
     3. CONTENT WIDTH — let long legal articles breathe (~92%)
     Replace the narrow fixed reading column with a ~92% measure; side breathing
     room now comes from the auto margins rather than a tight fixed cap.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) {
    max-width: 92% !important;
    margin-inline: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Slightly airier reading line-height for body copy on reading templates. */
  body[data-vmx="1"] :where(.article, .rc-content, .guide-content) :where(p, li) {
    line-height: 1.8 !important;
  }

  /* ---------------------------------------------------------------------------
     4 & 5. HERO IMAGE — removed on mobile for a cleaner, text-focused opening.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .hero-left::after {
    display: none !important;
    content: none !important;
  }

  /* ---------------------------------------------------------------------------
     6. CARD CONSISTENCY — one radius / border / shadow across content cards
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(
    .sit-card, .recent-card, .risk-card, .process-step, .sh-card, .faq-item,
    .founder-inner, .fin-ready, .vig-help-grid p, .vig-role-grid p
  ) {
    border: 1px solid var(--v31-line) !important;
    border-radius: var(--v31-radius) !important;
    box-shadow: var(--v31-shadow-soft) !important;
  }

  /* ---------------------------------------------------------------------------
     7. TYPOGRAPHY — editorial, not poster. Ease oversized headings down a step
     and open up body line-height for a calmer read.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .hero h1 {
    font-size: clamp(2rem, 7.4vw, 2.4rem) !important;
    line-height: 1.12 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .section-header h2, .start-here-inner h2, .risks-inner h2, .founder-content h2,
    .fin-ready-title, .vig-trust-section h2, .search-resource-inner h2, .talk-ray-text h2
  ) {
    font-size: clamp(1.85rem, 7.4vw, 2.25rem) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .section-desc, .sh-desc, .src-desc, .faq-intro, .founder-body,
    .risks-reassurance, .sit-card p, .risk-card p, .process-step p
  ) {
    line-height: 1.78 !important;
  }

  /* ---------------------------------------------------------------------------
     8. STICKY BAR — Call / Text / Free Review (labels unchanged)
     Slightly shorter, equal spacing, and perfectly centred controls.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta {
    padding-top: 0.45rem !important;
    padding-bottom: calc(0.45rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta-inner {
    align-items: stretch !important;
    gap: 0.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-sticky-cta a {
    display: inline-flex !important;
    min-height: 46px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
  }

  /* ---------------------------------------------------------------------------
     9. MICRO SPACING — one 8 / 16 / 24 / 32 rhythm around section blocks
     heading → paragraph → cards → next section, aligned to the scale.
     --------------------------------------------------------------------------- */
  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header, .risks-inner .section-header) {
    margin-bottom: 1.5rem !important; /* 24px: block → cards */
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.section-header h2, .start-here-inner h2, .risks-inner h2) {
    margin-top: 1rem !important;      /* 16px: eyebrow → heading */
    margin-bottom: 0.5rem !important; /* 8px:  heading → paragraph */
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(.sh-desc, .section-desc, .src-desc) {
    margin-bottom: 1.5rem !important; /* 24px: paragraph → cards */
  }

body[data-vmx="1"][data-vmx-page="home"] .section-cta-row {
    margin-top: 1.5rem !important;    /* 24px: cards → CTA */
  }
}

/* Resource Center cascade guard: keep blog-only patterns after shared VMX layers. */
@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="blog"] :where(.eyebrow, .section-eyebrow) {
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .gux-card-tag {
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    gap: 0.8rem !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    contain: none !important;
    scroll-snap-type: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card {
    min-height: 0 !important;
    padding: 1.05rem !important;
    border-radius: 18px !important;
    box-shadow: var(--vrc-shadow) !important;
    scroll-snap-align: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid) {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column !important;
    grid-auto-columns: min(82vw, 330px) !important;
    gap: 1rem !important;
    margin-inline: calc(var(--vmx-page-gutter) * -1) !important;
    padding: 0.2rem var(--vmx-page-gutter) 1.25rem !important;
    overflow-x: auto !important;
    contain: none !important;
    scrollbar-width: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid .gux-card, .vmx-workbook-grid .gux-card, .recent-guide-card) {
    min-height: 100% !important;
    padding: 1.25rem !important;
    border-radius: var(--vrc-radius) !important;
    box-shadow: var(--vrc-shadow) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-featured-grid .gux-card {
    padding-top: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 99 !important;
  }
}

@media screen and (max-width: 340px) {
  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="blog"] {
    padding-bottom: calc(62px + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .hero-inner {
    padding-inline: 0 !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .vmx-situation-grid .gux-card-title {
    font-size: clamp(1.35rem, 5.6vw, 1.5rem) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] footer {
    padding: 2rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta {
    min-height: 0 !important;
    padding: 0.45rem 5.2vw calc(0.45rem + env(safe-area-inset-bottom)) !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta-inner {
    grid-template-columns: 1fr 1fr 1.35fr !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    gap: 0.5rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta a,
  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta .msc-text {
    width: auto !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0.5rem 0.4rem !important;
    font-size: 0.72rem !important;
    line-height: 1.7 !important;
    letter-spacing: 0.035em !important;
    overflow: visible !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta svg,
  body[data-vmx="1"][data-vmx-page="blog"] .mobile-sticky-cta .msc-text svg {
    width: 14px !important;
    height: 14px !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0.7rem var(--vmx-page-gutter) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--vrc-line) !important;
    background: var(--vrc-paper) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs::after {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-list {
    max-width: 42rem;
    margin-inline: auto !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-item,
  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-item a {
    color: var(--vrc-copy) !important;
    font-size: 0.75rem !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .breadcrumbs-item a {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px !important;
    align-items: center;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid, .vmx-workbook-grid, .recent-guides-grid) {
    grid-auto-columns: min(78vw, 314px) !important;
    align-items: start !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] :where(.vmx-featured-grid .gux-card, .vmx-workbook-grid .gux-card, .recent-guide-card) {
    min-height: 0 !important;
    align-self: start !important;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .nlogo {
    min-height: 44px;
  }

  body[data-vmx="1"][data-vmx-page="blog"] .browse-view-link {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  body[data-vmx="1"][data-vmx-page="blog"] footer a {
    min-width: 44px;
  }
}

/* ============================================================
   READABILITY CERTIFICATION — mobile contrast repairs
   ------------------------------------------------------------
   The mobile theme above recolours body copy to dark ink for the
   light editorial reading surface. A handful of components keep a
   navy / near-black background (in-page navigation panels, form &
   CTA headers, the Quick Answer header bar, footer column headings),
   so that ink text landed dark-on-dark and became unreadable. These
   rules restore legible light text on exactly those dark surfaces.
   Presentation only: colour, layering and one hero image visibility
   toggle. No wording, DOM, links or layout are changed.

   :is() is used so the container class contributes specificity and
   these rules win over the broad `.article/.rc-content/.guide-content`
   colour rules earlier in this file.
   ============================================================ */
@media screen and (max-width: 768px) {
  /* In-page navigation panels sit on a navy card — headings + links light. */
  body[data-vmx="1"] :is(nav.toc, nav.explore-related, nav.county-jump) :is(h2, h3, h4, strong) {
    color: #fff !important;
  }
  /* TOC links in .toc / .explore-related render directly on the navy card. */
  body[data-vmx="1"] :is(nav.toc, nav.explore-related) a {
    color: rgba(255, 255, 255, 0.9) !important;
  }
  /* .county-jump links render as light pills, so their label must stay dark. */
  body[data-vmx="1"] nav.county-jump .county-jump-links a {
    color: #14273f !important;
  }

  /* Navy headers on lead forms, CTAs and the Quick Answer bar. */
  body[data-vmx="1"] :is(.lcf-head, .cwf-text, .cta-box, .blog-cta-block, .rc-footer-cta, .rc-download, .quick-answer-header, .authority-ribbon, .sh-hero, .sh-final, .fr-hero, .fr-final, .bfc-header) :is(h1, h2, h3, h4) {
    color: #fff !important;
  }
  body[data-vmx="1"] :is(.lcf-head, .cwf-text, .cta-box, .blog-cta-block, .rc-footer-cta, .rc-download, .bfc-header) :is(p, li) {
    color: rgba(255, 255, 255, 0.82) !important;
  }
  body[data-vmx="1"] .authority-ribbon .ar-counties {
    color: rgba(255, 255, 255, 0.72) !important;
  }

  /* Footer column headings on the near-black footer. */
  body[data-vmx="1"] footer :is(h4) {
    color: #fff !important;
  }

  /* City & County heroes: hide the full-bleed landmark photo on mobile so the
     light editorial hero renders cleanly — matching the homepage's mobile hero.
     The photo stays on tablet / desktop and remains in the markup for SEO/OG. */
  body[data-vmx="1"] .municipality-hero-image,
  body[data-vmx="1"] .municipality-hero-credit {
    display: none !important;
  }
  body[data-vmx="1"] .hero .meta,
  body[data-vmx="1"] .hero .breadcrumb {
    color: #585868 !important;
  }
  body[data-vmx="1"] .hero .breadcrumb a {
    color: #3f4f69 !important;
  }
  /* In-hero Quick Answer paragraph on the light sage card. */
  body[data-vmx="1"] .hero-qa p {
    color: #3a3a4a !important;
  }
}

/* Homepage mobile rebuild: follows the source DOM sequence without ordering hacks. */
@media screen and (max-width: 768px) {
  body[data-vmx="1"][data-vmx-page="home"] {
    display: block !important;
    overflow-x: hidden;
    padding-bottom: 0 !important;
    background: #f7f4ef !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] > .hero,
  body[data-vmx="1"][data-vmx-page="home"] > .talk-ray-section,
  body[data-vmx="1"][data-vmx-page="home"] > .authority-ribbon,
  body[data-vmx="1"][data-vmx-page="home"] > .mobile-sticky-cta {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero {
    position: relative;
    isolation: isolate;
    display: block;
    overflow: hidden;
    padding: calc(5.6rem + env(safe-area-inset-top)) clamp(1.15rem, 5.2vw, 1.5rem) 2.35rem;
    background:
      radial-gradient(circle at 92% 8%, rgba(184, 156, 106, 0.2), transparent 34%),
      linear-gradient(150deg, #122844 0%, #0f1f38 62%, #0b192c 100%);
    color: #fff;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::before,
  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    pointer-events: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::before {
    inset: 0;
    opacity: 0.28;
    background-image:
      linear-gradient(115deg, transparent 0 62%, rgba(255,255,255,0.06) 62% 62.5%, transparent 62.5%),
      linear-gradient(25deg, transparent 0 78%, rgba(184,156,106,0.16) 78% 78.5%, transparent 78.5%);
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero::after {
    width: 13rem;
    height: 13rem;
    right: -6.5rem;
    bottom: -5rem;
    border: 1px solid rgba(184, 156, 106, 0.26);
    border-radius: 46% 54% 62% 38%;
    transform: rotate(20deg);
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-inner {
    width: 100%;
    max-width: 42rem;
    margin: 0 auto;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.9rem;
    color: #d4b579;
    font: 700 0.64rem/1.35 'DM Sans', sans-serif;
    letter-spacing: 0.15em;
    text-transform: uppercase;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-eyebrow::before {
    content: "";
    width: 24px;
    height: 1px;
    flex: 0 0 auto;
    background: currentColor;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero h1 {
    max-width: 12.5em;
    margin: 0 0 0.85rem;
    color: #fff;
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2rem, 8.5vw, 2.55rem);
    font-weight: 500;
    line-height: 1.03;
    letter-spacing: -0.025em;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-copy {
    max-width: 38rem;
    margin: 0 0 1.2rem;
    color: rgba(255, 255, 255, 0.82);
    font-size: clamp(0.91rem, 3.8vw, 1rem);
    line-height: 1.55;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-primary {
    display: inline-flex;
    min-height: 50px;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    padding: 0.85rem 1rem;
    border: 1px solid #c7a667;
    border-radius: 14px;
    background: #c7a667;
    color: #102139;
    font-size: 0.84rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-align: center;
    text-decoration: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-secondary {
    display: inline-flex;
    min-height: 44px;
    flex: 0 0 auto;
    align-items: center;
    color: rgba(255, 255, 255, 0.9);
    border-bottom: 1px solid rgba(212, 181, 121, 0.7);
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.45rem;
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.64rem;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.025em;
  }

  body[data-vmx="1"][data-vmx-page="home"] #services {
    scroll-margin-top: calc(76px + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .start-here-section, .founder-section, .process-section, .risks-section,
    #recent-situations, .property-toolkit-start, .search-resource-center,
    #faq, .fin-bridge, .fin-ready-section, .final-cta-section,
    .vig-professional-network, .vig-our-role
  ) {
    padding-left: clamp(1.15rem, 5.2vw, 1.5rem) !important;
    padding-right: clamp(1.15rem, 5.2vw, 1.5rem) !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] :where(
    .start-here-section, .founder-section, .process-section, .risks-section,
    #recent-situations, .property-toolkit-start, .search-resource-center, #faq
  ) {
    padding-top: 3.25rem !important;
    padding-bottom: 3.25rem !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-desktop-copy,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-desktop-copy,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner > .exp-opener,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-inner > .cta-note,
  body[data-vmx="1"][data-vmx-page="home"] .fin-ready > p:first-of-type,
  body[data-vmx="1"][data-vmx-page="home"] .vig-professional-network .vig-conversation-cta {
    display: none !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-mobile-copy,
  body[data-vmx="1"][data-vmx-page="home"] .final-cta-mobile-copy {
    display: block;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge {
    padding-top: 3.1rem !important;
    padding-bottom: 1.2rem !important;
    background: #f7f4ef !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-inner {
    text-align: left;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-title {
    margin: 0 0 0.7rem !important;
    color: #12263f !important;
    font-size: clamp(1.95rem, 8vw, 2.35rem) !important;
    line-height: 1.05 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-bridge-desc {
    margin: 0 !important;
    color: #43536a !important;
    font-size: 0.95rem !important;
    line-height: 1.72 !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .fin-ready-section {
    padding-top: 1.2rem !important;
    padding-bottom: 3.25rem !important;
    background: #f7f4ef !important;
  }

  body[data-vmx="1"][data-vmx-page="home"] .final-cta-mobile-copy {
    max-width: 42rem;
    margin: 0 auto 1.6rem !important;
  }
}

@media screen and (max-width: 768px) {
  body[data-vmx="1"] main nav.explore-related {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
  }
}

@media screen and (max-width: 360px) {
  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero {
    padding-top: calc(5.35rem + env(safe-area-inset-top));
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero h1 {
    font-size: 1.92rem;
  }

  body[data-vmx="1"][data-vmx-page="home"] .mobile-home-hero-actions {
    gap: 0.75rem;
  }
}

/* /assets/css/article-experience.css */
/* ============================================================
   ARTICLE EXPERIENCE CLONE LAYER — shared reusable asset
   ------------------------------------------------------------
   Clones the approved Homepage + Resource Center + Authority Hub
   visual language (VIG Experience System 1.0) onto the standard
   New Jersey educational article template. Scoped to
   body[data-vig-template="article"] and loaded LAST so it wins at
   equal specificity without !important and without touching the
   shared base assets (vmx-mobile.css, article-v2.css,
   production-standard.css) or sibling page types.

   Presentation only: no content, copy, headings, semantic order,
   schema, canonical, metadata, links, forms, endpoints, anchor
   IDs, analytics or CTA destinations are changed here.

   Requires the per-page design tokens (--navy, --gold, --goldl,
   --cream, --border, --border-gold, --radius-lg, --td, --tm,
   --white, --shadow-*) which every article defines identically in
   its inline :root block, plus the shared mobile system in
   /assets/css/vmx-mobile.css.

   Companion to /assets/css/authority-hub-clone.css — same design
   language, mapped to the article template class names
   (.blog-hero, .article, .quick-answer, .callout, .county-cta,
   .explore-related, .official-resources, .blog-final-cta ...).
   ============================================================ */

body[data-vig-template="article"]{
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --ax-shadow-card:0 24px 72px rgba(15,31,56,.22),0 8px 24px rgba(0,0,0,.1);
  --ax-gutter:clamp(1rem,4.6vw,1.35rem);
}
body[data-vig-template="article"] a,
body[data-vig-template="article"] button{-webkit-tap-highlight-color:transparent}

/* ============================================================
   1 · HERO — editorial, readable, content-driven
   Preserve breadcrumb, H1, supporting copy. No poster-scale
   title, no dark-on-dark, no giant empty banner.
   ============================================================ */
body[data-vig-template="article"] .blog-hero{overflow:hidden}
body[data-vig-template="article"] .blog-hero h1{
  font-family:'Cormorant Garamond',serif;font-weight:300;
  color:var(--white);letter-spacing:-.01em;
}
/* Authentic NJ image treatment: calm, never washed out, gold hairline */
body[data-vig-template="article"] .hero-img-wrap{
  background:var(--navy);border-bottom:1px solid rgba(184,156,106,.28);
}
body[data-vig-template="article"] .hero-img-wrap img{
  filter:brightness(.94);
}

/* ============================================================
   2 · KEY ANSWER — approved key-answer card, strong contrast,
   close to the opening. Wording untouched. No oversized pills.
   ============================================================ */
body[data-vig-template="article"] .quick-answer{
  border:1px solid var(--border-gold);
  border-radius:var(--radius-lg,14px);
  box-shadow:var(--shadow-md);
  position:relative;overflow:hidden;
}
body[data-vig-template="article"] .quick-answer::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--gold),var(--goldl));z-index:2;
}
body[data-vig-template="article"] .quick-answer-header h2{
  font-family:'Cormorant Garamond',serif;font-weight:400;color:var(--white);
}
body[data-vig-template="article"] .quick-answer-body>p:first-child{color:var(--td)}

/* ============================================================
   3 · READING EXPERIENCE  (HIGHEST PRIORITY)
   The approved editorial type scale, reading width (~92%),
   line-height and paragraph rhythm are owned by the shared
   /assets/css/vmx-mobile.css system so articles read IDENTICALLY
   to the approved Homepage / Resource Center / Authority Hub —
   we deliberately do NOT introduce a divergent article type scale
   ("do not invent a fourth design language"). This layer only
   guarantees anchor links land clear of the fixed header.
   ============================================================ */
body[data-vig-template="article"] .article :is(h2,h3,h4),
body[data-vig-template="article"] .article [id]{
  scroll-margin-top:calc(84px + env(safe-area-inset-top,0px));
}

/* ============================================================
   4 · GREEN ICON / TEXT RULE
   Checklist & status icons sit fully OUTSIDE the text column,
   keep an 18–22px gutter, never cover the first letter, stay a
   consistent size, and remain visible in reduced-motion mode.
   ============================================================ */
body[data-vig-template="article"] .quick-answer-facts li,
body[data-vig-template="article"] .twr-points li,
body[data-vig-template="article"] .checklist-box li{
  position:relative;list-style:none;padding-left:1.65rem;
}
body[data-vig-template="article"] .quick-answer-facts li::before,
body[data-vig-template="article"] .twr-points li::before,
body[data-vig-template="article"] .checklist-box li::before{
  content:'\2713';position:absolute;left:0;top:.08em;
  width:1.1rem;text-align:center;
  color:var(--gold);font-weight:700;line-height:1.4;flex:none;
}
/* Body-copy bullets: dot stays outside the measure with a clear gutter */
body[data-vig-template="article"] .article ul li{padding-left:1.5rem}
body[data-vig-template="article"] .article ul li::before{left:.15rem;top:.62em}

/* ============================================================
   5 · CARD SYSTEM — map existing elements to approved cards
   without changing their meaning. Do NOT card ordinary text.
   ============================================================ */
/* Warning / "what this means" callout */
body[data-vig-template="article"] .callout{
  border-left:3px solid var(--gold);
  border-radius:0 var(--radius-lg,12px) var(--radius-lg,12px) 0;
  box-shadow:var(--shadow-sm);
}
/* Next-step / option card */
body[data-vig-template="article"] .county-cta{
  border-radius:var(--radius-lg,12px);box-shadow:var(--shadow-md);
  position:relative;overflow:hidden;
}
body[data-vig-template="article"] .county-cta::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--gold),var(--goldl));
}
/* "This guide covers" */
body[data-vig-template="article"] .guide-covers-item{transition:transform .3s var(--ease-out)}
/* Official-resource cards — full-width, readable, calm hover */
body[data-vig-template="article"] .or-card,
body[data-vig-template="article"] .resource-card{
  border-radius:var(--radius-lg,12px);border:1px solid var(--border);
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out),border-color .3s;
}
body[data-vig-template="article"] .or-card:hover,
body[data-vig-template="article"] .resource-card:hover{
  transform:translateY(-3px);box-shadow:var(--shadow-hover,0 18px 50px rgba(15,31,56,.14));
  border-color:var(--border-gold);
}
/* Related-resource system — approved snap deck on mobile when 4+
   compact image/resource cards; longer legal cards stay full width. */
@media (max-width:768px){
  body[data-vig-template="article"] .explore-related{border-radius:var(--radius-lg,12px)}
  body[data-vig-template="article"] .rs-grid,
  body[data-vig-template="article"] .related-grid{
    display:grid;grid-auto-flow:column;
    grid-auto-columns:min(82%,300px);
    gap:.9rem;overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    padding:.25rem var(--ax-gutter) .75rem;margin-inline:calc(-1 * var(--ax-gutter));
    scrollbar-width:none;
  }
  body[data-vig-template="article"] .rs-grid::-webkit-scrollbar,
  body[data-vig-template="article"] .related-grid::-webkit-scrollbar{display:none}
  body[data-vig-template="article"] .rs-card{scroll-snap-align:start}
  /* longer official-resource cards remain full width, stacked */
  body[data-vig-template="article"] .or-cards{grid-template-columns:1fr;gap:.9rem}
}

/* ============================================================
   6 · BUTTONS — approved gold system + sheen microinteraction
   (cloned from the homepage / authority-hub button treatment).
   Destinations and labels unchanged.
   ============================================================ */
body[data-vig-template="article"] .bfc-submit,
body[data-vig-template="article"] .bfc-cta-btn,
body[data-vig-template="article"] .county-cta-btn,
body[data-vig-template="article"] .search-btn{position:relative;overflow:hidden}
body[data-vig-template="article"] .bfc-submit::after,
body[data-vig-template="article"] .bfc-cta-btn::after,
body[data-vig-template="article"] .county-cta-btn::after{
  content:'';position:absolute;top:0;left:-130%;width:55%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);
  transform:skewX(-18deg);pointer-events:none;
}
body[data-vig-template="article"] .bfc-submit:hover::after,
body[data-vig-template="article"] .bfc-cta-btn:hover::after,
body[data-vig-template="article"] .county-cta-btn:hover::after{animation:ax-sheen .85s var(--ease-soft)}
@keyframes ax-sheen{to{left:150%}}
body[data-vig-template="article"] .bfc-submit:active,
body[data-vig-template="article"] .bfc-cta-btn:active,
body[data-vig-template="article"] .county-cta-btn:active{transform:translateY(0) scale(.98)}

/* ============================================================
   7 · FORM — approved private-review presentation.
   Readable 16px+ controls, full-width mobile fields, visible
   labels, comfortable spacing. Endpoint / field names / behavior
   handled by the page + conversion-repairs.js (unchanged).
   ============================================================ */
body[data-vig-template="article"] .bfc-field label{color:var(--td);font-weight:600}
body[data-vig-template="article"] .bfc-field input,
body[data-vig-template="article"] .bfc-field select,
body[data-vig-template="article"] .bfc-field textarea{
  font-size:16px;border-radius:10px;width:100%;
}
body[data-vig-template="article"] .bfc-field input:focus,
body[data-vig-template="article"] .bfc-field select:focus,
body[data-vig-template="article"] .bfc-field textarea:focus{
  border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,156,106,.16);outline:none;
}

/* ============================================================
   8 · FINAL CTA BAND — approved closing band, hero-to-footer
   consistency (never a compressed desktop strip on mobile).
   ============================================================ */
body[data-vig-template="article"] .blog-final-cta h3{
  font-family:'Cormorant Garamond',serif;font-weight:400;color:var(--white);
}
@media (max-width:768px){
  body[data-vig-template="article"] .blog-final-cta{padding:2.5rem var(--ax-gutter)}
  body[data-vig-template="article"] .blog-final-cta .bfc-cta-btn{width:100%;text-align:center}
  body[data-vig-template="article"] .blog-search-section{padding-left:var(--ax-gutter);padding-right:var(--ax-gutter)}
}

/* ============================================================
   9 · STICKY ACTION BAR — Call / Text / Free Review.
   The shared bar is styled & shown/hidden by vmx-mobile.css/js
   (compact, safe-area aware, hidden on desktop, hidden near the
   form/footer). Reinforce the safe-area padding reserve only.
   ============================================================ */
@media (max-width:768px){
  body[data-vig-template="article"]{
    padding-bottom:calc(68px + env(safe-area-inset-bottom,0px));
  }
}

/* ============================================================
   10 · ACCESSIBILITY & REDUCED MOTION
   Visible keyboard focus; honour prefers-reduced-motion; icons
   and contrast remain intact with motion disabled.
   ============================================================ */
body[data-vig-template="article"] a:focus-visible,
body[data-vig-template="article"] button:focus-visible,
body[data-vig-template="article"] input:focus-visible,
body[data-vig-template="article"] select:focus-visible,
body[data-vig-template="article"] .or-card:focus-visible,
body[data-vig-template="article"] .rs-card:focus-visible{
  outline:2px solid var(--gold);outline-offset:2px;border-radius:4px;
}
@media (prefers-reduced-motion:reduce){
  body[data-vig-template="article"] *,
  body[data-vig-template="article"] *::before,
  body[data-vig-template="article"] *::after{
    transition-duration:.01ms !important;animation-duration:.01ms !important;
    animation-iteration-count:1 !important;scroll-behavior:auto !important;
  }
  body[data-vig-template="article"] .bfc-submit:hover,
  body[data-vig-template="article"] .bfc-cta-btn:hover,
  body[data-vig-template="article"] .county-cta-btn:hover,
  body[data-vig-template="article"] .or-card:hover,
  body[data-vig-template="article"] .rs-card:hover{transform:none}
}

/* ============================================================
   11 · DESKTOP EXPERIENCE 1.0  —  wide-screen editorial polish
   ------------------------------------------------------------
   The article's desktop reading rhythm, hero and CTA scale come
   from the shared /article-v2.css desktop layer; this only adds a
   little extra presence to the key-answer card and closing band
   on large screens so the article matches the premium hub / guide
   desktop feel. min-width only — the locked mobile article layout
   (max-width:768px) is untouched.
   ============================================================ */
@media (min-width:1440px){
  body[data-vig-template="article"] .quick-answer{box-shadow:var(--shadow-lg)}
  body[data-vig-template="article"] .blog-final-cta{padding:3.85rem 3rem}
}

/* ============================================================
   UI 2.5 — ARTICLE FINAL POLISH
   Editorial refinement only. Keeps copy/order/schema intact.
   ============================================================ */
body[data-vig-template="article"] .blog-hero-inner{
  max-width:1180px;margin-inline:auto;gap:clamp(1.5rem,4vw,4rem);
}
body[data-vig-template="article"] .blog-hero-left{max-width:720px}
body[data-vig-template="article"] .blog-hero .eyebrow{
  letter-spacing:.11em;text-transform:uppercase;font-weight:800;
}
body[data-vig-template="article"] .blog-hero h1{
  font-size:clamp(2.55rem,5vw,4.65rem);line-height:.98;max-width:14ch;margin-bottom:1.1rem;
}
body[data-vig-template="article"] .blog-hero .meta{
  max-width:680px;line-height:1.55;opacity:.86;
}
body[data-vig-template="article"] .breadcrumb{font-size:.78rem;opacity:.78;margin-top:.7rem}
body[data-vig-template="article"] .vig-hero-summary{
  max-width:650px;font-size:1rem;line-height:1.65;margin-top:1rem!important;
}
body[data-vig-template="article"] .blog-form-card{
  border-radius:18px!important;box-shadow:0 28px 70px rgba(0,0,0,.22)!important;overflow:hidden;
}
body[data-vig-template="article"] .bfc-header{padding:1.35rem 1.45rem 1rem!important}
body[data-vig-template="article"] .bfc-form{padding:1.15rem 1.45rem 1.45rem!important}
body[data-vig-template="article"] .hero-img-wrap{max-height:420px;overflow:hidden}
body[data-vig-template="article"] .hero-img-wrap img{width:100%;height:420px;object-fit:cover}
body[data-vig-template="article"] .hero-img-wrap figcaption{
  max-width:980px;margin:auto;padding:.7rem 1.25rem;font-size:.76rem;line-height:1.5;
}
body[data-vig-template="article"] .guide-covers{border-bottom:1px solid #e8e2d8}
body[data-vig-template="article"] .guide-covers-inner{max-width:1040px!important}
body[data-vig-template="article"] .article{
  max-width:920px!important;margin-inline:auto!important;padding-left:clamp(1rem,4vw,2rem)!important;padding-right:clamp(1rem,4vw,2rem)!important;
}
body[data-vig-template="article"] .quick-answer{
  margin-top:clamp(2.5rem,5vw,4.25rem)!important;margin-bottom:3rem!important;background:#fff;
}
body[data-vig-template="article"] .quick-answer-header{padding:1.25rem 1.5rem!important}
body[data-vig-template="article"] .quick-answer-body{padding:1.5rem!important}
body[data-vig-template="article"] .quick-answer-facts{
  background:#f8f6f1;border:1px solid #e6dfd3;border-radius:12px;padding:1rem 1rem 1rem 1.2rem!important;margin-top:1.25rem!important;
}
body[data-vig-template="article"] .article>h2,
body[data-vig-template="article"] .article section>h2{
  margin-top:3.4rem!important;padding-top:.15rem;font-family:'Cormorant Garamond',serif!important;font-size:clamp(2rem,4vw,2.65rem)!important;line-height:1.08!important;color:#0c2038!important;letter-spacing:-.015em;
}
body[data-vig-template="article"] .article h3{
  margin-top:2.25rem!important;font-size:1.3rem!important;line-height:1.25!important;color:#16334f!important;
}
body[data-vig-template="article"] .article p{margin-bottom:1.2rem!important}
body[data-vig-template="article"] .article table{
  border-radius:12px;overflow:hidden;box-shadow:0 10px 30px rgba(12,32,56,.07);margin:1.8rem 0!important;
}
body[data-vig-template="article"] .callout,
body[data-vig-template="article"] .county-cta,
body[data-vig-template="article"] .explore-related,
body[data-vig-template="article"] .official-resources{
  margin-top:2.25rem!important;margin-bottom:2.25rem!important;
}
body[data-vig-template="article"] .ti-cluster-nav{
  margin-top:3.5rem!important;border-radius:16px!important;overflow:hidden;box-shadow:0 18px 50px rgba(12,32,56,.10)!important;
}
body[data-vig-template="article"] .blog-final-cta{
  margin-top:4rem!important;border-radius:18px!important;overflow:hidden;
}
@media(max-width:768px){
 body[data-vig-template="article"] .blog-hero-inner{gap:1.25rem}
 body[data-vig-template="article"] .blog-hero h1{font-size:clamp(2.25rem,11vw,3.25rem);line-height:1.01;max-width:none}
 body[data-vig-template="article"] .blog-form-card{border-radius:14px!important}
 body[data-vig-template="article"] .hero-img-wrap,body[data-vig-template="article"] .hero-img-wrap img{height:240px}
 body[data-vig-template="article"] .article{padding-left:1rem!important;padding-right:1rem!important}
 body[data-vig-template="article"] .quick-answer{margin-top:2rem!important;margin-bottom:2.5rem!important}
 body[data-vig-template="article"] .quick-answer-header,body[data-vig-template="article"] .quick-answer-body{padding:1.1rem!important}
 body[data-vig-template="article"] .article>h2,body[data-vig-template="article"] .article section>h2{margin-top:2.8rem!important}
}

/* ============================================================
   V2.7 ARTICLE TYPOGRAPHY + CONTRAST CERTIFICATION
   User-reviewed correction: consistent readable type and explicit
   Quick Answer contrast on every article viewport.
   ============================================================ */
body[data-vig-template="article"]{
  font-family:'DM Sans',sans-serif;
  color:#202636;
  font-size:16px;
  line-height:1.75;
}
body[data-vig-template="article"] .article{
  max-width:1120px;
  color:#202636;
  line-height:1.82;
}
body[data-vig-template="article"] .article p,
body[data-vig-template="article"] .article li{
  font-family:'DM Sans',sans-serif;
  font-size:1.0625rem!important;
  line-height:1.82!important;
  color:#2d3442!important;
  letter-spacing:0;
}
body[data-vig-template="article"] .article p{margin-bottom:1.45rem!important}
body[data-vig-template="article"] .article h2{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.85rem,2.7vw,2.35rem)!important;
  line-height:1.18!important;
  font-weight:500!important;
  letter-spacing:-.015em;
  color:#0f1f38!important;
  margin-top:2.9rem!important;
  margin-bottom:1rem!important;
}
body[data-vig-template="article"] .article h3{
  font-family:'DM Sans',sans-serif;
  font-size:1.22rem!important;
  line-height:1.35!important;
  font-weight:700!important;
  color:#18263a!important;
  margin-top:2rem!important;
  margin-bottom:.8rem!important;
}
body[data-vig-template="article"] .article strong{color:#18263a}
body[data-vig-template="article"] .article a{font-weight:600;text-underline-offset:3px}

/* Quick Answer: explicit surface colors so no inherited theme can make it dark-on-dark. */
body[data-vig-template="article"] .quick-answer{
  background:#fff!important;
  border:1px solid rgba(184,156,106,.38)!important;
  border-radius:14px!important;
  box-shadow:0 14px 38px rgba(15,31,56,.11)!important;
}
body[data-vig-template="article"] .quick-answer-header{
  background:#0f1f38!important;
  border-bottom:2px solid #b89c6a!important;
  padding:1rem 1.5rem!important;
}
body[data-vig-template="article"] .quick-answer-header h2,
body[data-vig-template="article"] .quick-answer-header h3,
body[data-vig-template="article"] .quick-answer-header p{
  color:#fff!important;
  text-shadow:none!important;
}
body[data-vig-template="article"] .quick-answer-header h2{
  font-size:1.45rem!important;
  line-height:1.25!important;
  margin:0!important;
}
body[data-vig-template="article"] .quick-answer-body{
  background:#fff!important;
  color:#273142!important;
  padding:1.4rem 1.5rem 1.5rem!important;
}
body[data-vig-template="article"] .quick-answer-body p,
body[data-vig-template="article"] .quick-answer-body li,
body[data-vig-template="article"] .quick-answer-facts li{
  color:#273142!important;
  font-family:'DM Sans',sans-serif!important;
  font-size:1rem!important;
  line-height:1.7!important;
}
body[data-vig-template="article"] .quick-answer-body>p:first-child{
  color:#18263a!important;
  font-size:1.075rem!important;
  line-height:1.72!important;
  font-weight:500;
}
body[data-vig-template="article"] .quick-answer-facts-title{
  color:#6d5734!important;
  font-weight:700!important;
}
body[data-vig-template="article"] .quick-answer a{color:#173f70!important;font-weight:700!important}

/* Keep dark component copy light; keep light component copy dark. */
body[data-vig-template="article"] :is(.blog-final-cta,.cta-box,.blog-cta-block) :is(h2,h3,h4,p,li){color:#fff!important}
body[data-vig-template="article"] :is(.callout,.county-cta,.resource-card) :is(p,li){color:#303746!important}

@media(max-width:768px){
  body[data-vig-template="article"]{font-size:16px}
  body[data-vig-template="article"] .article p,
  body[data-vig-template="article"] .article li{font-size:1rem!important;line-height:1.78!important}
  body[data-vig-template="article"] .article h2{font-size:1.75rem!important;margin-top:2.4rem!important}
  body[data-vig-template="article"] .article h3{font-size:1.12rem!important}
  body[data-vig-template="article"] .quick-answer-header{padding:.95rem 1.1rem!important}
  body[data-vig-template="article"] .quick-answer-body{padding:1.15rem!important}
  body[data-vig-template="article"] .quick-answer-body p,
  body[data-vig-template="article"] .quick-answer-body li,
  body[data-vig-template="article"] .quick-answer-facts li{font-size:.98rem!important;line-height:1.68!important}
}

/* V2.9 — single centered final article CTA */
.vig-article-final-cta{width:100%;padding:clamp(3.5rem,7vw,6rem) 1.25rem;background:#f5f7f9;text-align:center;clear:both;}
.vig-article-final-cta__inner{width:min(820px,100%);margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center;}
.vig-article-final-cta__eyebrow{margin:0 0 .75rem!important;font-size:.8rem!important;line-height:1.2!important;font-weight:800!important;letter-spacing:.12em;text-transform:uppercase;color:#9a7744!important;}
.vig-article-final-cta h2{margin:0 auto 1rem!important;max-width:720px;text-align:center!important;color:#102a43!important;font-size:clamp(1.85rem,4vw,2.75rem)!important;line-height:1.12!important;}
.vig-article-final-cta__inner>p:not(.vig-article-final-cta__eyebrow){margin:0 auto 1.6rem!important;max-width:700px;text-align:center!important;color:#3f4f5f!important;font-size:1.08rem!important;line-height:1.75!important;}
.vig-article-final-cta__button{display:inline-flex;align-items:center;justify-content:center;margin:0 auto;padding:.95rem 1.45rem;border-radius:8px;background:#102a43;color:#fff!important;text-decoration:none!important;font-weight:800;line-height:1.2;}
@media(max-width:640px){.vig-article-final-cta{padding:3rem 1rem}.vig-article-final-cta__inner>p:not(.vig-article-final-cta__eyebrow){font-size:1rem!important}}