/*
Theme Name:   MZ Homes
Theme URI:    https://mzhomes.us
Author:       MZ Homes
Description:  Custom brokerage theme for MZ Homes (Mike Zwarg, Broker/Owner, CA DRE #01890233), built around the Trestle sync plugin as its listing data source. Replaces WP Residence.
Version:      1.37.36
Requires at least: 5.8
Requires PHP: 7.4
License:      GPL-2.0-or-later
Text Domain:  mzhomes
*/

/* =========================================================================
   TOKENS — ported from tokens/colors.css, typography.css, spacing.css,
   effects.css. Kept as CSS custom properties so template markup can stay
   close to the Claude Design source (which used the same variable names).
   ========================================================================= */
:root {
  color-scheme: light;

  /* Brand */
  --navy: #003B66;
  --navy-deep: #002B4A;

  /* Warm beige family */
  --sand: #E8DFD3;
  --camel: #C9AE8C;
  --taupe: #A08862;
  --brown: #6B563C;

  /* Neutrals */
  --off-white: #FAF7F2;
  --stone: #6F6C66;
  --charcoal: #262320;
  --white: #FFFFFF;

  /* Surfaces & lines */
  --paper: #FAF7F2;
  --surface-card: #FFFFFF;
  --surface-sand: #E8DFD3;
  --sand-2: #EFE8DC;
  --sand-3: #F3EDE4;
  --line: #E4DCCF;
  --line-strong: #D8CCB8;

  /* Text */
  --text-strong: #003B66;
  --text-body: #3A3733;
  --text-muted: #6F6C66;
  --text-on-navy: #FAF7F2;
  --text-on-navy-muted: rgba(250, 247, 242, .82);

  /* Accent */
  --accent: #C9AE8C;
  --accent-strong: #A08862;

  /* Semantic */
  --success: #1C5C3F;
  --success-soft: #EAF1EC;
  --success-line: #CBE0D2;
  --danger: #A6432B;
  --danger-soft: #FBEEE9;
  --danger-line: #E9CFC5;

  /* Fonts */
  --font-display: 'Newsreader', Georgia, 'Times New Roman', serif;
  --font-body: 'Archivo', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: ui-monospace, Menlo, Consolas, monospace;
  --font-monogram: 'Times New Roman', Times, serif;

  /* Spacing */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;
  --space-12: 48px; --space-14: 56px; --space-16: 64px; --space-20: 80px;
  --space-section: 110px;
  --maxw: 1200px;
  --gutter: 40px;

  /* Effects */
  --radius-sm: 6px; --radius-md: 8px; --radius-lg: 10px; --radius-xl: 12px;
  --radius-2xl: 14px; --radius-pill: 999px;
  --border: 1px solid var(--line);
  --border-on-navy: 1px solid rgba(201, 174, 140, .4);
  --shadow-sm: 0 2px 8px rgba(38, 35, 32, .06);
  --shadow-card: 0 12px 30px rgba(0, 0, 0, .10);
  --shadow-lift: 0 20px 50px rgba(0, 0, 0, .35);

  --header-height: 70px;
}

/* =========================================================================
   RESET / BASE
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--text-body);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
h1, h2, h3, h4 { font-family: var(--font-display); color: var(--text-strong); margin: 0; }
p { margin: 0; }
a { color: var(--navy); text-decoration: none; }
a:hover { color: var(--taupe); }
img { max-width: 100%; display: block; }
button, input, select, textarea { font-family: inherit; }
::selection { background: var(--camel); color: var(--navy); }
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(1px,1px,1px,1px); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999; background: var(--navy);
  color: var(--off-white); padding: 12px 20px; border-radius: 0 0 8px 0;
}
.skip-link:focus { left: 0; }

/* =========================================================================
   LAYOUT UTILITIES
   ========================================================================= */
.mzh-wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
.mzh-section { padding: 88px 40px; }
.mzh-section--tight { padding: 56px 40px; }

/* =========================================================================
   COMPONENTS — buttons, badges, cards, dividers, eyebrows, compliance line
   ========================================================================= */
.mzh-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--font-body); font-weight: 600; font-size: 14px; letter-spacing: .01em;
  line-height: 1; padding: 12px 24px; border-radius: var(--radius-sm);
  border: 1px solid transparent; cursor: pointer; text-decoration: none;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
  background: var(--navy); color: var(--off-white);
}
.mzh-btn:hover { background: var(--navy-deep); color: var(--off-white); transform: translateY(-1px); }
.mzh-btn--secondary { background: var(--camel); color: var(--navy); }
.mzh-btn--secondary:hover { background: var(--taupe); color: var(--navy); }
.mzh-btn--outline { background: transparent; color: var(--navy); border-color: var(--navy); }
.mzh-btn--outline:hover { background: var(--navy); color: var(--off-white); }
.mzh-btn--reverse { background: var(--off-white); color: var(--navy); }
.mzh-btn--reverse:hover { background: #fff; color: var(--navy); }
.mzh-btn--ghost-navy {
  background: transparent; color: var(--off-white); border: 1px solid rgba(201,174,140,.45);
}
.mzh-btn--ghost-navy:hover { border-color: var(--camel); background: rgba(201,174,140,.1); }
.mzh-btn--sm { padding: 8px 16px; font-size: 13px; }
.mzh-btn--block { width: 100%; }
.mzh-btn[disabled] { opacity: .5; cursor: not-allowed; }

.mzh-badge {
  display: inline-flex; align-items: center; font-family: var(--font-body);
  font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
  padding: 5px 12px; border-radius: var(--radius-pill); white-space: nowrap;
  background: var(--camel); color: var(--navy); border: 1px solid transparent;
}
.mzh-badge--navy { background: var(--navy); color: var(--camel); }
.mzh-badge--outline { background: rgba(250,247,242,.92); color: var(--navy); border-color: var(--line-strong); }

.mzh-card {
  background: var(--surface-card); border: var(--border); border-radius: var(--radius-xl);
  box-shadow: var(--shadow-card); padding: var(--space-6);
}
.mzh-card--flat { box-shadow: none; }
.mzh-card--navy { background: var(--navy); border: var(--border-on-navy); color: var(--off-white); }
.mzh-card--sand { background: var(--sand); border: 1px solid var(--line-strong); box-shadow: none; }

.mzh-divider { height: 2px; width: 64px; background: var(--camel); border: 0; margin: 10px 0 14px; }
.mzh-divider--full { height: 1px; width: 100%; background: var(--line); border: 0; }
.mzh-divider--center { margin-left: auto; margin-right: auto; }

.mzh-eyebrow {
  font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: .24em;
  text-transform: uppercase; color: var(--brown); margin: 0;
}
.mzh-eyebrow--camel { color: var(--camel); }
.mzh-eyebrow--stone { color: var(--stone); }

.mzh-monogram {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--navy); color: var(--off-white); border-radius: 22%;
  font-family: var(--font-monogram); font-weight: 700; line-height: 1; letter-spacing: .01em;
  user-select: none;
}

.mzh-compliance {
  display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-body);
  line-height: 1.4; color: var(--text-muted);
}
.mzh-compliance strong { color: var(--navy); font-weight: 600; }
.mzh-compliance--reverse { color: var(--text-on-navy-muted); }
.mzh-compliance--reverse strong { color: var(--off-white); }
.mzh-compliance .mzh-eho { display: inline-flex; height: 1.6em; width: auto; flex: none; opacity: .85; }

