/* ═══════════════════════════════════════════════════════════════
   THE SMITH DOBROWSKY TEAM — Inner Pages Stylesheet
   Load order: styles.css → nav.css → pages.css
   Scope: all non-homepage pages (buyers, sellers, listings, communities)
   Do NOT load on index.html — use home.css there.
   ═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────
   1. COMPONENT EXTENSIONS
   Global versions of classes that home.css only defines scoped
   to body.home-page. Inner pages need these unscoped.
   ───────────────────────────────────────────────────────────── */

/* Eyebrow color variants */
:root {
  --type-section-heading: clamp(3rem, 3.65vw, 4.3rem);
  --type-pathway-heading: clamp(2rem, 3vw, 3.4rem);
  --type-small-heading: clamp(0.82rem, 0.9vw, 0.96rem);
  --type-small-body: clamp(0.82rem, 0.84vw, 0.9rem);
  --type-metadata: clamp(10px, 0.72vw, 11px);
  --leading-pathway: 1.04;
  --eyebrow-size: clamp(10px, 0.72vw, 11px);
  --eyebrow-leading: 1.42;
  --eyebrow-gap: clamp(14px, 1.5vw, 20px);
  --eyebrow-dark: rgba(238, 235, 228, 0.88);
  --eyebrow-light: rgba(11,22,38,0.48);
  --cta-size: clamp(10.5px, 0.76vw, 12px);
  --cta-weight: 600;
  --cta-leading: 1.2;
  --cta-arrow-gap: 10px;
  --cta-arrow-shift: 4px;
  --cta-dark: rgba(238,235,228,0.74);
  --cta-dark-hover: rgba(250,248,244,0.96);
  --cta-light: rgba(11,22,38,0.66);
  --cta-light-hover: rgba(11,22,38,0.92);
  --btn-pad-y: 13px;
  --btn-pad-x: clamp(26px, 2.3vw, 34px);
  --btn-border-light: rgba(11,22,38,0.34);
  --btn-border-light-hover: rgba(11,22,38,0.62);
  --btn-border-dark: rgba(238,235,228,0.36);
  --btn-border-dark-hover: rgba(238,235,228,0.68);
}

.editorial-eyebrow--dark,
.section-eyebrow--dark {
  color: var(--eyebrow-light);
}

.editorial-eyebrow--light,
.section-eyebrow--light {
  color: var(--eyebrow-dark);
}

.editorial-eyebrow,
.section-eyebrow {
  font-size: var(--eyebrow-size);
  line-height: var(--eyebrow-leading);
}

.editorial-heading {
  font-size: var(--type-section-heading);
  line-height: var(--leading-heading);
  letter-spacing: -0.01em;
  margin-bottom: clamp(18px, 2vw, 26px);
}

.editorial-heading em {
  color: rgba(17, 29, 51, 0.48);
}

/* Button — restrained outlined style */
.editorial-cta,
.btn,
.text-link {
  font-family: var(--font-sans);
  font-size: var(--cta-size);
  font-weight: var(--cta-weight);
  letter-spacing: var(--cta-tracking);
  line-height: var(--cta-leading);
  text-transform: uppercase;
  text-decoration: none;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  width: fit-content;
  padding: var(--btn-pad-y) var(--btn-pad-x);
  border: 1px solid currentColor;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  transition: color 220ms ease, border-color 220ms ease, background-color 220ms ease, transform 180ms ease;
}

.btn--outline.btn--dark {
  color: var(--cta-dark);
  border-color: var(--btn-border-dark);
}

.btn--outline.btn--dark:hover,
.btn--outline.btn--dark:focus-visible {
  color: var(--cta-dark-hover);
  border-color: var(--btn-border-dark-hover);
  background-color: rgba(238,235,228,0.055);
  transform: translateY(-1px);
}

.btn--outline.btn--light {
  color: var(--cta-light);
  border-color: var(--btn-border-light);
}

.btn--outline.btn--light:hover,
.btn--outline.btn--light:focus-visible {
  color: var(--cta-light-hover);
  border-color: var(--btn-border-light-hover);
  background-color: rgba(11,22,38,0.045);
  transform: translateY(-1px);
}

.btn:focus-visible {
  outline: 1px solid currentColor;
  outline-offset: 5px;
}

.btn > span[aria-hidden="true"] {
  display: inline-block;
  transition: transform 200ms ease;
}

.btn:hover > span[aria-hidden="true"],
.btn:focus-visible > span[aria-hidden="true"] {
  transform: translateX(4px);
}

/* Text link — inline editorial CTA */
.text-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--cta-arrow-gap);
  min-height: 44px;
  width: auto;
  border: 0;
  background: transparent;
  transition: color 220ms ease;
}

.text-link--dark {
  color: var(--cta-light);
}

.text-link--dark:hover {
  color: var(--cta-light-hover);
}

.text-link--light {
  color: var(--cta-dark);
}

.text-link--light:hover {
  color: var(--cta-dark-hover);
}

.text-link:focus-visible {
  outline: 1px solid currentColor;
  outline-offset: 4px;
}

.text-link--arrow > span[aria-hidden="true"],
.text-link--arrow .link-arrow {
  display: inline-block;
  transition: transform 220ms ease;
}

.text-link--arrow:hover > span[aria-hidden="true"],
.text-link--arrow:hover .link-arrow,
.text-link--arrow:focus-visible > span[aria-hidden="true"] {
  transform: translateX(var(--cta-arrow-shift));
}

.text-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 7px;
  height: 1px;
  background: currentColor;
  opacity: 0.42;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 240ms ease, opacity 220ms ease;
}

.text-link:hover::after,
.text-link:focus-visible::after {
  transform: scaleX(1);
}


/* ─────────────────────────────────────────────────────────────
   2. INNER PAGE HERO
   Dark editorial hero — eyebrow, heading, body, CTA row.
   Quieter than the homepage hero. Image-backed or solid.
   ───────────────────────────────────────────────────────────── */

.ip-hero {
  position: relative;
  min-height: clamp(500px, 58vh, 680px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--surface-ink);
}

.ip-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.ip-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  filter: saturate(0.78) contrast(0.92) brightness(0.72) sepia(0.08);
}

.ip-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(100deg, rgba(5, 9, 15, 0.76) 0%, rgba(5, 9, 15, 0.44) 50%, rgba(5, 9, 15, 0.10) 100%),
    linear-gradient(180deg, rgba(5, 9, 15, 0.06) 0%, rgba(5, 9, 15, 0.38) 100%);
  pointer-events: none;
}

.ip-hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(104px, 12vh, 136px) var(--section-pad-x) clamp(48px, 6vh, 72px);
}

.ip-hero__eyebrow {
  margin-bottom: clamp(16px, 2vh, 24px);
  font-size: 10px;
  letter-spacing: 0.20em;
}

.ip-hero__heading {
  font-family: var(--font-serif);
  font-size: clamp(36px, 3.7vw, 58px);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -0.030em;
  color: var(--text-inverse);
  margin: 0 0 20px;
  max-width: 12em;
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
  text-shadow: 0 1px 20px rgba(0, 0, 0, 0.48), 0 1px 4px rgba(0, 0, 0, 0.32);
}

.ip-hero__heading-line {
  display: block;
  white-space: nowrap;
}

.ip-hero__heading em {
  font-style: italic;
  font-weight: 400;
  color: rgba(255,255,255,0.86);
  display: block;
  margin-top: 0.04em;
  letter-spacing: -0.024em;
  text-wrap: balance;
  white-space: nowrap;
}

.ip-hero__body {
  font-family: var(--font-sans);
  font-size: 15.5px;
  font-weight: 400;
  line-height: 1.76;
  color: rgba(255, 255, 255, 0.84);
  max-width: 62ch;
  margin: 0 0 32px;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.26);
}

.ip-hero__ctas {
  display: flex;
  align-items: center;
  gap: clamp(28px, 3.2vw, 48px);
  flex-wrap: wrap;
}

.ip-hero__ctas .text-link--light {
  color: rgba(238, 235, 228, 0.90);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.13em;
}

.ip-hero__ctas .text-link--light:hover {
  color: #fff;
}

/* ─────────────────────────────────────────────────────────────
   3. EDITORIAL SPLIT SECTION
   Image left / content right (or reversed with .ip-split--reverse).
   Light and dark variants.
   ───────────────────────────────────────────────────────────── */

.ip-split {
  padding: var(--section-pad-y) 0;
  background: var(--surface-light);
}

.ip-split--dark {
  background: var(--surface-dark);
}

.ip-split--warm {
  background: var(--surface-warm);
}

.ip-split__inner {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 var(--section-pad-x);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(48px, 6vw, 96px);
  align-items: center;
}

.ip-split--reverse .ip-split__inner {
  direction: rtl;
}

.ip-split--reverse .ip-split__content {
  direction: ltr;
}

.ip-split__image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}

.ip-split__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ip-split__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 520px;
}

.ip-split--reverse .ip-split__inner {
  direction: ltr;
}

.ip-split--reverse .ip-split__image { order: 2; }
.ip-split--reverse .ip-split__content { order: 1; }

/* ── Bleed-right variant: image extends to viewport right edge ── */
.ip-split--bleed-right {
  overflow: hidden;
  padding: 0;
}

.ip-split--bleed-right .ip-split__inner {
  max-width: none;
  margin: 0;
  padding-left: max(var(--section-pad-x), calc((100vw - 1360px) / 2 + var(--section-pad-x)));
  padding-right: 0;
  grid-template-columns: minmax(0, 540px) 1fr;
  align-items: stretch;
}

.ip-split--bleed-right .ip-split__content {
  padding: var(--section-pad-y) 0;
}

.ip-split--bleed-right .ip-split__image {
  aspect-ratio: unset;
  align-self: stretch;
}

.ip-split__eyebrow {
  margin-bottom: clamp(16px, 1.8vw, 24px);
}

.ip-split__heading {
  margin: 0 0 clamp(16px, 1.8vw, 24px);
}

.ip-split--dark .ip-split__heading {
  color: var(--text-inverse);
}

.ip-split--dark .editorial-heading em {
  color: rgba(238, 235, 228, 0.56);
}

.ip-split__body {
  font-family: var(--font-sans);
  font-size: var(--type-body);
  font-weight: var(--weight-body);
  line-height: var(--leading-body);
  color: var(--text-secondary);
  max-width: 48ch;
  margin: 0 0 clamp(24px, 2.8vw, 38px);
}

.ip-split--dark .ip-split__body {
  color: var(--text-inverse-secondary);
}

/* Buyers Local Expertise map — reuses the homepage community marker system. */
.buyers-local-map .cm-map-panel {
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: none;
  filter: none;
  isolation: isolate;
  overflow: hidden;
}

.buyers-local-map .cm-map-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  isolation: isolate;
  overflow: hidden;
}

.buyers-local-map .cm-map-frame::after {
  content: '';
  position: absolute;
  z-index: 2;
  inset: -1px;
  pointer-events: none;
  background:
    radial-gradient(
      ellipse at 62% 52%,
      transparent 42%,
      rgba(12, 18, 30, 0.044) 66%,
      rgba(8, 13, 22, 0.09) 100%
    ),
    radial-gradient(
      ellipse at center,
      transparent 68%,
      rgba(245, 241, 234, 0.38) 88%,
      rgba(245, 241, 234, 0.76) 100%
    );
  mix-blend-mode: multiply;
}

.buyers-local-map .cm-map-stage {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 100%;
  width: auto;
  min-width: 100%;
  aspect-ratio: 1682 / 935;
  isolation: isolate;
  transform: translate(-50%, -50%);
}

.buyers-local-map .cm-map-stage::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.76' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
  background-repeat: repeat;
  opacity: 0.036;
  mix-blend-mode: soft-light;
}

.buyers-local-map .cm-map-image {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  filter: contrast(0.99) brightness(1.022) saturate(0.92);
  pointer-events: none;
  user-select: none;
}

.buyers-local-map .cm-map-marker-layer {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

.buyers-local-map .cm-map-marker-layer .cm-map-marker {
  pointer-events: auto;
}

.buyers-local-map .cm-map-marker {
  --marker-x: 50%;
  --marker-y: 50%;
  --label-x: 14px;
  --label-y: -50%;
  position: absolute;
  left: var(--marker-x);
  top: var(--marker-y);
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(17, 29, 51, 0.62);
  font-family: var(--font-sans);
  font-size: clamp(0.58rem, 0.68vw, 0.72rem);
  font-weight: var(--weight-meta);
  letter-spacing: 0.2em;
  line-height: 1;
  text-transform: uppercase;
  cursor: pointer;
  opacity: 0.82;
  transform: translate(-50%, -50%);
  transition: opacity 180ms ease, transform 180ms ease, color 180ms ease;
  white-space: nowrap;
}

.buyers-local-map .cm-map-marker__dot {
  position: relative;
  display: block;
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border: 1.5px solid rgba(248, 245, 239, 0.9);
  border-radius: 999px;
  background: #85898c;
  box-shadow: 0 3px 9px rgba(17, 29, 51, 0.12);
  transition: width 180ms ease, height 180ms ease, flex-basis 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.buyers-local-map .cm-map-marker__dot::before {
  content: '';
  position: absolute;
  inset: -7px;
  border: 1px solid rgba(127, 133, 139, 0.16);
  border-radius: inherit;
  background: rgba(127, 133, 139, 0.08);
}

.buyers-local-map .cm-map-marker__label {
  position: absolute;
  left: var(--label-x);
  top: var(--label-y);
  display: block;
  text-shadow: 0 1px 10px rgba(248, 245, 239, 0.72);
}

.buyers-local-map.has-active .cm-map-marker:not(.is-active) {
  opacity: 0.64;
}

.buyers-local-map .cm-map-marker:hover,
.buyers-local-map .cm-map-marker:focus-visible,
.buyers-local-map .cm-map-marker.is-active {
  color: #08182e;
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.025);
}

.buyers-local-map .cm-map-marker:hover .cm-map-marker__dot,
.buyers-local-map .cm-map-marker:focus-visible .cm-map-marker__dot,
.buyers-local-map .cm-map-marker.is-active .cm-map-marker__dot {
  width: 12px;
  height: 12px;
  flex-basis: 12px;
  border-color: rgba(248, 245, 239, 0.98);
  background: #08182e;
  box-shadow: 0 5px 14px rgba(8, 24, 46, 0.18);
}

.buyers-local-map .cm-map-marker.is-active .cm-map-marker__label {
  font-weight: 800;
}

.buyers-local-map .cm-map-marker[data-community="burlington"] {
  font-size: clamp(0.65rem, 0.76vw, 0.82rem);
  font-weight: 600;
  letter-spacing: 0.24em;
  color: rgba(10, 19, 37, 0.90);
  opacity: 0.98;
}

.buyers-local-map .cm-map-marker[data-community="burlington"] .cm-map-marker__dot {
  width: 10px;
  height: 10px;
  flex-basis: 10px;
  background: rgba(10, 19, 37, 0.72);
  border-color: rgba(248, 245, 240, 0.96);
  box-shadow: 0 3px 12px rgba(10, 19, 37, 0.22);
}

.buyers-local-map .cm-map-marker[data-community="hamilton"],
.buyers-local-map .cm-map-marker[data-community="waterdown"] {
  font-size: clamp(0.58rem, 0.66vw, 0.72rem);
  font-weight: 500;
  letter-spacing: 0.20em;
  color: rgba(17, 29, 51, 0.80);
  opacity: 0.95;
}

.buyers-local-map .cm-map-marker.is-active {
  color: rgba(8, 18, 38, 0.94);
  opacity: 1;
}

.buyers-local-map .cm-map-marker.is-active .cm-map-marker__dot {
  background: #08182e;
  box-shadow: 0 4px 14px rgba(8, 24, 46, 0.24);
}

/* ─────────────────────────────────────────────────────────────
   REVEAL DELAY UTILITIES
   Staggered entrance for grid children.
   ───────────────────────────────────────────────────────────── */

.reveal-delay-1 { transition-delay: 0.08s; }
.reveal-delay-2 { transition-delay: 0.18s; }
.reveal-delay-3 { transition-delay: 0.28s; }
.reveal-delay-4 { transition-delay: 0.38s; }
.reveal-delay-5 { transition-delay: 0.48s; }
.reveal-delay-6 { transition-delay: 0.58s; }


/* ─────────────────────────────────────────────────────────────
   4. INSIGHT SECTION
   Advisory trust-builder. Editorial text blocks or short points.
   No SaaS cards. No heavy borders.
   ───────────────────────────────────────────────────────────── */

.ip-insight {
  padding: var(--section-pad-y) var(--section-pad-x);
  background: var(--surface-warm);
}

.ip-insight__inner {
  max-width: 1160px;
  margin: 0 auto;
}

.ip-insight__header {
  max-width: 640px;
  margin-bottom: clamp(44px, 5.2vw, 72px);
}

.ip-insight__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.ip-insight__heading {
  margin: 0;
}

.ip-insight__points {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: clamp(28px, 3.8vw, 56px);
}

.ip-insight__point {
  padding-top: clamp(20px, 2.2vw, 28px);
  border-top: 1px solid var(--border-medium);
}

.ip-insight__point-label {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--text-primary);
  margin: 0 0 clamp(10px, 1.1vw, 14px);
  line-height: 1.28;
}

