/* =============================================================
   HomePro Properties — theme.css v2
   Logo palette: orange / charcoal / warm cream / black
   Editorial typography, asymmetric rhythm, premium real estate
   ============================================================= */

/* ---------- Override WP global block gap so sections sit flush ---------- */
.wp-site-blocks > *,
:where(.wp-site-blocks) > *,
:where(.is-layout-flow) > *,
:where(.is-layout-constrained) > * {
	margin-block-start: 0;
	margin-block-end: 0;
}
.wp-site-blocks { --wp--style--block-gap: 0; }

:root {
  /* Brand — pulled from the logo */
  --orange:       #E26A2C;
  --orange-hot:   #C1501A;
  --orange-soft:  #F8DCC4;
  --orange-tint:  #FBEEDF;

  --ink:          #0F1012;     /* near-black */
  --ink-2:        #1C1E21;
  --ink-soft:     #2A2D32;

  --paper:        #FAF7F2;     /* warm cream */
  --bone:         #F1ECE3;
  --sand:         #E8E1D3;
  --white:        #FFFFFF;

  /* Type */
  --text:         #3F4248;
  --muted:        #74787F;
  --line:         rgba(15, 16, 18, 0.09);
  --line-strong:  rgba(15, 16, 18, 0.18);

  /* Back-compat aliases */
  --navy:         var(--ink);
  --navy-deep:    #000;
  --navy-soft:    var(--ink-2);
  --accent:       var(--orange);
  --accent-hot:   var(--orange-hot);
  --accent-soft:  var(--orange-soft);
  --ivory:        var(--paper);

  --on-dark:        #F4EFE6;
  --on-dark-muted:  rgba(244, 239, 230, 0.68);
  --on-dark-line:   rgba(244, 239, 230, 0.14);

  /* Shape + motion */
  --radius-xs: 4px; --radius-sm: 6px; --radius-md: 10px;
  --radius-lg: 18px; --radius-xl: 28px;
  --shadow-sm: 0 1px 2px rgba(15,16,18,.05), 0 6px 18px rgba(15,16,18,.04);
  --shadow-md: 0 2px 6px rgba(15,16,18,.06), 0 22px 50px rgba(15,16,18,.10);
  --shadow-lg: 0 36px 80px rgba(15,16,18,.18);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --header-h: 84px;

  /* Type — display: editorial serif; body: tight grotesque */
  --font-display: 'Fraunces', 'Playfair Display', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, Menlo, monospace;

  --section-pad-y: clamp(44px, 4.5vw, 64px);
  --container: 1280px;
  --container-narrow: 1080px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.62;
  color: var(--text);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; transition: color .22s var(--ease); }
a:hover { color: var(--orange); }
button { font-family: inherit; cursor: pointer; }
p { margin: 0 0 1rem; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }
::selection { background: var(--orange); color: var(--white); }

/* ---------- Typography ---------- */
h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -0.025em;
  margin: 0 0 .5em;
  color: var(--ink);
  font-variation-settings: 'opsz' 96, 'SOFT' 30;
}
h1 { font-size: clamp(2.8rem, 6.4vw, 6rem); letter-spacing: -0.035em; }
h2 { font-size: clamp(2.1rem, 4.2vw, 3.6rem); letter-spacing: -0.028em; }
h3 { font-size: clamp(1.3rem, 1.8vw, 1.55rem); font-weight: 500; letter-spacing: -0.012em; line-height: 1.2; }
h4 { font-size: 1.05rem; letter-spacing: -0.005em; font-weight: 600; font-family: var(--font-body); line-height: 1.3; }

em, .italic-display { font-style: italic; font-family: var(--font-display); font-variation-settings: 'opsz' 144, 'SOFT' 100; }

.eyebrow {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--orange-hot);
  margin: 0 0 1.4rem;
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.eyebrow.on-dark { color: var(--orange); }
.eyebrow::before {
  content: '';
  width: 24px;
  height: 1px;
  background: currentColor;
  display: inline-block;
}
.lead {
  font-size: 1.15rem;
  line-height: 1.55;
  color: var(--ink-soft);
  max-width: 60ch;
  font-weight: 400;
}
.section.navy .lead, .lead.on-dark { color: var(--on-dark-muted); }

/* ---------- Layout ---------- */
.container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
}
@media (max-width: 720px) { .container { padding: 0 22px; } }
.container.narrow { max-width: var(--container-narrow); }
.section { padding: var(--section-pad-y) 0; position: relative; }
.section.tight { padding: clamp(56px, 7vw, 96px) 0; }
.section.ivory  { background: var(--paper); }
.section.bone   { background: var(--bone); }
.section.white  { background: var(--white); }
.section.navy   { background: var(--ink); color: var(--on-dark); }
.section.navy h1, .section.navy h2, .section.navy h3, .section.navy h4 { color: var(--on-dark); }
.section.navy p { color: var(--on-dark-muted); }
.section.navy a:hover { color: var(--orange); }

.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 72px;
  flex-wrap: wrap;
}
.section-head__index {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--muted);
  display: flex; gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.section-head__index::after { content:''; height:1px; width:48px; background:var(--line-strong); }
.section.navy .section-head__index { color: var(--on-dark-muted); }
.section.navy .section-head__index::after { background: var(--on-dark-line); }
.section-head .lead { margin-top: 16px; }
.section-head__main { max-width: 740px; }
.section-head__link {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ink);
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 6px;
  transition: gap .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease);
}
.section.navy .section-head__link { color: var(--on-dark); border-color: var(--on-dark-line); }
.section-head__link:hover { gap: 16px; color: var(--orange-hot); border-color: var(--orange-hot); }
.section.navy .section-head__link:hover { color: var(--orange); border-color: var(--orange); }

.grid { display: grid; gap: 28px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 960px) { .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 0.92rem;
  letter-spacing: 0.005em;
  padding: 15px 28px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: transform .25s var(--ease), background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
  white-space: nowrap;
}
.btn-primary {
  background: var(--orange);
  color: var(--white);
  font-weight: 600;
}
.btn-primary:hover {
  background: var(--orange-hot);
  transform: translateY(-1px);
  box-shadow: 0 16px 36px rgba(226,106,44,0.28);
}
.btn-compact {
  padding: 9px 22px;
  font-size: 0.86rem;
  border-radius: 10px;
}
.btn-dark { background: var(--ink); color: var(--white); }
.btn-dark:hover { background: var(--ink-2); transform: translateY(-1px); color: var(--white); }
.btn-outline { border-color: var(--line-strong); color: var(--ink); }
.btn-outline:hover { border-color: var(--ink); background: var(--ink); color: var(--white); }
.btn-ghost-light { border-color: rgba(255,255,255,0.4); color: var(--white); }
.btn-ghost-light:hover { background: var(--white); color: var(--ink); border-color: var(--white); }

.btn-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }

/* ---------- Header ---------- */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  height: var(--header-h);
  display: flex;
  align-items: center;
  background: rgba(15, 16, 18, 0.62);
  backdrop-filter: saturate(160%) blur(18px);
  -webkit-backdrop-filter: saturate(160%) blur(18px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: background .3s var(--ease), height .3s var(--ease), border-color .3s var(--ease);
}
.site-header.scrolled { background: rgba(15, 16, 18, 0.94); height: 72px; }
.site-header__inner {
  max-width: var(--container);
  width: 100%;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}
@media (max-width: 720px) { .site-header__inner { padding: 0 20px; } }

.site-header__logo {
  display: flex; align-items: center;
  flex-shrink: 0;
  transition: opacity .2s var(--ease);
}
.site-header__logo:hover { opacity: 0.85; }
.site-header__logo img { height: 52px; width: auto; display: block; }
.site-header.scrolled .site-header__logo img { height: 44px; transition: height .3s var(--ease); }