/* Listing attribution line — required wherever a listing appears (CRMLS 12.16.5) */
.mzh-attribution {
  /* CRMLS Rule 12.16.5 legibility requirement: attribution text must be at
     least as large and at least as dark as the property description text
     (.mzh-detail__desc). Per Mike (2026-08-23): keep these two font-sizes
     equal, always -- if you change one, change the other to match. Currently
     14px / var(--text-body), same as .mzh-detail__desc below. */
  font-family: var(--font-body); font-size: 14px; line-height: 1.5; color: var(--text-body);
}
.mzh-attribution--reverse { color: var(--off-white); }
.mzh-attribution strong { font-weight: 600; color: inherit; }

/* =========================================================================
   HEADER
   ========================================================================= */
.mzh-header {
  position: sticky; top: 0; z-index: 100;
  border-bottom: 1px solid var(--line);
}
.mzh-header::before {
  /* The frosted-glass background lives on this pseudo-element rather than
     directly on .mzh-header itself (theme v1.29.2) -- backdrop-filter on an
     ancestor makes it a containing block for any position:fixed descendant,
     which was squashing the mobile nav dropdown (position:fixed, inset
     anchored to var(--header-height)) down to the ~70px height of the
     header bar itself instead of the full phone screen, hiding most of the
     menu. Found via real mobile testing (Mike: "not able to see all
     section"), not visible in a desktop browser check. */
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: rgba(250,247,242,.93);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.mzh-header__inner {
  max-width: var(--maxw); margin: 0 auto; padding: 0 40px; height: var(--header-height);
  display: flex; align-items: center; justify-content: space-between;
}
.mzh-header__brand { display: flex; align-items: center; gap: 14px; }
.mzh-header__brand img { height: 42px; width: auto; }
.mzh-header__brand-rule { width: 1px; height: 26px; background: var(--line); }
.mzh-header__tagline {
  font-family: var(--font-body); font-size: 15px; font-weight: 600; letter-spacing: .22em;
  text-transform: uppercase; color: var(--brown); white-space: nowrap;
}
.mzh-nav { display: flex; align-items: center; gap: 30px; }
.mzh-nav__link {
  font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--charcoal);
  transition: color .15s;
}
.mzh-nav__link:hover, .mzh-nav__link.is-active { color: var(--taupe); }
.mzh-nav__cta {
  font-family: var(--font-body); font-size: 13px; font-weight: 600; letter-spacing: .03em;
  color: var(--off-white); background: var(--navy); padding: 10px 22px; border-radius: var(--radius-sm);
  transition: background .15s;
}
.mzh-nav__cta:hover { background: var(--navy-deep); color: var(--off-white); }
.mzh-nav__toggle {
  display: none; background: none; border: 0; cursor: pointer; padding: 8px;
}
.mzh-nav__toggle img { height: 22px; width: 22px; }

.mzh-nav__dropdown { position: relative; }
.mzh-nav__dropdown summary {
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer; list-style: none;
}
.mzh-nav__dropdown summary::-webkit-details-marker { display: none; }
.mzh-nav__dropdown summary svg { transition: transform .15s; flex-shrink: 0; }
.mzh-nav__dropdown[open] summary svg { transform: rotate(180deg); }
.mzh-nav__dropdown-menu {
  position: absolute; top: calc(100% + 14px); left: 0; min-width: 200px; background: #fff;
  border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-card);
  padding: 8px; display: flex; flex-direction: column; z-index: 10;
}
.mzh-nav__dropdown-menu a {
  font-family: var(--font-body); font-size: 14px; color: var(--charcoal); padding: 9px 12px; border-radius: 6px;
}
.mzh-nav__dropdown-menu a:hover { background: var(--off-white); color: var(--taupe); }
.mzh-nav__dropdown-viewall { font-weight: 600; color: var(--taupe); border-top: 1px solid var(--line); margin-top: 6px; padding-top: 12px !important; }

@media (max-width: 860px) {
  .mzh-nav__dropdown-menu {
    position: static; box-shadow: none; border: none; padding: 0 0 0 16px; margin-top: 4px;
  }
}

@media (max-width: 860px) {
  .mzh-header__inner { padding: 0 20px; }
  .mzh-header__brand { gap: 10px; }
  .mzh-header__brand img { height: 32px; }
  .mzh-header__brand-rule { height: 18px; }
  .mzh-header__tagline { font-size: 12px; letter-spacing: .12em; white-space: nowrap; }
  .mzh-nav { position: fixed; inset: var(--header-height) 0 0 0; background: var(--off-white);
    flex-direction: column; align-items: flex-start; gap: 0; padding: 12px 24px 24px;
    transform: translateY(-8px); opacity: 0; pointer-events: none; transition: all .18s ease;
    overflow-y: auto; }
  .mzh-nav.is-open { transform: translateY(0); opacity: 1; pointer-events: auto; }
  .mzh-nav__link { width: 100%; padding: 14px 0; border-bottom: 1px solid var(--line); }
  .mzh-nav__cta { width: 100%; text-align: center; margin-top: 16px; }
  .mzh-nav__toggle { display: inline-flex; }
}

/* =========================================================================
   FOOTER + CONTACT STRIP
   ========================================================================= */
.mzh-contact-strip { background: var(--navy); }
.mzh-contact-strip__inner {
  max-width: var(--maxw); margin: 0 auto; padding: 40px; display: flex;
  align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 24px;
}
.mzh-contact-strip__id { display: flex; align-items: center; gap: 20px; }
.mzh-contact-strip__logo { height: 64px; width: auto; flex-shrink: 0; }
.mzh-contact-strip__divider { width: 1px; align-self: stretch; background: rgba(201,174,140,.35); flex-shrink: 0; }
.mzh-contact-strip__id-text .name { font-family: var(--font-display); font-size: 24px; font-weight: 600; color: var(--off-white); }
.mzh-contact-strip__id-text .tagline { font-family: var(--font-body); font-size: 14px; color: rgba(250,247,242,.65); margin-top: 4px; }
.mzh-contact-strip__id-text .meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 10px; }
.mzh-contact-strip__id-text .meta span { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-body); font-size: 14px; color: rgba(250,247,242,.8); }
.mzh-contact-strip__id-text .meta img { height: 15px; width: 15px; }
.mzh-contact-strip__legal { margin-top: 12px; }
.mzh-contact-strip__actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }

.mzh-footer { background: var(--navy-deep); border-top: 1px solid rgba(201,174,140,.15); }
.mzh-footer__cols {
  max-width: var(--maxw); margin: 0 auto; padding: 56px 40px 36px;
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px;
}
.mzh-footer__col { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.mzh-footer__col--bordered { padding-left: 40px; border-left: 1px solid rgba(201,174,140,.18); }
.mzh-footer__col a {
  font-family: var(--font-body); font-size: 13px; color: rgba(250,247,242,.65); text-decoration: none;
}
.mzh-footer__col a:hover { color: var(--off-white); text-decoration: underline; }
.mzh-footer__col-head {
  font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--camel); margin-bottom: 4px;
}
.mzh-footer__about { font-family: var(--font-body); font-size: 13px; line-height: 1.7; color: rgba(250,247,242,.65); margin: 0; }
.mzh-footer__col-divider { width: 40px; height: 1px; background: rgba(201,174,140,.35); margin: 4px 0; }
.mzh-footer__contact-line { display: flex; align-items: center; gap: 10px; font-family: var(--font-body); font-size: 13px; color: rgba(250,247,242,.75); margin: 0; }
.mzh-footer__contact-line img { height: 15px; width: 15px; flex-shrink: 0; }
.mzh-footer__contact-line a { color: inherit; }
.mzh-footer__contact-line a:hover { color: var(--off-white); }
.mzh-footer__contact-line--no-icon { padding-left: 25px; }
.mzh-footer__eho { height: 22px; width: auto; opacity: .6; margin-top: 4px; }
.mzh-footer__social { display: flex; gap: 10px; margin-top: 2px; }
.mzh-footer__social a {
  display: flex; align-items: center; justify-content: center; width: 38px; height: 38px;
  border: 1px solid rgba(250,247,242,.4); border-radius: 50%; transition: border-color .15s, background .15s;
}
.mzh-footer__social a:hover { border-color: var(--camel); background: rgba(201,174,140,.12); }
.mzh-footer__social img { height: 16px; width: 16px; }
.mzh-footer__legal {
  max-width: var(--maxw); margin: 0 auto; padding: 0 40px 18px;
}
.mzh-footer__bottom {
  max-width: var(--maxw); margin: 0 auto; padding: 20px 40px; border-top: 1px solid rgba(201,174,140,.12);
  text-align: center;
}
.mzh-footer__copy { font-family: var(--font-body); font-size: 11px; color: rgba(250,247,242,.4); }
@media (max-width: 960px) { .mzh-footer__cols { grid-template-columns: 1fr 1fr; } .mzh-footer__col--bordered { padding-left: 0; border-left: 0; } }
@media (max-width: 560px) { .mzh-footer__cols { grid-template-columns: 1fr; gap: 32px; } }

.mzh-cookie-notice {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; background: var(--navy);
  padding: 16px 24px; display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap;
  box-shadow: 0 -4px 16px rgba(0,0,0,.2);
}
.mzh-cookie-notice[hidden] { display: none; }
.mzh-cookie-notice p {
  font-family: var(--font-body); font-size: 13px; line-height: 1.5; color: var(--text-on-navy-muted);
  max-width: 900px; margin: 0;
}
.mzh-cookie-notice p a { color: var(--camel); text-decoration: underline; }
.mzh-cookie-notice p a:hover { color: var(--off-white); }
.mzh-cookie-notice .mzh-btn { flex-shrink: 0; padding: 10px 22px; font-size: 13px; }

/* =========================================================================
   HOME — hero
   ========================================================================= */
.mzh-hero { position: relative; background: var(--navy); overflow: hidden; }
.mzh-hero__ring { position: absolute; border: 1px solid rgba(201,174,140,.1); border-radius: 50%; }
.mzh-hero__ring--a { right: -120px; top: -80px; width: 480px; height: 480px; }
.mzh-hero__ring--b { left: -60px; bottom: -120px; width: 320px; height: 320px; border-color: rgba(201,174,140,.07); }
.mzh-hero__inner {
  max-width: var(--maxw); margin: 0 auto; padding: 80px 40px 88px; display: grid;
  grid-template-columns: 1fr 380px; gap: 72px; align-items: center; position: relative; z-index: 2;
}
.mzh-hero__eyebrow { font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--camel); margin-bottom: 18px; }
.mzh-hero h1 { font-family: var(--font-display); font-weight: 500; font-size: 56px; line-height: 1.06; color: var(--off-white); letter-spacing: -.01em; }
.mzh-hero p { font-family: var(--font-body); font-size: 18px; line-height: 1.65; color: rgba(250,247,242,.78); margin-top: 22px; max-width: 48ch; }
.mzh-hero__actions { display: flex; gap: 14px; margin-top: 34px; flex-wrap: wrap; }
.mzh-hero__portrait { position: relative; }
.mzh-hero__portrait-frame { background: var(--sand); border-radius: var(--radius-2xl); padding: 28px 28px 0; }
.mzh-hero__portrait-frame img { width: 100%; height: auto; display: block; transform: scaleX(-1); }
.mzh-hero__portrait-card { margin-top: 16px; text-align: center; }
.mzh-hero__portrait-card .name { font-family: var(--font-display); font-weight: 600; font-size: 20px; color: var(--camel); }
.mzh-hero__portrait-card .role { font-family: var(--font-body); font-size: 12px; font-weight: 700; color: var(--stone); margin-top: 2px; }

@media (max-width: 900px) {
  .mzh-hero__inner { grid-template-columns: 1fr; gap: 40px; padding: 56px 24px 64px; }
  .mzh-hero__portrait { max-width: 320px; }
  .mzh-hero h1 { font-size: 40px; }
}

/* STATS BAR */
.mzh-stats { background: var(--navy-deep); }
.mzh-stats__grid { max-width: var(--maxw); margin: 0 auto; padding: 0 40px; display: grid; grid-template-columns: repeat(3,1fr); gap: 8px 36px; }
.mzh-stats__item { padding: 32px 0; text-align: center; }
.mzh-stats__value { font-family: var(--font-display); font-weight: 600; font-size: 38px; color: var(--off-white); }
.mzh-stats__label { font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--camel); margin-top: 4px; }
@media (max-width: 700px) {
  .mzh-stats__grid { grid-template-columns: 1fr; gap: 0; }
  .mzh-stats__item { padding: 22px 0; }
}

/* SECTION HEADINGS (shared pattern) */
.mzh-section-head { text-align: center; max-width: 640px; margin: 0 auto 56px; }
.mzh-section-head--left { text-align: left; margin: 0 0 56px; }
.mzh-section-head h2 { font-family: var(--font-display); font-weight: 600; font-size: 38px; line-height: 1.08; color: var(--navy); margin-top: 14px; }
.mzh-section-head p { font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: var(--stone); margin-top: 14px; }

/* SELLER SERVICES */
.mzh-services { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.mzh-services__grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
.mzh-service-card { background: var(--off-white); border: 1px solid var(--line); border-radius: var(--radius-2xl); padding: 36px; display: flex; gap: 20px; }
.mzh-service-card__icon { width: 44px; height: 44px; border-radius: var(--radius-lg); background: var(--navy); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mzh-service-card__step { font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--taupe); }
.mzh-service-card__title { font-family: var(--font-display); font-size: 22px; font-weight: 600; color: var(--navy); margin-top: 4px; }
.mzh-service-card__body { font-family: var(--font-body); font-size: 14px; line-height: 1.55; color: var(--stone); margin-top: 8px; }

.mzh-communities__region-head { font-family: var(--font-display); font-weight: 600; font-size: 22px; color: var(--navy); margin: 48px 0 20px; }
.mzh-communities__region-head:first-child { margin-top: 0; }
.mzh-communities__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media (max-width: 900px) { .mzh-communities__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .mzh-communities__grid { grid-template-columns: 1fr; } }
.mzh-community-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-xl); padding: 24px;
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.mzh-community-card:hover { border-color: var(--camel); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,59,102,.08); }
.mzh-community-card__name { font-family: var(--font-display); font-weight: 600; font-size: 20px; color: var(--navy); }
.mzh-community-card__stat { font-family: var(--font-body); font-size: 13px; color: var(--stone); margin-top: 6px; }
.mzh-community-card__link { display: block; font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--taupe); margin-top: 16px; }

.mzh-nearby-cities { display: flex; flex-wrap: wrap; gap: 10px; }
.mzh-nearby-cities__link {
  font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--navy);
  background: var(--off-white); border: 1px solid var(--line); border-radius: var(--radius-pill);
  padding: 8px 18px; transition: border-color .15s, color .15s;
}
.mzh-nearby-cities__link:hover { border-color: var(--camel); color: var(--taupe); }
@media (max-width: 780px) { .mzh-services__grid { grid-template-columns: 1fr; } }

