/* Sell Now 253: industrial broadsheet */
:root {
  --oxide: #8C3B2A;
  --oxide-deep: #6f2e20;
  --steel: #2E3338;
  --teal: #3E8E8B;
  --concrete: #E7E4DE;
  --newsprint: #F3F0E8;
  --ink: #2E3338;
  --ink-soft: rgba(46, 51, 56, .78);
  --hair: rgba(46, 51, 56, .32);
  --hair-light: rgba(243, 240, 232, .22);
  --display: "Familjen Grotesk", "Helvetica Neue", Arial, sans-serif;
  --body: "Literata", Georgia, "Times New Roman", serif;
  --gutter: clamp(20px, 4vw, 48px);
  --max: 1240px;
}

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

html {
  background: var(--newsprint);
  color: var(--ink);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  hanging-punctuation: first allow-end;
}

body {
  margin: 0;
  background: var(--newsprint);
  color: var(--ink);
  font-family: var(--body);
  font-size: 1.0625rem;
  line-height: 1.62;
  font-optical-sizing: auto;
  font-variant-numeric: oldstyle-nums proportional-nums;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}

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

a { color: inherit; text-decoration-color: var(--oxide); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--teal); text-decoration-color: var(--teal); }
:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }

h1, h2, h3, h4 {
  font-family: var(--display);
  font-weight: 700;
  line-height: 1.04;
  letter-spacing: -.018em;
  margin: 0;
  color: var(--steel);
  text-wrap: balance;
}
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

