/* Sell Now 206: urban editorial. One theme, no variants. */

:root {
  --night: #0E1A22;
  --rain: #DDE3E6;
  --slate: #5B6770;
  --cedar: #A0522D;
  --paper: #F4F5F3;
  --white: #FFFFFF;

  --hair: rgba(14, 26, 34, 0.14);
  --guide: rgba(14, 26, 34, 0.055);

  --serif: "Instrument Serif", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans: "Geist", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;

  --max: 1360px;
  --gut: clamp(20px, 3.2vw, 44px);
  --gap: 24px;
  --measure: 62ch;
}

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

html {
  background: var(--paper);
  color: var(--night);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--night);
  font-family: var(--sans);
  font-size: 17.5px;
  line-height: 1.62;
  font-weight: 400;
  font-feature-settings: "kern", "liga", "ss01";
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
  position: relative;
  z-index: 0;
  hanging-punctuation: first last;
}

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

a { color: inherit; }

p { margin: 0 0 1.05em; }

h1, h2, h3, h4 { margin: 0; font-weight: 400; }

::selection { background: var(--cedar); color: var(--paper); }

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

.skip {
  position: absolute;
  left: 12px;
  top: -60px;
  background: var(--night);
  color: var(--paper);
  padding: 10px 14px;
  font-size: 0.9rem;
  z-index: 50;
  text-decoration: none;
}
.skip:focus { top: 12px; }

/* ---------- The visible 12-column grid ---------- */

.wrap {
  max-width: var(--max);
  margin: 0 auto;
  padding-inline: var(--gut);
}

.grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: var(--gap);
}

@media (min-width: 880px) {
  .grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }

  body::before {
    content: "";
    position: fixed;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100%;
    max-width: var(--max);
    transform: translateX(-50%);
    padding-inline: var(--gut);
    background-origin: content-box;
    background-clip: content-box;
    background-image:
      linear-gradient(to left, var(--guide) 0 1px, transparent 1px),
      repeating-linear-gradient(to right, var(--guide) 0 1px, transparent 1px calc((100% + var(--gap)) / 12));
    pointer-events: none;
    z-index: -1;
  }

  /* span helpers: x{start}-{end}, inclusive columns */
  .x1-3 { grid-column: 1 / 4; }
  .x1-4 { grid-column: 1 / 5; }
  .x1-5 { grid-column: 1 / 6; }
  .x1-6 { grid-column: 1 / 7; }
  .x1-7 { grid-column: 1 / 8; }
  .x1-8 { grid-column: 1 / 9; }
  .x1-9 { grid-column: 1 / 10; }
  .x1-10 { grid-column: 1 / 11; }
  .x1-11 { grid-column: 1 / 12; }
  .x1-12 { grid-column: 1 / 13; }
  .x2-11 { grid-column: 2 / 12; }
  .x3-12 { grid-column: 3 / 13; }
  .x4-8 { grid-column: 4 / 9; }
  .x4-9 { grid-column: 4 / 10; }
  .x4-10 { grid-column: 4 / 11; }
  .x4-11 { grid-column: 4 / 12; }
  .x4-12 { grid-column: 4 / 13; }
  .x5-12 { grid-column: 5 / 13; }
  .x6-12 { grid-column: 6 / 13; }
  .x7-12 { grid-column: 7 / 13; }
  .x8-12 { grid-column: 8 / 13; }
  .x9-12 { grid-column: 9 / 13; }
  .x10-12 { grid-column: 10 / 13; }
  .x11-12 { grid-column: 11 / 13; }
  .x6-11 { grid-column: 6 / 12; }
  .x7-11 { grid-column: 7 / 12; }
  .x8-11 { grid-column: 8 / 12; }
  .x9-11 { grid-column: 9 / 12; }
  .x6-7 { grid-column: 6 / 8; }
  .x8-10 { grid-column: 8 / 11; }
  .row1 { grid-row: 1; }
}

/* ---------- Type ---------- */

.display {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(3.1rem, 8.6vw, 8.6rem);
  line-height: 0.9;
  letter-spacing: -0.018em;
  text-wrap: balance;
}
.display em,
.h2 em,
.stmt em {
  font-style: italic;
  color: var(--cedar);
}

.h2 {
  font-family: var(--serif);
  font-size: clamp(2.3rem, 4.6vw, 4.3rem);
  line-height: 0.98;
  letter-spacing: -0.012em;
  text-wrap: balance;
}

.h3 {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.55rem, 2.1vw, 1.95rem);
  line-height: 1.1;
  margin: 1.5em 0 0.4em;
}
.h3:first-child { margin-top: 0; }

.h3-sans {
  font-family: var(--sans);
  font-weight: 600;
  font-size: 1.02rem;
  letter-spacing: 0.005em;
  line-height: 1.35;
  margin: 1.6em 0 0.35em;
}

.lead {
  font-size: clamp(1.18rem, 1.55vw, 1.42rem);
  line-height: 1.5;
  letter-spacing: -0.005em;
  max-width: 40ch;
}
.lead-wide { max-width: 52ch; }

.prose { max-width: var(--measure); }
.prose p,
.prose li { text-wrap: pretty; }
.prose ul {
  list-style: none;
  padding: 0;
  margin: 0 0 1.3em;
  border-top: 1px solid var(--hair);
}
.prose ul li {
  padding: 0.85em 0 0.85em 1.4em;
  border-bottom: 1px solid var(--hair);
  position: relative;
}
.prose ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.45em;
  width: 0.55em;
  height: 1px;
  background: var(--cedar);
}
.prose strong { font-weight: 600; }

.label {
  font-family: var(--sans);
  font-weight: 500;
  font-size: 0.98rem;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.075em;
  color: var(--slate);
  line-height: 1.35;
}

.num { font-variant-numeric: tabular-nums lining-nums; }

.muted { color: var(--slate); }

.link {
  font-weight: 500;
  text-decoration: none;
  background-image: linear-gradient(var(--cedar), var(--cedar));
  background-size: 100% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  padding-bottom: 2px;
  transition: color 0.2s ease;
}
.link:hover { color: var(--cedar); }
.link .arr { display: inline-block; transition: transform 0.2s ease; }
.link:hover .arr { transform: translateX(3px); }

