/* Property sites (shared framework, identical on every site) — design tokens
   Limestone paper, river slate ink, facade sage, aged brass. */
:root {
  --paper: #F7F2E8;
  --paper-2: #EFE8DA;
  --paper-3: #DDD3C1;
  --ink: #24313B;
  --ink-2: #3A4447;
  --ink-soft: #5B6567;
  --river: #34505A;
  --river-deep: #26323F;
  --sage: #8C9A86;
  --sage-soft: #C9CFBF;
  --brass: #A8844C;
  --brass-text: #765A2E;
  --line: rgba(28, 36, 38, .16);
  --line-light: rgba(244, 239, 230, .22);
  --white: #FFFEFB;
  --sage-bar: #E6E8DB;
  --error: #9B2C1F;
  --success: #3F6B45;

  --serif: "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --period: "Cormorant Garamond", Georgia, serif;
  --sans: "Instrument Sans", "Helvetica Neue", "Segoe UI", system-ui, sans-serif;

  --s1: 4px; --s2: 8px; --s3: 16px; --s4: 24px; --s5: 40px; --s6: 64px; --s7: 96px; --s8: 144px;
  --wrap: 1280px;
  --gutter: clamp(16px, 4vw, 56px);
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --t-fast: 180ms;
  --t-med: 420ms;
  --t-slow: 900ms;
  --z-header: 40; --z-menu: 50; --z-skip: 100;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 17px; line-height: 1.65; font-weight: 400;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; height: auto; }
a { color: inherit; }
button { font: inherit; }
:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; }
::selection { background: var(--sage-soft); }

.skip-link {
  position: absolute; left: 16px; top: -60px; z-index: var(--z-skip);
  background: var(--ink); color: var(--paper); padding: 10px 16px; text-decoration: none;
}
.skip-link:focus { top: 12px; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.narrow { max-width: 760px; }

/* ---------- Type ---------- */
h1, h2, h3, .display { font-family: var(--serif); font-weight: 400; line-height: 1.04; letter-spacing: -.01em; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(48px, 8.4vw, 124px); }
h2 { font-size: clamp(36px, 5.2vw, 72px); }
h3 { font-size: clamp(26px, 2.6vw, 36px); line-height: 1.12; }
h1 em, h2 em, h3 em { font-style: italic; color: var(--brass-text); }
.on-dark h1 em, .on-dark h2 em, .on-dark h3 em { color: #D9BC8A; }
p { margin: 0 0 1em; }
.lede { font-family: var(--serif); font-size: clamp(22px, 2.3vw, 30px); line-height: 1.38; color: var(--ink-2); }
.eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--sans); font-size: 12px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase;
  color: var(--brass-text); margin-bottom: var(--s4);
}
.eyebrow::before { content: ""; width: 32px; height: 1px; background: currentColor; }
.on-dark .eyebrow { color: #D9BC8A; }
.muted { color: var(--ink-soft); }
.small { font-size: 14px; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 52px; padding: 0 28px; border: 1px solid var(--ink); background: var(--ink); color: var(--paper);
  font-family: var(--sans); font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
  text-decoration: none; cursor: pointer; touch-action: manipulation;
  transition: background var(--t-fast) var(--ease-out), color var(--t-fast) var(--ease-out), border-color var(--t-fast);
}
.btn:hover { background: var(--river); border-color: var(--river); }
.btn svg { width: 16px; height: 16px; transition: transform var(--t-fast) var(--ease-out); }
.btn:hover svg { transform: translateX(3px); }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: var(--ink); color: var(--paper); }
.btn--light { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.btn--light:hover { background: transparent; color: var(--paper); }
.btn--ghost-light { background: transparent; color: var(--paper); border-color: var(--line-light); }
.btn--ghost-light:hover { background: var(--paper); color: var(--ink); }
.btn[disabled] { opacity: .5; cursor: progress; }
.link-arrow {
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none;
  font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
  border-bottom: 1px solid currentColor; padding-bottom: 6px; min-height: 32px;
}
.link-arrow svg { width: 14px; height: 14px; transition: transform var(--t-fast) var(--ease-out); }
.link-arrow:hover svg { transform: translateX(4px); }

/* ---------- Header (outlined-button bar, after Nevins Landing) ---------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: var(--z-header);
  color: var(--paper);
  transition: background var(--t-med) var(--ease-out), color var(--t-med) var(--ease-out), box-shadow var(--t-med);
}
.site-header .bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--s3); height: 88px; }
.site-header.is-solid, body.page-light .site-header { background: rgba(230, 232, 219, .97); color: var(--ink); box-shadow: 0 1px 0 var(--line); backdrop-filter: saturate(1.2) blur(6px); }
.hbtn {
  display: inline-flex; align-items: center; min-height: 46px; padding: 0 22px; gap: 14px;
  border: 1px solid currentColor; background: transparent; color: inherit; cursor: pointer; text-decoration: none;
  font-family: var(--sans); font-size: 14px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase;
  transition: background var(--t-fast) var(--ease-out), color var(--t-fast) var(--ease-out);
}
.hbtn:hover { background: var(--paper); color: var(--ink); }
.is-solid .hbtn:hover, body.page-light .hbtn:hover { background: var(--ink); color: var(--paper); }
.hbtn--apply { padding-right: 0; }
.hbtn--apply .arr { display: inline-grid; place-items: center; width: 46px; align-self: stretch; margin-left: 8px; background: var(--paper); color: var(--ink); }
.is-solid .hbtn--apply .arr, body.page-light .hbtn--apply .arr { background: var(--ink); color: var(--paper); }
.hbtn--apply:hover .arr { background: var(--brass); color: var(--white); }
.hbtn .arr svg { width: 16px; height: 16px; }
.hbtn .burger { width: 18px; height: 18px; }
.header-left { justify-self: start; }
.header-right { justify-self: end; display: flex; gap: var(--s3); }
.brand { justify-self: center; display: flex; flex-direction: column; align-items: center; text-decoration: none; opacity: 0; transition: opacity var(--t-med) var(--ease-out); }
.is-solid .brand, body.page-light .brand { opacity: 1; }
.brand-word { font-family: var(--sans); font-size: 15px; font-weight: 500; letter-spacing: .34em; text-transform: uppercase; margin-right: -.34em; white-space: nowrap; }
.brand-sub { font-size: 9px; letter-spacing: .38em; text-transform: uppercase; opacity: .75; margin-top: 3px; margin-right: -.38em; }
@media (max-width: 860px) {
  .site-header .bar { grid-template-columns: auto 1fr auto; height: 72px; }
  .header-right .hbtn--avail { display: none; }
  .brand-word { font-size: 12px; letter-spacing: .24em; }
  .brand-sub { display: none; }
  .hbtn { padding: 0 14px; font-size: 12px; }
  .hbtn--apply { padding-right: 0; }
}
@media (max-width: 420px) { .brand { display: none; } .site-header .bar { grid-template-columns: auto 1fr auto; } .hbtn { padding: 0 12px; letter-spacing: .1em; } .hbtn--apply { padding-right: 0; } .hbtn--apply .arr { width: 40px; margin-left: 6px; } }

/* Full-screen menu */
.menu {
  position: fixed; inset: 0; z-index: var(--z-menu); background: var(--river-deep); color: var(--paper);
  display: grid; grid-template-rows: auto 1fr auto; padding: 0 var(--gutter);
  opacity: 0; visibility: hidden; transition: opacity var(--t-med) var(--ease-out), visibility 0s linear var(--t-med);
  overflow-y: auto;
}
body.menu-open .menu { opacity: 1; visibility: visible; transition: opacity var(--t-med) var(--ease-out); }
body.menu-open { overflow: hidden; }
.menu-top { display: flex; align-items: center; justify-content: space-between; height: 88px; }
.menu-body { display: grid; gap: var(--s6); align-content: center; padding: var(--s5) 0; }
@media (min-width: 900px) { .menu-body { grid-template-columns: 7fr 4fr; align-items: end; } }
.menu-nav ol { list-style: none; margin: 0; padding: 0; counter-reset: m; }
.menu-nav li { counter-increment: m; border-bottom: 1px solid var(--line-light); }
.menu-nav a { display: flex; align-items: baseline; gap: var(--s4); padding: 10px 0; text-decoration: none; font-family: var(--serif); font-size: clamp(34px, 5.4vw, 64px); line-height: 1.1; transition: color var(--t-fast), padding var(--t-med) var(--ease-out); }
.menu-nav a::before { content: "0" counter(m); font-family: var(--sans); font-size: 12px; letter-spacing: .2em; color: #D9BC8A; min-width: 28px; }
.menu-nav a:hover, .menu-nav a[aria-current="page"] { color: #D9BC8A; padding-left: 12px; }
.menu-aside p { color: rgba(244,239,230,.8); margin-bottom: var(--s4); }
.menu-aside .btn { width: 100%; margin-bottom: var(--s3); }
.menu-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s3); padding: var(--s4) 0; border-top: 1px solid var(--line-light); font-size: 13px; color: rgba(244,239,230,.7); }
.menu .reveal-m { opacity: 0; transform: translateY(18px); transition: opacity 600ms var(--ease-out), transform 600ms var(--ease-out); }
body.menu-open .menu .reveal-m { opacity: 1; transform: none; }
body.menu-open .menu li:nth-child(2) .reveal-m { transition-delay: 40ms; }
body.menu-open .menu li:nth-child(3) .reveal-m { transition-delay: 80ms; }
body.menu-open .menu li:nth-child(4) .reveal-m { transition-delay: 120ms; }
body.menu-open .menu li:nth-child(5) .reveal-m { transition-delay: 160ms; }
body.menu-open .menu li:nth-child(6) .reveal-m { transition-delay: 200ms; }

/* Floating tour / contact pills */
.floaters { position: fixed; right: clamp(12px, 2vw, 24px); bottom: clamp(12px, 2vw, 24px); z-index: 30; display: flex; gap: 10px; }
.pill {
  display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 20px; border-radius: 999px;
  background: var(--white); color: var(--ink); text-decoration: none; font-size: 15px; font-weight: 500;
  box-shadow: 0 6px 24px rgba(22,39,44,.18), 0 0 0 1px rgba(28,36,38,.08);
  transition: transform var(--t-fast) var(--ease-out), box-shadow var(--t-fast);
}
.pill svg { width: 18px; height: 18px; color: var(--brass-text); }
.pill:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(22,39,44,.24), 0 0 0 1px rgba(28,36,38,.08); }
.pill--dark { background: var(--ink); color: var(--paper); }
.pill--dark svg { color: #D9BC8A; }
@media (max-width: 520px) { .pill { padding: 0 16px; font-size: 14px; } }

/* Centered hero lockup */
.lockup { text-align: center; display: flex; flex-direction: column; align-items: center; }
.lockup .word { font-family: var(--sans); font-weight: 400; font-size: clamp(34px, 6.6vw, 92px); letter-spacing: .16em; margin-right: -.16em; line-height: 1; text-transform: uppercase; }
.lockup .sub { display: flex; align-items: center; gap: 16px; margin-top: var(--s4); font-size: clamp(12px, 1.6vw, 20px); letter-spacing: .38em; margin-right: -.38em; text-transform: uppercase; }
.lockup .sub::before, .lockup .sub::after { content: ""; width: clamp(20px, 4vw, 56px); height: 1px; background: currentColor; opacity: .7; }
.scroll-cue { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); width: 44px; height: 44px; display: grid; place-items: center; color: #D9BC8A; }
.scroll-cue svg { width: 22px; height: 22px; animation: bob 2.2s var(--ease-out) infinite; }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; color: var(--paper); overflow: hidden; background: var(--river-deep); }
.hero-media { position: absolute; inset: 0; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; transform: scale(1.06); animation: heroSettle 2.4s var(--ease-out) forwards; }
.hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(22,39,44,.55) 0%, rgba(22,39,44,.12) 32%, rgba(22,39,44,.35) 58%, rgba(22,39,44,.9) 100%); }
@keyframes heroSettle { to { transform: scale(1); } }
.hero-content { position: relative; width: 100%; padding-bottom: clamp(40px, 8vh, 96px); padding-top: 140px; }
.hero h1 { max-width: 12ch; }
.hero-foot { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--s5); margin-top: var(--s5); border-top: 1px solid var(--line-light); padding-top: var(--s4); }
.hero-foot p { max-width: 460px; margin: 0; font-size: 17px; opacity: .92; }
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--s3); }
.badge { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; margin-bottom: var(--s4); }
.badge .dot { width: 8px; height: 8px; border-radius: 50%; background: #D9BC8A; box-shadow: 0 0 0 0 rgba(217,188,138,.6); animation: pulse 2.4s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(217,188,138,.55); } 70% { box-shadow: 0 0 0 12px rgba(217,188,138,0); } 100% { box-shadow: 0 0 0 0 rgba(217,188,138,0); } }

.page-hero { position: relative; min-height: 72svh; display: flex; align-items: flex-end; color: var(--paper); background: var(--river-deep); overflow: hidden; }
.page-hero .hero-media img { animation-duration: 2s; }
.page-hero .hero-content { padding-bottom: clamp(40px, 7vh, 80px); }
.page-hero h1 { font-size: clamp(46px, 7.4vw, 108px); max-width: 14ch; }
.page-hero--plain { min-height: auto; padding-top: 170px; padding-bottom: var(--s6); background: var(--paper); color: var(--ink); }

/* ---------- Sections ---------- */
section { position: relative; }
.section { padding: clamp(72px, 11vw, 160px) 0; }
.section--tight { padding: clamp(56px, 7vw, 96px) 0; }
.section--alt { background: var(--paper-2); }
.section--dark { background: var(--river-deep); color: var(--paper); }
.section--river { background: var(--river); color: var(--paper); }
.section-head { display: grid; grid-template-columns: 1fr; gap: var(--s4); margin-bottom: clamp(40px, 6vw, 80px); }
@media (min-width: 900px) { .section-head { grid-template-columns: 5fr 6fr; align-items: end; gap: var(--s6); } .section-head p { margin: 0; } }

.split { display: grid; gap: clamp(40px, 6vw, 96px); align-items: center; }
@media (min-width: 900px) { .split { grid-template-columns: 1fr 1fr; } .split--wide-media { grid-template-columns: 7fr 5fr; } .split--reverse > :first-child { order: 2; } }

.figure { position: relative; margin: 0; overflow: hidden; background: var(--paper-3); }
.figure img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.figure:hover img { transform: scale(1.03); }
.figure--tall { aspect-ratio: 4 / 5; }
.figure--wide { aspect-ratio: 16 / 10; }
.figure--pano { aspect-ratio: 21 / 9; }
.figure figcaption { position: absolute; left: 0; bottom: 0; right: 0; padding: 40px 20px 14px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--paper); background: linear-gradient(transparent, rgba(22,39,44,.7)); }
.frame { position: relative; }
.frame::before { content: ""; position: absolute; inset: 18px -18px -18px 18px; border: 1px solid var(--brass); z-index: 0; pointer-events: none; }
.frame > * { position: relative; z-index: 1; }
@media (max-width: 600px) { .frame::before { inset: 10px -10px -10px 10px; } }

