/* ============================================================
   Theme tokens
   ============================================================ */
:root {
  --paper: #FFFFFF;
  --soft: #F5F5F3;
  --ink: #1F2A44;
  --accent: #886B40;
  --button: #1F2A44;
  --on-button: #FFFFFF;
  --on-photo: #FFFFFF;

  --display-font: "Cormorant Garamond", Georgia, serif;
  --body-font: "Jost", system-ui, -apple-system, Segoe UI, sans-serif;

  --maxw: 1200px;
  --gutter: 24px;
  --header-h: 84px;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--body-font);
  font-weight: 400;
  font-size: 17px;
  line-height: 1.7;
}

img { display: block; max-width: 100%; }

/* ============================================================
   Typography
   ============================================================ */
h1, h2, h3, .display {
  font-family: var(--display-font);
  color: var(--ink);
  margin: 0;
  font-weight: 500;
  text-wrap: balance;
}

h1 {
  font-size: clamp(2.875rem, 1.1rem + 6.2vw, 5.75rem);
  line-height: 1.05;
}
h2 {
  font-size: clamp(2.25rem, 1.4rem + 2.6vw, 3.625rem);
  line-height: 1.1;
}
h3 {
  font-size: clamp(1.5rem, 1.25rem + 0.7vw, 1.875rem);
  line-height: 1.2;
  font-weight: 600;
}

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }

.lede, .prose { max-width: 620px; }
.prose p { margin-bottom: 1.4em; }

.center { text-align: center; }
.measure { max-width: 620px; margin-left: auto; margin-right: auto; }

.label {
  font-family: var(--body-font);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink);
  display: block;
  margin: 0 0 1.2rem;
}
.label--on-photo { color: var(--on-photo); }

.quote-big {
  font-family: var(--display-font);
  font-weight: 500;
  font-size: clamp(2rem, 1.4rem + 1.8vw, 2.5rem);
  line-height: 1.25;
  margin: 0;
}
.quote-italic {
  font-family: var(--display-font);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.75rem, 1.2rem + 1.9vw, 2.75rem);
  line-height: 1.25;
  margin: 0;
}

.rule-accent {
  border: 0;
  height: 1px;
  width: 64px;
  background: var(--accent);
  margin: 1.6rem auto;
}

/* Links */
a { color: var(--ink); text-decoration: none; }
a:hover, a:focus-visible { color: var(--ink); text-decoration: underline; }
.on-photo a, a.on-photo { color: var(--on-photo); }
.on-photo a:hover, a.on-photo:hover,
.on-photo a:focus-visible, a.on-photo:focus-visible { color: var(--on-photo); text-decoration: underline; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ============================================================
   Layout helpers
   ============================================================ */
.wrap {
  max-width: var(--maxw);
  margin: 0 auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}

.section {
  padding-block: clamp(4.5rem, 2.4rem + 6vw, 7.5rem);
}
.section--soft { background: var(--soft); }

/* ============================================================
   Buttons
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 40px;
  font-family: var(--body-font);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 0;
  cursor: pointer;
  background: transparent;
}
.btn:hover, .btn:focus-visible { text-decoration: none; }
.btn--fill { background: var(--button); color: var(--on-button); }
.btn--fill:hover { opacity: 0.9; color: var(--on-button); }
.btn--line { color: var(--ink); border-color: var(--ink); }
.btn--line:hover { opacity: 0.9; color: var(--ink); }
.btn--on-photo { color: var(--on-photo); border-color: var(--on-photo); }
.btn--on-photo:hover { opacity: 0.9; color: var(--on-photo); }

.actions { display: flex; flex-wrap: wrap; gap: 16px; }
.actions--center { justify-content: center; }

/* ============================================================
   Full-bleed photo sections
   ============================================================ */
.photoband {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.photoband > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.photoband::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--ink) 0%, transparent),
    color-mix(in srgb, var(--ink) 45%, transparent)
  );
}
.photoband__inner {
  position: relative;
  z-index: 2;
  color: var(--on-photo);
}
.photoband__inner h1,
.photoband__inner h2,
.photoband__inner h3 { color: var(--on-photo); }

/* ============================================================
   Header / nav
   ============================================================ */
.site-nav {
  position: relative;
  background: var(--paper);
  border-bottom: 1px solid var(--accent);
}
.site-nav__inner {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--gutter);
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.site-nav__brand {
  font-family: var(--display-font);
  font-weight: 600;
  font-size: 28px;
  line-height: 1;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
}
.site-nav__brand:hover { text-decoration: none; }

.site-nav__toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 0;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.site-nav__toggle span {
  display: block;
  width: 24px;
  height: 1.5px;
  background: var(--ink);
  margin: 0 auto;
}

.site-nav__menu {
  display: flex;
  align-items: center;
  gap: 40px;
}
.site-nav__list {
  display: flex;
  align-items: center;
  gap: 40px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.site-nav__list a {
  font-family: var(--body-font);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
}
.site-nav__fold { display: none; }
.site-nav__cta { display: inline-flex; }

/* Mobile header */
@media (max-width: 1180px) {
  :root { --header-h: 64px; }
  .site-nav__brand {
    font-family: var(--body-font);
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }
  .site-nav__toggle { display: flex; }
  .site-nav__menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: var(--paper);
    border-bottom: 1px solid var(--accent);
    padding: 16px var(--gutter) 28px;
    z-index: 50;
  }
  .site-nav.nav-open .site-nav__menu { display: flex; }
  .site-nav__list {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    width: 100%;
  }
  .site-nav__list li { width: 100%; }
  .site-nav__list a {
    display: block;
    padding: 16px 0;
    min-height: 44px;
  }
  .site-nav__fold { display: block; }
  .site-nav__cta { display: none; }
  .site-nav.nav-open .site-nav__cta {
    display: inline-flex;
    margin-top: 16px;
    background: var(--button);
    color: var(--on-button);
    border-color: var(--button);
  }
}

/* ============================================================
   Hero (home)
   ============================================================ */
.hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  height: calc(100svh - var(--header-h));
  min-height: 640px;
  max-height: 1000px;
}
.hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%;
  z-index: 0;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--ink) 0%, transparent),
    color-mix(in srgb, var(--ink) 45%, transparent)
  );
}
.hero__inner {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  color: var(--on-photo);
  padding: 0 var(--gutter) 72px;
}
.hero__inner h1 { color: var(--on-photo); max-width: 16ch; }
.hero__sub {
  color: var(--on-photo);
  margin: 1.2rem 0 2rem;
  max-width: 44ch;
}
.hero .label--on-photo { margin-bottom: 1.4rem; }

@media (max-width: 1180px) {
  .hero__inner { justify-content: flex-end; padding-bottom: 120px; }
  .hero__inner .actions { flex-direction: column; width: 100%; max-width: 360px; }
  .hero__inner .actions .btn--fill { width: 100%; }
  .hero__inner .actions .btn--on-photo {
    border: 0;
    min-height: 44px;
    padding: 0;
    text-decoration: underline;
  }
}

/* ============================================================
   Triptych (home)
   ============================================================ */
.triptych {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 48px;
}
.triptych__img { aspect-ratio: 4 / 5; }
.triptych__img img { width: 100%; height: 100%; object-fit: cover; }
.triptych__text { text-align: center; max-width: 30ch; margin: 0 auto; }
@media (max-width: 900px) {
  .triptych { grid-template-columns: 1fr 1fr; }
  .triptych__text { grid-column: 1 / -1; order: -1; margin-bottom: 8px; }
}

/* ============================================================
   Neighborhood / card grids
   ============================================================ */
.cardgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.cardgrid--six { grid-template-columns: repeat(3, 1fr); }
.ncard { display: block; color: var(--ink); text-decoration: none; }
.ncard:hover { text-decoration: none; }
.ncard__img { aspect-ratio: 3 / 4; overflow: hidden; }
.ncard__img img { width: 100%; height: 100%; object-fit: cover; }
.ncard__title { margin: 1rem 0 0.4rem; }
.ncard__text { color: var(--ink); max-width: none; }
@media (max-width: 900px) {
  .cardgrid, .cardgrid--six { grid-template-columns: 1fr; }
}

/* ============================================================
   Intro split (portrait + bio)
   ============================================================ */
.split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.split--text-wide { grid-template-columns: 40% 1fr; }
.split__frame {
  padding: 16px;
  border: 1px solid var(--accent);
}
.split__portrait { aspect-ratio: 4 / 5; }
.split__portrait img { width: 100%; height: 100%; object-fit: cover; }
.split__photo { aspect-ratio: 3 / 4; }
.split__photo img { width: 100%; height: 100%; object-fit: cover; }
.split__body .prose { margin-top: 1.4rem; }
.split__body .pre { white-space: pre-line; }
.split__body .btn, .split__body a.textlink { margin-top: 1.6rem; }
a.textlink {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: var(--body-font);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink);
}
@media (max-width: 900px) {
  .split, .split--text-wide { grid-template-columns: 1fr; gap: 32px; }
}

/* ============================================================
   Steps (buyers / sellers / about points)
   ============================================================ */
.steps { display: block; }
.step { padding: 28px 0; }
.step + .step { border-top: 1px solid var(--accent); }
.step h3 { margin-bottom: 0.5rem; }

.points { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.points .point h3 { margin-bottom: 0.5rem; }
@media (max-width: 900px) { .points { grid-template-columns: 1fr; } }

/* ============================================================
   Page title photo (inner pages)
   ============================================================ */
.pagehead {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  height: 56vh;
  min-height: 300px;
}
.pagehead > img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.pagehead::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--ink) 0%, transparent),
    color-mix(in srgb, var(--ink) 45%, transparent)
  );
}
.pagehead__inner {
  position: relative; z-index: 2;
  height: 100%;
  display: flex; flex-direction: column; justify-content: flex-end;
  color: var(--on-photo);
  padding: 0 var(--gutter) 48px;
  max-width: var(--maxw);
  margin: 0 auto;
}
.pagehead__inner h1 { color: var(--on-photo); }
.pagehead__inner p { color: var(--on-photo); margin-top: 0.6rem; max-width: 48ch; }
@media (max-width: 1180px) { .pagehead { height: 44vh; } }

/* ============================================================
   Photo contact band (foot of pages)
   ============================================================ */
.contactband { text-align: center; }
.contactband .photoband__inner {
  padding-block: clamp(5.5rem, 3rem + 7vw, 8.75rem);
}
.contactband__lines { margin: 1.4rem 0 2rem; }
.contactband__lines p { margin: 0.2rem 0; }
.contactband__lines a { color: var(--on-photo); }

/* ============================================================
   Notable sales cards
   ============================================================ */
.salegrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.salecard__photo {
  aspect-ratio: 4 / 3;
  background: var(--soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink);
  font-family: var(--body-font);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.salecard__body { margin-top: 1rem; }
.salecard__body p { margin: 0.3rem 0; }
@media (max-width: 900px) { .salegrid { grid-template-columns: 1fr; } }

/* ============================================================
   Testimonials big quotes
   ============================================================ */
.bigquote { text-align: center; max-width: 30ch; margin: 0 auto; }
.bigquote + .bigquote { margin-top: clamp(3.5rem, 2rem + 4vw, 6rem); }
.bigquote__name { margin-top: 1.4rem; }
.ratio-wide { position: relative; aspect-ratio: 21 / 9; overflow: hidden; }
.ratio-wide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ============================================================
   Forms
   ============================================================ */
.form { display: block; }
.form__panel { background: var(--paper); padding: clamp(28px, 4vw, 48px); }
.field { margin-bottom: 20px; }
.field label {
  display: block;
  font-family: var(--body-font);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 8px;
}
.field input,
.field textarea {
  display: block;
  width: 100%;
  font-family: var(--body-font);
  font-size: 16px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--ink);
  border-radius: 0;
  padding: 14px 16px;
}
.field textarea { min-height: 140px; resize: vertical; }
.field input:focus, .field textarea:focus {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
.form .btn { margin-top: 8px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
.form-grid .field.full { grid-column: 1 / -1; }
@media (max-width: 640px) { .form-grid { grid-template-columns: 1fr; } }

[data-lead-message] { margin-top: 16px; font-size: 15px; }

/* ============================================================
   Listing detail (hooks filled by the pipeline)
   ============================================================ */
.listing { max-width: var(--maxw); margin: 0 auto; padding: clamp(2rem,4vw,4rem) var(--gutter); }
.listing__cover { aspect-ratio: 16 / 10; overflow: hidden; background: var(--soft); }
.listing__cover img { width: 100%; height: 100%; object-fit: cover; }
.listing__gallery { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 12px; }
.listing__gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.listing__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; align-items: baseline; margin-top: 2rem; }
.listing__price { font-family: var(--display-font); font-size: clamp(2rem,1.4rem+2vw,3rem); }
.listing__status { font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); }
.listing__specs { display: flex; flex-wrap: wrap; gap: 32px; margin-top: 1.2rem; border-top: 1px solid var(--accent); border-bottom: 1px solid var(--accent); padding: 1.2rem 0; }
.listing__layout { display: grid; grid-template-columns: 1fr 360px; gap: 48px; margin-top: 2.5rem; }
@media (max-width: 900px) { .listing__layout { grid-template-columns: 1fr; } .listing__gallery { grid-template-columns: repeat(2,1fr); } }

/* ============================================================
   Search frame (listings index)
   ============================================================ */
.search-frame {
  height: calc(100vh - var(--header-h) - 96px);
  min-height: 600px;
}

/* ============================================================
   Footer
   ============================================================ */
.site-foot {
  background: var(--paper);
  border-top: 1px solid var(--accent);
  padding-block: clamp(3rem, 2rem + 3vw, 4.5rem);
  font-size: 15px;
}
.site-foot__inner {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1.4fr;
  gap: 40px;
}
.site-foot a { color: var(--ink); }
.site-foot__logo { width: 160px; height: auto; }
.site-foot__links { display: flex; flex-direction: column; gap: 10px; }
.site-foot__links a {
  font-family: var(--body-font);
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.site-foot__contact p,
.site-foot__contact address { margin: 0 0 8px; font-style: normal; }
.site-foot__name { font-family: var(--display-font); font-size: 20px; }
.site-foot__legal p { margin: 0 0 8px; }
@media (max-width: 900px) {
  .site-foot__inner { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .site-foot__inner { grid-template-columns: 1fr; }
}

/* ============================================================
   Rechat SDK theming (overrides, scoped)
   ============================================================ */
[data-theme="rechat"],
rechat-root {
  --rechat-theme-background-color: var(--paper);

  --rechat-theme-accent-9: var(--button);
  --rechat-theme-accent-10: color-mix(in srgb, var(--button) 88%, black);
  --rechat-theme-accent-11: color-mix(in srgb, var(--button) 76%, black);

  --rechat-theme-secondary-9: var(--accent);
  --rechat-theme-secondary-10: color-mix(in srgb, var(--accent) 88%, black);
  --rechat-theme-secondary-11: color-mix(in srgb, var(--accent) 76%, black);

  --rechat-theme-gray-1: color-mix(in srgb, var(--ink) 3%, var(--paper));
  --rechat-theme-gray-2: color-mix(in srgb, var(--ink) 6%, var(--paper));
  --rechat-theme-gray-3: color-mix(in srgb, var(--ink) 10%, var(--paper));
  --rechat-theme-gray-4: color-mix(in srgb, var(--ink) 16%, var(--paper));
  --rechat-theme-gray-5: color-mix(in srgb, var(--ink) 24%, var(--paper));
  --rechat-theme-gray-6: color-mix(in srgb, var(--ink) 34%, var(--paper));
  --rechat-theme-gray-7: color-mix(in srgb, var(--ink) 46%, var(--paper));
  --rechat-theme-gray-8: color-mix(in srgb, var(--ink) 58%, var(--paper));
  --rechat-theme-gray-9: color-mix(in srgb, var(--ink) 70%, var(--paper));
  --rechat-theme-gray-10: color-mix(in srgb, var(--ink) 82%, var(--paper));
  --rechat-theme-gray-11: color-mix(in srgb, var(--ink) 92%, var(--paper));
  --rechat-theme-gray-12: var(--ink);

  --rechat-theme-pin-color: var(--button);
  --rechat-theme-pin-cluster-color: var(--accent);

  --rechat-theme-status-active: var(--accent);
  --rechat-theme-status-pending: color-mix(in srgb, var(--accent) 55%, var(--paper));
  --rechat-theme-status-sold: var(--ink);
  --rechat-theme-status-coming-soon: color-mix(in srgb, var(--ink) 55%, var(--paper));

  --rechat-theme-text-font-family: var(--body-font);
  --rechat-theme-heading-font-family: var(--display-font);

  --rechat-theme-radius-factor: 0;
}

/* Make the SDK listing card match the static cards: square, no shadow. */
[data-theme="rechat"] .listing-card,
rechat-root .listing-card {
  background: var(--paper);
  border: none;
  border-radius: 0;
  box-shadow: none;
}
[data-theme="rechat"] .listing-card__image,
rechat-root .listing-card__image { border-radius: 0; }
[data-theme="rechat"] .listing-card__price,
rechat-root .listing-card__price {
  font-family: var(--display-font);
  color: var(--ink);
}
[data-theme="rechat"] .listing-card__address,
rechat-root .listing-card__address,
[data-theme="rechat"] .listing-card__attributes,
rechat-root .listing-card__attributes {
  font-family: var(--body-font);
  color: var(--ink);
}
[data-theme="rechat"] .listing-card__badge,
rechat-root .listing-card__badge { border-radius: 0; }

/* SDK alignment patches
   TODO (Rechat SDK): address input ships at a different height than the
   sibling filter chips. Remove once the SDK ships consistent filter-row sizing. */
[data-theme="rechat"] .search_address_input__field_wrapper,
rechat-root .search_address_input__field_wrapper {
  height: 44px;
  display: flex;
  align-items: center;
  border-radius: 0;
}
[data-theme="rechat"] .map-listings-filters__dropdown_trigger,
rechat-root .map-listings-filters__dropdown_trigger { border-radius: 0; }
[data-theme="rechat"] .list-pagination__root,
rechat-root .list-pagination__root { padding-block: 24px; }

/* Lock the map row height so the empty state doesn't collapse it. (Section 2.5.1) */
[data-theme="rechat"] .rechat-shell rechat-map,
rechat-root .rechat-shell rechat-map {
  min-height: 600px;
  height: 100%;
}
[data-theme="rechat"] .rechat-shell rechat-map-listings-grid,
rechat-root .rechat-shell rechat-map-listings-grid {
  min-height: 600px;
  max-height: 100%;
  overflow-y: auto;
}
@media (max-width: 900px) {
  [data-theme="rechat"] .rechat-shell rechat-map,
  rechat-root .rechat-shell rechat-map { min-height: 360px; }
  [data-theme="rechat"] .rechat-shell rechat-map-listings-grid,
  rechat-root .rechat-shell rechat-map-listings-grid {
    min-height: 0;
    max-height: none;
    overflow-y: visible;
  }
}

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

/* Headings break into lines of even length, so no word is left alone on the last one */
:where(h1, h2, h3) { text-wrap: balance; }

/* The site's body font, restated so it wins over the Rechat SDK stylesheet, which pages load after this file */
html body{font-family:var(--body-font)}

/* The site's body text colour, restated so it wins over the Rechat SDK stylesheet, which pages load after this file */
html body{color:var(--ink)}

/* Where the desktop menu shows: the header's row wraps the menu under the name when the two do not fit */
@media (min-width: 1181px) {
 header:has([data-menu-toggle]) :not([data-menu], [data-menu] *, :has([data-menu]), [data-menu-toggle], [data-menu-toggle] *, :has([data-menu-toggle]), img, svg, svg *, picture, video){ min-width:0!important; white-space:normal!important; overflow-wrap:anywhere; }
 header :has(> [data-menu-toggle]):has(> [data-menu]){ flex-wrap:wrap!important; }
 :where(html:not([data-menu-collapsed])) header:not(:has([data-menu-toggle][aria-expanded="true"])) :has(> [data-menu-toggle]) > [data-menu]{ flex:1 0 min-content!important; max-width:max-content!important; }
}
/* Where the desktop menu shows: each item on one line; where the items do not fit on one line (the menu script marks <html data-menu-collapsed>), the header's own phone menu */
@media (min-width: 1181px) {
 :where(html[data-menu-measured]:not([data-menu-collapsed])) header:has([data-menu-toggle]) [data-menu] :is(a, button){ white-space:nowrap!important; }
  :where(html[data-menu-collapsed]) .site-nav__brand { font-family: var(--body-font); font-weight: 500; font-size: 14px; letter-spacing: 0.16em; text-transform: uppercase; }
  :where(html[data-menu-collapsed]) .site-nav__toggle { display: flex; }
  :where(html[data-menu-collapsed]) .site-nav__menu { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--paper); border-bottom: 1px solid var(--accent); padding: 16px var(--gutter) 28px; z-index: 50; }
  :where(html[data-menu-collapsed]) .site-nav.nav-open .site-nav__menu { display: flex; }
  :where(html[data-menu-collapsed]) .site-nav__list { flex-direction: column; align-items: flex-start; gap: 0; width: 100%; }
  :where(html[data-menu-collapsed]) .site-nav__list li { width: 100%; }
  :where(html[data-menu-collapsed]) .site-nav__list a { display: block; padding: 16px 0; min-height: 44px; }
  :where(html[data-menu-collapsed]) .site-nav__fold { display: block; }
  :where(html[data-menu-collapsed]) .site-nav__cta { display: none; }
  :where(html[data-menu-collapsed]) .site-nav.nav-open .site-nav__cta { display: inline-flex; margin-top: 16px; background: var(--button); color: var(--on-button); border-color: var(--button); }
}

/* Tap targets: on a phone or a touch screen, a link or button that stands on its own is at least 44px tall */
@media (max-width: 767px), (pointer: coarse) {
  :where(a.btn--fill, a.btn--on-photo, a.textlink, .contactband__lines > p > a[href^="tel:"], .contactband__lines > p > a[href^="mailto:"], .site-foot__links > a, .site-foot__contact > p > a[href^="tel:"], .site-foot__contact > p > a[href^="mailto:"], button.btn, .wrap > p > a[href^="tel:"], .wrap > p > a[href^="mailto:"], a.fabrik-not-found__home) { display: inline-block; box-sizing: border-box; min-height: 44px; padding-block: max(0px, calc((44px - 1lh) / 2)); }
}

/* The site's Rechat SDK theme, restated so it wins over the SDK stylesheet's own [data-theme=rechat] defaults, which pages load after this file */
:root [data-theme="rechat"], :root rechat-root{
  --rechat-theme-background-color:var(--paper);
  --rechat-theme-accent-9:var(--button);
  --rechat-theme-accent-10:color-mix(in srgb, var(--button) 88%, black);
  --rechat-theme-accent-11:color-mix(in srgb, var(--button) 76%, black);
  --rechat-theme-secondary-9:var(--accent);
  --rechat-theme-secondary-10:color-mix(in srgb, var(--accent) 88%, black);
  --rechat-theme-secondary-11:color-mix(in srgb, var(--accent) 76%, black);
  --rechat-theme-gray-1:color-mix(in srgb, var(--ink) 3%, var(--paper));
  --rechat-theme-gray-2:color-mix(in srgb, var(--ink) 6%, var(--paper));
  --rechat-theme-gray-3:color-mix(in srgb, var(--ink) 10%, var(--paper));
  --rechat-theme-gray-4:color-mix(in srgb, var(--ink) 16%, var(--paper));
  --rechat-theme-gray-5:color-mix(in srgb, var(--ink) 24%, var(--paper));
  --rechat-theme-gray-6:color-mix(in srgb, var(--ink) 34%, var(--paper));
  --rechat-theme-gray-7:color-mix(in srgb, var(--ink) 46%, var(--paper));
  --rechat-theme-gray-8:color-mix(in srgb, var(--ink) 58%, var(--paper));
  --rechat-theme-gray-9:color-mix(in srgb, var(--ink) 70%, var(--paper));
  --rechat-theme-gray-10:color-mix(in srgb, var(--ink) 82%, var(--paper));
  --rechat-theme-gray-11:color-mix(in srgb, var(--ink) 92%, var(--paper));
  --rechat-theme-gray-12:var(--ink);
  --rechat-theme-pin-color:var(--button);
  --rechat-theme-pin-cluster-color:var(--accent);
  --rechat-theme-status-active:var(--accent);
  --rechat-theme-status-pending:color-mix(in srgb, var(--accent) 55%, var(--paper));
  --rechat-theme-status-sold:var(--ink);
  --rechat-theme-status-coming-soon:color-mix(in srgb, var(--ink) 55%, var(--paper));
  --rechat-theme-text-font-family:var(--body-font);
  --rechat-theme-heading-font-family:var(--display-font);
  --rechat-theme-radius-factor:0;
  --rechat-theme-text-primary:var(--ink);
  --rechat-theme-text-secondary:var(--ink);
}

/* fabrik:animate — the editor's animations: an element's own --fx-anim, played as it scrolls into view (server/src/edits/style.ts) */
@keyframes fx-fade{from{opacity:0}}@keyframes fx-rise{from{opacity:0;transform:translateY(2rem)}}@keyframes fx-pan-left{from{opacity:0;transform:translateX(6%) scale(0.88)}}@keyframes fx-pan-right{from{opacity:0;transform:translateX(-6%) scale(0.88)}}@keyframes fx-zoom{from{opacity:0;transform:scale(0.8)}}@media screen and (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){[style*="--fx-anim:"]{animation:var(--fx-anim) linear both!important;animation-timeline:view()!important;animation-range:var(--fx-anim-range)!important}}}

/* fabrik:animate-play — when the editor's animations play: --fx-anim-time as the page opens, --fx-anim-replay again as it comes back into view (server/src/edits/style.ts) */
@media screen and (prefers-reduced-motion:no-preference){[style*="--fx-anim:"][style*="--fx-anim-time:"]{animation:var(--fx-anim) var(--fx-anim-time) cubic-bezier(0.2,0.7,0.2,1) both!important;animation-timeline:auto!important;animation-range:normal!important}@supports (animation-timeline:view()){[style*="--fx-anim:"][style*="--fx-anim-replay:"]{animation:var(--fx-anim) linear both,var(--fx-anim) linear reverse forwards!important;animation-timeline:view(),view()!important;animation-range:var(--fx-anim-range),var(--fx-anim-replay)!important}[style*="--fx-anim:"][style*="--fx-anim-time:"][style*="--fx-anim-replay:"]{animation:var(--fx-anim) linear reverse forwards,var(--fx-anim) var(--fx-anim-time) cubic-bezier(0.2,0.7,0.2,1) backwards!important;animation-timeline:view(),auto!important;animation-range:var(--fx-anim-replay),normal!important}}}