.prose a:not(.link),
.faq a,
.note a {
  text-decoration-color: var(--cedar);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.prose a:not(.link):hover { color: var(--cedar); }

.btn {
  display: inline-block;
  font-family: var(--sans);
  font-weight: 500;
  font-size: 1rem;
  letter-spacing: 0.01em;
  background: var(--night);
  color: var(--paper);
  border: 1px solid var(--night);
  padding: 15px 26px 16px;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.btn:hover { background: var(--cedar); border-color: var(--cedar); }

.btn-cedar { background: var(--cedar); border-color: var(--cedar); color: var(--paper); }
.btn-cedar:hover { background: var(--paper); border-color: var(--paper); color: var(--night); }

/* ---------- Folio line + masthead ---------- */

.folio {
  border-bottom: 1px solid var(--hair);
  font-size: 0.93rem;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.07em;
  color: var(--slate);
}
.folio .wrap {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-block: 7px 8px;
}
.folio a { text-decoration: none; color: var(--night); font-variant-numeric: tabular-nums; }
.folio a:hover { color: var(--cedar); }
.folio .mid { display: none; }
@media (min-width: 880px) { .folio .mid { display: block; } }

.masthead {
  border-bottom: 1px solid var(--night);
  background: var(--paper);
  position: relative;
  z-index: 20;
}
.masthead .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 84px;
}

.wm {
  display: inline-flex;
  align-items: baseline;
  gap: 0.28em;
  text-decoration: none;
  color: var(--night);
  white-space: nowrap;
}
.wm-sell {
  font-family: var(--sans);
  font-weight: 600;
  font-size: 0.98rem;
  letter-spacing: 0.24em;
}
.wm-num {
  font-family: var(--serif);
  font-size: 3.05rem;
  line-height: 0.7;
  letter-spacing: -0.01em;
  color: var(--cedar);
  font-variant-numeric: lining-nums;
}
.wm:hover .wm-num { color: var(--night); }

.menu-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font: 500 0.98rem/1 var(--sans);
  color: var(--night);
  background: none;
  border: 1px solid var(--night);
  padding: 11px 14px;
  cursor: pointer;
}
.menu-btn .bars {
  width: 16px;
  height: 9px;
  border-top: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  position: relative;
}
.menu-btn[aria-expanded="true"] .bars { border-bottom-color: transparent; }

.site-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (max-width: 879.98px) {
  .site-nav {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    background: var(--paper);
    border-top: 1px solid var(--night);
    border-bottom: 1px solid var(--night);
    padding: 8px var(--gut) 28px;
  }
  .masthead.is-open .site-nav { display: block; }
  .site-nav li { border-bottom: 1px solid var(--hair); }
  .site-nav a {
    display: block;
    padding: 14px 0 12px;
    font-family: var(--serif);
    font-size: 2rem;
    line-height: 1.05;
    text-decoration: none;
  }
  .site-nav a[aria-current="page"] { color: var(--cedar); font-style: italic; }
  .site-nav .nav-phone {
    display: block;
    margin-top: 20px;
    font-family: var(--sans);
    font-size: 1.05rem;
    font-variant-numeric: tabular-nums;
  }
}

@media (min-width: 880px) {
  .menu-btn { display: none; }
  .site-nav ul { display: flex; gap: clamp(18px, 2.2vw, 34px); }
  .site-nav a {
    text-decoration: none;
    font-weight: 500;
    font-size: 0.97rem;
    padding: 6px 0;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease, color 0.2s ease;
  }
  .site-nav a:hover { border-bottom-color: var(--night); }
  .site-nav a[aria-current="page"] { color: var(--cedar); border-bottom-color: var(--cedar); }
  .site-nav .nav-phone { display: none; }
}

/* ---------- Sections and rhythm ---------- */

.sec { position: relative; }
.pad-xl { padding-block: clamp(80px, 11vw, 176px); }
.pad-l { padding-block: clamp(64px, 8vw, 128px); }
.pad-m { padding-block: clamp(48px, 5.5vw, 88px); }
.pad-s { padding-block: clamp(28px, 3vw, 44px); }
.pt-0 { padding-top: 0; }
.pb-0 { padding-bottom: 0; }

.rule-top { border-top: 1px solid var(--night); }
.wrap.rule-top {
  border-top: 0;
  background: linear-gradient(var(--night), var(--night)) no-repeat;
  background-size: calc(100% - 2 * var(--gut)) 1px;
  background-position: var(--gut) 0;
}
.rule-hair { border-top: 1px solid var(--hair); }

.band-night { background: var(--night); color: var(--paper); }
.band-night .label { color: var(--rain); }
.band-night .muted { color: var(--rain); }
.band-rain { background: var(--rain); }
.band-paper { background: var(--paper); }

.side-label { padding-top: 0.55em; margin-bottom: 18px; }
@media (min-width: 880px) { .side-label { margin-bottom: 0; } }

/* ---------- Cover (page openers) ---------- */

.cover { padding-top: clamp(44px, 6vw, 96px); padding-bottom: clamp(36px, 4vw, 56px); }
.cover .display { margin-bottom: clamp(32px, 4vw, 60px); }
.cover-row {
  border-top: 1px solid var(--night);
  padding-top: 22px;
  row-gap: 28px;
}
.crumbs {
  font-size: 0.95rem;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.07em;
  color: var(--slate);
  margin-bottom: clamp(22px, 3vw, 40px);
}
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--cedar); }
.crumbs span { color: var(--night); }

.note {
  font-size: 0.93rem;
  line-height: 1.55;
  color: var(--slate);
  border-top: 1px solid var(--cedar);
  padding-top: 12px;
}
.note strong { color: var(--night); font-weight: 600; }