.primary-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0 auto;
  flex: 1;
  justify-content: center;
  flex-wrap: nowrap;
}
.nav-item, .primary-nav__list .menu-item { position: relative; list-style: none; }
.primary-nav__list { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.primary-nav__list a, .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 15px;
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.005em;
  color: rgba(255,255,255,0.85);
  border-radius: 999px;
  cursor: pointer;
  transition: color .2s var(--ease), background .2s var(--ease);
  background: transparent;
  border: 0;
  font-family: inherit;
  white-space: nowrap;
}
.nav-link:hover, .nav-link.active, .primary-nav__list a:hover, .primary-nav__list .current-menu-item > a { color: var(--orange); background: rgba(255,255,255,0.05); }
.nav-link svg { width: 9px; height: 9px; opacity: 0.7; transition: transform .2s var(--ease); }
.nav-item.open .nav-link svg, .nav-item:hover .nav-link svg { transform: rotate(180deg); }

.nav-dropdown,
.primary-nav__list .sub-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  min-width: 240px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 14px 8px 8px;
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
  list-style: none;
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s var(--ease), transform .25s var(--ease);
  z-index: 60;
}
/* Invisible bridge so the cursor can travel from menu item to dropdown without losing hover */
.primary-nav__list .menu-item-has-children::after,
.nav-item.has-children::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 14px;
  pointer-events: auto;
}
.nav-item:hover .nav-dropdown,
.nav-item.open .nav-dropdown,
.primary-nav__list .menu-item-has-children:hover > .sub-menu,
.primary-nav__list .menu-item-has-children:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown a,
.primary-nav__list .sub-menu a {
  display: block;
  padding: 9px 14px;
  font-size: 0.84rem;
  color: var(--ink);
  border-radius: 6px;
  font-weight: 500;
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.nav-dropdown a:hover,
.primary-nav__list .sub-menu a:hover { background: var(--paper); color: var(--orange-hot); }
.primary-nav__list .sub-menu .menu-item { display: block; position: static; }

.header-cta {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 24px;
  border-radius: 999px;
  background: var(--orange);
  color: var(--white);
  font-weight: 600;
  font-size: 0.82rem;
  flex-shrink: 0;
  white-space: nowrap;
  transition: background .2s var(--ease), transform .2s var(--ease);
}
.header-cta:hover { background: var(--white); color: var(--ink); }
.header-cta svg { width: 13px; height: 13px; }

.hamburger {
  display: none;
  width: 40px; height: 40px;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 8px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
}
.hamburger span {
  display: block;
  width: 16px; height: 1.5px;
  background: var(--white);
  transition: transform .3s var(--ease), opacity .3s var(--ease);
}
.hamburger.open span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

@media (max-width: 900px) {
  .primary-nav, .header-cta { display: none; }
  .hamburger { display: flex; }
}

/* Mobile drawer — fixed sizing for usability */
.mobile-drawer {
  position: fixed;
  inset: var(--header-h) 0 0 0;
  width: auto;
  max-width: none !important;
  margin: 0 !important;
  background: var(--ink);
  z-index: 49;
  transform: translateX(100%);
  transition: transform .35s var(--ease);
  overflow-y: auto;
  padding: 16px 24px 32px;
}
.mobile-drawer__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mobile-drawer__list a {
  display: block;
  padding: 14px 0;
  color: var(--white);
  font-size: 1rem;
  font-weight: 500;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.mobile-drawer__list .sub-menu {
  list-style: none;
  margin: 0;
  padding: 4px 0 8px 16px;
}
.mobile-drawer__list .sub-menu a {
  font-size: 0.92rem;
  color: rgba(255,255,255,0.7);
  border-bottom: 0;
  padding: 8px 0;
}
.mobile-drawer.open { transform: translateX(0); }
.mobile-drawer-section { border-bottom: 1px solid rgba(255,255,255,0.07); }
.mobile-drawer-section__head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 14px 0;
  background: transparent;
  border: 0;
  color: var(--white);
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: -0.005em;
  text-align: left;
  cursor: pointer;
}
.mobile-drawer-section__head svg { width: 11px; height: 11px; transition: transform .25s var(--ease); }
button.mobile-drawer-section__head { width: 100%; background: none; border: 0; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.mobile-drawer-section.open .mobile-drawer-section__head svg { transform: rotate(180deg); }
.mobile-drawer-section__body {
  display: none;
  padding: 0 0 12px;
}
.mobile-drawer-section.open .mobile-drawer-section__body { display: block; }
.mobile-drawer-section__body a {
  display: block;
  padding: 8px 0 8px 18px;
  color: rgba(255,255,255,0.7);
  font-size: 0.92rem;
  border-left: 1px solid rgba(255,255,255,0.1);
}
.mobile-drawer-section__body a:hover { color: var(--orange); border-color: var(--orange); }
.mobile-drawer .header-cta { display: inline-flex; margin-top: 28px; padding: 12px 22px; font-size: 0.9rem; }

/* ---------- Hero (homepage) ---------- */
.hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  color: var(--on-dark);
  display: flex;
  align-items: center;
  overflow: hidden;
  isolation: isolate;
  background: var(--ink);
}
.hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg, rgba(15,16,18,0.82) 0%, rgba(15,16,18,0.45) 45%, rgba(15,16,18,0.2) 100%),
    linear-gradient(to top, rgba(15,16,18,0.6) 0%, rgba(15,16,18,0) 35%);
  z-index: -1;
}
.hero__inner {
  width: 100%;
  padding-top: calc(var(--header-h) + 48px);
  padding-bottom: 120px;
  text-align: center;
}
.hero__content { max-width: 1400px; margin: 0 auto; }
.hero h1 { white-space: normal; }
@media (min-width: 1400px) {
  .hero h1 { white-space: nowrap; }
}
.hero .eyebrow { justify-content: center; }
.hero h1 {
  color: var(--white);
  font-size: clamp(3rem, 7vw, 6.4rem);
  margin-bottom: 32px;
  line-height: 0.96;
  letter-spacing: -0.04em;
  font-weight: 400;
}
.hero h1 em {
  font-style: italic;
  color: var(--orange);
  font-weight: 400;
}
.hero .eyebrow { color: var(--orange); }
.hero p.lead {
  color: rgba(255,255,255,0.84);
  font-size: 1.18rem;
  margin-bottom: 42px;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}
.hero .btn-row { gap: 14px; justify-content: center; }