.ip-insight__point-body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: var(--leading-small);
  color: var(--text-secondary);
  margin: 0;
}

/* ─────────────────────────────────────────────────────────────
   5. QUESTIONS SECTION
   Editorial four-column buyer/seller question grid.
   No cards. No shadows. Thin dividers. Playfair questions.
   ───────────────────────────────────────────────────────────── */

.ip-questions {
  padding: var(--section-pad-y) var(--section-pad-x);
  background: var(--surface-warm);
}

.ip-questions__inner {
  max-width: 1280px;
  margin: 0 auto;
}

.ip-questions__header {
  max-width: 680px;
  margin-bottom: clamp(36px, 4.4vw, 52px);
}

.ip-questions__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.ip-questions__heading {
  margin: 0;
}

.ip-questions__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.ip-questions__item {
  padding: 0 clamp(22px, 2.8vw, 40px);
  border-left: 1px solid rgba(11, 22, 38, 0.11);
}

.ip-questions__item:first-child {
  padding-left: 0;
  border-left: none;
}

.ip-questions__num {
  font-family: var(--font-serif);
  font-size: clamp(0.88rem, 1.0vw, 1.05rem);
  font-weight: 400;
  color: var(--gold-dark);
  line-height: 1;
  margin: 0 0 clamp(10px, 1.2vw, 16px);
  letter-spacing: 0.04em;
}

.ip-questions__label {
  font-family: var(--font-sans);
  font-size: var(--type-meta);
  font-weight: var(--weight-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.50);
  margin: 0 0 clamp(10px, 1.1vw, 14px);
  line-height: 1.4;
}

.ip-questions__accent {
  width: 20px;
  height: 1px;
  background: var(--gold-dark);
  margin-bottom: clamp(16px, 1.8vw, 22px);
  opacity: 0.65;
}

.ip-questions__question {
  font-family: var(--font-serif);
  font-size: clamp(1.16rem, 1.42vw, 1.54rem);
  font-weight: 500;
  line-height: 1.28;
  letter-spacing: -0.012em;
  color: var(--text-primary);
  margin: 0 0 clamp(12px, 1.3vw, 18px);
}

.ip-questions__question em {
  font-style: italic;
  font-weight: 400;
}

.ip-questions__body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: 400;
  line-height: 1.72;
  color: rgba(11, 22, 38, 0.72);
  margin: 0;
}

/* Tablet — 2 columns */
@media (max-width: 960px) {
  .ip-questions__grid {
    grid-template-columns: repeat(2, 1fr);
    row-gap: clamp(32px, 4.5vw, 48px);
  }

  .ip-questions__item:nth-child(3) {
    border-left: none;
    padding-left: 0;
  }
}

/* Mobile — single column */
@media (max-width: 600px) {
  .ip-questions__heading {
    max-width: 10.25em;
    font-size: clamp(1.65rem, 8.2vw, 2.125rem);
    line-height: 0.99;
  }

  .ip-questions__heading-line {
    display: block;
    white-space: nowrap;
  }

  .ip-questions__heading em {
    margin-top: 0.02em;
  }

  .ip-questions__grid {
    grid-template-columns: 1fr;
    row-gap: 0;
  }

  .ip-questions__item {
    border-left: none;
    padding-left: 0;
    padding-right: 0;
    padding-top: clamp(26px, 4vw, 36px);
    border-top: 1px solid rgba(11, 22, 38, 0.10);
  }

  .ip-questions__item:first-child {
    padding-top: 0;
    border-top: none;
  }
}


/* ─────────────────────────────────────────────────────────────
   6. PROCESS SECTION
   Numbered step flow. Suitable for Buyers and Sellers.
   Light and dark variants. Icon-optional.
   ───────────────────────────────────────────────────────────── */

.ip-process {
  padding: var(--section-pad-y) var(--section-pad-x);
  background: var(--surface-light);
}

.ip-process--dark {
  background: var(--surface-dark);
}

.ip-process__inner {
  max-width: 1160px;
  margin: 0 auto;
}

.ip-process__header {
  max-width: 600px;
  margin-bottom: clamp(36px, 4.4vw, 60px);
}

.ip-process__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.ip-process__heading {
  margin: 0;
}

/* Dark heading overrides */
.ip-process--dark .editorial-heading {
  color: var(--text-inverse);
}

.ip-process--dark .editorial-heading em {
  color: rgba(238, 235, 228, 0.52);
}

/* Grid */
.ip-process__steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(156px, 1fr));
  gap: clamp(18px, 2.4vw, 32px);
  counter-reset: step;
}

.ip-process--dark .ip-process__steps {
  grid-template-columns: repeat(3, 1fr);
  column-gap: clamp(32px, 4vw, 56px);
  row-gap: clamp(36px, 4.5vw, 52px);
}

/* Step */
.ip-process__step {
  padding-top: clamp(20px, 2.2vw, 28px);
  border-top: 1px solid var(--border-soft);
  counter-increment: step;
}

.ip-process--dark .ip-process__step {
  border-top-color: rgba(255, 255, 255, 0.10);
}

/* Number */
.ip-process__num {
  font-family: var(--font-serif);
  font-size: clamp(1.8rem, 2.2vw, 2.6rem);
  font-weight: 400;
  color: var(--text-subtle);
  line-height: 1;
  margin: 0 0 clamp(10px, 1.1vw, 14px);
}

.ip-process--dark .ip-process__num {
  color: rgba(238, 235, 228, 0.22);
}

.ip-process__num::before {
  content: "0" counter(step);
}

.ip-process__step:nth-child(n+10) .ip-process__num::before {
  content: counter(step);
}

/* Label */
.ip-process__label {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--text-primary);
  margin: 0 0 clamp(8px, 0.9vw, 12px);
  line-height: 1.28;
}

.ip-process--dark .ip-process__label {
  color: rgba(238, 235, 228, 0.86);
}

/* Body */
.ip-process__body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: var(--leading-small);
  color: var(--text-secondary);
  margin: 0;
}

.ip-process--dark .ip-process__body {
  color: rgba(238, 235, 228, 0.50);
}

/* ─────────────────────────────────────────────────────────────
   6. TESTIMONIAL SECTION — ct-section (shared design system)
   ───────────────────────────────────────────────────────────── */

.ct-section {
  background: #0D1116;
  padding: clamp(56px, 6.5vw, 86px) clamp(24px, 6vw, 80px);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.ct-inner {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}

.ct-eyebrow {
  color: rgba(245, 242, 236, 0.46);
  margin-bottom: clamp(10px, 1.2vw, 16px);
  display: block;
}

.ct-heading {
  color: rgba(245, 242, 236, 0.68);
  font-size: clamp(1.85rem, 2.55vw, 3.05rem);
  line-height: 1;
  margin-bottom: clamp(28px, 3.6vw, 44px);
}

.ct-carousel {
  display: grid;
  align-items: center;
  margin: 0 auto clamp(18px, 2.2vw, 28px);
}

.ct-slide {
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 900ms cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 900ms;
}

.ct-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 900ms cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0s;
}

.ct-quote {
  margin: 0;
  padding: 0;
  border: 0;
}

.ct-quote__text {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(1.90rem, 2.75vw, 3.38rem);
  font-weight: 400;
  font-style: italic;
  line-height: 1.2;
  color: rgba(245, 242, 236, 0.84);
  max-width: 18em;
  margin: 0 auto clamp(22px, 2.5vw, 34px);
}

.ct-quote__footer {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: clamp(6px, 0.8vw, 9px);
  font-family: var(--font-sans);
  font-size: clamp(0.62rem, 0.68vw, 0.74rem);
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(245, 242, 236, 0.34);
}

.ct-quote__name {
  color: rgba(245, 242, 236, 0.62);
}

.ct-quote__meta {
  letter-spacing: 0.10em;
  text-transform: none;
  color: rgba(245, 242, 236, 0.34);
}

/* Carousel dot controls — used on inner pages with multiple testimonials */
.ct-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: clamp(22px, 2.4vw, 32px);
}

.ct-control {
  width: 42px;
  height: 28px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  padding: 0;
  cursor: pointer;
  position: relative;
}

.ct-control::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 32px;
  height: 1px;
  transform: translate(-50%, -50%);
  background: rgba(245, 242, 236, 0.22);
  transition: background-color 260ms ease, width 260ms ease;
}

.ct-control.is-active::before,
.ct-control:hover::before,
.ct-control:focus-visible::before {
  width: 42px;
  background: rgba(245, 242, 236, 0.58);
}

.ct-control:focus-visible {
  outline: 1px solid rgba(245, 242, 236, 0.42);
  outline-offset: 5px;
}

.ct-more {
  margin-top: clamp(24px, 3vw, 38px);
  padding-top: clamp(16px, 1.8vw, 22px);
  border-top: 1px solid rgba(245, 242, 236, 0.06);
}

.ct-more__link {
  color: rgba(214, 196, 160, 0.50);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}

.ct-more__link:hover,
.ct-more__link:focus-visible {
  color: rgba(245, 242, 236, 0.84);
}

/* ─────────────────────────────────────────────────────────────
   CLOSING CTA — reuses .closing-cta from styles.css.
   No additional rules needed unless a page-specific variant
   is required in the future.
   ───────────────────────────────────────────────────────────── */


/* ─────────────────────────────────────────────────────────────
   CLOSING CTA — Inner page split layout
   Mirrors the homepage CTA pattern: text left, image right.
   Styles scoped to pages.css so homepage is unaffected.
   ───────────────────────────────────────────────────────────── */

/* Top padding only — section bleeds into the dark footer */
.closing-cta {
  padding: 0;
}

.closing-cta__inner {
  max-width: none;
  padding: 0;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
}