/* contents list on the home cover */
.toc { list-style: none; margin: 0; padding: 0; }
.toc li { border-bottom: 1px solid var(--hair); }
.toc li:first-child { border-top: 1px solid var(--hair); }
.toc a {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 16px;
  padding: 16px 0 17px;
  text-decoration: none;
}
.toc .t {
  font-family: var(--serif);
  font-size: 1.75rem;
  line-height: 1.05;
}
.toc .d { grid-column: 1; font-size: 0.95rem; color: var(--slate); line-height: 1.45; }
.toc .a {
  grid-row: 1 / span 2;
  grid-column: 2;
  align-self: center;
  color: var(--cedar);
  font-size: 1.3rem;
  transition: transform 0.2s ease;
}
.toc a:hover .t { color: var(--cedar); }
.toc a:hover .a { transform: translateX(4px); }

/* ---------- Photography ---------- */

figure { margin: 0; }
.ph { position: relative; overflow: hidden; background: var(--rain); }
.ph img { width: 100%; height: 100%; object-fit: cover; }
.bw img { filter: grayscale(1) contrast(1.06) brightness(1.02); }
.trim img { transform: scale(1.07); transform-origin: 100% 50%; }

.bleed { width: 100%; }
.bleed .ph { aspect-ratio: 21 / 9; max-height: 86vh; }
.bleed.tall .ph { aspect-ratio: 16 / 8; }

.cap {
  font-size: 0.86rem;
  color: var(--slate);
  padding-top: 10px;
  letter-spacing: 0.01em;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.cap i { font-family: var(--serif); font-size: 1.05rem; color: var(--night); }
.band-night .cap { color: var(--rain); }

@media (max-width: 879.98px) {
  .bleed .ph { aspect-ratio: 4 / 3; }
  .bleed.keep .ph { aspect-ratio: 16 / 10; }
}

.r-3-2 { aspect-ratio: 3 / 2; }
.r-4-5 { aspect-ratio: 4 / 5; }
.r-4-3 { aspect-ratio: 4 / 3; }
.r-5-4 { aspect-ratio: 5 / 4; }
.r-16-9 { aspect-ratio: 16 / 9; }
.r-1-1 { aspect-ratio: 1 / 1; }
.r-2-1 { aspect-ratio: 2 / 1; }

/* ---------- Home: two paths ---------- */

.paths { row-gap: 48px; }
.path { position: relative; }
.path .h2 { font-size: clamp(2.1rem, 3.4vw, 3.2rem); margin-bottom: 22px; }
@media (min-width: 880px) {
  .path + .path { border-left: 1px solid var(--night); padding-left: var(--gap); margin-left: calc(var(--gap) * -1); }
  .path.x1-6 { padding-right: 16px; }
}
@media (max-width: 879.98px) {
  .path + .path { border-top: 1px solid var(--night); padding-top: 40px; }
}

/* ---------- Ledger tables ---------- */

.ledger-wrap { width: 100%; }
.ledger {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.99rem;
  line-height: 1.5;
}
.ledger caption {
  text-align: left;
  caption-side: top;
  padding-bottom: clamp(22px, 2.4vw, 36px);
}
.ledger th,
.ledger td {
  text-align: left;
  vertical-align: top;
  padding: 18px 20px 18px 0;
  border-top: 1px solid var(--hair);
}
.ledger thead th {
  border-top: 0;
  border-bottom: 1px solid var(--night);
  padding-top: 0;
  padding-bottom: 10px;
  font-weight: 500;
  font-size: 0.98rem;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.075em;
  color: var(--slate);
}
.ledger tbody th {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.45rem;
  line-height: 1.12;
  width: 24%;
}
.ledger tbody tr:last-child th,
.ledger tbody tr:last-child td { border-bottom: 1px solid var(--night); }
.ledger .zips {
  font-family: var(--serif);
  font-size: 1.45rem;
  line-height: 1.12;
  white-space: nowrap;
  font-variant-numeric: proportional-nums lining-nums;
  color: var(--cedar);
}
.ledger tbody tr { transition: background 0.2s ease; }
.ledger tbody tr:hover { background: rgba(221, 227, 230, 0.45); }

@media (max-width: 879.98px) {
  .ledger thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .ledger,
  .ledger tbody,
  .ledger tr,
  .ledger th,
  .ledger td { display: block; width: 100%; }
  .ledger tbody tr { border-top: 1px solid var(--night); padding: 18px 0 8px; }
  .ledger tbody tr:last-child { border-bottom: 1px solid var(--night); }
  .ledger tbody th,
  .ledger td { border: 0; padding: 0 0 12px; width: 100%; }
  .ledger tbody tr:last-child th,
  .ledger tbody tr:last-child td { border-bottom: 0; }
  .ledger td[data-label]::before {
    content: attr(data-label);
    display: block;
    font-weight: 500;
    font-variant-caps: all-small-caps;
    letter-spacing: 0.075em;
    color: var(--slate);
    font-family: var(--sans);
    font-size: 0.95rem;
    line-height: 1.35;
    margin-bottom: 2px;
  }
}

/* ---------- Statement ---------- */

.stmt {
  font-family: var(--serif);
  font-size: clamp(2.1rem, 4.4vw, 4.1rem);
  line-height: 1.04;
  letter-spacing: -0.012em;
  text-wrap: balance;
  margin: 0;
}
.stmt-by {
  margin-top: 26px;
  font-size: 0.95rem;
  color: var(--slate);
}
.band-night .stmt em { color: var(--rain); }

/* ---------- Zip band (home) and zip entries (neighborhoods) ---------- */

.zipband {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--night);
}
.zipband a {
  display: block;
  text-decoration: none;
  padding: 18px 0 22px;
  border-bottom: 1px solid var(--hair);
}
.zipband .z {
  display: block;
  font-family: var(--serif);
  font-size: clamp(3rem, 7.4vw, 7rem);
  line-height: 0.95;
  letter-spacing: -0.02em;
  color: var(--slate);
  opacity: 0.55;
  font-variant-numeric: lining-nums proportional-nums;
  transition: color 0.25s ease, opacity 0.25s ease;
}
.zipband .n { display: block; font-weight: 500; font-size: 0.98rem; margin-top: 6px; }
.zipband .n small { font-weight: 400; color: var(--slate); font-size: 0.9rem; font-variant-numeric: tabular-nums; }
.zipband a:hover .z { color: var(--cedar); opacity: 1; }
@media (min-width: 880px) {
  .zipband { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--gap); }
}