.hero__meta {
  position: absolute;
  bottom: 36px; left: 0; right: 0; z-index: 2;
}
.hero__meta-inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
}
.hero__loc {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  display: flex;
  align-items: center;
  gap: 12px;
}
.hero__loc::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 999px;
  background: var(--orange);
  box-shadow: 0 0 0 4px rgba(226,106,44,0.25);
  animation: pulse 2.4s var(--ease) infinite;
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(226,106,44,0.25); }
  50% { box-shadow: 0 0 0 8px rgba(226,106,44,0); }
}
.hero__scroll {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  writing-mode: vertical-rl;
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.hero__scroll::after {
  content: ''; width: 1px; height: 44px;
  background: linear-gradient(to bottom, var(--orange), transparent);
}
@media (max-width: 720px) {
  .hero h1 { font-size: clamp(2.6rem, 11vw, 3.8rem); }
  .hero__meta-inner { flex-direction: column; align-items: flex-start; }
  .hero__scroll { display: none; }
}

/* Hero ticker */
.hero__ticker {
  position: absolute;
  top: calc(var(--header-h) + 24px);
  right: 32px;
  z-index: 2;
  background: rgba(255,255,255,0.06);
  backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 999px;
  padding: 8px 18px 8px 8px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.78rem;
  color: rgba(255,255,255,0.85);
}
.hero__ticker-pill {
  background: var(--orange);
  color: var(--white);
  font-family: var(--font-mono);
  font-size: 0.65rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  font-weight: 500;
}
@media (max-width: 720px) { .hero__ticker { display: none; } }

/* ---------- Page hero ---------- */
.page-hero {
  position: relative;
  background: var(--ink);
  color: var(--on-dark);
  padding: calc(var(--header-h) + 32px) 0 36px;
  overflow: hidden;
}
.page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 70% at 85% 20%, rgba(226,106,44,0.18), transparent 60%),
    radial-gradient(ellipse 50% 80% at 5% 100%, rgba(226,106,44,0.08), transparent 55%);
  pointer-events: none;
}
.page-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 56px 56px;
  pointer-events: none;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 50%, black 0%, transparent 80%);
}
.page-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 920px;
}
.page-hero h1 { color: var(--white); margin-bottom: 18px; }
.page-hero p.lead { color: rgba(255,255,255,0.8); font-size: 1.12rem; }
.page-hero .breadcrumb {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  margin-bottom: 28px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.page-hero .breadcrumb a:hover { color: var(--orange); }

/* ---------- Stats strip ---------- */
.stats-strip {
  background: var(--ink);
  color: var(--on-dark);
  padding: 0;
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.stats-strip__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.stats-strip__tile {
  padding: 36px 28px;
  border-right: 1px solid rgba(244,239,230,0.08);
  position: relative;
  transition: background .3s var(--ease);
}
.stats-strip__tile:hover { background: rgba(255,255,255,0.02); }
.stats-strip__tile:last-child { border-right: 0; }
.stats-strip__num {
  font-family: var(--font-display);
  font-size: clamp(2.6rem, 4.6vw, 3.9rem);
  font-weight: 400;
  color: var(--white);
  line-height: 1;
  letter-spacing: -0.04em;
  display: flex;
  align-items: baseline;
  gap: 4px;
  font-variation-settings: 'opsz' 144, 'SOFT' 50;
}
.stats-strip__num small {
  font-size: 0.4em;
  color: var(--orange);
  font-family: var(--font-display);
  font-style: normal;
  font-weight: 500;
  margin-left: 0.04em;
  vertical-align: baseline;
  line-height: 1;
  letter-spacing: -0.065em;
}
.stats-strip__label {
  margin-top: 10px;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  line-height: 1.62;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  font-weight: 400;
}
@media (max-width: 800px) {
  .stats-strip__grid { grid-template-columns: repeat(2, 1fr); }
  .stats-strip__tile { padding: 44px 24px; }
  .stats-strip__tile:nth-child(2) { border-right: 0; }
  .stats-strip__tile:nth-child(1), .stats-strip__tile:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,0.06); }
}

/* ---------- Property card ---------- */
.property-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
@media (max-width: 980px) { .property-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .property-grid { grid-template-columns: 1fr; } }

.property-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  display: flex;
  flex-direction: column;
}
.property-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: var(--orange-soft);
}
.property-card__media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--bone);
  display: grid;
  place-items: center;
}
.property-card__media img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .8s var(--ease);
}
.property-card:hover .property-card__media img { transform: scale(1.04); }

/* SVG placeholder treatment */
.property-card__media.placeholder {
  background: linear-gradient(135deg, var(--bone) 0%, var(--sand) 100%);
}
.property-card__media.placeholder svg { width: 100%; height: 100%; }
.property-card__media-watermark {
  position: absolute;
  bottom: 14px;
  right: 14px;
  font-family: var(--font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(15,16,18,0.4);
}

.property-card__badge {
  position: absolute;
  top: 16px; left: 16px;
  background: var(--ink);
  color: var(--white);
  font-family: var(--font-mono);
  font-size: 0.66rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 7px 12px;
  border-radius: 999px;
  z-index: 2;
}
.property-card__badge.orange { background: var(--orange); }
.property-card__fav {
  position: absolute;
  top: 14px; right: 14px;
  width: 36px; height: 36px;
  background: rgba(255,255,255,0.92);
  border: 0;
  border-radius: 999px;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: background .2s, transform .2s;
  z-index: 2;
}
.property-card__fav:hover { transform: scale(1.08); background: var(--white); }
.property-card__fav svg { width: 16px; height: 16px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
.property-card__fav.active svg { fill: var(--orange); stroke: var(--orange-hot); }

.property-card__body {
  padding: 24px 24px 26px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.property-card__price {
  font-family: var(--font-display);
  font-size: 1.85rem;
  font-weight: 400;
  color: var(--ink);
  letter-spacing: -0.025em;
  margin-bottom: 6px;
  line-height: 1;
}
.property-card__title {
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  color: var(--ink);
  margin: 12px 0 4px;
  letter-spacing: -0.005em;
  line-height: 1.4;
}
.property-card__addr {
  font-size: 0.86rem;
  color: var(--muted);
  margin: 0 0 18px;
  line-height: 1.5;
}
.property-card__facts {
  display: flex;
  gap: 0;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  margin-top: auto;
}
.property-card__fact {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  position: relative;
}
.property-card__fact + .property-card__fact::before {
  content: '';
  position: absolute;
  left: 0; top: 6px; bottom: 6px;
  width: 1px;
  background: var(--line);
}
.property-card__fact + .property-card__fact { padding-left: 14px; }
.property-card__fact-num {
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--ink);
  line-height: 1;
}
.property-card__fact-label {
  font-size: 0.66rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--muted);
  font-weight: 500;
  font-family: var(--font-mono);
}

/* ---------- Split / two-col ---------- */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.split.reversed { direction: rtl; }
.split.reversed > * { direction: ltr; }
@media (max-width: 880px) { .split { grid-template-columns: 1fr; gap: 48px; } }
.split__media {
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--bone);
}
.split__media img { width: 100%; height: 100%; object-fit: cover; }
.split__media.wide { aspect-ratio: 5 / 4; }
.split__media-tag {
  position: absolute;
  bottom: 0; left: 0;
  background: var(--white);
  padding: 18px 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  border-top-right-radius: var(--radius-md);
}
.split__media-tag-num {
  font-family: var(--font-display);
  font-size: 2.4rem;
  color: var(--orange-hot);
  line-height: 1;
}
.split__media-tag-label { font-size: 0.74rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.14em; font-family: var(--font-mono); }

/* About-Visual: no image, composed panel */
.about-visual {
  position: relative;
  aspect-ratio: 4 / 5;
  background: var(--ink);
  border-radius: var(--radius-lg);
  overflow: hidden;
  color: var(--white);
  padding: 44px 40px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.about-visual::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 60% at 80% 20%, rgba(226,106,44,0.32), transparent 60%),
    radial-gradient(ellipse 60% 80% at 0% 100%, rgba(226,106,44,0.12), transparent 55%);
  pointer-events: none;
}
.about-visual::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, black 0%, transparent 90%);
  pointer-events: none;
}
.about-visual__top, .about-visual__bottom { position: relative; z-index: 1; }
.about-visual__metric {
  font-family: var(--font-display);
  font-size: clamp(5rem, 14vw, 9rem);
  line-height: 0.85;
  letter-spacing: -0.06em;
  color: var(--white);
  font-weight: 400;
  font-variation-settings: 'opsz' 144, 'SOFT' 100;
}
.about-visual__metric small {
  font-size: 0.32em;
  color: var(--orange);
  font-style: italic;
  vertical-align: top;
  letter-spacing: -0.02em;
}
.about-visual__metric-label {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-top: 18px;
}
.about-visual__quote {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.25rem, 1.8vw, 1.55rem);
  line-height: 1.35;
  color: var(--white);
  letter-spacing: -0.012em;
  font-weight: 400;
  border-top: 1px solid rgba(255,255,255,0.12);
  padding-top: 24px;
  position: relative;
}
.about-visual__quote::before {
  content: '';
  position: absolute;
  top: 24px; left: 0;
  width: 36px; height: 1px;
  background: var(--orange);
}
.about-visual__author {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
  margin-top: 16px;
  display: block;
}

