/* ─────────────────────────────────────────────────────────────────────────
   atlas.css — Renew Atlas v2, ground-up build, Brand v3.4
   Active routing: dark canvas (Char) for the live product;
   Chalk-White / Pure-White reserved for editorial "stepped-down" panels.

   Locked rules:
   - Inter Tight + Geist Mono only
   - No italics (kill rule below)
   - Sharp corners or 2px max, no shadows, no gradients
   - Bordeaux on light surfaces; Bordeaux-Bright on dark surfaces
   - Cognac on light surfaces; Cognac-2 on dark surfaces
   - Cognac never the default body color; never on same line as Bordeaux
   ───────────────────────────────────────────────────────────────────────── */

:root {
  /* Canvases */
  --pure-white:     #FAFAFA;          /* light canvas */
  --chalk-white:    #F4F1EA;          /* warm light panel (not canvas) */
  --char:           #0F1114;          /* dark canvas */
  --char-2:         #181A1E;          /* stepped dark section */

  /* Structural surfaces */
  --chalk:          #A5A4AC;          /* structural mid-light */
  --slate:          #2A2D33;          /* structural mid-dark */
  --anthracite:     #4A4A48;          /* bridge between Slate and Char */
  --slate-soft:     #5A5F68;          /* secondary mono / soft structure */

  /* Accents — light surfaces */
  --bordeaux:       #5C1A2B;          /* primary accent (light surfaces) */
  --cognac:         #B8884A;          /* supporting accent (light surfaces) */

  /* Accents — dark surfaces */
  --bordeaux-bright:#7A2A38;          /* primary accent (dark surfaces) */
  --cognac-2:       #CC9A5A;          /* supporting accent (dark surfaces) */

  /* Ink on dark canvas */
  --dark-ink:       #EEF0F3;          /* primary ink on Char */

  /* Active aliases — the v3.4 brief routes the live product to dark. */
  --bg:             var(--char);
  --bg-alt:         var(--char-2);
  --panel:          var(--slate);
  --panel-bridge:   var(--anthracite);
  --ink:            var(--dark-ink);
  --ink-2:          var(--chalk);
  --ink-mute:       var(--slate-soft);
  --accent:         var(--bordeaux-bright);
  --accent-deep:    var(--bordeaux);
  --meta:           var(--cognac-2);
  --meta-soft:      var(--cognac);
  --hairline:       #2E3138;
  --hairline-soft:  #21242A;
  --hairline-strong:#3A3E46;

  /* Type stacks */
  --sans: "Inter Tight", system-ui, -apple-system, sans-serif;
  --mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Italic kill rule — global, locked */
em, i, cite, dfn, address, var, q, blockquote, figcaption {
  font-style: normal !important;
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { background: var(--bg); color-scheme: dark; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 300;
  font-size: 15px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--hairline-strong);
  text-underline-offset: 3px;
  transition: color .12s, text-decoration-color .12s;
}
a:hover { text-decoration-color: var(--accent); }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

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

/* Type scale — Atlas-tuned (hero 36–40px, NOT 96px) */
h1, h2, h3, h4 {
  font-family: var(--sans);
  margin: 0 0 .5em;
  letter-spacing: -.02em;
  color: var(--ink);
}
h1 { font-weight: 200; font-size: 40px; line-height: 1.06; letter-spacing: -.025em; }
h2 { font-weight: 300; font-size: 24px; line-height: 1.2; }
h3 { font-weight: 400; font-size: 18px; line-height: 1.3; }
h4 { font-weight: 500; font-size: 14px; line-height: 1.35; }

.mono {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.mono--meta {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--meta);
}
.mono--micro {
  font-family: var(--mono);
  font-weight: 400;
  font-size: 10px;
  letter-spacing: .06em;
  color: var(--ink-mute);
}

.display-xl { font-family: var(--sans); font-weight: 200; font-size: 48px; line-height: 1.04; letter-spacing: -.028em; color: var(--ink); }
.display-lg { font-family: var(--sans); font-weight: 200; font-size: 36px; line-height: 1.06; letter-spacing: -.025em; color: var(--ink); }
.display-md { font-family: var(--sans); font-weight: 300; font-size: 28px; line-height: 1.1;  letter-spacing: -.02em;  color: var(--ink); }
.display-sm { font-family: var(--sans); font-weight: 400; font-size: 20px; line-height: 1.2;  letter-spacing: -.015em; color: var(--ink); }

.num {
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

/* Layout shell */
.shell {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 32px;
}
.shell--wide {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 32px;
}

/* ═══ Masthead — command bar ════════════════════════════════════════════ */
.masthead {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--char);
  border-bottom: 1px solid var(--hairline);
}
.masthead__inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 12px 32px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 32px;
}
.masthead__brand {
  font-family: var(--sans);
  font-weight: 300;
  font-size: 15px;
  letter-spacing: -.005em;
  text-decoration: none;
  color: var(--ink);
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.masthead__brand strong { font-weight: 500; }
.masthead__brand .dot {
  display: inline-block;
  width: 5px;
  height: 5px;
  background: var(--accent);
  border-radius: 50%;
  transform: translateY(-1px);
}
.masthead__center { display: flex; justify-content: center; }
.masthead__nav {
  display: flex;
  gap: 28px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.masthead__nav a {
  text-decoration: none;
  padding: 18px 0;
  border-bottom: 1px solid transparent;
  margin-bottom: -1px;
  transition: color .12s, border-color .12s;
}
.masthead__nav a:hover { color: var(--ink); }
.masthead__nav a[aria-current="page"] {
  color: var(--ink);
  border-bottom-color: var(--accent);
}
.masthead__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--mono);
  font-size: 11px;
}
.masthead__state {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-mute);
  padding: 4px 8px;
  border: 1px solid var(--hairline);
  white-space: nowrap;
}
.masthead__state--in {
  color: var(--meta);
  border-color: var(--hairline-strong);
}
.masthead__sign {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 6px 12px;
  border: 1px solid var(--hairline-strong);
  color: var(--ink);
  text-decoration: none;
  background: transparent;
  cursor: pointer;
}
.masthead__sign:hover { border-color: var(--accent); color: var(--accent); }