.closing-cta__left {
  width: min(100%, 720px);
  justify-self: end;
  padding: clamp(92px, 8.4vw, 136px) clamp(40px, 4.8vw, 72px) clamp(92px, 8.4vw, 136px) var(--section-pad-x);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.closing-cta__eyebrow {
  margin: 0 0 16px;
}

.closing-cta__heading {
  margin: 0 0 clamp(20px, 2.2vw, 30px);
  max-width: none;
}

.closing-cta__body {
  color: rgba(11, 22, 38, 0.42);
  max-width: 36ch;
  margin: 0 0 clamp(28px, 3vw, 40px);
}

.closing-cta__link {
  width: fit-content;
}

/* Right image block */
.closing-cta__media {
  position: relative;
  overflow: hidden;
  min-height: clamp(620px, 54vw, 820px);
  background: #050506;
  box-shadow: inset 1px 0 0 rgba(202, 164, 83, 0.28);
}

.closing-cta__photo {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: center 35%;
}

.closing-cta__photo-caption {
  position: absolute;
  left: clamp(20px, 2vw, 28px);
  bottom: clamp(20px, 2vw, 28px);
  margin: 0;
  padding: 8px 14px;
  background: rgba(5, 9, 15, 0.56);
  backdrop-filter: blur(4px);
  color: rgba(255, 255, 255, 0.92);
  font-family: var(--font-sans);
  font-size: clamp(10px, 0.74vw, 11px);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 2px;
}

.closing-cta__trust {
  margin: clamp(36px, 4vw, 52px) 0 0;
  color: rgba(11, 22, 38, 0.42);
  max-width: 58ch;
  text-wrap: balance;
}

/* Tablet/mobile: stack text above image */
@media (max-width: 860px) {
  .closing-cta {
    padding: clamp(64px, 9vw, 88px) 0 0;
  }

  .closing-cta__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .closing-cta__left {
    width: 100%;
    justify-self: stretch;
    padding: 0 clamp(24px, 5vw, 40px) clamp(36px, 6vw, 48px);
    justify-content: flex-start;
  }

  /* Image breaks to full viewport width on mobile */
  .closing-cta__media {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    min-height: 0;
    padding: 0;
  }

  .closing-cta__photo {
    height: clamp(440px, 68vh, 720px);
    min-height: 0;
    aspect-ratio: auto;
    object-fit: cover;
    object-position: 50% 42%;
  }
}


/* Footer styles live in styles.css — universal across all pages. */


/* ─────────────────────────────────────────────────────────────
   RESPONSIVE
   ───────────────────────────────────────────────────────────── */

@media (max-width: 960px) {

  /* Hero */
  .ip-hero {
    min-height: clamp(500px, 56svh, 620px);
  }

  .ip-hero__inner {
    max-width: 100%;
    padding-top: clamp(100px, 15vh, 124px);
    padding-bottom: clamp(42px, 6vh, 58px);
  }

  .ip-hero__heading {
    max-width: 12em;
  }

  .ip-hero__heading em {
    margin-top: 0.04em;
  }

  /* Split — stack on tablet */
  .ip-split__inner {
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 48px);
  }

  /* Keep content before image when stacked — explicit order, not DOM order */
  .ip-split--reverse .ip-split__image { order: 2; }
  .ip-split--reverse .ip-split__content { order: 1; }

  .ip-split__content {
    max-width: none;
  }

  /* Bleed-right — restore normal padding and stack image below content */
  .ip-split--bleed-right .ip-split__inner {
    padding: 0 var(--section-pad-x);
    grid-template-columns: 1fr;
    align-items: start;
  }

  .ip-split--bleed-right .ip-split__image {
    aspect-ratio: 4 / 3;
    min-height: unset;
    align-self: auto;
    /* Map/feature image: break out of inner padding to fill full width */
    margin-left: calc(-1 * var(--section-pad-x));
    margin-right: calc(-1 * var(--section-pad-x));
    width: calc(100% + 2 * var(--section-pad-x));
  }

  .buyers-local-map .cm-map-stage {
    width: 100%;
    height: auto;
    min-width: 100%;
    max-height: 100%;
    aspect-ratio: 1682 / 935;
  }

  .buyers-local-map .cm-map-marker {
    opacity: 1;
  }

  .buyers-local-map.has-active .cm-map-marker:not(.is-active) {
    opacity: 1;
  }

  /* Insight points — 2 columns on tablet */
  .ip-insight__points {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Process — 3 columns on tablet */
  .ip-process__steps {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Dark process — 2 columns on tablet */
  .ip-process--dark .ip-process__steps {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Testimonial */
  .ct-heading {
    font-size: clamp(1.85rem, 6.8vw, 2.55rem);
    margin-bottom: clamp(24px, 5vw, 36px);
  }

  .ct-quote__text {
    font-size: clamp(1.52rem, 5.8vw, 2.32rem);
  }
}

@media (max-width: 600px) {

  /* Hero */
  .ip-hero {
    min-height: clamp(480px, 60svh, 580px);
  }

  .ip-hero__heading {
    max-width: 100%;
    font-size: clamp(34px, 10.5vw, 46px);
    line-height: 1.04;
    letter-spacing: -0.030em;
    margin-bottom: 16px;
  }

  .ip-hero__heading em {
    margin-top: 0.04em;
    letter-spacing: -0.024em;
  }

  .ip-hero__body {
    max-width: 34rem;
    font-size: clamp(0.94rem, 3.8vw, 1.02rem);
    line-height: 1.62;
  }

  .ip-hero__ctas {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .buyers-local-map .cm-map-marker {
    font-size: 0.56rem;
    letter-spacing: 0.14em;
  }

  .buyers-local-map .cm-map-marker[data-community="waterdown"] {
    --label-x: 10px !important;
    --label-y: -16px !important;
  }

  /* Insight points — 1 column on mobile */
  .ip-insight__points {
    grid-template-columns: 1fr;
  }

  /* Process — 2 columns on mobile */
  .ip-process__steps {
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(16px, 4vw, 24px);
  }

  /* Dark process — single column on mobile */
  .ip-process--dark .ip-process__steps {
    grid-template-columns: 1fr;
    row-gap: clamp(32px, 5vw, 44px);
  }

  /* Testimonial */
  .ct-section {
    padding: clamp(48px, 11vw, 64px) 20px;
  }

  .ct-heading {
    font-size: clamp(1.72rem, 8.6vw, 2.18rem);
    margin-bottom: clamp(22px, 6vw, 34px);
  }

  .ct-quote__text {
    font-size: clamp(1.44rem, 7.4vw, 1.90rem);
    line-height: 1.24;
  }
}


/* ═══════════════════════════════════════════════════════════════
   LISTINGS PAGE
   .lp-featured  — editorial property cards with Odyssey links
   .lp-sold      — editorial representation archive / social proof directory
   ═══════════════════════════════════════════════════════════════ */

/* ── Listings hero image treatment ── */
.ip-hero--listings .ip-hero__bg img {
  filter: saturate(0.92) contrast(0.94) brightness(0.78) sepia(0.04);
  object-position: 62% 42%;
}

.ip-hero--listings .ip-hero__overlay {
  background:
    linear-gradient(
      108deg,
      rgba(8, 14, 28, 0.72) 0%,
      rgba(8, 14, 28, 0.36) 40%,
      rgba(8, 14, 28, 0.08) 64%,
      transparent 80%
    ),
    linear-gradient(
      to top,
      rgba(5, 9, 18, 0.66) 0%,
      rgba(5, 9, 18, 0.28) 32%,
      transparent 58%
    ),
    linear-gradient(
      to bottom,
      rgba(5, 9, 15, 0.20) 0%,
      transparent 18%
    );
}


/* ── Featured Listings section ── */

.lp-featured {
  padding: var(--section-pad-y) var(--section-pad-x);
  background: var(--surface-light);
}

.lp-featured__inner {
  max-width: 1280px;
  margin: 0 auto;
}

.lp-featured__header {
  max-width: 680px;
  margin-bottom: clamp(40px, 5vw, 64px);
}

.lp-featured__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.lp-featured__heading {
  margin: 0 0 clamp(16px, 1.8vw, 22px);
}

.lp-featured__intro {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: var(--leading-small);
  color: var(--text-secondary);
  max-width: 52ch;
  margin: 0;
}

.lp-featured__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: clamp(28px, 3.5vw, 48px);
  margin-bottom: clamp(36px, 4.5vw, 52px);
}

.lp-featured__note {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  line-height: 1.72;
  color: rgba(11, 22, 38, 0.46);
  max-width: 56ch;
  margin: 0;
}

.lp-inline-link {
  color: var(--text-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(11, 22, 38, 0.28);
  transition: text-decoration-color 200ms ease;
}

.lp-inline-link:hover {
  text-decoration-color: rgba(11, 22, 38, 0.72);
}


/* ── Property card ── */

.lp-card {
  display: flex;
  flex-direction: column;
  background: var(--surface-warm);
}

.lp-card__media-link {
  display: block;
  overflow: hidden;
}

.lp-card__media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.lp-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 600ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  filter: saturate(0.90) contrast(0.96) brightness(0.98);
}

.lp-card__media-link:hover .lp-card__media img,
.lp-card__media-link:focus-visible .lp-card__media img {
  transform: scale(1.025);
}

/* Status badge */
.lp-card__badge {
  position: absolute;
  top: 16px;
  left: 16px;
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.68vw, 10.5px);
  font-weight: 600;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  padding: 5px 10px;
  line-height: 1;
}

.lp-card__badge--active {
  background: rgba(11, 22, 38, 0.88);
  color: rgba(238, 235, 228, 0.96);
}

.lp-card__badge--coming-soon {
  background: rgba(238, 235, 228, 0.92);
  color: rgba(11, 22, 38, 0.78);
  border: 1px solid rgba(11, 22, 38, 0.12);
}

/* Card body */
.lp-card__body {
  padding: clamp(20px, 2.4vw, 28px) clamp(20px, 2.4vw, 28px) clamp(24px, 2.8vw, 32px);
  display: flex;
  flex-direction: column;
  flex: 1;
}

.lp-card__address {
  font-family: var(--font-serif);
  font-size: clamp(1.05rem, 1.32vw, 1.28rem);
  font-weight: 500;
  line-height: 1.24;
  color: var(--text-primary);
  margin: 0 0 6px;
  letter-spacing: -0.01em;
}

.lp-card__community {
  font-family: var(--font-sans);
  font-size: var(--type-meta);
  font-weight: var(--weight-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.44);
  margin: 0 0 clamp(14px, 1.6vw, 20px);
}

.lp-card__note {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.74;
  color: var(--text-secondary);
  margin: 0 0 clamp(18px, 2.2vw, 26px);
  flex: 1;
}

.lp-card__cta {
  margin-top: auto;
}


/* ── Successfully Represented Homes section ── */

.lp-sold {
  position: relative;
  padding: clamp(92px, 9vw, 144px) var(--section-pad-x);
  background:
    linear-gradient(90deg, rgba(250, 248, 244, 0.46), transparent 42%),
    var(--surface-warm);
  border-top: 1px solid rgba(11, 22, 38, 0.08);
}

.lp-sold__inner {
  max-width: 1280px;
  margin: 0 auto;
}

.lp-sold__header {
  max-width: 760px;
  margin-bottom: clamp(38px, 4.8vw, 62px);
}

.lp-sold__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.lp-sold__heading {
  margin: 0 0 clamp(16px, 1.8vw, 22px);
}

.lp-sold__intro {
  font-family: var(--font-sans);
  font-size: clamp(0.96rem, 1.04vw, 1.08rem);
  font-weight: var(--weight-body);
  line-height: 1.76;
  color: var(--text-secondary);
  max-width: 58ch;
  margin: 0;
}

.lp-sold__proof {
  display: grid;
  grid-template-columns: minmax(160px, 0.65fr) minmax(160px, 0.55fr) minmax(260px, 1fr);
  gap: clamp(22px, 3vw, 44px);
  align-items: stretch;
  margin-bottom: clamp(62px, 7.4vw, 104px);
  padding: clamp(24px, 2.8vw, 36px) 0;
  border-top: 1px solid rgba(11, 22, 38, 0.18);
  border-bottom: 1px solid rgba(11, 22, 38, 0.10);
}

.lp-sold__proof-item {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: clamp(10px, 1.2vw, 14px);
  min-height: 112px;
  padding-right: clamp(18px, 2.4vw, 34px);
  border-right: 1px solid rgba(11, 22, 38, 0.10);
}

.lp-sold__proof-item:last-child {
  border-right: none;
  padding-right: 0;
}

.lp-sold__proof-number {
  margin: 0;
  color: var(--text-primary);
  font-family: var(--font-serif);
  font-size: clamp(2.1rem, 4.4vw, 5.2rem);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 0.9;
}

.lp-sold__proof-item--wide .lp-sold__proof-number {
  max-width: 13ch;
  font-size: clamp(1.4rem, 2.2vw, 2.65rem);
  line-height: 1.02;
}

.lp-sold__proof-label {
  margin: 0;
  color: rgba(11, 22, 38, 0.48);
  font-family: var(--font-sans);
  font-size: var(--type-meta);
  font-weight: var(--weight-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  line-height: 1.35;
  text-transform: uppercase;
}

.lp-sold__archive {
  display: grid;
  grid-template-columns: minmax(230px, 0.32fr) minmax(0, 1fr);
  gap: clamp(58px, 7vw, 108px);
  align-items: start;
}

.lp-sold__context {
  position: sticky;
  top: clamp(86px, 9vh, 116px);
  padding-top: clamp(6px, 1vw, 12px);
}

.lp-sold__context-label {
  margin: 0 0 clamp(18px, 2vw, 26px);
  color: rgba(11, 22, 38, 0.48);
  font-family: var(--font-sans);
  font-size: var(--type-meta);
  font-weight: var(--weight-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  line-height: 1.35;
  text-transform: uppercase;
}

.lp-sold__context-copy {
  margin: 0 0 clamp(30px, 3.6vw, 46px);
  color: rgba(11, 22, 38, 0.58);
  font-family: var(--font-serif);
  font-size: clamp(1.22rem, 1.65vw, 1.72rem);
  font-weight: 400;
  line-height: 1.28;
  letter-spacing: -0.01em;
}

.lp-sold__region-list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  padding-top: clamp(24px, 2.6vw, 34px);
  border-top: 1px solid rgba(11, 22, 38, 0.10);
}

.lp-sold__region-list span {
  color: rgba(11, 22, 38, 0.48);
  font-family: var(--font-sans);
  font-size: clamp(0.62rem, 0.68vw, 0.72rem);
  font-weight: 600;
  letter-spacing: 0.12em;
  line-height: 1.25;
  text-transform: uppercase;
}

.lp-sold__communities {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.lp-sold__community {
  display: grid;
  grid-template-columns: clamp(42px, 5vw, 70px) minmax(clamp(270px, 19vw, 340px), 0.46fr) minmax(0, 1fr);
  gap: clamp(22px, 2.6vw, 38px);
  padding: clamp(44px, 5.4vw, 74px) 0;
  border-top: 1px solid rgba(11, 22, 38, 0.12);
  transition: border-color 240ms ease;
}

.lp-sold__community:first-child {
  padding-top: 0;
  border-top: 0;
}

.lp-sold__community:hover {
  border-top-color: rgba(11, 22, 38, 0.22);
}

.lp-sold__chapter {
  margin: 0;
  color: rgba(11, 22, 38, 0.32);
  font-family: var(--font-serif);
  font-size: clamp(1.42rem, 2.15vw, 2.4rem);
  font-style: italic;
  font-weight: 400;
  line-height: 1.02;
}

.lp-sold__community-head {
  max-width: 30ch;
  min-width: 0;
}

.lp-sold__community-name {
  font-family: var(--font-serif);
  font-size: clamp(1.92rem, 2.85vw, 3.25rem);
  font-weight: 500;
  line-height: 0.98;
  color: var(--text-primary);
  letter-spacing: -0.012em;
  margin: 0 0 clamp(12px, 1.4vw, 18px);
}

.lp-sold__community-note {
  margin: 0;
  color: rgba(11, 22, 38, 0.56);
  font-family: var(--font-sans);
  font-size: clamp(0.82rem, 0.88vw, 0.92rem);
  font-weight: var(--weight-body);
  line-height: 1.66;
}

.lp-sold__list {
  list-style: none;
  margin: 0;
  min-width: 0;
  padding: clamp(4px, 0.7vw, 10px) 0 0 clamp(18px, 2vw, 28px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2.2vw, 30px) clamp(28px, 3.2vw, 52px);
  border-left: 1px solid rgba(11, 22, 38, 0.10);
  transition: border-color 240ms ease;
}

.lp-sold__community:hover .lp-sold__list {
  border-left-color: rgba(11, 22, 38, 0.20);
}

.lp-sold__list li {
  min-height: 34px;
  display: flex;
  align-items: baseline;
  padding-bottom: 0;
}

.lp-sold__list span {
  color: rgba(11, 22, 38, 0.82);
  font-family: var(--font-serif);
  font-size: clamp(1.08rem, 1.36vw, 1.42rem);
  font-weight: 500;
  line-height: 1.26;
  letter-spacing: -0.006em;
}

/* ══════════════════════════════════════════════════════════════
   PROPERTY OPPORTUNITIES — editorial state-driven feature area
   Switch data-featured-state between: empty, active, coming-soon.
   ══════════════════════════════════════════════════════════════ */

.lp-opportunity {
  padding: var(--section-pad-y) var(--section-pad-x);
  background: var(--surface-light);
}

.lp-opportunity__inner {
  max-width: 1280px;
  margin: 0 auto;
}

.lp-feature-state {
  display: none;
}

.lp-opportunity[data-featured-state="active"] .lp-feature-state--active,
.lp-opportunity[data-featured-state="coming-soon"] .lp-feature-state--coming-soon,
.lp-opportunity[data-featured-state="empty"] .lp-feature-state--empty {
  display: block;
}

.lp-opportunity:not([data-featured-state="active"]) .lp-feature-state--active,
.lp-opportunity:not([data-featured-state="coming-soon"]) .lp-feature-state--coming-soon,
.lp-opportunity:not([data-featured-state="empty"]) .lp-feature-state--empty {
  display: none;
}

/* Magazine-style feature listing */

.lp-feature {
  display: grid;
  grid-template-columns: 1.32fr 1fr;
  gap: clamp(44px, 5.5vw, 80px);
  align-items: start;
}

/* When multiple listings exist in future, stack as editorial rows */
.lp-feature + .lp-feature {
  margin-top: clamp(56px, 7vw, 96px);
  padding-top: clamp(56px, 7vw, 96px);
  border-top: 1px solid rgba(11, 22, 38, 0.08);
}

.lp-feature__media-link {
  display: block;
  overflow: hidden;
}

.lp-feature__media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.lp-feature__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 700ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  filter: saturate(0.88) contrast(0.96) brightness(0.98);
}

.lp-feature__media-link:hover .lp-feature__media img,
.lp-feature__media-link:focus-visible .lp-feature__media img {
  transform: scale(1.018);
}

.lp-feature__badge {
  position: absolute;
  top: 20px;
  left: 20px;
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.68vw, 10.5px);
  font-weight: 600;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  padding: 6px 12px;
  line-height: 1;
  background: rgba(11, 22, 38, 0.88);
  color: rgba(238, 235, 228, 0.96);
}

.lp-feature__badge--light {
  background: rgba(238, 235, 228, 0.92);
  border: 1px solid rgba(11, 22, 38, 0.12);
  color: rgba(11, 22, 38, 0.74);
}

.lp-feature__media--coming-soon {
  background:
    linear-gradient(135deg, rgba(11, 22, 38, 0.07), transparent 46%),
    linear-gradient(180deg, rgba(238, 235, 228, 0.96), rgba(229, 224, 215, 0.72));
  border: 1px solid rgba(11, 22, 38, 0.08);
}

.lp-feature__media-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: clamp(24px, 3vw, 42px);
}

.lp-feature__placeholder-kicker {
  max-width: 16ch;
  margin: 0;
  color: rgba(11, 22, 38, 0.50);
  font-family: var(--font-serif);
  font-size: clamp(1.45rem, 2.4vw, 2.65rem);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.014em;
  line-height: 1.04;
}

.lp-feature__content {
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 4vw, 52px);
  padding-top: clamp(6px, 1.2vw, 18px);
}

.lp-feature__address {
  font-family: var(--font-serif);
  font-size: clamp(1.52rem, 2.1vw, 2.4rem);
  font-weight: 500;
  line-height: 1.08;
  color: var(--text-primary);
  margin: 0 0 clamp(6px, 0.7vw, 9px);
  letter-spacing: -0.014em;
}

.lp-feature__community {
  font-family: var(--font-sans);
  font-size: var(--type-meta);
  font-weight: var(--weight-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.44);
  margin: 0 0 clamp(18px, 2.2vw, 28px);
}

.lp-feature__copy {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.78;
  color: var(--text-secondary);
  max-width: 44ch;
  margin: 0 0 clamp(20px, 2.6vw, 30px);
}

/* Context panel — "Looking for something specific?" */

.lp-feature__context {
  padding: clamp(24px, 2.8vw, 36px);
  background: var(--surface-warm);
}

.lp-feature__context-heading {
  font-family: var(--font-serif);
  font-size: clamp(1.05rem, 1.28vw, 1.28rem);
  font-weight: 500;
  line-height: 1.26;
  color: var(--text-primary);
  letter-spacing: -0.01em;
  margin: 0 0 clamp(12px, 1.4vw, 16px);
}

.lp-feature__context-copy {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.76;
  color: var(--text-secondary);
  margin: 0 0 clamp(20px, 2.4vw, 28px);
}

.lp-empty-feature {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.42fr);
  gap: clamp(42px, 5.5vw, 76px);
  align-items: stretch;
  padding: clamp(36px, 4.5vw, 64px);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 48%),
    var(--surface-warm);
  border-top: 1px solid rgba(11, 22, 38, 0.12);
  border-bottom: 1px solid rgba(11, 22, 38, 0.08);
}

.lp-empty-feature__content {
  max-width: 760px;
}