/* Hero-band placeholder used on Buy/PM/Investors etc. when no real photo */
.editorial-panel {
  position: relative;
  aspect-ratio: 5 / 4;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, var(--paper) 0%, var(--bone) 60%, var(--sand) 100%);
  overflow: hidden;
  padding: 36px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid var(--line);
}
.editorial-panel__art { position: absolute; inset: 0; opacity: 0.85; }
.editorial-panel__head, .editorial-panel__foot { position: relative; z-index: 1; }
.editorial-panel__pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--orange-hot);
  background: var(--white);
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
}
.editorial-panel__title {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  letter-spacing: -0.025em;
  margin: 0;
  font-weight: 400;
  color: var(--ink);
  font-style: italic;
}
.editorial-panel__meta {
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
}
.editorial-panel__meta div {
  font-size: 0.78rem;
  color: var(--muted);
}
.editorial-panel__meta strong {
  display: block;
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -0.02em;
  font-style: normal;
}

/* ---------- Checklist ---------- */
.checklist {
  list-style: none;
  padding: 0;
  margin: 24px 0 32px;
  display: grid;
  gap: 12px;
}
.checklist.two-col { grid-template-columns: 1fr 1fr; gap: 12px 28px; }
@media (max-width: 640px) { .checklist.two-col { grid-template-columns: 1fr; } }
.checklist li {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  font-size: 0.94rem;
  color: var(--ink-soft);
  line-height: 1.5;
}
.checklist li::before {
  content: '';
  flex-shrink: 0;
  width: 20px; height: 20px;
  margin-top: 3px;
  border-radius: 999px;
  background: var(--orange-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 L5 8.5 L9.5 3.5' stroke='%23C1501A' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat;
}
.section.navy .checklist li { color: rgba(255,255,255,0.85); }
.section-bg-image .checklist li { color: rgba(255,255,255,0.9); }
.section.navy .checklist li::before {
  background-color: rgba(226,106,44,0.18);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 L5 8.5 L9.5 3.5' stroke='%23E26A2C' stroke-width='1.9' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ---------- Cards ---------- */
.card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  position: relative;
  transition: transform .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.card:hover { transform: translateY(-3px); border-color: var(--orange-soft); box-shadow: var(--shadow-md); }
.section.navy .card { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.08); }
.section.navy .card:hover { background: rgba(255,255,255,0.05); border-color: rgba(226,106,44,0.4); }
.section.ivory .card { background: var(--white); }
.card h3 { margin-bottom: 12px; }
.card p { margin-bottom: 0; color: var(--text); }
.section.navy .card p { color: rgba(255,255,255,0.75); }
.card__num {
  font-family: var(--font-display);
  font-size: 2.4rem;
  font-weight: 400;
  color: var(--orange-hot);
  line-height: 1;
  letter-spacing: -0.04em;
  margin-bottom: 22px;
  display: block;
  font-style: italic;
}
.section.navy .card__num { color: var(--orange); }
.card__icon {
  width: 44px; height: 44px;
  border-radius: var(--radius-md);
  background: var(--orange-soft);
  color: var(--orange-hot);
  display: grid; place-items: center;
  margin-bottom: 22px;
}
.section.navy .card__icon { background: rgba(226,106,44,0.18); color: var(--orange); }
.card__icon svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.5; }

/* ---------- Team card ---------- */
.team-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  transition: border-color .3s, transform .3s, box-shadow .3s;
}
.team-card:hover { border-color: var(--orange-soft); transform: translateY(-3px); box-shadow: var(--shadow-md); }
.team-card__avatar {
  width: 64px; height: 64px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--ink) 0%, var(--ink-2) 100%);
  color: var(--orange);
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-style: italic;
  display: grid; place-items: center;
  flex-shrink: 0;
  letter-spacing: 0.02em;
}
.team-card__role {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  color: var(--orange-hot);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 500;
  margin: 0 0 4px;
}
.team-card__name { margin: 0 0 16px; }
.team-card__bio { color: var(--text); font-size: 0.94rem; margin-bottom: 18px; flex: 1; }
.team-card__contact { display: flex; flex-direction: column; gap: 8px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 0.86rem; }
.team-card__contact a { color: var(--ink); display: flex; align-items: center; gap: 10px; }
.team-card__contact a:hover { color: var(--orange-hot); }
.team-card__contact svg { width: 14px; height: 14px; stroke: var(--muted); fill: none; stroke-width: 1.6; }

/* ---------- Chips ---------- */
.chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 28px; }
.chip {
  font-family: var(--font-body);
  font-size: 0.82rem;
  font-weight: 500;
  padding: 8px 16px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  color: var(--ink-soft);
  background: var(--white);
  transition: all .2s var(--ease);
}
.chip:hover { background: var(--ink); color: var(--white); border-color: var(--ink); }
.section.ivory .chip { background: var(--white); }
.section.navy .chip { background: transparent; border-color: rgba(255,255,255,0.18); color: var(--on-dark); }
.section.navy .chip:hover { background: var(--orange); color: var(--white); border-color: var(--orange); }

/* ---------- Section with full-bleed background image ---------- */
.section.section-bg-image {
  position: relative;
  isolation: isolate;
  color: var(--on-dark);
  overflow: hidden;
}
.section-bg-image__media {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
.section-bg-image__tint {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(120deg, rgba(15,16,18,0.86) 0%, rgba(15,16,18,0.66) 45%, rgba(15,16,18,0.5) 100%),
    radial-gradient(ellipse 60% 80% at 80% 30%, rgba(226,106,44,0.18), transparent 60%);
  z-index: -1;
}
.section-bg-image h2,
.section-bg-image h3 { color: var(--white); }
.section-bg-image p { color: rgba(255,255,255,0.85); }
.section-bg-image .lead { color: rgba(255,255,255,0.92); }
.section-bg-image .chip {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.22);
  color: var(--white);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.section-bg-image .chip:hover {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--white);
}
.bg-image-content { max-width: 760px; }
.bg-image-content h2 { font-size: clamp(2.4rem, 5vw, 4rem); margin-bottom: 24px; }
.bg-image-content .chips { margin: 28px 0 36px; }

/* Light mode override */
html.mode-light .section-bg-image__tint {
  background:
    linear-gradient(120deg, rgba(255,255,255,0.82) 0%, rgba(255,255,255,0.62) 50%, rgba(255,255,255,0.45) 100%),
    radial-gradient(ellipse 60% 80% at 80% 30%, rgba(226,106,44,0.12), transparent 60%);
}
html.mode-light .section-bg-image h2,
html.mode-light .section-bg-image h3 { color: var(--ink); }
html.mode-light .section-bg-image p { color: var(--text); }
html.mode-light .section-bg-image .lead { color: var(--ink-soft); }
html.mode-light .section-bg-image .chip {
  background: rgba(255,255,255,0.7);
  border-color: var(--line-strong);
  color: var(--ink);
}