/* ═══ Breadcrumb ════════════════════════════════════════════════════════ */
.breadcrumb {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-mute);
  padding: 24px 0 0;
}
.breadcrumb a { text-decoration: none; }
.breadcrumb a:hover { color: var(--ink); }
.breadcrumb__sep { padding: 0 8px; color: var(--hairline-strong); }

/* ═══ Page header ═══════════════════════════════════════════════════════ */
.page-head {
  padding: 56px 0 28px;
  border-bottom: 1px solid var(--hairline);
}
.page-head__eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--meta);
  margin: 0 0 12px;
}
.page-head__title {
  font-weight: 200;
  font-size: 40px;
  line-height: 1.04;
  letter-spacing: -.025em;
  color: var(--ink);
  max-width: 28ch;
  margin: 0 0 12px;
}
.page-head__dek {
  font-weight: 300;
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink-2);
  max-width: 60ch;
  margin: 16px 0 0;
}
.page-head__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--ink-mute);
  margin: 16px 0 0;
}
.page-head__meta strong { color: var(--ink); font-weight: 400; }

/* Command header — denser variant, used on `/markets/[city]` */
.command-head {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 48px;
  align-items: end;
  padding: 56px 0 32px;
  border-bottom: 1px solid var(--hairline);
}
.command-head__lead h1 { margin: 0; }
.command-head__lead p {
  color: var(--ink-2);
  font-size: 15px;
  line-height: 1.55;
  max-width: 48ch;
  margin: 16px 0 0;
}
.command-head__strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 1px;
  background: var(--hairline);
  align-self: stretch;
}

/* ═══ Tile slab system ════════════════════════════════════════════════ */
/* All tile grids use this slab pattern — 1px gap on hairline bg gives a
   monolithic grid feel, no individual card edges. */

.slab-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--hairline);
}
.slab-grid--5col { grid-template-columns: repeat(5, 1fr); }
.slab-grid--3col { grid-template-columns: repeat(3, 1fr); }
.slab-grid--2col { grid-template-columns: repeat(2, 1fr); }

.slab {
  background: var(--bg-alt);
  padding: 22px 22px 24px;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  position: relative;
  transition: background .12s;
  min-height: 200px;
}
.slab:hover { background: var(--panel); }
.slab--bridge { background: var(--panel-bridge); }
.slab--accent::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: var(--accent);
}