/* Stats */
.stats { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); }
@media (min-width: 900px) { .stats { grid-template-columns: repeat(4, 1fr); } }
.stat { padding: var(--s5) var(--s4) var(--s5) 0; border-bottom: 1px solid var(--line); }
@media (min-width: 900px) { .stat + .stat { padding-left: var(--s4); border-left: 1px solid var(--line); } }
.stat .num { font-family: var(--serif); font-size: clamp(44px, 5vw, 72px); line-height: 1; font-variant-numeric: lining-nums tabular-nums; }
.stat .lbl { display: block; margin-top: 10px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-soft); }
.on-dark .stats, .on-dark .stat { border-color: var(--line-light); }
.on-dark .stat .lbl { color: rgba(244,239,230,.75); }

/* Feature list */
.features { display: grid; gap: 0; grid-template-columns: 1fr; border-top: 1px solid var(--line); }
@media (min-width: 700px) { .features { grid-template-columns: 1fr 1fr; column-gap: var(--s6); } }
.feature { display: grid; grid-template-columns: 40px 1fr; gap: var(--s3); padding: var(--s4) 0; border-bottom: 1px solid var(--line); }
.feature svg { width: 26px; height: 26px; color: var(--brass-text); margin-top: 3px; }
.feature h3 { font-size: 24px; margin-bottom: 4px; }
.feature p { margin: 0; color: var(--ink-soft); font-size: 16px; }
.on-dark .features, .on-dark .feature { border-color: var(--line-light); }
.on-dark .feature svg { color: #D9BC8A; }
.on-dark .feature p { color: rgba(244,239,230,.78); }

/* Cards (index teasers) */
.cards { display: grid; gap: var(--s5); grid-template-columns: 1fr; }
@media (min-width: 800px) { .cards { grid-template-columns: repeat(3, 1fr); gap: var(--s4); } }
.card { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.card .figure { aspect-ratio: 4 / 5; margin-bottom: var(--s4); }
.card .num-label { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--brass-text); margin-bottom: 8px; }
.card h3 { margin-bottom: 10px; }
.card p { color: var(--ink-soft); margin-bottom: var(--s3); }
.card .link-arrow { align-self: flex-start; margin-top: auto; }

/* Pull quote / river band */
.river-band { position: relative; overflow: hidden; color: var(--paper); background: var(--river-deep); }
.river-band .hero-media::after { background: linear-gradient(90deg, rgba(22,39,44,.92) 0%, rgba(22,39,44,.55) 55%, rgba(22,39,44,.2) 100%); }
.river-band .inner { position: relative; padding: clamp(96px, 14vw, 200px) 0; max-width: 640px; }
.wave-rule { display: block; width: 120px; height: 14px; color: #D9BC8A; margin-bottom: var(--s4); }

/* Facade drawing */
.facade-drawing { width: 100%; height: auto; color: var(--ink); }
.facade-drawing .accent { color: var(--brass); }
.on-dark .facade-drawing { color: var(--paper); }

/* Timeline */
.timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.timeline::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 1px; background: var(--line); }
@media (min-width: 900px) { .timeline::before { left: 50%; } }
.tl-item { position: relative; padding: 0 0 var(--s6) 44px; }
.tl-item::before { content: ""; position: absolute; left: 0; top: 14px; width: 15px; height: 15px; border-radius: 50%; background: var(--paper); border: 1px solid var(--brass); }
.tl-item.is-key::before { background: var(--brass); }
.tl-year { font-family: var(--serif); font-size: clamp(40px, 4.4vw, 60px); line-height: 1; color: var(--brass-text); font-variant-numeric: lining-nums; }
.tl-item h3 { margin: 10px 0 12px; font-size: clamp(24px, 2.2vw, 30px); }
.tl-item p { color: var(--ink-2); margin: 0; }
@media (min-width: 900px) {
  .tl-item { width: 50%; padding: 0 64px var(--s6) 0; text-align: right; }
  .tl-item::before { left: auto; right: -8px; }
  .tl-item:nth-child(even) { margin-left: 50%; padding: 0 0 var(--s6) 64px; text-align: left; }
  .tl-item:nth-child(even)::before { right: auto; left: -7px; }
}

/* Neighborhood */
.filter-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--s5); }
.chip {
  min-height: 44px; padding: 0 20px; border: 1px solid var(--line); background: transparent; color: var(--ink);
  font-size: 13px; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: all var(--t-fast) var(--ease-out);
}
.chip:hover { border-color: var(--ink); }
.chip[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.places { display: grid; gap: 0; grid-template-columns: 1fr; border-top: 1px solid var(--line); }
@media (min-width: 800px) { .places { grid-template-columns: 1fr 1fr; column-gap: var(--s6); } }
.place { display: grid; grid-template-columns: 1fr auto; gap: 4px var(--s3); padding: var(--s4) 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.place[hidden] { display: none; }
.place h3 { font-size: 26px; }
.place .walk { font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--brass-text); white-space: nowrap; font-variant-numeric: tabular-nums; }
.place p { grid-column: 1 / -1; margin: 0; color: var(--ink-soft); font-size: 16px; }
.place .cat { grid-column: 1 / -1; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-soft); }
.map-embed { width: 100%; aspect-ratio: 16 / 9; border: 0; filter: grayscale(.55) sepia(.18) contrast(1.02); background: var(--paper-3); }
@media (max-width: 700px) { .map-embed { aspect-ratio: 4 / 5; } }