.wrap { max-width: var(--max); margin-left: auto; margin-right: auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.wide { max-width: 1600px; margin-left: auto; margin-right: auto; padding-left: var(--gutter); padding-right: var(--gutter); }

.skip { position: absolute; left: -9999px; top: 0; background: var(--steel); color: var(--newsprint); padding: .6rem 1rem; z-index: 50; }
.skip:focus { left: 1rem; top: 1rem; }

.num, .tel { font-variant-numeric: lining-nums tabular-nums; }
.sc { font-variant-caps: all-small-caps; letter-spacing: .05em; }

/* ---------- Masthead ---------- */
.masthead { background: var(--newsprint); }
.strap {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  font-size: .8rem; line-height: 1.3; padding-top: .7rem; padding-bottom: .7rem;
  font-variant-caps: all-small-caps; letter-spacing: .07em; color: var(--ink-soft);
}
.strap a { text-decoration: none; }
.strap a:hover { color: var(--oxide); }
.strap-mid { font-style: italic; font-variant-caps: normal; letter-spacing: 0; }

.mast {
  border-top: 10px solid var(--oxide);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.5rem;
  padding-top: 1.1rem; padding-bottom: 1rem;
}
.ear { font-size: .82rem; line-height: 1.35; color: var(--ink-soft); max-width: 15rem; }
.ear strong { display: block; font-family: var(--display); font-weight: 700; font-size: 1.05rem; color: var(--steel); letter-spacing: 0; }
.ear-right { justify-self: end; text-align: right; }
.ear a { text-decoration: none; }
.ear a:hover strong { color: var(--oxide); }

.wordmark {
  font-family: var(--display); font-weight: 700;
  font-size: clamp(2.35rem, 7.2vw, 6.2rem);
  line-height: .86; letter-spacing: -.04em;
  color: var(--steel); text-decoration: none; white-space: nowrap;
  display: inline-block; padding-bottom: .06em;
}
.wordmark span { color: var(--oxide); }
.wordmark:hover { color: var(--steel); }

.menu-btn {
  display: none;
  font: 600 .95rem/1 var(--display); letter-spacing: .01em;
  color: var(--steel); background: transparent;
  border: 1px solid var(--steel); border-radius: 0;
  padding: .7rem .95rem; cursor: pointer;
}
.menu-btn .bars { display: inline-block; width: 16px; height: 10px; margin-left: .5rem; vertical-align: -1px;
  border-top: 2px solid currentColor; border-bottom: 2px solid currentColor; position: relative; }
.menu-btn .bars::after { content: ""; position: absolute; left: 0; right: 0; top: 2px; border-top: 2px solid currentColor; }
.menu-btn[aria-expanded="true"] { background: var(--steel); color: var(--newsprint); }

.sections { border-top: 1px solid var(--steel); border-bottom: 4px double var(--steel); }
.sections ul { list-style: none; margin: 0 auto; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; }
.sections li + li { border-left: 1px solid var(--hair); }
.sections a {
  display: block; padding: .8rem 1.35rem .72rem;
  font: 600 .96rem/1 var(--display); letter-spacing: .005em;
  text-decoration: none; color: var(--steel);
  box-shadow: inset 0 0 0 var(--oxide); transition: color .15s ease;
}
.sections a:hover { color: var(--oxide); }
.sections a[aria-current="page"] { color: var(--oxide); box-shadow: inset 0 -3px 0 var(--oxide); }

/* ---------- Page heads ---------- */
.page-head { padding-top: clamp(2.5rem, 5vw, 4.5rem); padding-bottom: clamp(1.8rem, 3vw, 2.6rem); }
.page-head h1 { font-size: clamp(2.4rem, 5.6vw, 5rem); max-width: 17ch; line-height: .98; letter-spacing: -.03em; }
.deck { font-style: italic; font-size: clamp(1.15rem, 1.7vw, 1.45rem); line-height: 1.45; color: var(--ink-soft); max-width: 44ch; margin-top: 1.1rem; }
.byline { margin-top: 1.3rem; padding-top: .7rem; border-top: 1px solid var(--hair); font-size: .88rem; font-variant-caps: all-small-caps; letter-spacing: .06em; color: var(--ink-soft); max-width: 44rem; }

/* ---------- Figures ---------- */
figure { margin: 0; }
figure img { border: 1px solid var(--steel); width: 100%; object-fit: cover; background: var(--concrete); }
figcaption {
  margin-top: .55rem; font-size: .84rem; line-height: 1.4; color: var(--ink-soft);
  font-variant-caps: all-small-caps; letter-spacing: .06em;
}
.fig-hero img { aspect-ratio: 21 / 9; object-position: 50% 45%; }
.fig-band { margin-top: clamp(3rem, 7vw, 6rem); }
.fig-band img { aspect-ratio: 21 / 8; object-position: 50% 58%; border-left: 0; border-right: 0; }
.fig-band figcaption { max-width: var(--max); margin-left: auto; margin-right: auto; padding: 0 var(--gutter); }

/* ---------- Text columns ---------- */
.cols { columns: 2 21rem; column-gap: 3.2rem; column-rule: 1px solid var(--hair); }
.cols.three { columns: 3 17rem; column-gap: 2.6rem; }
.cols p { break-inside: auto; orphans: 3; widows: 3; }
.cols h3 { break-after: avoid; margin: 1.4rem 0 .45rem; font-size: 1.15rem; letter-spacing: -.005em; }
.cols h3:first-child { margin-top: 0; }
@media (min-width: 900px) {
  .cols p, .justify p { text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
}
.dropcap::first-letter {
  initial-letter: 3; -webkit-initial-letter: 3;
  font-family: var(--display); font-weight: 700; color: var(--oxide);
  margin-right: .12em;
}

.story { padding-top: clamp(3rem, 6vw, 5rem); }
.story > h2, .story-head h2 { font-size: clamp(1.75rem, 3vw, 2.7rem); max-width: 24ch; margin-bottom: 1rem; }
.answer { font-size: clamp(1.14rem, 1.5vw, 1.3rem); line-height: 1.5; max-width: 50ch; margin-bottom: 1.8rem; }
.rule-top { border-top: 1px solid var(--steel); padding-top: 1.4rem; }
.measure { max-width: 64ch; }

/* ---------- Pull quote ---------- */
.pull {
  margin: 0; padding: 1.3rem 0 1.4rem;
  border-top: 5px solid var(--oxide); border-bottom: 1px solid var(--steel);
}
.pull p {
  font-family: var(--display); font-weight: 700;
  font-size: clamp(1.6rem, 2.9vw, 2.55rem); line-height: 1.08; letter-spacing: -.02em;
  color: var(--steel); text-indent: -.42em; margin: 0;
}
.pull cite { display: block; margin-top: .9rem; font-style: normal; font-size: .85rem; font-variant-caps: all-small-caps; letter-spacing: .06em; color: var(--ink-soft); }
.pull.wide-quote { max-width: 30ch; }

/* ---------- Buttons & links ---------- */
.btn {
  display: inline-block; font: 600 1rem/1 var(--display); letter-spacing: .01em;
  background: var(--oxide); color: var(--newsprint); text-decoration: none;
  padding: 1rem 1.45rem .95rem; border: 1px solid var(--oxide); border-radius: 0;
  cursor: pointer; transition: background-color .15s ease, border-color .15s ease;
}
.btn:hover { background: var(--steel); border-color: var(--steel); color: var(--newsprint); }
.more { font-family: var(--display); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--oxide); padding-bottom: .1em; }
.more::after { content: "\2009\2192"; }
.more:hover { color: var(--oxide); border-color: var(--teal); }

/* ---------- Bands, big phone ---------- */
.band { background: var(--concrete); border-top: 1px solid var(--steel); border-bottom: 1px solid var(--steel); margin-top: clamp(3.5rem, 7vw, 6rem); padding: clamp(3rem, 6vw, 5.2rem) 0; }
.band h2 { font-size: clamp(1.8rem, 3vw, 2.7rem); margin-bottom: .8rem; }
.band .answer { margin-bottom: 2rem; }
.big-tel { display: block; font: 700 clamp(2.2rem, 4.6vw, 3.9rem)/1 var(--display); letter-spacing: -.03em; color: var(--oxide); text-decoration: none; margin: 1.4rem 0 .5rem; font-variant-numeric: lining-nums tabular-nums; }
.big-tel:hover { color: var(--steel); }
.contact-lines { font-size: .98rem; line-height: 1.6; }
.contact-lines a { word-break: break-word; }

/* ---------- Forms ---------- */
.lead-form { border: 1px solid var(--steel); border-top: 6px solid var(--oxide); background: var(--newsprint); padding: clamp(1.4rem, 3vw, 2.2rem); }
.lead-form h3, .form-title { font-size: 1.35rem; margin-bottom: .3rem; }
.form-intro { font-size: .95rem; color: var(--ink-soft); margin-bottom: 1.3rem; }
.field { margin-bottom: 1.05rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.2rem; }
label { display: block; font: 600 .9rem/1.3 var(--display); color: var(--steel); margin-bottom: .35rem; }
label .opt { font-family: var(--body); font-weight: 400; font-style: italic; color: var(--ink-soft); font-size: .85rem; }
input, select, textarea {
  width: 100%; font: 400 1rem/1.4 var(--body); color: var(--ink);
  background: #fbfaf6; border: 1px solid var(--hair); border-bottom: 2px solid var(--steel); border-radius: 0;
  padding: .7rem .75rem; appearance: none; -webkit-appearance: none;
}
select { background-image: linear-gradient(45deg, transparent 50%, var(--steel) 50%), linear-gradient(135deg, var(--steel) 50%, transparent 50%);
  background-position: calc(100% - 18px) 55%, calc(100% - 13px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 2.2rem; }
textarea { min-height: 7.5rem; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--teal); outline-offset: 1px; border-bottom-color: var(--teal); }
input[aria-invalid="true"], select[aria-invalid="true"] { border-bottom-color: var(--oxide); background: #fbf3ef; }
.form-error { color: var(--oxide); font-size: .93rem; margin: 0 0 1rem; min-height: 0; }
.form-error:empty { display: none; }
.form-fine { font-size: .84rem; color: var(--ink-soft); margin-top: 1rem; }
.thanks { border: 1px solid var(--steel); border-top: 6px solid var(--teal); padding: clamp(1.4rem, 3vw, 2.2rem); background: var(--newsprint); }
.thanks h3 { font-size: 1.5rem; margin-bottom: .6rem; }
.thanks:focus { outline: none; }

/* ---------- Article layouts ---------- */
.split { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 0 3.4rem; }
.rail { border-left: 1px solid var(--hair); padding-left: 2rem; display: flex; flex-direction: column; gap: 2rem; }
.notice { background: var(--concrete); border: 1px solid var(--steel); border-top: 6px solid var(--oxide); padding: 1.3rem 1.4rem; font-size: .95rem; line-height: 1.55; }
.notice h2, .notice h3 { font-size: 1.08rem; margin-bottom: .5rem; letter-spacing: 0; }
.onpage { list-style: none; margin: 0; padding: 0; border-top: 3px solid var(--steel); }
.onpage li { border-bottom: 1px solid var(--hair); }
.onpage a { display: block; padding: .6rem 0; text-decoration: none; font: 600 .95rem/1.3 var(--display); }
.onpage a:hover { color: var(--oxide); }
.rail-title { font: 700 .95rem/1.2 var(--display); margin-bottom: .45rem; }

.pair { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0 3.4rem; align-items: start; }
.pair.flip { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.fig-tall img { aspect-ratio: 4 / 5; }

.faq { columns: 2 22rem; column-gap: 3.2rem; column-rule: 1px solid var(--hair); margin-top: 2rem; }
.faq-item { break-inside: avoid; padding: 1.1rem 0 1.2rem; border-top: 1px solid var(--steel); }
.faq-item h3 { font-size: 1.14rem; line-height: 1.22; margin-bottom: .5rem; letter-spacing: -.005em; }
.faq-item p { font-size: .99rem; }

.close { padding-top: clamp(3.5rem, 7vw, 6rem); padding-bottom: clamp(4rem, 8vw, 7rem); }
.close-inner { border-top: 10px solid var(--oxide); padding-top: 1.6rem; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1.4rem 3.4rem; align-items: end; }
.close h2 { font-size: clamp(1.9rem, 3.4vw, 3rem); max-width: 18ch; margin-bottom: 1rem; }
.close-actions { display: flex; flex-direction: column; gap: 1rem; align-items: flex-start; }
.close-actions .tel { font: 700 1.5rem/1 var(--display); text-decoration: none; color: var(--steel); }
.close-actions .tel:hover { color: var(--oxide); }

.checks { columns: 2 22rem; column-gap: 3.2rem; column-rule: 1px solid var(--hair); margin-top: 1.6rem; }
.check { break-inside: avoid; padding: 1.1rem 0 1.3rem; border-top: 1px solid var(--steel); }
.check h3 { font-size: 1.25rem; margin-bottom: .55rem; }
.check .tag { display: block; font-size: .82rem; font-variant-caps: all-small-caps; letter-spacing: .06em; color: var(--oxide); margin-bottom: .3rem; font-family: var(--body); }

.form-parts { list-style: none; margin: 0; padding: 0; border-top: 3px solid var(--steel); }
.form-parts li { padding: .5rem 0; border-bottom: 1px solid var(--hair); font-size: .95rem; }

.options { display: grid; grid-template-columns: 1fr 1fr; gap: 0 3.2rem; margin-top: 1.8rem; }
.option { padding: 1.2rem 0 1.4rem; border-top: 1px solid var(--steel); }
.option h3 { font-size: 1.3rem; margin-bottom: .55rem; }

.hood { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 0 3.4rem; padding: 2.2rem 0 2.4rem; border-top: 1px solid var(--steel); }
.hood h2 { font-size: clamp(1.7rem, 2.8vw, 2.45rem); line-height: 1; }
.hood .meta { margin-top: .6rem; font-size: .88rem; line-height: 1.45; color: var(--ink-soft); font-variant-caps: all-small-caps; letter-spacing: .05em; }
.hood .cols { columns: 2 17rem; }
.hood-fig { padding-bottom: 2.4rem; }
.hood-fig img { aspect-ratio: 21 / 9; object-position: 50% 40%; }
.hood-pair { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 0 3.4rem; border-top: 1px solid var(--steel); padding-top: 2.2rem; }
.hood-pair .hood { border-top: 0; padding-top: 0; grid-template-columns: 1fr; gap: 1rem; }
.hood-pair .hood .cols { columns: 2 16rem; }

/* ---------- About ---------- */
.about-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 0 4rem; padding-top: clamp(2.5rem, 5vw, 4rem); align-items: start; }
.portrait { background: var(--concrete); border: 1px solid var(--steel); padding: clamp(14px, 2vw, 22px); }
.portrait img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%; border: 1px solid var(--hair); background: #fff; }
.facts { margin: 1.6rem 0 0; border-top: 3px solid var(--steel); }
.facts div { display: grid; grid-template-columns: 7.5rem 1fr; gap: .8rem; padding: .6rem 0; border-bottom: 1px solid var(--hair); font-size: .95rem; }
.facts dt { font: 600 .9rem/1.5 var(--display); color: var(--steel); }
.facts dd { margin: 0; overflow-wrap: anywhere; }
.letter h1 { font-size: clamp(2.4rem, 5vw, 4.4rem); line-height: .98; letter-spacing: -.03em; margin-bottom: 1.4rem; }
.letter p { max-width: 62ch; }
.letter h2 { font-size: clamp(1.35rem, 2vw, 1.7rem); margin: 2.2rem 0 .7rem; }
.sign { font-style: italic; margin-top: 1.6rem; }

/* ---------- Contact ---------- */
.contact-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0 3.6rem; align-items: start; padding-bottom: clamp(4rem, 8vw, 7rem); }
.contact-side { display: flex; flex-direction: column; gap: 1.8rem; }
.contact-side .big-tel { margin-top: .2rem; }
.after { margin-top: 2.6rem; }
.after h2 { font-size: 1.5rem; margin-bottom: .7rem; }

/* ---------- Footer ---------- */
.site-foot { background: var(--steel); color: var(--newsprint); border-top: 10px solid var(--oxide); padding-top: clamp(2.6rem, 5vw, 3.8rem); }
.site-foot a { color: var(--newsprint); text-decoration-color: rgba(243, 240, 232, .45); }
.site-foot a:hover { color: #9fd3d0; text-decoration-color: #9fd3d0; }
.site-foot :focus-visible { outline-color: #9fd3d0; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2rem 2.6rem; padding-bottom: 2.4rem; }
.foot-mark { font: 700 2.1rem/.9 var(--display); letter-spacing: -.035em; text-decoration: none; }
.foot-mark span { color: #d99a86; }
.foot-grid p { font-size: .93rem; line-height: 1.55; color: rgba(243, 240, 232, .82); margin-top: .9rem; max-width: 30ch; }
.foot-h { font: 700 .92rem/1.2 var(--display); letter-spacing: .01em; color: var(--newsprint); padding-bottom: .5rem; border-bottom: 1px solid var(--hair-light); margin-bottom: .7rem; }
.foot-list { list-style: none; margin: 0; padding: 0; font-size: .93rem; line-height: 1.5; }
.foot-list li { padding: .18rem 0; color: rgba(243, 240, 232, .82); }
.foot-list a { text-decoration: none; }
.foot-list a[aria-current="page"] { color: #d99a86; }
.compliance { border-top: 1px solid var(--hair-light); padding: 1.3rem 0 2rem; font-size: .8rem; line-height: 1.6; color: rgba(243, 240, 232, .78); }
.compliance p { margin: 0 0 .35rem; }
.compliance .num { white-space: nowrap; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .foot-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 900px) {
  .strap-mid, .strap-right { display: none; }
  .mast { grid-template-columns: 1fr auto; padding-top: .9rem; padding-bottom: .9rem; }
  .ear { display: none; }
  .wordmark { justify-self: start; }
  .menu-btn { display: inline-flex; align-items: center; }
  .sections { display: none; border-bottom: 3px double var(--steel); }
  .sections.is-open { display: block; }
  .sections ul { display: block; padding: 0 var(--gutter); }
  .sections li + li { border-left: 0; border-top: 1px solid var(--hair); }
  .sections a { padding: 1rem 0; font-size: 1.1rem; }
  .sections a[aria-current="page"] { box-shadow: inset 4px 0 0 var(--oxide); padding-left: .9rem; }

  .split, .pair, .pair.flip, .close-inner, .about-grid, .contact-grid, .hood, .hood-pair { grid-template-columns: minmax(0, 1fr); }
  .rail { border-left: 0; padding-left: 0; margin-top: 2.2rem; }
  .pair > figure, .pair.flip > figure { margin-bottom: 1.8rem; }
  .pair > .pair-text { order: 2; }
  .hood .meta { margin-bottom: 1rem; }
  .hood-pair figure { margin-top: 1.6rem; }
  .about-grid .portrait { max-width: 420px; }
  .about-grid .letter { margin-top: 2.4rem; }
  .options { grid-template-columns: 1fr; }
  .contact-side { margin-top: 2.4rem; }
  .fig-hero img { aspect-ratio: 16 / 10; }
  .fig-band img { aspect-ratio: 16 / 9; }
}

@media (max-width: 560px) {
  body { font-size: 1.02rem; line-height: 1.6; }
  .strap { font-size: .74rem; }
  .field-row { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr; }
  .fig-hero img { aspect-ratio: 4 / 3; object-position: 30% 50%; }
  .facts div { grid-template-columns: 6rem 1fr; }
  .hood-fig img { aspect-ratio: 4 / 3; }
  .pull p { text-indent: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
.rail-h { font-size: 1.4rem; margin-bottom: .7rem; }
.fig-hero.fig-2x1 img { aspect-ratio: 2 / 1; object-position: 50% 58%; }
.after-quote { margin-top: clamp(2.4rem, 5vw, 3.6rem); font-size: clamp(1.75rem, 3vw, 2.7rem); max-width: 24ch; margin-bottom: 1rem; }
@media (max-width: 900px) { .fig-hero.fig-2x1 img { aspect-ratio: 3 / 2; } }
.guide { padding-top: clamp(2.4rem, 5vw, 3.6rem); }
.hood.after-pair { margin-top: 2.4rem; }
.tall-img { aspect-ratio: 4 / 5; object-position: 60% 50%; }
@media (max-width: 900px) { .tall-img { aspect-ratio: 4 / 5; max-height: 70vh; } }
.spacer-end { height: clamp(3.5rem, 7vw, 6rem); }
.about-grid + .fig-band img { aspect-ratio: 21 / 9; object-position: 50% 40%; }
@media (max-width: 900px) { .about-grid + .fig-band img { aspect-ratio: 3 / 2; } }

/* masthead rules share the column width */
.sections { border: 0; max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.sections ul { border-top: 1px solid var(--steel); border-bottom: 4px double var(--steel); }

@media (max-width: 900px) {
  .sections { border: 0; padding: 0; }
  .sections ul { border-top: 1px solid var(--steel); border-bottom: 3px double var(--steel); }
}
.story h2 { font-size: clamp(1.75rem, 3vw, 2.7rem); max-width: 22ch; margin-bottom: 1rem; }
.story .rail-h { font-size: 1.4rem; max-width: none; margin-bottom: .8rem; }
.story .notice h2 { font-size: 1.08rem; }
.nw { white-space: nowrap; }
h1, h2, h3 { hyphens: manual; }
.pull.wide-quote { max-width: none; }
.pull.wide-quote p { max-width: 24ch; font-size: clamp(1.9rem, 4vw, 3.3rem); }
@media (min-width: 900px) {
  .cols p, .justify p { text-align: left; hyphens: auto; -webkit-hyphens: auto; }
}

/* ---------- Art direction pass ---------- */
/* Masthead rule sits on the same measure as the section rules below it */
@media (min-width: 901px) {
  .mast { border-top: 0; position: relative; padding-top: calc(1.1rem + 10px); }
  .mast::before { content: ""; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); height: 10px; background: var(--oxide); }
}

/* Feature heads: headline left, standfirst set against it on the right */
@media (min-width: 901px) {
  .page-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4.4fr); column-gap: 3.4rem; align-items: end; }
  .page-head h1 { grid-column: 1; grid-row: 1 / span 2; max-width: 15ch; }
  .page-head .deck { grid-column: 2; grid-row: 1; margin-top: 0; max-width: 34ch; border-left: 1px solid var(--hair); padding-left: 1.6rem; font-size: clamp(1.1rem, 1.45vw, 1.3rem); }
  .page-head .byline { grid-column: 2; grid-row: 2; margin-top: 1.1rem; max-width: none; }
  .page-head .deck:last-child { grid-row: 1 / span 2; }
}

/* Rail titles sit directly on their list */
.rail > .rail-title + .onpage { margin-top: -1.55rem; }
/* Hilltop entry should not spread to the photo's height */
.hood-pair .hood { align-content: start; }
/* Pull quotes beside a single text column sit mid-column, not hanging off the top */
.pair > .pull { align-self: center; }

/* Closing box: give the action side a column rule and a proper phone number */
.close-actions { border-left: 1px solid var(--hair); padding-left: 2.2rem; gap: 1.1rem; }
.close-actions .tel { font-size: clamp(1.7rem, 2.6vw, 2.3rem); letter-spacing: -.02em; color: var(--oxide); }
.close-actions .tel:hover { color: var(--steel); }
.close h2 { max-width: 20ch; }

/* About: headline spans the page, portrait column carries the pull quote */
.about-grid { padding-top: 0; }
.letter > h2:first-child { margin-top: 0; }
.side-quote { margin-top: 2.6rem; }
.side-quote p { font-size: clamp(1.45rem, 2.2vw, 2rem); text-indent: -.4em; }

@media (max-width: 900px) {
  .close-actions { border-left: 0; padding-left: 0; }
  .about-grid .portrait { max-width: none; }
}


@media (max-width: 560px) {
  /* Lead photographs run edge to edge on phones */
  .fig-hero.wide { padding-left: 0; padding-right: 0; }
  .fig-hero.wide img { border-left: 0; border-right: 0; }
  .fig-hero.wide figcaption { padding: 0 var(--gutter); }
  .fig-hero img { aspect-ratio: 5 / 4; }
  /* Footer: page lists side by side */
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1.4rem; }
  .foot-grid > :nth-child(-n+2) { grid-column: 1 / -1; }
}
@media (min-width: 901px) {
  .page-head h1, .page-head .deck { align-self: start; }
  .page-head .byline { align-self: end; }
}
.sidebar { margin-top: 2.4rem; padding: 1.5rem 1.6rem 1.6rem; }
.sidebar h2 { font-size: 1.45rem; letter-spacing: -.01em; margin-bottom: .7rem; }
.sidebar p { font-size: .98rem; line-height: 1.58; }
.facts dd { overflow-wrap: normal; }
@media (min-width: 901px) and (max-width: 1180px) {
  .page-head .byline { font-size: .8rem; letter-spacing: .04em; }
  .facts div { grid-template-columns: 6.2rem 1fr; }
}

/* ---------- Final art direction pass ---------- */
@media (max-width: 900px) {
  /* A pull quote follows the story it quotes, never precedes its headline */
  .pair > .pull { order: 3; margin-top: 2.4rem; }
}
.hood h2[id] { scroll-margin-top: 1.5rem; }
.foot-list a:not([aria-current]) { color: rgba(243, 240, 232, .9); }
@media (min-width: 901px) {
  /* Hilltop: photo height matches the short entry beside it */
  .hood-pair .tall-img { aspect-ratio: 1 / 1; object-position: 50% 62%; }
}
.contact-img { object-position: 36% 50%; }

/* About: the pull quote and the "won't tell you" box sit under the portrait on desktop, after the letter on phones */
@media (min-width: 901px) {
  .about-grid { grid-template-rows: auto 1fr; }
  .about-grid > aside { grid-column: 1; grid-row: 1; }
  .about-grid > .letter { grid-column: 2; grid-row: 1 / span 2; }
  .about-grid > .about-extra { grid-column: 1; grid-row: 2; }
}
@media (max-width: 900px) {
  .about-extra { margin-top: 2.8rem; }
}

/* ==========================================================
   Front page, laid out as a front page
   ========================================================== */
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sheet { width: min(100% - 2 * var(--gutter), var(--max) - 2 * var(--gutter)); margin-left: auto; margin-right: auto; }

.folio {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  padding: .55rem 0 .5rem; border-bottom: 1px solid var(--hair);
  font: 600 .84rem/1.2 var(--display); font-variant-caps: all-small-caps; letter-spacing: .09em; color: var(--ink-soft);
}
.folio-mid { font: italic 400 .86rem/1.2 var(--body); font-variant-caps: normal; letter-spacing: 0; }

.jump { font-style: italic; font-size: .95rem; break-inside: avoid; }
.jump a { text-decoration-color: var(--oxide); }
.jump a::after { content: "\2009\2192"; font-style: normal; }
.jump a:hover { color: var(--oxide); }

/* Above the fold: lead story plus a narrow column of neighborhood items */
.front { display: grid; grid-template-columns: minmax(0, 1fr) 17.5rem; gap: 0 2.6rem; padding-top: clamp(1.6rem, 3.4vw, 2.8rem); }
.headline { font-size: clamp(2.5rem, 5.5vw, 5.3rem); line-height: .93; letter-spacing: -.036em; max-width: 16ch; }
.lead-story .deck { max-width: 46ch; margin-top: 1.2rem; }
.lead-story .byline { max-width: none; }
.lead-fig { margin-top: 1.6rem; }
.lead-fig img { aspect-ratio: 21 / 9; object-position: 50% 45%; }
.lead-cols { margin-top: 1.5rem; columns: 2 17rem; }

.hood-notes { border-left: 1px solid var(--hair); padding-left: 2rem; }
.flag {
  font: 700 1.15rem/1.1 var(--display); letter-spacing: -.005em;
  border-top: 5px solid var(--steel); border-bottom: 1px solid var(--steel);
  padding: .55rem 0 .5rem; margin-bottom: 1rem;
}
.hood-notes figure img { aspect-ratio: 3 / 2; object-position: 55% 50%; }
.note-item { padding: 1rem 0 1.05rem; border-bottom: 1px solid var(--hair); }
.note-item h3 { font-size: 1.28rem; line-height: 1.05; letter-spacing: -.012em; }
.note-item .where { margin: .25rem 0 .45rem; font-size: .8rem; line-height: 1.3; font-variant-caps: all-small-caps; letter-spacing: .07em; color: var(--oxide); }
.note-item p:last-child { font-size: .93rem; line-height: 1.5; }
.hood-notes > .jump { margin-top: .9rem; }

/* Below the fold: the boxed as-is item and the box score */
.second {
  display: grid; grid-template-columns: minmax(0, 1fr) 19rem; gap: 0 2.6rem; align-items: start;
  margin-top: clamp(2.8rem, 5.5vw, 4.4rem); padding-top: clamp(1.8rem, 3.5vw, 2.6rem);
  border-top: 3px solid var(--steel);
}
.asis-box { border: 4px double var(--steel); background: var(--concrete); padding: clamp(1.2rem, 2.6vw, 2.1rem); }
.box-head { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: .8rem 2.2rem; align-items: end; padding-bottom: 1.3rem; }
.box-head h2 { font-size: clamp(1.7rem, 2.8vw, 2.5rem); line-height: 1; letter-spacing: -.025em; }
.box-head p { font-style: italic; font-size: 1rem; line-height: 1.5; color: var(--ink-soft); border-left: 1px solid var(--hair); padding-left: 1.3rem; }
.asis-box figure img { aspect-ratio: 16 / 6.5; object-position: 50% 58%; }
.box-items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 1.4rem; border-top: 1px solid var(--steel); }
.box-items > div { padding: 1rem 1.3rem 0; }
.box-items > div:first-child { padding-left: 0; }
.box-items > div:last-child { padding-right: 0; }
.box-items > div + div { border-left: 1px solid var(--hair); }
.box-items h3 { font-size: 1.2rem; margin-bottom: .45rem; letter-spacing: -.01em; }
.box-items p { font-size: .94rem; line-height: 1.52; }
.asis-box > .jump { margin-top: 1.4rem; padding-top: .9rem; border-top: 1px solid var(--hair); }

.boxscore { border-top: 6px solid var(--oxide); padding-top: .75rem; }
.boxscore h2 { font-size: 1.75rem; letter-spacing: -.02em; }
.score-dek { font-style: italic; font-size: .93rem; line-height: 1.45; color: var(--ink-soft); margin: .35rem 0 1rem; }
.boxscore table { width: 100%; border-collapse: collapse; font-family: var(--display); font-weight: 600; font-variant-numeric: lining-nums tabular-nums; }
.boxscore thead th {
  font: 700 .9rem/1.2 var(--display); font-variant-caps: all-small-caps; letter-spacing: .07em;
  color: var(--oxide); text-align: left; padding: 0 .55rem .45rem; border-bottom: 2px solid var(--oxide);
}
.boxscore thead td { border-bottom: 2px solid var(--oxide); }
.boxscore tbody th {
  font: 600 .86rem/1.25 var(--display); font-variant-caps: all-small-caps; letter-spacing: .07em;
  color: var(--ink-soft); text-align: left; padding: .6rem .4rem .6rem 0; width: 27%; vertical-align: top;
}
.boxscore td { font-size: .9rem; line-height: 1.25; color: var(--steel); padding: .6rem .55rem; vertical-align: top; }
.boxscore tbody tr { border-bottom: 1px solid rgba(140, 59, 42, .45); }
.boxscore td + td, .boxscore th + th { border-left: 1px solid rgba(140, 59, 42, .45); }
.boxscore tbody tr:last-child { border-bottom: 2px solid var(--oxide); }
.score-note { font-size: .82rem; line-height: 1.5; color: var(--ink-soft); font-style: italic; margin-top: .8rem; }

/* Second story */
.third { display: grid; grid-template-columns: minmax(0, 1fr) 17.5rem; gap: 0 2.6rem; padding-top: clamp(2.6rem, 5vw, 4rem); align-items: start; }
.third-story h2 { font-size: clamp(1.8rem, 3.2vw, 2.9rem); letter-spacing: -.025em; max-width: 22ch; margin-bottom: 1.2rem; }
.third .cols.three { columns: 3 14rem; }
.third .pull { border-left: 0; margin-top: .3rem; }
.third .pull p { font-size: clamp(1.5rem, 2.3vw, 2.1rem); }

/* Classified clip-out notice */
.classifieds { display: grid; grid-template-columns: minmax(0, 1fr) 15rem; gap: 0 2.6rem; align-items: start; padding-top: clamp(3.4rem, 7vw, 5.6rem); padding-bottom: clamp(4rem, 8vw, 6.5rem); }
.clip { border: 2px dashed var(--steel); padding: 9px; }
.clip-inner { border: 1px solid var(--steel); padding: clamp(1.3rem, 3vw, 2.4rem); background: var(--newsprint); }
.clip-head { text-align: center; }
.clip-kind {
  display: flex; align-items: center; gap: 1rem; margin: 0 0 .9rem;
  font: 700 .95rem/1 var(--display); font-variant-caps: all-small-caps; letter-spacing: .32em; color: var(--oxide);
}
.clip-kind::before, .clip-kind::after { content: ""; flex: 1; border-top: 3px double var(--oxide); }
.clip-head h2 { font-size: clamp(1.9rem, 3.6vw, 3.1rem); line-height: .98; letter-spacing: -.03em; max-width: 20ch; margin: 0 auto; }
.clip-dek { font-style: italic; font-size: 1rem; line-height: 1.55; color: var(--ink-soft); max-width: 54ch; margin: .9rem auto 0; }

.lead-form.coupon { border: 0; background: none; padding: 0; margin-top: 1.5rem; border-top: 1px solid var(--steel); }
.coupon:not(.coupon-full) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1.8rem; }
.coupon .f-wide, .coupon .form-error, .coupon-foot { grid-column: 1 / -1; }
.coupon .form-error { margin: 1rem 0 0; }
.coupon .field { margin: 1.15rem 0 0; }
.coupon .field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.8rem; }
.coupon label { font: 600 .84rem/1.2 var(--display); font-variant-caps: all-small-caps; letter-spacing: .08em; color: var(--ink-soft); margin-bottom: .1rem; }
.coupon label .opt { font-variant-caps: normal; letter-spacing: 0; }
.coupon input, .coupon select {
  background-color: transparent; border: 0; border-bottom: 1px solid var(--steel);
  padding: .5rem 0 .4rem; font-size: 1.05rem;
}
.coupon select { padding-right: 2rem; }
.coupon textarea {
  border: 0; border-bottom: 1px solid var(--steel); padding: 0; margin-top: .2rem;
  line-height: 2rem; min-height: 8rem;
  background: repeating-linear-gradient(transparent 0 calc(2rem - 1px), var(--hair) calc(2rem - 1px) 2rem);
}
.coupon input:focus, .coupon select:focus, .coupon textarea:focus { outline-offset: 3px; border-bottom-color: var(--teal); }
.coupon input[aria-invalid="true"], .coupon select[aria-invalid="true"] { background-color: #f7ece6; }
.coupon-foot { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem 1.4rem; margin-top: 1.6rem; }
.coupon-foot p { margin: 0; font-size: .9rem; font-style: italic; color: var(--ink-soft); }
.clip-tel { text-align: center; margin: 1.6rem 0 0; padding-top: 1rem; border-top: 1px solid var(--hair); font-size: .95rem; }
.clip-tel .tel { font: 700 1.2rem/1 var(--display); color: var(--oxide); text-decoration: none; letter-spacing: -.01em; }
.clip-tel .tel:hover { color: var(--steel); }
.clip-tel a { overflow-wrap: anywhere; }
.clip .thanks { border: 0; border-top: 1px solid var(--steel); background: none; padding: 1.4rem 0 0; margin-top: 1.5rem; text-align: center; }

.columnist { border-left: 1px solid var(--hair); padding-left: 1.8rem; font-size: .95rem; line-height: 1.55; }
.mug { background: #fff; max-width: 11.5rem; }
.mug img { aspect-ratio: 1 / 1; object-fit: cover; object-position: 50% 20%; background: #fff; }
.mug-name { font: 700 1.25rem/1.1 var(--display); color: var(--steel); margin: .9rem 0 .3rem; letter-spacing: -.01em; }
.mug-role { font-size: .84rem; line-height: 1.4; font-variant-caps: all-small-caps; letter-spacing: .06em; color: var(--ink-soft); }

/* Inner-page closing boxes pick up the clip-out cut line */
.close-inner { border-top: 0; border: 2px dashed var(--steel); outline: 1px solid var(--steel); outline-offset: -11px; padding: clamp(1.6rem, 3.4vw, 2.6rem) clamp(1.5rem, 3.4vw, 2.8rem); }

@media (max-width: 1100px) {
  .front, .third { grid-template-columns: minmax(0, 1fr) 15.5rem; gap: 0 2rem; }
  .hood-notes { padding-left: 1.6rem; }
  .second { grid-template-columns: minmax(0, 1fr); }
  .boxscore { margin-top: 2.6rem; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 0 2.6rem; align-items: start; }
  .boxscore > * { grid-column: 1; }
  .boxscore > .brief { grid-column: 2; grid-row: 1 / span 5; margin-top: .35rem; }
  .classifieds { grid-template-columns: minmax(0, 1fr) 12rem; gap: 0 2rem; }
}
@media (max-width: 900px) {
  .folio-mid { display: none; }
  .front, .third, .classifieds { grid-template-columns: minmax(0, 1fr); }
  .hood-notes { border-left: 0; padding-left: 0; margin-top: 2.6rem; }
  .box-head { grid-template-columns: 1fr; }
  .box-head p { border-left: 0; padding-left: 0; }
  .third .pull { margin-top: 2rem; }
  .columnist { border-left: 0; padding-left: 0; margin-top: 2.4rem; display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 0 1.2rem; align-items: start; }
  .columnist .mug { grid-row: 1 / span 4; }
  .columnist .mug-name { margin-top: 0; }
  .close-inner { outline-offset: -9px; }
}
@media (max-width: 560px) {
  .coupon:not(.coupon-full), .coupon .field-row { grid-template-columns: 1fr; }
  .headline { font-size: clamp(2.3rem, 10.4vw, 2.9rem); }
  .lead-fig { margin-left: calc(-1 * var(--gutter)); margin-right: calc(-1 * var(--gutter)); }
  .lead-fig img { aspect-ratio: 4 / 3; border-left: 0; border-right: 0; object-position: 35% 50%; }
  .lead-fig figcaption { padding: 0 var(--gutter); }
  .asis-box { padding: 1.1rem; }
  .asis-box figure img { aspect-ratio: 3 / 2; }
  .clip { padding: 6px; }
  .clip-inner { padding: 1.3rem 1.1rem 1.4rem; }
  .clip-kind { letter-spacing: .24em; }
  .coupon-foot .btn { width: 100%; text-align: center; }
}
.brief { margin-top: 2rem; border-top: 3px solid var(--steel); padding-top: .8rem; }
.brief h3 { font-size: 1.2rem; margin-bottom: .45rem; letter-spacing: -.01em; }
.brief p { font-size: .93rem; line-height: 1.52; }
.cols p { hyphenate-limit-chars: 8 4 4; -webkit-hyphenate-limit-before: 4; -webkit-hyphenate-limit-after: 4; }
@media (max-width: 700px) {
  .boxscore { display: block; }
  .boxscore > .brief { margin-top: 2rem; }
  .box-items { grid-template-columns: 1fr; }
  .box-items > div, .box-items > div:first-child, .box-items > div:last-child { padding: 1rem 0 0; }
  .box-items > div + div { border-left: 0; border-top: 1px solid var(--hair); margin-top: 1rem; }
}

/* Blog */
/* ==========================================================
   The Ledger: section front and article pages
   ========================================================== */

/* Seven sections in the nav: tighten spacing on narrow desktops so it holds one line */
@media (min-width: 901px) and (max-width: 1100px) {
  .sections a { padding-left: .95rem; padding-right: .95rem; }
}
/* Article pages sit inside The Ledger: same current-section mark */
.sections a[aria-current="true"] { color: var(--oxide); box-shadow: inset 0 -3px 0 var(--oxide); }
.foot-list a[aria-current="true"] { color: #d99a86; }
@media (max-width: 900px) {
  .sections a[aria-current="true"] { box-shadow: inset 4px 0 0 var(--oxide); padding-left: .9rem; }
}

/* ---------- Section front ---------- */
.ledger-head h1 { font-size: clamp(3.2rem, 8.6vw, 7.6rem); line-height: .86; letter-spacing: -.045em; max-width: none; }
.ledger-head h1::after { content: ""; display: block; width: 2.2em; height: 6px; background: var(--oxide); margin-top: .16em; }

.ledger-front {
  display: grid; grid-template-columns: minmax(0, 1fr) 19rem; gap: 0 2.6rem; align-items: start;
  border-top: 3px solid var(--steel); padding-top: clamp(1.6rem, 3.4vw, 2.6rem);
}
.ledger-lead .headline { font-size: clamp(2.2rem, 4.6vw, 4.3rem); max-width: 17ch; }
.ledger-lead .headline a, .ledger-item h2 a, .ledger-item h3 a { text-decoration: none; color: inherit; }
.ledger-lead .headline a:hover, .ledger-item h2 a:hover, .ledger-item h3 a:hover { color: var(--oxide); }
.ledger-lead .deck { max-width: 54ch; }
.ledger-meta {
  margin: .9rem 0 0; font-size: .84rem; line-height: 1.3; color: var(--ink-soft);
  font-variant-caps: all-small-caps; letter-spacing: .06em;
}
.ledger-lead > .ledger-meta { padding-top: .7rem; border-top: 1px solid var(--hair); max-width: 44rem; }
.ledger-lead .lead-fig img { aspect-ratio: 16 / 9; }
.ledger-lead .lead-fig a { display: block; }
.ledger-lead > .jump { margin-top: 1rem; }

.ledger-index { border-left: 1px solid var(--hair); padding-left: 2rem; }
.ledger-index ol { list-style: none; margin: 0; padding: 0; }
.ledger-index li { border-bottom: 1px solid var(--hair); }
.ledger-index a {
  display: flex; align-items: baseline; gap: .45rem; padding: .78rem 0 .8rem;
  text-decoration: none; font: 600 1rem/1.22 var(--display); letter-spacing: -.005em; color: var(--steel);
}
.ledger-index a:hover { color: var(--oxide); }
.ledger-index .t { flex: 0 1 auto; }
.ledger-index .leader { flex: 1 0 1rem; border-bottom: 1px dotted var(--ink-soft); transform: translateY(-.28em); min-width: 1rem; }
.ledger-index .m { flex: none; font: 400 .9rem/1 var(--body); color: var(--oxide); white-space: nowrap; }
.ledger-index .m .num { font-variant-numeric: lining-nums tabular-nums; }
.ledger-index-note { margin-top: 1rem; font-size: .86rem; line-height: 1.5; font-style: italic; color: var(--ink-soft); }
.ledger-index-note a { font-style: normal; font-family: var(--display); font-weight: 600; white-space: nowrap; }

.ledger-rest { margin-top: clamp(3rem, 6vw, 4.8rem); }
.ledger-row { display: grid; align-items: start; }
.ledger-row-2 { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); padding-top: .4rem; }
.ledger-row-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(2rem, 4vw, 2.8rem); padding-top: clamp(1.6rem, 3vw, 2.2rem); border-top: 1px solid var(--steel); }
.ledger-row, .related-grid { column-gap: 3.2rem; }
.ledger-item { position: relative; }
.ledger-item + .ledger-item::before { content: ""; position: absolute; top: 0; bottom: 0; left: -1.6rem; border-left: 1px solid var(--hair); }
.ledger-pic { display: block; }
.ledger-pic img { aspect-ratio: 3 / 2; border: 1px solid var(--steel); width: 100%; object-fit: cover; background: var(--concrete); }
.ledger-item h2, .ledger-item h3 { font-size: 1.42rem; line-height: 1.08; letter-spacing: -.015em; margin-top: .95rem; }
.ledger-item.big h2, .ledger-item.big h3 { font-size: clamp(1.7rem, 2.7vw, 2.35rem); letter-spacing: -.025em; max-width: 20ch; }
.ledger-item.big .ledger-pic img { aspect-ratio: 16 / 10; }
.ledger-dek { font-size: .97rem; line-height: 1.52; margin: .6rem 0 0; }
.ledger-item.big .ledger-dek { font-size: 1.05rem; max-width: 48ch; }

/* ---------- Article ---------- */
.crumbs ol {
  list-style: none; margin: 0; padding: .55rem 0 .5rem; display: flex; flex-wrap: wrap; gap: .15rem 0;
  border-bottom: 1px solid var(--hair);
  font: 600 .84rem/1.3 var(--display); font-variant-caps: all-small-caps; letter-spacing: .09em; color: var(--ink-soft);
}
.crumbs li + li::before { content: "/"; margin: 0 .6rem; color: var(--oxide); }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--oxide); }
.crumbs [aria-current="page"] { color: var(--steel); }

.post-head { padding-top: clamp(2.2rem, 4.6vw, 4rem); padding-bottom: clamp(1.8rem, 3.4vw, 2.8rem); }
.post-head h1 { font-size: clamp(2.3rem, 5.1vw, 4.6rem); line-height: .97; letter-spacing: -.032em; max-width: 19ch; }
.post-lead {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4.4fr); gap: 1.8rem 3.4rem; align-items: start;
  margin-top: clamp(1.5rem, 3vw, 2.3rem);
}
.lead-answer {
  margin: 0; max-width: 46ch; padding: 1rem 0 1.15rem;
  border-top: 5px solid var(--oxide); border-bottom: 1px solid var(--steel);
  font-size: clamp(1.18rem, 1.65vw, 1.42rem); line-height: 1.48; color: var(--steel);
}
.post-byline {
  display: grid; grid-template-columns: 4.4rem minmax(0, 1fr); gap: 0 1rem; align-items: center;
  border-top: 1px solid var(--steel); padding-top: 1rem;
}
.post-byline img {
  width: 4.4rem; height: 4.4rem; aspect-ratio: 1 / 1; object-fit: cover; object-position: 50% 20%;
  border: 1px solid var(--steel); background: #fff;
}
.post-byline .by { margin: 0; text-wrap: balance; font: 600 .96rem/1.28 var(--display); color: var(--steel); letter-spacing: -.005em; }
.post-byline .when { margin: .35rem 0 0; font-size: .86rem; line-height: 1.3; font-variant-caps: all-small-caps; letter-spacing: .06em; color: var(--ink-soft); }