.slab__eyebrow {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 6px;
}
.slab__title {
  font-family: var(--sans);
  font-weight: 200;
  font-size: 28px;
  line-height: 1.06;
  letter-spacing: -.02em;
  color: var(--ink);
  margin-bottom: 14px;
  transition: transform .12s;
}
.slab:hover .slab__title { transform: translateY(-1px); }

.slab__primary {
  font-family: var(--sans);
  font-weight: 200;
  font-size: 36px;
  line-height: 1.04;
  letter-spacing: -.02em;
  color: var(--ink);
  font-feature-settings: "tnum";
  margin: 4px 0 14px;
}
.slab__primary-meta {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  color: var(--meta);
  margin: -10px 0 14px;
}

.slab__row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-mute);
  letter-spacing: .04em;
  padding: 6px 0;
  border-top: 1px solid var(--hairline);
}
.slab__row:first-of-type { border-top: 1px solid var(--hairline-strong); }
.slab__row dt { font-weight: 400; }
.slab__row dd { margin: 0; color: var(--ink); font-feature-settings: "tnum"; }
.slab__row--signal dd { color: var(--meta); }

.slab__body {
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-2);
  margin: 10px 0 16px;
  max-width: 42ch;
}

.slab__cta {
  margin-top: auto;
  padding-top: 16px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--accent);
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  transition: color .12s;
}
.slab:hover .slab__cta { color: var(--meta); }

/* Pillar slab — taller, slightly grander, for /. */
.pillar-grid { grid-template-columns: repeat(4, 1fr); }
.pillar-slab { min-height: 280px; padding: 36px 28px; }
.pillar-slab .slab__title { font-size: 36px; margin-bottom: 12px; }
.pillar-slab .slab__primary {
  font-size: 24px;
  font-weight: 300;
  color: var(--meta);
  margin: 0 0 8px;
}

/* ═══ KPI strip ═══════════════════════════════════════════════════════ */
.kpi-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1px;
  background: var(--hairline);
  margin: 32px 0;
}
.kpi-cell {
  background: var(--bg-alt);
  padding: 20px;
}
.kpi-cell__label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 8px;
}
.kpi-cell__value {
  font-family: var(--sans);
  font-weight: 200;
  font-size: 28px;
  line-height: 1.04;
  letter-spacing: -.02em;
  color: var(--ink);
  font-feature-settings: "tnum";
}
.kpi-cell__change {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .06em;
  color: var(--ink-mute);
  margin-top: 4px;
}
.kpi-cell__change--pos { color: #6BA371; }
.kpi-cell__change--neg { color: var(--accent); }

/* ═══ Tables — instrument-grade ═══════════════════════════════════════ */
.atlas-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin: 0;
}
.atlas-table th, .atlas-table td {
  padding: 10px 14px;
  text-align: left;
  border-bottom: 1px solid var(--hairline);
}
.atlas-table th {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-mute);
  background: var(--bg-alt);
  border-bottom: 1px solid var(--hairline-strong);
}
.atlas-table th.sortable {
  cursor: pointer;
  position: relative;
}
.atlas-table th.sortable::after {
  content: "↕";
  margin-left: 6px;
  color: var(--meta);
  font-size: 10px;
}
.atlas-table td { color: var(--ink); font-feature-settings: "tnum"; }
.atlas-table tr:hover td { background: rgba(255,255,255,.02); }
.atlas-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.atlas-table .meta {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--ink-mute);
}