/* ---------- Mortgage calculator ---------- */
.calc {
  background: var(--white);
  border-radius: var(--radius-xl);
  padding: clamp(32px, 4vw, 56px);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  color: var(--ink);
  box-shadow: var(--shadow-lg);
}
@media (max-width: 880px) { .calc { grid-template-columns: 1fr; gap: 32px; } }
.calc h2, .calc h3 { color: var(--ink); }
.calc__inputs { display: flex; flex-direction: column; gap: 22px; }
.calc__field { display: flex; flex-direction: column; gap: 8px; }
.calc__field label {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  display: flex; justify-content: space-between;
}
.calc__field label span { color: var(--ink); font-family: var(--font-display); font-size: 1.1rem; text-transform: none; letter-spacing: -0.015em; font-style: italic; font-weight: 400; }
.calc__input-row { display: flex; align-items: center; gap: 12px; background: var(--paper); border-radius: var(--radius-md); padding: 14px 18px; border: 1px solid transparent; transition: border-color .2s, background .2s; }
.calc__input-row:focus-within { border-color: var(--orange); background: var(--white); }
.calc__input-row input[type="number"] {
  flex: 1; border: 0; background: transparent;
  font-family: var(--font-body);
  font-size: 1.05rem; font-weight: 500;
  color: var(--ink); outline: none;
}
.calc__input-row .prefix, .calc__input-row .suffix { color: var(--muted); font-size: 0.95rem; }
.calc__slider { -webkit-appearance: none; appearance: none; width: 100%; height: 4px; border-radius: 999px; background: var(--bone); outline: none; }
.calc__slider::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 999px; background: var(--orange); cursor: pointer; box-shadow: 0 0 0 4px rgba(226,106,44,0.18); }
.calc__slider::-moz-range-thumb { width: 18px; height: 18px; border-radius: 999px; background: var(--orange); cursor: pointer; border: 0; }

.calc__result {
  background: var(--ink);
  color: var(--on-dark);
  border-radius: var(--radius-lg);
  padding: 36px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
}
.calc__result::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 80% 0%, rgba(226,106,44,0.18), transparent 60%);
  pointer-events: none;
}
.calc__result-label {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: 14px;
}
.calc__result-num {
  font-family: var(--font-display);
  font-size: clamp(3rem, 5.6vw, 4.8rem);
  color: var(--white);
  line-height: 1;
  letter-spacing: -0.04em;
  font-weight: 400;
}
.calc__result-num small { font-size: 0.36em; color: rgba(255,255,255,0.55); margin-left: 4px; font-style: italic; }
.calc__result-breakdown {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 24px;
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.12);
  position: relative;
}
.calc__result-breakdown div { display: flex; flex-direction: column; gap: 4px; }
.calc__result-breakdown dt { font-family: var(--font-mono); font-size: 0.66rem; color: rgba(255,255,255,0.5); letter-spacing: 0.14em; text-transform: uppercase; }
.calc__result-breakdown dd { margin: 0; font-family: var(--font-display); color: var(--white); font-size: 1.3rem; letter-spacing: -0.015em; }

/* ---------- Filter bar ---------- */
.filter-bar {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 16px 20px;
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 36px;
}
@media (max-width: 880px) { .filter-bar { grid-template-columns: 1fr; } }
.filter-bar input[type="text"], .filter-bar input[type="number"] {
  border: 0; background: var(--paper);
  padding: 12px 16px;
  border-radius: var(--radius-md);
  font-family: inherit; font-size: 0.92rem;
  color: var(--ink); outline: none;
  width: 100%;
}
.filter-bar input:focus { box-shadow: 0 0 0 2px var(--orange); }
.filter-bar__group { display: flex; gap: 10px; }
.filter-bar__group input { width: 130px; }
.filter-bar__count {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 24px;
}

/* ---------- CTA strip ---------- */
.cta-strip {
  background: var(--ink);
  color: var(--on-dark);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cta-strip::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 30% 50%, rgba(226,106,44,0.16), transparent 60%),
    radial-gradient(ellipse 50% 70% at 75% 60%, rgba(226,106,44,0.1), transparent 55%);
  pointer-events: none;
}
.cta-strip h2 { color: var(--white); max-width: 18ch; margin: 0 auto .5em; }
.cta-strip__inner { position: relative; z-index: 1; max-width: 760px; margin: 0 auto; }
.cta-strip p.lead { color: rgba(255,255,255,0.78); margin: 0 auto 36px; }
.cta-strip .btn-row { justify-content: center; }

/* ---------- Footer ---------- */
.site-footer {
  background: var(--ink);
  color: var(--on-dark);
  padding: 56px 0 24px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.site-footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1.4fr;
  gap: 48px;
  padding-bottom: 36px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
@media (max-width: 880px) { .site-footer__grid { grid-template-columns: 1fr 1fr; gap: 48px 32px; } }
@media (max-width: 540px) { .site-footer__grid { grid-template-columns: 1fr; } }
.site-footer__brand { display: flex; flex-direction: column; gap: 18px; }
.site-footer__brand img { height: 42px; width: auto; align-self: flex-start; }
.site-footer__brand p { font-size: 0.95rem; color: rgba(255,255,255,0.7); max-width: 36ch; }
.site-footer h4 {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--orange);
  margin: 0 0 22px;
  font-weight: 500;
}
.site-footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.site-footer a { color: rgba(255,255,255,0.78); font-size: 0.92rem; }
.site-footer a:hover { color: var(--orange); }
.site-footer__contact-item { display: flex; gap: 12px; align-items: flex-start; font-size: 0.92rem; color: rgba(255,255,255,0.78); margin-bottom: 14px; }
.site-footer__contact-item svg { width: 16px; height: 16px; stroke: var(--orange); fill: none; stroke-width: 1.6; flex-shrink: 0; margin-top: 2px; }
.site-footer__accred {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-lg);
  padding: 24px;
}
.site-footer__accred-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--orange);
  padding: 6px 12px;
  background: rgba(226,106,44,0.12);
  border-radius: 999px;
  margin-bottom: 14px;
}
.site-footer__accred p { font-size: 0.9rem; color: rgba(255,255,255,0.78); margin: 0; }
.site-footer__bottom {
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 0.8rem;
  color: rgba(255,255,255,0.45);
}
.site-footer__bottom-links { display: flex; gap: 24px; }
.site-footer__bottom-links a { color: rgba(255,255,255,0.5); }

/* ---------- Pullquote ---------- */
.pullquote {
  background: var(--paper);
  border-radius: var(--radius-lg);
  padding: 48px;
  position: relative;
  border: 1px solid var(--line);
}
.pullquote::before {
  content: '\201C';
  position: absolute;
  top: -8px; left: 32px;
  font-family: var(--font-display);
  font-size: 7rem;
  color: var(--orange);
  line-height: 1;
  opacity: 0.7;
}
.pullquote p {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 2.4vw, 1.95rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.4;
  color: var(--ink);
  margin: 0;
  position: relative;
  z-index: 1;
  max-width: 36ch;
  letter-spacing: -0.018em;
}

/* ---------- Reveal ---------- */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease-out), transform .9s var(--ease-out); }
.reveal.in { opacity: 1; transform: translateY(0); }

.text-center { text-align: center; }
.mb-0 { margin-bottom: 0 !important; }
.muted { color: var(--muted); }
.divider { width: 56px; height: 1px; background: var(--orange); margin: 24px 0; }
hr { border: 0; height: 1px; background: var(--line); margin: 32px 0; }