.lp-empty-feature__eyebrow,
.lp-empty-feature__aside-label {
  margin: 0 0 clamp(16px, 1.8vw, 22px);
  color: rgba(11, 22, 38, 0.44);
  font-family: var(--font-sans);
  font-size: var(--type-meta);
  font-weight: var(--weight-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  line-height: 1.35;
  text-transform: uppercase;
}

.lp-empty-feature__heading {
  max-width: 12ch;
  margin: 0 0 clamp(22px, 2.8vw, 34px);
  color: var(--text-primary);
  font-family: var(--font-serif);
  font-size: clamp(2.4rem, 4.8vw, 5.9rem);
  font-weight: 500;
  letter-spacing: -0.026em;
  line-height: 0.96;
}

.lp-empty-feature__body {
  max-width: 68ch;
  margin: 0 0 clamp(16px, 2vw, 22px);
  color: var(--text-secondary);
  font-family: var(--font-sans);
  font-size: clamp(0.98rem, 1.06vw, 1.10rem);
  font-weight: var(--weight-body);
  line-height: 1.78;
}

.lp-empty-feature__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px clamp(22px, 3vw, 34px);
  align-items: center;
  margin-top: clamp(28px, 3.6vw, 44px);
}

.lp-empty-feature__secondary {
  display: inline-flex;
}

.lp-empty-feature__aside {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-left: clamp(26px, 3vw, 44px);
  border-left: 1px solid rgba(11, 22, 38, 0.10);
}

.lp-empty-feature__aside-copy {
  margin: 0;
  color: rgba(11, 22, 38, 0.54);
  font-family: var(--font-serif);
  font-size: clamp(1.16rem, 1.55vw, 1.62rem);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
  line-height: 1.34;
}

/* Responsive — Property Opportunities */

@media (max-width: 900px) {
  .lp-feature {
    grid-template-columns: 1fr;
    gap: clamp(32px, 5vw, 48px);
  }

  .lp-feature__content {
    padding-top: 0;
  }

  .lp-empty-feature {
    grid-template-columns: 1fr;
  }

  .lp-empty-feature__aside {
    padding-left: 0;
    padding-top: clamp(26px, 4vw, 36px);
    border-left: none;
    border-top: 1px solid rgba(11, 22, 38, 0.10);
  }
}

@media (max-width: 560px) {
  .lp-feature__address {
    font-size: clamp(1.38rem, 7.5vw, 1.9rem);
  }

  .lp-empty-feature {
    padding: clamp(28px, 7vw, 38px);
  }

  .lp-empty-feature__heading {
    font-size: clamp(2.25rem, 12vw, 3.6rem);
  }

  .lp-empty-feature__actions {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* ══════════════════════════════════════════════════════════════
   GEOFF'S PERSPECTIVE — advisor insight section
   Dark editorial section between featured properties and represented archive.
   ══════════════════════════════════════════════════════════════ */

.lp-advisor {
  padding: clamp(80px, 9vw, 128px) var(--section-pad-x);
  background: var(--surface-dark);
}

.lp-advisor__inner {
  max-width: 880px;
  margin: 0 auto;
}

.lp-advisor__eyebrow {
  color: rgba(238, 235, 228, 0.38);
  margin-bottom: clamp(18px, 2.2vw, 28px);
}

.lp-advisor__heading {
  color: var(--text-inverse);
  font-size: clamp(2.6rem, 3.6vw, 4.4rem);
  line-height: 1.0;
  letter-spacing: -0.022em;
  margin: 0 0 clamp(22px, 2.8vw, 36px);
}

.lp-advisor__heading em {
  color: rgba(238, 235, 228, 0.42);
  display: block;
  margin-top: 0.04em;
}

.lp-advisor__body {
  font-family: var(--font-sans);
  font-size: clamp(1.0rem, 1.06vw, 1.12rem);
  font-weight: var(--weight-body);
  line-height: 1.84;
  color: rgba(238, 235, 228, 0.58);
  max-width: 60ch;
  margin: 0;
}

@media (max-width: 600px) {
  .lp-advisor__heading {
    font-size: clamp(2.1rem, 9vw, 2.9rem);
    line-height: 1.04;
  }
}


/* ── Responsive: listings grid ── */

@media (max-width: 1100px) {
  .lp-sold__proof {
    grid-template-columns: 1fr;
    gap: clamp(14px, 2.5vw, 22px);
  }

  .lp-sold__proof-item {
    min-height: 0;
    padding-right: 0;
    padding-bottom: clamp(20px, 3vw, 28px);
    border-right: none;
    border-bottom: 1px solid rgba(11, 22, 38, 0.10);
  }

  .lp-sold__proof-item:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }

  .lp-sold__archive {
    grid-template-columns: 1fr;
    gap: clamp(42px, 5vw, 64px);
  }

  .lp-sold__context {
    position: static;
    max-width: 780px;
  }

  .lp-sold__context-copy {
    max-width: 34ch;
  }
}

@media (max-width: 860px) {
  .interior-page .closing-cta__media {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }
}

@media (max-width: 1250px) {
  .lp-sold__community {
    grid-template-columns: clamp(42px, 5vw, 64px) minmax(0, 1fr);
    grid-template-areas:
      "chapter head"
      "list list";
    column-gap: clamp(22px, 3vw, 36px);
  }

  .lp-sold__chapter {
    grid-area: chapter;
  }

  .lp-sold__community-head {
    grid-area: head;
    max-width: 48ch;
  }

  .lp-sold__list {
    grid-area: list;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    margin-left: calc(clamp(42px, 5vw, 64px) + clamp(22px, 3vw, 36px));
  }
}

@media (max-width: 800px) {
  .lp-sold__community {
    grid-template-columns: clamp(40px, 8vw, 56px) 1fr;
    grid-template-areas:
      "chapter head"
      "list list";
    gap: clamp(20px, 5vw, 30px) clamp(18px, 5vw, 30px);
    padding: clamp(42px, 8vw, 60px) 0;
  }

  .lp-sold__chapter {
    grid-area: chapter;
  }

  .lp-sold__community-head {
    grid-area: head;
  }

  .lp-sold__community-head {
    max-width: 46ch;
  }

  .lp-sold__list {
    grid-area: list;
    grid-template-columns: 1fr;
    margin-left: 0;
    padding-left: clamp(22px, 6vw, 32px);
  }

  .lp-featured__grid {
    grid-template-columns: 1fr;
    max-width: 480px;
  }
}

@media (max-width: 560px) {
  .lp-sold {
    padding-top: clamp(72px, 18vw, 94px);
    padding-bottom: clamp(72px, 18vw, 94px);
  }

  .lp-sold__header {
    margin-bottom: clamp(42px, 11vw, 56px);
  }

  .lp-sold__proof {
    margin-bottom: clamp(52px, 13vw, 72px);
    padding: clamp(22px, 6vw, 30px) 0;
  }

  .lp-sold__context-copy {
    font-size: clamp(1.15rem, 6vw, 1.42rem);
  }

  .lp-sold__community:hover {
    transform: none;
  }

  .lp-sold__community {
    grid-template-columns: 1fr;
    grid-template-areas:
      "chapter"
      "head"
      "list";
    gap: 16px;
  }

  .lp-sold__community-name {
    font-size: clamp(2rem, 11vw, 2.85rem);
  }

  .lp-sold__list {
    padding-left: clamp(20px, 7vw, 28px);
  }

  .lp-sold__region-list {
    gap: 8px 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lp-sold__community,
  .lp-sold__list {
    transition: none;
  }

  .lp-sold__community:hover {
    transform: none;
  }
}


/* ═══════════════════════════════════════════════════════════════
   INTERIOR HERO IMAGE TREATMENTS
   Structure, type, spacing, and responsive behaviour are shared.
   Variants only adjust each photograph's crop and tonal overlay.
   ═══════════════════════════════════════════════════════════════ */

.ip-hero--buyers .ip-hero__bg img {
  filter: saturate(0.9) contrast(0.92) brightness(0.74) sepia(0.02);
  object-position: 68% 46%;
}

.ip-hero--buyers .ip-hero__overlay {
  background:
    linear-gradient(
      108deg,
      rgba(8, 14, 28, 0.68) 0%,
      rgba(8, 14, 28, 0.38) 36%,
      rgba(8, 14, 28, 0.08) 60%,
      transparent 76%
    ),
    linear-gradient(
      to top,
      rgba(5, 9, 18, 0.68) 0%,
      rgba(5, 9, 18, 0.32) 32%,
      transparent 56%
    ),
    linear-gradient(
      to bottom,
      rgba(5, 9, 15, 0.18) 0%,
      transparent 16%
    );
}

.ip-hero--sellers .ip-hero__bg img {
  filter: saturate(1.04) contrast(1.0) brightness(1.08) sepia(0);
  object-position: 64% 48%;
}

.ip-hero--sellers .ip-hero__overlay {
  background:
    linear-gradient(
      110deg,
      rgba(6, 12, 26, 0.58) 0%,
      rgba(6, 12, 26, 0.30) 38%,
      rgba(6, 12, 26, 0.06) 60%,
      transparent 76%
    ),
    linear-gradient(
      to top,
      rgba(4, 8, 18, 0.42) 0%,
      rgba(4, 8, 18, 0.16) 28%,
      transparent 52%
    );
}


/* ═══════════════════════════════════════════════════════════════
   BUYING PROCESS — Scroll-driven step reveal
   Two-column sticky layout on desktop; tap accordion on mobile.
   Prefix: bp- (buying process). Self-contained design tokens.
   ═══════════════════════════════════════════════════════════════ */

/* ── Section-scoped design tokens ────────────────────────────── */
.bp-section {
  --bp-bg:             #07090f;
  --bp-nav-h:          88px;
  --bp-border:         rgba(238, 235, 228, 0.08);
  --bp-border-active:  rgba(238, 235, 228, 0.20);
  --bp-num-color:      rgba(238, 235, 228, 0.28);
  --bp-step-rest:      rgba(238, 235, 228, 0.46);
  --bp-step-active:    #ffffff;
  --bp-desc:           rgba(238, 235, 228, 0.76);
  --bp-ease:           cubic-bezier(0.25, 0, 0.15, 1);
  --bp-dur:            340ms;
  background: var(--bp-bg);
  /* overflow: clip keeps visual cropping without creating a scroll context,
     which allows position: sticky inside to work against the document. */
  overflow: clip;
}

/* ── Two-column grid ──────────────────────────────────────────── */
.bp-inner {
  display: grid;
  grid-template-columns: 46fr 54fr;
  max-width: 1440px;
  margin: 0 auto;
}

/* ─────────────────────────────────────────────────────────────
   LEFT: sticky media panel
   ───────────────────────────────────────────────────────────── */
.bp-media {
  position: sticky;
  /* Centre the panel in the viewport: top = (100vh - height) / 2.
     max() ensures it never creeps behind the fixed nav. */
  top: max(var(--bp-nav-h), calc(50vh - 34vh));
  height: 68vh;
  overflow: hidden;
  align-self: start; /* required for sticky inside a grid */
}

.bp-media__frame {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Crossfading slides */
.bp-media__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  filter: saturate(0.76) brightness(0.70);
  transform: scale(1.04);
  transition:
    opacity var(--bp-dur) var(--bp-ease),
    transform calc(var(--bp-dur) * 1.8) var(--bp-ease);
  will-change: opacity, transform;
}

.bp-media__slide.is-active {
  opacity: 1;
  transform: scale(1.0);
  z-index: 1;
}

/* Clarity image: shift right to keep the foreground planter visible */
.bp-media__slide--clarity {
  object-position: 62% center;
}

/* Cinematic gradient overlay */
.bp-media__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(to right,  rgba(7, 9, 15, 0.22) 0%,  transparent 45%),
    linear-gradient(to top,    rgba(7, 9, 15, 0.58) 0%,  transparent 55%),
    linear-gradient(to bottom, rgba(7, 9, 15, 0.30) 0%,  transparent 24%);
}

/* Step caption — bottom-left corner of media */
.bp-media__caption {
  position: absolute;
  bottom: clamp(24px, 3.5vh, 44px);
  left: clamp(24px, 3.2vw, 40px);
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.bp-media__caption-num {
  font-family: var(--font-sans);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(238, 235, 228, 0.40);
  line-height: 1;
}

.bp-media__caption-label {
  font-family: var(--font-serif);
  font-size: clamp(13px, 1.1vw, 17px);
  font-weight: 400;
  font-style: italic;
  color: rgba(238, 235, 228, 0.64);
  line-height: 1.2;
  transition: opacity var(--bp-dur) var(--bp-ease);
}

.bp-media__caption-context {
  font-family: var(--font-sans);
  font-size: clamp(10px, 0.82vw, 12px);
  font-weight: 400;
  letter-spacing: 0.01em;
  color: rgba(238, 235, 228, 0.34);
  line-height: 1.4;
  margin-top: 2px;
  transition: opacity var(--bp-dur) var(--bp-ease);
}

/* ─────────────────────────────────────────────────────────────
   RIGHT: content panel
   ───────────────────────────────────────────────────────────── */
.bp-content {
  display: flex;
  flex-direction: column;
  padding:
    clamp(64px, 8vw, 108px)
    clamp(44px, 5.5vw, 88px)
    clamp(200px, 28vw, 360px)
    clamp(52px, 5.5vw, 80px);
  border-left: 1px solid var(--bp-border);
}

/* ── Section header ───────────────────────────────────────────── */
.bp-header {
  margin-bottom: clamp(36px, 5vw, 60px);
}

.bp-eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

/* Bridge statement — quiet connective tissue between headline and steps */
.bp-bridge {
  font-family: var(--font-sans);
  font-size: clamp(0.88rem, 0.94vw, 0.98rem);
  font-weight: 400;
  line-height: 1.7;
  color: rgba(238, 235, 228, 0.44);
  margin: clamp(18px, 2.2vw, 28px) 0 0;
  max-width: 42ch;
}

/* Override the global editorial-heading color for this dark context */
.bp-heading.editorial-heading {
  font-size: clamp(2.2rem, 2.9vw, 3.8rem);
  color: #ffffff;
  margin: 0;
}

.bp-heading.editorial-heading em {
  color: rgba(238, 235, 228, 0.44);
}

/* ── Steps list ───────────────────────────────────────────────── */
.bp-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
}

/* ── Individual step ──────────────────────────────────────────── */
.bp-step {
  border-top: 1px solid var(--bp-border);
  transition: border-top-color var(--bp-dur) var(--bp-ease);
}

.bp-step:last-child {
  border-bottom: 1px solid var(--bp-border);
}

.bp-step.is-active {
  border-top-color: var(--bp-border-active);
}

/* ── Step trigger button ──────────────────────────────────────── */
.bp-step__trigger {
  display: flex;
  align-items: center;
  width: 100%;
  gap: clamp(14px, 1.8vw, 22px);
  padding: clamp(20px, 2.6vw, 34px) 0;
  background: transparent;
  border: none;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  color: var(--bp-step-rest);
  transition: color var(--bp-dur) var(--bp-ease);
}

.bp-step.is-active .bp-step__trigger {
  color: var(--bp-step-active);
}

.bp-step__trigger:hover:not(:focus-visible) {
  color: rgba(238, 235, 228, 0.82);
}

.bp-step__trigger:focus-visible {
  outline: 1px solid rgba(238, 235, 228, 0.36);
  outline-offset: 4px;
  border-radius: 2px;
  color: rgba(238, 235, 228, 0.82);
}

/* Step number */
.bp-step__num {
  font-family: var(--font-serif);
  font-size: clamp(0.78rem, 0.92vw, 0.98rem);
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1;
  color: var(--bp-num-color);
  flex-shrink: 0;
  min-width: 24px;
  transition: color var(--bp-dur) var(--bp-ease);
}

.bp-step.is-active .bp-step__num {
  color: rgba(238, 235, 228, 0.50);
}

/* Step title */
.bp-step__title {
  flex: 1;
  font-family: var(--font-sans);
  font-size: clamp(1.0rem, 1.4vw, 1.52rem);
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.2;
  color: inherit;
}

/* Chevron — border-trick arrow */
.bp-step__chevron {
  flex-shrink: 0;
  width: 13px;
  height: 13px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  opacity: 0.34;
  transition:
    transform var(--bp-dur) var(--bp-ease),
    opacity   var(--bp-dur) var(--bp-ease);
}

.bp-step.is-active .bp-step__chevron {
  transform: rotate(-135deg) translate(-2px, -2px);
  opacity: 0.60;
}

/* ── Step description — CSS grid accordion ────────────────────── */
.bp-step__panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--bp-dur) var(--bp-ease);
}

.bp-step.is-active .bp-step__panel {
  grid-template-rows: 1fr;
}

/* Inner wrapper is required for the grid-row trick */
.bp-step__panel-inner {
  overflow: hidden;
  min-height: 0;
}