.tbl-wrap { border: 1px solid var(--hairline); }
.tbl-wrap__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 14px 16px;
  border-bottom: 1px solid var(--hairline);
  background: var(--bg-alt);
}
.tbl-wrap__title {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.tbl-wrap__coverage {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .04em;
  color: var(--meta);
}
.tbl-wrap__foot {
  padding: 10px 16px;
  border-top: 1px solid var(--hairline);
  background: var(--bg-alt);
}

/* ═══ Pills ═════════════════════════════════════════════════════════════ */
.pill {
  display: inline-block;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1px solid var(--hairline-strong);
  color: var(--ink-2);
  background: transparent;
}
.pill--accent {
  border-color: var(--accent);
  color: var(--accent);
}
.pill--meta {
  border-color: var(--meta);
  color: var(--meta);
}
.pill--mute {
  border-color: var(--hairline);
  color: var(--ink-mute);
}

/* ═══ Doc + Guide page ═════════════════════════════════════════════════ */
.doc {
  max-width: 1320px;
  margin: 0 auto;
  padding: 48px 32px 80px;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 64px;
  align-items: start;
}
.rail {
  position: sticky;
  top: 80px;
  align-self: start;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--ink-mute);
}
.rail__list {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  border-left: 1px solid var(--hairline);
}
.rail__list li { padding: 0; margin: 0; }
.rail__list a {
  display: block;
  padding: 6px 14px;
  text-decoration: none;
  color: var(--ink-mute);
  border-left: 2px solid transparent;
  margin-left: -1px;
  transition: color .12s, border-color .12s;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.rail__list a:hover { color: var(--ink); }
.rail__list a[aria-current="location"] {
  color: var(--ink);
  border-left-color: var(--accent);
}
.rail__meta dl {
  margin: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.rail__meta dt {
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--meta);
}
.rail__meta dd { margin: 0 0 8px; color: var(--ink); font-size: 12px; }
.rail__sources {
  border-top: 1px solid var(--hairline);
  margin-top: 16px;
  padding-top: 12px;
  font-size: 10px;
  letter-spacing: .12em;
  color: var(--ink-mute);
}

.body { max-width: 70ch; }
.doc-head { padding-bottom: 28px; border-bottom: 1px solid var(--hairline); margin-bottom: 32px; }
.doc-pill {
  display: inline-block;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--accent);
  border: 1px solid var(--accent);
  padding: 4px 10px;
  margin-bottom: 18px;
}
.doc-title {
  font-weight: 200;
  font-size: 36px;
  line-height: 1.06;
  letter-spacing: -.025em;
  color: var(--ink);
  margin: 0 0 16px;
}
.doc-standfirst {
  font-weight: 300;
  font-size: 18px;
  line-height: 1.55;
  color: var(--ink-2);
  margin: 0 0 24px;
}
.doc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--ink-mute);
}

.body p { margin: 0 0 18px; color: var(--ink); }
.body h2 { margin-top: 40px; font-size: 22px; font-weight: 400; color: var(--ink); }
.body h3 { margin-top: 28px; font-size: 16px; font-weight: 500; color: var(--ink); }
.body ul, .body ol { padding-left: 22px; margin: 0 0 18px; color: var(--ink); }
.body li { margin-bottom: 6px; }
.body code {
  font-family: var(--mono);
  font-size: 13px;
  background: var(--bg-alt);
  padding: 1px 4px;
  border: 1px solid var(--hairline);
}

/* Research primitives — callout, pull, table */
.callout {
  border-left: 2px solid var(--accent);
  padding: 18px 24px;
  margin: 28px 0;
  background: var(--bg-alt);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 20px;
  align-items: baseline;
}
.callout__num {
  font-family: var(--sans);
  font-weight: 200;
  font-size: 32px;
  letter-spacing: -.02em;
  color: var(--ink);
  font-feature-settings: "tnum";
}
.callout__body { font-size: 15px; color: var(--ink-2); }

.pull {
  font-family: var(--sans);
  font-weight: 300;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: -.015em;
  color: var(--ink);
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
  padding: 24px 0;
  margin: 32px 0;
}

.tbl { border-collapse: collapse; width: 100%; font-size: 13px; }
.tbl th, .tbl td { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--hairline); color: var(--ink); }
.tbl th {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-mute);
  background: var(--bg-alt);
}
.tbl tr:last-child td { border-bottom: 0; }

/* Tags */
.tags { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 8px; }
.tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1px solid var(--hairline-strong);
  color: var(--ink-2);
  text-decoration: none;
}
.tag--asset { border-color: var(--accent); color: var(--accent); }
.tag--location { border-color: var(--anthracite); color: var(--ink-2); }
.tag--topic { border-color: var(--hairline-strong); color: var(--ink-mute); }

/* Footnotes */
.footnotes {
  margin-top: 56px;
  border-top: 1px solid var(--hairline);
  padding-top: 28px;
}
.footnotes h2 {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--meta);
  font-weight: 500;
  margin-bottom: 16px;
}
.footnotes ol {
  padding-left: 22px;
  font-size: 13px;
  color: var(--ink-2);
  font-feature-settings: "tnum";
}
.footnotes li {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--hairline-soft);
}
.footnotes li:last-child { border-bottom: 0; }

