:root {
  --paper: #F7F4EF;
  --paper-tint: #EFEAE1;
  --ink: #15130F;
  --ink-2: #45403A;
  --gray: #6E675D;
  --rule: #CFC8BB;
  --rule-soft: #E2DCD1;
  --accent: #8C3A2B;
  --accent-on-ink: #D98A76;
  --on-ink: #F0EBE2;
  --on-ink-dim: #A9A196;
  --shell: 1220px;
  --gutter: 78px;
  --gutter-gap: 40px;
  --serif: "Source Serif", Georgia, "Times New Roman", serif;
  --sans: "Golos Text", system-ui, -apple-system, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

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

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
@media (min-width: 1024px) { body { font-size: 17.5px; } }
@media (max-width: 400px) { body { font-size: 16px; } }

h1, h2, h3, .wordmark, .eyebrow, .btn, .index, .figure-value strong, .hero-panel-price strong {
  user-select: none;
  -webkit-user-select: none;
}

h1, h2, h3 { margin: 0; line-height: 1.14; letter-spacing: -0.012em; font-weight: 600; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

a { color: var(--accent); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { color: var(--ink); }

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

.shell { max-width: var(--shell); margin: 0 auto; padding: 0 22px; }
@media (min-width: 720px) { .shell { padding: 0 40px; } }

/* Small caps labels carry the document voice: they name a thing, never shout. */
.eyebrow, .footer-heading, .scenario-sub, .compare-head, .compare-city, .figure-city,
.hero-panel-caption, .menu-toggle-label {
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--gray);
}

.skip-link {
  position: absolute;
  left: 12px;
  top: -100px;
  z-index: 100;
  padding: 12px 18px;
  background: var(--ink);
  color: var(--paper);
}
.skip-link:focus { top: 12px; color: var(--paper); }

.preview-flag {
  background: var(--ink);
  color: var(--on-ink);
  font-size: .74rem;
  letter-spacing: .02em;
  line-height: 1.4;
  padding: 7px 22px;
  text-align: center;
}

/* One margin/content grid shared by the hero, the thesis, the register and every
   section, so the page has exactly one content edge and one margin edge. */
.grid-shell { display: grid; }
@media (min-width: 1040px) {
  .grid-shell { grid-template-columns: var(--gutter) minmax(0, 1fr); column-gap: var(--gutter-gap); }
  .grid-shell > * { grid-column: 2; }
}

/* header */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--paper);
  border-bottom: 1px solid var(--ink);
}
.header-inner { display: flex; align-items: center; gap: 20px; min-height: 64px; }
.wordmark {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.42rem;
  letter-spacing: .005em;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
}
.nav-desktop { margin-left: auto; display: none; }
.nav-desktop ul { display: flex; gap: 24px; list-style: none; margin: 0; padding: 0; }
.nav-desktop a {
  color: var(--ink-2);
  text-decoration: none;
  font-size: .89rem;
  padding: 4px 0;
  border-bottom: 1px solid transparent;
}
.nav-desktop a:hover { color: var(--ink); border-bottom-color: var(--ink); }
.nav-desktop a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--accent); }
.site-header .header-cta { display: none; }

.menu-toggle {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: none;
  border: 1px solid var(--ink);
  padding: 8px 13px;
  font: inherit;
  color: var(--ink);
  cursor: pointer;
}
.menu-toggle-bars { position: relative; width: 15px; height: 9px; }
.menu-toggle-bars i, .menu-toggle-bars i::before, .menu-toggle-bars i::after {
  position: absolute;
  left: 0;
  width: 15px;
  height: 1px;
  background: currentColor;
}
.menu-toggle-bars i { top: 4px; }
.menu-toggle-bars i::before { content: ""; top: -4px; }
.menu-toggle-bars i::after { content: ""; top: 4px; }
.menu-toggle[aria-expanded="true"] { background: var(--ink); color: var(--paper); }
.menu-toggle[aria-expanded="true"] .menu-toggle-bars i { background: transparent; }
.menu-toggle[aria-expanded="true"] .menu-toggle-bars i::before { transform: translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-toggle-bars i::after { transform: translateY(-4px) rotate(-45deg); }

.nav-mobile { border-top: 1px solid var(--rule); background: var(--paper); }
.nav-mobile ul { list-style: none; margin: 0; padding: 0 22px 20px; }
.nav-mobile a {
  display: block;
  padding: 14px 0;
  color: var(--ink);
  text-decoration: none;
  border-bottom: 1px solid var(--rule-soft);
  font-size: 1rem;
}
.nav-mobile li:last-child a { border-bottom: none; }
.nav-mobile-cta { margin-top: 16px; text-align: center; }

@media (min-width: 980px) {
  .nav-desktop { display: block; }
  .site-header .header-cta { display: inline-flex; }
  .menu-toggle { display: none; }
  .nav-mobile { display: none !important; }
}

/* buttons: rectangles, no radius, no shadow */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 20px;
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid var(--ink);
}
.btn-primary { background: var(--ink); color: var(--paper); }
.btn-primary:hover { background: var(--accent); border-color: var(--accent); color: var(--paper); }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--rule); }
.btn-ghost:hover { border-color: var(--ink); color: var(--ink); }

.section-ink .btn-primary { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.section-ink .btn-primary:hover { background: var(--accent-on-ink); border-color: var(--accent-on-ink); color: var(--ink); }
.section-ink .btn-ghost { color: var(--on-ink); border-color: rgba(240, 235, 226, .35); }
.section-ink .btn-ghost:hover { border-color: var(--on-ink); color: var(--on-ink); }

/* hero */
.hero { padding: 16px 0 30px; }
.hero-grid { display: grid; gap: 22px; }
.hero-meta { display: none; }
.hero .eyebrow { margin: 0 0 11px; }
.hero-title {
  font-family: var(--serif);
  font-size: clamp(1.68rem, 5vw, 3.4rem);
  line-height: 1.06;
  letter-spacing: -0.018em;
  max-width: 16em;
}
.hero-lead {
  margin: 12px 0 0;
  font-size: clamp(.95rem, 2.2vw, 1.1rem);
  color: var(--ink-2);
  max-width: 33em;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 16px; }
.hero-note {
  margin: 20px 0 0;
  font-size: .82rem;
  color: var(--gray);
  max-width: 40em;
  padding-top: 12px;
  border-top: 1px solid var(--rule);
}

.hero-panel { margin: 12px 0 0; padding-top: 10px; border-top: 2px solid var(--ink); }
.hero-panel-caption { display: block; margin-bottom: 10px; }
.hero-panel-rows { display: grid; }
.hero-panel-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: baseline;
  gap: 18px;
  padding: 9px 0;
  border-bottom: 1px solid var(--rule-soft);
}
.hero-panel-city { font-weight: 600; font-size: .95rem; white-space: nowrap; }
.hero-panel-price, .hero-panel-deals { display: flex; flex-direction: column; align-items: flex-end; }
.hero-panel-price strong, .hero-panel-deals strong {
  font-family: var(--serif);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.hero-panel-price strong { font-size: 1.5rem; }
.hero-panel-deals strong { font-size: 1.05rem; color: var(--ink-2); }
.hero-panel small { font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--gray); }
.hero-panel-note { margin: 10px 0 0; font-size: .72rem; color: var(--gray); line-height: 1.45; }

@media (min-width: 900px) {
  .hero { padding: 64px 0 56px; }
  .hero-grid { grid-template-columns: 1.32fr .68fr; gap: 18px 52px; align-items: start; }
  .hero-copy { grid-column: 1; grid-row: 1; }
  .hero-note { grid-column: 1; grid-row: 2; }
  .hero-panel { grid-column: 2; grid-row: 1 / span 2; margin-top: 6px; }
  .hero-panel-price strong { font-size: 1.7rem; }
}
@media (min-width: 1040px) {
  .hero-meta {
    display: block;
    grid-column: 1;
    margin: 0;
    font-size: .72rem;
    line-height: 1.35;
    color: var(--gray);
  }
  .hero-meta span {
    display: block;
    margin-bottom: 3px;
    font-size: .66rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
  }
  .hero-grid { grid-column: 2; }
}

.brand-thesis { padding-bottom: 26px; }
.brand-thesis .shell { padding-top: 0; }
.brand-thesis p {
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid var(--ink);
  font-family: var(--serif);
  font-size: clamp(1.05rem, 2.6vw, 1.4rem);
  line-height: 1.3;
  max-width: 24em;
}

/* trust strip: a ruled register, not a coloured bar */
.trust-strip {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
  counter-reset: trust;
}
.trust-strip li {
  counter-increment: trust;
  font-size: .87rem;
  color: var(--ink-2);
  padding: 14px 0 14px 34px;
  position: relative;
  border-bottom: 1px solid var(--rule-soft);
}
.trust-strip li:last-child { border-bottom: none; }
.trust-strip li::before {
  content: counter(trust, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 15px;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}
@media (min-width: 860px) {
  .trust-strip { grid-template-columns: repeat(4, 1fr); }
  .trust-strip li { border-bottom: none; border-left: 1px solid var(--rule-soft); padding: 18px 20px 18px 46px; }
  .trust-strip li:first-child { border-left: none; padding-left: 34px; }
  .trust-strip li::before { left: 20px; top: 19px; }
  .trust-strip li:first-child::before { left: 0; }
}

/* sections: numbered, ruled, no boxes */
.section { padding: 52px 0; counter-increment: section; scroll-margin-top: 72px; }
.section-unnumbered { counter-increment: none; }
.section-unnumbered .section-head::before { content: none; }
@media (min-width: 900px) { .section { padding: 76px 0; } }
.section-tint { background: var(--paper-tint); }
.section-ink { background: var(--ink); color: var(--on-ink); }
.section-ink .section-lead, .section-ink .fine, .section-ink p { color: var(--on-ink-dim); }
.section-ink h2, .section-ink h3 { color: var(--on-ink); }
.section-ink a { color: var(--accent-on-ink); }

main { counter-reset: section; }


.section-head { padding-top: 14px; border-top: 2px solid var(--ink); margin-bottom: 30px; }
.section-ink .section-head { border-top-color: var(--on-ink); }
.section-head::before {
  content: counter(section, decimal-leading-zero);
  display: block;
  font-family: var(--serif);
  font-size: 1.05rem;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  margin-bottom: 10px;
}
.section-ink .section-head::before { color: var(--accent-on-ink); }
.section-title { font-family: var(--serif); font-size: clamp(1.42rem, 3.2vw, 2.05rem); max-width: 20em; }
.section-lead { margin: 14px 0 0; color: var(--ink-2); font-size: 1rem; max-width: 42em; }
.section-cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0 0; }
.prose { max-width: 38em; color: var(--ink-2); }