/* Marquee for area ribbon */
.marquee {
  overflow: hidden;
  background: var(--ink);
  color: var(--on-dark);
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.marquee__track {
  display: flex;
  gap: 60px;
  padding: 28px 0;
  animation: scroll 40s linear infinite;
  white-space: nowrap;
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.4rem, 2.6vw, 2.4rem);
  color: rgba(255,255,255,0.85);
  letter-spacing: -0.02em;
  width: max-content;
}
.marquee__track span:nth-child(even) { color: var(--orange); }
@keyframes scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ---------- Fluent Forms — design shim to match site ---------- */
.hp-form-card .fluentform .ff-el-group { margin-bottom: 18px; }
.hp-form-card .fluentform .ff-el-input--label label,
.hp-form-card .fluentform .ff-el-input--label > label {
	text-transform: none;
	letter-spacing: 0;
	font-size: 0.86rem;
	font-weight: 500;
	color: var(--ink);
	margin-bottom: 6px;
	display: inline-block;
	font-family: var(--font-body);
}
.hp-form-card .fluentform .ff-el-is-required.asterisk-right label::after,
.hp-form-card .fluentform .ff-el-is-required label .ff-el-is-required-mark { color: var(--orange-hot); }
.hp-form-card .fluentform input[type="text"],
.hp-form-card .fluentform input[type="email"],
.hp-form-card .fluentform input[type="tel"],
.hp-form-card .fluentform input[type="number"],
.hp-form-card .fluentform input[type="url"],
.hp-form-card .fluentform select,
.hp-form-card .fluentform textarea,
.hp-form-card .fluentform .ff-el-form-control {
	border: 1px solid var(--line);
	border-radius: var(--radius-md, 10px);
	padding: 12px 16px;
	font-family: inherit;
	font-size: 0.95rem;
	color: var(--ink);
	background: var(--white);
	width: 100%;
	box-shadow: none;
	outline: none;
	transition: border-color 160ms ease, box-shadow 160ms ease;
}
.hp-form-card .fluentform input:focus,
.hp-form-card .fluentform select:focus,
.hp-form-card .fluentform textarea:focus,
.hp-form-card .fluentform .ff-el-form-control:focus {
	border-color: var(--orange);
	box-shadow: 0 0 0 3px rgba(226,106,44,0.12);
}
.hp-form-card .fluentform textarea { resize: vertical; min-height: 96px; }

/* Section break — used as the form intro */
.hp-form-card .fluentform .ff-el-section-break { margin: 0 0 8px; padding: 0; border: 0; background: transparent; }
.hp-form-card .fluentform .ff-section_break_title,
.hp-form-card .fluentform .ff-el-section-break h3,
.hp-form-card .fluentform .ff-el-section-break h4 {
	font-family: var(--font-display);
	font-style: normal;
	font-weight: 500;
	font-size: clamp(1.3rem, 1.6vw, 1.55rem);
	letter-spacing: -0.01em;
	color: var(--ink);
	margin: 0 0 6px;
	line-height: 1.2;
}
.hp-form-card .fluentform .ff-section_break_desk,
.hp-form-card .fluentform .ff-el-section-break p {
	font-size: 0.9rem;
	color: var(--muted);
	margin: 0 0 14px;
	line-height: 1.5;
}

/* Submit button — match .btn .btn-primary look */
.hp-form-card .fluentform .ff-btn-submit,
.hp-form-card .fluentform button[type="submit"],
.hp-form-card .fluentform .ff_btn_style {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--orange);
	color: var(--white);
	border: 0;
	border-radius: 12px;
	padding: 12px 24px;
	font-family: inherit;
	font-size: 0.92rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	cursor: pointer;
	transition: background 160ms ease, transform 160ms ease;
	width: auto;
}
.hp-form-card .fluentform .ff-btn-submit:hover,
.hp-form-card .fluentform button[type="submit"]:hover {
	background: var(--orange-hot);
	transform: translateY(-1px);
}

/* Two-column rows render via FF "container" — keep gap consistent */
.hp-form-card .fluentform .ff-t-container { gap: 16px; }
.hp-form-card .fluentform .ff-t-cell { padding: 0; }

/* Success / error messages */
.hp-form-card .fluentform .ff-message-success {
	background: rgba(226,106,44,0.08);
	border: 1px solid rgba(226,106,44,0.25);
	color: var(--ink);
	border-radius: var(--radius-md, 10px);
	padding: 18px 20px;
	font-size: 0.95rem;
}
.hp-form-card .fluentform .ff-el-is-error .text-danger,
.hp-form-card .fluentform .error,
.hp-form-card .fluentform .text-danger {
	color: #c0392b;
	font-size: 0.82rem;
	margin-top: 4px;
}
.hp-form-card .fluentform .ff-el-is-error input,
.hp-form-card .fluentform .ff-el-is-error textarea,
.hp-form-card .fluentform .ff-el-is-error select { border-color: #c0392b; }

/* ---------- Unified page hero (image hero replaces dark page-hero band) ---------- */
.section.section-bg-image.is-hero {
	padding-top: calc(var(--header-h) + clamp(48px, 6vw, 96px));
	padding-bottom: clamp(56px, 7vw, 96px);
	min-height: clamp(520px, 72vh, 720px);
	display: flex;
	align-items: center;
}
.section-bg-image.is-hero .container { width: 100%; }
.section-bg-image.is-hero .breadcrumb {
	font-family: var(--font-mono);
	font-size: 0.72rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.55);
	margin-bottom: 28px;
	display: flex;
	align-items: center;
	gap: 12px;
}
.section-bg-image.is-hero .breadcrumb a { color: rgba(255,255,255,0.55); text-decoration: none; }
.section-bg-image.is-hero .breadcrumb a:hover { color: var(--orange); }
.section-bg-image.is-hero h1 {
	color: var(--white);
	font-size: clamp(2.4rem, 5.4vw, 4.2rem);
	margin: 0 0 22px;
	line-height: 1.04;
	letter-spacing: -0.02em;
}
.section-bg-image.is-hero .lead { color: rgba(255,255,255,0.92); max-width: 640px; }
.section-bg-image.is-hero .bg-image-content { max-width: 820px; }
.section-bg-image.is-hero .chips { margin-top: 28px; margin-bottom: 0; }

/* ---------- Slim banner variant of page-hero (used on About, Contact, Valuation, Areas) ---------- */
.page-hero.is-banner {
	padding: calc(var(--header-h) + 32px) 0 28px;
	border-bottom: 1px solid rgba(255,255,255,0.06);
}
.page-hero.is-banner::before { opacity: 0.5; }
.page-hero.is-banner::after { display: none; }
.page-hero.is-banner .page-hero__inner { max-width: 1100px; }
.page-hero.is-banner .breadcrumb { margin-bottom: 16px; }
.page-hero.is-banner .eyebrow { margin-bottom: 8px; }
.page-hero.is-banner h1 {
	font-size: clamp(1.8rem, 3.4vw, 2.6rem);
	margin-bottom: 8px;
	letter-spacing: -0.015em;
}
.page-hero.is-banner p.lead {
	font-size: 1rem;
	max-width: 640px;
	margin: 0;
}

/* ============================================================
   MOBILE OPTIMIZATION
   ============================================================ */

/* --- Header: hide inline Contact button on mobile (it's already in the drawer) --- */
@media (max-width: 900px) {
	.site-header .btn-compact { display: none; }
	.hamburger { width: 44px; height: 44px; }
}
@media (max-width: 720px) {
	.site-header__logo img { height: 44px; }
	.site-header.scrolled .site-header__logo img { height: 38px; }
}

/* --- Mobile drawer: dvh + safe-area + accordion submenus --- */
.mobile-drawer {
	height: calc(100vh - var(--header-h));
	height: calc(100dvh - var(--header-h));
	padding-bottom: max(32px, env(safe-area-inset-bottom));
	-webkit-overflow-scrolling: touch;
}
.mobile-drawer__list .menu-item-has-children > a {
	display: inline-block;
	width: calc(100% - 44px);
	vertical-align: middle;
}
.mobile-drawer__caret {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-left: -4px;
	background: transparent;
	border: 0;
	color: rgba(255,255,255,0.6);
	cursor: pointer;
	vertical-align: middle;
	float: right;
	transition: transform .25s var(--ease), color .2s ease;
}
.mobile-drawer__caret:hover { color: var(--orange); }
.mobile-drawer__list .menu-item-has-children.is-open > .mobile-drawer__caret { transform: rotate(180deg); color: var(--orange); }
/* Collapse sub-menu by default; expand when parent has .is-open */
.mobile-drawer__list .sub-menu {
	display: none;
	padding: 4px 0 12px 16px;
	border-left: 1px solid rgba(255,255,255,0.08);
	margin-left: 4px;
}
.mobile-drawer__list .menu-item-has-children.is-open > .sub-menu { display: block; }
.mobile-drawer__list .sub-menu a {
	font-size: 0.95rem;
	padding: 10px 0;
	border-bottom: 0;
}
.mobile-drawer .btn { width: calc(100% - 0px); margin: 24px 0 0 !important; justify-content: center; }

/* --- Homepage hero: tighter on phone (URL bar takes up height) --- */
@media (max-width: 720px) {
	.hero { min-height: auto; }
	.hero__inner {
		padding-top: calc(var(--header-h) + 56px);
		padding-bottom: 80px;
	}
	.hero h1 { margin-bottom: 22px; letter-spacing: -0.025em; }
	.hero p.lead, .hero .btn-row { max-width: 100%; }
}

/* --- Image hero on interior pages: trim min-height on phones --- */
@media (max-width: 720px) {
	.section.section-bg-image.is-hero {
		min-height: auto;
		padding-top: calc(var(--header-h) + 40px);
		padding-bottom: 56px;
	}
	.section-bg-image.is-hero h1 { font-size: clamp(2rem, 7vw, 2.6rem); }
	.section-bg-image.is-hero .lead { font-size: 1rem; }
	.section-bg-image.is-hero .checklist.two-col { grid-template-columns: 1fr; }
}

/* --- Page-hero banner trim on phone --- */
@media (max-width: 720px) {
	.page-hero.is-banner { padding: calc(var(--header-h) + 24px) 0 22px; }
	.page-hero.is-banner h1 { font-size: clamp(1.6rem, 6vw, 2rem); }
}

/* --- Section padding tighter on phones --- */
@media (max-width: 720px) {
	:root { --section-pad-y: clamp(40px, 9vw, 56px); }
	.section { padding: var(--section-pad-y) 0; }
	.section-head { margin-bottom: 28px; }
}

/* --- Stats strip: tighter padding, smaller numbers --- */
@media (max-width: 720px) {
	.stats-strip__grid { grid-template-columns: repeat(2, 1fr); gap: 0; }
	.stats-strip__tile {
		padding: 24px 16px;
		border-bottom: 1px solid rgba(255,255,255,0.08);
	}
	.stats-strip__tile:nth-child(odd) { border-right: 1px solid rgba(255,255,255,0.08); }
	.stats-strip__tile:nth-child(n+3) { border-bottom: 0; }
	.stats-strip__num { font-size: clamp(2rem, 9vw, 2.6rem); }
	.stats-strip__label { font-size: 0.62rem; }
}

/* --- Forms on mobile --- */
@media (max-width: 720px) {
	.hp-form-card { padding: 28px 22px !important; }
	.hp-form-card .fluentform .ff-t-container { grid-template-columns: 1fr; gap: 0; }
	.hp-form-card .fluentform input,
	.hp-form-card .fluentform select,
	.hp-form-card .fluentform textarea,
	.hp-form-card .fluentform .ff-el-form-control { font-size: 16px; /* prevent iOS zoom on focus */ }
	.hp-form-card .fluentform .ff-btn-submit,
	.hp-form-card .fluentform button[type="submit"] { width: 100%; justify-content: center; }
}

/* --- Mortgage calculator on phone: tighter --- */
@media (max-width: 720px) {
	.calc__result { padding: 28px 22px; }
	.calc__field { gap: 8px; }
	.calc__result-num { font-size: clamp(2.2rem, 9vw, 2.8rem); }
}

/* --- REO compare panel: cleaner stacked --- */
@media (max-width: 720px) {
	.reo-pedigree__row { grid-template-columns: 1fr 1fr; row-gap: 18px; }
	.reo-pedigree__row > li { padding: 4px 14px; }
	.reo-services__grid > li { padding: 22px 0 18px; }
	.reo-trusted__wall li { flex-basis: 100%; padding: 14px 6px; font-size: 1rem; border-right: 0; }
}

/* --- Container side-padding on small phones --- */
@media (max-width: 480px) {
	.container { padding: 0 18px; }
	.section-head__main { max-width: 100%; }
}

/* --- Chips: tighter on phone --- */
@media (max-width: 720px) {
	.chips { gap: 8px; }
	.chip { padding: 6px 11px; font-size: 0.78rem; }
}

/* --- Buttons on small screens: keep natural width; wrap in row only when content forces it --- */
@media (max-width: 480px) {
	.btn-row { gap: 10px; justify-content: center; }
	.btn-row > .btn { flex: 0 1 auto; }
}

/* --- Tap target safety: WP nav menus get min-height where needed --- */
@media (max-width: 900px) {
	.mobile-drawer__list a,
	.mobile-drawer__list .menu-item-has-children > a { min-height: 44px; line-height: 1.4; display: flex; align-items: center; }
	.mobile-drawer__list .menu-item-has-children > a { display: inline-flex; }
}

/* ============================================================
   MOBILE FIX PASS 2 — overflow + hero crops
   ============================================================ */

/* Kill rogue horizontal scroll site-wide */
html, body { overflow-x: hidden; max-width: 100%; }

/* Buttons: wrap text on mobile so long labels don't overflow viewport */
@media (max-width: 720px) {
	.btn { white-space: normal; padding: 11px 18px; font-size: 0.88rem; line-height: 1.3; }
	.btn svg { width: 14px; height: 14px; flex-shrink: 0; }
}

/* Homepage hero: dial down H1 minimum so "Full Service Real Estate Pros" fits */
@media (max-width: 720px) {
	.hero h1 { font-size: clamp(2.1rem, 9vw, 3rem); margin-bottom: 18px; line-height: 1.05; letter-spacing: -0.02em; }
	.hero p.lead { font-size: 0.98rem; max-width: 100%; }
	.hero__inner { padding-top: calc(var(--header-h) + 36px); padding-bottom: 72px; }
}
@media (max-width: 480px) {
	.hero h1 { font-size: clamp(1.7rem, 9vw, 2.3rem); }
}

/* Interior image hero: tighter min-height, less crop pressure on the bg image */
@media (max-width: 720px) {
	.section.section-bg-image.is-hero {
		min-height: 380px;
		padding-top: calc(var(--header-h) + 24px);
		padding-bottom: 36px;
	}
	.section-bg-image.is-hero .section-bg-image__media { background-position: center 25%; }
	.section-bg-image.is-hero h1 { font-size: clamp(1.7rem, 7.4vw, 2.2rem); margin-bottom: 12px; line-height: 1.1; }
	.section-bg-image.is-hero .lead { font-size: 0.96rem; margin-bottom: 16px; }
	.section-bg-image.is-hero .breadcrumb { margin-bottom: 12px; font-size: 0.66rem; }
	.section-bg-image.is-hero .chips { margin-top: 16px; }
	.section-bg-image.is-hero .checklist { margin: 16px 0 8px; }
	.section-bg-image.is-hero .btn-row { margin-top: 16px; }
}

/* Row-card pattern: avatar/text/button on PM, dark CTA on Sell */
.hp-row-card {
	background: var(--white);
	color: var(--ink);
	border: 1px solid var(--line);
	border-radius: var(--radius-xl, 18px);
	padding: clamp(32px, 4vw, 48px) clamp(24px, 4vw, 56px);
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 32px;
	align-items: center;
}
.hp-row-card--avatar { grid-template-columns: auto 1fr auto; }
.hp-row-card--dark { background: var(--ink); color: var(--on-dark); border: 0; border-radius: var(--radius-xl, 18px); }
.hp-row-card--dark h3 { color: var(--white); }
.hp-row-card--dark p { color: rgba(255,255,255,0.78); }
@media (max-width: 760px) {
	.hp-row-card,
	.hp-row-card--avatar { grid-template-columns: 1fr; gap: 18px; padding: 28px 22px; text-align: center; }
	.hp-row-card .team-card__avatar { margin: 0 auto; }
	.hp-row-card .btn { width: 100%; }
}