/* Crossref */
.crossref { margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--hairline); }
.crossref h2 {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-mute);
  font-weight: 500;
  margin-bottom: 16px;
}
.crossref__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--hairline);
}
.crossref__list a {
  display: block;
  padding: 18px;
  background: var(--bg-alt);
  text-decoration: none;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.4;
  transition: background .12s;
}
.crossref__list a:hover { background: var(--panel); }

/* Up-next (guide series) */
.up-next {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--hairline);
}
.up-next__label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--meta);
  margin-bottom: 12px;
}
.up-next__title {
  font-size: 22px;
  font-weight: 300;
  line-height: 1.3;
  margin: 0 0 8px;
}
.up-next__cta {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--accent);
  text-decoration: none;
}

/* Inline tool embed (within /learn/[guide] body) */
.tool-embed {
  margin: 32px 0;
  padding: 20px;
  background: var(--bg-alt);
  border: 1px solid var(--hairline);
  border-left: 2px solid var(--meta);
}
.tool-embed__label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--meta);
  margin-bottom: 6px;
}
.tool-embed__title {
  font-size: 16px;
  font-weight: 400;
  color: var(--ink);
  margin: 0 0 6px;
}
.tool-embed__cta {
  display: inline-block;
  margin-top: 8px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--accent);
  text-decoration: none;
}

/* Bridge-back */
.bridge-back {
  margin-top: 80px;
  background: var(--char);
  border-top: 1px solid var(--hairline);
  color: var(--ink);
}
.bridge-back__inner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 56px 32px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 32px;
}
.bridge-back__inner p {
  font-weight: 300;
  font-size: 18px;
  line-height: 1.5;
  margin: 0;
  color: var(--ink);
}
.bridge-back__cta {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  border: 1px solid var(--ink);
  color: var(--ink);
  padding: 12px 18px;
  text-decoration: none;
  white-space: nowrap;
}
.bridge-back__cta:hover { background: var(--ink); color: var(--char); }

/* Footer */
.atlas-foot {
  border-top: 1px solid var(--hairline);
  background: var(--bg);
}
.atlas-foot__inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 32px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: baseline;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .12em;
  color: var(--ink-mute);
  text-transform: uppercase;
}
.atlas-foot__brand {
  display: flex;
  gap: 16px;
  align-items: baseline;
}
.atlas-foot__nav { display: flex; gap: 24px; }
.atlas-foot__nav a { text-decoration: none; }
.atlas-foot__nav a:hover { color: var(--ink); }

/* PDF download button */
.pdf-download {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  border: 1px solid var(--accent);
  color: var(--accent);
  padding: 6px 12px;
  text-decoration: none;
  display: inline-block;
  background: transparent;
}
.pdf-download:hover { background: var(--accent); color: var(--ink); }

/* ═══ Forms — underwriting-worksheet feel ═════════════════════════════ */
.form-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--hairline);
  border: 1px solid var(--hairline);
}
.form-row {
  background: var(--bg-alt);
  padding: 14px 18px;
  display: grid;
  grid-template-columns: 1fr 180px;
  gap: 16px;
  align-items: baseline;
}
.form-row__label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.form-row__hint {
  font-family: var(--mono);
  font-size: 10px;
  color: var(--meta);
  margin-top: 4px;
  text-transform: none;
  letter-spacing: 0;
}
.form-row input[type=text],
.form-row input[type=number],
.form-row input[type=search],
.form-row select {
  background: var(--char);
  border: 1px solid var(--hairline-strong);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 13px;
  padding: 8px 10px;
  width: 100%;
  font-variant-numeric: tabular-nums;
}
.form-row input:focus, .form-row select:focus {
  outline: 0;
  border-color: var(--accent);
}

.btn {
  display: inline-block;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  padding: 10px 18px;
  background: var(--accent);
  color: var(--ink);
  border: 1px solid var(--accent);
  text-decoration: none;
  cursor: pointer;
}
.btn:hover { background: transparent; color: var(--accent); }
.btn--ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--hairline-strong);
}
.btn--ghost:hover { border-color: var(--accent); color: var(--accent); }