/* ABOUT PREVIEW (home) / ABOUT PAGE */
.mzh-about-block { max-width: var(--maxw); margin: 0 auto; padding: 88px 40px; }
.mzh-about-block__grid { display: grid; grid-template-columns: 320px 1fr; gap: 56px; align-items: start; }
.mzh-about-block__photo { border-radius: var(--radius-2xl); overflow: hidden; border: 1px solid var(--line); aspect-ratio: 4/5; background: var(--sand); }
.mzh-about-block__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.mzh-about-block__photo-name { font-family: var(--font-display); font-weight: 600; font-size: 19px; color: var(--taupe); text-align: center; margin-top: 14px; }
.mzh-about-block h2 { font-family: var(--font-display); font-weight: 600; font-size: 38px; line-height: 1.08; color: var(--navy); }
.mzh-about-block__lede { font-family: var(--font-body); font-size: 17px; line-height: 1.65; color: var(--text-body); margin-top: 18px; max-width: 56ch; }
.mzh-about-block__body { font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: var(--stone); margin-top: 14px; max-width: 56ch; }
.mzh-about-block__stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--line); }
.mzh-about-block__stats .num { font-family: var(--font-display); font-weight: 600; font-size: 32px; color: var(--navy); }
.mzh-about-block__stats .label { font-family: var(--font-body); font-size: 12px; font-weight: 500; color: var(--stone); margin-top: 2px; }
@media (max-width: 820px) { .mzh-about-block__grid { grid-template-columns: 1fr; } .mzh-about-block__photo { max-width: 320px; } }

/* TESTIMONIALS */
.mzh-testimonials { background: var(--navy); }
.mzh-testimonials__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.mzh-testimonial { background: rgba(250,247,242,.06); border: 1px solid rgba(201,174,140,.2); border-radius: var(--radius-2xl); padding: 32px; display: flex; flex-direction: column; }
.mzh-testimonial__stars { display: flex; align-items: center; gap: 6px; margin-bottom: 12px; }
.mzh-testimonial__quote { font-family: var(--font-body); font-size: 15px; line-height: 1.6; color: rgba(250,247,242,.85); flex: 1; }
.mzh-testimonial__who { margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(201,174,140,.15); }
.mzh-testimonial__who .name { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--off-white); }
.mzh-testimonial__who .meta { font-family: var(--font-body); font-size: 12px; color: rgba(250,247,242,.55); margin-top: 2px; }
.mzh-testimonials__reviews { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 36px; flex-wrap: wrap; }
@media (max-width: 900px) { .mzh-testimonials__grid { grid-template-columns: 1fr; } }

/* CONSULT / VALUATION CTA */
.mzh-consult { max-width: var(--maxw); margin: 0 auto; padding: 88px 40px; }
.mzh-consult__panel { background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; display: grid; grid-template-columns: 1fr 1fr; }
.mzh-consult__copy { padding: 56px 48px; display: flex; flex-direction: column; justify-content: center; }
.mzh-consult__copy h2 { font-family: var(--font-display); font-weight: 600; font-size: 36px; line-height: 1.08; color: var(--navy); margin-top: 14px; }
.mzh-consult__copy p { font-family: var(--font-body); font-size: 15px; line-height: 1.6; color: var(--stone); margin-top: 14px; }
.mzh-consult__form { background: var(--camel); padding: 56px 48px; display: flex; flex-direction: column; gap: 18px; justify-content: center; }
@media (max-width: 820px) { .mzh-consult__panel { grid-template-columns: 1fr; } }

.mzh-checklist { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.mzh-checklist li {
  font-family: var(--font-body); font-size: 15px; color: var(--charcoal);
  display: flex; align-items: center; gap: 10px;
}
.mzh-checklist li::before {
  content: '\2713'; flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%;
  background: var(--camel); color: var(--navy); font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}

.mzh-consult__agent { margin-top: 18px; }
.mzh-consult__agent .name { font-family: var(--font-display); font-weight: 600; font-size: 18px; color: var(--navy); }
.mzh-consult__agent-logo { height: 32px; width: auto; margin-top: 6px; }
.mzh-consult__agent .tagline { font-family: var(--font-body); font-size: 13px; color: var(--stone); margin-top: 8px; }

.mzh-consult__form-heading {
  font-family: var(--font-display); font-weight: 600; font-size: 22px; color: var(--navy); margin: 0;
}
.mzh-consult__form-sub { font-family: var(--font-body); font-size: 14px; color: var(--charcoal); margin: 6px 0 4px; }
.mzh-consult__fineprint {
  /* charcoal, not stone -- this now sits on a camel background, and brand
     rules require navy/charcoal (not stone gray) text on camel/taupe accents */
  font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; color: var(--charcoal); text-align: center; margin: 0;
}

/* =========================================================================
   FORM FIELDS (shared: consult mini-form + contact page form)
   ========================================================================= */
.mzh-field { display: flex; flex-direction: column; gap: 6px; }
.mzh-field label { font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--brown); }
.mzh-field input, .mzh-field textarea, .mzh-field select {
  width: 100%; font-family: var(--font-body); font-size: 15px; padding: 12px 16px;
  border: 1px solid var(--line); border-radius: var(--radius-md); background: #fff; color: var(--charcoal);
  outline: none; transition: border-color .15s;
}
.mzh-field input:focus, .mzh-field textarea:focus, .mzh-field select:focus { border-color: var(--camel); }
.mzh-field textarea { resize: vertical; min-height: 120px; }
.mzh-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 500px) { .mzh-field-row { grid-template-columns: 1fr; } }
.mzh-form-note { font-family: var(--font-body); font-size: 12px; color: var(--charcoal); text-align: center; }
.mzh-form-note a { color: var(--navy); font-weight: 600; }
.mzh-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mzh-form-notice {
  font-family: var(--font-body); font-size: 14px; padding: 14px 18px; border-radius: var(--radius-md);
  margin-bottom: 24px; border: 1px solid;
}
.mzh-form-notice--success { background: var(--success-soft); border-color: var(--success-line); color: var(--success); }
.mzh-form-notice--error { background: var(--danger-soft); border-color: var(--danger-line); color: var(--danger); }

/* =========================================================================
   CONTACT PAGE
   ========================================================================= */
.mzh-contact-hero { background: var(--navy); padding: 64px 40px; text-align: center; }
.mzh-contact-hero h1 { font-family: var(--font-display); font-weight: 500; font-size: 44px; color: var(--off-white); }
.mzh-contact-hero p { font-family: var(--font-body); font-size: 16px; color: rgba(250,247,242,.72); margin: 10px auto 0; max-width: 52ch; }
.mzh-contact-layout { max-width: var(--maxw); margin: 0 auto; padding: 72px 40px; display: grid; grid-template-columns: 1fr 1.15fr; gap: 56px; align-items: start; }
.mzh-contact-info__item { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 24px; }
.mzh-contact-info__item img { height: 20px; width: 20px; margin-top: 3px; }
.mzh-contact-info__item .label { font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--taupe); }
.mzh-contact-info__item .value { font-family: var(--font-display); font-size: 19px; color: var(--navy); margin-top: 2px; }
.mzh-contact-form { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-2xl); padding: 40px; box-shadow: var(--shadow-card); display: flex; flex-direction: column; gap: 18px; }
@media (max-width: 900px) { .mzh-contact-layout { grid-template-columns: 1fr; } }