/* On wide screens the section number moves into the margin, the way a
   memorandum numbers its clauses, and the content keeps a readable measure. */
@media (min-width: 1040px) {
  .section-head { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; }
  .section-head::before { grid-column: 1; grid-row: 1; margin: 0; font-size: 1.6rem; line-height: 1; }
  .section-head > * { grid-column: 2; }
}

/* stages: the memorable element, a ruled three-column ladder */
.stages {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  border-top: 2px solid var(--ink);
  counter-reset: stage;
}
.stage { counter-increment: stage; padding: 22px 0; border-bottom: 1px solid var(--rule); }
.stage::before {
  content: counter(stage, upper-roman);
  display: block;
  font-family: var(--serif);
  font-size: 2rem;
  line-height: 1;
  color: var(--gray);
  font-variant-numeric: tabular-nums;
  margin-bottom: 12px;
}
.stage-title { font-size: 1.1rem; margin-bottom: 8px; }
.stage p { color: var(--ink-2); font-size: .94rem; }
@media (min-width: 860px) {
  .stages { grid-template-columns: repeat(3, 1fr); border-bottom: 2px solid var(--ink); }
  .stage { border-bottom: none; border-left: 1px solid var(--rule); padding: 26px 26px 30px; }
  .stage:first-child { border-left: none; padding-left: 0; }
  .stage::before { font-size: 2.7rem; }
}

/* card grids become ruled columns */
.cards { display: grid; gap: 0; border-top: 2px solid var(--ink); }
.card { padding: 22px 0; border-bottom: 1px solid var(--rule); display: flex; flex-direction: column; gap: 9px; }
.card-title { font-family: var(--serif); font-size: 1.14rem; }
.card-audience { color: var(--accent); font-size: .85rem; margin: 0; }
.card-body { color: var(--ink-2); font-size: .93rem; margin: 0; }
.card-link { margin-top: auto; padding-top: 12px; font-weight: 600; font-size: .89rem; text-decoration: none; }
.card-link::after { content: " →"; }
@media (min-width: 760px) {
  .cards { grid-template-columns: repeat(2, 1fr); column-gap: 0; }
  .card { padding: 24px 26px; border-left: 1px solid var(--rule); }
  .card:nth-child(2n + 1) { border-left: none; padding-left: 0; }
}
@media (min-width: 1100px) {
  .cards { grid-template-columns: repeat(3, 1fr); }
  .card:nth-child(2n + 1) { border-left: 1px solid var(--rule); padding-left: 26px; }
  .card:nth-child(3n + 1) { border-left: none; padding-left: 0; }
}
.cards-plain { border-top: 2px solid var(--ink); }

/* reasons */
.reasons { display: grid; border-top: 2px solid var(--ink); }
.reason { padding: 22px 0; border-bottom: 1px solid var(--rule); }
.reason-title { font-family: var(--serif); font-size: 1.1rem; margin-bottom: 8px; }
.reason p { color: var(--ink-2); font-size: .94rem; }
@media (min-width: 820px) {
  .reasons { grid-template-columns: repeat(2, 1fr); }
  .reason { padding: 24px 30px; border-left: 1px solid var(--rule); }
  .reason:nth-child(2n + 1) { border-left: none; padding-left: 0; }
}

.facts { margin-top: 40px; padding-top: 16px; border-top: 2px solid var(--ink); }
.facts-title { font-family: var(--serif); font-size: 1.1rem; margin-bottom: 16px; }
.facts-sources { margin-top: 18px; display: grid; gap: 5px; }