.hood {
  border-top: 1px solid var(--night);
  padding-block: clamp(28px, 3.4vw, 48px) clamp(44px, 5vw, 80px);
  row-gap: 24px;
}
.hood .zip-huge {
  font-family: var(--serif);
  font-size: clamp(5.8rem, 15vw, 15rem);
  line-height: 0.8;
  letter-spacing: -0.035em;
  color: #CFD3D4;
  font-variant-numeric: lining-nums proportional-nums;
  margin: 0 0 18px;
  -webkit-text-stroke: 0;
}
.hood .zip-huge > span { display: block; }
.hood .zip-huge > span + span { margin-top: 0.06em; }
.kk { letter-spacing: -0.03em; }
.hood .zip-huge.many { font-size: clamp(4.6rem, 10.4vw, 10.4rem); }
.hood h2 {
  font-family: var(--serif);
  font-size: clamp(2.2rem, 3.6vw, 3.3rem);
  line-height: 1;
  margin-bottom: 8px;
}
.hood .zips-line {
  font-size: 0.98rem;
  color: var(--cedar);
  font-variant-numeric: tabular-nums;
  margin-bottom: 18px;
  font-weight: 500;
}
.hood figure { margin-top: 8px; }

/* ---------- Split with photo ---------- */

.split { row-gap: 36px; align-items: start; }
.stick { position: static; }
@media (min-width: 880px) {
  .stick { position: sticky; top: 32px; }
}

/* ---------- Step ledger (a true sequence) ---------- */

.stages { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--night); counter-reset: none; }
.stages li {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px 24px;
  padding: 18px 0 16px;
  border-bottom: 1px solid var(--hair);
}
.stages .st {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.1;
}
@media (min-width: 700px) {
  .stages li { grid-template-columns: 13rem minmax(0, 1fr); }
}

/* ---------- FAQ ---------- */

.faq { border-top: 1px solid var(--night); }
.faq-item {
  border-bottom: 1px solid var(--hair);
  padding-block: 26px 12px;
  row-gap: 8px;
}
.faq-item h3 {
  font-family: var(--serif);
  font-size: clamp(1.5rem, 2.2vw, 1.9rem);
  line-height: 1.12;
}
.faq-item p { max-width: var(--measure); }

/* ---------- Definition list for prep ---------- */

.defs { margin: 0 0 1.4em; border-top: 1px solid var(--night); }
.defs div { padding: 16px 0 14px; border-bottom: 1px solid var(--hair); }
.defs dt { font-family: var(--serif); font-size: 1.45rem; line-height: 1.15; margin-bottom: 4px; }
.defs dd { margin: 0; }

/* ---------- About ---------- */

.portrait {
  background: var(--white);
  border: 1px solid var(--hair);
  padding: clamp(14px, 1.6vw, 22px) clamp(14px, 1.6vw, 22px) 0;
}
.portrait .ph { aspect-ratio: 4 / 5; background: var(--white); }
.portrait img { object-position: 50% 20%; }
.portrait figcaption {
  padding: 14px 0 16px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.9rem;
  color: var(--slate);
}
.portrait figcaption b { font-family: var(--serif); font-weight: 400; font-size: 1.3rem; color: var(--night); line-height: 1.1; }

.card-office {
  border-top: 1px solid var(--night);
  padding-top: 16px;
  font-size: 0.98rem;
}
.card-office p { margin-bottom: 0.4em; }
.card-office a { text-decoration: none; }
.card-office a:hover { color: var(--cedar); }

/* ---------- Contact band + forms ---------- */

.big-phone {
  display: inline-block;
  font-family: var(--serif);
  font-size: clamp(2.6rem, 5.4vw, 4.6rem);
  line-height: 1;
  letter-spacing: -0.01em;
  text-decoration: none;
  font-variant-numeric: lining-nums tabular-nums;
  margin: 10px 0 6px;
}
.big-phone:hover { color: var(--cedar); }
.band-night .big-phone:hover { color: var(--rain); }
.mail { text-decoration: none; border-bottom: 1px solid currentColor; }
.mail:hover { color: var(--cedar); }
.band-night .mail:hover { color: var(--rain); }

.form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px 24px; }
@media (min-width: 640px) {
  .form.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form .full { grid-column: 1 / -1; }
}
.field label,
.field legend {
  display: block;
  font-size: 0.98rem;
  font-weight: 500;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.075em;
  color: var(--slate);
  margin-bottom: 4px;
  padding: 0;
}
.field .opt { font-weight: 400; letter-spacing: 0.04em; }
.field input,
.field select,
.field textarea {
  width: 100%;
  font: 400 1.08rem/1.4 var(--sans);
  color: var(--night);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--night);
  border-radius: 0;
  padding: 10px 0 9px;
  -webkit-appearance: none;
  appearance: none;
}
.field select {
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 12px) 55%, calc(100% - 7px) 55%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 28px;
}
.field textarea { min-height: 110px; resize: vertical; }
.field input:focus,
.field select:focus,
.field textarea:focus { outline: none; border-bottom: 2px solid var(--cedar); padding-bottom: 8px; }
.field input:focus-visible,
.field select:focus-visible,
.field textarea:focus-visible { outline: 2px solid var(--cedar); outline-offset: 4px; }
.field.bad input,
.field.bad select { border-bottom-color: var(--cedar); }
.field .err { display: block; min-height: 0; font-size: 0.88rem; color: var(--cedar); margin-top: 4px; }

fieldset.field { border: 0; margin: 0; padding: 0; min-width: 0; }
.choices { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.choices label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-variant-caps: normal;
  letter-spacing: 0;
  font-size: 1rem;
  color: var(--night);
  border: 1px solid var(--hair);
  padding: 9px 14px;
  margin: 0;
  cursor: pointer;
}
.choices input {
  width: 14px;
  height: 14px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--night);
  border-radius: 50%;
  -webkit-appearance: none;
  appearance: none;
  flex: none;
}
.choices input:checked { background: var(--cedar); border-color: var(--cedar); box-shadow: inset 0 0 0 3px var(--paper); }
.choices label:has(input:checked) { border-color: var(--night); }