/* Mosaic */
.mosaic { display: grid; gap: var(--s3); grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .mosaic { grid-template-columns: repeat(12, 1fr); grid-auto-rows: 120px; gap: var(--s4); } .mosaic .m1 { grid-column: 1 / 8; grid-row: span 4; } .mosaic .m2 { grid-column: 8 / 13; grid-row: span 2; } .mosaic .m3 { grid-column: 8 / 13; grid-row: span 2; } }
.mosaic .figure { aspect-ratio: auto; min-height: 200px; }
.mosaic .m1 { grid-column: 1 / -1; min-height: 280px; }

/* Residences / units */
.unit-types { display: grid; gap: var(--s4); grid-template-columns: 1fr; }
@media (min-width: 800px) { .unit-types { grid-template-columns: 1fr 1fr; } }
.unit-type { background: var(--white); border: 1px solid var(--line); padding: clamp(28px, 4vw, 48px); display: flex; flex-direction: column; }
.unit-type .plan { aspect-ratio: 4 / 3; background: var(--paper-2); border: 1px dashed var(--paper-3); display: grid; place-items: center; margin-bottom: var(--s4); color: var(--ink-soft); }
.unit-type .plan svg { width: 70%; height: auto; color: var(--ink-2); }
.unit-type dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: var(--s4) 0; border-top: 1px solid var(--line); }
.unit-type dl div { padding: 14px 0; border-bottom: 1px solid var(--line); }
.unit-type dt { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-soft); }
.unit-type dd { margin: 2px 0 0; font-family: var(--serif); font-size: 26px; font-variant-numeric: lining-nums tabular-nums; }
.unit-type .actions { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: auto; }

.appfolio-shell { background: var(--white); border: 1px solid var(--line); padding: clamp(20px, 3vw, 40px); min-height: 240px; }
.appfolio-shell iframe { width: 100%; border: 0; min-height: 900px; }
.notice { display: flex; gap: var(--s3); align-items: flex-start; padding: var(--s4); border-left: 2px solid var(--brass); background: var(--paper-2); }
.notice svg { width: 22px; height: 22px; flex: none; color: var(--brass-text); margin-top: 3px; }
.notice p { margin: 0; }

/* Steps */
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4); grid-template-columns: 1fr; counter-reset: step; }
@media (min-width: 800px) { .steps { grid-template-columns: repeat(3, 1fr); } }
.steps li { counter-increment: step; border-top: 1px solid var(--line-light); padding-top: var(--s4); }
.steps li::before { content: "0" counter(step); display: block; font-family: var(--serif); font-size: 44px; line-height: 1; color: #D9BC8A; margin-bottom: var(--s3); }
.steps h3 { font-size: 26px; margin-bottom: 8px; }
.steps p { margin: 0; color: rgba(244,239,230,.8); }

/* Forms */
.form { display: grid; gap: var(--s4); grid-template-columns: 1fr; }
@media (min-width: 700px) { .form { grid-template-columns: 1fr 1fr; } .form .full { grid-column: 1 / -1; } }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label, .field legend { font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-2); }
.field .req { color: var(--brass-text); }
.field input, .field select, .field textarea {
  width: 100%; min-height: 52px; padding: 12px 16px; border: 1px solid rgba(28,36,38,.35); background: var(--white); color: var(--ink);
  font: inherit; font-size: 16px; border-radius: 0; transition: border-color var(--t-fast);
  -webkit-appearance: none; appearance: none;
}
.field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C2426' stroke-width='1.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 18px; padding-right: 44px; }
.field textarea { min-height: 140px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(168,132,76,.35); }
.field .hint { font-size: 14px; color: var(--ink-soft); }
.field .err { font-size: 14px; color: var(--error); display: none; }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color: var(--error); }
.field.has-error .err { display: block; }
.checks { display: flex; flex-wrap: wrap; gap: 8px; border: 0; padding: 0; margin: 0; }
.checks legend { margin-bottom: 10px; }
.check { position: relative; }
.check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.check span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid rgba(28,36,38,.35); background: var(--white); cursor: pointer; font-size: 15px; transition: all var(--t-fast); }
.check input:checked + span { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.check input:focus-visible + span { outline: 2px solid var(--brass); outline-offset: 2px; }
/* Opt-in sentences (main.js "Stay in touch") read as sentences, not as small-caps field labels. */
.checks--consent label.check { text-transform: none; letter-spacing: normal; font-size: 15px; }
.checks--consent .check span { line-height: 1.45; padding-top: 10px; padding-bottom: 10px; }
.form-status { grid-column: 1 / -1; padding: var(--s4); display: none; }
.form-status.is-success { display: block; background: #E3EADF; border-left: 2px solid var(--success); }
.form-status.is-error { display: block; background: #F3E1DC; border-left: 2px solid var(--error); }
.form-status h3 { font-size: 26px; margin-bottom: 6px; }
.form-status p { margin: 0; }

/* Contact block */
.contact-grid { display: grid; gap: var(--s6); grid-template-columns: 1fr; }
@media (min-width: 1000px) { .contact-grid { grid-template-columns: 4fr 7fr; } }
.contact-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.contact-list li { padding: var(--s4) 0; border-bottom: 1px solid var(--line); }
.contact-list .k { display: block; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 4px; }
.contact-list .v { font-family: var(--serif); font-size: 26px; line-height: 1.25; text-decoration: none; }
.contact-list a.v:hover { color: var(--brass-text); }

/* CTA band */
.cta-band { text-align: center; }
.cta-band h2 { max-width: 16ch; margin: 0 auto var(--s4); }
.cta-band p { max-width: 560px; margin: 0 auto var(--s5); }
.cta-band .hero-actions { justify-content: center; }

/* Footer */
.site-footer { background: var(--river-deep); color: rgba(244,239,230,.82); padding: var(--s7) 0 var(--s5); font-size: 15px; }
.footer-top { display: grid; gap: var(--s6); grid-template-columns: 1fr; padding-bottom: var(--s6); border-bottom: 1px solid var(--line-light); }
@media (min-width: 900px) { .footer-top { grid-template-columns: 5fr 3fr 3fr 3fr; } }
.site-footer h2 { font-size: clamp(34px, 4vw, 54px); color: var(--paper); margin-bottom: var(--s4); }
.site-footer h3 { font-family: var(--sans); font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: #D9BC8A; margin-bottom: var(--s3); font-weight: 500; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: 8px; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--paper); text-decoration: underline; text-underline-offset: 4px; }
.owner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s4); padding: var(--s5) 0; border-bottom: 1px solid var(--line-light); }
.owner-link { display: inline-flex; align-items: center; gap: var(--s4); text-decoration: none; }
.owner-logo { background: #fff; padding: 10px 14px; width: 150px; height: auto; transition: transform var(--t-fast) var(--ease-out); }
.owner-link:hover .owner-logo { transform: translateY(-2px); }
.owner-link span { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; }
.footer-legal { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s5); justify-content: space-between; padding-top: var(--s4); font-size: 13px; color: rgba(244,239,230,.7); }
.eho { display: inline-flex; align-items: center; gap: 10px; }
.eho svg { width: 28px; height: 28px; }

/* Reveal motion */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity var(--t-slow) var(--ease-out), transform var(--t-slow) var(--ease-out); }
.reveal.is-in { opacity: 1; transform: none; }
.reveal[data-delay="1"] { transition-delay: 90ms; }
.reveal[data-delay="2"] { transition-delay: 180ms; }
.reveal[data-delay="3"] { transition-delay: 270ms; }
.no-js .reveal { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .hero-media img { transform: none; }
}

.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; }
.credits { font-size: 12px; color: rgba(244,239,230,.55); margin-top: var(--s3); }
.credits a { text-decoration: underline; }