/* lists: numbered rows on rules, no glyph bullets */
.marked { list-style: none; margin: 0; padding: 0; counter-reset: marked; }
.marked li {
  counter-increment: marked;
  position: relative;
  padding: 12px 0 12px 38px;
  border-top: 1px solid var(--rule-soft);
  color: var(--ink-2);
  font-size: .94rem;
}
.marked li:first-child { border-top: none; padding-top: 2px; }
.marked li::before {
  content: counter(marked, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 13px;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .08em;
  font-variant-numeric: tabular-nums;
  color: var(--gray);
}
.marked li:first-child::before { top: 3px; }
.marked-check li::before { color: var(--accent); }
.section-ink .marked li { color: var(--on-ink-dim); border-top-color: rgba(240, 235, 226, .16); }
.section-ink .marked-check li::before { color: var(--accent-on-ink); }

/* split */
.split { display: grid; gap: 30px; }
@media (min-width: 820px) { .split { grid-template-columns: repeat(2, 1fr); gap: 48px; } }
.split-title { font-family: var(--serif); font-size: 1.06rem; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 2px solid var(--ink); }

/* comparison */
.compare { border-top: 2px solid var(--ink); }
.compare-head { display: none; }
.compare-row { padding: 20px 0; border-bottom: 1px solid var(--rule); display: grid; gap: 10px; }
.compare-criterion { font-family: var(--serif); font-size: 1.02rem; }
.compare-cell p { margin: 0; color: var(--ink-2); font-size: .93rem; }
.compare-city { display: block; margin-bottom: 4px; color: var(--accent); }
@media (min-width: 900px) {
  .compare-head {
    display: grid;
    grid-template-columns: 1fr 1.3fr 1.3fr;
    gap: 30px;
    padding: 10px 0;
    border-bottom: 1px solid var(--rule);
  }
  .compare-row { grid-template-columns: 1fr 1.3fr 1.3fr; gap: 30px; align-items: start; }
  .compare-cell { border-left: 1px solid var(--rule-soft); padding-left: 20px; }
  .compare-city { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

/* figures */
.figures { display: grid; border-top: 2px solid var(--ink); }
.figure { padding: 22px 0; border-bottom: 1px solid var(--rule); }
.figure-metric { font-size: .95rem; margin-bottom: 16px; max-width: 26em; }
.figure-values { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.figure-city { display: block; margin-bottom: 4px; }
.figure-value strong {
  font-family: var(--serif);
  font-size: clamp(1.5rem, 3.6vw, 1.95rem);
  letter-spacing: -0.015em;
  font-variant-numeric: tabular-nums;
}
.figure-reading { margin: 16px 0 0; font-size: .9rem; color: var(--ink-2); max-width: 40em; }
@media (min-width: 780px) {
  .figures { grid-template-columns: repeat(2, 1fr); }
  .figure { padding: 24px 30px; border-left: 1px solid var(--rule); }
  .figure:nth-child(2n + 1) { border-left: none; padding-left: 0; }
}

.source-note { margin: 10px 0 0; font-size: .75rem; color: var(--gray); line-height: 1.45; }
.source-note a { color: var(--gray); text-decoration-color: var(--rule); }
.source-note a:hover { color: var(--accent); }
.source-date { white-space: nowrap; }

/* steps and path */
.steps { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.step { display: grid; grid-template-columns: 46px 1fr; gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--rule); }
.step-index { font-size: .8rem; font-weight: 600; letter-spacing: .08em; color: var(--accent); font-variant-numeric: tabular-nums; padding-top: 5px; }
.step-title { font-family: var(--serif); font-size: 1.06rem; margin-bottom: 5px; }
.step p { color: var(--ink-2); font-size: .94rem; }

.path { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.path-step { display: grid; grid-template-columns: 50px 1fr; gap: 16px; padding: 24px 0; border-bottom: 1px solid var(--rule); }
.path-index { font-size: .8rem; font-weight: 600; letter-spacing: .08em; color: var(--accent); font-variant-numeric: tabular-nums; padding-top: 6px; }
.path-title { font-family: var(--serif); font-size: 1.16rem; margin-bottom: 12px; }
.path-body p { font-size: .93rem; color: var(--ink-2); margin-bottom: .45em; }
.path-body strong { color: var(--ink); font-weight: 600; }
@media (min-width: 860px) { .path-step { grid-template-columns: 72px 1fr; } }

/* roles and picks */
.roles, .picks { display: grid; border-top: 2px solid var(--ink); }
.section-ink .roles, .section-ink .picks { border-top-color: var(--on-ink); }
.role, .pick { padding: 20px 0; border-bottom: 1px solid var(--rule); }
.section-ink .role, .section-ink .pick { border-bottom-color: rgba(240, 235, 226, .18); }
.role-party, .pick-title { font-family: var(--serif); font-size: 1.08rem; margin-bottom: 10px; }
.role p, .pick p { color: var(--ink-2); font-size: .93rem; }
.section-ink .role p, .section-ink .pick p { color: var(--on-ink-dim); }
.roles-note { margin-top: 24px; }
@media (min-width: 900px) {
  .roles, .picks { grid-template-columns: repeat(3, 1fr); column-gap: 34px; }
  .role, .pick { border-left: 1px solid var(--rule); padding: 22px 0 22px 22px; }
  .section-ink .role, .section-ink .pick { border-left-color: rgba(240, 235, 226, .18); }
  .role:first-child, .pick:first-child { border-left: none; padding-left: 0; }
}

/* notes */
.notes { display: grid; border-top: 2px solid var(--ink); }
.note { padding: 22px 0; border-bottom: 1px solid var(--rule); }
.note-title { font-family: var(--serif); font-size: 1.06rem; margin-bottom: 9px; }
.note p { color: var(--ink-2); font-size: .93rem; }
@media (min-width: 820px) {
  .notes { grid-template-columns: repeat(2, 1fr); }
  .note { padding: 24px 30px; border-left: 1px solid var(--rule); }
  .note:nth-child(2n + 1) { border-left: none; padding-left: 0; }
}

.callout { margin-top: 28px; padding-top: 14px; border-top: 2px solid var(--ink); max-width: 44em; }
.section-ink .callout { border-top-color: var(--accent-on-ink); }
.callout-title { font-family: var(--serif); font-size: 1.04rem; margin-bottom: 8px; }
.callout p { color: var(--ink-2); font-size: .93rem; }
.section-ink .callout p { color: var(--on-ink-dim); }

/* scenarios */
.anchor-nav { margin-top: 28px; padding-top: 12px; border-top: 2px solid var(--ink); counter-reset: toc; }
.anchor-nav ul { list-style: none; margin: 0; padding: 0; display: grid; }
.anchor-nav li { counter-increment: toc; border-bottom: 1px solid var(--rule-soft); }
.anchor-nav a {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  padding: 9px 0;
  font-size: .88rem;
  color: var(--ink-2);
  text-decoration: none;
}
.anchor-nav a::before {
  content: counter(toc, decimal-leading-zero);
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  padding-top: 3px;
}
.anchor-nav a:hover { color: var(--accent); }
@media (min-width: 820px) { .anchor-nav ul { grid-template-columns: repeat(2, 1fr); column-gap: 44px; } }

.scenarios { display: grid; counter-reset: scenario; }
.scenario { counter-increment: scenario; padding: 34px 0; border-top: 2px solid var(--ink); scroll-margin-top: 76px; }
.scenario:first-child { border-top: none; padding-top: 0; }
.scenario-title { font-family: var(--serif); font-size: clamp(1.24rem, 2.8vw, 1.6rem); margin-bottom: 10px; max-width: 20em; }
.scenario-audience { color: var(--accent); font-size: .87rem; margin-bottom: 12px; }
.scenario-situation { color: var(--ink-2); max-width: 42em; }
.scenario-grid { display: grid; gap: 26px; margin-top: 24px; }
@media (min-width: 860px) { .scenario-grid { grid-template-columns: repeat(2, 1fr); gap: 44px; } }
.scenario-sub { display: block; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--rule); }
.scenario-responsible { margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--rule); font-size: .91rem; color: var(--ink-2); max-width: 46em; }
.scenario-next { margin-top: 12px; }

@media (min-width: 1040px) {
  .scenario { display: grid; grid-template-columns: var(--gutter) minmax(0, 1fr); column-gap: var(--gutter-gap); }
  .scenario > * { grid-column: 2; }
  .scenario::before {
    content: counter(scenario, decimal-leading-zero);
    grid-column: 1;
    grid-row: 1;
    font-family: var(--serif);
    font-size: 1.6rem;
    line-height: 1;
    color: var(--accent);
    font-variant-numeric: tabular-nums;
  }
}

/* faq */
.faq { border-top: 2px solid var(--ink); max-width: 54em; }
.faq-item { border-bottom: 1px solid var(--rule); }
.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 16px 40px 16px 0;
  position: relative;
  font-weight: 600;
  font-size: .98rem;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: "+";
  position: absolute;
  right: 4px;
  top: 15px;
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--accent);
}
.faq-item[open] summary::after { content: "–"; }
.faq-answer { padding: 0 0 18px; max-width: 46em; }
.faq-answer p { color: var(--ink-2); font-size: .94rem; }

/* legal pages */
.prose-block { max-width: 44em; }
.legal-section { margin-bottom: 30px; padding-top: 14px; border-top: 1px solid var(--rule); }
.legal-section h2 { font-family: var(--serif); font-size: 1.14rem; margin-bottom: 11px; }
.legal-section p { color: var(--ink-2); font-size: .94rem; }
.link-list { list-style: none; margin: 0; padding: 0; max-width: 46em; border-top: 2px solid var(--ink); }
.link-list li { display: grid; gap: 3px; padding: 13px 0; border-bottom: 1px solid var(--rule); }
.channels { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

.fine { font-size: .8rem; color: var(--gray); line-height: 1.5; }

/* footer */
.site-footer { border-top: 2px solid var(--ink); padding: 38px 0 44px; }
.footer-grid { display: flex; flex-wrap: wrap; gap: 26px; }
.footer-brand { flex: 1 1 100%; }
.footer-nav { flex: 1 1 100%; }
@media (min-width: 760px) {
  .footer-grid { gap: 32px 56px; }
  .footer-brand { flex: 1 1 250px; }
  .footer-nav { flex: 0 1 170px; }
}
.footer-descriptor { margin: 10px 0 0; font-size: .86rem; color: var(--gray); max-width: 24em; }
.footer-heading { display: block; margin-bottom: 12px; }
.footer-nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.footer-nav a { color: var(--ink-2); text-decoration: none; font-size: .9rem; }
.footer-nav a:hover { color: var(--accent); }
.footer-legal { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--rule); display: grid; gap: 11px; max-width: 62em; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

.scenarios-block { padding: 46px 0 8px; }
@media (min-width: 900px) { .scenarios-block { padding: 60px 0 10px; } }

/* AvantDemi: property enquiries, city photography and a compact reading surface. */
.property-site {
  --paper: #fff;
  --paper-tint: #f3f3f0;
  --ink: #222521;
  --ink-2: #515650;
  --gray: #696e68;
  --rule: #cdd0c8;
  --rule-soft: #e5e6e1;
  --accent: #b54028;
  --shell: 1480px;
  font-size: 16px;
}
.property-site [hidden] { display: none !important; }
.property-site h1, .property-site h2, .property-site h3 { user-select: text; -webkit-user-select: text; }
.property-site .shell { padding-left: 48px; padding-right: 48px; }
.property-site .preview-flag { padding: 5px 20px; background: #eee; color: #595c56; font-size: 12px; }
.property-site .site-header { background: var(--paper); border-bottom: 1px solid var(--rule); position: relative; }
.property-site .header-inner { min-height: 76px; gap: 35px; }
.property-site .wordmark { font: 500 32px/1 var(--sans); letter-spacing: -.075em; text-transform: lowercase; }
.property-site .nav-desktop ul { gap: 30px; }
.property-site .nav-desktop a { font-size: 14px; color: var(--ink); }
.property-site .header-cta { background: transparent; color: var(--accent); border: 0; border-bottom: 1px solid var(--accent); padding: 7px 0; min-height: 0; border-radius: 0; }
.property-site .header-cta:hover { background: transparent; color: var(--ink); border-color: var(--ink); }
.property-site .menu-toggle { border: none; min-height: 44px; padding-right: 0; }
.property-site .menu-toggle-label { font-size: 14px; letter-spacing: 0; text-transform: none; }
.property-site .btn { border-radius: 0; min-height: 52px; font: 500 14px/1.4 var(--sans); gap: 22px; padding: 14px 22px; cursor: pointer; }
.property-site .btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.property-site .btn-primary:hover { background: #96321e; border-color: #96321e; }
.property-site .btn-ghost { border-color: var(--ink); color: var(--ink); }
.property-site .btn-ghost:hover { background: var(--ink); color: #fff; }
.property-site .btn:disabled { opacity: .5; cursor: not-allowed; }
.property-site .nav-mobile a.btn { color: #fff; }
.property-site [id] { scroll-margin-top: 25px; }
.property-site h1, .property-home h2, .property-home h3 { font-family: var(--sans); font-weight: 500; }
.masthead { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; padding: 22px 0 18px; }
.masthead h1 { font-size: clamp(56px, 6.3vw, 90px); line-height: .99; letter-spacing: -.065em; }
.full-stop { color: var(--accent); }
.masthead-aside { padding: 0 0 4px; max-width: 270px; flex: 0 0 250px; }
.masthead-aside p { font-size: 16px; line-height: 1.6; margin-bottom: 17px; }
.plain-link { display: inline-flex; align-items: center; gap: 18px; padding: 7px 0; font-size: 14px; font-weight: 500; color: var(--ink); text-decoration: none; border-bottom: 1px solid currentColor; }
.plain-link:hover { color: var(--accent); }
.city-switcher { display: flex; align-items: center; gap: 17px; min-height: 48px; }
.city-switcher button { appearance: none; border: 0; background: none; font: 500 16px/1.3 var(--sans); color: var(--gray); padding: 12px 0; cursor: pointer; }
.city-switcher button[aria-pressed="true"] { color: var(--ink); text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
.city-switcher button:hover { color: var(--accent); }
.city-switcher > span { color: #8c9188; font-size: 14px; }
.city-switcher > a { margin-left: auto; color: var(--gray); font-size: 14px; text-decoration: none; padding: 10px 0; }
.city-switcher > a:hover { color: var(--accent); }
.city-switcher > a span { margin-left: 15px; }
.city-stage { position: relative; margin: 0; height: clamp(260px, 35vh, 410px); background: #e6e6dd; }
.city-stage > img { display: block; height: 100%; width: 100%; object-fit: cover; object-position: center 43%; }
.city-stage figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 45px 48px 38px; display: flex; gap: 25px; justify-content: space-between; color: #fff; font-size: 12px; background: linear-gradient(transparent, rgba(0,0,0,.65)); }
.hero-request { --control-h: 44px; --submit-col: 240px; position: relative; z-index: 2; background: var(--paper); margin: -18px 0 0; padding: 22px 25px; border: 1px solid var(--rule); }
.direct-contacts { display: flex; flex-wrap: wrap; align-items: center; gap: 0 30px; margin-bottom: 18px; }
.direct-contacts > p { margin: 0 auto 0 0; font-size: .875rem; color: var(--gray); }
.direct-contact-group { display: flex; flex-wrap: wrap; align-items: center; gap: 0 18px; }
.direct-contact-group > span { font-size: .875rem; color: var(--gray); }
.direct-contact-group a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: .875rem; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
.direct-contact-group a:hover { color: var(--accent); }
.hero-request > .direct-contacts:last-child { margin: 0; padding: 0; border: 0; }
.request-fields, .request-extra { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) var(--submit-col); gap: 22px; }
.request-fields { align-items: end; }
.field { min-width: 0; }
.field label { display: block; margin-bottom: 7px; font-size: 12px; color: var(--gray); }
.hero-request select, .hero-request textarea { width: 100%; display: block; min-width: 0; padding: 9px 24px 9px 12px; font: 400 16px/1.5 var(--sans); color: var(--ink); background: var(--paper-tint); border: 0; border-bottom: 1px solid var(--rule); border-radius: 0; }
.hero-request select { min-height: var(--control-h); cursor: pointer; }
.hero-request textarea { padding: 12px; border: 1px solid var(--rule); resize: vertical; }
.hero-request select:hover, .hero-request textarea:hover { border-bottom-color: var(--ink); }
.hero-request textarea::placeholder { color: var(--gray); }
.hero-request select:focus, .hero-request textarea:focus { outline: none; border-color: var(--accent); }
.hero-request select:focus { box-shadow: inset 0 -1px 0 var(--accent); }
.hero-request textarea:focus { box-shadow: inset 0 0 0 1px var(--accent); }
@media (forced-colors: active) { .hero-request select:focus, .hero-request textarea:focus { outline: 2px solid; } }

/* A dropdown drawn by the page. The native select stays in the form as the
   value holder, out of sight and out of the accessibility tree. */
.select { position: relative; min-width: 0; }
.hero-request .select-native { display: none; }
.select-trigger { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: var(--control-h); padding: 9px 12px; font: 400 16px/1.5 var(--sans); color: var(--ink); background: var(--paper-tint); border: 0; border-bottom: 1px solid var(--rule); cursor: pointer; }
.select-trigger:hover { border-bottom-color: var(--ink); }
.select-trigger::after { content: ""; flex: none; width: 8px; height: 8px; margin: -4px 2px 0 0; border-right: 1px solid var(--gray); border-bottom: 1px solid var(--gray); transform: rotate(45deg); }
.select-trigger:focus, .select[data-open] .select-trigger { outline: none; border-bottom-color: var(--accent); box-shadow: inset 0 -1px 0 var(--accent); }
.select[data-open] .select-trigger::after { margin-top: 4px; transform: rotate(225deg); }
.select-list { position: absolute; z-index: 30; top: calc(100% + 7px); left: 0; right: 0; margin: 0; padding: 0; list-style: none; background: #fff; border: 1px solid var(--ink); max-height: 264px; overflow-y: auto; overscroll-behavior: contain; }
.select-above .select-list { top: auto; bottom: calc(100% + 7px); }

/* How far the background image warm-up has got. It gates nothing, so it stays
   out of the accessibility tree and leaves as soon as the work is done. */
@property --progress { syntax: "<number>"; inherits: false; initial-value: 0; }
.load-ring {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 60;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  opacity: 0;
  background: conic-gradient(var(--accent) calc(var(--progress, 0) * 1turn), var(--rule) 0);
  -webkit-mask: radial-gradient(farthest-side, #0000 56%, #000 58%);
  mask: radial-gradient(farthest-side, #0000 56%, #000 58%);
  transition: opacity .3s ease, --progress .3s ease;
}
.load-ring[data-on] { opacity: 1; }
.load-ring[data-done] { opacity: 0; }
/* A phone header has no spare corner, so the dot shrinks into the margin above
   the wordmark rather than sitting on top of it. */
@media (max-width: 760px) { .load-ring { top: 4px; left: 4px; width: 10px; height: 10px; } }
.select-list li { padding: 10px 14px; font-size: 16px; line-height: 1.45; cursor: pointer; }
.select-list li[data-active] { background: var(--paper-tint); }
.select-list li[aria-selected="true"] { color: var(--accent); }
@media (forced-colors: active) { .select-trigger:focus, .select[data-open] .select-trigger { outline: 2px solid; } }
.property-site .request-submit { margin-bottom: 0; height: var(--control-h); min-height: var(--control-h); padding-top: 0; padding-bottom: 0; }
.request-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 30px; margin-top: 13px; }
.request-bottom > p { font-size: .875rem; color: var(--gray); margin: 0; }
.request-more { flex: 1; }
.request-more[open] { flex: 1 0 100%; }
.request-more summary { font-size: .875rem; color: var(--gray); cursor: pointer; padding: 5px 0; }
.request-extra { padding: 22px 0 7px; }
.request-extra > .field:last-child { grid-column: 2 / -1; }
.request-extra .field label { font-size: 14px; }
.request-extra textarea { font-size: 14px; }
.result-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 30px; margin-bottom: 20px; }
.result-heading h2 { font-size: 28px; letter-spacing: -.045em; }
.result-heading h2:focus { outline: none; }
.result-heading p { font-size: 14px; color: var(--gray); margin-bottom: 0; }
.request-summary { font-size: 1rem; line-height: 1.6; margin: 0; color: var(--ink-2); overflow-wrap: anywhere; }
.message-preview { margin-top: 20px; border-top: 1px solid var(--rule); }
.message-preview summary { font-size: .875rem; padding: 16px 0; cursor: pointer; color: var(--ink); min-height: 48px; }
.message-preview textarea { margin-bottom: 10px; }
.copy-status:empty { display: none; }
.hero-request [data-request-message] { min-height: 210px; font-size: 16px; }
.result-delivery { display: flex; align-items: center; gap: 25px; justify-content: space-between; margin-top: 20px; }
.delivery-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.delivery-actions .btn { height: var(--control-h); min-height: var(--control-h); padding-top: 0; padding-bottom: 0; }
.result-tools { display: flex; flex-wrap: wrap; gap: 20px; }
.result-tools button { font: 400 14px/1.5 var(--sans); background: none; border: none; border-bottom: 1px solid var(--rule); padding: 8px 0; color: var(--gray); cursor: pointer; }
.result-tools button:hover { color: var(--accent); }
.request-privacy, .copy-status { font-size: 12px; color: var(--gray); margin: 15px 0 0; }
.copy-status { color: var(--accent); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.purchase-note { padding: 85px 0 70px; }
.purchase-grid { display: grid; grid-template-columns: 1fr 2.4fr; gap: 65px; padding-top: 35px; border-top: 1px solid var(--ink); }
.section-index { font-size: 14px; color: var(--gray); margin-top: 9px; }
.purchase-note h2, .people-heading h2, .property-home .landing-faq h2 { font-size: clamp(32px,3.6vw,48px); line-height: 1.08; letter-spacing: -.055em; }
.purchase-note h2 { margin-bottom: 28px; }
.purchase-intro { font-size: 21px; line-height: 1.5; letter-spacing: -.025em; max-width: 36em; margin-bottom: 31px; }
.purchase-details { border-top: 1px solid var(--rule); padding-top: 25px; display: grid; grid-template-columns: 1.7fr 1fr; gap: 38px; align-items: start; }
.purchase-details > p { font-size: 14px; color: var(--gray); line-height: 1.7; margin: 0; }
.purchase-details > a { margin-left: auto; font-size: 14px; white-space: nowrap; }
.landing-people { padding: 15px 0 55px; }
.people-heading { display: grid; grid-template-columns: 1fr 2.4fr; gap: 65px; padding-top: 35px; border-top: 1px solid var(--ink); margin-bottom: 38px; }
.people-heading h2 { margin-bottom: 20px; }
.people-heading > div > p { font-size: 1.0625rem; line-height: 1.65; max-width: 42em; margin: 0; }
.contact-person-row { display: grid; grid-template-columns: calc((100% - 65px) / 3.4) 1.35fr 1fr; align-items: start; column-gap: 65px; border-top: 1px solid var(--rule); padding: 28px 0; }
.contact-role { font-size: .875rem; color: var(--gray); margin: 0 0 10px; }
.contact-people h3 { font-size: 1.75rem; line-height: 1.1; letter-spacing: -.05em; margin: 0; }
.contact-person-row > p { font-size: 1rem; line-height: 1.65; margin: 0; max-width: 35em; color: var(--ink-2); }
.person-links { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.person-links a { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 44px; font-size: 1rem; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--rule); }
.person-links a:hover { color: var(--accent); border-color: var(--accent); }
.person-phone { white-space: nowrap; }
.people-next { margin: 0; padding-top: 22px; border-top: 1px solid var(--rule); font-size: .875rem; line-height: 1.7; color: var(--gray); }
.people-next a { color: var(--ink); display: inline-block; padding: 8px 0; text-underline-offset: 4px; }
.people-next a span { margin-left: 8px; }
.reader-page .contact-person-row { grid-template-columns: 1fr 1.15fr; gap: 12px 30px; }
.reader-page .contact-person-row > div:first-child { grid-row: span 2; }
.reader-page .person-links { grid-column: 2; }
.reader-page .contact-people { margin-top: -1px; }
.reader-page .contact-person-row:first-child { border-color: var(--ink); }
.landing-faq { padding: 30px 0 85px; }
.faq-grid { display: grid; grid-template-columns: 1fr 2.4fr; gap: 65px; padding-top: 35px; border-top: 1px solid var(--ink); }
.property-home .landing-faq h2 { margin-bottom: 25px; }
.property-home .faq { border-top: 1px solid var(--rule); max-width: none; }
.property-home .faq-item summary { font-size: 16px; font-weight: 400; padding: 22px 35px 22px 0; letter-spacing: -.015em; }
.property-home .faq-item summary::after { color: var(--ink); top: 21px; }
.property-home .faq-answer p { font-size: 16px; line-height: 1.75; max-width: 44em; }
.property-site .site-footer { background: #f0f0ec; padding: 43px 0 28px; border: none; }
.property-footer-top { display: flex; gap: 50px; justify-content: space-between; }
.property-footer-top .wordmark { font-size: 50px; }
.property-footer-top > div > p { font-size: 14px; color: var(--gray); margin-top: 20px; }
.property-footer-top nav { display: flex; gap: 85px; }
.property-footer-top nav > div { display: flex; flex-direction: column; gap: 9px; }
.property-footer-top nav a { font-size: 14px; color: var(--ink); text-decoration: none; padding: 3px 0; }
.property-footer-top nav a:hover { color: var(--accent); }
.property-footer-bottom { display: flex; justify-content: space-between; gap: 30px; margin-top: 38px; padding-top: 18px; border-top: 1px solid var(--rule); font-size: 12px; color: var(--gray); }
.property-footer-bottom a { color: var(--gray); }
.property-footer-legal { max-width: 900px; margin-top: 20px; }
.property-footer-legal p, .photo-credits p { font-size: 12px; line-height: 1.6; color: var(--gray); }
.photo-credits { margin-top: 12px; font-size: 12px; color: var(--gray); }
.photo-credits summary { cursor: pointer; padding: 5px 0; }
/* Every disclosure on the page opens with the same +/- the FAQ uses. */
.request-more summary, .message-preview summary, .photo-credits summary { list-style: none; }
.request-more summary::-webkit-details-marker, .message-preview summary::-webkit-details-marker, .photo-credits summary::-webkit-details-marker { display: none; }
.request-more summary::before, .message-preview summary::before, .photo-credits summary::before { content: "+"; margin-right: 10px; }
.request-more[open] summary::before, .message-preview[open] summary::before, .photo-credits[open] summary::before { content: "\2013"; }

/* Every disclosure opens by animating its own height. Where the browser has no
   ::details-content the panel snaps open, which is the behaviour it replaces. */
.faq-item, .reading-details, .request-more, .message-preview, .photo-credits { interpolate-size: allow-keywords; }
.faq-item::details-content, .reading-details::details-content, .request-more::details-content,
.message-preview::details-content, .photo-credits::details-content {
  block-size: 0;
  overflow: hidden;
  transition: block-size .4s cubic-bezier(.33, 1, .4, 1), content-visibility .4s allow-discrete;
}
.faq-item[open]::details-content, .reading-details[open]::details-content, .request-more[open]::details-content,
.message-preview[open]::details-content, .photo-credits[open]::details-content { block-size: auto; }
@media (prefers-reduced-motion: reduce) {
  .faq-item::details-content, .reading-details::details-content, .request-more::details-content,
  .message-preview::details-content, .photo-credits::details-content { transition: none; }
}
.photo-credits p { margin-top: 9px; }
.landing-section { padding: 65px 0; }
.landing-heading h2 { font-size: 38px; margin-bottom: 25px; }
.kicker { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--gray); }
.property-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
.listing-card > img { width: 100%; height: 270px; object-fit: cover; }
.listing-card > div { padding: 20px 0; }
.listing-location { font-size: 13px; color: var(--gray); }
.listing-card h3 { font-size: 23px; margin-bottom: 12px; }
.listing-price { font-size: 21px; font-weight: 500; }
.text-link { font-size: 14px; color: var(--ink); }
.mobile-contact-bar { display: none; }
@media (min-width: 1600px) { .city-stage { max-width: 1800px; margin-left: auto; margin-right: auto; } }
@media (max-width: 1100px) {
  .property-site .shell { padding-left: 30px; padding-right: 30px; }
  .masthead-aside { flex-basis: 215px; }
  .request-fields, .request-extra { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 24px; }
  .request-extra > .field:last-child { grid-column: 1 / -1; }
  .property-site .request-submit { padding-left: 16px; padding-right: 16px; gap: 13px; font-size: 13px; }
  .purchase-grid, .faq-grid, .people-heading { gap: 40px; }
  .contact-person-row { grid-template-columns: .8fr 1.6fr; gap: 12px 30px; }
  .contact-person-row > div:first-child { grid-row: span 2; }
  .person-links { grid-column: 2; }
  .purchase-details { grid-template-columns: 1fr; gap: 15px; }
  .purchase-details > a { margin-left: 0; justify-self: start; }
  .property-footer-top nav { gap: 45px; }
  .result-delivery { align-items: flex-start; flex-direction: column; gap: 13px; }
}
@media (max-width: 760px) {
  .property-site .shell { padding-left: 20px; padding-right: 20px; }
  .property-site .header-inner { min-height: 65px; }
  .property-site .wordmark { font-size: 29px; }
  .property-site .preview-flag { font-size: 12px; }
  .masthead { display: block; padding: 27px 0 13px; }
  .masthead h1 { font-size: clamp(2.25rem,9.2vw,3rem); line-height: 1.08; letter-spacing: -.045em; }
  .masthead-aside { max-width: none; padding: 0; margin-top: 18px; }
  .masthead-aside p { font-size: 1rem; line-height: 1.55; margin: 0; }
  .masthead-aside p br { display: none; }
  .masthead-aside .plain-link { margin-top: 10px; font-size: .9375rem; min-height: 44px; }
  .city-switcher { min-height: 57px; gap: 14px; }
  .city-switcher button { font-size: 1rem; min-height: 48px; }
  .city-switcher > a { font-size: .875rem; min-height: 48px; display: inline-flex; align-items: center; }
  .city-switcher > a span { margin-left: 5px; }
  .city-stage { height: auto; aspect-ratio: 1.85; }
  .city-stage > img { object-position: center 47%; }
  .city-stage figcaption { padding: 35px 20px 15px; font-size: .75rem; }
  .hero-request { padding: 25px 0 0; margin: 0; border: 0; }
  .direct-contacts { gap: 4px 24px; margin-bottom: 18px; }
  .direct-contacts > p { flex-basis: 100%; margin-bottom: 3px; }
  .direct-contact-group { gap: 0 18px; }
  .direct-contact-group > span { min-width: 53px; }
  .direct-contact-group a { font-size: .9375rem; min-height: 48px; }
  .request-fields { grid-template-columns: minmax(0,1fr); gap: 17px; }
  .request-extra > .field:last-child { grid-column: auto; }
  .field label { font-size: .875rem; margin-bottom: 7px; }
  .hero-request select { font-size: 1rem; min-height: 52px; padding: 11px 38px 11px 14px; border: 1px solid var(--rule); }
  .hero-request select:focus { box-shadow: inset 0 0 0 1px var(--accent); }
  .select-trigger { min-height: 52px; padding: 11px 14px; border: 1px solid var(--rule); font-size: 1rem; }
  .select-trigger:focus, .select[data-open] .select-trigger { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
  .select-list li { display: flex; align-items: center; min-height: 48px; padding: 12px 14px; }
  .property-site .request-submit { justify-content: space-between; gap: 16px; padding: 15px 18px; height: auto; min-height: 56px; font-size: 1rem; }
  .request-bottom { display: block; margin-top: 12px; }
  .request-bottom > p { margin-top: 8px; font-size: .875rem; line-height: 1.6; }
  .request-more summary { display: flex; align-items: center; min-height: 48px; padding: 12px 0; font-size: .875rem; }
  .request-extra { grid-template-columns: 1fr; padding-top: 14px; gap: 18px; }
  .request-extra textarea { font-size: 16px; }
  .result-heading { display: block; }
  .result-heading h2 { font-size: 26px; margin-bottom: 12px; }
  .hero-request [data-request-message] { font-size: 16px; }
  .delivery-actions { width: 100%; display: grid; grid-template-columns: minmax(0,1fr); gap: 10px; }
  .delivery-actions .btn { justify-content: space-between; gap: 16px; font-size: 1rem; padding: 15px 18px; min-height: 54px; }
  .result-tools { gap: 10px 24px; }
  .result-tools button { font-size: .875rem; min-height: 48px; }
  .request-privacy, .copy-status { font-size: .875rem; line-height: 1.6; }
  .purchase-note { padding: 40px 0 40px; }
  .purchase-grid, .faq-grid, .people-heading { grid-template-columns: 1fr; gap: 22px; padding-top: 28px; }
  .section-index { margin: 0; font-size: 13px; }
  .purchase-note h2, .people-heading h2, .property-home .landing-faq h2 { font-size: 1.9rem; line-height: 1.15; letter-spacing: -.04em; }
  .purchase-note h2 { margin-bottom: 23px; }
  .purchase-note h2 br { display: none; }
  .purchase-intro { font-size: 19px; line-height: 1.6; margin-bottom: 25px; }
  .purchase-details { padding-top: 20px; gap: 15px; }
  .purchase-details > p { font-size: 1rem; }
  .purchase-details > a { white-space: normal; font-size: .9375rem; min-height: 48px; }
  .landing-people { padding: 0 0 40px; }
  .people-heading { margin-bottom: 25px; }
  .people-heading h2 { margin-bottom: 18px; }
  .people-heading > div > p { font-size: 1rem; }
  .contact-person-row, .reader-page .contact-person-row { grid-template-columns: minmax(0,1fr); padding: 25px 0; gap: 18px; }
  .contact-person-row > div:first-child, .reader-page .contact-person-row > div:first-child { grid-row: auto; }
  .person-links, .reader-page .person-links { grid-column: auto; align-items: stretch; }
  .person-links a { min-height: 48px; }
  .contact-people h3 { font-size: 1.6rem; }
  .people-next { font-size: .875rem; }
  .people-next a { min-height: 44px; }
  .landing-faq { padding: 0 0 52px; }
  .property-home .faq-item summary { font-size: 1rem; line-height: 1.5; padding-top: 20px; padding-bottom: 20px; }
  .property-home .faq-answer p { font-size: 16px; }
  .property-footer-top { display: block; }
  .property-footer-top .wordmark { font-size: 44px; }
  .property-footer-top nav { margin-top: 28px; display: grid; grid-template-columns: 1fr; gap: 30px; }
  .property-footer-top nav > div:first-child { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 20px; }
  .property-footer-top nav > div + div { gap: 0; }
  .property-footer-top nav > div + div a { border-bottom: 1px solid var(--rule); padding: 13px 0; }
  .property-footer-top .contact-person { font-size: .875rem; margin-top: 4px; }
  .property-footer-top nav a { font-size: 1rem; min-height: 44px; overflow-wrap: anywhere; display: block; }
  .property-footer-bottom { display: block; }
  .property-footer-bottom > span { display: block; margin-bottom: 9px; }
  .property-site .site-footer { padding-bottom: max(30px,env(safe-area-inset-bottom)); }
  .property-footer-bottom { font-size: .875rem; line-height: 1.7; }
  .photo-credits summary { min-height: 44px; padding: 12px 0; font-size: .875rem; }
  .property-list { grid-template-columns: 1fr; }
  .mobile-contact-bar { display: block; padding: 0 20px 40px; }
  .mobile-contact-bar .btn { width: 100%; justify-content: space-between; font-size: 1rem; }

}
@media (max-width: 370px) {
  .property-site .shell { padding-left: 16px; padding-right: 16px; }
  .city-switcher { flex-wrap: wrap; gap: 0 14px; }
  .city-switcher > a { font-size: .875rem; margin-left: auto; }

  .request-fields { gap: 17px; }

}
@media (prefers-reduced-motion: reduce) { .property-site *, .property-site *::before, .property-site *::after { transition: none !important; animation: none !important; } }
.property-site .site-header .header-cta { min-height: 0; padding: 8px 0; background: transparent; color: var(--accent); border: none; border-bottom: 1px solid currentColor; }
.property-site .site-header .header-cta:hover { color: var(--ink); background: transparent; }
.property-site .field label { font-size: 14px; }

/* Feedback belongs to the control; text and page layout remain still. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .property-site .btn, .property-site .plain-link, .property-site .reader-action {
    transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out;
  }
}
@media (hover: none) {
  .property-site .btn-primary:hover { background: var(--accent); border-color: var(--accent); }
  .property-site .btn-ghost:hover { background: transparent; color: var(--ink); }
  .property-site .btn-primary:active { background: #96321e; border-color: #96321e; }
  .property-site .btn-ghost:active { background: var(--paper-tint); }
  .city-switcher button:hover { color: var(--gray); }
  .city-switcher button[aria-pressed="true"] { color: var(--ink); }
}
@media (max-width: 979px) {
  .property-site .menu-toggle { min-height: 48px; min-width: 85px; justify-content: flex-end; padding: 10px 0 10px 12px; }
  .property-site .menu-toggle[aria-expanded="true"] { background: transparent; color: var(--ink); }
  .property-site .nav-mobile { position: absolute; inset: 100% 0 auto; z-index: 45; border-bottom: 1px solid var(--ink); max-height: 75vh; max-height: calc(100svh - 100px); overflow-y: auto; overscroll-behavior: contain; }
  .property-site .nav-mobile ul { padding: 10px 20px 24px; }
  .property-site .nav-mobile a { font-size: 1rem; min-height: 52px; padding: 15px 0; }
  .property-site .nav-mobile .nav-mobile-cta { padding: 15px 20px; }
}

/* Reading pages: the same type, rules and accent as the property landing. */
.contact-person { display: block; font-size: 12px; color: var(--gray); line-height: 1.45; }
.reader-page { padding-bottom: 80px; }
.reader-page h1, .reader-page h2, .reader-page h3 { font-family: var(--sans); font-weight: 500; }
.reader-page p, .reader-page li, .reader-page dd { line-height: 1.75; }
.reader-intro { padding-top: 29px; padding-bottom: 49px; }
.reader-breadcrumb { display: flex; flex-wrap: wrap; gap: 12px; font-size: .875rem; color: var(--gray); margin-bottom: 34px; }
.reader-breadcrumb a { color: var(--gray); text-decoration: none; }
.reader-breadcrumb a:hover { color: var(--accent); }
.reader-title-row { display: grid; grid-template-columns: 1.5fr 1fr; align-items: end; gap: 70px; }
.reader-title-row h1 { font-size: clamp(2.6rem,4.8vw,4.4rem); line-height: 1.04; letter-spacing: -.055em; max-width: 17ch; text-wrap: balance; }
.reader-title-row > p { margin: 0; font-size: 1.125rem; line-height: 1.65; max-width: 34em; color: var(--ink-2); padding-bottom: 4px; }
.reader-grid { display: grid; grid-template-columns: 210px minmax(0,1fr); gap: 65px; align-items: start; }
.reader-sidebar { align-self: stretch; min-width: 0; }
.reader-sidebar nav { position: sticky; top: 28px; border-top: 1px solid var(--ink); padding-top: 16px; }
.reader-sidebar nav > p { color: var(--gray); font-size: .875rem; margin-bottom: 14px; }
.reader-sidebar ol { list-style: none; padding: 0; margin: 0; }
.reader-sidebar a { display: flex; gap: 13px; padding: 10px 0; min-height: 44px; text-decoration: none; color: var(--ink); font-size: .875rem; line-height: 1.5; }
.reader-sidebar a > span { color: var(--gray); font-size: .75rem; padding-top: 2px; font-variant-numeric: tabular-nums; }
.reader-sidebar a:hover { color: var(--accent); }
.reader-content { min-width: 0; }
.reader-section { border-top: 1px solid var(--rule); padding: 35px 0 50px; }
.reader-section > h2, .purchase-phase h2, .reader-closing h2 { font-size: clamp(1.65rem,2.6vw,2.3rem); line-height: 1.16; letter-spacing: -.04em; margin-bottom: 22px; max-width: 26ch; text-wrap: balance; }
.reader-lead { max-width: 65ch; color: var(--ink-2); font-size: 1.0625rem; margin: 0 0 28px; }
.reader-label { font: 400 .875rem/1.5 var(--sans) !important; color: var(--gray); margin: 0 0 9px; letter-spacing: 0; }
.reader-prose { max-width: 68ch; font-size: 1.0625rem; color: var(--ink-2); }
.reader-prose p { margin-bottom: 1.25em; }
.reader-aside-note { border-left: 2px solid var(--accent); padding: 0 0 0 20px; color: var(--ink-2); font-size: .9375rem; max-width: 68ch; margin: 28px 0; }
.reader-aside-note strong { font-weight: 500; color: var(--ink); }
.reader-aside-note .fine { font-size: .9375rem; line-height: 1.7; }
.reader-source-note, .reader-page .source-note { font-size: .875rem; color: var(--gray); line-height: 1.65; margin: 20px 0; max-width: 76ch; }
.reader-source-note a, .reader-page .source-note a { color: var(--gray); }
.reader-source-note a:hover, .reader-page .source-note a:hover { color: var(--accent); }
.reader-closing { border-top: 1px solid var(--ink); padding: 34px 0 0; margin-top: 12px; display: flex; gap: 32px; align-items: flex-start; justify-content: space-between; }
.reader-closing h2 { margin-bottom: 15px; font-size: 1.8rem; }
.reader-closing p { max-width: 50ch; color: var(--ink-2); }
.reader-closing .btn { flex-shrink: 0; margin-top: 4px; }
.reader-page svg { flex-shrink: 0; }
.reader-action { display: inline-flex; align-items: center; gap: 20px; padding: 12px 0 6px; margin-top: 15px; border-bottom: 1px solid currentColor; text-decoration: none; font-size: 1rem; line-height: 1.5; color: var(--accent); }
.reader-action:hover { color: var(--ink); }
.reading-details { border-top: 1px solid var(--rule); }
.reading-details:last-child { border-bottom: 1px solid var(--rule); }
.reading-details summary { list-style: none; display: flex; gap: 22px; align-items: baseline; justify-content: space-between; padding: 18px 0; cursor: pointer; font-size: 1rem; font-weight: 400; line-height: 1.5; }
.reading-details summary::-webkit-details-marker { display: none; }
.reading-details summary:hover { color: var(--accent); }
.reading-details summary > span { font-size: 1.25rem; line-height: 1; flex-shrink: 0; }
.reading-details[open] summary > span { transform: rotate(45deg); }
.reading-details > div { padding: 0 0 24px; color: var(--ink-2); max-width: 72ch; }
.reading-details > div > p { font-size: 1rem; }
.reading-definitions { margin: 0; }
.reading-definitions > div + div { border-top: 1px solid var(--rule-soft); padding-top: 19px; margin-top: 19px; }
.reading-definitions dt { font-size: 1rem; font-weight: 500; color: var(--ink); margin-bottom: 7px; }
.reading-definitions dd { font-size: 1rem; color: var(--ink-2); margin: 0; }
.step-responsibility { display: block; font-size: .875rem; color: var(--gray); margin-top: 8px; }
.reader-list { list-style: none; padding: 0; margin: 0 0 25px; max-width: 67ch; }
.reader-list li { position: relative; padding-left: 21px; margin: 10px 0; font-size: 1rem; color: var(--ink-2); }
.reader-list li::before { content: ""; position: absolute; left: 0; top: .85em; width: 7px; height: 1px; background: var(--accent); }
.reader-responsibility { color: var(--gray); font-size: .9375rem; max-width: 68ch; margin: 22px 0; }
.reader-resources { list-style: none; padding: 0; margin: 0; }
.reader-resources > li { border-bottom: 1px solid var(--rule); padding: 18px 0; }
.reader-resources > li:first-child { border-top: 1px solid var(--rule); }
.reader-resources > li > a { color: var(--ink); text-decoration: none; font-size: 1rem; }
.reader-resources > li > a:hover { color: var(--accent); }
.reader-resources > li > a > span { color: var(--accent); padding-left: 6px; }
.reader-resources > li > p { font-size: .875rem; color: var(--gray); margin: 5px 0 0; }
.reader-resources-two { display: grid; grid-template-columns: 1fr 1fr; column-gap: 32px; }
.reader-resources-two > li:nth-child(2) { border-top: 1px solid var(--rule); }
.city-overview { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding-bottom: 45px; }
.city-overview article { min-width: 0; }
.city-overview figure { margin: 0 0 26px; }
.city-overview img { width: 100%; height: auto; aspect-ratio: 1.5; object-fit: cover; display: block; }
.city-overview figcaption { font-size: .75rem; color: var(--gray); margin-top: 7px; }
.city-overview h2 { font-size: 2.2rem; letter-spacing: -.05em; margin-bottom: 17px; }
.city-overview article > p:not(.reader-label) { font-size: 1rem; color: var(--ink-2); }
.city-overview .city-tradeoff { padding-top: 15px; border-top: 1px solid var(--rule); }
.city-tradeoff strong { font-weight: 500; color: var(--ink); }
.comparison-group { margin: 30px 0; }
.comparison-group > h3 { font-size: 1.25rem; margin-bottom: 15px; letter-spacing: -.025em; }
.reader-page .compare { border-top: 1px solid var(--ink); }
.reader-page .compare-head { font-size: .875rem; text-transform: none; letter-spacing: 0; font-weight: 500; gap: 22px; }
.reader-page .compare-row { gap: 22px; padding: 20px 0; }
.reader-page .compare-criterion { font-family: var(--sans); font-size: .9375rem; font-weight: 500; line-height: 1.5; letter-spacing: 0; }
.reader-page .compare-cell p { font-size: 1rem; line-height: 1.7; }
.reader-page .compare-city { text-transform: none; letter-spacing: 0; font-size: .875rem; font-weight: 400; }
.data-comparison-head, .data-comparison-row { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 25px; align-items: start; }
.data-comparison-head { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); padding: 14px 0; color: var(--gray); font-size: .875rem; }
.data-comparison-row { border-bottom: 1px solid var(--rule); padding: 22px 0; }
.data-comparison-row h3 { font-size: .9375rem; font-weight: 400; line-height: 1.6; letter-spacing: 0; }
.data-comparison-row h3 > a { display: block; font-size: .875rem; margin-top: 7px; color: var(--gray); }
.data-comparison-row p { margin: 0; }
.data-comparison-row strong { font-size: clamp(1.1rem,1.6vw,1.45rem); font-weight: 500; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.data-city { display: none; }
.phase-nav { border-top: 1px solid var(--ink); padding: 24px 0 28px; }
.phase-nav ol { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); }
.phase-nav a { display: block; color: var(--ink); font-size: .875rem; text-decoration: none; }
.phase-nav a:hover { color: var(--accent); }
.phase-nav svg { display: block; width: 100%; height: 34px; overflow: visible; margin-bottom: 10px; }
.phase-nav svg text { font-family: var(--sans); }
.phase-nav li:last-child line { display: none; }
.phase-nav a > span { display: block; padding-right: 8px; }
.purchase-phase { border-top: 1px solid var(--rule); padding: 35px 0 40px; display: grid; grid-template-columns: 52px minmax(0,1fr); gap: 25px; }
.phase-number { font-size: 1.125rem; color: var(--accent); font-variant-numeric: tabular-nums; padding-top: 4px; }
.phase-intro { font-size: 1.0625rem; max-width: 63ch; color: var(--ink-2); }
.phase-result { margin: 23px 0; padding-left: 20px; border-left: 2px solid var(--accent); max-width: 63ch; }
.phase-result p { font-size: 1.125rem; color: var(--ink); line-height: 1.6; }
.phase-who { font-size: .9375rem; color: var(--gray); max-width: 65ch; margin-bottom: 20px; }
.phase-who strong { display: block; color: var(--ink-2); font-weight: 500; margin-bottom: 4px; }
.reading-rows article { display: grid; grid-template-columns: 1fr 2fr; gap: 30px; padding: 23px 0; border-bottom: 1px solid var(--rule); }
.reading-rows article:first-child { border-top: 1px solid var(--rule); }
.reading-rows h3 { font-size: 1rem; line-height: 1.5; letter-spacing: 0; }
.reading-rows p { color: var(--ink-2); margin: 0; font-size: 1rem; }
.scenario-principle { margin-top: 0; margin-bottom: 32px; }
.scenario-principle strong { display: block; margin-bottom: 5px; }
.scenario-start { margin-bottom: 24px; max-width: 62ch; }
.scenario-start p { font-size: 1.125rem; }
.contact-directory > article { display: grid; grid-template-columns: 1fr 1.15fr; gap: 30px; padding: 32px 0 38px; border-top: 1px solid var(--rule); align-items: center; }
.contact-directory > article:first-child { border-color: var(--ink); padding-top: 27px; }
.contact-directory h2 { font-size: 2.4rem; letter-spacing: -.05em; margin-bottom: 15px; }
.contact-directory p:not(.reader-label) { max-width: 30ch; color: var(--ink-2); font-size: 1rem; }
.contact-number { display: flex; gap: 20px; align-items: center; font-size: clamp(1.35rem,2.3vw,2rem); line-height: 1.4; letter-spacing: -.045em; text-decoration: none; color: var(--accent); }
.contact-chat-links { display: flex; flex-wrap: wrap; gap: 15px 30px; }
.contact-chat-links .reader-action { margin: 0; }
.contact-directory .contact-email h2 { font-size: 1.2rem; letter-spacing: -.02em; margin: 0; }
.contact-email .reader-action { margin: 0; overflow-wrap: anywhere; }
.property-site:not(.property-home) .site-footer { padding-bottom: 28px; }
.property-site:not(.property-home) .section-title { font-family: var(--sans); font-weight: 500; }
@media (max-width: 1150px) {
  .reader-grid { grid-template-columns: 175px minmax(0,1fr); gap: 35px; }
  .reader-title-row { gap: 38px; grid-template-columns: 1.4fr 1fr; }
  .reader-closing { flex-direction: column; gap: 10px; }
  .reader-page .compare-row { grid-template-columns: 1fr 1.4fr 1.4fr; gap: 15px; }
  .reader-page .compare-head { grid-template-columns: 1fr 1.4fr 1.4fr; gap: 15px; }
  .reader-page .compare-cell { padding-left: 12px; }
  .data-comparison-head, .data-comparison-row { gap: 15px; }
  .contact-directory > article { grid-template-columns: 1fr; gap: 15px; }
}
@media (max-width: 900px) {
  .reader-intro { padding-top: 24px; padding-bottom: 32px; }
  .reader-breadcrumb { margin-bottom: 28px; }
  .reader-title-row { grid-template-columns: 1fr; gap: 24px; }
  .reader-title-row h1 { font-size: clamp(2.5rem,6vw,3.6rem); max-width: 21ch; }
  .reader-title-row > p { max-width: 58ch; }
  .reader-grid { grid-template-columns: 1fr; gap: 30px; }
  .reader-sidebar nav { position: static; padding-top: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--rule); }
  .reader-sidebar nav > p { margin-bottom: 6px; }
  .reader-sidebar ol { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
  .reader-sidebar a { padding: 9px 0; }
  .reader-page .compare-head { display: grid; grid-template-columns: 1fr 1.4fr 1.4fr; gap: 15px; padding: 12px 0; }
  .reader-page .compare-cell { border-left: 1px solid var(--rule-soft); }
  .reader-page .compare-city { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media (max-width: 600px) {
  .reader-page { padding-bottom: 50px; }
  .reader-breadcrumb { font-size: .875rem; gap: 10px; margin-bottom: 24px; }
  .reader-title-row { gap: 20px; }
  .reader-title-row h1 { font-size: clamp(2.2rem,8.6vw,3.2rem); line-height: 1.08; letter-spacing: -.05em; }
  .reader-title-row > p { font-size: 1rem; }
  .reader-sidebar ol { gap: 0 18px; }
  .reader-sidebar a { gap: 9px; font-size: .875rem; }
  .reader-sidebar a > span { display: none; }
  .reader-section { padding: 28px 0 34px; }
  .reader-section > h2, .purchase-phase h2 { font-size: 1.65rem; margin-bottom: 18px; }
  .reader-lead { font-size: 1rem; margin-bottom: 23px; }
  .reader-prose { font-size: 1rem; }
  .city-overview { gap: 23px; grid-template-columns: 1fr; padding-bottom: 32px; }
  .city-overview article + article { border-top: 1px solid var(--rule); padding-top: 27px; }
  .city-overview img { aspect-ratio: 1.85; }
  .city-overview figure { margin-bottom: 20px; }
  .city-overview h2 { font-size: 2rem; margin-bottom: 14px; }
  .reader-page .compare-head { display: none; }
  .reader-page .compare-row { grid-template-columns: minmax(0,1fr); gap: 15px; }
  .reader-page .compare-criterion { grid-column: 1 / -1; font-size: 1rem; }
  .reader-page .compare-cell { padding-left: 0; border: 0; }
  .reader-page .compare-cell + .compare-cell { padding-top: 14px; border-top: 1px solid var(--rule-soft); }
  .reader-page .compare-cell p { font-size: 1rem; line-height: 1.65; }
  .reader-page .compare-city { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; margin-bottom: 8px; font-size: .875rem; }
  .data-comparison-head { display: none; }
  .data-comparison { border-top: 1px solid var(--ink); }
  .data-comparison-row { grid-template-columns: 1fr 1fr; gap: 14px 22px; }
  .data-comparison-row h3 { grid-column: 1 / -1; }
  .data-comparison-row h3 > a { margin-top: 3px; }
  .data-city { display: block; font-size: .875rem; color: var(--gray); margin-bottom: 4px; }
  .data-comparison-row strong { font-size: 1.25rem; }
  .phase-nav { padding-top: 0; border-top: 0; }
  .phase-nav ol { grid-template-columns: 1fr; gap: 0; }
  .phase-nav a { display: flex; align-items: center; gap: 14px; min-height: 46px; font-size: 1rem; }
  .phase-nav svg { width: 34px; height: 34px; margin: 0; overflow: hidden; }
  .phase-nav svg { display: none; }
  .phase-nav ol { counter-reset: phase; }
  .phase-nav li { counter-increment: phase; border-bottom: 1px solid var(--rule-soft); }
  .phase-nav a::before { content: counter(phase, decimal-leading-zero); color: var(--accent); font-size: .875rem; }
  .purchase-phase { grid-template-columns: 1fr; gap: 12px; padding: 26px 0 32px; }
  .phase-number { font-size: 1rem; padding: 0; }
  .phase-intro { font-size: 1rem; }
  .phase-result { padding-left: 16px; margin: 20px 0; }
  .phase-result p { font-size: 1.0625rem; }
  .reading-rows article { grid-template-columns: 1fr; gap: 12px; padding: 20px 0; }
  .reader-resources-two { grid-template-columns: 1fr; }
  .reader-resources-two > li:nth-child(2) { border-top: 0; }
  .reader-closing { padding-top: 28px; }
  .reader-closing h2 { font-size: 1.65rem; }
  .reader-closing .btn { width: 100%; justify-content: space-between; }
  .reader-action { font-size: 1rem; gap: 12px; }
  .contact-directory h2 { font-size: 2rem; }
  .contact-number { font-size: 1.7rem; }
}
@media (max-width: 370px) {
  .reader-page .compare-row { grid-template-columns: 1fr; }
  .reader-page .compare-cell + .compare-cell { padding-top: 12px; border-top: 1px solid var(--rule-soft); }
}

/* Calculator. Same ruled system as the reading pages: no cards, no shadows,
   figures on hairlines, one accent used only for the schematic and totals. */
.calc { margin-bottom: 34px; }
.calc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 22px 22px; }
.calc-field { min-width: 0; }
.calc-field label { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 7px; font-size: .875rem; color: var(--ink); }
.calc-field label span { color: var(--gray); font-size: .8125rem; }
.calc-field input, .calc-field select {
  width: 100%; min-height: 46px; padding: 9px 12px; font: 400 1rem/1.5 var(--sans);
  color: var(--ink); background: var(--paper-tint); border: 0;
  border-bottom: 1px solid var(--rule); border-radius: 0;
}
.calc-field input:hover, .calc-field select:hover { border-bottom-color: var(--ink); }
.calc-field select { cursor: pointer; }
.calc-field input:focus, .calc-field select:focus { outline: none; border-bottom-color: var(--accent); box-shadow: inset 0 -1px 0 var(--accent); }
@media (forced-colors: active) { .calc-field input:focus, .calc-field select:focus { outline: 2px solid; } }
.calc-hint { margin: 7px 0 0; font-size: .8125rem; line-height: 1.5; color: var(--gray); }
.calc-more { margin-top: 26px; }
.calc-more > div { padding-top: 22px; }

.calc-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 20px 26px; border-top: 1px solid var(--ink); padding-top: 22px; margin-bottom: 34px; }
.calc-summary-label { margin: 0 0 6px; font-size: .875rem; color: var(--gray); }
.calc-summary-value { margin: 0; font-size: 1.5rem; line-height: 1.2; letter-spacing: -.035em; font-weight: 500; }
.calc-subhead { font-size: 1rem; font-weight: 500; margin: 0 0 12px; }
.calc-table { width: 100%; border-collapse: collapse; margin-bottom: 26px; font-variant-numeric: tabular-nums; }
.calc-table th, .calc-table td { text-align: left; padding: 11px 0; border-bottom: 1px solid var(--rule-soft); font-weight: 400; font-size: .9375rem; }
.calc-table td { text-align: right; white-space: nowrap; }
.calc-table tr[data-zero] th, .calc-table tr[data-zero] td { color: var(--gray); }
.calc-table tr[data-total] th, .calc-table tr[data-total] td { border-top: 1px solid var(--ink); border-bottom: 0; padding-top: 13px; font-weight: 500; }
.calc-note { font-size: .875rem; color: var(--gray); margin: -14px 0 26px; }


.calc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; padding-top: 22px; border-top: 1px solid var(--rule); }
.calc-copy { font: 400 .875rem/1.5 var(--sans); background: none; border: 0; border-bottom: 1px solid var(--rule); padding: 8px 0; color: var(--gray); cursor: pointer; min-height: 44px; }
.calc-copy:hover { color: var(--accent); border-color: var(--accent); }
@media (max-width: 600px) {
  .calc-grid { grid-template-columns: 1fr; gap: 18px; }
  .calc-field input, .calc-field select { min-height: 52px; padding: 11px 14px; border: 1px solid var(--rule); background: var(--paper-tint); font-size: 1rem; }
  .calc-field input:focus, .calc-field select:focus { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
  .calc-summary-value { font-size: 1.3rem; }
  .calc-actions .btn { width: 100%; justify-content: space-between; }
}

/* Cross-document navigation: the header and footer hold still while the page
   between them changes. Browsers without view transitions navigate normally,
   so this is presentation only and nothing depends on it. */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
}
.site-header { view-transition-name: site-header; }
.site-footer { view-transition-name: site-footer; }
::view-transition-group(site-header),
::view-transition-group(site-footer) { animation: none; }
::view-transition-old(root),
::view-transition-new(root) { animation-duration: .22s; }

/* Interface furniture is not content. Dragging across the page should select
   what a reader would actually quote, so labels, navigation, controls and the
   schematic's own captions stay out of selections. Prose, figures, table rows
   and contact details are deliberately left selectable, because people copy
   those on purpose. */
.wordmark,
.nav-desktop a, .nav-mobile a, .menu-toggle, .btn,
.city-switcher button, .city-switcher > span, .city-switcher > a,
.city-stage figcaption,
.select-trigger, .select-list li,
.calc-field label, .calc-hint, .calc-summary-label, .calc-subhead, .calc-copy,
.reader-sidebar a, .reader-breadcrumb, .anchor-nav a, .phase-nav a,
.section-index, .kicker, .reader-label, .contact-role,
.direct-contacts > p, .direct-contact-group > span,
.request-bottom > p, .result-tools button,
.faq-item summary, .reading-details summary,
.request-more summary, .message-preview summary, .photo-credits summary,
.preview-flag {
  user-select: none;
  -webkit-user-select: none;
}

/* Display type on the landing is pitch, not quotable copy. Reading pages and
   articles keep their headings selectable. */
.property-home h1, .property-home h2, .property-home .contact-people h3 {
  user-select: none;
  -webkit-user-select: none;
}

/* The contact step in front of the result. Ruled like everything else: it is a
   question, not a paywall, so it gets no box and no emphasis beyond a rule. */
.calc-gate { border-top: 1px solid var(--ink); padding-top: 24px; max-width: 640px; }
.calc-gate > p { color: var(--ink-2); max-width: 60ch; margin-bottom: 22px; }
.calc-gate .calc-grid { margin-bottom: 22px; }
.calc-gate input[type="text"] {
  width: 100%; min-height: 46px; padding: 9px 12px; font: 400 1rem/1.5 var(--sans);
  color: var(--ink); background: var(--paper-tint); border: 0;
  border-bottom: 1px solid var(--rule); border-radius: 0;
}
.calc-gate input[type="text"]:hover { border-bottom-color: var(--ink); }
.calc-gate input[type="text"]:focus { outline: none; border-bottom-color: var(--accent); box-shadow: inset 0 -1px 0 var(--accent); }
.calc-reveal { margin-bottom: 16px; }
.calc-gate .calc-note { margin: 0; }

/* An unchosen option should not look like an answer. */
.select-placeholder .select-trigger { color: var(--gray); }
@media (max-width: 600px) {
  .calc-gate input[type="text"] { min-height: 52px; padding: 11px 14px; border: 1px solid var(--rule); }
  .calc-gate input[type="text"]:focus { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
  .calc-reveal { width: 100%; justify-content: space-between; }
}
.calc-field label span { color: var(--gray); font-size: .8125rem; font-weight: 400; }
.calc-gate-status:empty { display: none; }
.calc-gate-status { margin: 0 0 16px; font-size: .875rem; color: var(--accent); }
.calc-gate [aria-invalid="true"] { border-bottom-color: var(--accent); box-shadow: inset 0 -1px 0 var(--accent); }
.field-suffix { color: var(--gray); font-size: .8125rem; margin-left: 8px; }
.hero-request input[type="number"] {
  width: 100%; display: block; min-width: 0; min-height: var(--control-h);
  padding: 9px 12px; font: 400 16px/1.5 var(--sans); color: var(--ink);
  background: var(--paper-tint); border: 0; border-bottom: 1px solid var(--rule); border-radius: 0;
}
.hero-request input[type="number"]:hover { border-bottom-color: var(--ink); }
.hero-request input[type="number"]:focus { outline: none; border-bottom-color: var(--accent); box-shadow: inset 0 -1px 0 var(--accent); }
.hero-request input[type="number"]::placeholder { color: var(--gray); }
@media (max-width: 760px) {
  .hero-request input[type="number"] { min-height: 52px; padding: 11px 14px; border: 1px solid var(--rule); font-size: 1rem; }
  .hero-request input[type="number"]:focus { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
}