.form-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.form-foot small { color: var(--slate); font-size: 0.9rem; }
.form-msg { font-size: 0.93rem; color: var(--cedar); min-height: 1.2em; margin: 0; }

.band-night .field label,
.band-night .field legend { color: var(--rain); }
.band-night .field input,
.band-night .field select,
.band-night .field textarea { color: var(--paper); border-bottom-color: rgba(221, 227, 230, 0.6); }
.band-night .field select option { color: var(--night); }
.band-night .field input:focus,
.band-night .field textarea:focus { border-bottom-color: var(--rain); }
.band-night .field .err,
.band-night .form-msg { color: #E8B79C; }
.band-night .form-foot small { color: var(--rain); }

.thanks {
  border-top: 1px solid var(--cedar);
  padding-top: 18px;
}
.thanks h3 { font-family: var(--serif); font-size: clamp(2rem, 3vw, 2.7rem); line-height: 1.05; margin-bottom: 12px; }
.thanks a { text-decoration: none; border-bottom: 1px solid currentColor; font-variant-numeric: tabular-nums; }

/* ---------- Footer ---------- */

.site-foot {
  background: var(--night);
  color: var(--paper);
  padding-top: clamp(40px, 4vw, 64px);
  font-size: 0.95rem;
}
.site-foot .wm { color: var(--paper); }
.site-foot .wm-num { color: var(--rain); }
.site-foot .foot-top { row-gap: 36px; padding-bottom: 48px; }
.site-foot .foot-top { border-top: 1px solid rgba(221, 227, 230, 0.2); padding-top: 44px; }
.site-foot h2 {
  font-family: var(--sans);
  font-size: 0.98rem;
  font-weight: 500;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.08em;
  color: var(--rain);
  margin-bottom: 12px;
}
.site-foot ul { list-style: none; margin: 0; padding: 0; }
.site-foot li { margin-bottom: 6px; }
.site-foot a { text-decoration: none; }
.site-foot a:hover { color: var(--rain); text-decoration: underline; text-underline-offset: 3px; }
.site-foot .blurb { max-width: 30ch; color: var(--rain); margin-top: 16px; }
.site-foot .legal {
  border-top: 1px solid rgba(221, 227, 230, 0.28);
  padding-block: 22px 34px;
  font-size: 0.84rem;
  line-height: 1.6;
  color: var(--rain);
}
.site-foot .legal p { margin-bottom: 0.45em; max-width: 110ch; }
.site-foot .legal .primary { color: var(--paper); font-variant-numeric: tabular-nums; }
.site-foot .legal a { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Motion ---------- */

@media (prefers-reduced-motion: no-preference) {
  .cover .display,
  .cover .crumbs { animation: rise 0.9s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
  .cover .cover-row { animation: rise 0.9s 0.12s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
  @keyframes rise {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: none; }
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ---------- Small screens ---------- */

@media (max-width: 879.98px) {
  body { font-size: 17px; }
  :root { --gap: 16px; }
  .wm-num { font-size: 2.6rem; }
  .wm-sell { font-size: 0.9rem; letter-spacing: 0.2em; }
  .masthead .wrap { min-height: 72px; }
  .mt-m { margin-top: 28px; }
}

.display.xl { font-size: clamp(3.3rem, 11.2vw, 11.6rem); line-height: 0.86; }
.late { align-self: start; margin-top: 28px; }
@media (min-width: 880px) { .late { margin-top: 150px; } }
.cap span { white-space: nowrap; }
@media (max-width: 879.98px) {
  .ledger caption { display: block; width: 100%; }
  .cap span { display: none; }
}

/* QA pass: lead photos run edge to edge on phones */
@media (max-width: 879.98px) {
  .lead-fig .ph { aspect-ratio: 4 / 3; margin-inline: calc(var(--gut) * -1); }
}
@media (max-width: 879.98px) {
  .cover-row .side-label { margin-bottom: -6px; }
}
@media (min-width: 880px) {
  .sq-desk { aspect-ratio: 1 / 1; }
}

/* ---------- Margin headings (replace the old side labels) ---------- */

@media (min-width: 880px) {
  .x5-8 { grid-column: 5 / 9; }
  .x5-10 { grid-column: 5 / 11; }
  .x5-11 { grid-column: 5 / 12; }
}
.side-head {
  font-size: clamp(2.1rem, 3.3vw, 3.15rem);
  line-height: 1;
  margin-bottom: 26px;
  hanging-punctuation: first;
}
@media (min-width: 880px) {
  .side-head { position: sticky; top: 28px; align-self: start; margin-bottom: 0; padding-right: 12px; }
}

/* ---------- Home cover ---------- */

.cover-home { padding-bottom: 0; }
.cover-aside {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.4rem, 1.9vw, 1.8rem);
  line-height: 1.18;
  color: var(--slate);
  margin: 0;
  max-width: 26ch;
  align-self: start;
  padding-top: 4px;
}

/* ---------- The index: the spine of the home page ---------- */

.ix-sec { padding-top: clamp(64px, 8vw, 128px); padding-bottom: clamp(48px, 6vw, 88px); }
.ix-top { row-gap: 14px; align-items: end; margin-bottom: clamp(30px, 3.6vw, 56px); }
.ix-top .h2 { font-size: clamp(2.5rem, 5vw, 4.7rem); }
.ix-label { margin: 0; align-self: start; padding-top: 0.7em; }
.ix-fine { margin: 0; font-size: 0.92rem; line-height: 1.5; color: var(--slate); max-width: 34ch; }

.ix-head {
  border-bottom: 1px solid var(--night);
  padding-bottom: 9px;
  font-size: 0.98rem;
  font-weight: 500;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.075em;
  color: var(--slate);
  line-height: 1.3;
}
.ix { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--night); }
.ix-row {
  position: relative;
  align-items: end;
  row-gap: 6px;
  padding-block: clamp(10px, 1.2vw, 18px) clamp(16px, 1.7vw, 26px);
}
.ix-row + .ix-row { border-top: 1px solid var(--hair); }
.ix-zip { display: flex; align-items: flex-start; gap: 0.9rem; }
.ix-zip .big {
  font-family: var(--serif);
  font-size: clamp(5.6rem, 12.6vw, 12.2rem);
  line-height: 0.8;
  letter-spacing: -0.035em;
  color: #C6CDD1;
  font-variant-numeric: lining-nums proportional-nums;
  transition: color 0.3s ease;
}
.ix-zip .more {
  font-family: var(--serif);
  font-size: clamp(1.25rem, 1.7vw, 1.6rem);
  line-height: 1.08;
  color: var(--slate);
  padding-top: 0.25em;
  font-variant-numeric: lining-nums proportional-nums;
}
.ix-name a {
  display: block;
  font-family: var(--serif);
  font-size: clamp(2rem, 2.7vw, 2.65rem);
  line-height: 1;
  text-decoration: none;
  transition: color 0.2s ease;
}
.ix-name a::after { content: ""; position: absolute; inset: 0; }
.ix-name a:focus-visible { outline: none; }
.ix-row:has(a:focus-visible) { outline: 2px solid var(--cedar); outline-offset: 2px; }
.ix-codes {
  display: block;
  margin-top: 9px;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--cedar);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}
.ix-note { font-size: 0.98rem; line-height: 1.5; max-width: 40ch; padding-bottom: 3px; text-wrap: pretty; }
.ix-row:hover .big { color: var(--cedar); }
.ix-row:hover .ix-name a { color: var(--cedar); }

.one-line {
  margin: 0;
  padding: 22px 0 0;
  font-size: 1.05rem;
  line-height: 1.55;
}
.one-line a:not(.link) {
  text-decoration-color: var(--cedar);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.one-line a:not(.link):hover { color: var(--cedar); }
.one-line .link { white-space: nowrap; }

@media (max-width: 879.98px) {
  .ix-head { display: none; }
  .ix { border-top: 1px solid var(--night); }
  .ix-row { align-items: start; padding-block: 16px 22px; }
  .ix-label { padding-top: 0; }
  .ix-name a { font-size: 2rem; }
  .ix-note { margin-top: 4px; }
}

/* ---------- Reply card (every lead page) ---------- */

.reply { padding-block: clamp(72px, 9vw, 144px) clamp(56px, 6vw, 96px); }
.reply-top { row-gap: 18px; align-items: end; margin-bottom: clamp(30px, 3.6vw, 52px); }
.reply .h2 { font-size: clamp(2.4rem, 4.5vw, 4.3rem); }
.reply-dek { margin: 0; color: var(--slate); max-width: 38ch; }
.rc-row { border-top: 3px solid var(--night); border-bottom: 1px solid var(--night); }
.rc-cell { position: relative; padding: 16px 0 14px; }
.rc-cell label { margin-bottom: 2px; }
.rc-row .field input {
  border: 0;
  padding: 6px 0 4px;
  font-size: clamp(1.15rem, 1.5vw, 1.4rem);
}
.rc-row .field input:focus { border: 0; padding-bottom: 4px; }
.rc-row .field .err { margin-top: 2px; }
.rc-go { display: flex; }
.rc-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 64px;
  margin: 0;
  padding: 0 22px 0 24px;
  font: 500 1.02rem/1.2 var(--sans);
  letter-spacing: 0.01em;
  color: var(--paper);
  background: var(--night);
  border: 0;
  border-radius: 0;
  cursor: pointer;
  text-align: left;
  transition: background 0.2s ease;
}
.rc-btn .arr { font-size: 1.2rem; transition: transform 0.2s ease; }
.rc-btn:hover { background: var(--cedar); }
.rc-btn:hover .arr { transform: translateX(4px); }
.reply .form-msg { margin-top: 10px; }
.reply-fine { margin: 14px 0 0; font-size: 0.93rem; color: var(--slate); }
.reply-fine a { color: var(--night); text-decoration-color: var(--cedar); text-underline-offset: 3px; font-variant-numeric: tabular-nums; }
.reply-fine a:hover { color: var(--cedar); }
.reply .thanks { border-top: 3px solid var(--night); padding-top: 22px; }

@media (min-width: 880px) {
  .rc-cell + .rc-cell::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(var(--gap) / -2);
    border-left: 1px solid var(--hair);
  }
  .rc-go { margin-right: 0; }
}
@media (max-width: 879.98px) {
  .rc-cell + .rc-cell { border-top: 1px solid var(--hair); }
  .rc-go { padding: 0 0 0; }
  .rc-btn { min-height: 58px; }
}

/* ---------- Cash offer: comparison ---------- */

.cmp-dek { margin: 0; align-self: end; max-width: 36ch; }
.cmp-foot { margin: 26px 0 0; }
.contact-form-rule { border-top: 3px solid var(--night); padding-top: 22px; }
.nw { white-space: nowrap; }
.sec:not(.band-night):not(.band-rain):not(.pb-0) + .reply { padding-top: clamp(24px, 3vw, 48px); }

/* Blog */

/* Extra span helpers used only by the blog */
@media (min-width: 880px) {
  .x1-2 { grid-column: 1 / 3; }
  .x3-8 { grid-column: 3 / 9; }
  .x5-9 { grid-column: 5 / 10; }
  .x6-10 { grid-column: 6 / 11; }
}

/* Masthead: room for the Dispatches item */
@media (min-width: 880px) {
  .site-nav a { white-space: nowrap; }
  .site-nav a[aria-current="true"] { color: var(--cedar); border-bottom-color: var(--cedar); }
}
@media (min-width: 880px) and (max-width: 1119.98px) {
  .masthead .wrap { gap: 18px; }
  .site-nav ul { gap: 16px; }
  .site-nav a { font-size: 0.92rem; }
}
@media (max-width: 879.98px) {
  .site-nav a[aria-current="true"] { color: var(--cedar); font-style: italic; }
}

/* Shared bits */
.bl-meta {
  margin: 0;
  font-size: 0.9rem;
  color: var(--slate);
  font-variant-numeric: tabular-nums lining-nums;
}
.bl-go {
  display: inline-block;
  margin-top: 16px;
  font-weight: 500;
  font-size: 0.98rem;
  background-image: linear-gradient(var(--cedar), var(--cedar));
  background-size: 100% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  padding-bottom: 2px;
}
.bl-go .arr { display: inline-block; transition: transform 0.2s ease; }
.ph img { transition: filter 0.35s ease; }

/* Blog index: the lead dispatch */
.bl-lead { position: relative; padding-bottom: clamp(56px, 7vw, 104px); }
.bl-lead .ph { aspect-ratio: 21 / 9; max-height: 80vh; }
.bl-lead-row { padding-top: 22px; row-gap: 18px; align-items: start; }
.bl-lead-title {
  font-family: var(--serif);
  font-size: clamp(2.5rem, 5.2vw, 5rem);
  line-height: 0.95;
  letter-spacing: -0.014em;
  text-wrap: balance;
}
.bl-lead-title a { text-decoration: none; transition: color 0.2s ease; }
.bl-lead-title a::after { content: ""; position: absolute; inset: 0; }
.bl-lead-title a:focus-visible { outline: none; }
.bl-lead:has(a:focus-visible) { outline: 2px solid var(--cedar); outline-offset: 6px; }
.bl-lead-dek { margin: 0 0 14px; max-width: 42ch; text-wrap: pretty; }
.bl-lead:hover .bl-lead-title a { color: var(--cedar); }
.bl-lead:hover .bl-go .arr { transform: translateX(3px); }
@media (max-width: 879.98px) {
  .bl-lead .ph { aspect-ratio: 4 / 3; margin-inline: calc(var(--gut) * -1); }
}

/* Blog index: the rest, set as an index */
.bl-ix-sec { padding-top: clamp(24px, 3vw, 40px); padding-bottom: clamp(56px, 7vw, 112px); }
.bl-ix { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--night); border-bottom: 1px solid var(--night); }
.bl-row { position: relative; row-gap: 14px; align-items: start; padding-block: clamp(18px, 2vw, 28px); }
.bl-row + .bl-row { border-top: 1px solid var(--hair); }
.bl-row .ph { aspect-ratio: 3 / 2; }
.bl-row h3 {
  font-family: var(--serif);
  font-size: clamp(1.9rem, 2.8vw, 2.75rem);
  line-height: 1.02;
  letter-spacing: -0.008em;
  text-wrap: balance;
  margin: 0 0 12px;
}
.bl-row h3 a { text-decoration: none; transition: color 0.2s ease; }
.bl-row h3 a::after { content: ""; position: absolute; inset: 0; }
.bl-row h3 a:focus-visible { outline: none; }
.bl-row:has(a:focus-visible) { outline: 2px solid var(--cedar); outline-offset: 2px; }
.bl-row .dek { margin: 0; font-size: 0.98rem; line-height: 1.52; max-width: 46ch; text-wrap: pretty; }
.bl-read {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.3rem, 1.6vw, 1.55rem);
  line-height: 1.1;
  color: var(--slate);
  font-variant-numeric: lining-nums;
}
.bl-row:hover h3 a { color: var(--cedar); }
.bl-row:hover .bw img,
.post:hover .bw img { filter: none; }
@media (min-width: 880px) {
  .bl-row { align-items: stretch; }
  .bl-row .bl-txt { padding-top: 4px; }
  .bl-read { justify-self: end; text-align: right; padding-top: 10px; }
}
@media (max-width: 879.98px) {
  .bl-row { padding-block: 22px 26px; }
  .bl-row h3 { font-size: 2rem; }
}