/* =========================================================================
   ABOUT PAGE extras
   ========================================================================= */
.mzh-page-hero { background: var(--navy); padding: 72px 40px 60px; }
.mzh-page-hero__inner { max-width: var(--maxw); margin: 0 auto; }
.mzh-page-hero h1 { font-family: var(--font-display); font-weight: 500; font-size: 46px; color: var(--off-white); margin-top: 10px; }
.mzh-page-hero p { font-family: var(--font-body); font-size: 16px; color: rgba(250,247,242,.75); margin-top: 12px; max-width: 60ch; }

/* =========================================================================
   REVIEWS PAGE
   ========================================================================= */
.mzh-reviews-hero { background: var(--navy); padding: 64px 40px; text-align: center; }
.mzh-reviews-hero__inner { max-width: var(--maxw); margin: 0 auto; }
.mzh-reviews-hero h1 { font-family: var(--font-display); font-weight: 500; font-size: 48px; line-height: 1.08; color: var(--off-white); margin-top: 14px; }
.mzh-reviews-hero p { font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: rgba(250,247,242,.7); margin: 14px auto 0; max-width: 48ch; }
.mzh-reviews-hero__rating { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 20px; }
.mzh-reviews-hero__rating .score { font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--off-white); margin-left: 6px; }
.mzh-reviews-hero__rating .on { font-family: var(--font-body); font-size: 13px; color: rgba(250,247,242,.55); margin-left: 2px; }

.mzh-reviews-list { max-width: 800px; margin: 0 auto; padding: 64px 40px; }
.mzh-reviews-source { padding: 32px 0 0; text-align: center; }
.mzh-reviews-source:first-child { padding-top: 0; }
.mzh-reviews-source a { display: inline-block; }
.mzh-reviews-source img { height: 150px; width: auto; }
.mzh-reviews-source__rule { height: 1px; background: var(--line); margin-top: 16px; }

.mzh-review { padding: 40px 0; border-bottom: 1px solid var(--line); }
.mzh-review__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; gap: 12px; flex-wrap: wrap; }
.mzh-review__name { font-family: var(--font-display); font-size: 18px; font-weight: 600; color: var(--navy); }
.mzh-review__meta { font-family: var(--font-body); font-size: 13px; color: var(--stone); margin-top: 2px; }
.mzh-review__stars { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.mzh-review__quote { font-family: var(--font-body); font-size: 16px; line-height: 1.7; color: var(--text-body); margin-top: 12px; }
.mzh-review__quote:first-of-type { margin-top: 0; }
.mzh-review__note { font-family: var(--font-body); font-size: 14px; line-height: 1.6; color: var(--stone); font-style: italic; margin-top: 12px; }

.mzh-reviews-links { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 48px 0; flex-wrap: wrap; }

.mzh-review-form-section { background: var(--sand); padding: 64px 40px; }
.mzh-review-form-section__inner { max-width: 640px; margin: 0 auto; text-align: center; }
.mzh-review-form-section h2 { font-family: var(--font-display); font-weight: 600; font-size: 32px; color: var(--navy); margin-top: 8px; }
.mzh-review-form-section__sub { font-family: var(--font-body); font-size: 15px; line-height: 1.6; color: var(--stone); margin: 12px auto 32px; max-width: 52ch; }
.mzh-review-form {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius-2xl); padding: 32px;
  box-shadow: var(--shadow-card); display: flex; flex-direction: column; gap: 18px; text-align: left;
}

.mzh-cta-banner { background: var(--navy); }
.mzh-cta-banner__inner { max-width: var(--maxw); margin: 0 auto; padding: 56px 40px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 24px; }
.mzh-cta-banner h2 { font-family: var(--font-display); font-weight: 600; font-size: 30px; color: var(--off-white); }
.mzh-cta-banner p { font-family: var(--font-body); font-size: 15px; color: rgba(250,247,242,.65); margin-top: 6px; }
.mzh-cta-banner__actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* PROSE — styles WP editor content (page body copy) in the brand's type
   system. Used by the City Homes for Sale landing page's intro/local-
   context section; safe to reuse anywhere else the_content() needs the
   same treatment. */
.mzh-prose { font-family: var(--font-body); font-size: 17px; line-height: 1.7; color: var(--text-body); max-width: 72ch; }
.mzh-prose > *:first-child { margin-top: 0; }
.mzh-prose p { margin: 0 0 20px; }
.mzh-prose h2 { font-family: var(--font-display); font-weight: 600; font-size: 28px; color: var(--navy); margin: 36px 0 14px; }
.mzh-prose h3 { font-family: var(--font-display); font-weight: 600; font-size: 22px; color: var(--navy); margin: 28px 0 12px; }
.mzh-prose ul, .mzh-prose ol { margin: 0 0 20px; padding-left: 22px; }
.mzh-prose li { margin-bottom: 8px; }
.mzh-prose a { text-decoration: underline; text-underline-offset: 2px; }
.mzh-prose strong { color: var(--navy); }
.mzh-prose .mzh-city-stat {
  font-family: var(--font-body); font-weight: 600; font-size: 17px; color: var(--taupe);
  padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid var(--line);
}

/* =========================================================================
   LISTINGS — search hero, filters, grid, cards, pagination, map
   ========================================================================= */
.mzh-search-hero { background: var(--navy); padding: 48px 40px 56px; }
.mzh-search-hero__inner { max-width: var(--maxw); margin: 0 auto; }
.mzh-search-hero__head { text-align: center; margin-bottom: 32px; }
.mzh-search-hero__head h1 { font-family: var(--font-display); font-weight: 500; font-size: 40px; line-height: 1.08; color: var(--off-white); }
.mzh-search-hero__head p { font-family: var(--font-body); font-size: 15px; color: rgba(250,247,242,.65); margin-top: 8px; }
.mzh-search-bar {
  background: #fff; border-radius: var(--radius-xl); padding: 6px; display: flex; align-items: center; gap: 6px;
  max-width: 800px; margin: 0 auto; box-shadow: 0 8px 32px rgba(0,43,74,.15);
}
.mzh-search-bar__field { flex: 1; display: flex; align-items: center; gap: 10px; padding: 0 16px; position: relative; }
.mzh-search-bar__field img { height: 18px; width: 18px; opacity: .55; }
.mzh-search-bar__field input { width: 100%; font-family: var(--font-body); font-size: 15px; padding: 12px 0; border: none; background: transparent; color: var(--charcoal); outline: none; }
.mzh-search-bar button { white-space: nowrap; }

.mzh-search-suggest {
  position: absolute; top: calc(100% + 10px); left: 0; right: 0; margin: 0; padding: 6px;
  list-style: none; background: #fff; border: 1px solid var(--line); border-radius: var(--radius-sm);
  box-shadow: 0 12px 28px rgba(0,43,74,.18); max-height: 320px; overflow-y: auto; z-index: 20;
}
.mzh-search-suggest li {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 6px;
  cursor: pointer; font-family: var(--font-body);
}
.mzh-search-suggest li:hover, .mzh-search-suggest li.is-active { background: var(--off-white); }
.mzh-search-suggest li .mzh-suggest-icon { width: 15px; height: 15px; flex-shrink: 0; opacity: .6; }
.mzh-search-suggest li .mzh-suggest-label { font-size: 14px; color: var(--charcoal); }
.mzh-search-suggest li .mzh-suggest-type {
  margin-left: auto; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--stone);
}

