/* IME Hub cross-sell block (/ime-hub/*). Added 2026-08-21.
   Shared so the markup stays small on 363 pages. Tokens mirror the site
   design system: Ink #16140F, Forest #2F6B50, Parchment #F4F2EC. */

.hub-xsell { margin: 46px 0 8px; }
.hub-xsell > h2 { margin: 0 0 8px; }
.hub-xsell .xs-lede {
  max-width: 62ch; margin: 0 0 22px;
  font-size: 15px; line-height: 1.62; color: #514E46;
}
.hub-xsell .xs-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
}
.hub-xsell .xs-card {
  display: flex; flex-direction: column; gap: 7px;
  background: #fff; border: 1px solid #E7E3D9; border-radius: 14px;
  padding: 18px 18px 16px; text-decoration: none; color: #16140F;
  box-shadow: 0 1px 2px rgba(22,20,15,.04);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.hub-xsell .xs-card:hover {
  transform: translateY(-2px); border-color: #D8D2C4;
  box-shadow: 0 6px 18px rgba(22,20,15,.07); text-decoration: none;
}
.hub-xsell .xs-card:focus-visible { outline: 2px solid #2F6B50; outline-offset: 3px; }
.hub-xsell .xs-k {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10px; font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; color: #6B6659;
}
.hub-xsell .xs-t {
  font-family: Newsreader, Georgia, serif; font-size: 18px;
  font-weight: 600; line-height: 1.28; letter-spacing: -.01em;
}
.hub-xsell .xs-d { font-size: 13.5px; line-height: 1.55; color: #514E46; }
.hub-xsell .xs-go {
  margin-top: auto; padding-top: 8px;
  font-size: 12.5px; font-weight: 600; color: #2F6B50;
}

.hub-xsell .xs-cta {
  margin-top: 18px; background: #16140F; border-radius: 16px;
  padding: 26px 28px; display: flex; flex-wrap: wrap;
  align-items: center; gap: 18px 26px;
}
.hub-xsell .xs-cta-copy { flex: 1 1 320px; min-width: 0; }
.hub-xsell .xs-cta-t {
  font-family: Newsreader, Georgia, serif; font-size: 21px;
  font-weight: 600; line-height: 1.3; color: #F7F5F0;
}
.hub-xsell .xs-cta-d {
  margin-top: 7px; font-size: 13.5px; line-height: 1.6;
  color: rgba(247,245,240,.68); max-width: 56ch;
}
.hub-xsell .xs-cta-a { display: flex; gap: 10px; flex: 0 0 auto; }
.hub-xsell .xs-primary, .hub-xsell .xs-secondary {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 11px 18px; border-radius: 10px;
  font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap;
}
.hub-xsell .xs-primary { background: #2F6B50; color: #fff; }
.hub-xsell .xs-primary:hover { background: #27593F; text-decoration: none; }
.hub-xsell .xs-secondary {
  background: transparent; color: #F7F5F0;
  border: 1px solid rgba(247,245,240,.30);
}
.hub-xsell .xs-secondary:hover { background: rgba(247,245,240,.08); text-decoration: none; }
.hub-xsell .xs-primary:focus-visible,
.hub-xsell .xs-secondary:focus-visible { outline: 2px solid #F7F5F0; outline-offset: 2px; }

@media (max-width: 860px) {
  .hub-xsell .xs-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .hub-xsell .xs-grid { grid-template-columns: 1fr; }
  .hub-xsell .xs-cta { padding: 22px 20px; }
  .hub-xsell .xs-cta-a { width: 100%; }
  .hub-xsell .xs-primary, .hub-xsell .xs-secondary { flex: 1 1 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hub-xsell .xs-card { transition: none; }
  .hub-xsell .xs-card:hover { transform: none; }
}

/* ── Before you sign: per-profile due-diligence checklist ───────────── */
.bc-lede{font-size:15.5px;line-height:1.68;color:#514E46;margin:0 0 22px;max-width:64ch}
.bc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.bc-list>li{display:block;padding:18px 0;border-top:1px solid #E6E1D6}
/* the page-level `section ol li` rule turns each question into a 3-column
   flex row and injects an ol counter; both are wrong here. */
.bc-list>li::before{content:none;display:none}
.bc-list>li:last-child{border-bottom:1px solid #E6E1D6}
.bc-q{font-family:Newsreader,Georgia,serif;font-size:19px;line-height:1.38;
  color:#16140F;margin-bottom:7px;text-wrap:balance}
.bc-why{font-size:14.5px;line-height:1.65;color:#514E46;max-width:66ch;margin-bottom:11px}
.bc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.bc-f,.bc-stat{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10.5px;letter-spacing:.06em;text-transform:uppercase}
.bc-f{color:#16140F;background:#F4F2EC;border:1px solid #E0DBD0;
  border-radius:5px;padding:3px 7px;white-space:nowrap}
.bc-stat{color:rgb(137,103,35);letter-spacing:.04em;text-transform:none;font-size:11.5px}
.bc-ours{font-size:13px;color:#2F6B50;text-decoration:none;border-bottom:1px solid #BFD6C8;
  padding-bottom:1px;margin-left:auto;white-space:nowrap;transition:border-color .15s ease}
/* below ~820px the auto margin pins this flush to the container edge with no
   gutter; drop it back into the flow rather than letting it touch the rail. */
@media (max-width:820px){.bc-ours{margin-left:0;white-space:normal}}
.bc-ours:hover{border-bottom-color:#2F6B50}
.bc-ours:focus-visible{outline:2px solid #2F6B50;outline-offset:3px;border-radius:2px}
@media (max-width:640px){
  .bc-q{font-size:17.5px}
  .bc-why{font-size:14px}
  .bc-ours{margin-left:0;white-space:normal}
  .bc-meta{gap:7px 10px}
}

/* Website field that is a statement rather than a link (site defunct, absorbed, unresolvable). */
.fact-note{color:#5A5648;font-style:italic}
.facts .fact-note{font-size:14px}

/* ===============================================================
   Hub → main-site design harmonisation. Added 2026-08-22.
   The hub pages carry their own inline layout CSS authored before
   the marketing pages settled on a house style. Everything below
   pulls them onto that house style without touching 363 files:
   this sheet loads last, and every rule here beats the page-level
   selector it corrects on specificity alone.
   =============================================================== */

/* --- 0. reveal fail-safe ----------------------------------------
   Every hub page carries an inline `html.js .reveal{opacity:0}` rule
   and used to un-hide everything on a blanket 2.2s timer. That timer
   is gone (it fired before the reader had scrolled anywhere), and the
   observer that replaced it lives in /scripts/reveal.js — which
   Cloudflare serves with a 4-hour max-age. A returning visitor on a
   stale copy would have hit a page whose content nothing un-hides.
   So: cancel the page-level gate outright, and re-apply it only when
   the current reveal.js has stamped html.reveal-io. No script, stale
   script, or failed observer all degrade to fully visible content. */
html.js .reveal{opacity:1;transform:none}
html.reveal-io .reveal{
  transition:opacity .7s cubic-bezier(.22,1,.36,1),
             transform .7s cubic-bezier(.22,1,.36,1);
}
html.reveal-io .reveal:not(.in){opacity:0;transform:translateY(24px)}
@media (prefers-reduced-motion:reduce){
  html.reveal-io .reveal:not(.in){opacity:1;transform:none}
}

/* --- 1. decorative numbering ---------------------------------
   "01 What it does / 02 Evaluation criteria" is not a sequence —
   nothing happens in that order. The numbers were ornament, and
   the TOC rendered them twice ("1. 01 What it does") because the
   <ol> marker and the <span class="n"> both fired. */
.sec-numbered > .sec-num,
.hub-main .sec-num { display: none; }
.toc ol { list-style: none; padding-left: 0; }
.toc ol > li > a > .n { display: none; }

/* --- 2. hero ---------------------------------------------------
   Main-site heroes are full-bleed with a large Newsreader display
   line. The hub wrapped its hero in a bordered, tinted, rounded
   card at 34px, which read as documentation rather than as the
   same company. Same ground, same scale, same rhythm. */
.hero {
  background: none;
  border: 0;
  border-radius: 0;
  padding: 4px 0 0;
  margin-bottom: 34px;
}
.hero > .hero-main > h1,
.hero h1 {
  font-size: 46px;
  line-height: 1.06;
  letter-spacing: -0.022em;
  text-wrap: balance;
  margin: 0 0 16px;
}
.hero .answer,
.hero > .hero-main > p.answer {
  font-size: 17px;
  line-height: 1.6;
  color: #514E46;
  max-width: 62ch;
}
.hero-meta-line { margin-top: 18px; }

@media (max-width: 900px) { .hero h1 { font-size: 38px; } }
@media (max-width: 640px) { .hero h1 { font-size: 31px; } }

/* ===============================================================
   Hub data visuals. Added 2026-08-22.
   The hub's whole editorial claim is that every field is either
   cited or marked unpublished — never estimated. These components
   make that claim visible instead of leaving it in prose. Each is
   built from the page's own facts, so no two pages draw the same
   picture, and nothing here is decoration: if a mark is on the
   page, some field on that page put it there.
   Markup stays tiny because this sheet carries all of it.
   =============================================================== */

/* --- shared shell ------------------------------------------------ */
.hv{margin:0 0 26px;padding:20px 22px 18px;background:#FCFBF8;
  border:1px solid #E6E1D6;border-radius:14px}
.hv-hd{display:flex;justify-content:space-between;align-items:baseline;
  gap:14px;margin:0 0 20px}
.hv-k{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:#16140F}
.hv-n{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;letter-spacing:.04em;color:rgb(137,103,35);white-space:nowrap}
.hv-cap{margin:16px 0 0;font-size:13.5px;line-height:1.62;color:#514E46;max-width:64ch}
.hv-cap b{color:#16140F;font-weight:600}

/* --- 1. disclosure distribution (318 vendor profiles) ------------ */
.vplot-chart{display:flex;align-items:flex-end;gap:5px;height:104px;
  border-bottom:1px solid #DDD8CC}
.vpb{position:relative;flex:1 1 0;min-width:0;height:100%;display:flex;align-items:flex-end}
.vpb i{display:block;width:100%;height:calc(var(--h) * 1%);min-height:2px;
  background:#E4E0D5;border-radius:3px 3px 0 0;
  transform-origin:50% 100%;
  transition:transform .78s cubic-bezier(.16,1,.3,1) calc(var(--i) * 55ms)}
.vpv{position:absolute;left:0;right:0;bottom:calc(var(--h) * 1% + 7px);
  text-align:center;line-height:1;
  font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:9.5px;color:#8C8778;
  transition:opacity .45s ease calc(var(--i) * 55ms + .3s)}
.vpb.is-here i{background:#2F6B50}
.vpb.is-here .vpv{color:#2F6B50;font-weight:600;font-size:10.5px}
.vplot-x{display:flex;gap:5px;margin-top:8px}
.vpx{flex:1 1 0;min-width:0;text-align:center;line-height:1.3;
  font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;color:#7C7768}
.vpx.is-here{color:#2F6B50;font-weight:600}
.vpx em{display:block;font-style:normal;font-size:8.5px;letter-spacing:.07em;
  text-transform:uppercase;color:rgb(137,103,35);margin-top:3px}
/* Progressive enhancement: full-height bars without JS, grown on reveal with it. */
html.reveal-io .vplot:not(.in) .vpb i{transform:scaleY(.02)}
html.reveal-io .vplot:not(.in) .vpv{opacity:0}

/* --- 2. jurisdiction rating basis (state guides) ----------------- */
.jgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(146px,1fr));gap:10px}
.jg{display:flex;flex-direction:column;gap:5px;padding:13px 14px;
  background:#fff;border:1px solid #E7E3D9;border-radius:11px;
  text-decoration:none;color:#16140F;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.jg:hover{border-color:#D2CBBB;box-shadow:0 5px 16px rgba(22,20,15,.06);
  transform:translateY(-2px);text-decoration:none}
.jg:focus-visible{outline:2px solid #2F6B50;outline-offset:3px}
.jg-s{font-family:Newsreader,Georgia,serif;font-size:19px;font-weight:600;
  line-height:1;letter-spacing:.01em}
.jg-p{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:#6B6659}
.jg-b{font-size:12.5px;line-height:1.4;color:#514E46;margin-top:2px}
.jg-r{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:6px}
.jg-r span{width:7px;height:7px;border-radius:2px;flex:0 0 auto}
.jg-r b{font-size:10.5px;font-weight:500;color:#6B6659}
.jg.is-here{border-color:#2F6B50;background:#F6F9F7;box-shadow:inset 0 0 0 1px #2F6B50}
.jg.is-here:hover{transform:none}
.jg.is-here .jg-s{color:#2F6B50}
/* scope the swatch colour to the legend dot — .jg-s/.jg-p/.jg-b are spans too */
.r-a5 .jg-r span{background:#2F6B50}
.r-a6 .jg-r span{background:#3E8862}
.r-ag .jg-r span{background:#B7892F}
.r-st .jg-r span{background:#8C7BB0}
.r-nc .jg-r span{background:#C6C0B2}

/* --- 3. contrast spine (compare pages) --------------------------- */
.vsplit{display:flex;flex-direction:column;gap:0}
.vs-row{display:grid;grid-template-columns:1fr;gap:4px;padding:15px 0;
  border-top:1px solid #E6E1D6}
.vs-row:first-child{border-top:0;padding-top:2px}
.vs-k{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:rgb(137,103,35)}
.vs-v{font-size:14.5px;line-height:1.62;color:#2B2822;max-width:70ch}
.vs-v b{color:#16140F}

/* --- 4. directory scale (directory pages) ------------------------ */
.dscale{display:flex;flex-direction:column;gap:9px}
.ds{display:grid;grid-template-columns:minmax(0,1fr) 3.2fr auto;gap:12px;
  align-items:center;text-decoration:none;color:#16140F;padding:3px 0;
  border-radius:6px}
.ds:hover .ds-n{text-decoration:underline;text-underline-offset:3px}
.ds:focus-visible{outline:2px solid #2F6B50;outline-offset:3px}
.ds-n{font-size:13.5px;line-height:1.35;color:#2B2822}
.ds-t{height:9px;background:#EFEBE1;border-radius:5px;overflow:hidden}
.ds-t i{display:block;height:100%;width:calc(var(--w) * 1%);background:#D5CFC0;
  border-radius:5px;transform-origin:0 50%;
  transition:transform .8s cubic-bezier(.16,1,.3,1) calc(var(--i) * 70ms)}
.ds.is-here .ds-t i,
/* lists are sorted descending, so first-child is the leader — worth marking */
.dscale > .ds:first-child .ds-t i{background:#2F6B50}
.dscale > .ds:first-child .ds-v{color:#2F6B50;font-weight:600}
.ds.is-here .ds-n{color:#16140F;font-weight:600}
.ds-v{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11.5px;color:#6B6659;font-variant-numeric:tabular-nums}
.ds.is-here .ds-v{color:#2F6B50;font-weight:600}
html.reveal-io .hv:not(.in) .ds-t i{transform:scaleX(.01)}

/* --- 5. edition / event timeline --------------------------------- */
.htl{position:relative;display:flex;flex-direction:column;gap:0;
  padding-left:22px}
.htl::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;
  width:1px;background:#E0DBD0}
.htl-i{position:relative;padding:12px 0}
.htl-i::before{content:"";position:absolute;left:-22px;top:18px;
  width:9px;height:9px;border-radius:50%;background:#fff;
  border:2px solid #C6C0B2}
.htl-i.is-now::before{border-color:#2F6B50;background:#2F6B50}
.htl-d{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10.5px;letter-spacing:.07em;color:rgb(137,103,35)}
.htl-t{font-family:Newsreader,Georgia,serif;font-size:17.5px;font-weight:600;
  line-height:1.3;margin:3px 0 4px;color:#16140F}
.htl-p{font-size:13.5px;line-height:1.6;color:#514E46;max-width:66ch}

/* --- 6. rubric coverage comparison (compare pages) --------------- */
.vcmp{display:flex;flex-direction:column}
.vc{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 16px;
  align-items:center;padding:14px 0;border-top:1px solid #E6E1D6;
  text-decoration:none;color:#16140F}
.vc:first-child{border-top:0;padding-top:2px}
.vc:hover .vc-n{text-decoration:underline;text-underline-offset:3px;text-decoration-color:#BFD6C8}
.vc:focus-visible{outline:2px solid #2F6B50;outline-offset:3px;border-radius:4px}
.vc-n{font-family:Newsreader,Georgia,serif;font-size:17px;font-weight:600;
  line-height:1.28;letter-spacing:-.005em;min-width:0}
.vc-c{display:flex;gap:4px}
.vc-c b{display:block;width:16px;height:16px;border-radius:4px;
  background:#EAE6DC;box-shadow:inset 0 0 0 1px #DFDACE;
  transform-origin:50% 50%;
  transition:transform .5s cubic-bezier(.16,1,.3,1) calc(var(--i) * 45ms)}
.vc-c b.on{background:#2F6B50;box-shadow:none}
.vc-v{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11.5px;color:#6B6659;font-variant-numeric:tabular-nums;white-space:nowrap}
.vc-legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px;
  padding-top:13px;border-top:1px solid #E6E1D6}
.vc-legend span{display:flex;align-items:center;gap:7px;
  font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#6B6659}
.vc-legend i{width:11px;height:11px;border-radius:3px;background:#EAE6DC;
  box-shadow:inset 0 0 0 1px #DFDACE}
.vc-legend i.on{background:#2F6B50;box-shadow:none}
html.reveal-io .hv:not(.in) .vc-c b{transform:scale(.3)}
@media (max-width:640px){
  .vc{grid-template-columns:minmax(0,1fr) auto}
  .vc-c{grid-column:1 / -1;order:3}
  .vc-c b{width:14px;height:14px}
}
@media (prefers-reduced-motion:reduce){
  .vc-c b{transition:none}
  html.reveal-io .hv:not(.in) .vc-c b{transform:none}
}

@media (max-width:640px){
  .hv{padding:16px 15px 14px}
  .hv-hd{flex-direction:column;gap:5px}
  .vplot-chart{height:88px;gap:3px}
  .vplot-x{gap:3px}
  .vpx em{display:none}
  .ds{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px}
  .ds-t{grid-column:1 / -1;order:3}
}
@media (prefers-reduced-motion:reduce){
  .vpb i,.vpv,.ds-t i{transition:none}
  html.reveal-io .vplot:not(.in) .vpb i{transform:none}
  html.reveal-io .vplot:not(.in) .vpv{opacity:1}
  html.reveal-io .hv:not(.in) .ds-t i{transform:none}
  .jg:hover{transform:none}
}

/* ===============================================================
   Prose out of monospace. Added 2026-08-23.
   Rule 10 of the house style reserves IBM Plex Mono for eyebrows
   and chips. Three hub components broke that and set whole
   sentences in letterspaced mono, which is what made the article
   pages read as a terminal dump next to the marketing pages.
   The short labels beside them stay mono — they are data, and
   that contrast is the point.
   =============================================================== */

/* "83% of all profiled vendors leave this unpublished" — a sentence,
   not a label. Body face, muted, with the figure kept prominent. */
.bc-stat,
.convb-hook,
.hint{
  font-family:Newsreader,Georgia,'Times New Roman',serif;
  letter-spacing:normal;
  text-transform:none;
}
.bc-stat{font-size:14px;line-height:1.5;color:#6B6659}
.convb-hook{font-size:15px;line-height:1.6;color:#514E46}
.hint{font-size:13.5px;line-height:1.6;color:#6B6659}

/* --- "Before you sign" rows -------------------------------------
   Was one flex line: mono chip, mono sentence, then a nowrap link
   shoved right with margin-left:auto. At any width where the three
   did not fit, the link ran into the card edge. Two explicit rows
   instead — label and finding together, our answer beneath. */
.bc-meta{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;
  gap:7px 11px;
}
.bc-ours{
  grid-column:1 / -1;
  justify-self:start;
  margin-left:0;
  white-space:normal;
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:3px;
  padding:5px 11px;
  border:1px solid #CFE0D5;
  border-bottom:1px solid #CFE0D5;
  border-radius:999px;
  background:#F4F8F5;
  font-size:13px;
  line-height:1.35;
  color:#2F6B50;
  transition:background .16s ease,border-color .16s ease;
}
.bc-ours::after{content:"→";font-size:12.5px;line-height:1}
.bc-ours:hover{background:#EAF2ED;border-color:#A9C4B2;text-decoration:none}
@media (max-width:640px){
  .bc-meta{grid-template-columns:minmax(0,1fr)}
  .bc-stat{font-size:13.5px}
}

/* --- nav parity with the marketing pages -------------------------
   The hub shipped Compare/Security/IME Hub with a single dark
   "Book a demo" button; the rest of the site runs
   Compare/IME Hub/Security with a light "Book a demo" beside a dark
   "Test a file". Link order and the second CTA are fixed in the
   markup; these two rules match the button styling exactly.
   mobile.css already hides Sign in and the /test-a-file/ button
   below 1080px, and picks them up here by attribute selector. */
.nav-demo{
  display:inline-flex;align-items:center;
  padding:9px 15px;border-radius:10px;
  background:#fff;color:#3A3833;
  font-size:14px;font-weight:550;
  border:1px solid #E4E0D6;
  text-decoration:none;white-space:nowrap;
  box-shadow:0 1px 2px rgba(22,20,15,.04);
}
.nav-demo:hover{color:#16140F;border-color:#D2CBBB;text-decoration:none}
.nav-test{padding:9px 17px}

/* ===============================================================
   Body typeface parity with the marketing pages. Added 2026-08-23.
   This is the single biggest reason the hub read as a different,
   older site: every hub page sets
     html,body{font-family:Georgia,'Times New Roman',serif}
   so all 363 of them render body copy, table cells, card text and
   labels in Georgia. The 214 marketing pages run a system sans
   stack and reserve Newsreader for display headings only. Two
   typographic worlds, one domain. hub.css loads after the page's
   inline <style>, so a plain `body` selector at equal specificity
   wins on order alone — no edits to 363 files.
   Headings keep Newsreader because they declare it themselves.
   =============================================================== */
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
              Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
/* Two components hard-coded Georgia and so would have survived the
   change: a card title that belongs in the display face, and a form
   control that belongs in the interface face. */
.explore-card h3{font-family:Newsreader,Georgia,'Times New Roman',serif;font-weight:600}
.dir-filter{font-family:inherit}

/* Yesterday these three were pulled out of monospace and parked in
   Newsreader, because Newsreader was the only non-Georgia face on the
   page. With the body face fixed they belong in it, like every other
   run of small prose on the marketing pages. */
.bc-stat,.convb-hook,.hint{font-family:inherit}
.bc-stat{font-size:13.5px}
.hint{font-size:13px}

/* --- tables ------------------------------------------------------
   A 1px box around every single cell, a tan header band and zebra
   striping is the other half of the dated look, and `.facts` is not
   tabular data at all — it is a label/value list of eleven fields
   rendered as a spreadsheet. Horizontal hairlines only, no fill on
   alternating rows, header reduced to a mono label like every other
   section label on the site. */
main table{
  border-collapse:separate;border-spacing:0;
  font-size:14.5px;
}
main th,main td{
  border:0;
  border-top:1px solid #ECE7DD;
  padding:12px 16px;
  vertical-align:top;
}
main thead tr:first-child th,
main tr:first-child > th,
main tr:first-child > td{border-top:0}
main th{
  background:none;
  font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:10.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:#6C685E;
  padding-top:14px;padding-bottom:10px;
  border-bottom:1px solid #E7E3D9;
}
main table.dir tr:nth-child(even){background:none}
main table.dir tbody tr:hover{background:#FAF9F5}
main table.dir th{
  background:#fff;
  border-bottom:1px solid #E7E3D9;
}

/* .facts: label column set as a quiet mono label rather than a column
   of forest-green shouting, and the wrapping <p> inside each cell had
   its own 12px margins fighting the cell padding. */
.facts{
  width:100%;
  border:1px solid #E7E3D9;border-radius:14px;
  background:#fff;box-shadow:0 1px 2px rgba(22,20,15,.04);
  overflow:hidden;margin:18px 0;
}
.facts td{padding:13px 18px}
.facts td:first-child{
  width:190px;
  font-size:10.5px;letter-spacing:.1em;
  color:#6C685E;
  padding-top:15px;
}
.facts td p{margin:0;line-height:1.55}
.facts td p + p{margin-top:7px}
.facts-unpub td{font-size:12.5px;letter-spacing:normal}
.facts-unpub td:first-child{letter-spacing:.1em;font-size:10.5px}

@media (max-width:640px){
  .facts td:first-child{width:130px;padding-right:10px}
  main th,main td{padding:11px 13px}
  .facts td{padding:11px 14px}
}

/* Half-rounded pull quotes read as a 2011 blog widget. Flat left rule,
   no fill, which is how quotations are set on the marketing pages. */
blockquote{
  background:none;
  border-left:2px solid #CFE0D6;
  border-radius:0;
  padding:2px 0 2px 18px;
  color:#514E46;
}