/* Article: cover */
.art-h1 { font-size: clamp(2.7rem, 6vw, 6.1rem); line-height: 0.93; max-width: 19ch; }
.art-cover .cover-row { row-gap: 24px; }
.art-label { margin: 0; padding-top: 0.45em; }
.art-answer {
  margin: 0;
  max-width: 44ch;
  font-size: clamp(1.2rem, 1.6vw, 1.46rem);
  line-height: 1.48;
  text-wrap: pretty;
}
.byline {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  align-self: start;
  border-top: 1px solid var(--cedar);
  padding-top: 14px;
  font-size: 0.93rem;
  line-height: 1.45;
}
.byline-ph {
  width: 60px;
  height: 75px;
  flex: none;
  object-fit: cover;
  object-position: 50% 20%;
  background: var(--white);
  border: 1px solid var(--hair);
}
.byline p { margin: 0; }
.byline .by { display: block; font-weight: 500; }
.byline .when { display: block; margin-top: 5px; color: var(--slate); font-variant-numeric: tabular-nums lining-nums; }

/* Article: photograph */
.art-fig .ph { aspect-ratio: 2 / 1; max-height: 82vh; }
@media (max-width: 879.98px) {
  .art-fig .ph { aspect-ratio: 4 / 3; margin-inline: calc(var(--gut) * -1); }
}