.mzh-filters { background: #fff; border-bottom: 1px solid var(--line); }
.mzh-filters__inner { max-width: var(--maxw); margin: 0 auto; padding: 16px 40px; display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.mzh-filter-group { display: flex; flex-direction: column; gap: 4px; }
.mzh-filter-group__label {
  font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .06em;
  text-transform: uppercase; color: var(--stone); text-align: center;
}
.mzh-filter-group__row { display: flex; gap: 6px; }
.mzh-filter-group__row select { width: 92px; padding-left: 12px; padding-right: 26px; }
.mzh-filters__status { display: flex; align-items: center; background: var(--off-white); border: 1px solid var(--line); border-radius: var(--radius-md); overflow: hidden; }
.mzh-filters__status button {
  font-family: var(--font-body); font-size: 12px; font-weight: 600; letter-spacing: .04em;
  padding: 10px 16px; border: none; background: transparent; color: var(--stone); cursor: pointer;
}
.mzh-filters__status button.is-active { background: var(--navy); color: var(--off-white); }
.mzh-filters select {
  font-family: var(--font-body); font-size: 13px; font-weight: 500; color: var(--charcoal);
  padding: 10px 32px 10px 14px; border: 1px solid var(--line); border-radius: var(--radius-md);
  background-color: var(--off-white); appearance: none; cursor: pointer;
  background-image: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 fill=%22%236F6C66%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22m6 9 6 6 6-6%22/%3E%3C/svg%3E');
  background-repeat: no-repeat; background-position: right 12px center;
}
.mzh-filters__sort { margin-left: auto; }
.mzh-filters__sort select {
  background-color: var(--navy); border-color: var(--navy); color: var(--off-white);
  background-image: url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 fill=%22%23FAF7F2%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22m6 9 6 6 6-6%22/%3E%3C/svg%3E');
}
.mzh-filters__sort select option { color: var(--charcoal); background-color: var(--off-white); }

.mzh-results-head { max-width: var(--maxw); margin: 0 auto; padding: 28px 40px 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.mzh-results-count { font-family: var(--font-body); font-size: 14px; color: var(--stone); }
.mzh-results-count strong { color: var(--navy); }
.mzh-results-toggle { display: flex; align-items: center; gap: 8px; }
.mzh-results-toggle button {
  width: 36px; height: 36px; border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--off-white); cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.mzh-results-toggle button.is-active { background: var(--navy); border-color: var(--navy); }

#mzh-map-panel { max-width: var(--maxw); margin: 20px auto 0; padding: 0 40px; display: none; }
#mzh-map-panel.is-open { display: block; }
#mzh-map-canvas { width: 100%; height: 480px; border-radius: var(--radius-2xl); border: 1px solid var(--line); }

.mzh-listing-grid { max-width: var(--maxw); margin: 0 auto; padding: 20px 40px 64px; }
.mzh-listing-grid__cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
@media (max-width: 980px) { .mzh-listing-grid__cards { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 660px) { .mzh-listing-grid__cards { grid-template-columns: 1fr; } }

.mzh-listing-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-2xl); overflow: hidden; transition: all .2s; }
.mzh-listing-card:hover { box-shadow: 0 12px 36px rgba(0,43,74,.1); transform: translateY(-3px); }
.mzh-listing-card__photo { height: 210px; position: relative; background: linear-gradient(135deg,#E3D9CB 0%,#EFE7DB 50%,#E3D9CB 100%); }
.mzh-listing-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.mzh-listing-card__badges { position: absolute; top: 14px; left: 14px; display: flex; gap: 6px; }
.mzh-listing-card__placeholder {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--taupe); background: rgba(250,247,242,.7); margin: auto; height: fit-content;
  padding: 6px 14px; border-radius: 4px;
}
.mzh-listing-card__body { padding: 20px; }
.mzh-listing-card__price { font-family: var(--font-display); font-size: 28px; font-weight: 600; color: var(--navy); line-height: 1.1; }
.mzh-listing-card__address { font-family: var(--font-body); font-size: 14px; color: var(--charcoal); margin-top: 4px; font-weight: 500; }
.mzh-listing-card__area { font-family: var(--font-body); font-size: 12px; color: var(--stone); margin-top: 2px; }
.mzh-listing-card__stats { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.mzh-listing-card__stat { display: flex; align-items: center; gap: 5px; }
.mzh-listing-card__stat img { width: 14px; height: 14px; }
.mzh-listing-card__stat b { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--charcoal); }
.mzh-listing-card__stat span { font-family: var(--font-body); font-size: 12px; color: var(--stone); }
.mzh-listing-card__attribution { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line); }

/* Sold Listings showcase card -- same base card, but not a link (no
   corresponding detail page exists for a Closed listing), so the hover
   lift/shadow that signals "clickable" is turned off. */
.mzh-listing-card--sold { cursor: default; }
.mzh-listing-card--sold:hover { box-shadow: none; transform: none; }
.mzh-listing-card__represented {
  display: inline-block; margin-top: 8px; padding: 3px 10px; border-radius: 4px;
  background: rgba(201,174,140,.18); color: var(--taupe);
  font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
}

.mzh-empty { max-width: var(--maxw); margin: 0 auto; padding: 60px 40px; text-align: center; color: var(--stone); font-family: var(--font-body); }

.mzh-fineprint { font-family: var(--font-body); font-size: 12px; font-weight: 500; line-height: 1.45; color: var(--stone); margin: 0 0 16px; }

.mzh-pagination { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 40px; }
.mzh-pagination a, .mzh-pagination span {
  font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--charcoal);
  background: var(--off-white); border: 1px solid var(--line); padding: 10px 14px; border-radius: var(--radius-sm);
}
.mzh-pagination a:hover { color: var(--navy); }
.mzh-pagination .is-current { color: var(--off-white); background: var(--navy); border-color: var(--navy); }
.mzh-pagination__ellipsis { background: transparent; border-color: transparent; color: var(--stone); padding: 10px 2px; }

/* =========================================================================
   LISTING DETAIL
   ========================================================================= */
.mzh-detail { max-width: var(--maxw); margin: 0 auto; padding: 32px 40px 80px; }
.mzh-detail__back { font-family: var(--font-body); font-size: 14px; font-weight: 500; color: var(--navy); margin-bottom: 18px; display: inline-flex; align-items: center; gap: 6px; }
.mzh-detail__gallery { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; margin-bottom: 28px; }
.mzh-detail__gallery-main { height: 420px; border-radius: var(--radius-xl); overflow: hidden; background: linear-gradient(135deg,#E3D9CB 0%,#EFE7DB 50%,#E3D9CB 100%); }
.mzh-detail__gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.mzh-detail__gallery-side { display: grid; grid-template-rows: 1fr 1fr; gap: 12px; }
.mzh-detail__gallery-side div { border-radius: var(--radius-xl); overflow: hidden; background: linear-gradient(135deg,#E3D9CB 0%,#EFE7DB 50%,#E3D9CB 100%); }
.mzh-detail__gallery-side img { width: 100%; height: 100%; object-fit: cover; }
.mzh-detail__gallery-more { position: relative; }
.mzh-detail__gallery-more::after {
  content: attr(data-more); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: rgba(0,43,74,.55); color: #fff; font-family: var(--font-body); font-weight: 600; font-size: 14px;
}
@media (max-width: 800px) { .mzh-detail__gallery { grid-template-columns: 1fr; } .mzh-detail__gallery-side { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; } }
.mzh-detail__gallery-main[data-lightbox-index], .mzh-detail__gallery-side [data-lightbox-index] { cursor: pointer; }

.mzh-lightbox {
  position: fixed; inset: 0; z-index: 1000; background: rgba(0,43,74,.94);
  display: flex; align-items: center; justify-content: center;
}
.mzh-lightbox[hidden] { display: none; }
.mzh-lightbox__image { max-width: 88vw; max-height: 84vh; object-fit: contain; border-radius: var(--radius-md); }
.mzh-lightbox__close {
  position: absolute; top: 20px; right: 24px; background: transparent; border: 0; color: var(--off-white);
  font-size: 34px; line-height: 1; cursor: pointer; padding: 6px 10px;
}
.mzh-lightbox__close:hover { color: var(--camel); }
.mzh-lightbox__nav {
  position: absolute; top: 50%; transform: translateY(-50%); background: rgba(250,247,242,.12);
  border: 1px solid rgba(201,174,140,.4); color: var(--off-white); width: 48px; height: 48px; border-radius: 50%;
  font-size: 20px; cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.mzh-lightbox__nav:hover { background: rgba(201,174,140,.25); }
.mzh-lightbox__nav--prev { left: 20px; }
.mzh-lightbox__nav--next { right: 20px; }
.mzh-lightbox__count {
  position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); color: var(--off-white);
  font-family: var(--font-body); font-size: 13px; letter-spacing: .04em;
}
@media (max-width: 640px) { .mzh-lightbox__nav { width: 40px; height: 40px; } }

.mzh-detail__layout { display: grid; grid-template-columns: 1.6fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 900px) { .mzh-detail__layout { grid-template-columns: 1fr; } }
.mzh-detail__status-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mzh-detail__address-row { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.mzh-detail h1 { font-family: var(--font-display); font-weight: 600; font-size: 38px; color: var(--navy); margin-top: 12px; }
.mzh-detail__address-link { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.mzh-detail__address-link:hover { text-decoration: underline; }
.mzh-detail__address-pin { width: 26px; height: 26px; flex-shrink: 0; }
.mzh-detail__locale-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.mzh-detail__locale { font-family: var(--font-body); font-size: 18px; color: var(--stone); }
.mzh-detail__county-inline { font-family: var(--font-body); font-size: 18px; color: var(--stone); padding-left: 10px; border-left: 1px solid var(--line); }
.mzh-detail__city-link { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--taupe); margin-top: 10px; }
.mzh-detail__city-link:hover { color: var(--navy); }
.mzh-detail__type-inline { display: flex; align-items: center; gap: 6px; font-family: var(--font-body); font-size: 18px; color: var(--navy); }
.mzh-detail__type-inline::before { content: '·'; margin-right: 4px; color: var(--stone); }
.mzh-detail__type-icon { width: 16px; height: 16px; flex-shrink: 0; }
.mzh-detail__stats { display: flex; gap: 34px; flex-wrap: wrap; margin: 20px 0; padding: 18px 0; border-top: 2px solid var(--line); border-bottom: 2px solid var(--line); }
.mzh-detail__stat { display: flex; align-items: center; gap: 10px; }
.mzh-detail__stat-icon { width: 22px; height: 22px; flex-shrink: 0; }
.mzh-detail__stat .n { font-family: var(--font-display); font-size: 20px; font-weight: 600; color: var(--navy); }
.mzh-detail__stat .n.accent { color: var(--brown); }
.mzh-detail__stat .l { font-family: var(--font-body); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--stone); }
.mzh-detail__price-stat { margin-left: auto; }
.mzh-detail__price-stat .n { font-size: 25px; }
/* Keep in sync with .mzh-attribution above -- CRMLS 12.16.5 requires
   attribution to be at least as large/dark as this description text. */
.mzh-detail__desc { font-family: var(--font-body); font-size: 14px; line-height: 1.7; color: var(--text-body); max-width: 68ch; white-space: pre-line; }
.mzh-detail__desc-toggle {
  display: block; margin-top: 8px; padding: 0; border: 0; background: none; cursor: pointer;
  font-family: var(--font-body); font-size: 14px; font-weight: 600; color: var(--brown); text-decoration: underline;
}
.mzh-detail__desc-toggle:hover { color: var(--navy); }
.mzh-detail__facts { display: flex; flex-direction: column; gap: 16px; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); max-width: 68ch; }
.mzh-detail__facts-row { display: flex; gap: 40px; flex-wrap: wrap; }
.mzh-detail__facts .num { font-family: var(--font-display); font-size: 20px; font-weight: 600; color: var(--navy); }
.mzh-detail__facts .lbl { font-family: var(--font-body); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--stone); margin-top: 2px; }

.mzh-agent-card__head { display: flex; align-items: center; gap: 14px; }
.mzh-agent-card__logo { width: 150px; height: 150px; margin-left: auto; flex-shrink: 0; }
.mzh-agent-card .name { font-family: var(--font-display); font-size: 20px; font-weight: 600; color: var(--off-white); }
.mzh-agent-card .role { font-family: var(--font-body); font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--camel); }
.mzh-agent-card__contact { font-family: var(--font-body); font-size: 14px; line-height: 1.7; color: var(--text-on-navy-muted); margin-top: 10px; }
.mzh-agent-card__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.mzh-agent-card__compliance { margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(201,174,140,.35); }

.mzh-detail__facts2 { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--line); max-width: 68ch; }
.mzh-detail__facts2 h3 { font-family: var(--font-display); font-size: 22px; color: var(--navy); margin: 0 0 18px; }
.mzh-facts2__section { border: 1px solid var(--line); border-radius: var(--radius-lg); margin-bottom: 16px; overflow: hidden; }
.mzh-facts2__section-head { font-family: var(--font-body); font-weight: 600; font-size: 14px; color: var(--charcoal); background: var(--sand); padding: 12px 18px; }
.mzh-facts2__groups { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px 32px; padding: 18px; }
.mzh-facts2__group-head { font-family: var(--font-body); font-weight: 600; font-size: 13px; color: var(--navy); margin-bottom: 8px; }
.mzh-facts2__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.mzh-facts2__list li { font-family: var(--font-body); font-size: 14px; line-height: 1.5; color: var(--text-body); }
@media (max-width: 640px) { .mzh-facts2__groups { grid-template-columns: 1fr; } }

.mzh-idx-disclaimer {
  font-family: var(--font-body); font-size: 12px; line-height: 1.5; color: var(--stone);
  margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--line);
}