/* ═══ Tool result panel — large numbers ═══════════════════════════════ */
.result-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--hairline);
  border: 1px solid var(--hairline);
}
.result-cell {
  background: var(--bg-alt);
  padding: 28px 24px;
}
.result-cell__label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: 12px;
}
.result-cell__value {
  font-family: var(--sans);
  font-weight: 200;
  font-size: 48px;
  line-height: 1.04;
  letter-spacing: -.025em;
  color: var(--ink);
  font-feature-settings: "tnum";
}
.result-cell__hint {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--meta);
  margin-top: 8px;
}

/* Data lineage badge — for tool tiles + tool surfaces */
.lineage {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  color: var(--meta);
  padding: 4px 8px;
  border: 1px solid var(--hairline-strong);
  display: inline-block;
}
.lineage--manual { color: var(--cognac); border-color: var(--cognac); }

/* ═══ State components ════════════════════════════════════════════════ */
.state-empty,
.state-error {
  padding: 40px 24px;
  text-align: center;
  border: 1px dashed var(--hairline);
  color: var(--ink-mute);
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: .12em;
}
.state-loading {
  padding: 40px 24px;
  text-align: center;
  color: var(--ink-mute);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
}

/* Gated panel — used for IDX rent-comp data, etc. */
.gated-panel {
  padding: 28px;
  border: 1px solid var(--hairline-strong);
  background: var(--bg-alt);
}
.gated-panel__eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--meta);
  margin-bottom: 12px;
}
.gated-panel__title {
  font-size: 18px;
  font-weight: 400;
  color: var(--ink);
  margin: 0 0 8px;
}
.gated-panel__body {
  font-size: 13px;
  color: var(--ink-2);
  margin: 0 0 16px;
  max-width: 56ch;
}

.imls-attribution {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .04em;
  color: var(--ink-mute);
  margin-top: 8px;
  display: block;
}

.stale-badge {
  display: inline-block;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cognac);
  margin-left: 6px;
}

/* Research/Learn index row (tape) */
.tape-row {
  display: grid;
  grid-template-columns: 110px 130px 1fr auto 80px;
  gap: 24px;
  align-items: baseline;
  padding: 18px 0;
  border-bottom: 1px solid var(--hairline);
  text-decoration: none;
  color: inherit;
  transition: background .1s;
}
.tape-row:hover { background: rgba(255,255,255,.02); }
.tape-row:hover .tape-row__title { color: var(--ink); }
.tape-row__meta {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-mute);
  letter-spacing: .04em;
}
.tape-row__title {
  font-size: 17px;
  line-height: 1.35;
  color: var(--ink);
  font-weight: 400;
}

/* ═══ Responsive ═════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .pillar-grid,
  .slab-grid { grid-template-columns: repeat(2, 1fr); }
  .slab-grid--5col { grid-template-columns: repeat(2, 1fr); }
  .slab-grid--3col { grid-template-columns: repeat(2, 1fr); }
  .crossref__list { grid-template-columns: repeat(2, 1fr); }
  .command-head { grid-template-columns: 1fr; gap: 32px; }
}

@media (max-width: 720px) {
  .doc { grid-template-columns: 1fr; gap: 32px; padding: 32px 20px 64px; }
  .rail { position: static; }
  .pillar-grid,
  .slab-grid,
  .slab-grid--5col,
  .slab-grid--3col,
  .slab-grid--2col,
  .crossref__list { grid-template-columns: 1fr; }
  .bridge-back__inner { grid-template-columns: 1fr; }
  .result-panel { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .atlas-foot__inner { grid-template-columns: 1fr; }
  .shell, .shell--wide { padding: 0 20px; }
  .page-head { padding: 32px 0 24px; }
  .page-head__title, .doc-title { font-size: 30px; }
  .display-xl { font-size: 36px; }
  .display-lg { font-size: 28px; }
  .masthead__inner { grid-template-columns: auto auto; gap: 16px; padding: 12px 20px; }
  .masthead__center { display: none; }
  .masthead__nav { font-size: 10px; gap: 16px; }
  .tape-row { grid-template-columns: 1fr; gap: 4px; }
  .tape-row__title { order: -1; }
}