/* Article: body */
.art-main { padding-block: clamp(56px, 7vw, 112px) clamp(56px, 7vw, 104px); }
.art-toc { display: none; }
@media (min-width: 880px) {
  .art-toc { display: block; position: sticky; top: 28px; align-self: start; padding-right: 8px; }
}
.art-toc .label { margin: 0 0 10px; }
.art-toc ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--night); }
.art-toc li { border-bottom: 1px solid var(--hair); }
.art-toc a {
  display: block;
  padding: 9px 0 10px;
  font-size: 0.9rem;
  line-height: 1.38;
  color: var(--slate);
  text-decoration: none;
  transition: color 0.2s ease;
}
.art-toc a:hover { color: var(--cedar); }

.art-body > :first-child { margin-top: 0; }
.art-body h2 {
  font-family: var(--serif);
  font-size: clamp(1.95rem, 2.7vw, 2.6rem);
  line-height: 1.03;
  letter-spacing: -0.01em;
  text-wrap: balance;
  margin: 1.55em 0 0.55em;
  padding-top: 16px;
  border-top: 1px solid var(--night);
  scroll-margin-top: 24px;
}
.art-body h3 {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.5rem, 2vw, 1.8rem);
  line-height: 1.12;
  margin: 1.4em 0 0.35em;
}
.art-body ol {
  list-style: none;
  counter-reset: step;
  margin: 0 0 1.3em;
  padding: 0;
  border-top: 1px solid var(--hair);
}
.art-body ol li {
  counter-increment: step;
  position: relative;
  padding: 0.85em 0 0.85em 2.1em;
  border-bottom: 1px solid var(--hair);
  text-wrap: pretty;
}
.art-body ol li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: 0.62em;
  font-family: var(--serif);
  font-size: 1.6rem;
  line-height: 1;
  color: var(--cedar);
  font-variant-numeric: lining-nums;
}
.art-body .table-wrap { margin: 1.7em 0 1.5em; }
.art-body table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.95rem;
  line-height: 1.48;
  border-bottom: 1px solid var(--night);
}
.art-body th,
.art-body td {
  text-align: left;
  vertical-align: top;
  padding: 14px 18px 14px 0;
  border-top: 1px solid var(--hair);
}
.art-body th:last-child,
.art-body td:last-child { padding-right: 0; }
.art-body thead th {
  border-top: 0;
  border-bottom: 1px solid var(--night);
  padding-top: 0;
  padding-bottom: 9px;
  font-weight: 500;
  font-size: 0.95rem;
  font-variant-caps: all-small-caps;
  letter-spacing: 0.075em;
  color: var(--slate);
  line-height: 1.3;
}
.art-body tbody td:first-child {
  font-family: var(--serif);
  font-size: 1.28rem;
  line-height: 1.15;
  width: 28%;
}
@media (max-width: 879.98px) {
  .art-body thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .art-body table,
  .art-body tbody,
  .art-body tr,
  .art-body td { display: block; width: 100%; }
  .art-body table { border-bottom: 0; }
  .art-body tbody tr { border-top: 1px solid var(--night); padding: 16px 0 6px; }
  .art-body tbody tr:last-child { border-bottom: 1px solid var(--night); }
  .art-body td { border: 0; padding: 0 0 10px; }
  .art-body tbody td:first-child { width: 100%; font-size: 1.45rem; }
  .art-body td[data-label]:not(:first-child)::before {
    content: attr(data-label);
    display: block;
    font-weight: 500;
    font-size: 0.93rem;
    font-variant-caps: all-small-caps;
    letter-spacing: 0.075em;
    color: var(--slate);
    line-height: 1.35;
    margin-bottom: 2px;
  }
}