.bp-step__desc {
  font-family: var(--font-sans);
  font-size: clamp(0.90rem, 0.98vw, 1.02rem);
  font-weight: 400;
  line-height: 1.78;
  color: var(--bp-desc);
  margin: 0;
  padding-top: clamp(2px, 0.4vw, 6px);
  padding-bottom: clamp(22px, 2.8vw, 36px);
  padding-left: clamp(38px, 4.2vw, 46px); /* visually aligned under the title */
  max-width: 48ch;
}

/* ── Reduced motion: static, all open ────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .bp-media__slide {
    transition: opacity 160ms ease !important;
    transform: none !important;
  }
  .bp-step__panel {
    transition: none !important;
  }
  .bp-step__trigger,
  .bp-step__chevron,
  .bp-step__num {
    transition: none !important;
  }
  /* JS will open all panels — ensure they're visible with no animation */
  .bp-step.is-active .bp-step__panel {
    grid-template-rows: 1fr;
  }
}

/* ─────────────────────────────────────────────────────────────
   RESPONSIVE — Buying Process
   ───────────────────────────────────────────────────────────── */

/* 1200px — tighter columns */
@media (max-width: 1200px) {
  .bp-inner {
    grid-template-columns: 44fr 56fr;
  }
  .bp-content {
    padding:
      clamp(56px, 7vw, 88px)
      clamp(32px, 4.5vw, 64px)
      clamp(56px, 7vw, 88px)
      clamp(36px, 4.5vw, 64px);
  }
}

/* 1024px — narrow media panel */
@media (max-width: 1024px) {
  .bp-inner {
    grid-template-columns: 40fr 60fr;
  }
  .bp-content {
    padding:
      clamp(48px, 6.5vw, 80px)
      clamp(28px, 4vw, 52px)
      clamp(48px, 6.5vw, 80px)
      clamp(28px, 4vw, 52px);
  }
  .bp-step__desc {
    max-width: 100%;
  }
}

/* 900px — stack: image top / accordion below ─────────────────── */
@media (max-width: 900px) {
  .bp-section {
    --bp-nav-h: 76px;
  }

  .bp-inner {
    display: block;
  }

  /* Media becomes a static banner, not sticky */
  .bp-media {
    position: relative;
    top: auto;
    height: 60vw;
    min-height: 280px;
    max-height: 500px;
    align-self: auto;
  }

  /* Content panel: no left border, top border instead */
  .bp-content {
    border-left: none;
    border-top: 1px solid var(--bp-border);
    padding: clamp(44px, 7vw, 72px) var(--section-pad-x) clamp(56px, 8vw, 80px);
  }

  /* Caption sits lower on smaller image */
  .bp-media__caption {
    bottom: clamp(20px, 3vh, 32px);
    left: clamp(20px, 4vw, 32px);
  }
}

/* 600px — mobile ─────────────────────────────────────────────── */
@media (max-width: 600px) {
  .bp-section {
    --bp-nav-h: 60px;
  }

  .bp-media {
    height: 66vw;
    min-height: 240px;
    max-height: 380px;
  }

  .bp-header {
    margin-bottom: clamp(32px, 6vw, 48px);
  }

  .bp-heading.editorial-heading {
    font-size: clamp(1.9rem, 7.5vw, 2.8rem);
  }

  .bp-step__desc {
    font-size: 0.94rem;
    padding-left: clamp(24px, 6.5vw, 38px);
    max-width: 100%;
  }
}

/* 375px — very small mobile ──────────────────────────────────── */
@media (max-width: 375px) {
  .bp-media {
    height: 72vw;
    max-height: 320px;
  }

  .bp-step__desc {
    padding-left: 0;
  }

  .bp-step__trigger {
    gap: 12px;
  }
}

/* Community map callout stability — matches the Home page marker behavior. */
.buyers-local-map .cm-map-marker {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.buyers-local-map .cm-map-marker:hover .cm-map-marker__dot,
.buyers-local-map .cm-map-marker:focus-visible .cm-map-marker__dot,
.buyers-local-map .cm-map-marker.is-active .cm-map-marker__dot {
  width: 12px;
  height: 12px;
  flex-basis: 12px;
  border-color: rgba(248, 245, 239, 0.98);
  background: #08182e;
  box-shadow: 0 5px 14px rgba(8, 24, 46, 0.18);
}

@media (max-width: 850px) {
  .buyers-local-map .cm-map-marker,
  .buyers-local-map.has-active .cm-map-marker:not(.is-active) {
    opacity: 1;
  }

  .buyers-local-map .cm-map-marker .cm-map-marker__label,
  .buyers-local-map .cm-map-marker[data-community="waterdown"]:not(.is-active) .cm-map-marker__label,
  .buyers-local-map .cm-map-marker:not(.is-active) .cm-map-marker__label {
    display: block;
    visibility: visible;
    opacity: 1;
  }
}


/* ═══════════════════════════════════════════════════════════════
   LOCAL INSIGHT PAGE
   .li-intro        — opening editorial statement
   .li-community    — per-community content section
   .li-observations — editorial observation folios
   .li-notes        — editorial observation cards
   ═══════════════════════════════════════════════════════════════ */

/* ── Hero image treatment ── */
.ip-hero--local-insight .ip-hero__bg img {
  /* Flip horizontally: navy lake (dark) moves to the left under text,
     cream escarpment (light) shows on the right — natural contrast, no heavy overlay needed */
  transform: scaleX(-1);
  filter: saturate(0.72) contrast(1.0) brightness(1.06);
  object-position: 50% 50%;
}

.ip-hero--local-insight .ip-hero__overlay {
  background:
    /* Left cover — dark enough to ensure all text is comfortably legible */
    linear-gradient(
      100deg,
      rgba(5, 10, 20, 0.86) 0%,
      rgba(5, 10, 20, 0.76) 22%,
      rgba(5, 10, 20, 0.48) 42%,
      rgba(5, 10, 20, 0.14) 58%,
      transparent 72%
    ),
    /* Bottom vignette */
    linear-gradient(
      to top,
      rgba(4, 8, 18, 0.52) 0%,
      rgba(4, 8, 18, 0.16) 20%,
      transparent 40%
    ),
    /* Top edge */
    linear-gradient(
      to bottom,
      rgba(4, 8, 18, 0.22) 0%,
      transparent 12%
    );
}

@media (max-width: 680px) {
  .ip-hero--local-insight .ip-hero__overlay {
    background:
      linear-gradient(
        to right,
        rgba(5, 10, 20, 0.90) 0%,
        rgba(5, 10, 20, 0.82) 40%,
        rgba(5, 10, 20, 0.60) 70%,
        rgba(5, 10, 20, 0.30) 100%
      ),
      linear-gradient(
        to top,
        rgba(4, 8, 18, 0.52) 0%,
        rgba(4, 8, 18, 0.16) 20%,
        transparent 40%
      );
  }
}


/* ── Community section — shared base ── */

.li-community {
  position: relative;
  padding: clamp(86px, 9vw, 140px) var(--section-pad-x);
  background: var(--surface-warm);
}

.li-community::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(250, 248, 244, 0.42), transparent 42%),
    radial-gradient(ellipse at 82% 22%, rgba(255, 255, 255, 0.34), transparent 38%);
}

.li-community--burlington {
  background: #eee9df;
}

.li-community--dark {
  background: var(--surface-ink);
}

.li-community--dark::before {
  background:
    linear-gradient(90deg, rgba(238, 235, 228, 0.055), transparent 46%),
    radial-gradient(ellipse at 72% 28%, rgba(113, 128, 145, 0.16), transparent 44%);
}

.li-community--waterdown {
  background: #f4f1ea;
}

.li-community--waterdown::before {
  background:
    linear-gradient(90deg, transparent 0%, rgba(222, 217, 205, 0.52) 58%, transparent 100%),
    radial-gradient(ellipse at 18% 78%, rgba(114, 128, 102, 0.12), transparent 42%);
}

.li-community__inner {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(280px, 0.92fr) minmax(0, 1.08fr);
  grid-template-areas:
    "header visual"
    "header observations";
  gap: clamp(30px, 4vw, 56px) clamp(58px, 7vw, 116px);
  align-items: center;
}

.li-community--hamilton .li-community__inner {
  grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
  grid-template-areas:
    "visual header"
    "observations header";
}

.li-community--waterdown .li-community__inner {
  grid-template-columns: minmax(300px, 0.98fr) minmax(0, 1.02fr);
  grid-template-areas:
    "header observations"
    "visual observations";
  align-items: start;
}

.li-community__header {
  grid-area: header;
  position: sticky;
  top: clamp(86px, 9vh, 116px);
  align-self: start;
  padding-top: clamp(8px, 1.2vw, 18px);
}

.li-community__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.li-community__heading {
  font-size: clamp(2.65rem, 4.35vw, 5.4rem);
  line-height: 0.98;
  margin: 0 0 clamp(22px, 2.6vw, 34px);
}

.li-community__heading--inverse {
  color: var(--text-inverse);
}

.li-community__heading--inverse em {
  color: rgba(238, 235, 228, 0.52);
}

.li-community__body {
  font-family: var(--font-sans);
  font-size: clamp(0.95rem, 1.04vw, 1.08rem);
  font-weight: var(--weight-body);
  line-height: 1.78;
  color: var(--text-secondary);
  max-width: 48ch;
  margin: 0 0 clamp(14px, 1.6vw, 18px);
}

.li-community__body:last-child { margin-bottom: 0; }

.li-community__body--inverse {
  color: rgba(238, 235, 228, 0.62);
}

/* ── Editorial community visuals and observations ── */

.li-community__visual {
  grid-area: visual;
  position: relative;
  min-height: clamp(320px, 34vw, 500px);
  overflow: hidden;
  isolation: isolate;
  background: rgba(11, 22, 38, 0.08);
  box-shadow: 0 24px 58px rgba(11, 22, 38, 0.12);
}

.li-community__visual::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(to top, rgba(7, 12, 20, 0.50), transparent 48%),
    linear-gradient(115deg, rgba(250, 248, 244, 0.08), transparent 36%);
}

.li-community__visual img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  filter: saturate(0.88) contrast(0.94) brightness(0.94);
  transform: scale(1.01);
  transition: transform 900ms cubic-bezier(0.22, 1, 0.36, 1), filter 900ms ease;
}

.li-community__visual:hover img {
  filter: saturate(0.96) contrast(0.98) brightness(0.98);
  transform: scale(1.035);
}

.li-community__visual--dark {
  box-shadow: 0 28px 66px rgba(0, 0, 0, 0.34);
}

.li-community__visual--dark img {
  filter: saturate(0.72) contrast(0.96) brightness(0.78);
}

.li-community__caption {
  position: absolute;
  z-index: 2;
  left: clamp(18px, 2.2vw, 30px);
  right: clamp(18px, 2.2vw, 30px);
  bottom: clamp(18px, 2.2vw, 30px);
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding-top: clamp(14px, 1.4vw, 18px);
  border-top: 1px solid rgba(255, 255, 255, 0.34);
  color: rgba(255, 255, 255, 0.86);
  font-family: var(--font-sans);
  font-size: clamp(0.68rem, 0.76vw, 0.78rem);
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.li-community__caption span:last-child {
  max-width: 24ch;
  color: rgba(255, 255, 255, 0.64);
  text-align: right;
}

.li-observations {
  grid-area: observations;
  position: relative;
  display: flex;
  flex-direction: column;
  border-top: 1px solid rgba(11, 22, 38, 0.20);
  border-bottom: 1px solid rgba(11, 22, 38, 0.12);
  background: rgba(250, 248, 244, 0.30);
  backdrop-filter: blur(8px);
}

.li-observations--dark {
  border-top-color: rgba(238, 235, 228, 0.20);
  border-bottom-color: rgba(238, 235, 228, 0.10);
  background: rgba(238, 235, 228, 0.035);
}

.li-observations--waterdown {
  margin-top: clamp(18px, 2.4vw, 32px);
}

.li-pullquote {
  position: relative;
  margin: 0;
  padding: clamp(28px, 3.4vw, 44px) clamp(26px, 3.2vw, 42px);
  border-bottom: 1px solid rgba(11, 22, 38, 0.12);
  color: rgba(11, 22, 38, 0.84);
  font-family: var(--font-serif);
  font-size: clamp(1.35rem, 2vw, 2.1rem);
  font-weight: 400;
  line-height: 1.22;
}

.li-pullquote::before {
  content: '';
  position: absolute;
  top: clamp(18px, 2vw, 28px);
  left: 0;
  width: 2px;
  height: clamp(42px, 5vw, 70px);
  background: rgba(11, 22, 38, 0.34);
}

.li-street-ledger {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid rgba(238, 235, 228, 0.10);
}

.li-street-ledger span {
  min-height: 74px;
  padding: 18px 18px 16px;
  border-right: 1px solid rgba(238, 235, 228, 0.08);
  color: rgba(238, 235, 228, 0.56);
  font-family: var(--font-sans);
  font-size: clamp(0.62rem, 0.68vw, 0.72rem);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.li-street-ledger span:last-child {
  border-right: 0;
}

.li-observation {
  display: grid;
  grid-template-columns: clamp(48px, 5vw, 72px) 1fr;
  gap: clamp(18px, 2vw, 26px);
  padding: clamp(26px, 3.1vw, 40px) clamp(24px, 3vw, 40px);
  border-bottom: 1px solid rgba(11, 22, 38, 0.10);
  transition: background-color 260ms ease, transform 260ms ease;
}

.li-observation:last-child {
  border-bottom: 0;
}

.li-observation:hover {
  background: rgba(255, 255, 255, 0.26);
  transform: translateX(4px);
}

.li-observation__num {
  display: block;
  color: rgba(11, 22, 38, 0.48);
  font-family: var(--font-serif);
  font-size: clamp(1.7rem, 2.4vw, 2.6rem);
  font-weight: 400;
  font-style: italic;
  line-height: 1;
}

.li-observation__title {
  margin: 0 0 clamp(8px, 1vw, 12px);
  color: rgba(11, 22, 38, 0.94);
  font-family: var(--font-serif);
  font-size: clamp(1.05rem, 1.28vw, 1.34rem);
  font-weight: 500;
  line-height: 1.24;
}

.li-observation__copy p {
  font-family: var(--font-sans);
  font-size: clamp(0.88rem, 0.96vw, 0.99rem);
  font-weight: 400;
  line-height: 1.76;
  color: rgba(11, 22, 38, 0.74);
  margin: 0;
}

.li-observations--dark .li-observation {
  border-bottom-color: rgba(238, 235, 228, 0.09);
}

.li-observations--dark .li-observation:hover {
  background: rgba(238, 235, 228, 0.045);
}

.li-observations--dark .li-observation__num {
  color: rgba(238, 235, 228, 0.50);
}

.li-observations--dark .li-observation__title {
  color: rgba(250, 248, 244, 0.94);
}

.li-observations--dark .li-observation__copy p {
  color: rgba(238, 235, 228, 0.74);
}


/* ── Geoff's Notes — editorial observation cards ── */

.li-notes {
  padding: var(--section-pad-y) var(--section-pad-x);
  background: var(--surface-light);
}

.li-notes__inner {
  max-width: 1280px;
  margin: 0 auto;
}

.li-notes__header {
  max-width: 640px;
  margin-bottom: clamp(44px, 5.5vw, 72px);
}

.li-notes__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.li-notes__heading {
  margin: 0;
}

.li-notes__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(2px, 0.2vw, 4px);
}

.li-note {
  padding: clamp(28px, 3.2vw, 40px) clamp(24px, 2.8vw, 36px);
  background: var(--surface-warm);
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 1.6vw, 18px);
}

.li-note__heading {
  font-family: var(--font-serif);
  font-size: clamp(1.02rem, 1.18vw, 1.24rem);
  font-weight: 500;
  line-height: 1.30;
  letter-spacing: -0.010em;
  color: var(--text-primary);
  margin: 0;
}

.li-note__body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.76;
  color: rgba(11, 22, 38, 0.62);
  margin: 0;
}


/* ── Responsive ── */