/* ================= Nevins-style components ================= */
.title { font-family: var(--serif); text-transform: uppercase; letter-spacing: .005em; line-height: .98; font-weight: 400; }
.title--xl { font-size: clamp(52px, 8vw, 116px); }
.title--lg { font-size: clamp(44px, 6vw, 88px); }
.center { text-align: center; }
.copy-lg { font-size: clamp(19px, 1.7vw, 24px); line-height: 1.55; color: var(--ink-2); }
.on-dark .copy-lg { color: rgba(248,246,241,.9); }

/* Gold CTA with arrow block */
.cta { display: inline-flex; align-items: stretch; min-height: 56px; text-decoration: none; cursor: pointer; border: 0; padding: 0; background: none; font-family: var(--sans); }
.cta .t { display: inline-flex; align-items: center; padding: 0 30px; background: #D2AE5A; color: #1D2630; font-size: clamp(17px, 1.6vw, 22px); font-weight: 500; letter-spacing: .02em; text-transform: uppercase; transition: background var(--t-fast); }
.cta .a { display: inline-grid; place-items: center; width: 60px; flex: none; background: var(--river-deep); color: var(--paper); }
/* A CTA never runs past its box (listing panel, waitlist cards, small phones): a long label wraps instead */
.cta { max-width: 100%; }
.cta .a svg { width: 18px; height: 18px; transition: transform var(--t-fast) var(--ease-out); }
.cta:hover .t { background: #E0BE6C; }
.cta:hover .a svg { transform: translate(2px, -2px); }
.cta--dark .t { background: var(--river-deep); color: var(--paper); }
.cta--dark .a { background: #D2AE5A; color: #1D2630; }
.cta--dark:hover .t { background: var(--river); }
.cta[disabled] { opacity: .6; cursor: progress; }

/* Split: image + centered copy */
.intro-split { display: grid; gap: clamp(40px, 6vw, 96px); align-items: center; }
@media (min-width: 900px) { .intro-split { grid-template-columns: 1fr 1fr; } .intro-split.rev > :first-child { order: 2; } }
.intro-split .copy { text-align: center; max-width: 560px; margin: 0 auto; }
.intro-split .copy .title { margin-bottom: var(--s5); }

/* Carousel (peeking slides) */
.carousel { position: relative; overflow: hidden; }
.carousel-track { display: flex; gap: 30px; transition: transform 800ms var(--ease-out); will-change: transform; }
.carousel-slide { flex: 0 0 min(64vw, 1220px); aspect-ratio: 16 / 9; margin: 0; overflow: hidden; background: var(--paper-3); opacity: .55; transition: opacity 800ms var(--ease-out); }
.carousel-slide.is-active { opacity: 1; }
.carousel-slide img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 700px) { .carousel-slide { flex-basis: 84vw; aspect-ratio: 4 / 3; } .carousel-track { gap: 12px; } }
.carousel-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; display: grid; place-items: center; border: 0; background: rgba(36,49,59,.35); color: #E8C877; cursor: pointer; z-index: 2; transition: background var(--t-fast); }
.carousel-btn:hover { background: rgba(36,49,59,.7); }
.carousel-btn svg { width: 26px; height: 26px; }
.carousel-btn.prev { left: clamp(8px, 2vw, 24px); }
.carousel-btn.next { right: clamp(8px, 2vw, 24px); }
.carousel-caption { text-align: center; margin-top: var(--s4); font-size: clamp(17px, 1.6vw, 22px); color: var(--ink-2); min-height: 1.6em; padding: 0 var(--gutter); }
.carousel-dots { display: flex; justify-content: center; gap: 4px; margin-top: 8px; }
.carousel-dots button { width: 32px; height: 32px; border: 0; background: none; cursor: pointer; display: grid; place-items: center; padding: 0; }
.carousel-dots button::after { content: ""; width: 18px; height: 2px; background: var(--line); transition: background var(--t-fast), width var(--t-fast); }
.carousel-dots button[aria-current="true"]::after { background: var(--brass); width: 28px; }

/* Collage */
.collage { position: relative; display: grid; gap: var(--s4); grid-template-columns: 1fr 1fr; }
.collage .c-copy { grid-column: 1 / -1; text-align: center; padding: var(--s5) 0; }
.collage .c-copy .title { margin-bottom: var(--s5); }
.collage .c-copy p { max-width: 620px; margin: 0 auto var(--s5); }
.collage figure { margin: 0; overflow: hidden; background: var(--paper-3); }
.collage img { width: 100%; height: 100%; object-fit: cover; }
.collage .c1 { aspect-ratio: 3/4; } .collage .c2 { aspect-ratio: 3/4; } .collage .c3, .collage .c4, .collage .c5 { aspect-ratio: 4/3; }
.collage .c5 { grid-column: 1 / -1; }
@media (min-width: 1000px) {
  .collage { display: block; min-height: 860px; }
  .collage figure { position: absolute; box-shadow: 0 20px 50px rgba(36,49,59,.12); }
  .collage .c-copy { position: relative; z-index: 2; width: 42%; margin: 0 auto; padding: 60px 0 0; }
  .collage .c1 { left: 5%; top: 0; width: 22%; aspect-ratio: 4/5; }
  .collage .c2 { left: 0; top: 490px; width: 25%; aspect-ratio: 3/2; z-index: 1; }
  .collage .c3 { right: 26%; top: 60px; width: 11%; aspect-ratio: 3/2; }
  .collage .c4 { right: 0; top: 50px; width: 19%; aspect-ratio: 1/1; }
  .collage .c5 { right: 2%; top: 440px; width: 24%; aspect-ratio: 3/2; }
}

/* Full-bleed image band */
.band { position: relative; min-height: min(78vh, 720px); display: grid; place-items: center; text-align: center; color: var(--paper); overflow: hidden; background: var(--river-deep); }
.band .hero-media::after { background: rgba(26,36,44,.42); }
.band .inner { position: relative; padding: var(--s7) var(--gutter); max-width: 900px; }
.band .title { margin-bottom: var(--s4); text-shadow: 0 2px 30px rgba(0,0,0,.25); }
.band p { font-size: clamp(18px, 1.8vw, 24px); margin-bottom: var(--s5); }

/* Wave-framed panel (river motif) */
.wave-section { position: relative; background: var(--river-deep); padding: clamp(56px, 8vw, 120px) 0; overflow: hidden; }
.wave-section::before {
  content: ""; position: absolute; inset: 0; opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='20' viewBox='0 0 80 20'%3E%3Cpath d='M0 10 Q10 2 20 10 T40 10 T60 10 T80 10' fill='none' stroke='%237C8C95' stroke-width='1.6'/%3E%3C/svg%3E");
  background-size: 80px 20px;
}
.panel { position: relative; background: var(--sage-bar); color: var(--ink); padding: clamp(40px, 7vw, 110px) clamp(20px, 6vw, 96px); }
.panel .title { text-align: center; margin-bottom: var(--s4); }
.panel > .copy-lg { text-align: center; max-width: 640px; margin: 0 auto var(--s6); }
.panel .form { max-width: 980px; margin: 0 auto; }
.panel .field input, .panel .field select, .panel .field textarea { background: var(--white); }
/* Drawer menu (overrides full-screen menu) */
.menu { inset: 0 auto 0 0; width: min(480px, 100%); background: var(--sage-bar); color: var(--ink); padding: 0 var(--s5); grid-template-rows: auto 1fr auto; transform: translateX(-100%); opacity: 1; visibility: hidden; transition: transform 520ms var(--ease-out), visibility 0s linear 520ms; }
body.menu-open .menu { transform: none; visibility: visible; transition: transform 520ms var(--ease-out); }
.scrim { position: fixed; inset: 0; z-index: calc(var(--z-menu) - 1); background: rgba(16,22,28,.62); opacity: 0; visibility: hidden; transition: opacity 400ms var(--ease-out), visibility 0s linear 400ms; border: 0; padding: 0; cursor: pointer; }
body.menu-open .scrim { opacity: 1; visibility: visible; transition: opacity 400ms var(--ease-out); }
.menu-top { justify-content: flex-end; }
.menu-close { width: 48px; height: 48px; display: grid; place-items: center; background: none; border: 0; color: var(--ink); cursor: pointer; margin-right: -12px; }
.menu-close svg { width: 26px; height: 26px; }
.menu-body { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: var(--s4); padding: 0 0 var(--s5); text-align: center; }
.menu-nav ol { counter-reset: none; }
.menu-nav li { border: 0; }
.menu-nav a { display: block; padding: 12px 0; font-family: var(--sans); font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2; }
.menu-nav a::before { content: none; }
.menu-nav a:hover, .menu-nav a[aria-current="page"] { color: var(--brass-text); padding-left: 0; }
.menu-nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 8px; text-decoration-thickness: 1px; }
.menu-aside { width: 100%; max-width: 320px; margin-top: var(--s3); }
.menu-aside .cta { width: 100%; }
.menu-aside .cta .t { flex: 1; justify-content: center; font-size: 17px; }
.menu-foot { border-color: var(--line); color: var(--ink-soft); justify-content: center; text-align: center; }
.menu-foot a { color: var(--ink); }

/* Joined MENU + name group */
.hgroup { display: inline-flex; }
.hgroup .hbtn + .hbtn { border-left: 0; }
.hbtn--name { display: inline-flex; }
@media (max-width: 1000px) { .hbtn--name { display: none; } }

/* ================= Victorian accents (kept light) ================= */
/* Period italic small caps for labels */
.eyebrow { font-family: var(--period); font-style: italic; font-size: 19px; font-weight: 500; letter-spacing: .06em; text-transform: none; font-variant: small-caps; }
.eyebrow::before { width: 22px; }
.eyebrow::after { content: ""; width: 22px; height: 1px; background: currentColor; }
.lede, .copy-period { font-family: var(--period); font-style: italic; font-weight: 400; }

/* Ornamental divider: rule · lozenge · rule, with tiny scrolls */
.ornament { display: flex; align-items: center; justify-content: center; gap: 14px; color: var(--brass); margin: var(--s4) auto; }
.ornament::before, .ornament::after { content: ""; height: 1px; width: clamp(40px, 8vw, 110px); background: linear-gradient(90deg, transparent, currentColor); }
.ornament::after { background: linear-gradient(90deg, currentColor, transparent); }
.ornament svg { width: 54px; height: 16px; flex: none; }

/* Arched window frame — echoes the building's arched doorway */
.arch { border-radius: 999px 999px 0 0; overflow: hidden; }
.arch-frame { position: relative; padding: 12px; }
.arch-frame::before { content: ""; position: absolute; inset: 0; border: 1px solid var(--brass); border-radius: 999px 999px 0 0; pointer-events: none; }
.arch-frame .figure { border-radius: 999px 999px 0 0; }

/* Double hairline frame (thin + thin with gap), period picture-frame feel */
.dbl-frame { position: relative; }
.dbl-frame::after { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(248,242,232,.7); outline: 1px solid rgba(248,242,232,.35); outline-offset: 4px; pointer-events: none; }
.panel { outline: 1px solid var(--brass); outline-offset: -14px; }
.panel::before, .panel::after { content: ""; position: absolute; width: 36px; height: 36px; border: 1px solid var(--brass); pointer-events: none; }
.panel::before { top: 22px; left: 22px; border-right: 0; border-bottom: 0; }
.panel::after { bottom: 22px; right: 22px; border-left: 0; border-top: 0; }

/* Drop cap */
.dropcap::first-letter { font-family: var(--serif); float: left; font-size: 5.2em; line-height: .82; padding: 6px 12px 0 0; color: var(--brass-text); }

/* Engraved-style numerals in stats */
.stat .num { font-family: var(--period); font-weight: 500; }
.stat .lbl { font-family: var(--period); font-style: italic; font-size: 17px; letter-spacing: .04em; text-transform: none; }

/* Subtle lattice pattern for alt sections (like pressed-tin ceilings) */
.section--alt { background-color: var(--paper-2); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cpath d='M22 4l18 18-18 18L4 22z' fill='none' stroke='%23A8844C' stroke-opacity='.10'/%3E%3Ccircle cx='22' cy='22' r='2' fill='%23A8844C' fill-opacity='.10'/%3E%3C/svg%3E"); }

/* Hero lockup gets a period sub-line */
.lockup .sub { font-family: var(--period); font-style: italic; text-transform: none; letter-spacing: .08em; margin-right: 0; font-size: clamp(18px, 2vw, 28px); }
.lockup .est { margin-top: var(--s3); font-size: 12px; letter-spacing: .4em; margin-right: -.4em; text-transform: uppercase; opacity: .85; }
/* ================= Solid page banner + availability table ================= */
.page-banner { background: var(--river); color: var(--paper); text-align: center; padding: 150px var(--gutter) clamp(48px, 7vw, 96px); position: relative; }
.page-banner::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 14px; opacity: .35; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='14' viewBox='0 0 40 14'%3E%3Cpath d='M0 7 Q10 0 20 7 T40 7' fill='none' stroke='%23F7F2E8' stroke-width='1.4'/%3E%3C/svg%3E"); background-size: 40px 14px; }
.page-banner .title { font-size: clamp(56px, 11vw, 160px); }
.page-banner .sub { font-family: var(--period); font-style: italic; font-size: clamp(20px, 2.2vw, 28px); margin-top: var(--s3); opacity: .92; }
.page-banner .ornament { color: #D9BC8A; }

.av-tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s5); margin: var(--s5) 0 var(--s4); }
.seg { display: flex; flex-wrap: wrap; gap: 8px; }
.seg button { min-height: 44px; min-width: 64px; padding: 0 16px; border: 1px solid var(--ink); background: transparent; color: var(--ink); font-size: 15px; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; transition: background var(--t-fast), color var(--t-fast); }
.seg button:hover { background: var(--paper-2); }
.seg button[aria-pressed="true"] { background: #D2AE5A; border-color: #D2AE5A; color: #1D2630; }
.range { display: flex; align-items: center; gap: var(--s3); flex: 1 1 320px; }
.range label { font-size: 15px; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.range input[type=range] { flex: 1; accent-color: var(--ink); min-height: 44px; }
.range output { font-family: var(--period); font-size: 22px; min-width: 90px; font-variant-numeric: tabular-nums; }

.table-panel { background: var(--sage-bar); padding: clamp(16px, 3vw, 48px); outline: 1px solid var(--brass); outline-offset: -10px; }
.units { width: 100%; border-collapse: collapse; }
.units caption { text-align: left; padding-bottom: var(--s3); color: var(--ink-soft); font-size: 15px; }
.units th { text-align: left; font-size: 15px; font-weight: 600; padding: 12px; color: var(--ink); border-bottom: 1px solid var(--ink); white-space: nowrap; }
.units th button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 6px 0; display: inline-flex; gap: 6px; align-items: center; }
.units th button::after { content: "↕"; opacity: .35; font-size: 12px; }
.units th[aria-sort="ascending"] button::after { content: "↑"; opacity: 1; }
.units th[aria-sort="descending"] button::after { content: "↓"; opacity: 1; }
.units td { padding: 16px 12px; border-bottom: 1px solid rgba(36,49,59,.35); font-size: clamp(18px, 1.8vw, 26px); text-transform: uppercase; font-variant-numeric: tabular-nums lining-nums; vertical-align: middle; }
.units td.num { font-family: var(--period); font-size: clamp(22px, 2.1vw, 30px); text-transform: none; }
.units .status { display: inline-flex; align-items: center; gap: 8px; }
.units .status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--brass); }
.units .status.is-available::before { background: var(--success); }
.units .status.is-leased { opacity: .55; }
.units .actions { text-align: right; white-space: nowrap; }
.units .actions a { display: inline-grid; place-items: center; width: 44px; height: 44px; color: var(--ink); text-decoration: none; }
.units .actions a svg { width: 20px; height: 20px; }
.units .actions a.apply { width: auto; padding: 0 14px; border: 1px solid var(--ink); font-size: 13px; letter-spacing: .12em; margin-left: 6px; }
.units .actions a.apply:hover { background: var(--ink); color: var(--paper); }
.empty-row td { text-align: center; text-transform: none; font-family: var(--period); font-style: italic; padding: var(--s6) 12px; }
@media (max-width: 820px) {
  .units thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .units tr { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; padding: var(--s4) 0; border-bottom: 1px solid rgba(36,49,59,.35); }
  .units td { border: 0; padding: 2px 0; font-size: 18px; }
  .units td::before { content: attr(data-label); display: block; font-size: 11px; letter-spacing: .18em; color: var(--ink-soft); text-transform: uppercase; font-family: var(--sans); font-style: normal; }
  .units td.actions { grid-column: 1 / -1; text-align: left; }
  .units td.actions::before { content: none; }
  .empty-row { display: block !important; }
}