.post-body { padding-top: clamp(2.6rem, 5vw, 4.2rem); }
.post-body.split { grid-template-columns: minmax(0, 41rem) minmax(15rem, 1fr); column-gap: clamp(2.6rem, 5vw, 4.4rem); }
.ledger-text { max-width: 41rem; font-size: 1.125rem; line-height: 1.66; }
.ledger-text > h2 {
  font-size: clamp(1.5rem, 2.5vw, 2.1rem); line-height: 1.06; letter-spacing: -.02em; max-width: none;
  margin: 2.8rem 0 .95rem; padding-top: 1rem; border-top: 1px solid var(--steel); scroll-margin-top: 1.5rem;
}
.ledger-text > h2:first-child { margin-top: 0; border-top: 3px solid var(--steel); }
.ledger-text h3 { font-size: 1.2rem; margin: 1.7rem 0 .45rem; letter-spacing: -.01em; }
.ledger-text ul { margin: 0 0 1.25rem; padding-left: 1.15rem; }
.ledger-text li { margin-bottom: .5rem; padding-left: .2rem; }
.ledger-text li::marker { color: var(--oxide); }
.ledger-text strong { font-weight: 600; color: var(--steel); }
.ledger-text .dropcap::first-letter { margin-right: .1em; }

.table-wrap {
  overflow-x: auto; margin: 1.5rem 0 1.9rem;
  border-top: 2px solid var(--oxide); border-bottom: 2px solid var(--oxide);
}
.table-wrap:focus-visible { outline-offset: 4px; }
.table-wrap table {
  width: 100%; min-width: 34rem; border-collapse: collapse;
  font: 600 .9rem/1.32 var(--display); color: var(--steel); font-variant-numeric: lining-nums tabular-nums;
}
.table-wrap th {
  font: 700 .9rem/1.2 var(--display); font-variant-caps: all-small-caps; letter-spacing: .07em;
  color: var(--oxide); text-align: left; vertical-align: bottom; padding: .75rem .75rem .55rem;
  border-bottom: 1px solid var(--oxide);
}
.table-wrap td { padding: .68rem .75rem; vertical-align: top; border-bottom: 1px solid rgba(140, 59, 42, .32); }
.table-wrap tbody tr:last-child td { border-bottom: 0; }
.table-wrap th:first-child, .table-wrap td:first-child { padding-left: 0; }
.table-wrap td + td, .table-wrap th + th { border-left: 1px solid rgba(140, 59, 42, .32); }
.table-wrap td:first-child { font-variant-caps: all-small-caps; letter-spacing: .05em; color: var(--ink-soft); font-size: .95rem; }
.table-wrap.rates td:first-child { font-variant-caps: normal; letter-spacing: 0; font: 700 1rem/1.32 var(--display); color: var(--oxide); }

.post-rail { align-self: stretch; }
.rail-sticky { display: flex; flex-direction: column; gap: 2rem; }
@media (min-width: 901px) {
  .rail-sticky { position: sticky; top: 1.5rem; }
}
.post-rail .rail-title { margin-bottom: .45rem; }
.post-rail .notice h2 { font-size: 1.08rem; margin-bottom: .5rem; letter-spacing: 0; }
.post-rail .notice .tel { font-family: var(--display); font-weight: 700; color: var(--oxide); text-decoration: none; white-space: nowrap; }
.post-rail .notice .tel:hover { color: var(--steel); }

.post-faq { padding-top: clamp(3rem, 6vw, 4.6rem); }
.post-faq > h2 {
  font-size: clamp(1.6rem, 2.8vw, 2.4rem); line-height: 1.04; letter-spacing: -.022em; max-width: none;
  border-top: 5px solid var(--steel); padding-top: 1rem; scroll-margin-top: 1.5rem;
}
.post-faq .faq { margin-top: 1.6rem; }

.close.post-close { padding-bottom: clamp(2.8rem, 5.5vw, 4.4rem); }
.close .measure .tel { font-family: var(--display); font-weight: 700; color: var(--oxide); text-decoration: none; white-space: nowrap; }
.close .measure .tel:hover { color: var(--steel); }

.related { padding-bottom: clamp(4rem, 8vw, 6.5rem); }
.related-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: .4rem; }
.related-grid .ledger-pic img { aspect-ratio: 16 / 9; }

@media (max-width: 1100px) {
  .ledger-front { grid-template-columns: minmax(0, 1fr) 16rem; gap: 0 2rem; }
  .ledger-index { padding-left: 1.6rem; }
  .ledger-row, .related-grid { column-gap: 2.4rem; }
  .ledger-item + .ledger-item::before { left: -1.2rem; }
}
@media (max-width: 900px) {
  .ledger-front, .ledger-row-2, .ledger-row-3, .related-grid, .post-lead, .post-body.split { grid-template-columns: minmax(0, 1fr); }
  .ledger-index { border-left: 0; padding-left: 0; margin-top: 2.6rem; }
  .ledger-item + .ledger-item::before { content: none; }
  .ledger-item + .ledger-item { border-top: 1px solid var(--hair); margin-top: 1.8rem; padding-top: 1.6rem; }
  .ledger-row-3 { margin-top: 1.8rem; padding-top: 1.6rem; }
  .ledger-item h2, .ledger-item h3 { font-size: 1.5rem; }
  .ledger-item.big h2, .ledger-item.big h3 { font-size: 1.8rem; }
  .post-rail { display: none; }
  .ledger-text { max-width: none; }
}
@media (max-width: 560px) {
  .ledger-head h1 { font-size: clamp(3rem, 16vw, 4rem); }
  .ledger-lead .headline { font-size: clamp(2rem, 9vw, 2.6rem); }
  .post-head h1 { font-size: clamp(2.1rem, 9.4vw, 2.7rem); }
  .ledger-text { font-size: 1.0625rem; line-height: 1.64; }
  .ledger-item.big .ledger-pic img, .related-grid .ledger-pic img { aspect-ratio: 3 / 2; }
  .crumbs li:last-child { flex-basis: 100%; }
  .crumbs li:last-child::before { content: none; }
}
@media (max-width: 900px) {
  .post-byline { border-top: 0; padding-top: 0; }
}