@media (max-width: 1060px) {
  .li-community__inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "header"
      "visual"
      "observations";
    gap: clamp(36px, 5vw, 52px);
  }

  .li-community--hamilton .li-community__inner,
  .li-community--waterdown .li-community__inner {
    grid-template-columns: 1fr;
    grid-template-areas:
      "header"
      "visual"
      "observations";
  }

  .li-community__header {
    position: static;
    max-width: 680px;
  }

  .li-community__body {
    max-width: none;
  }

  .li-community__visual {
    min-height: clamp(300px, 58vw, 520px);
  }

  .li-observations {
    max-width: none;
  }

  .li-notes__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 680px) {
  .li-notes__grid {
    grid-template-columns: 1fr;
  }

  .li-community__inner {
    gap: clamp(28px, 6vw, 40px);
  }

  .li-community {
    padding-top: clamp(72px, 18vw, 92px);
    padding-bottom: clamp(72px, 18vw, 92px);
  }

  .li-community__heading {
    font-size: clamp(2.25rem, 11.5vw, 3.25rem);
  }

  .li-community__visual {
    min-height: clamp(280px, 76vw, 390px);
  }

  .li-community__caption {
    flex-direction: column;
    gap: 8px;
  }

  .li-community__caption span:last-child {
    max-width: none;
    text-align: left;
  }

  .li-street-ledger {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .li-street-ledger span:nth-child(2) {
    border-right: 0;
  }

  .li-street-ledger span {
    min-height: 62px;
  }

  .li-observation {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .li-observation:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .li-community__visual img,
  .li-observation {
    transition: none;
  }

  .li-community__visual:hover img {
    transform: scale(1.01);
  }
}


/* ═══════════════════════════════════════════════════════════════
   LOCAL MARKET NOTES
   .mn-section        — outer section
   .mn-feature-card   — large editorial featured note
   .mn-note           — grid note card
   .mn-category       — category label pill
   ═══════════════════════════════════════════════════════════════ */

.mn-section {
  padding: var(--section-pad-y) var(--section-pad-x);
  background: var(--surface-ink);
}

.mn-inner {
  max-width: 1280px;
  margin: 0 auto;
}

/* ── Header ── */

.mn-header {
  max-width: 680px;
  margin-bottom: clamp(48px, 6vw, 80px);
}

.mn-eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.mn-heading {
  color: var(--text-inverse);
  margin: 0 0 clamp(20px, 2.4vw, 30px);
}

.mn-heading em {
  color: rgba(238, 235, 228, 0.48);
}

.mn-intro {
  font-family: var(--font-sans);
  font-size: clamp(0.90rem, 1.02vw, 1.04rem);
  font-weight: var(--weight-body);
  line-height: 1.78;
  color: rgba(238, 235, 228, 0.50);
  max-width: 58ch;
  margin: 0;
}

/* ── Category label ── */

.mn-category {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.68vw, 10.5px);
  font-weight: 600;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  line-height: 1;
  color: rgba(238, 235, 228, 0.88);
  background: rgba(238, 235, 228, 0.10);
  padding: 5px 10px;
  display: inline-block;
}

.mn-category--subtle {
  background: transparent;
  padding: 0;
  color: rgba(238, 235, 228, 0.40);
  letter-spacing: 0.18em;
}

/* ── Featured note card ── */

.mn-feature {
  margin-bottom: clamp(36px, 4.5vw, 56px);
}

.mn-feature-card {
  background: rgba(238, 235, 228, 0.05);
  border: 1px solid rgba(238, 235, 228, 0.10);
  padding: clamp(36px, 4.5vw, 60px) clamp(32px, 4vw, 56px);
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto auto;
  column-gap: clamp(40px, 6vw, 88px);
  row-gap: clamp(18px, 2.2vw, 26px);
  align-items: start;
}

.mn-feature-card__meta {
  grid-column: 1 / -1;
}

.mn-feature-card__heading {
  font-family: var(--font-serif);
  font-size: clamp(1.45rem, 2.0vw, 2.28rem);
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -0.020em;
  color: var(--text-inverse);
  margin: 0;
  max-width: 20em;
  grid-column: 1;
}

.mn-feature-card__body {
  font-family: var(--font-sans);
  font-size: clamp(0.88rem, 0.98vw, 1.02rem);
  font-weight: var(--weight-body);
  line-height: 1.78;
  color: rgba(238, 235, 228, 0.52);
  margin: 0;
  max-width: 54ch;
  grid-column: 1;
}

.mn-feature-card__cta {
  grid-column: 1;
  width: fit-content;
  color: var(--cta-dark);
  border-color: var(--btn-border-dark);
}

.mn-feature-card__cta:hover,
.mn-feature-card__cta:focus-visible {
  color: var(--cta-dark-hover);
  border-color: var(--btn-border-dark-hover);
  background-color: rgba(238, 235, 228, 0.055);
  transform: translateY(-1px);
}

/* ── Note grid ── */

.mn-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid rgba(238, 235, 228, 0.10);
}

.mn-note {
  padding: clamp(28px, 3.2vw, 40px) clamp(24px, 2.8vw, 36px) clamp(28px, 3.2vw, 40px) 0;
  border-right: 1px solid rgba(238, 235, 228, 0.08);
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 1.6vw, 18px);
}

.mn-note:last-child {
  border-right: none;
}

.mn-note:not(:first-child) {
  padding-left: clamp(24px, 2.8vw, 36px);
}

.mn-note__meta {
  display: flex;
  align-items: center;
  gap: clamp(12px, 1.4vw, 18px);
}

.mn-note__date {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.68vw, 10.5px);
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(238, 235, 228, 0.28);
  line-height: 1;
}

.mn-note__heading {
  font-family: var(--font-serif);
  font-size: clamp(1.02rem, 1.18vw, 1.28rem);
  font-weight: 500;
  line-height: 1.28;
  letter-spacing: -0.010em;
  color: rgba(238, 235, 228, 0.90);
  margin: 0;
}

.mn-note__body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.76;
  color: rgba(238, 235, 228, 0.44);
  margin: 0;
  flex: 1;
}

.mn-note__cta {
  color: rgba(238, 235, 228, 0.50);
  margin-top: auto;
}

.mn-note__cta:hover,
.mn-note__cta:focus-visible {
  color: rgba(238, 235, 228, 0.88);
}

.mn-note__cta::after {
  background: rgba(238, 235, 228, 0.30);
}

/* ── Responsive ── */

@media (max-width: 960px) {
  .mn-feature-card {
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .mn-feature-card__heading {
    font-size: clamp(1.30rem, 3.8vw, 1.88rem);
  }
}

@media (max-width: 760px) {
  .mn-grid {
    grid-template-columns: 1fr;
  }

  .mn-note {
    border-right: none;
    border-bottom: 1px solid rgba(238, 235, 228, 0.08);
    padding: clamp(24px, 5vw, 32px) 0;
  }

  .mn-note:last-child {
    border-bottom: none;
  }

  .mn-note:not(:first-child) {
    padding-left: 0;
  }
}


/* ─────────────────────────────────────────────────────────────
   SCREEN-READER ONLY UTILITY
   Used for accessible labels on animated elements.
   ───────────────────────────────────────────────────────────── */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* ─────────────────────────────────────────────────────────────
   LOCAL INSIGHT HERO — STAT LINE
   Quiet proof point between body copy and CTA.
   Only the count number animates; all surrounding text is still.
   ───────────────────────────────────────────────────────────── */

.li-hero-stat {
  display: flex;
  align-items: center;
  gap: clamp(10px, 1.1vw, 14px);
  font-family: var(--font-sans);
  font-size: clamp(10px, 0.74vw, 11.5px);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(238, 235, 228, 0.46);
  line-height: 1;
  margin: 0 0 clamp(28px, 3.2vw, 38px);
}

.li-hero-stat__num {
  font-variant-numeric: tabular-nums;
  color: rgba(238, 235, 228, 0.78);
  letter-spacing: 0.12em;
}

.li-hero-stat__sep {
  opacity: 0.30;
  letter-spacing: 0;
}


/* ═══════════════════════════════════════════════════════════════
   LOCAL INSIGHT — EDITORIAL INTRODUCTION
   The opening spread beneath the hero: one headline, one restrained
   paragraph, generous whitespace. Establishes why the monthly read
   matters before the community editions are introduced below it.
   ═══════════════════════════════════════════════════════════════ */

.li-opening {
  background: var(--surface-light);
  padding: clamp(76px, 10vw, 132px) var(--section-pad-x) clamp(32px, 4vw, 48px);
}

.li-opening__inner {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.li-opening__heading {
  margin: 0 0 clamp(24px, 2.8vw, 32px);
}

.li-opening__body {
  font-family: var(--font-sans);
  font-size: clamp(1.0rem, 1.1vw, 1.12rem);
  font-weight: var(--weight-body);
  line-height: 1.7;
  color: var(--text-secondary);
  margin: 0 auto;
  max-width: 56ch;
}

/* ═══════════════════════════════════════════════════════════════
   LOCAL INSIGHT — TABBED COMMUNITY GUIDE
   .li-tabs-section  — outer wrapper
   .li-tabs-bar      — sticky horizontal tab strip
   .li-tab           — individual tab button
   .li-guide         — per-community tabpanel
   ═══════════════════════════════════════════════════════════════ */

/* ── Tab section wrapper ── */

.li-tabs-section {
  background: var(--surface-light);
}

/* ── Community selector wrapper ── */

.li-selector {
  background: var(--surface-light);
  padding: clamp(4px, 0.6vw, 10px) var(--section-pad-x) clamp(20px, 2.6vw, 32px);
}

.li-selector__inner {
  max-width: 1280px;
  margin: 0 auto;
}

.li-selector__eyebrow {
  font-family: var(--font-sans);
  font-size: clamp(10px, 0.7vw, 11px);
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.58);
  margin: 0 0 clamp(22px, 2.6vw, 30px) 0;
  line-height: 1;
  text-align: center;
}

/* ── Tab bar — styled as a row of editions, not a UI control.
     No filled background, no pill shape: plain text mastheads
     separated by hairline dividers, with a thin underline marking
     the current edition. ── */

.li-tabs-bar {
  display: flex;
  justify-content: center;
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.li-tabs-bar::-webkit-scrollbar {
  display: none;
}

/* ── Individual edition ──
   Dimming is done with deliberate per-element colour, not a blanket
   opacity filter — keeps the serif labels crisp instead of washed out,
   and lets the active edition read as clearly, confidently selected. */

.li-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  font-family: var(--font-sans);
  background: transparent;
  border: none;
  border-left: 1px solid rgba(11, 22, 38, 0.12);
  border-bottom: 2.5px solid transparent;
  padding: clamp(8px, 1.2vw, 12px) clamp(34px, 4.6vw, 64px) clamp(22px, 2.6vw, 28px);
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: border-color 200ms ease;
  text-align: center;
}

.li-tab:first-child {
  border-left: none;
}

.li-tab__index {
  font-size: clamp(9px, 0.6vw, 10px);
  font-weight: 600;
  letter-spacing: 0.18em;
  color: rgba(11, 22, 38, 0.36);
  display: block;
  transition: color 200ms ease;
}

.li-tab__label {
  font-family: var(--font-serif);
  font-size: clamp(1.3rem, 1.7vw, 1.72rem);
  font-weight: 500;
  letter-spacing: -0.012em;
  line-height: 1.1;
  color: rgba(11, 22, 38, 0.42);
  display: block;
  transition: color 200ms ease;
}

.li-tab__desc {
  font-size: clamp(10px, 0.76vw, 11.5px);
  font-weight: 400;
  letter-spacing: 0.03em;
  text-transform: none;
  line-height: 1;
  color: rgba(11, 22, 38, 0.36);
  display: block;
  transition: color 200ms ease;
}

.li-tab:hover .li-tab__label {
  color: rgba(11, 22, 38, 0.68);
}

.li-tab[aria-selected="true"] {
  border-bottom-color: var(--text-primary);
}

.li-tab[aria-selected="true"] .li-tab__index {
  color: rgba(11, 22, 38, 0.50);
}

.li-tab[aria-selected="true"] .li-tab__label {
  color: var(--text-primary);
  font-weight: 600;
}

.li-tab[aria-selected="true"] .li-tab__desc {
  color: rgba(11, 22, 38, 0.56);
}

.li-tab:focus-visible {
  outline: 2px solid rgba(11, 22, 38, 0.28);
  outline-offset: 2px;
}

@media (max-width: 640px) {
  /* Centering an overflowing row clips the first/last items with no
     scroll affordance. Left-align instead so the active (first) edition
     is always fully visible, and the row scrolls naturally from there. */
  .li-tabs-bar {
    justify-content: flex-start;
  }
}

@media (max-width: 480px) {
  .li-tab {
    padding: clamp(6px, 2vw, 10px) clamp(18px, 5vw, 26px) clamp(14px, 3.5vw, 18px);
  }
}

/* ── Guide panel (tabpanel) ── */

.li-guide {
  background: var(--surface-light);
  opacity: 1;
  transition: opacity 320ms ease;
}

.li-guide[hidden] {
  display: none;
}

.li-guide.is-fading-in {
  opacity: 0;
}

/* ── Feature block: large image left, meta panel right ── */

.li-guide__feature {
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(16px, 2vw, 28px) var(--section-pad-x) 0;
  display: grid;
  grid-template-columns: 1.18fr 1fr;
  gap: clamp(40px, 5.5vw, 76px);
  align-items: start;
}

.li-guide__image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}

.li-guide__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.88) contrast(0.96) brightness(0.96);
  transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
}

.li-guide__image:hover img {
  transform: scale(1.018);
}

/* Meta panel */

.li-guide__meta {
  display: flex;
  flex-direction: column;
  padding-top: clamp(4px, 1vw, 20px);
}

.li-guide__signal {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: clamp(16px, 2vw, 26px);
}

.li-guide__signal-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2e5a4a;
  flex-shrink: 0;
}

.li-guide__signal-dot--steady {
  background: #6b7c6e;
}

.li-guide__signal-label {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.66vw, 10px);
  font-weight: 600;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: #2e5a4a;
  line-height: 1;
}

.li-guide__signal-label--steady {
  color: #6b7c6e;
}

.li-guide__name {
  font-family: var(--font-serif);
  font-size: clamp(3.2rem, 5.8vw, 7rem);
  font-weight: 500;
  line-height: 0.92;
  letter-spacing: -0.024em;
  color: var(--text-primary);
  margin: 0 0 clamp(10px, 1.2vw, 16px);
}

.li-guide__subline {
  font-family: var(--font-sans);
  font-size: clamp(0.94rem, 1.02vw, 1.08rem);
  font-weight: var(--weight-body);
  line-height: 1.58;
  color: var(--text-secondary);
  margin: 0 0 clamp(26px, 3.2vw, 40px);
}

.li-guide__stats {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(18px, 2.2vw, 28px) clamp(28px, 3.2vw, 44px);
  padding-top: clamp(20px, 2.4vw, 30px);
  border-top: 1px solid rgba(11, 22, 38, 0.10);
  margin-bottom: clamp(26px, 3.2vw, 38px);
  align-items: start;
}

.li-guide__stat-label {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.66vw, 10px);
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.40);
  margin: 0 0 5px;
  line-height: 1.35;
  white-space: nowrap;
}

.li-guide__stat-value {
  font-family: var(--font-serif);
  font-size: clamp(1.0rem, 1.28vw, 1.38rem);
  font-weight: 400;
  line-height: 1.32;
  color: var(--text-primary);
  letter-spacing: -0.008em;
  margin: 0;
}

/* ── Editorial intro — headline + body ── */

.li-guide__editorial {
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(44px, 5.5vw, 68px) var(--section-pad-x) clamp(44px, 5.5vw, 60px);
  display: grid;
  grid-template-columns: minmax(0, 0.52fr) minmax(0, 0.48fr);
  gap: clamp(32px, 4.5vw, 72px);
  align-items: start;
  border-top: 1px solid rgba(11, 22, 38, 0.08);
}

.li-guide__editorial-heading {
  font-family: var(--font-serif);
  font-size: clamp(2.0rem, 3.0vw, 3.6rem);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -0.018em;
  color: var(--text-primary);
  margin: 0;
}

.li-guide__editorial-heading em {
  font-style: italic;
  font-weight: 400;
  color: rgba(11, 22, 38, 0.42);
  display: block;
  margin-top: 0.04em;
}

.li-guide__editorial-body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.78;
  color: var(--text-secondary);
  margin: 0;
  padding-top: clamp(6px, 1vw, 14px);
}

/* ── Four-column callout grid ── */

.li-guide__grid {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--section-pad-x) clamp(64px, 8vw, 96px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgba(11, 22, 38, 0.10);
}

.li-guide__card {
  padding: clamp(26px, 3.2vw, 42px) clamp(22px, 2.6vw, 36px);
  border-left: 1px solid rgba(11, 22, 38, 0.10);
}

.li-guide__card:first-child {
  border-left: none;
  padding-left: 0;
}