/* Article: questions */
.art-faq { padding-bottom: clamp(64px, 8vw, 120px); }
.art-faq-top { margin-bottom: clamp(26px, 3.2vw, 44px); }

/* Article: the call */
.art-close .wrap { row-gap: 40px; align-items: end; }
.close-text {
  font-family: var(--serif);
  font-size: clamp(1.7rem, 2.6vw, 2.4rem);
  line-height: 1.18;
  letter-spacing: -0.006em;
  max-width: 34ch;
  margin: 0;
  text-wrap: pretty;
}
.close-call { border-top: 1px solid rgba(221, 227, 230, 0.35); padding-top: 16px; }
.close-call .label { margin: 0; }
.close-call .big-phone { margin: 8px 0 10px; font-size: clamp(2.4rem, 3.5vw, 3.5rem); white-space: nowrap; }
.close-call p { margin: 0 0 22px; font-size: 0.95rem; }

/* Related dispatches */
.more { padding-block: clamp(64px, 8vw, 128px) clamp(56px, 6vw, 96px); }
.more-top { row-gap: 12px; align-items: end; margin-bottom: clamp(24px, 3vw, 40px); }
.more-top .h2 { font-size: clamp(2.3rem, 4vw, 3.8rem); }
.more-all { margin: 0; }
.more-grid { border-top: 1px solid var(--night); padding-top: 24px; row-gap: 40px; }
.post { position: relative; }
.post .ph { aspect-ratio: 3 / 2; margin-bottom: 18px; }
.post h3 {
  font-family: var(--serif);
  font-size: clamp(1.8rem, 2.4vw, 2.3rem);
  line-height: 1.04;
  text-wrap: balance;
  margin-bottom: 10px;
}
.post h3 a { text-decoration: none; transition: color 0.2s ease; }
.post h3 a::after { content: ""; position: absolute; inset: 0; }
.post h3 a:focus-visible { outline: none; }
.post:has(a:focus-visible) { outline: 2px solid var(--cedar); outline-offset: 4px; }
.post:hover h3 a { color: var(--cedar); }
.post .dek { font-size: 0.98rem; line-height: 1.52; max-width: 46ch; margin-bottom: 10px; }
@media (min-width: 880px) {
  .more-all { justify-self: end; text-align: right; }
  .more-grid { column-gap: calc(var(--gap) * 2.5); }
  .post + .post::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(var(--gap) * -1.25); border-left: 1px solid var(--hair); }
  .post h3 { max-width: 27ch; }
}
@media (max-width: 879.98px) {
  .post + .post { border-top: 1px solid var(--hair); padding-top: 32px; }
}

/* Art direction pass: lead dispatch head */
.bl-lead-head .bl-lead-title { margin-bottom: 22px; }
.bl-lead-head .bl-meta { margin: 0 0 8px; }
.bl-lead-dek { margin: 0; }
@media (min-width: 880px) {
  .bl-lead-dek { font-size: 1.06rem; line-height: 1.58; padding-top: 0.5em; }
}
@media (max-width: 879.98px) {
  .bl-lead-head { display: contents; }
  .bl-lead-head .bl-lead-title { order: 0; margin-bottom: 0; }
  .bl-lead-dekcol { order: 1; }
  .bl-lead-head .bl-meta { order: 2; margin: 0; }
  .bl-lead-head .bl-go { order: 3; margin-top: -8px; justify-self: start; }
}
/* Instrument Serif sets its hyphen with wide sidebearings; tighten it in headings */
.hy { margin-inline: -0.05em; }