.site-footer { padding-bottom: 120px; }
@media (max-width: 700px) { .scroll-cue { display: none; } }
.menu-aside .cta .t { white-space: nowrap; font-size: 15px; padding: 0 18px; }
.cta .t { white-space: nowrap; }
/* ...except where a one-line label would run past its box: inside the unit listing and on small phones */
.unit-dlg .cta .t { white-space: normal; }
@media (max-width: 420px) { .cta .t { white-space: normal; } }
[hidden] { display: none !important; }
.appfolio-inquiry { max-width: 980px; margin: 0 auto; }
.appfolio-inquiry iframe { width: 100%; min-height: 1100px; border: 0; background: var(--white); margin-bottom: var(--s3); }
.movein { display: inline-flex; align-items: center; gap: 10px; margin-top: var(--s3); padding: 10px 18px; border: 1px solid rgba(248,242,232,.5); font-family: var(--period); font-style: italic; font-size: clamp(17px, 1.6vw, 21px); }
.owner-logo { border-radius: 12px; overflow: hidden; }
.hero-logo { display: block; width: clamp(170px, 22vw, 280px); margin-bottom: var(--s4); color: var(--paper); filter: drop-shadow(0 2px 12px rgba(0,0,0,.35)); }
.hero-logo svg, .menu-logo svg { width: 100%; height: auto; display: block; }
.menu-logo { display: block; width: 200px; color: var(--ink); margin-bottom: var(--s2); }
.hero-logo { width: clamp(210px, 28vw, 340px); }