.li-guide__card-label {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.66vw, 10px);
  font-weight: 600;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.40);
  margin: 0 0 clamp(14px, 1.6vw, 20px);
  line-height: 1.35;
}

.li-guide__card-body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.74;
  color: var(--text-secondary);
  margin: 0;
}

/* ═══════════════════════════════════════════════════════════════
   BURLINGTON INTELLIGENCE™ — li-intelligence-* components
   Reusable monthly market-intelligence module, presented as a guided
   publication (chapters disclosed progressively rather than a single
   data dump). Built for Burlington first; Hamilton/Waterdown can
   reuse this block unchanged later.
   ═══════════════════════════════════════════════════════════════ */

.li-intelligence {
  max-width: 1120px;
  margin: 0 auto;
  padding: clamp(8px, 1vw, 16px) var(--section-pad-x) clamp(72px, 9vw, 112px);
}

.li-intelligence__section-label {
  font-family: var(--font-sans);
  font-size: clamp(10px, 0.7vw, 11px);
  font-weight: 700;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.56);
  margin: 0 0 clamp(18px, 2.2vw, 26px);
}

.li-intelligence__section-label--inline {
  margin: 0;
}

/* Shared chapter rhythm — every chapter gets a top divider + consistent pad */
.li-intelligence__chapter {
  padding: clamp(40px, 5vw, 56px) 0;
  border-top: 1px solid rgba(11, 22, 38, 0.10);
}

/* First chapter sits directly under the cover, which already has its own
   bottom divider — an extra top border here would double up the rule. */
.li-intelligence__chapter--first {
  border-top: none;
  padding-top: clamp(8px, 1vw, 12px);
}

/* ══════════════════════════════════════
   Cover — merged Burlington intro +
   30-second snapshot
   ══════════════════════════════════════ */

/* li-cover is purely a transparent container — no own padding or max-width.
   The child li-guide__feature (via the base rule) handles all layout,
   matching Hamilton's formatting exactly. */
.li-cover {
  padding: 0;
}

.li-cover__feature {
  max-width: none;
  width: 100%;
  padding: 0 max(var(--section-pad-x), calc((100vw - 1280px) / 2 + var(--section-pad-x))) 0 0;
  margin-bottom: clamp(36px, 4.5vw, 48px);
  grid-template-columns: minmax(0, calc(50vw - clamp(24px, 2.5vw, 36px))) minmax(360px, 560px);
  gap: clamp(44px, 5vw, 72px);
  align-items: stretch;
}

.li-cover__feature > * {
  min-width: 0;
}

.li-cover__feature .li-guide__image {
  width: 100%;
  max-width: 100%;
  min-height: clamp(620px, 52vw, 760px);
  aspect-ratio: unset;
  align-self: stretch;
}

.li-cover__feature .li-guide__image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(8, 24, 46, 0.16), rgba(8, 24, 46, 0.02) 42%, rgba(255, 255, 255, 0.06)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(8, 24, 46, 0.08));
  box-shadow: inset -1px 0 rgba(11, 22, 38, 0.10);
}

.li-cover__feature .li-guide__image img {
  width: 100%;
  height: 100%;
  object-position: 50% 50%;
}

.li-cover__feature .li-guide__meta {
  padding-top: clamp(54px, 5.6vw, 82px);
  padding-bottom: clamp(44px, 4.8vw, 70px);
}

.li-cover__tagline {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.18rem, 1.5vw, 1.46rem);
  line-height: 1.42;
  color: rgba(11, 22, 38, 0.62);
  margin: 0 0 clamp(26px, 3vw, 36px);
  letter-spacing: -0.006em;
}

.li-market-intel {
  position: relative;
  padding: clamp(26px, 3.2vw, 38px) 0 clamp(28px, 3.4vw, 42px);
  margin: 0 0 clamp(22px, 2.8vw, 34px);
  border-top: 1px solid rgba(11, 22, 38, 0.12);
  border-bottom: 1px solid rgba(11, 22, 38, 0.12);
}

.li-market-intel__label {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.66vw, 10px);
  font-weight: 700;
  letter-spacing: 0.20em;
  line-height: 1.35;
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.40);
  margin: 0 0 clamp(18px, 2.2vw, 26px);
}

.li-market-intel__gauge-row {
  grid-template-columns: minmax(150px, 210px) minmax(0, 1fr);
  gap: clamp(28px, 3.2vw, 44px);
  align-items: center;
  margin-bottom: 0;
}

.li-market-intel__gauge {
  width: min(100%, 210px);
  max-width: 210px;
  justify-self: start;
}

.li-market-intel__meta {
  padding-top: clamp(2px, 0.6vw, 8px);
}

.li-cover__snapshot {
  max-width: 1120px;
  margin: 0 auto;
  padding: clamp(20px, 3vw, 34px) var(--section-pad-x) clamp(48px, 6vw, 64px);
  border-top: 1px solid rgba(11, 22, 38, 0.10);
}

/* ── Market Balance Index snapshot — gauge + interpretation ── */

.li-intelligence__gauge-row {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: clamp(28px, 4vw, 56px);
  margin-bottom: clamp(28px, 3.4vw, 36px);
}

.li-intelligence__gauge {
  width: clamp(170px, 18vw, 220px);
}

.li-intelligence__gauge-svg {
  display: block;
  width: 100%;
  height: auto;
}

.li-intelligence__gauge-track {
  fill: none;
  stroke: rgba(11, 22, 38, 0.08);
  stroke-width: 10;
  stroke-linecap: round;
}

.li-intelligence__gauge-fill {
  fill: none;
  stroke: #2e5a4a;
  stroke-width: 10;
  stroke-linecap: round;
  stroke-dasharray: 0 100;
  transition: stroke-dasharray 900ms cubic-bezier(0.22, 1, 0.36, 1);
}

.li-intelligence__gauge-needle {
  stroke: var(--text-primary);
  stroke-width: 2.5;
  stroke-linecap: round;
}

[data-gauge-needle] {
  transform: rotate(-90deg);
  transform-origin: 100px 100px;
  transition: transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
}

.li-intelligence__gauge-hub {
  fill: var(--text-primary);
}

.li-intelligence__gauge-value {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
  margin-top: -18%;
}

.li-intelligence__glance-value {
  font-family: var(--font-serif);
  font-size: clamp(2.2rem, 3vw, 2.8rem);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--text-primary);
}

.li-intelligence__glance-max {
  font-family: var(--font-sans);
  font-size: clamp(0.8rem, 0.9vw, 0.9rem);
  color: rgba(11, 22, 38, 0.40);
}

.li-intelligence__gauge-labels {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-sans);
  font-size: clamp(8px, 0.6vw, 9px);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.34);
  margin-top: 4px;
}

.li-intelligence__glance-label {
  font-family: var(--font-serif);
  font-size: clamp(1.3rem, 1.6vw, 1.6rem);
  font-weight: 500;
  color: var(--text-primary);
  margin: 0 0 6px;
}

.li-intelligence__glance-sublabel {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.66vw, 10px);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #2e5a4a;
  margin: 0 0 clamp(14px, 1.8vw, 18px);
}

.li-intelligence__glance-note {
  font-family: var(--font-sans);
  font-size: clamp(0.92rem, 1vw, 1.0rem);
  font-weight: var(--weight-body);
  line-height: 1.66;
  color: var(--text-secondary);
  margin: 0;
  max-width: 480px;
}

.li-intelligence__quicksignals {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(20px, 3vw, 40px);
  list-style: none;
  margin: 0;
  padding: 0;
}

.li-intelligence__quicksignal {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.li-intelligence__quicksignal-arrow {
  font-size: clamp(0.92rem, 1vw, 1rem);
  font-weight: 700;
  line-height: 1;
}

.li-intelligence__quicksignal-arrow--up {
  color: #2e5a4a;
}

.li-intelligence__quicksignal-arrow--down {
  color: #8a4a3c;
}

.li-intelligence__quicksignal-name {
  font-family: var(--font-sans);
  font-size: clamp(0.84rem, 0.92vw, 0.92rem);
  font-weight: 600;
  color: var(--text-primary);
}

.li-intelligence__quicksignal-status {
  font-family: var(--font-sans);
  font-size: clamp(0.8rem, 0.88vw, 0.88rem);
  color: var(--text-secondary);
}

/* ── Where do you fit? ── */

.li-intelligence__meaning-toggle {
  display: flex;
  gap: 10px;
  margin-bottom: clamp(28px, 3.4vw, 36px);
}

.li-intelligence__meaning-btn {
  font-family: var(--font-sans);
  font-size: clamp(0.86rem, 0.96vw, 0.96rem);
  font-weight: 600;
  color: var(--text-secondary);
  background: transparent;
  border: 1px solid rgba(11, 22, 38, 0.16);
  border-radius: 999px;
  padding: 13px 26px;
  cursor: pointer;
  transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease;
  -webkit-appearance: none;
  appearance: none;
}

.li-intelligence__meaning-btn:hover {
  border-color: rgba(11, 22, 38, 0.32);
  color: var(--text-primary);
}

.li-intelligence__meaning-btn:focus-visible {
  outline: 2px solid rgba(11, 22, 38, 0.42);
  outline-offset: 2px;
}

.li-intelligence__meaning-btn.is-active {
  background: var(--text-primary);
  border-color: var(--text-primary);
  color: #FBFAF8;
}

.li-intelligence__meaning-panel {
  border: 1px solid rgba(11, 22, 38, 0.10);
  border-radius: 2px;
  padding: clamp(28px, 3.4vw, 40px);
  background: #FBFAF8;
}

.li-intelligence__meaning-content[hidden] {
  display: none;
}

.li-intelligence__meaning-content {
  opacity: 1;
  transition: opacity 260ms ease;
}

.li-intelligence__meaning-content.is-fading-in {
  opacity: 0;
}

.li-intelligence__meaning-headline {
  font-family: var(--font-serif);
  font-size: clamp(1.18rem, 1.4vw, 1.4rem);
  font-weight: 500;
  line-height: 1.3;
  color: var(--text-primary);
  margin: 0 0 clamp(14px, 1.6vw, 18px);
  max-width: 600px;
}

.li-intelligence__meaning-body {
  font-family: var(--font-sans);
  font-size: clamp(1.0rem, 1.1vw, 1.08rem);
  font-weight: var(--weight-body);
  line-height: 1.74;
  color: var(--text-secondary);
  margin: 0 0 clamp(24px, 3vw, 32px);
  max-width: 680px;
}

.li-intelligence__meaning-list {
  list-style: none;
  margin: 0;
  padding: clamp(20px, 2.4vw, 26px) 0 0;
  border-top: 1px solid rgba(11, 22, 38, 0.10);
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.6vw, 16px);
}

.li-intelligence__meaning-list li {
  font-family: var(--font-sans);
  font-size: clamp(0.86rem, 0.94vw, 0.94rem);
  line-height: 1.6;
  color: var(--text-primary);
}

.li-intelligence__meaning-list-label {
  display: inline-block;
  min-width: 160px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(11, 22, 38, 0.50);
  margin-right: 6px;
}

/* ── 04 · Dig Deeper — visually secondary, closed by default ── */

.li-intelligence__deeper {
  padding: clamp(40px, 5vw, 56px) 0;
  border-top: 1px solid rgba(11, 22, 38, 0.10);
}

.li-intelligence__deeper-summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.li-intelligence__deeper-summary::-webkit-details-marker {
  display: none;
}

.li-intelligence__deeper-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-sans);
  font-size: clamp(0.78rem, 0.86vw, 0.86rem);
  font-weight: 600;
  color: rgba(11, 22, 38, 0.48);
  transition: color 160ms ease;
}

.li-intelligence__deeper:hover .li-intelligence__deeper-toggle {
  color: var(--text-primary);
}

.li-intelligence__deeper-toggle-icon {
  display: inline-block;
  width: 9px;
  height: 9px;
  position: relative;
}

.li-intelligence__deeper-toggle-icon::before,
.li-intelligence__deeper-toggle-icon::after {
  content: '';
  position: absolute;
  background: currentColor;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.li-intelligence__deeper-toggle-icon::before {
  width: 9px;
  height: 1px;
}

.li-intelligence__deeper-toggle-icon::after {
  width: 1px;
  height: 9px;
  transition: transform 160ms ease;
}

.li-intelligence__deeper[open] .li-intelligence__deeper-toggle-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
  opacity: 0;
}

.li-intelligence__deeper-body {
  padding-top: clamp(28px, 3.4vw, 36px);
}

.li-intelligence__deeper-methodology {
  font-family: var(--font-sans);
  font-size: clamp(0.84rem, 0.92vw, 0.92rem);
  line-height: 1.68;
  color: var(--text-secondary);
  margin: 0 0 clamp(32px, 4vw, 40px);
  max-width: 640px;
}

.li-intelligence__deeper-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 48px);
  margin-bottom: clamp(28px, 3.4vw, 36px);
}

.li-intelligence__deeper-table-label {
  font-family: var(--font-sans);
  font-size: clamp(9px, 0.66vw, 10px);
  font-weight: 600;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: rgba(11, 22, 38, 0.40);
  margin: 0 0 clamp(14px, 1.6vw, 18px);
}

.li-intelligence__deeper-rows {
  margin: 0;
  display: flex;
  flex-direction: column;
}

.li-intelligence__deeper-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 0;
  border-top: 1px solid rgba(11, 22, 38, 0.07);
}

.li-intelligence__deeper-row:first-child {
  border-top: none;
}

.li-intelligence__deeper-row dt {
  font-family: var(--font-sans);
  font-size: clamp(0.8rem, 0.88vw, 0.88rem);
  color: var(--text-secondary);
}

.li-intelligence__deeper-row dd {
  font-family: var(--font-sans);
  font-size: clamp(0.84rem, 0.92vw, 0.92rem);
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
  white-space: nowrap;
}

.li-intelligence__deeper-backdrop {
  font-family: var(--font-sans);
  font-size: clamp(11px, 0.78vw, 12px);
  line-height: 1.6;
  color: rgba(11, 22, 38, 0.40);
  margin: 0 0 clamp(32px, 4vw, 40px);
  padding-top: clamp(20px, 2.4vw, 26px);
  border-top: 1px solid rgba(11, 22, 38, 0.08);
}

/* ── Monthly Archive teaser ── */

.li-intelligence__archive-row {
  display: flex;
  align-items: baseline;
  gap: clamp(20px, 2.6vw, 32px);
  padding: clamp(16px, 2vw, 20px) 0;
  border-top: 1px solid rgba(11, 22, 38, 0.08);
}

.li-intelligence__archive-row:first-of-type {
  border-top: none;
}

.li-intelligence__archive-date {
  flex: 0 0 auto;
  width: 110px;
  font-family: var(--font-serif);
  font-size: clamp(1.0rem, 1.1vw, 1.1rem);
  font-weight: 500;
  color: var(--text-primary);
}

.li-intelligence__archive-row--upcoming .li-intelligence__archive-date,
.li-intelligence__archive-row--upcoming .li-intelligence__archive-text {
  color: rgba(11, 22, 38, 0.38);
}

.li-intelligence__archive-text {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.6;
  color: var(--text-secondary);
  margin: 0;
}

/* ── Soft CTA ── */

.li-intelligence__cta {
  padding-top: clamp(48px, 6vw, 64px);
  text-align: center;
  max-width: 600px;
  margin: 0 auto;
}

.li-intelligence__cta-heading {
  font-family: var(--font-serif);
  font-size: clamp(1.5rem, 2.0vw, 1.9rem);
  font-weight: 500;
  color: var(--text-primary);
  margin: 0 0 clamp(14px, 1.8vw, 18px);
}

.li-intelligence__cta-body {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  font-weight: var(--weight-body);
  line-height: 1.74;
  color: var(--text-secondary);
  margin: 0 0 clamp(20px, 2.4vw, 26px);
}

.li-intelligence__cta-link {
  display: inline-flex;
}

/* ── Responsive ── */

@media (max-width: 860px) {
  .li-intelligence__deeper-grid {
    grid-template-columns: 1fr;
    gap: clamp(28px, 5vw, 36px);
  }
}

@media (max-width: 560px) {
  .li-intelligence {
    padding-left: clamp(20px, 6vw, 28px);
    padding-right: clamp(20px, 6vw, 28px);
  }

  .li-intelligence__gauge-row {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .li-intelligence__gauge {
    width: 200px;
  }

  .li-intelligence__quicksignals {
    flex-direction: column;
    gap: 14px;
  }

  .li-intelligence__meaning-toggle {
    flex-direction: column;
  }

  .li-intelligence__meaning-btn {
    text-align: center;
  }

  .li-intelligence__meaning-list-label {
    display: block;
    min-width: 0;
    margin-right: 0;
    margin-bottom: 2px;
  }

  .li-intelligence__deeper-summary {
    flex-direction: column;
    align-items: flex-start;
  }

  .li-intelligence__archive-date {
    width: 84px;
  }

  .li-intelligence__archive-row {
    align-items: flex-start;
  }
}

/* ── Geoff's Perspective — dark full-width block ── */

.li-guide__perspective {
  background: var(--surface-dark);
  padding: clamp(52px, 6.5vw, 84px) var(--section-pad-x);
}

.li-guide__perspective-inner {
  max-width: 880px;
  margin: 0 auto;
}

.li-guide__perspective-eyebrow {
  color: rgba(238, 235, 228, 0.34);
  margin-bottom: clamp(20px, 2.4vw, 30px);
}

.li-guide__perspective-quote {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.28rem, 1.88vw, 2.18rem);
  line-height: 1.44;
  color: rgba(238, 235, 228, 0.80);
  margin: 0;
  letter-spacing: -0.008em;
  border: none;
  padding: 0;
}

/* ── Responsive — tabbed community guide ── */

@media (max-width: 1024px) {
  .li-guide__feature {
    grid-template-columns: 1fr 1fr;
  }

  .li-cover__feature {
    gap: clamp(32px, 4vw, 48px);
  }

  .li-market-intel__gauge-row {
    grid-template-columns: 1fr;
    justify-items: start;
    gap: clamp(20px, 2.8vw, 28px);
  }

  .li-market-intel__gauge {
    width: min(100%, 190px);
    max-width: 190px;
  }
}

@media (max-width: 860px) {
  .li-guide__feature {
    grid-template-columns: 1fr;
    gap: clamp(28px, 4.5vw, 44px);
  }

  .li-guide__image {
    aspect-ratio: 16 / 9;
  }

  .li-cover__feature .li-guide__image {
    width: calc(100% + 2 * var(--section-pad-x));
    max-width: none;
    min-height: unset;
    aspect-ratio: 16 / 9;
    align-self: auto;
    margin-left: calc(-1 * var(--section-pad-x));
    margin-right: calc(-1 * var(--section-pad-x));
  }

  .li-cover__feature {
    width: auto;
    max-width: 1280px;
    margin: 0 auto clamp(36px, 4.5vw, 48px);
    padding: clamp(34px, 7vw, 50px) var(--section-pad-x) 0;
  }

  .li-guide__meta {
    padding-top: 0;
  }

  .li-cover__feature .li-guide__meta {
    padding-top: 0;
    padding-bottom: 0;
  }

  .li-guide__stats {
    grid-template-columns: 1fr 1fr;
  }

  .li-guide__editorial {
    grid-template-columns: 1fr;
    gap: clamp(16px, 2.8vw, 24px);
  }

  .li-guide__editorial-body {
    padding-top: 0;
  }

  .li-guide__grid {
    grid-template-columns: repeat(2, 1fr);
    border-top: 1px solid rgba(11, 22, 38, 0.10);
  }

  .li-guide__card:nth-child(3) {
    border-left: none;
    padding-left: 0;
  }

  .li-guide__card:nth-child(3),
  .li-guide__card:nth-child(4) {
    border-top: 1px solid rgba(11, 22, 38, 0.10);
  }
}

@media (max-width: 560px) {
  .li-guide__name {
    font-size: clamp(3rem, 13vw, 4.4rem);
  }

  .li-guide__stats {
    grid-template-columns: 1fr;
    gap: clamp(18px, 4vw, 24px);
  }

  .li-guide__grid {
    grid-template-columns: 1fr;
  }

  .li-guide__card {
    border-left: none;
    padding-left: 0;
    border-top: 1px solid rgba(11, 22, 38, 0.10);
  }

  .li-guide__card:first-child {
    border-top: none;
  }

  .li-guide__card:nth-child(3),
  .li-guide__card:nth-child(4) {
    border-top: 1px solid rgba(11, 22, 38, 0.10);
  }
}


/* ═══════════════════════════════════════════════════════════════
   CONTACT PAGE — ct-* components
   Scope: body.contact-page (but styles are clean enough to be unscoped)
   ═══════════════════════════════════════════════════════════════ */

/* ── Hero variant: pier image sits slightly higher ── */
.ip-hero--contact .ip-hero__bg img {
  object-position: center 38%;
  filter: saturate(0.72) contrast(0.92) brightness(0.68) sepia(0.06);
}

/* ── 1. PRIMARY CONTACT ──────────────────────────────────────── */

.ct-primary {
  padding: 0;
  background: var(--surface-light);
}

.ct-primary__inner {
  max-width: none;
  margin: 0 auto;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
}

.ct-primary__info {
  width: min(100%, 720px);
  justify-self: end;
  align-self: center;
  padding: clamp(92px, 8.4vw, 136px) clamp(40px, 4.8vw, 72px) clamp(92px, 8.4vw, 136px) var(--section-pad-x);
}

.ct-primary__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.ct-primary__heading {
  margin-bottom: clamp(32px, 4vw, 52px);
}

.ct-primary__phone-wrap {
  margin-bottom: clamp(22px, 2.8vw, 34px);
}

.ct-primary__phone {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(2.5rem, 3.6vw, 4.4rem);
  font-weight: 500;
  letter-spacing: -0.025em;
  color: var(--text-primary);
  text-decoration: none;
  line-height: 1;
  transition: color 0.22s ease;
}

.ct-primary__phone:hover {
  color: var(--text-secondary);
}

.ct-primary__phone-label {
  display: block;
  margin-top: 10px;
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ct-primary__email-wrap {
  padding-top: clamp(20px, 2.5vw, 28px);
  margin-bottom: clamp(26px, 3.2vw, 40px);
  border-top: 1px solid var(--border-medium);
}

.ct-primary__email {
  display: block;
  font-family: var(--font-sans);
  font-size: clamp(0.96rem, 1.15vw, 1.2rem);
  font-weight: 400;
  color: var(--text-primary);
  text-decoration: none;
  line-height: 1.3;
  transition: color 0.22s ease;
}

.ct-primary__email:hover {
  color: var(--text-secondary);
}

.ct-primary__email-label {
  display: block;
  margin-top: 8px;
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.ct-primary__service {
  padding-top: clamp(20px, 2.5vw, 28px);
  border-top: 1px solid var(--border-medium);
}

.ct-primary__service-label {
  margin-bottom: 12px;
}

.ct-primary__service-list {
  font-family: var(--font-sans);
  font-size: var(--type-small);
  line-height: 1.72;
  color: var(--text-secondary);
  margin: 0;
}

.ct-primary__media {
  position: relative;
  overflow: hidden;
  min-height: clamp(620px, 54vw, 820px);
  align-self: stretch;
  background: #050506;
  box-shadow: inset 1px 0 0 rgba(202, 164, 83, 0.28);
}

.ct-primary__media img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: 58% 15%;
  display: block;
}


/* ── 2. FORM SECTION ─────────────────────────────────────────── */

.ct-form-section {
  padding: var(--section-pad-y) 0;
  background: var(--surface-warm);
}

.ct-form-section__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 var(--section-pad-x);
  display: grid;
  grid-template-columns: 1fr 1.45fr;
  gap: clamp(56px, 8vw, 120px);
  align-items: start;
}

.ct-form-intro {
  position: sticky;
  top: clamp(100px, 12vh, 132px);
}

.ct-form-intro__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.ct-form-intro__heading {
  margin-bottom: clamp(18px, 2.2vw, 28px);
}

.ct-form-intro__body {
  font-family: var(--font-sans);
  font-size: var(--type-body);
  font-weight: var(--weight-body);
  line-height: var(--leading-body);
  color: var(--text-secondary);
  margin: 0 0 14px;
}

.ct-inline-link {
  color: var(--text-primary);
  text-decoration: none;
  border-bottom: 1px solid rgba(11, 22, 38, 0.28);
  transition: border-color 0.22s ease;
  white-space: nowrap;
}

.ct-inline-link:hover {
  border-color: rgba(11, 22, 38, 0.68);
}

/* Form */
.ct-form {
  display: flex;
  flex-direction: column;
}

.ct-form__row {
  margin-bottom: clamp(18px, 2.2vw, 26px);
}

.ct-form__row--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(12px, 1.8vw, 22px);
}

.ct-form__field {
  display: flex;
  flex-direction: column;
}

.ct-form__label {
  font-family: var(--font-sans);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 9px;
}

.ct-form__optional {
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: none;
  color: var(--text-subtle);
}

.ct-form__input,
.ct-form__select,
.ct-form__textarea {
  font-family: var(--font-sans);
  font-size: 0.96rem;
  font-weight: 400;
  color: var(--text-primary);
  background: rgba(250, 248, 244, 0.72);
  border: 1px solid rgba(11, 22, 38, 0.18);
  border-radius: 0;
  padding: 14px 16px;
  width: 100%;
  outline: none;
  transition: border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
}

.ct-form__input::placeholder,
.ct-form__textarea::placeholder {
  color: var(--text-subtle);
  font-weight: 300;
}

.ct-form__input:focus,
.ct-form__select:focus,
.ct-form__textarea:focus {
  border-color: rgba(11, 22, 38, 0.48);
  background: rgba(250, 248, 244, 1);
  box-shadow: 0 0 0 3px rgba(11, 22, 38, 0.04);
  outline: none;
}

.ct-form__textarea {
  resize: vertical;
  min-height: 136px;
  line-height: 1.72;
}

.ct-form__select-wrap {
  position: relative;
}

.ct-form__select {
  cursor: pointer;
  padding-right: 44px;
}

.ct-form__select-icon {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-muted);
  pointer-events: none;
  display: flex;
  align-items: center;
}

.ct-form__footer {
  margin-top: 8px;
}

.ct-form__submit {
  margin-bottom: clamp(14px, 1.6vw, 20px);
  font-size: 10.5px;
  letter-spacing: 0.14em;
}

.ct-form__disclaimer {
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.72;
  color: var(--text-muted);
  max-width: 44ch;
  margin: 0;
}


/* ── 3. WHY PEOPLE REACH OUT ─────────────────────────────────── */

.ct-reasons {
  padding: var(--section-pad-y) 0;
  background: var(--surface-light);
}

.ct-reasons__inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 var(--section-pad-x);
}

.ct-reasons__header {
  max-width: 580px;
  margin-bottom: clamp(48px, 6vw, 80px);
}

.ct-reasons__eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 20px);
}

.ct-reasons__heading {
  margin-bottom: clamp(14px, 1.8vw, 22px);
}

.ct-reasons__intro {
  font-family: var(--font-sans);
  font-size: var(--type-body);
  font-weight: var(--weight-body);
  line-height: var(--leading-body);
  color: var(--text-secondary);
  max-width: 52ch;
  margin: 0;
}

.ct-reasons__list {
  display: flex;
  flex-direction: column;
}

.ct-reasons__item {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: clamp(18px, 2.2vw, 30px);
  align-items: baseline;
  padding: clamp(22px, 2.6vw, 34px) 0;
  border-top: 1px solid var(--border-medium);
}

.ct-reasons__item:last-child {
  border-bottom: 1px solid var(--border-medium);
}

.ct-reasons__num {
  font-family: var(--font-sans);
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  color: var(--text-subtle);
  line-height: 1;
  padding-top: 4px;
}

.ct-reasons__text {
  font-family: var(--font-sans);
  font-size: clamp(0.98rem, 1.05vw, 1.1rem);
  font-weight: var(--weight-body);
  line-height: 1.74;
  color: var(--text-secondary);
  margin: 0;
}


/* ── 4. CLOSING CTA ─────────────────────────────────────────── */

.ct-closing {
  padding: clamp(112px, 11vw, 168px) 0 clamp(104px, 10vw, 152px);
  background:
    linear-gradient(180deg, rgba(8, 15, 28, 0.98), rgba(5, 9, 15, 1)),
    var(--surface-dark);
}

.ct-closing__inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 var(--section-pad-x);
  text-align: center;
}

.ct-closing__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-bottom: clamp(22px, 2.8vw, 34px);
  color: rgba(238, 235, 228, 0.58);
}

.ct-closing__eyebrow::before,
.ct-closing__eyebrow::after {
  content: "";
  width: clamp(28px, 4vw, 54px);
  height: 1px;
  background: rgba(180, 148, 72, 0.42);
}

.ct-closing__heading {
  color: var(--text-inverse);
  max-width: 10.5em;
  margin: 0 auto clamp(26px, 3vw, 40px);
  font-size: clamp(3.1rem, 5.2vw, 6.4rem);
  line-height: 0.94;
  letter-spacing: -0.018em;
  text-wrap: balance;
}

.ct-closing .editorial-heading em {
  color: rgba(238, 235, 228, 0.5);
  font-weight: 400;
}

.ct-closing__body {
  font-family: var(--font-sans);
  font-size: clamp(1rem, 1.08vw, 1.16rem);
  font-weight: var(--weight-body);
  line-height: 1.74;
  color: rgba(238, 235, 228, 0.68);
  max-width: 42ch;
  margin: 0 auto clamp(34px, 4.4vw, 56px);
  text-wrap: balance;
}

.ct-closing__contacts {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: clamp(13px, 1.4vw, 18px);
  flex-wrap: wrap;
  max-width: 620px;
  margin: 0 auto clamp(34px, 4vw, 52px);
  padding: clamp(18px, 2vw, 24px) 0;
  border-top: 1px solid rgba(238, 235, 228, 0.14);
  border-bottom: 1px solid rgba(238, 235, 228, 0.14);
}

.ct-closing__phone {
  font-family: var(--font-serif);
  font-size: clamp(1.72rem, 2.2vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.015em;
  color: var(--text-inverse);
  text-decoration: none;
  line-height: 1;
  transition: color 0.22s ease;
}

.ct-closing__phone:hover {
  color: var(--text-inverse-secondary);
}

.ct-closing__sep {
  font-family: var(--font-sans);
  font-size: 1.1rem;
  color: rgba(180, 168, 150, 0.36);
  line-height: 1;
}

.ct-closing__email {
  font-family: var(--font-sans);
  font-size: clamp(0.88rem, 0.95vw, 0.98rem);
  font-weight: 400;
  color: rgba(238, 235, 228, 0.62);
  text-decoration: none;
  transition: color 0.22s ease;
}

.ct-closing__email:hover {
  color: var(--text-inverse);
}

.ct-closing__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 0;
  font-size: 10.5px;
  letter-spacing: 0.16em;
}

.ct-closing__trust {
  font-family: var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(238, 235, 228, 0.42);
  margin: clamp(24px, 2.8vw, 36px) auto 0;
  max-width: 48ch;
  text-wrap: balance;
}


/* ── RESPONSIVE ─────────────────────────────────────────────── */

@media (max-width: 960px) {
  .ct-primary__inner,
  .ct-form-section__inner {
    grid-template-columns: 1fr;
    gap: clamp(44px, 7vw, 64px);
  }

  .ct-primary {
    padding: var(--section-pad-y) 0;
  }

  .ct-primary__inner {
    padding: 0 var(--section-pad-x);
  }

  .ct-primary__info {
    width: 100%;
    justify-self: stretch;
    padding: 0;
  }

  .ct-primary__media {
    min-height: 0;
    max-height: 420px;
    aspect-ratio: 16 / 9;
    order: -1;
  }

  .ct-form-intro {
    position: static;
  }
}

@media (max-width: 640px) {
  .ct-form__row--split {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .ct-primary__phone {
    font-size: clamp(2.2rem, 10vw, 3.2rem);
  }

  .ct-closing__contacts {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 20px 0;
  }

  .ct-closing__sep {
    display: none;
  }

  .ct-closing {
    padding: clamp(76px, 20vw, 104px) 0 clamp(72px, 18vw, 96px);
  }

  .ct-closing__heading {
    font-size: clamp(2.42rem, 12.2vw, 3.55rem);
    line-height: 0.98;
  }

  .ct-closing__body {
    line-height: 1.66;
  }

  .ct-closing__eyebrow::before,
  .ct-closing__eyebrow::after {
    width: 28px;
  }

  .ct-reasons__item {
    grid-template-columns: 36px 1fr;
    gap: 14px;
  }
}

@media (max-width: 420px) {
  .ct-primary__phone {
    font-size: 9vw;
  }
}