/* bch2.org about page, v1 (/assets/editorial/about.v1.css)
   Loaded after bch2.v1.css on about.html only. Design-system tokens only; no new colours,
   fonts, radii, shadows or spacing values. Shared patterns (closing buttons, row-text links,
   the stratum token, prose measure, rows with typed numbers) live in bch2.v1.css. */

/* Overview table: no heading of its own. From 900px it spans the whole container as a register,
   so no empty intro column sits under the page heading: labels start on the h2 line and values
   on the section body line (split column 1 + column gap, the .split tracks). Below 900px the
   split is one column anyway and the table keeps the shared spec-table widths.
   The width is in container units: auto table layout ignores a calc() that mixes % and lengths. */
@media (min-width: 56.25rem) {
  .about-overview .split { grid-template-columns: minmax(0, 1fr); container-type: inline-size; }
  .about-overview .spec-table tbody th {
    width: calc((100cqi - clamp(2rem, 5vw, 4.5rem)) / 3.1 + clamp(2rem, 5vw, 4.5rem));
  }
}

/* "The Short Version": two lede paragraphs. */
.about-lede { display: grid; gap: var(--space-s); }
.about-lede .lede { max-width: 38rem; }
.about-lede strong { color: var(--ink); font-weight: 600; }

/* Exchange names in the "Trade it." sentence. The shared .exchange-name is inline-flex, whose
   baseline is the icon's bottom edge: in running text that lifted the name about 3px above the
   sentence and opened the line spacing. Here the link is inline, the icon sits on the text
   baseline like the plain .exchange-logo, and icon and name never break apart. */
.index-row__text .exchange-name { display: inline; white-space: nowrap; }
.index-row__text .exchange-name .exchange-logo { margin-inline-end: 0.5em; vertical-align: -0.25em; }