.mzh-detail__map-section { margin-top: 40px; }

.mzh-showing-modal {
  position: fixed; inset: 0; z-index: 1000; background: rgba(0,43,74,.75);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.mzh-showing-modal[hidden] { display: none; }
.mzh-showing-modal__card {
  background: var(--off-white); border-radius: var(--radius-xl); padding: 32px;
  max-width: 760px; width: 100%; max-height: 90vh; overflow-y: auto; position: relative;
}
.mzh-showing-modal__card h3 { font-family: var(--font-display); font-size: 24px; color: var(--navy); margin: 0 0 20px; padding-right: 30px; }
.mzh-showing-modal__close {
  position: absolute; top: 16px; right: 16px; background: transparent; border: 0; color: var(--stone);
  font-size: 28px; line-height: 1; cursor: pointer; padding: 4px 8px;
}
.mzh-showing-modal__close:hover { color: var(--navy); }
.mzh-ask-modal__addr { font-family: var(--font-body); font-size: 14px; color: var(--stone); margin: -12px 0 20px; }
.mzh-ask-form { display: flex; flex-direction: column; gap: 16px; }
.mzh-ask-form__note { font-family: var(--font-body); font-size: 12px; color: var(--stone); margin: 0; }
.mzh-detail__map-section h3 { font-family: var(--font-display); font-size: 22px; color: var(--navy); margin-bottom: 12px; }
#mzh-detail-map-canvas { width: 100%; height: 360px; border-radius: var(--radius-xl); border: 1px solid var(--line); }

.mzh-detail__attribution-box {
  margin-top: 40px; padding: 20px 24px; background: var(--off-white); border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}

/* Trestle API note (dev-facing placeholder, only shown when no listings synced yet) */
.mzh-api-note { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.mzh-api-note__inner { max-width: 800px; margin: 0 auto; padding: 48px 40px; text-align: center; }
.mzh-api-note__icon { width: 48px; height: 48px; border-radius: var(--radius-lg); background: var(--navy); display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; }
.mzh-api-note h3 { font-family: var(--font-display); font-weight: 600; font-size: 24px; color: var(--navy); }
.mzh-api-note p { font-family: var(--font-body); font-size: 15px; line-height: 1.6; color: var(--stone); margin-top: 10px; max-width: 56ch; margin-left: auto; margin-right: auto; }

/* Custom Google Maps InfoWindow content (attribution required in popups) */
.mzh-map-popup { font-family: var(--font-body); min-width: 200px; }
.mzh-map-popup .price { font-family: var(--font-display); font-size: 18px; font-weight: 600; color: var(--navy); }
.mzh-map-popup .addr { font-size: 13px; color: var(--charcoal); margin-top: 2px; }
.mzh-map-popup .attribution { font-size: 13px; color: var(--charcoal); margin-top: 8px; border-top: 1px solid var(--line); padding-top: 6px; }
.mzh-map-popup a.view { display: inline-block; margin-top: 8px; font-size: 12px; font-weight: 600; color: var(--navy); }

/* Google Places Autocomplete dropdown -- injected at the document body root
   by Google's own script, so it needs an explicit z-index above the sticky
   header (z-index 100) or it can render underneath it. */
.pac-container { z-index: 1001; font-family: var(--font-body); }

/* ---------- Market Report (template-market-report.php) ---------- */
.mzh-market-lede { font-family: var(--font-display); font-weight: 400; font-size: 22px; line-height: 1.4; color: var(--off-white); margin-top: 14px; max-width: 60ch; }
.mzh-market-updated { font-family: var(--font-body); font-size: 13px; color: rgba(250,247,242,.6); margin-top: 10px; }
.mzh-market-h2 { font-family: var(--font-display); font-weight: 600; font-size: 30px; color: var(--navy); margin: 0 0 20px; }
.mzh-market-h3 { font-family: var(--font-body); font-weight: 600; font-size: 15px; letter-spacing: .04em; text-transform: uppercase; color: var(--stone); margin: 0 0 14px; }
.mzh-market-sub { font-family: var(--font-body); font-size: 17px; line-height: 1.6; color: var(--text-body); max-width: 68ch; margin: 0 0 24px; }

.mzh-market-band { background: var(--navy); }
.mzh-market-band__grid { max-width: var(--maxw); margin: 0 auto; padding: 0 40px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px 36px; }
.mzh-market-band__item { padding: 30px 0; }
.mzh-market-band__value { font-family: var(--font-display); font-weight: 600; font-size: 38px; line-height: 1.05; color: var(--off-white); }
.mzh-market-band__value--accent { color: var(--camel); }
.mzh-market-band__value--down { color: #E4B7A8; }
.mzh-market-band__label { font-family: var(--font-body); font-size: 13px; color: rgba(250,247,242,.72); margin-top: 6px; }

.mzh-market-chart { overflow-x: auto; padding-bottom: 4px; }
.mzh-market-cols { display: flex; align-items: flex-end; gap: 6px; min-width: 560px; }
.mzh-market-col { flex: 1 1 0; min-width: 34px; display: flex; flex-direction: column; align-items: center; }
.mzh-market-barbox { width: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
.mzh-market-col__val { font-family: var(--font-body); font-size: 11px; font-weight: 600; color: var(--navy); margin-bottom: 4px; white-space: nowrap; }
.mzh-market-col__bar { width: 66%; max-width: 40px; background: var(--camel); border-radius: 4px 4px 0 0; min-height: 3px; transition: background .15s; }
.mzh-market-col__bar.is-last { background: var(--navy); }
.mzh-market-col:hover .mzh-market-col__bar { background: var(--taupe); }
.mzh-market-col:hover .mzh-market-col__bar.is-last { background: var(--navy-deep); }
.mzh-market-col__m { font-family: var(--font-body); font-size: 11px; color: var(--stone); margin-top: 8px; text-align: center; line-height: 1.3; white-space: nowrap; }
.mzh-market-col__y { font-size: 10px; color: var(--taupe); font-weight: 600; margin-left: 3px; }
.mzh-market-chart__note { font-family: var(--font-body); font-size: 13px; color: var(--stone); margin: 14px 0 0; max-width: 70ch; }

.mzh-market-pace { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.mzh-market-pace__card { background: var(--white); border: var(--border); border-radius: var(--radius-lg); padding: 22px 22px 24px; }
.mzh-market-pace__num { font-family: var(--font-display); font-weight: 600; font-size: 34px; line-height: 1.05; color: var(--navy); }
.mzh-market-pace__label { font-family: var(--font-body); font-size: 13px; color: var(--stone); margin-top: 10px; line-height: 1.4; }
@media (max-width: 780px) { .mzh-market-pace { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 440px) { .mzh-market-pace { grid-template-columns: 1fr; } }

.mzh-market-split { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-bottom: 24px; }
.mzh-market-hbar { display: grid; grid-template-columns: 110px 1fr 44px; align-items: center; gap: 12px; margin-bottom: 10px; }
.mzh-market-hbar__label { font-family: var(--font-body); font-size: 13px; color: var(--text-body); }
.mzh-market-hbar__track { background: var(--surface-sand); border-radius: 3px; height: 14px; overflow: hidden; }
.mzh-market-hbar__fill { display: block; height: 100%; background: var(--taupe); border-radius: 3px; min-width: 2px; }
.mzh-market-hbar__n { font-family: var(--font-body); font-size: 13px; font-weight: 600; color: var(--navy); text-align: right; }
.mzh-market-cta-line { margin-top: 8px; }

.mzh-market-faq__item { border-top: 1px solid var(--line); padding: 20px 0; }
.mzh-market-faq__item:last-child { border-bottom: 1px solid var(--line); }
.mzh-market-faq__item h3 { font-family: var(--font-display); font-weight: 600; font-size: 20px; color: var(--navy); margin: 0 0 8px; }
.mzh-market-faq__item p { font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: var(--text-body); margin: 0; max-width: 72ch; }

@media (max-width: 860px) {
  .mzh-market-band__grid { grid-template-columns: repeat(2, 1fr); gap: 4px 28px; }
  .mzh-market-band__value { font-size: 32px; }
  .mzh-market-split { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 480px) {
  .mzh-market-band__grid { grid-template-columns: 1fr; padding: 0 24px; gap: 0; }
  .mzh-market-band__item { padding: 18px 0; }
  .mzh-market-hbar { grid-template-columns: 90px 1fr 38px; }
}

/* Utility */
.mzh-visually-center { text-align: center; }