/* Tight architectural crop inside arched frames */
.figure--crop img { transform: scale(var(--z, 1.7)); transform-origin: var(--o, 50% 58%); filter: saturate(.9) sepia(.07) contrast(1.03); }
.figure--crop:hover img { transform: scale(calc(var(--z, 1.7) * 1.03)); }
.arch-frame { padding: 14px; }
.arch-frame::before { inset: 0; }

/* Stats: center each number over its label */
.stat, .stat + .stat { text-align: center; padding: var(--s5) var(--s3); }
.stat .lbl { margin-left: auto; margin-right: auto; }

/* Intro headline: two lines, one sentence each, allowed wider than the text column */
.intro-title { width: min(1100px, calc(100vw - 2 * var(--gutter))); position: relative; left: 50%; transform: translateX(-50%); font-size: clamp(30px, 6.2vw, 84px); }
.intro-title span { display: block; }
@media (min-width: 420px) { .intro-title span { white-space: nowrap; } }

/* Collage v2 — three-column grid so photos never overlap the headline */
@media (min-width: 1000px) {
  .collage {
    display: grid; min-height: 0; gap: var(--s4) clamp(24px, 3vw, 48px);
    grid-template-columns: 1fr minmax(0, 1.25fr) 1fr;
    grid-template-areas: "c1 copy c4" "c1 copy c3" "c2 copy c5";
    align-items: start;
  }
  .collage figure { position: relative; left: auto; right: auto; top: auto; width: auto; }
  .collage .c-copy { grid-area: copy; width: auto; margin: 0; padding: var(--s6) 0; align-self: center; }
  .collage .c-copy .title--xl { font-size: clamp(56px, 5.6vw, 92px); }
  .collage .c1 { grid-area: c1; aspect-ratio: 4 / 5; }
  .collage .c2 { grid-area: c2; aspect-ratio: 3 / 2; width: 88%; margin-top: var(--s5); }
  .collage .c4 { grid-area: c4; aspect-ratio: 1 / 1; width: 82%; justify-self: end; margin-top: var(--s5); }
  .collage .c3 { grid-area: c3; aspect-ratio: 3 / 2; width: 58%; justify-self: start; margin-top: calc(-1 * var(--s5)); z-index: 1; }
  .collage .c5 { grid-area: c5; aspect-ratio: 3 / 2; margin-top: var(--s4); }
}
@media (min-width: 1000px) {
  .collage figure.c1, .collage figure.c2, .collage figure.c3, .collage figure.c4, .collage figure.c5 { position: relative; left: auto; right: auto; top: auto; bottom: auto; }
  .collage figure.c1 { width: 100%; }
  .collage figure.c2 { width: 88%; }
  .collage figure.c3 { width: 58%; }
  .collage figure.c4 { width: 82%; }
  .collage figure.c5 { width: 100%; }
  .collage .c-copy .title--xl { font-size: clamp(52px, 5.2vw, 80px); }
}

/* Collage without photos: a single centered text block */
.collage--text, .collage.collage--text { display: block; min-height: 0; }
.collage--text .c-copy { max-width: 760px; margin: 0 auto; padding: var(--s4) 0; text-align: center; }
.collage--text .c-copy .title--xl { font-size: clamp(52px, 7vw, 104px); }

/* Residences: traced facade elevation */
.facade-wrap { max-width: 1100px; margin: 0 auto; }
.facade-art { color: var(--ink); }
.facade-art svg { width: 100%; height: auto; display: block; }
.facade-labels { position: relative; height: 2.2em; margin-top: 10px; }
.facade-labels span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; font-family: var(--period); font-style: italic; font-size: clamp(14px, 1.6vw, 20px); color: var(--ink-2); }

/* ================= Neighborhood map ================= */
.nbhd-map-wrap { margin: 0 0 var(--s6); }
.nbhd-map { height: clamp(380px, 60vh, 620px); background: var(--paper-2); outline: 1px solid var(--brass); outline-offset: 8px; z-index: 0; }
/* Warm, muted period tint on the base map so it matches the site palette */
.nbhd-map .leaflet-tile-pane { filter: grayscale(1) sepia(.28) brightness(1.04) contrast(.92); }
.nbhd-map .leaflet-control-attribution { background: rgba(247,242,232,.85); color: var(--ink-soft); font-family: var(--sans); font-size: 11px; }
.nbhd-map .leaflet-control-zoom a { background: var(--paper); color: var(--ink); border-color: var(--line); width: 36px; height: 36px; line-height: 34px; font-size: 20px; }
.nbhd-map .leaflet-control-zoom a:hover { background: var(--ink); color: var(--paper); }
.nbhd-map .leaflet-bar { border: 1px solid var(--ink); border-radius: 0; box-shadow: none; }
.map-hint { margin-top: var(--s4); }