/* About: pullquote and split media smaller padding on phone */
@media (max-width: 720px) {
	.pullquote { padding: 32px 24px; }
	.pullquote::before { font-size: 4.6rem; left: 18px; top: -4px; }
	.pullquote p { font-size: clamp(1.1rem, 4.6vw, 1.4rem); max-width: 100%; }
	.split__media.wide { aspect-ratio: auto; min-height: auto !important; padding: 32px 24px !important; }
	.split__media.wide img { max-width: 220px !important; }
}

/* Inline-styled cards with heavy padding (Buy "Need Help…", etc.) */
@media (max-width: 720px) {
	.section .card[style*="padding:40px"],
	.section .card[style*="padding: 40px"] { padding: 28px 22px !important; }
	.section .card[style*="padding:48px"],
	.section .card[style*="padding: 48px"] { padding: 28px 22px !important; }
}

/* Heading sizes on phone — prevent oversized H2/H3 from forcing horizontal scroll */
@media (max-width: 720px) {
	h2 { font-size: clamp(1.6rem, 5.8vw, 2rem); line-height: 1.15; letter-spacing: -0.018em; }
	h3 { font-size: clamp(1.1rem, 4.6vw, 1.4rem); line-height: 1.2; }
	.hp-row-card--dark h3 { font-size: clamp(1.3rem, 5.2vw, 1.55rem) !important; }
}

/* About track-record stats grid: mobile 2-col */
@media (max-width: 720px) {
	#track-record .grid.grid-4 { grid-template-columns: repeat(2, 1fr); gap: 24px 16px; }
}

/* ============================================
   Listings dropdown nav
   ============================================ */
.nav-item.has-dropdown {
	position: relative;
}
.nav-item.has-dropdown > .nav-dropdown-trigger {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.nav-item.has-dropdown > .nav-dropdown-trigger svg {
	width: 10px;
	height: 10px;
	transition: transform 160ms ease;
}
.nav-item.has-dropdown:hover > .nav-dropdown-trigger svg,
.nav-item.has-dropdown:focus-within > .nav-dropdown-trigger svg {
	transform: rotate(180deg);
}

.nav-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 200px;
	padding: 8px 0;
	margin: 0;
	list-style: none;
	background: var(--white);
	border: 1px solid var(--line);
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.06);
	opacity: 0;
	visibility: hidden;
	transform: translateY(4px);
	transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease;
	z-index: 100;
}
.nav-item.has-dropdown:hover > .nav-dropdown,
.nav-item.has-dropdown:focus-within > .nav-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.nav-dropdown li {
	margin: 0;
}
.nav-dropdown a {
	display: block;
	padding: 8px 16px;
	color: var(--ink);
	text-decoration: none;
	font-size: 0.92rem;
	white-space: nowrap;
}
.nav-dropdown a:hover,
.nav-dropdown a:focus {
	background: var(--ivory);
	color: var(--orange);
}

/* Mobile drawer — accordion behavior for the Listings group */
.mobile-drawer__list .has-dropdown > .nav-dropdown-trigger {
	width: 100%;
	text-align: left;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.mobile-drawer__list .nav-dropdown {
	position: static;
	opacity: 1;
	visibility: visible;
	transform: none;
	border: 0;
	box-shadow: none;
	background: transparent;
	padding: 0 0 8px 16px;
	display: none;
}
.mobile-drawer__list .has-dropdown.is-open .nav-dropdown {
	display: block;
}

/* ============================================
   Listings dropdown — wp_nav_menu native classes
   Mirrors the .has-dropdown / .nav-dropdown rules above so the same
   dropdown behavior works whether the nav comes from the fallback
   closure or from a WordPress admin menu (Appearance → Menus).
   ============================================ */
.primary-nav__list .menu-item-has-children {
	position: relative;
}
.primary-nav__list .menu-item-has-children > a::after {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-left: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform 160ms ease;
	vertical-align: middle;
}
.primary-nav__list .menu-item-has-children:hover > a::after,
.primary-nav__list .menu-item-has-children:focus-within > a::after {
	transform: rotate(-135deg) translateY(2px);
}

.primary-nav__list .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 200px;
	padding: 8px 0;
	margin: 0;
	list-style: none;
	background: var(--white);
	border: 1px solid var(--line);
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.06);
	opacity: 0;
	visibility: hidden;
	transform: translateY(4px);
	transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease;
	z-index: 100;
}
.primary-nav__list .menu-item-has-children:hover > .sub-menu,
.primary-nav__list .menu-item-has-children:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.primary-nav__list .sub-menu li {
	margin: 0;
}
.primary-nav__list .sub-menu a {
	display: block;
	padding: 8px 16px;
	color: var(--ink);
	text-decoration: none;
	font-size: 0.92rem;
	white-space: nowrap;
}
.primary-nav__list .sub-menu a:hover,
.primary-nav__list .sub-menu a:focus {
	background: var(--ivory);
	color: var(--orange);
}

/* Mobile drawer parallel — wp_nav_menu native classes */
.mobile-drawer__list .menu-item-has-children > a {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.mobile-drawer__list .menu-item-has-children > a::after {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	transition: transform 160ms ease;
}
.mobile-drawer__list .menu-item-has-children.is-open > a::after {
	transform: rotate(-135deg);
}
.mobile-drawer__list .sub-menu {
	list-style: none;
	padding: 0 0 8px 16px;
	margin: 0;
	display: none;
}
.mobile-drawer__list .menu-item-has-children.is-open > .sub-menu {
	display: block;
}

/* ============================================
   IDX widget container scaffolding (Stage 1: empty stubs;
   Stage 3: BB shortcodes drop in, scoped CSS overrides land here)
   ============================================ */
.hp-sales-map {
	min-height: 70vh;
	margin: clamp(24px, 4vw, 56px) 0;
	border: 1px solid var(--line);
	background: var(--ivory);
	display: flex;
	align-items: center;
	justify-content: center;
}
.hp-sales-map__placeholder {
	font-family: var(--font-mono);
	font-size: 0.72rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}
.hp-listings-grid {
	margin: clamp(24px, 4vw, 56px) 0;
	min-height: 320px;
	border: 1px solid var(--line);
	background: var(--ivory);
	display: flex;
	align-items: center;
	justify-content: center;
}
.hp-listings-grid__placeholder {
	font-family: var(--font-mono);
	font-size: 0.72rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

/* ============================================
   Sales History page — stats strip
   ============================================ */
.hp-stats-strip {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin: clamp(24px, 4vw, 48px) 0;
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}
.hp-stats-strip__cell {
	padding: clamp(24px, 4vw, 40px) clamp(16px, 3vw, 32px);
	text-align: center;
}
.hp-stats-strip__cell + .hp-stats-strip__cell {
	border-left: 1px solid var(--line);
}
.hp-stats-strip__value {
	font-family: var(--font-display);
	font-style: italic;
	font-size: clamp(2.4rem, 5vw, 3.6rem);
	line-height: 1;
	color: var(--ink);
	font-variation-settings: 'opsz' 144;
}
.hp-stats-strip__label {
	font-family: var(--font-mono);
	font-size: 0.68rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--muted);
	margin-top: 12px;
	line-height: 1.4;
}
@media (max-width: 600px) {
	.hp-stats-strip {
		grid-template-columns: 1fr;
	}
	.hp-stats-strip__cell + .hp-stats-strip__cell {
		border-left: 0;
		border-top: 1px solid var(--line);
	}
}