.pin-wrap { background: none; border: 0; }
.pin { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: var(--paper); font: 600 13px/1 var(--sans); border: 2px solid #D2AE5A; box-shadow: 0 3px 10px rgba(22,39,44,.35); transition: transform var(--t-fast) var(--ease-out), background var(--t-fast); }
.leaflet-marker-icon:hover .pin, .leaflet-marker-icon:focus .pin { transform: scale(1.15); background: #D2AE5A; color: var(--ink); }
.pin-home-wrap { background: none; border: 0; }
.pin-home { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; padding: 8px 12px; background: var(--sage-bar); color: var(--ink); border: 1px solid var(--ink); font: 600 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; box-shadow: 0 4px 14px rgba(22,39,44,.3); transform: translateY(-100%); }
.pin-home-dot { width: 10px; height: 10px; border-radius: 50%; background: #D2AE5A; border: 2px solid var(--ink); }

.nbhd-map .leaflet-popup-content-wrapper { background: var(--paper); color: var(--ink); border-radius: 0; border: 1px solid var(--brass); box-shadow: 0 10px 30px rgba(22,39,44,.2); }
.nbhd-map .leaflet-popup-tip { background: var(--paper); border: 1px solid var(--brass); }
.nbhd-map .leaflet-popup-content { margin: 14px 18px; }
.pop { display: flex; flex-direction: column; gap: 4px; min-width: 180px; }
.pop-cat { font: 500 10px/1.2 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--brass-text); }
.pop strong { font: 400 24px/1.1 var(--serif); }
.pop-walk { font: italic 16px/1.3 var(--period); color: var(--ink-2); }
.pop a { margin-top: 6px; font: 500 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }

/* Numbers in the list */
.place h3 { display: flex; align-items: center; gap: 12px; }
.pin-no { flex: none; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--ink); background: transparent; color: var(--ink); font: 600 13px/1 var(--sans); cursor: pointer; display: grid; place-items: center; transition: background var(--t-fast), color var(--t-fast); }
.pin-no:hover, .place.is-active .pin-no { background: var(--ink); color: var(--paper); }
.place.is-active h3 { color: var(--brass-text); }
.pin-home { width: 38px; height: 38px; display: grid; place-items: center; padding: 0; gap: 0; background: #D2AE5A; color: var(--ink); border: 2px solid var(--ink); transform: rotate(45deg); box-shadow: 0 4px 14px rgba(22,39,44,.35); }
.pin-home svg { width: 20px; height: 20px; transform: rotate(-45deg); }
.nbhd-map .home-tip { background: var(--ink); color: var(--paper); border: 0; border-radius: 0; box-shadow: none; padding: 4px 8px; font: 600 10px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.nbhd-map .home-tip::before { border-bottom-color: var(--ink); }
.pin-logo { position: relative; width: 104px; height: 56px; padding: 6px 8px; background: var(--paper); color: var(--ink); border: 1.5px solid #B8923F; box-shadow: 0 6px 18px rgba(22,39,44,.3); }
.pin-logo svg { width: 100%; height: 100%; display: block; }
.pin-logo::after { content: ""; position: absolute; left: 50%; bottom: -9px; width: 14px; height: 14px; background: var(--paper); border-right: 1.5px solid #B8923F; border-bottom: 1.5px solid #B8923F; transform: translateX(-50%) rotate(45deg); }

/* Crop without transforms: size the photo up and offset it, so nothing animates
   and the arched frame's clipping stays stable while the section fades in. */
.figure--crop { position: relative; }
.figure--crop img, .figure--crop:hover img {
  position: absolute; max-width: none; transform: none; transition: none;
  width: calc(100% * var(--z, 1.7)); height: calc(100% * var(--z, 1.7));
  left: calc((1 - var(--z, 1.7)) * var(--ox, 50%)); top: calc((1 - var(--z, 1.7)) * var(--oy, 58%));
  object-fit: cover; object-position: 50% 50%;
}
/* Fade only (no slide) for framed photos, so the clip edge never moves */
.arch-frame.reveal, .figure.reveal { transform: none; }

/* ================= Availability v2 (after Gowanus Wharf) ================= */
.av-intro { text-align: center; color: var(--ink-2); font-size: 17px; margin: 0 auto var(--s5); }
.av-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s4); margin-bottom: var(--s4); }
.av-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.av-chips button { min-height: 40px; padding: 0 14px; border: 1px solid var(--ink); background: transparent; color: var(--ink); font: 500 14px/1 var(--sans); letter-spacing: .04em; text-transform: uppercase; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); }
.av-chips button:hover { background: var(--paper-2); }
.av-chips button[aria-pressed="true"] { background: #D2AE5A; border-color: #D2AE5A; color: #1D2630; }
.av-bar .range { flex: 1 1 280px; }
.av-view { display: inline-flex; margin-left: auto; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: var(--white); }
.av-view button { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 18px; border: 0; border-radius: 999px; background: transparent; color: var(--ink); font: 500 15px/1 var(--sans); cursor: pointer; transition: background var(--t-fast); }
.av-view button svg { width: 16px; height: 16px; }
.av-view button[aria-pressed="true"] { background: #D2AE5A; color: #1D2630; }

.av-panel { background: var(--sage-bar); padding: clamp(16px, 3.5vw, 56px); }

/* List view */
.av-table { width: 100%; border-collapse: collapse; }
.av-table th { text-align: left; padding: 0 12px 14px; font: 600 16px/1.2 var(--sans); color: var(--ink); white-space: nowrap; }
.av-table th button { font: inherit; color: inherit; background: none; border: 0; padding: 4px 0; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.av-table th[aria-sort="ascending"] button::after { content: "↑"; font-size: 12px; }
.av-table th[aria-sort="descending"] button::after { content: "↓"; font-size: 12px; }
.av-table td { padding: 18px 10px; border-bottom: 1px solid rgba(36,49,59,.55); font: 400 clamp(18px, 1.85vw, 28px)/1.1 var(--sans); text-transform: uppercase; color: var(--ink); font-variant-numeric: tabular-nums lining-nums; white-space: nowrap; }
/* Word cells may wrap, so a long unit or building name (e.g. from the live AppFolio feed) wraps inside the
   panel instead of pushing the table past its background box. Short names still sit on one line. */
.av-table td.c-house, .av-table td.c-type, .av-table td.c-unit { white-space: normal; overflow-wrap: break-word; }
.av-table .c-plan { text-align: right; }
.av-table .dl { display: inline-grid; place-items: center; width: 44px; height: 44px; color: var(--ink); }
.av-table .dl svg { width: 22px; height: 22px; }
.av-table .dl:hover { color: var(--brass-text); }
.av-table .dl-none { display: inline-block; width: 44px; text-align: center; color: var(--ink-soft); }
.av-table tbody tr { transition: background var(--t-fast); }
.av-table tbody tr:hover { background: rgba(255,255,255,.35); }
.av-empty td, p.av-empty { text-align: center; text-transform: none; font: italic 22px/1.4 var(--period); white-space: normal; padding: var(--s6) 12px; }

/* Plan (card) view */
.av-cards { display: grid; gap: clamp(16px, 2.4vw, 40px); grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.av-card { display: flex; flex-direction: column; background: var(--white); text-decoration: none; color: var(--ink); transition: transform var(--t-fast) var(--ease-out), box-shadow var(--t-fast); }
.av-card:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(36,49,59,.12); }
.av-card-plan { aspect-ratio: 5 / 4; display: grid; place-items: center; padding: 28px; position: relative; }
.av-card-plan img { position: absolute; inset: 18px; width: calc(100% - 36px); height: calc(100% - 36px); max-width: none; object-fit: contain; }
.av-card-plan .plan-ph { width: 62%; color: var(--river); opacity: .8; }
.av-card-plan .plan-soon { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; font: italic 15px/1 var(--period); color: var(--ink-soft); }
.av-card-meta { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 0 22px 22px; }
.av-card-meta .u { grid-column: 1 / -1; font: 600 15px/1.3 var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.av-card-meta .t { grid-column: 1 / -1; font: 400 24px/1.2 var(--sans); text-transform: uppercase; }
.av-card-meta .r { font: 400 15px/1.4 var(--sans); color: var(--ink-2); }
.av-card-meta .a { font: 400 15px/1.4 var(--sans); color: var(--ink-2); text-align: right; }

/* Phones: list becomes simple two-line rows; hide secondary columns */
@media (max-width: 760px) {
  .av-view { margin-left: 0; }
  .av-table thead { display: none; }
  .av-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; padding: 14px 0; border-bottom: 1px solid rgba(36,49,59,.55); }
  .av-table td { border: 0; padding: 0; font-size: 18px; }
  .av-table .c-house, .av-table .c-sqft { display: none; }
  .av-table .c-unit { grid-row: 1; grid-column: 1; font-weight: 600; }
  .av-table .c-unit::before { content: "Unit "; }
  .av-table .c-type { grid-row: 2; grid-column: 1; font-size: 15px; color: var(--ink-2); }
  .av-table .c-rent { grid-row: 1; grid-column: 2; text-align: right; }
  .av-table .c-avail { grid-row: 2; grid-column: 2; text-align: right; font-size: 15px; color: var(--ink-2); }
  .av-table .c-plan { display: none; }
  .av-empty { display: block !important; }
}
.av-card-meta .sf { font-weight: 400; color: var(--ink-soft); letter-spacing: .02em; }
.av-card-meta .r, .av-card-meta .a { white-space: nowrap; }

/* Carousel: smaller slides on desktop so photos don't dominate the screen */
@media (min-width: 701px) { .carousel-slide { flex-basis: min(56vw, 860px); } }

/* ---------- Availability: clickable homes + on-site unit listing (availability.js) ---------- */
.av-table tr.is-link { cursor: pointer; }
.av-table tr.is-link:hover { background: rgba(255,255,255,.55); }
.av-table .c-go { text-align: right; width: 1%; }
.av-go { font: 600 13px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); background: var(--white); border: 1px solid var(--line); border-radius: 999px; padding: 10px 16px; cursor: pointer; white-space: nowrap; transition: background var(--t-fast), color var(--t-fast); }
.av-go:hover, tr.is-link:hover .av-go { background: var(--ink); color: var(--paper); }
button.av-card { font: inherit; text-align: left; border: 0; padding: 0; cursor: pointer; width: 100%; }
.av-card--text .av-card-meta { padding-top: 22px; }
@media (max-width: 760px) {   /* same breakpoint as the two-line phone rows, so the View cell never drops to a stray third row */
  .av-table .c-go { display: none; }
  .av-table tr.is-link .c-unit::after { content: "  ›"; color: var(--ink-soft); }
}
.unit-dlg { width: min(1040px, calc(100vw - 24px)); max-height: calc(100vh - 24px); padding: 0; border: 0; background: var(--paper); color: var(--ink); box-shadow: 0 30px 80px rgba(0,0,0,.35); }
.unit-dlg::backdrop { background: rgba(20, 24, 28, .62); }
.unit-dlg-in { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); max-height: calc(100vh - 24px); overflow: auto; }
.unit-dlg-in:not(:has(.unit-dlg-gal)) { grid-template-columns: minmax(0, 1fr); }
.unit-dlg-x { position: absolute; top: 10px; right: 10px; z-index: 2; width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--white); color: var(--ink); font-size: 26px; line-height: 1; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.15); }
.unit-dlg-gal { background: var(--ink); display: flex; flex-direction: column; align-self: start; position: sticky; top: 0; }
.unit-dlg-main { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.unit-dlg-3d { position: absolute; left: 14px; top: 14px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 10px;
  border-radius: 999px; background: rgba(36, 49, 59, .78); color: var(--paper); text-decoration: none; font-size: 14px; font-weight: 500;
  letter-spacing: .03em; backdrop-filter: blur(6px); border: 1px solid rgba(247, 242, 232, .35); }
.unit-dlg-3d span { font-size: 11px; font-weight: 600; background: var(--paper); color: var(--ink); border-radius: 999px; padding: 2px 6px; }
.unit-dlg-3d:hover { background: rgba(36, 49, 59, .92); }
.unit-dlg-links { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.unit-dlg-note-gal { margin: 0; padding: 0 10px 10px; font-size: 12px; line-height: 1.4; color: rgba(247, 242, 232, .72); }
.unit-dlg-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 6px; padding: 8px; }
.unit-dlg-thumbs button { padding: 0; border: 2px solid transparent; background: none; cursor: pointer; aspect-ratio: 4 / 3; overflow: hidden; opacity: .75; }
.unit-dlg-thumbs button[aria-current] { border-color: var(--paper); opacity: 1; }
.unit-dlg-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.unit-dlg-main.is-contain { object-fit: contain; background: var(--paper); }
.unit-dlg-thumbs button[data-fit="contain"] img { object-fit: contain; background: var(--paper); }
.unit-dlg-360 { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border: 2px solid transparent; }
.unit-dlg-360 img { width: 100%; height: 100%; object-fit: cover; display: block; filter: brightness(.72); transition: filter var(--t-fast); }
.unit-dlg-360 span { position: absolute; inset: 0; display: grid; place-items: center; color: var(--paper); font: 600 13px/1 var(--sans); letter-spacing: .06em; }
.unit-dlg-360 span::before { content: ""; position: absolute; width: 34px; height: 34px; border: 2px solid var(--paper); border-radius: 50%; }
.unit-dlg-360:hover img { filter: brightness(.9); }
.unit-dlg-360:hover, .unit-dlg-360:focus-visible { border-color: var(--paper); }
.unit-dlg-body { padding: clamp(24px, 3.5vw, 44px); }
.unit-dlg-body > .eyebrow:first-child { max-width: calc(100% - 36px); }   /* clear the round close button */
.unit-dlg-title { font: 400 clamp(34px, 4vw, 52px)/1.05 var(--serif); margin: 6px 0 18px; }
.unit-dlg-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; margin: 0 0 22px; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.unit-dlg-facts dt { font: 600 11px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 6px; }
.unit-dlg-facts dd { margin: 0; font: 500 17px/1.3 var(--sans); }
.unit-dlg-body p { font-size: 16px; line-height: 1.6; }
.unit-dlg-h { font: 600 12px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; margin: 22px 0 10px; }
.unit-dlg-feats { margin: 0; padding-left: 1.1em; columns: 2; column-gap: 24px; font-size: 15px; line-height: 1.7; }
.unit-dlg-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.unit-dlg-actions .cta .t { font-size: 16px; padding: 0 22px; }
.unit-dlg-actions .cta .a { width: 52px; }
.unit-dlg-note { margin-top: 12px; }
@media (max-width: 760px) {
  .unit-dlg-in { grid-template-columns: minmax(0, 1fr); }
  .unit-dlg-feats { columns: 1; }
  /* One column: the photos scroll away with the listing (a sticky gallery filled half a phone screen and squeezed
     the tour form), and the sheet is full height so the close button can stay pinned to its top corner. */
  .unit-dlg { height: calc(100vh - 24px); }
  .unit-dlg-gal { position: static; }
  .unit-dlg-x { position: fixed; top: 22px; right: 22px; }
}
.unit-tour { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.unit-tour-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; margin-bottom: 16px; }
.unit-tour-grid label { display: flex; flex-direction: column; gap: 6px; font: 600 12px/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.unit-tour-grid label.full { grid-column: 1 / -1; }
.unit-tour-grid input, .unit-tour-grid textarea { font: 400 16px/1.4 var(--sans); letter-spacing: 0; text-transform: none; color: var(--ink); background: var(--white); border: 1px solid var(--line); padding: 11px 12px; border-radius: 2px; width: 100%; }
.unit-tour-grid input:focus, .unit-tour-grid textarea:focus { outline: 2px solid var(--ink); outline-offset: 1px; }
.unit-tour-err { color: var(--error, #9B2C1F); font-size: 15px; margin: 0 0 12px; }
.unit-tour .cta { margin-bottom: 8px; }
.unit-tour .cta .t { font-size: 16px; padding: 0 22px; }
@media (max-width: 760px) { .unit-tour-grid { grid-template-columns: 1fr; } }
/* Long email addresses and URLs never push past the screen edge */
a[href^="mailto:"], a[href^="tel:"] { overflow-wrap: break-word; }   /* break only when it truly cannot fit (anywhere split "...c / om" in the footer) */

/* accessible-home badge (units.js accessible: true) */
.av-acc { display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; padding: 2px 8px 2px 5px; border-radius: 999px; background: var(--river); color: var(--paper); font: 600 11px/1.5 var(--sans); letter-spacing: .04em; text-transform: none; vertical-align: 2px; white-space: nowrap; }
.av-acc svg { width: 14px; height: 14px; }
.av-table .c-type .av-acc { display: flex; width: max-content; margin: 6px 0 0; }   /* own line, so the column stays narrow */
/* medium screens: the whole row opens the listing, so drop the View column and tighten the cells */
@media (min-width: 761px) and (max-width: 1180px) {
  .av-table .c-go { display: none; }
  .av-table td { padding: 16px 7px; font-size: clamp(16px, 2vw, 22px); }
  .av-table th { padding: 0 7px 12px; font-size: 14px; }
  .av-table tr.is-link .c-unit::after { content: " ›"; color: var(--ink-soft); }
}

/* Fees panel (availability page; filled from config.js `fees`) */
.av-fees { margin-top: var(--s5); padding: var(--s4); border: 1px solid var(--line); background: var(--white); }
.av-fees-h { font-family: var(--serif); text-transform: uppercase; font-weight: 400; font-size: 28px; margin: 0 0 var(--s3); }
.av-fees-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0 var(--s5); margin: 0 0 var(--s3); }
.av-fees-list div { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s3); padding: 10px 0; border-bottom: 1px solid var(--line); }
.av-fees-list dt { margin: 0; }
.av-fees-list dt .muted { font-size: 13px; }
.av-fees-list dd { margin: 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.av-fees-list dd small { font-size: 13px; color: var(--ink-soft); }

/* Leasing special (config.js `promo`): ribbon slots + one-time popup + listing line */
.promo-ribbon { background: var(--ink); color: var(--paper); }
.promo-ribbon-in { max-width: var(--wrap); margin: 0 auto; padding: 18px var(--gutter); display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 24px; text-align: center; }
.promo-ribbon-t { margin: 0; font-family: var(--serif); text-transform: uppercase; font-size: clamp(22px, 2.4vw, 30px); line-height: 1; }
.promo-ribbon-x { margin: 0; font-size: 16px; max-width: 60ch; opacity: .92; }
.promo-ribbon .cta { flex: none; }
.promo-ribbon--inline { margin: var(--s4) 0 var(--s5); border-left: 3px solid var(--brass); }
.promo-ribbon--inline .promo-ribbon-in { justify-content: flex-start; text-align: left; padding: 16px 20px; }
.promo-pop { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 16px; background: rgba(22,39,44,.55); opacity: 0; transition: opacity .25s var(--ease-out); }
.promo-pop.is-open { opacity: 1; }
.promo-pop-card { position: relative; box-sizing: border-box; width: min(460px, 100%); max-width: calc(100vw - 32px); background: var(--paper); color: var(--ink); padding: 40px 32px 28px; text-align: center; box-shadow: 0 24px 60px rgba(0,0,0,.25); border-top: 4px solid var(--brass); transform: translateY(12px); transition: transform .3s var(--ease-out); }
.promo-pop.is-open .promo-pop-card { transform: none; }
.promo-pop-eyebrow { margin: 0 0 10px; font-size: 12px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--brass-text); }
.promo-pop-t { margin: 0; font-family: var(--serif); font-weight: 400; text-transform: uppercase; font-size: clamp(34px, 7vw, 46px); line-height: .98; }
.promo-pop .ornament { margin: 16px auto; }
.promo-pop-x2 { margin: 0 auto 24px; font-size: 17px; max-width: 34ch; }
.promo-pop-actions { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.promo-pop-later { background: none; border: 0; font: inherit; font-size: 14px; color: var(--ink-soft); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.promo-pop-x { position: absolute; top: 8px; right: 10px; width: 40px; height: 40px; border: 0; background: none; font-size: 28px; line-height: 1; color: var(--ink-soft); cursor: pointer; }
.unit-dlg-promo { margin: var(--s3) 0; padding: 12px 14px; background: var(--sage-bar); border-left: 3px solid var(--brass); font-size: 15px; }
@media (prefers-reduced-motion: reduce) { .promo-pop, .promo-pop-card { transition: none; } }

/* ---------- Hero eyebrow over a photo (opt-in class: .hero-eyebrow) ----------
   The small gold label above a photo hero's title. A soft dark backing keeps it readable over pale facades. */
.hero-eyebrow { color: #EAD3A0; background: rgba(20, 30, 38, .72); padding: 6px 18px 7px; border-radius: 999px;
                -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }