/* Owner Universe v6, Night desk. Shared chrome (masthead, footer, draft banner), home page, pricing page.
   One ground, one accent. Fraunces for h1 and h2 only; Instrument Sans for everything else.
   No shadows, no glass, no gradients, no glow. Nothing under 14px. Radius 0 on panels.
   Round 3 (2026-11-10): two --raised bands per page at most; one uppercase label per page at most (pricing,
   "Start here"); one heading scale; one label column (12.5rem) on every label and value table. */

@font-face {
  font-family: "Instrument Sans";
  src: url("../fonts/instrument-sans/InstrumentSans.woff2") format("woff2"), url("../fonts/instrument-sans/InstrumentSans.woff") format("woff");
  font-weight: 400 700;
  font-style: normal;
  font-display: optional;
}

@font-face {
  font-family: "Fraunces";
  src: url("../fonts/fraunces/Fraunces.woff2") format("woff2"), url("../fonts/fraunces/Fraunces.woff") format("woff");
  font-weight: 300 700;
  font-style: normal;
  font-display: optional;
}

/* Sized fallbacks so the swap moves nothing. Instrument Sans value carried from v5. The Fraunces value is
   a first estimate against Georgia; measure it in the capture step and adjust. */
@font-face {
  font-family: "Instrument Sans fallback";
  src: local("Arial"), local("ArialMT"), local("Helvetica"), local("Liberation Sans");
  size-adjust: 103.25%;
  ascent-override: 93.95%;
  descent-override: 24.21%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "Fraunces fallback";
  src: local("Georgia");
  size-adjust: 96%;
  ascent-override: 98%;
  descent-override: 26%;
}

:root {
  --bg: #f4f1ea; /* Round 7b ink and paper: the paper ground */
  --raised: #ebe6da; /* the sunk paper bands */
  --ink: #121a26;
  --ink-2: #3a4250;
  --ink-3: #525a66; /* 6.18:1 on paper, 5.6:1 on the sunk paper */
  --rule: #827f77; /* 3.55:1 on paper, 3.21:1 on the sunk paper */
  --rule-strong: #827f77;
  --accent: #13213a; /* navy */
  --on-accent: #f4f1ea;
  --set-aside: #525a66; /* set-aside squares and removed segments on paper */
  --label: 12.5rem; /* the one label column */

  --serif: "Fraunces", "Fraunces fallback", Georgia, serif;
  --sans: "Instrument Sans", "Instrument Sans fallback", Arial, sans-serif;

  --read: 1.125rem;
  --ui: 0.9375rem;
  --fine: 0.875rem; /* the smallest text anywhere: 14px */

  --wrap: 82rem;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --gap: clamp(4rem, 8vw, 7rem);
  --col-gap: clamp(1rem, 2vw, 2rem);
  --mast-h: 4.0625rem;
  --nav-h: 2.75rem; /* plus its 1px rule: under 3rem */
  --mast-total: var(--mast-h);
  --target: 2.75rem;
  --radius: 0;

  color-scheme: light;
}

/* Base */

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

html {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: calc(var(--mast-total) + 1rem);
}

body {
  margin: 0;
  font-size: 1rem;
  line-height: 1.55;
  font-variant-numeric: lining-nums tabular-nums;
}

p,
ul,
ol,
figure {
  margin: 0;
}

p,
li,
dd,
figcaption {
  text-wrap: pretty;
}

h1,
h2 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 500;
  letter-spacing: -0.015em;
  text-wrap: balance;
  color: var(--ink);
  font-variation-settings: "opsz" 36, "SOFT" 0, "WONK" 0;
}

/* The h1 is capped at 3.5rem, tracking 0, on every page and in both languages. */
h1 {
  font-size: 3.5rem;
  line-height: 1.08;
  letter-spacing: 0;
}

h2 {
  font-size: 2.25rem;
  line-height: 1.08;
}

h3 {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.3;
  text-wrap: balance;
}

a {
  color: var(--ink);
  text-decoration-line: underline;
  text-decoration-color: var(--rule-strong);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
}

a:hover {
  text-decoration-color: var(--ink);
}

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

td,
th {
  font-variant-numeric: lining-nums tabular-nums;
}

.wrap {
  width: min(var(--wrap), 100% - 2 * var(--gutter));
  margin-inline: auto;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.skip {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 20;
  padding: 0.75rem 1rem;
  background: var(--ink);
  color: var(--bg);
  font-weight: 600;
  transform: translateY(-200%);
}

.skip:focus-visible {
  transform: none;
}

.nowrap {
  white-space: nowrap;
}

.muted {
  color: var(--ink-3);
  font-size: var(--fine);
}

/* Prices. Both figures are in the markup; the stylesheet shows one by html[data-cur]. Term totals only:
   no monthly figure, no per conversation figure, no arithmetic of any kind. */

[data-cur="USD"] .price > [data-cur="CAD"],
[data-cur="CAD"] .price > [data-cur="USD"] {
  display: none;
}

.price {
  white-space: nowrap;
}

/* Buttons */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--target);
  padding: 0 1.375rem;
  border: 1px solid var(--accent);
  border-radius: 0;
  background: var(--accent);
  color: var(--on-accent);
  font: 600 1rem/1.15 var(--sans);
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

.btn:hover {
  text-decoration-line: underline;
  text-decoration-color: var(--on-accent);
  text-underline-offset: 0.2em;
}

.btn--small {
  padding: 0 0.875rem;
  font-size: var(--ui);
}

.btn--ghost {
  border-color: var(--rule-strong);
  background: transparent;
  color: var(--ink);
}

.btn--ghost:hover {
  text-decoration-color: var(--ink);
}

/* Currency switch: a small text control, two words. The pressed one in --ink at 600 with a 1px amber
   underline, the other in --ink-2 at 400: state reads by weight and underline, not colour alone. The hit area
   is 2.75rem tall through padding and equal negative margins, so the control never opens the line. */

.cur-switch {
  display: inline-flex;
  flex: none;
  align-items: baseline;
  gap: 0;
  vertical-align: baseline;
}

.cur-switch button {
  margin: -0.75rem 0;
  padding: 0.75rem 0.5rem;
  border: 0;
  background: transparent;
  color: var(--ink-2);
  font: 400 var(--ui)/1.25rem var(--sans);
  letter-spacing: 0.02em;
  cursor: pointer;
}

.cur-switch button + button {
  background: linear-gradient(var(--rule-strong), var(--rule-strong)) left center / 1px 0.875rem no-repeat;
}

.cur-switch button[aria-pressed="true"] {
  color: var(--ink);
  font-weight: 600;
  text-decoration-line: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.35em;
}

.cur-switch button[aria-pressed="false"]:hover {
  color: var(--ink);
}

.cur-switch button:focus-visible {
  outline-offset: -2px;
}

/* Masthead. One row of 4.0625rem from 70em up. Below 70em two rows of fixed height (4.0625rem, then the
   page links in a 2.75rem row that scrolls sideways rather than wraps), so the height never depends on
   the text and anchors clear it through --mast-total. */

.masthead {
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--bg);
  border-bottom: 1px solid var(--rule);
}

.masthead__row {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  height: var(--mast-h);
}

.wordmark {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 0.625rem;
  min-height: var(--target);
  color: var(--ink);
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  text-decoration: none;
  white-space: nowrap;
}

.wordmark__mark {
  width: 1.75rem;
  height: 1.4rem;
  color: var(--ink-3);
}

.wordmark__slash {
  stroke: var(--ink);
}

.masthead nav {
  margin-left: auto;
}

.nav {
  display: flex;
  gap: 0.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav a {
  display: inline-flex;
  align-items: center;
  min-height: var(--target);
  padding: 0 0.75rem;
  color: var(--ink-2);
  font-size: var(--ui);
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

.nav a:hover {
  color: var(--ink);
}

.nav a[aria-current="page"] {
  color: var(--ink);
  text-decoration-line: underline;
  text-decoration-color: var(--ink);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.45em;
}

.masthead__switch {
  display: flex;
  flex: none;
  align-items: center;
}

.masthead__switch:empty {
  display: none;
}

.masthead__switch a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--target);
  min-height: var(--target);
  color: var(--ink-2);
  font-size: var(--ui);
  font-weight: 600;
  text-decoration: none;
}

.masthead__switch a + a {
  background: linear-gradient(var(--rule-strong), var(--rule-strong)) left center / 1px 1rem no-repeat;
}

.masthead__switch a:hover {
  color: var(--ink);
}

.masthead__switch a[aria-current] {
  color: var(--ink);
}

.masthead__cta,
.masthead__cta:empty {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: flex-end;
  min-width: 7rem;
  min-height: var(--target);
}

@media (max-width: 70em) {
  :root {
    --mast-total: calc(var(--mast-h) + var(--nav-h) + 1px);
  }

  .masthead__row {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) auto auto;
    grid-template-rows: var(--mast-h) var(--nav-h);
    column-gap: 0.5rem;
    height: auto;
  }

  .masthead__row > .wordmark {
    grid-column: 1;
    grid-row: 1;
  }

  .masthead__switch {
    grid-column: 3;
    grid-row: 1;
  }

  .masthead__cta {
    grid-column: 4;
    grid-row: 1;
  }

  .masthead__row > nav {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 0 calc(-1 * var(--gutter));
    padding: 0 var(--gutter);
    border-top: 1px solid var(--rule);
  }

  .masthead__row > nav .nav {
    flex-wrap: wrap;
    column-gap: 0;
  }

  .nav a {
    min-height: var(--nav-h);
    padding: 0 0.625rem;
  }

  .nav li:first-child a {
    padding-left: 0;
  }
}

/* Phones: EN and FR both show, the current one in --ink, the other in --ink-2, a hairline between.
   Links are 2.25rem wide and 2.75rem tall so the first row holds the tally mark, the wordmark, the switch and
   the button at 390 in both languages. The first row is 3.5rem: no dead band under it. */
@media (max-width: 40em) {
  :root {
    --mast-h: 3.5rem;
  }

  .masthead__row {
    column-gap: 0.25rem;
  }

  .masthead__switch a {
    min-width: 2.25rem;
  }

  .wordmark {
    gap: 0.375rem;
    font-size: 0.9375rem;
  }

  .wordmark__mark {
    width: 1.5rem;
  }

  html:lang(fr) .masthead__switch a {
    min-width: 2rem;
  }

  html:lang(fr) .masthead__cta .btn {
    padding-inline: 0.5rem;
    font-size: var(--fine);
  }

  .masthead__cta .btn {
    padding-inline: 0.625rem;
  }
}

/* Phone menu (round 8, 2026-11-10: the first row overflowed a 360 px screen by 8 to 16 px). site.js adds the Menu
   button and .masthead--menu: under 40em the first row holds the wordmark, EN/FR and the button; the page links and
   the call button open below it. Without a script the page links stay a wrapped list under the first row and the
   call button sits under them, so nothing is lost and nothing overflows. */
.nav-toggle {
  display: none;
}

@media (max-width: 40em) {
  .masthead__row {
    grid-template-columns: max-content minmax(0, 1fr) auto;
    grid-template-rows: var(--mast-h) auto auto;
  }

  .masthead__row > nav {
    margin: 0;
    padding: 0;
  }

  .masthead__cta,
  .masthead__cta:empty {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-content: flex-start;
    min-width: 0;
    padding-bottom: 0.75rem;
  }

  .masthead__cta:empty {
    display: none;
  }

  :root:has(.masthead--menu) {
    --mast-total: calc(var(--mast-h) + 1px);
  }

  .masthead--menu .masthead__row {
    grid-template-columns: max-content minmax(0, 1fr) auto auto;
  }

  .masthead--menu .nav-toggle {
    display: inline-flex;
    grid-column: 4;
    grid-row: 1;
    align-items: center;
    justify-content: center;
    min-width: var(--target);
    min-height: var(--target);
    margin: 0;
    padding: 0 0.75rem;
    border: 1px solid var(--rule-strong);
    border-radius: 0;
    background: transparent;
    color: var(--ink);
    font: inherit;
    font-size: var(--ui);
    font-weight: 600;
    cursor: pointer;
  }

  .masthead--menu .nav-toggle[aria-expanded="true"] {
    border-color: var(--ink);
  }

  .masthead--menu .masthead__row > nav,
  .masthead--menu .masthead__cta {
    display: none;
  }

  .masthead--menu.is-open .masthead__row > nav {
    display: block;
  }

  .masthead--menu.is-open .masthead__cta {
    display: flex;
  }

  .masthead--menu.is-open .nav {
    flex-direction: column;
  }

  .masthead--menu.is-open .nav li + li {
    border-top: 1px solid var(--rule);
  }

  .masthead--menu.is-open .nav a {
    display: flex;
    padding-left: 0;
  }

  .masthead--menu.is-open .masthead__cta {
    padding-top: 0.5rem;
  }
}

/* Currency before currency.js runs (round 8: the script loads with defer). The first paint shows the US figure, the
   one currency.js sets by default; the noscript style on the priced pages still shows both. */
html:not([data-cur]) .price > [data-cur="CAD"] {
  display: none;
}


/* Sections. Quiet by default. Two moments change the pace: the count reconciliation on home (the number moment,
   on a --raised band) and the guarantee band on pricing (the one large sentence). The pricing fees sit on the other
   --raised band. Every other section is on --bg. */

main {
  padding-bottom: var(--gap);
}

.home-sec,
.sec {
  padding-top: var(--gap);
}

.home-h2,
.sec__title,
.home-plate__title {
  margin-bottom: 2rem;
}

.lede,
.home-sec__lede {
  max-width: 44rem;
  color: var(--ink-2);
  font-size: var(--read);
  line-height: 1.55;
}

.home-sec__lede {
  margin: -0.75rem 0 2rem;
}

.home-link,
.textlink {
  color: var(--ink);
}

[hidden] {
  display: none !important;
}

/* Tables, shared. Headers in --ink-2 at 14px; every cell at the same weight. */

.home-scroll {
  max-width: 100%;
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1rem;
  line-height: 1.45;
}

caption {
  padding-bottom: 0.875rem;
  color: var(--ink-2);
  font-size: var(--ui);
  text-align: left;
  caption-side: top;
}

thead th {
  padding: 0 0.875rem 0.625rem 0;
  border-bottom: 1px solid var(--rule-strong);
  color: var(--ink-2);
  font-size: var(--fine);
  font-weight: 600;
  text-align: left;
  vertical-align: bottom;
}

tbody th,
tbody td {
  padding: 0.75rem 0.875rem 0.75rem 0;
  border-bottom: 1px solid var(--rule);
  text-align: left;
  vertical-align: top;
}

tbody th {
  font-weight: 600;
}

.is-num,
thead .is-num {
  text-align: right;
}

/* Prices: one style on both pages, wherever the four totals appear. */

.plan__price {
  font-family: var(--serif);
  font-size: 2.25rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.015em;
  font-variation-settings: "opsz" 36, "SOFT" 0, "WONK" 0;
}

/* Home: the opening screen at 1440. Left, seven columns: the h1, who it is for, the offer with its price, the
   currency control on its own line, the guarantee, the date, then the button and the two links on one baseline.
   Right, five columns: the map, its top on the h1's first baseline, every county labelled, the legend, the caption
   under the map, then the Nashville paragraph. */

.home-open {
  padding-top: 1.5rem;
}

.home-open > .wrap {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--col-gap);
  align-items: start;
}

.home-open__grid {
  display: contents;
}

.home-h1 {
  grid-column: 1 / 8;
  grid-row: 1;
}


.home-open__body {
  grid-column: 1 / 8;
  grid-row: 2;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 1.75rem;
  align-items: baseline;
  max-width: 40rem;
  margin-top: 1.25rem;
}

.home-open__body > * {
  grid-column: 1 / -1;
}

.home-for {
  color: var(--ink);
  font-size: var(--read);
  line-height: 1.55;
}

.home-offer-row {
  margin-top: 0.875rem;
}

.home-offer {
  color: var(--ink);
  font-size: var(--read);
  line-height: 1.55;
}

.home-offer .price {
  font-weight: 600;
}

/* The currency control: its own line under the sentence that states the price, flush with the text, 1rem above and
   below. The same on pricing, under the lede. */
.home-offer-row .cur-switch,
.pagehead .cur-switch {
  display: flex;
  margin-block: 0.75rem 0.875rem;
  margin-left: -0.5rem;
}

.home-line.home-line--key {
  display: block;
  margin-top: 0.25rem;
  padding: 1rem 0 0;
  border-top: 1px solid var(--rule);
  border-bottom: 0;
}

.home-line__k {
  margin-bottom: 0.25rem;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 700;
}

.home-line--key p:last-child {
  max-width: 36rem;
  font-size: var(--read);
  line-height: 1.5;
}

.home-open [data-checked] {
  margin-top: 0.75rem;
  color: var(--ink-3);
  font-size: var(--fine);
}

.home-act {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.75rem 1rem;
}

.home-open__body > .home-act {
  grid-column: 1;
  margin-top: 1.25rem;
}

.home-act__links {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 1.5rem;
  padding: 0;
  list-style: none;
}

.home-open__body > .home-act__links {
  grid-column: 2;
  margin-top: 1.25rem;
}

.home-act__links a {
  display: inline-block;
  font-size: 1rem;
  line-height: 1.35;
}

.home-open__map {
  grid-column: 8 / 13;
  grid-row: 1 / 3;
  /* the map's top sits on the h1's first baseline; the h2 above it rises above the h1's top to make the room */
  margin-top: var(--map-lift, -0.375rem);
}

.home-plate__title {
  margin-bottom: 1rem;
}

.map-fig {
  margin: 0;
}

.map-plot {
  position: relative;
}

.map-plot--wide {
  display: none;
}

.map-plot--tall {
  display: block;
}

.map-svg {
  display: block;
  width: 100%;
  height: auto;
}

.map-unk {
  fill: var(--accent);
}

/* Set-aside squares: smaller (70% of a firm square) and outlined, 1px, in --set-aside. */
.map-nat {
  fill: none;
  stroke: var(--set-aside);
  stroke-width: 1px;
  vector-effect: non-scaling-stroke;
}

.map-labs {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.map-lab {
  position: absolute;
  transform: translateY(-100%);
  padding-bottom: 0.125rem;
  color: var(--ink-2);
  font-size: var(--fine);
  line-height: 1.2;
  white-space: nowrap;
}

.map-lab__n {
  color: var(--ink);
  font-weight: 600;
}

/* The legend names the meaning, with the counts. */
.map-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem 1.75rem;
  margin-top: 1.25rem;
  padding: 0;
  list-style: none;
  color: var(--ink);
  font-size: var(--ui);
}

.map-legend li {
  display: flex;
  align-items: center;
}

.map-legend [data-count] {
  margin-left: 0.3em;
  font-weight: 600;
}

.home-sw {
  display: inline-block;
  flex: none;
  width: 0.625rem;
  height: 0.625rem;
  margin-right: 0.5rem;
  background: var(--accent);
}

.home-sw--nat {
  width: 0.4375rem;
  height: 0.4375rem;
  margin-inline: 0.09375rem 0.59375rem;
  border: 1px solid var(--set-aside);
  background: none;
}

.home-cap .home-sw {
  display: none;
}

.map-rank {
  display: none;
}

.home-cap {
  margin-top: 1rem;
  color: var(--ink-2);
  font-size: var(--fine);
  line-height: 1.55;
}

.home-open__map .lede {
  max-width: none;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--rule);
  font-size: 1rem;
}

/* The one load reveal: the dots arrive county by county. transform and opacity only, 280ms, ease out. */

@media (prefers-reduced-motion: no-preference) {
  .map-svg > g {
    animation: ou-dots 280ms ease-out both;
  }

  .map-svg > g:nth-child(2) { animation-delay: 40ms; }
  .map-svg > g:nth-child(3) { animation-delay: 80ms; }
  .map-svg > g:nth-child(4) { animation-delay: 120ms; }
  .map-svg > g:nth-child(5) { animation-delay: 160ms; }
  .map-svg > g:nth-child(6) { animation-delay: 200ms; }
  .map-svg > g:nth-child(7) { animation-delay: 240ms; }
  .map-svg > g:nth-child(8) { animation-delay: 280ms; }
  .map-svg > g:nth-child(9) { animation-delay: 320ms; }
  .map-svg > g:nth-child(10) { animation-delay: 360ms; }
  .map-svg > g:nth-child(11) { animation-delay: 400ms; }
  .map-svg > g:nth-child(12) { animation-delay: 440ms; }
  .map-svg > g:nth-child(13) { animation-delay: 480ms; }
  .map-svg > g:nth-child(14) { animation-delay: 520ms; }
}

@keyframes ou-dots {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
}

/* The count reconciliation: the number moment, on a full-bleed --raised band. Its title is the section h2. A real
   table: every row carries its label with an amber bar scaled to the running total, the records it holds or removed,
   and the running total in Fraunces. */

.home-count {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: clamp(3.5rem, 6vw, 5rem);
  padding-block: clamp(3rem, 5vw, 4rem);
  background: var(--raised);
  box-shadow: 0 0 0 100vmax var(--raised);
  clip-path: inset(0 -100vmax);
}

.home-count__title {
  max-width: 24ch;
  margin-bottom: 0.75rem;
}

.home-count__note {
  max-width: 48rem;
  margin-bottom: 2rem;
  color: var(--ink-2);
  font-size: 1rem;
}

.home-count .home-scroll {
  overflow: visible;
}

.home-funnel {
  table-layout: fixed;
}

.home-funnel thead th:first-child {
  width: 54%;
}

.home-funnel thead th:nth-child(2) {
  width: 18%;
}

.home-funnel tbody {
  display: table-row-group;
}

.home-funnel tbody tr {
  display: table-row;
}

.home-funnel tbody th,
.home-funnel tbody td {
  padding: 1.25rem 1.5rem 1.5rem 0;
  vertical-align: middle;
}

.home-funnel tbody td:last-child {
  padding-right: 0;
}

.home-funnel tbody th {
  font-size: var(--read);
  font-weight: 500;
  line-height: 1.35;
  background: linear-gradient(
      to right,
      var(--accent) 0 calc(var(--run, 1) * 100% - 2px),
      transparent 0 calc(var(--run, 1) * 100% + 2px),
      var(--set-aside) 0 calc((var(--run, 1) + var(--cut, 0)) * 100%),
      transparent 0
    )
    left bottom 0.625rem / calc(100% - 1.5rem) 0.375rem no-repeat;
}

.home-funnel td:nth-child(2) {
  color: var(--ink-2);
  font-size: 1rem;
  white-space: nowrap;
}

.home-funnel td:last-child {
  font-family: var(--serif);
  font-variation-settings: "opsz" 36, "SOFT" 0, "WONK" 0;
  font-size: 2.75rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.015em;
  color: var(--ink);
}

.home-funnel tr.is-total td:last-child {
  color: var(--accent);
}

.home-funnel tbody tr:last-child th,
.home-funnel tbody tr:last-child td {
  border-bottom: 1px solid var(--rule-strong);
}

/* Home: one firm from the list. The paragraph on what the paid work adds above both; the list at left with its
   link directly under it; the sample card at right, the slot for one page of the real sample brief. Tops aligned. */

section[aria-labelledby="row-title"] > .wrap {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--col-gap);
  align-items: start;
}

section[aria-labelledby="row-title"] .home-h2 {
  grid-column: 1 / -1;
}

.home-rec__after {
  grid-column: 1 / -1;
  margin-bottom: 2.5rem;
}

.home-rec__after p {
  max-width: 52rem;
  font-size: var(--read);
}

.home-rec {
  display: contents;
}

.home-list {
  grid-column: 1 / 7;
}

.home-list__more {
  margin-top: 0.5rem;
}

.home-list__more .home-link {
  display: inline-block;
  padding-block: 0.6875rem;
}

.home-record {
  grid-column: 7 / 13;
  padding: 1.5rem 1.5rem 0.5rem;
  border: 1px solid var(--rule-strong);
}

.home-table--list {
  table-layout: auto;
}

.home-table--list tbody th {
  font-weight: 500;
}

.home-table--list tr.is-open th,
.home-table--list tr.is-open td {
  background: var(--raised);
  color: var(--ink);
  white-space: nowrap;
}

.home-table--list tr.is-open th {
  padding-left: 0.625rem;
  box-shadow: -0.625rem 0 0 var(--raised);
}

.home-table--list tbody th {
  padding-left: 0;
}

.home-table--list tr.is-open th {
  padding-left: 0;
}

.home-table--list tr.is-open th a {
  font-weight: 600;
}

.home-table--list td:nth-child(4) {
  color: var(--ink-2);
}

.home-table--rec tbody th {
  width: 9rem;
  color: var(--ink-2);
  font-weight: 500;
}

.home-table--rec tr:last-child th,
.home-table--rec tr:last-child td {
  border-bottom: 0;
}

.home-table--rec td:last-child {
  color: var(--ink-2);
}

/* Record names quoted from the register stay in English on French pages and read as source text, like the
   permit numbers. */
.home-table--rec [translate="no"] {
  color: var(--ink-2);
}

.home-st {
  white-space: nowrap;
}

.home-st::before {
  content: "";
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  margin-right: 0.5rem;
  border: 1px solid var(--ink);
  border-radius: 50%;
  vertical-align: 0.05em;
}

.home-st--traced::before {
  background: var(--ink);
}

.home-st--compared::before {
  background: linear-gradient(to right, var(--ink) 50%, transparent 50%);
}

.home-st--open {
  color: var(--ink-2);
}

.home-st--open::before {
  border-color: var(--ink-2);
}

.home-table--rec tr.is-later th,
.home-table--rec tr.is-later td {
  color: var(--ink-2);
}

/* Home: day 1 to day 30, drawn as a figure. Day ticks are hairlines, heavier at days 7, 14, 21 and 28; numbers at
   1, 7, 14, 21 and 30. Owner messages are filled amber squares, reports to the client outlined squares, set-up items
   small --ink-2 squares; the calls are one bar from day 8 to day 30. Labels sit outside the lanes on leader lines in
   two tiers, the last three stacked in the margin right of day 30. The figure is aria-hidden: the table under it
   carries the same words, visually hidden at this width. Below 75em the figure is a 310px strip of markers only,
   above the table read as a plain list numbered by day. */

.strip {
  margin: 0 0 1rem;
}

.strip__plot {
  --Lp: 17rem;
  --R: 12rem;
  --u: calc((100% - var(--Lp) - var(--R)) / 31);
  --yo: 180px;
  --yc: 246px;
  --yy: 312px;
  position: relative;
  height: 600px;
}

.strip__plot > * {
  position: absolute;
}

.strip__tick,
.strip__num,
.strip__mk,
.strip__lead,
.strip__lab {
  left: calc(var(--Lp) + (var(--d) + 0.5) * var(--u));
}

.strip__tick {
  top: 24px;
  bottom: 0;
  width: 1px;
  background: var(--rule);
}

.strip__tick.is-week {
  width: 2px;
  margin-left: -0.5px;
  background: var(--rule-strong);
}

.strip__num {
  top: 0;
  color: var(--ink-2);
  font-size: var(--fine);
  font-weight: 600;
  transform: translateX(-50%);
}

.strip__rail {
  left: calc(var(--Lp) + 0.25 * var(--u));
  right: calc(var(--R) + 0.25 * var(--u));
  height: 1px;
  background: var(--rule-strong);
}

.strip__rail--o { top: var(--yo); }
.strip__rail--c { top: var(--yc); }
.strip__rail--y { top: var(--yy); }

.strip__lane {
  left: 0;
  width: 7.5rem;
  color: var(--ink-2);
  font-size: var(--fine);
  font-weight: 600;
  line-height: 1.3;
  transform: translateY(-50%);
}

.strip__lane--o { top: var(--yo); }
.strip__lane--c { top: var(--yc); }
.strip__lane--y { top: var(--yy); }

.strip__mk {
  z-index: 2;
  width: 12px;
  height: 12px;
  transform: translate(-50%, -50%);
}

.strip__mk--o { top: var(--yo); }
.strip__mk--c { top: var(--yc); }
.strip__mk--y { top: var(--yy); }

.strip__mk--msg {
  background: var(--accent);
}

.strip__mk--rep {
  border: 1.5px solid var(--ink);
  background: var(--bg);
}

.strip__mk--rep.is-end {
  border-width: 2px;
  background: var(--ink);
}

.strip__mk--set {
  width: 9px;
  height: 9px;
  background: var(--ink-2);
}

.strip__bar {
  z-index: 1;
  top: calc(var(--yc) - 2px);
  left: calc(var(--Lp) + (var(--d) + 0.5) * var(--u));
  width: calc((var(--e) - var(--d)) * var(--u));
  height: 5px;
  background: var(--ink);
}

/* leaders: hairlines from a marker to its label */
.strip__lead {
  width: 1px;
  background: var(--ink-2);
}

.strip__lead--o-a { top: 110px; height: calc(var(--yo) - 6px - 110px); }
.strip__lead--o-b { top: 158px; height: calc(var(--yo) - 6px - 158px); }
.strip__lead--y-c { top: calc(var(--yy) + 6px); height: calc(330px - var(--yy) - 6px); }
.strip__lead--y-d { top: calc(var(--yy) + 6px); height: calc(384px - var(--yy) - 6px); }

/* margin leaders: down from the marker, then across to the margin */
.strip__lead--y-m1,
.strip__lead--y-m2,
.strip__lead--y-m3 {
  top: calc(var(--yy) + 6px);
  width: auto;
  right: calc(var(--R) - 0.125rem);
  background: none;
  border-left: 1px solid var(--ink-2);
  border-bottom: 1px solid var(--ink-2);
}

.strip__lead--y-m1 { height: calc(350px - var(--yy) - 6px); }
.strip__lead--y-m2 { height: calc(450px - var(--yy) - 6px); }
.strip__lead--y-m3 { height: calc(530px - var(--yy) - 6px); }

.strip__lab {
  z-index: 3;
  width: min(10rem, 7 * var(--u) - 0.5rem);
  color: var(--ink);
  font-size: var(--ui);
  line-height: 1.35;
}

.strip__lab b {
  display: block;
  font-size: var(--fine);
  font-weight: 700;
}

.strip__lab--a { top: 110px; transform: translate(-0.375rem, -100%); padding-bottom: 0.375rem; }
.strip__lab--b { top: 158px; transform: translate(-0.375rem, -100%); padding-bottom: 0.375rem; }
.strip__lab--c { top: 330px; width: min(6rem, 4 * var(--u) - 0.5rem); transform: translateX(-0.375rem); padding-top: 0.375rem; }
.strip__lab--d { top: 384px; width: min(6rem, 4 * var(--u) - 0.5rem); transform: translateX(-0.375rem); padding-top: 0.375rem; }

.strip__lab--bar {
  top: calc(var(--yc) + 10px);
  width: auto;
  white-space: nowrap;
  color: var(--ink-2);
}

.strip__lab--m1,
.strip__lab--m2,
.strip__lab--m3 {
  left: calc(100% - var(--R) + 0.25rem);
  width: calc(var(--R) - 0.25rem);
  transform: translateY(-0.75rem);
}

.strip__lab--m1 { top: 350px; }
.strip__lab--m2 { top: 450px; }
.strip__lab--m3 { top: 530px; }

/* "Before day 1": right-aligned in its own column, left of the first markers */
.strip__lab--before {
  left: 8.5rem;
  width: calc(var(--Lp) - 9rem);
  color: var(--ink-2);
  text-align: right;
}

.strip__lab--before b {
  color: var(--ink);
}

.strip__lab--before.strip__lab--o { top: calc(var(--yo) + 10px); transform: translateY(-100%); }
.strip__lab--before.strip__lab--c { top: calc(var(--yc) - 10px); }
.strip__lab--before.strip__lab--y { top: calc(var(--yy) - 10px); }

.strip__lab--before.strip__lab--c b,
.strip__lab--before.strip__lab--y b {
  display: none;
}

.home-ev--end {
  font-weight: 600;
}

/* At 1440 the table is read by screen readers; the figure is what the eye reads. */
@media (min-width: 75em) {
  .home-seq {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
}

/* Below 75em: the strip as markers only, 310px, then the list numbered by day. */
@media (max-width: 74.99em) {
  .strip__plot {
    --Lp: 0px;
    --R: 0px;
    --yo: 40px;
    --yc: 62px;
    --yy: 84px;
    width: min(100%, 19.375rem);
    height: 100px;
  }

  .strip__tick {
    top: 22px;
  }

  .strip__mk {
    width: 8px;
    height: 8px;
  }

  .strip__mk--set {
    width: 6px;
    height: 6px;
  }

  .strip__bar {
    height: 3px;
    top: calc(var(--yc) - 1px);
  }

  .strip__lab,
  .strip__lane,
  .strip__lead {
    display: none;
  }

  .home-seq,
  .home-seq tbody,
  .home-seq tr,
  .home-seq th,
  .home-seq td {
    display: block;
    width: auto;
  }

  .home-seq thead,
  .home-seq caption,
  .home-seq__week {
    display: none !important;
  }

  .home-seq__row {
    display: grid !important;
    grid-template-columns: 6.5rem minmax(0, 1fr);
    column-gap: 0.75rem;
    padding: 0.625rem 0;
  }

  .home-seq__row th {
    grid-row: 1 / span 3;
    padding: 0;
    border: 0;
    font-size: 1rem;
  }

  .home-seq__row td {
    grid-column: 2;
    padding: 0;
    border: 0;
  }

  .home-seq__row td + td:not(.is-empty) {
    margin-top: 0.5rem;
  }

  .home-seq__row td.is-empty {
    display: none;
  }

  .home-seq__row td[data-label]::before {
    content: attr(data-label);
    display: block;
    color: var(--ink-2);
    font-size: var(--fine);
  }
}

.home-ev {
  font-size: 1rem;
  line-height: 1.4;
}

.home-ev--end {
  font-weight: 600;
}

/* Home: fees and guarantee. One label column, one row anatomy: label at left, value from 12.5rem to the rule.
   The two questions stand open in the rail; the rail's last block ends on the sheet's foot. Under both, the booking
   block: the photo slot, the founder line, the button and the email. */

.home-terms__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto auto auto 1fr;
  column-gap: var(--col-gap);
}

.home-sheet {
  grid-column: 1 / 7;
  grid-row: 1 / 5;
}

.home-fine__title {
  grid-column: 7 / 13;
  margin: 0 0 0 2rem;
}

.home-fine {
  display: contents;
}

.home-fine details {
  grid-column: 7 / 13;
  margin-left: 2rem;
}

.home-plans {
  border-top: 1px solid var(--rule-strong);
}

.home-plan,
.home-line {
  display: grid;
  grid-template-columns: var(--label) minmax(0, 1fr);
  column-gap: 1rem;
  align-items: baseline;
  padding: 1rem 0;
  border-bottom: 1px solid var(--rule);
}

.home-plan .plan__name,
.home-line h3 {
  grid-column: 1;
  grid-row: 1 / span 2;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 600;
}

.home-plan .plan__price {
  grid-column: 2;
}

.home-plan .plan__unit {
  grid-column: 2;
  margin-top: 0.375rem;
  color: var(--ink-2);
}

.home-line p {
  grid-column: 2;
  font-size: 1rem;
}

.home-sheet .home-line:first-of-type {
  margin-top: 2rem;
  border-top: 1px solid var(--rule-strong);
}

.home-fine details:first-of-type {
  border-top: 1px solid var(--rule-strong);
}

.home-act--end {
  grid-column: 7 / 13;
  grid-row: 4;
  align-self: end;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin-left: 2rem;
  column-gap: 1.75rem;
  align-items: end;
  margin-top: 2.5rem;
}

.home-act--end:has(.portrait:not([hidden])) {
  grid-template-columns: 17.5rem minmax(0, 1fr);
}

.home-act--end .portrait {
  width: 17.5rem;
}

/* Questions. */

.faq details,
.home-fine details {
  border-bottom: 1px solid var(--rule);
}

summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: var(--target);
  padding: 0.875rem 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  list-style: none;
  cursor: pointer;
}

summary::-webkit-details-marker {
  display: none;
}

/* the chevron: 16px */
summary::after {
  content: "";
  flex: none;
  width: 0.625rem;
  height: 0.625rem;
  margin: 0 0.1875rem;
  border-right: 2px solid var(--ink-2);
  border-bottom: 2px solid var(--ink-2);
  transform: translateY(-25%) rotate(45deg);
}

details[open] > summary::after {
  transform: translateY(25%) rotate(-135deg);
}

summary:hover {
  text-decoration-line: underline;
  text-decoration-color: var(--rule-strong);
  text-underline-offset: 0.22em;
}

.faq__a {
  padding: 0 0 1.25rem;
  color: var(--ink-2);
  font-size: 1rem;
}

.faq__a p + p {
  margin-top: 0.75rem;
}

/* The booking block, home and pricing: the photo slot (3:4, 280px, a flat --raised field until the photo
   arrives), the founder line, then the button and the email as a text link on one row. No box, no dot. */

.portrait {
  width: 17.5rem;
  max-width: 100%;
  margin: 0;
}

.portrait__frame {
  aspect-ratio: 3 / 4;
  background: var(--raised);
}

.portrait__frame > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.portrait figcaption {
  margin-top: 0.625rem;
  color: var(--ink-2);
  font-size: var(--fine);
}

.booking__founder {
  color: var(--ink);
  font-size: var(--read);
  line-height: 1.5;
}

.booking__text {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 40rem;
  padding-bottom: 1.75rem;
}

.booking__text > p:not(.booking__founder) {
  color: var(--ink-2);
  font-size: 1rem;
}

.booking__row,
.cta-box .btn-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.75rem 1.5rem;
  margin-top: 0.5rem;
}

.booking__mail,
.cta-box .btn--ghost {
  display: inline;
  min-height: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ink);
  font: 400 1rem/1.4 var(--sans);
  text-decoration-line: underline;
  text-decoration-color: var(--rule-strong);
  white-space: nowrap;
}

.booking {
  grid-column: 9 / 13;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

/* On how-it-works the call box sits in the start grid without a .booking wrapper; unplaced it was auto-set into the
   single column 8 (founder 2026-11-10 evening, screenshot of the aside wrapping one word per line). */
.start > .cta-box {
  grid-column: 9 / 13;
}

.cta-box {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.cta-box p {
  color: var(--ink-2);
  font-size: 1rem;
}

.status-dot {
  color: var(--ink) !important;
  font-weight: 600;
}

/* Pricing: page head. The lede under the h1, the currency control under the lede, the date under it. The page
   head is short so the Proof Sprint band's top edge sits inside the first screen across the full width. */

.pagehead {
  padding: clamp(2rem, 3.5vw, 3rem) 0 0;
}

.pagehead .display {
  max-width: 14ch;
}

.pagehead .lede {
  max-width: 44rem;
  margin-top: 1.5rem;
}

.pagehead__for {
  max-width: 44rem;
  margin-top: 1rem;
  color: var(--ink-3);
  font-size: var(--fine);
  line-height: 1.5;
}

.pagehead [data-checked] {
  color: var(--ink-3);
  font-size: var(--fine);
}

.fees {
  padding-top: clamp(2.5rem, 4vw, 3rem);
}

/* Pricing: the four fees, one --raised band. The Proof Sprint is one wide block: "Start here", its name, the price
   large with the guarantee beside it, the unit, the facts at right. Quarterly, Six months and Annual follow as three
   rows: name and price at left, the unit, then the facts across. No empty slot anywhere. */

.fees__caption {
  margin-bottom: 1.5rem;
}

.fees__table {
  display: block;
  border: 1px solid var(--rule);
  background: var(--raised);
}

.fee {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto 1fr;
  column-gap: var(--col-gap);
  align-items: start;
  padding: 1.75rem 2rem;
}

.fee + .fee {
  border-top: 1px solid var(--rule);
}

.fee .plan__name {
  grid-column: 1 / 5;
  font-size: 1.0625rem;
}

.fee .plan__price {
  grid-column: 1 / 5;
  grid-row: 2;
  margin-top: 0.625rem;
}

.fee .plan__unit {
  grid-column: 5 / 8;
  grid-row: 1 / span 2;
  color: var(--ink-2);
  font-size: 1rem;
}

.plan__facts {
  grid-column: 8 / 13;
  grid-row: 1 / span 2;
  margin: 0;
  padding: 0;
  list-style: none;
}

.plan__facts li {
  padding: 0.125rem 0 0.375rem;
  font-size: 1rem;
  line-height: 1.45;
}

.fee--lead {
  grid-template-rows: auto auto auto 1fr auto;
  padding-block: 2rem 2rem;
}

.fee--lead .plan__name {
  grid-row: 2;
}

.fee--lead .plan__price {
  grid-row: 3;
  font-size: 3.5rem;
  font-variation-settings: "opsz" 36, "SOFT" 0, "WONK" 0;
}

/* the middle column has one role in all four rows: the unit */
.fee--lead .plan__unit {
  grid-column: 5 / 8;
  grid-row: 2 / span 3;
}

/* the guarantee: its own line under the Proof Sprint row */
.fee--lead .plan__guarantee {
  grid-column: 1 / -1;
  grid-row: 5;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rule);
  font-size: 1rem;
}

.fee--lead .plan__facts {
  grid-row: 2 / span 3;
  align-self: start;
}

.fee:not(.fee--lead) .plan__name {
  grid-row: 1;
}

.plan__guarantee strong {
  margin-right: 0.625rem;
  color: var(--ink);
  font-weight: 700;
}

.fees__foot {
  margin-top: 2.5rem;
}

.fees__rule {
  display: grid;
  grid-template-columns: var(--label) minmax(0, 1fr);
  column-gap: 1rem;
  align-items: baseline;
}

.fees__rule h3 {
  font-size: 1rem;
}

.fees__rule p {
  color: var(--ink-2);
  font-size: 1rem;
}

/* Pricing: the guarantee band, the one large moment. The full guarantee in Fraunces at display size, in --ink, both
   sentences one colour; the terms beside it at body size; the two sentences on what is and is not promised in --ink. */

.band--sunk {
  margin-top: var(--gap);
  padding-block: clamp(3.5rem, 7vw, 6rem);
  background: var(--raised);
}

.band--sunk .wrap {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--col-gap);
  align-items: start;
}

.band--sunk .sec__title {
  grid-column: 1 / -1;
  margin-bottom: 2.5rem;
}

.band__statement {
  grid-column: 1 / 8;
  grid-row: 2 / 6;
  max-width: 15ch;
  font-family: var(--serif);
  font-size: clamp(2.25rem, 3.4vw, 3rem);
  font-weight: 500;
  font-variation-settings: "opsz" 36, "SOFT" 0, "WONK" 0;
  line-height: 1.05;
  letter-spacing: -0.015em;
  text-wrap: balance;
}

.band__statement span {
  color: var(--ink);
}

.band__def {
  grid-column: 8 / 13;
  color: var(--ink-2);
  font-size: 1rem;
  line-height: 1.6;
}

.band__def + .band__def {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--rule);
}

.band__def strong,
.band__promise {
  color: var(--ink);
  font-weight: 600;
}

/* Pricing: included and never included (one rule under each head, no row rules), why flat fees, questions, start. */

.ledger {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--col-gap);
}

.ledger h3 {
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--rule-strong);
  font-size: 1rem;
}

.ledger ul {
  margin-top: 0.75rem;
  padding: 0;
  list-style: none;
}

.ledger li {
  padding: 0.375rem 0;
  font-size: 1rem;
}

.ledger--dont li {
  color: var(--ink-2);
}

.points {
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--rule-strong);
}

.points li {
  display: grid;
  grid-template-columns: var(--label) minmax(0, 1fr);
  column-gap: 1rem;
  align-items: baseline;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--rule);
}

.points h3 {
  font-size: 1rem;
}

.points p {
  color: var(--ink-2);
  font-size: 1rem;
}

/* The questions: a closed row shows the question and a down chevron; an open row shows an up chevron and the
   answer. The same on home and pricing. */

.faq details {
  border-bottom: 1px solid var(--rule);
}

.start {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--col-gap);
  align-items: start;
}

.start > div:first-child {
  grid-column: 1 / 8;
}

.sec__intro {
  max-width: 44rem;
  color: var(--ink-2);
  font-size: 1rem;
}

.sec__intro + .sec__intro {
  margin-top: 1rem;
}

/* Where owner outreach is on hold: the codes as a wrapped list of square chips, grouped by country. */

.holds {
  margin-top: 1rem;
}

.holds__group {
  margin-top: 0.875rem;
}

.holds__label {
  margin-bottom: 0.5rem;
  color: var(--ink);
  font-size: var(--fine);
  font-weight: 700;
}

.holds__codes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  max-width: 44rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.holds__codes li {
  min-width: 2.25rem;
  padding: 0.125rem 0.375rem;
  background: var(--raised);
  color: var(--ink-2);
  font-size: var(--fine);
  font-weight: 600;
  letter-spacing: 0.02em;
  text-align: center;
}

.holds__prov {
  color: var(--ink-2);
  font-size: 1rem;
}

.holds .sec__intro:last-child {
  margin-top: 1rem;
}

.btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

/* Footer, shared. On the page grid: About on five columns with the founder line, the pages in two columns, the
   contact. One weight for every link, the current page included. */

.colophon {
  padding-block: 3.5rem 2rem;
  border-top: 1px solid var(--rule);
}

.colophon__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--col-gap);
  row-gap: 2rem;
}

.colophon__grid > :nth-child(1) {
  grid-column: 1 / 6;
}

.colophon__grid > :nth-child(2) {
  grid-column: 7 / 11;
}

.colophon__grid > :nth-child(3) {
  grid-column: 11 / 13;
}

.colophon h2 {
  margin-bottom: 0.75rem;
  color: var(--ink-2);
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  letter-spacing: 0;
}

.colophon p {
  color: var(--ink-2);
  font-size: 1rem;
}

.colophon__founder {
  margin-top: 0.75rem;
  color: var(--ink-2);
  font-size: 1rem;
}

.colophon nav ul {
  columns: 2;
  column-gap: var(--col-gap);
  padding: 0;
  list-style: none;
}

.colophon nav a,
.colophon [data-contact] a {
  display: inline-flex;
  align-items: center;
  min-height: var(--target);
  color: var(--ink-2);
  font-size: var(--ui);
  font-weight: 400;
  text-decoration: none;
}

.colophon [data-contact] a {
  white-space: nowrap;
}

.colophon nav a:hover,
.colophon [data-contact] a:hover,
.colophon nav a[aria-current="page"] {
  color: var(--ink);
  font-weight: 400;
}

.colophon nav a[aria-current="page"] {
  text-decoration-line: underline;
  text-decoration-color: var(--rule-strong);
}

.colophon__base {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem 2rem;
  margin-top: 3rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--rule);
}

.colophon__base p {
  color: var(--ink-3);
  font-size: var(--fine);
}

/* Draft banner: appended by site.js at the end of the body, in normal flow. */

.draft-banner {
  position: static;
  border-top: 1px solid var(--rule);
  background: var(--bg);
  color: var(--ink-2);
  font-size: var(--fine);
}

.draft-banner .wrap {
  display: block;
  padding-block: 0.625rem;
}

.draft-banner strong {
  margin-right: 0.5rem;
  color: var(--ink);
  font-weight: 700;
}

.draft-banner a {
  color: var(--ink);
}

/* Narrower screens. */

@media (max-width: 64em) {
  .home-terms__grid,
  .start {
    row-gap: 2rem;
  }

  .home-sheet,
  .start > div:first-child,
  .start > .cta-box,
  .booking {
    grid-column: 1 / -1;
  }

  .home-fine details,
  .home-fine__title,
  .home-act--end {
    grid-column: 1 / -1;
    grid-row: auto;
    margin-left: 0;
  }

  .home-sheet {
    grid-row: auto;
  }

  .home-fine details:nth-of-type(2) {
    margin-top: -2rem;
  }

  .home-list,
  .home-record {
    grid-column: 1 / -1;
  }

  .home-record {
    margin-top: 2rem;
  }

  .fee {
    padding-inline: 1.5rem;
  }

  .fee .plan__name,
  .fee .plan__price {
    grid-column: 1 / 6;
  }

  .fee .plan__unit {
    grid-column: 6 / 13;
  }

  .plan__facts,
  .fee--lead .plan__facts {
    grid-column: 1 / -1;
    grid-row: auto;
    margin-top: 1.25rem;
  }

  .band__statement {
    grid-column: 1 / -1;
    grid-row: auto;
    max-width: 18ch;
    margin-bottom: 2.5rem;
  }

  .band__def {
    grid-column: 1 / -1;
    max-width: 44rem;
  }
}

/* Phones. The opening screen reads: h1, who it is for, the offer with its price, the currency control on its own
   line, the guarantee, the date, "Book a call"; then the counties as a ranked list, one row each, one square per
   firm; the legend; the caption; then the rest. */

@media (max-width: 48em) {
  h1 {
    font-size: 2.75rem;
    line-height: 1.05;
  }

  h2 {
    font-size: 1.625rem;
    line-height: 1.12;
  }

  .home-open {
    padding-top: 1.25rem;
  }

  .home-open > .wrap {
    display: flex;
    flex-direction: column;
  }

  .home-open__body,
  .home-open__map,
  .home-open__map .map-fig {
    display: contents;
  }

  .home-h1 { order: 1; }
  .home-for { order: 2; margin-top: 1.25rem; }
  .home-offer-row { order: 3; }
  .home-line--key { order: 4; }
  .home-open [data-checked] { order: 5; }
  .home-open__body > .home-act { order: 6; margin-top: 1.5rem; }
  .home-plate__title { order: 7; margin-top: 3rem; }
  .map-legend { order: 8; }
  .map-rank { order: 9; }
  .home-cap { order: 10; }
  .home-open__map .lede { order: 11; }
  .home-open__body > .home-act__links { order: 12; margin-top: 1rem; }
  .home-count { order: 13; }

  .home-open__body > .home-act__links {
    flex-direction: column;
  }

  .home-act__links a {
    padding-block: 0.6875rem;
  }

  .home-plate__title {
    margin-bottom: 0;
  }

  .map-plot--tall,
  .map-plot--wide {
    display: none;
  }

  .map-legend {
    flex-direction: column;
    margin-top: 1rem;
  }

  .map-rank {
    display: block;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
  }

  .map-rank li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    column-gap: 0.75rem;
    align-items: start;
    padding: 0.4375rem 0;
  }

  .map-rank__name {
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.2;
  }

  .map-rank__n {
    color: var(--ink);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    text-align: right;
  }

  /* the desktop map's square: 7 of 549 units across five columns at 1440, about 6px */
  .map-rank__sq {
    display: block;
    width: 9.75rem;
    height: auto;
    margin-top: 0.125rem;
  }

  .map-rank .map-nat {
    stroke-width: 1px;
  }

  .home-cap {
    margin-top: 1rem;
  }

  .home-count {
    padding-block: 2.5rem;
  }

  .home-funnel thead th:first-child {
    width: 44%;
  }

  .home-funnel thead th:nth-child(2) {
    width: 28%;
  }

  .home-funnel tbody th,
  .home-funnel tbody td {
    padding-right: 0.75rem;
  }

  .home-funnel tbody th {
    font-size: 1rem;
  }

  .home-funnel td:last-child {
    font-size: 2.5rem;
  }

  .home-funnel td:nth-child(2) {
    font-size: var(--ui);
  }

  section[aria-labelledby="row-title"] > .wrap {
    display: block;
  }

  .home-table--list caption,
  .home-seq caption,
  .home-table--rec caption {
    display: block;
    width: auto;
  }

  /* One row of the sample, phone: field, entry, status. The sources follow the card's rows, once each, as lines
     under them; the permit record rows 1 to 4 share is shown once. */
  .home-table--rec,
  .home-table--rec tbody {
    display: flex;
    flex-direction: column;
    min-width: 0;
  }

  .home-table--rec thead {
    display: none;
  }

  .home-table--rec caption {
    order: -2;
  }

  .home-table--rec tr {
    display: contents;
  }

  .home-table--rec th,
  .home-table--rec td {
    padding: 0;
    border: 0;
  }

  .home-table--rec tbody th {
    width: auto;
    padding-top: 0.875rem;
    color: var(--ink-2);
    font-size: var(--fine);
    font-weight: 600;
  }

  .home-table--rec td:nth-child(2) {
    padding-top: 0.125rem;
  }

  .home-table--rec td:nth-child(3) {
    padding: 0.25rem 0 0.875rem;
    border-bottom: 1px solid var(--rule);
    font-size: var(--ui);
  }

  .home-table--rec tr:last-child td:nth-child(3) {
    border-bottom: 0;
  }

  .home-table--rec td:nth-child(4) {
    display: none;
  }

  .home-table--rec tr:nth-child(1) td:nth-child(4),
  .home-table--rec tr:nth-child(5) td:nth-child(4),
  .home-table--rec tr:nth-child(6) td:nth-child(4),
  .home-table--rec tr:nth-child(7) td:nth-child(4) {
    display: block;
    order: 99;
    padding: 0.25rem 0;
    color: var(--ink-2);
    font-size: var(--ui);
  }

  .home-table--rec tr:nth-child(1) td:nth-child(4) {
    margin-top: 0.25rem;
    padding-top: 0.875rem;
    border-top: 1px solid var(--rule-strong);
  }

  .home-table--rec tr:nth-child(1) td:nth-child(4)::before {
    content: "Source";
    display: block;
    margin-bottom: 0.25rem;
    color: var(--ink-2);
    font-size: var(--fine);
    font-weight: 600;
  }

  .home-table--rec tr:nth-child(1) td:nth-child(4):lang(fr)::before {
    content: "Sources";
  }

  .home-table--list thead {
    display: none;
  }

  .home-table--list,
  .home-table--list tbody,
  .home-table--list tr {
    display: block;
  }

  .home-table--list tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--rule);
  }

  /* the highlighted row keeps the list's left edge; its band reaches out by a negative margin */
  .home-table--list tr.is-open {
    margin-inline: -0.75rem;
    padding-inline: 0.75rem;
    background: var(--raised);
  }

  .home-table--list th,
  .home-table--list td,
  .home-table--list tr.is-open th,
  .home-table--list tr.is-open td {
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    white-space: normal;
  }

  .home-table--list th {
    grid-column: 1 / -1;
  }

  .home-table--list td:nth-child(2) {
    color: var(--ink-2);
  }

  .home-table--list td:nth-child(3)::before {
    content: "Permit ";
    color: var(--ink-2);
  }

  .home-table--list td:nth-child(3):lang(fr)::before {
    content: "Permis ";
  }

  .home-table--list td:nth-child(4) {
    grid-column: 1 / -1;
    font-size: var(--ui);
  }

  .home-record {
    padding: 1rem 1rem 1rem;
  }

  .home-rec__after {
    margin-bottom: 2rem;
  }

  .home-plan,
  .home-line {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.25rem;
  }

  .home-plan .plan__name,
  .home-line h3 {
    grid-row: auto;
  }

  .home-plan .plan__price,
  .home-plan .plan__unit,
  .home-line p {
    grid-column: 1;
  }

  .home-plan .plan__price {
    font-size: 1.75rem;
    margin-top: 0.25rem;
  }

  .home-act--end {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
    margin-top: 3rem;
  }

  .booking__text {
    padding-bottom: 0;
  }

  .pagehead .display {
    max-width: none;
  }

  .fees__table {
    margin-top: 1rem;
  }

  .fee,
  .fee--lead {
    display: flex;
    flex-direction: column;
    padding: 1.5rem 1.25rem;
  }

  .fee--lead .plan__price {
    font-size: 2.75rem;
  }

  .fee .plan__price {
    margin-top: 0.5rem;
  }

  .fee .plan__unit,
  .fee--lead .plan__unit {
    margin-top: 0.75rem;
  }

  .fee--lead .plan__guarantee {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--rule);
  }

  .plan__facts,
  .fee--lead .plan__facts {
    margin-top: 1rem;
  }

  .fees__rule,
  .points li,
  .faq details {
    display: block;
  }

  .fees__rule p,
  .points p {
    margin-top: 0.5rem;
  }

  .band--sunk .wrap {
    display: block;
  }

  .band__statement {
    font-size: 2.25rem;
  }

  .ledger {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 2.5rem;
  }

  .colophon__grid > :nth-child(1),
  .colophon__grid > :nth-child(2),
  .colophon__grid > :nth-child(3) {
    grid-column: 1 / -1;
  }
}

/* ---------- Round 3 addendum ---------- */

/* Home hero: "Check your state", under the currency control. */
.home-check {
  margin: -0.25rem 0 0.75rem;
}

.home-check .home-link {
  font-size: 1rem;
}

/* Pricing: who it is for, under the h1, as on home. */
.pagehead .home-for {
  max-width: 44rem;
  margin-top: 1.25rem;
}

.pagehead .lede {
  margin-top: 0.75rem;
}

/* The photo slot is collapsed until the photo arrives: nothing marks the absence. */
.portrait[hidden] {
  display: none !important;
}

/* Coverage: a tile map, one square per state and province in its approximate place, the code inside. Open places
   are filled amber; held places are the map's outlined set-aside square. */
.coverage {
  margin: 1.75rem 0 0;
}

.coverage__map {
  --t: 2.375rem;
  --g: 0.25rem;
  position: relative;
  width: calc(12 * var(--t) + 11 * var(--g));
  height: calc(10 * var(--t) + 9 * var(--g));
  max-width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.coverage__map li {
  position: absolute;
  left: calc(var(--x) * (var(--t) + var(--g)));
  top: calc(var(--y) * (var(--t) + var(--g)));
  display: grid;
  place-items: center;
  width: var(--t);
  height: var(--t);
  font-size: var(--fine);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1;
}

.coverage__map .is-open {
  background: var(--accent);
  color: var(--on-accent);
}

.coverage__map .is-held {
  border: 1px solid var(--set-aside);
  color: var(--ink-2);
}

.coverage figcaption {
  max-width: 34rem;
  margin-top: 1rem;
  color: var(--ink-2);
  font-size: var(--ui);
}

.coverage figcaption span {
  display: block;
}

.coverage--small {
  margin-top: 1.25rem;
}

.coverage--small .coverage__map {
  --t: 1.625rem;
  --g: 0.125rem;
}

@media (max-width: 48em) {
  .coverage__map,
  .coverage--small .coverage__map {
    --t: calc((100vw - 2 * var(--gutter) - 11 * 0.1875rem) / 12);
    --g: 0.1875rem;
  }
}

/* "One firm from the list": the source of the list, under the lede. */
.home-rec__src {
  margin-top: 0.75rem;
  color: var(--ink-2);
  font-size: 1rem !important;
}

/* The sample card is page 1 of the real brief: paper tone, ink text, page margins, the firm as running head,
   folio 1, no border box. */
.home-record {
  padding: 0;
  border: 0;
}

.paper {
  --paper: #ece6d8;
  --paper-ink: #12181f;
  --paper-ink-2: #4a4f56; /* 7.0:1 on the paper */
  position: relative;
  padding: 2.75rem 3rem 3.25rem;
  background: var(--paper);
  color: var(--paper-ink);
  font-size: var(--ui);
  line-height: 1.45;
}

.paper a {
  color: var(--paper-ink);
  text-decoration-color: var(--paper-ink-2);
}

.paper__head {
  margin-bottom: 1.75rem;
  padding-bottom: 0.625rem;
  border-bottom: 1px solid var(--paper-ink);
  font-family: var(--serif);
  font-size: 1.25rem;
  font-variation-settings: "opsz" 36, "SOFT" 0, "WONK" 0;
}

.paper__bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.25rem 1rem;
  font-weight: 600;
}

.paper__bar p:last-child {
  color: var(--paper-ink-2);
  font-weight: 400;
}

.paper__meta {
  display: grid;
  gap: 0.25rem;
  margin: 1rem 0 0;
}

.paper__meta div {
  display: grid;
  grid-template-columns: 8rem minmax(0, 1fr);
  column-gap: 1rem;
}

.paper__meta dt {
  color: var(--paper-ink-2);
}

.paper__meta dd {
  margin: 0;
}

.paper__note {
  margin-top: 1rem;
  font-style: italic;
}

.paper__h {
  margin: 1.75rem 0 0.5rem;
  font-size: 1rem;
  font-weight: 700;
}

.paper__table {
  font-size: var(--ui);
}

.paper__table thead th {
  border-bottom-color: var(--paper-ink);
  color: var(--paper-ink-2);
}

.paper__table tbody th,
.paper__table tbody td {
  border-bottom: 1px solid rgb(18 24 31 / 0.18);
  color: var(--paper-ink);
}

.paper__table tbody th {
  width: 7.5rem;
  font-weight: 600;
}

.paper__table td:last-child {
  color: var(--paper-ink-2);
}

.paper .brief-held {
  font-style: italic;
}

.paper .brief-unk {
  color: var(--paper-ink-2);
}

.paper [translate="no"] {
  color: inherit;
}

.paper__folio {
  position: absolute;
  right: 3rem;
  bottom: 1.25rem;
  color: var(--paper-ink-2);
}

@media (max-width: 48em) {
  .paper {
    padding: 1.75rem 1.25rem 2.75rem;
  }

  .paper__folio {
    right: 1.25rem;
  }

  .paper__meta div {
    grid-template-columns: minmax(0, 1fr);
  }

  .paper__table thead {
    display: none;
  }

  .paper__table,
  .paper__table tbody,
  .paper__table tr,
  .paper__table th,
  .paper__table td {
    display: block;
    width: auto;
  }

  .paper__table tr {
    padding: 0.625rem 0;
    border-bottom: 1px solid rgb(18 24 31 / 0.18);
  }

  .paper__table tbody th,
  .paper__table tbody td {
    padding: 0;
    border: 0;
  }

  .paper__table tbody th {
    width: auto;
  }
}

/* Pricing: "What the fee includes", "Why flat fees" and the questions are one fee schedule: hanging heads in the
   label column, numbered 1 to 3, under one top rule, no gap between the parts. */
main {
  counter-reset: sched;
}

.sec--sched {
  padding-top: 0;
}

.sec--sched:first-of-type,
.sec + .sec--sched:not(.sec--sched + .sec--sched) {
  margin-top: var(--gap);
}

.sec--sched > .sec__grid > div {
  display: grid;
  grid-template-columns: var(--label) minmax(0, 1fr);
  column-gap: 1rem;
  align-items: start;
  padding-top: 1.75rem;
  border-top: 1px solid var(--rule);
}

.sec--sched:not(.sec--sched + .sec--sched) > .sec__grid > div {
  border-top: 1px solid var(--rule-strong);
}

.sec--sched + .sec--sched > .sec__grid > div {
  margin-top: 2.25rem;
}

.sec--sched .sec__title,
.home-fine__title,
.fees__rule h3 {
  margin: 0;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.3;
  font-variation-settings: normal;
}

.sec--sched .sec__title::before {
  counter-increment: sched;
  content: counter(sched);
  display: block;
  margin-bottom: 0.25rem;
  color: var(--ink-2);
  font-size: var(--fine);
  font-variant-numeric: tabular-nums;
}

.sec--sched .ledger,
.sec--sched .points,
.sec--sched .faq {
  grid-column: 2;
}

.sec--sched .points,
.sec--sched .faq {
  border-top: 0;
}

.sec--sched .points li {
  padding: 0 0 1.25rem;
  border-bottom: 0;
}

/* Round 8c (2026-11-10, founder: "layout is weird"): the ledger no longer splits the content column in two
   halves beside the section label. Included and Never included are two rows on the same label grid the
   points below use, so every line of the page sits on the same two vertical lines. Phones keep the block. */
.sec--sched .ledger {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.sec--sched .ledger > div {
  display: grid;
  grid-template-columns: var(--label) minmax(0, 1fr);
  column-gap: 1rem;
  align-items: baseline;
  padding: 0 0 1.25rem;
}

.sec--sched .ledger h3 {
  padding-bottom: 0.5rem;
  border-bottom: 0;
}

.sec--sched .ledger ul {
  margin-top: 0;
}

@media (max-width: 48em) {
  .sec--sched .ledger > div {
    display: block;
  }
}

.sec--sched .faq summary {
  padding-top: 0;
}

.sec--sched .faq details {
  margin-bottom: 0.875rem;
  border-bottom: 1px solid var(--rule);
}

.sec--sched .faq details[open] .faq__a,
.faq details[open] .faq__a {
  max-width: 44rem;
}

/* "One client per niche and metro": the same label and value columns as the schedule below. */
.fees__rule {
  grid-template-columns: var(--label) minmax(0, 1fr);
  column-gap: 1rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--rule);
}

.fees__rule p {
  max-width: 44rem;
}

.home-fine__title {
  margin-bottom: 0.875rem;
}

@media (max-width: 48em) {
  .sec--sched > .sec__grid > div {
    display: block;
  }

  .sec--sched .sec__title {
    margin-bottom: 1rem;
  }

  .fees__rule {
    display: block;
  }
}

/* ---------- Round 4 ---------- */

/* 1. Home Fees: the right column hugs its content. Questions, then the founder block directly under them. */
.home-terms__grid {
  grid-template-rows: auto;
  align-items: start;
}

.home-sheet {
  grid-column: 1 / 7;
  grid-row: 1;
}

.home-fine {
  grid-column: 7 / 13;
  grid-row: 1;
  align-self: start;
  display: flex;
  flex-direction: column;
  margin-left: 2rem;
}

.home-fine__title,
.home-fine details,
.home-act--end {
  margin-left: 0;
}

.home-act--end {
  align-self: stretch;
  margin-top: 2rem;
}

/* The map column spans the h1 row and the body row: the extra height goes to the body row, never under the h1. */
.home-open > .wrap {
  grid-template-rows: auto 1fr auto auto;
}

/* 4. The home hero: five things. The currency control with "Check your state" on its line; the button with one
   link beside it. The date sits under the count band, right-aligned. */
.home-control {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 1.25rem;
  margin-block: 0.875rem 0;
}

.home-control .cur-switch {
  margin: 0 0 0 -0.5rem;
}

.home-control .home-check {
  margin: 0;
}

.home-open__body > .home-act,
.home-open__body > .home-act__links {
  margin-top: 1.5rem;
}

.home-checked {
  grid-column: 1 / -1;
  grid-row: 4;
  justify-self: end;
  margin-top: 0.75rem !important;
  color: var(--ink-3);
  font-size: var(--fine);
}

.home-line--guarantee p {
  color: var(--ink);
}

/* 3. The strip spans the measure: the margin labels sit inside it; the rails and the axis run edge to edge. */
.strip__plot {
  border-top: 1px solid var(--rule-strong);
}

.strip__num {
  top: 4px;
}

.strip__rail {
  right: 0;
}

/* Below 75em the figure is removed: one form, the list numbered by day, each entry led by its lane word. */
@media (max-width: 74.99em) {
  .strip {
    display: none;
  }

  .home-seq__row td[data-label]::before {
    content: none;
  }

  .home-seq__row td p {
    display: inline;
  }

  .home-seq__row td:not(.is-empty)::before {
    display: inline;
    margin-right: 0.5rem;
    color: var(--ink-2);
  }

  .home-seq__row td:nth-of-type(1)::before { content: "Owners"; }
  .home-seq__row td:nth-of-type(2)::before { content: "Calls"; }
  .home-seq__row td:nth-of-type(3)::before { content: "You"; }
  html:lang(fr) .home-seq__row td:nth-of-type(1)::before { content: "Propriétaires"; }
  html:lang(fr) .home-seq__row td:nth-of-type(2)::before { content: "Appels"; }
  html:lang(fr) .home-seq__row td:nth-of-type(3)::before { content: "Vous"; }

  .home-seq__row {
    grid-template-columns: 5.5rem minmax(0, 1fr);
  }
}

/* 7. The fee comparison: one head row (Option, Metro areas, Fee), small in --ink-3 under the top rule; each row in
   those three columns; the facts under the name; the Proof Sprint guarantee its own line under the first row.
   No box: the band tone carries it. */
.fees__table {
  border: 0;
  border-top: 1px solid var(--rule-strong);
}

.fees__head {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--col-gap);
  padding: 0.75rem 2rem;
  border-bottom: 1px solid var(--rule);
  color: var(--ink-3);
  font-size: var(--fine);
  font-weight: 600;
}

.fees__head span:nth-child(1) { grid-column: 1 / 5; }
.fees__head span:nth-child(2) { grid-column: 5 / 10; }
.fees__head span:nth-child(3) { grid-column: 10 / 13; }

/* Founder 2026-11-10 evening ("instead of the price which can seem intimidating ... book a call", then "ok for 1 2 3"):
   the fee is a fact at body size under the option name; the middle column leads with what the buyer gets; the loud
   third column is a Book a call button. The markup order (name, price, unit) is what dev/seo_build.py reads.
   Round 7e, same evening ("under the price we put nothing and put info in what you get"): the facts list is gone,
   the middle column carries the selling paragraph over five columns, the fine print sits under the table. */
.fee,
.fee--lead {
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  padding: 1.75rem 2rem;
}

.fee + .fee {
  border-top: 1px solid var(--rule);
}

.fee .plan__name,
.fee--lead .plan__name {
  grid-column: 1 / 5;
  grid-row: 1;
}

.fee .plan__price,
.fee--lead .plan__price {
  grid-column: 1 / 5;
  grid-row: 2;
  margin-top: 0.375rem;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0;
  font-variation-settings: "opsz" 18, "SOFT" 0, "WONK" 0;
}

.fee .plan__unit,
.fee--lead .plan__unit {
  grid-column: 1 / 5;
  grid-row: 3;
  align-self: start;
  margin-top: 0.25rem;
}

.plan__metro {
  grid-column: 5 / 10;
  grid-row: 1 / span 3;
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.55;
}

.plan__metro .home-link {
  white-space: nowrap;
}

.plan__cta {
  grid-column: 10 / 13;
  grid-row: 1 / span 3;
  margin: 0;
}

.fees__terms {
  margin-top: 1.5rem;
}

.fee--lead .plan__guarantee {
  grid-column: 1 / -1;
  grid-row: 4;
}

/* 7. The questions at the full text measure: question, then answer. The schedule's third part keeps its number,
   its head set above the questions instead of beside them. */
.sec--sched[aria-labelledby="faq-title"] > .sec__grid > div {
  display: block;
}

.sec--sched[aria-labelledby="faq-title"] .sec__title {
  margin-bottom: 1.25rem;
}

.sec--sched .faq,
.faq {
  max-width: 52rem;
}

/* 9. The three reasons and the band's lead-ins are plain sentences: no bold run-in. */
.points h3 {
  font-weight: 400;
}

/* 6. The footer: About carries the name, the place and the email; the pages in two columns. */
.colophon__grid > :nth-child(1) {
  grid-column: 1 / 5;
}

.colophon__grid > :nth-child(2) {
  grid-column: 7 / 13;
}

.colophon__about p {
  margin: 0;
}

.colophon__about p + p {
  margin-top: 0.25rem;
}

.colophon__about [data-contact] a {
  min-height: 0;
  margin-top: 0.25rem;
}

@media (max-width: 64em) {
  .home-sheet,
  .home-fine {
    grid-column: 1 / -1;
    grid-row: auto;
    margin-left: 0;
  }

  .home-fine {
    margin-top: 2.5rem;
  }

  .home-fine details:nth-of-type(2) {
    margin-top: 0;
  }

  .fees__head {
    padding-inline: 1.5rem;
  }
}

@media (max-width: 48em) {
  .home-control { order: 3; }
  .home-open .home-checked {
    order: 14;
    align-self: flex-end;
    margin-top: 0.75rem;
  }

  .fees__head {
    display: none;
  }

  .fee,
  .fee--lead {
    padding: 1.5rem 1.25rem;
  }

  .fee .plan__price,
  .fee--lead .plan__price {
    order: -1;
    margin-top: 0.375rem;
    font-size: 1.125rem;
  }

  .fee .plan__name,
  .fee--lead .plan__name {
    order: -2;
  }

  .plan__metro {
    order: 0;
    margin-top: 0.5rem;
  }

  .plan__cta {
    order: 1;
    margin-top: 1.25rem;
  }

  .fee--lead .plan__guarantee {
    order: 2;
  }

  .colophon__grid > :nth-child(1),
  .colophon__grid > :nth-child(2) {
    grid-column: 1 / -1;
  }
}

/* ---------- Round 6: the home page, five sections in one column at the text measure ---------- */

.home-col {
  /* the wrap's left edge, the pricing FAQ's measure; the space to its right stays empty. The export's
     padding-right: calc(100% - 52rem) is gone (2026-11-10 evening): that 100% is the section's width, so
     the padding grew with the viewport and squeezed the column to 224 px at 1920 and to nothing at 2560.
     The child cap below is the whole rule. */
}

.home-main .home-col > * {
  max-width: 52rem;
}

/* 1. The hero: the pricing hero form, one text column */
.home-hero {
  padding: clamp(2rem, 3.5vw, 3rem) 0 0;
}

.home-hero .home-h1 {
  max-width: 18ch;
}

.home-hero .home-for {
  margin-top: 1.5rem;
  color: var(--ink);
  font-size: var(--read);
}

.home-hero .lede {
  max-width: 44rem;
  margin-top: 0.75rem;
  color: var(--ink-2);
}

.home-hero .home-act {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.75rem 1.5rem;
  margin-top: 1.75rem;
}

/* 2. How it works: the schedule form, the numeral hanging in the label column */
.steps {
  counter-reset: step;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--rule-strong);
}

.steps li {
  counter-increment: step;
  display: grid;
  grid-template-columns: var(--label) minmax(0, 1fr);
  column-gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--rule);
}

.steps li::before {
  content: counter(step);
  grid-row: 1 / span 2;
  color: var(--ink-2);
  font-family: var(--serif);
  font-size: 1.5rem;
  font-variation-settings: "opsz" 36, "SOFT" 0, "WONK" 0;
  line-height: 1.1;
}

.steps h3 {
  grid-column: 2;
  color: var(--ink);
  font-size: var(--read);
  font-weight: 500;
  line-height: 1.4;
}

.steps p {
  grid-column: 2;
  margin-top: 0.375rem;
  color: var(--ink-2);
  font-size: 1rem;
}

.home-steps__more {
  margin-top: 1.25rem;
}

.home-steps__more .home-link,
.home-sample__links .home-link {
  display: inline-block;
  padding-block: 0.6875rem;
  font-size: 1rem;
}

/* 3. The proof card: the one raised surface on the home, the one figure */
.home-sample {
  padding: 2rem 2rem 1.5rem;
  background: var(--raised);
}

.home-sample h3 {
  color: var(--ink);
  font-size: 1.25rem;
  font-weight: 600;
}

.home-sample > p:not(.home-checked) {
  max-width: 44rem;
  margin-top: 0.75rem;
  color: var(--ink-2);
  font-size: var(--read);
}

.home-sample [data-count="total"] {
  color: var(--ink);
  font-weight: 600;
}

.home-sample__links {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5rem 1.5rem;
  margin-top: 1.5rem;
}

.home-main .home-sample .home-checked {
  margin-top: 1.5rem !important;
  text-align: right;
  color: var(--ink-3);
  font-size: var(--fine);
}

/* 4. What is different: label in the 12.5rem column, one sentence beside it */
.home-lines {
  border-top: 1px solid var(--rule-strong);
}

.home-lines .home-line {
  padding: 1.125rem 0;
}

.home-lines .home-line h3 {
  grid-row: 1;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 600;
}

.home-lines .home-line p {
  color: var(--ink-2);
  font-size: 1rem;
}

/* 5. Book a first call: the two open questions, then the founder block */
.home-start__q {
  margin-bottom: 0.5rem;
  color: var(--ink);
  font-size: 1.0625rem;
  font-weight: 600;
}

.home-start details {
  border-bottom: 1px solid var(--rule);
}

.home-start details:first-of-type {
  border-top: 1px solid var(--rule-strong);
}

.home-start .home-act--end {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin: 2.5rem 0 0;
}

.home-start .home-act--end:has(.portrait:not([hidden])) {
  grid-template-columns: 17.5rem minmax(0, 1fr);
  column-gap: 1.75rem;
  align-items: end;
}

/* The map block on the universe page: the home's map, unchanged, at the page's width */
.universe-map .map-plot--tall {
  max-width: 34rem;
}

.universe-map .home-cap {
  max-width: 44rem;
}

@media (max-width: 48em) {
  .home-col {
    padding-right: 0;
  }

  .home-hero {
    padding-top: 1.25rem;
  }

  .home-hero .home-for {
    margin-top: 1rem;
  }

  html:lang(fr) .home-hero .home-h1 {
    font-size: 2.25rem;
  }

  .steps li {
    grid-template-columns: 2rem minmax(0, 1fr);
  }

  .home-sample {
    padding: 1.5rem 1.25rem 1.25rem;
  }

  .home-sample__links {
    flex-direction: column;
    align-items: flex-start;
  }

  /* each label becomes a small head above its sentence */
  .home-lines .home-line h3 {
    color: var(--ink-2);
    font-size: var(--fine);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}


/* v5 carry-over for pages outside the v6 export, 2026-11-10 */
/* Rules the v5 stylesheet had for selectors that the non-export pages (how-it-works, universe, sample-brief,
   privacy, terms, 404, French twins) and their scripts still use and the export does not style. Selectors
   whose classes also appear on the export pages are scoped with :where(body:not(#home, #pricing)), zero
   specificity; base element rules stay inside main so the masthead and footer render exactly as exported.
   Colours are Night desk tokens only. Generated from the v5 backup in _review/v5_backup_2026_11_10. */

:root {
  --w-display: 600;
  --section-gap: clamp(4rem, 8vw, 7rem);
  --sec-gap-x: clamp(2rem, 4vw, 4rem);
}

:where(body:not(#home, #pricing) main) h4,
:where(body:not(#home, #pricing) main) dl,
:where(body:not(#home, #pricing) main) blockquote {
  margin: 0;
}

:where(body:not(#home, #pricing) main) h4 {
  font-weight: var(--w-display);
  text-wrap: balance;
}

:where(body:not(#home, #pricing) main) p + p {
  margin-top: 0.9em;
}

:where(body:not(#home, #pricing) main) svg {
  display: block;
  max-width: 100%;
}

:where(body:not(#home, #pricing) main) button,
:where(body:not(#home, #pricing) main) select,
:where(body:not(#home, #pricing) main) input {
  touch-action: manipulation;
}

:where(body:not(#home, #pricing) main) button,
:where(body:not(#home, #pricing) main) input,
:where(body:not(#home, #pricing) main) select {
  font: inherit;
  color: inherit;
}

:where(body:not(#home, #pricing) main) ::selection {
  background: var(--ink);
  color: var(--bg);
}

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

.label {
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  color: var(--ink-3);
}

.noscript {
  margin: 1.5rem 0;
  padding: 1rem 1.25rem;
  border: 1px solid var(--rule);
  border-left: 1px solid var(--rule-strong);
  background: var(--raised);
  font-family: var(--sans);
  font-size: 0.9375rem;
}

:where(body:not(#home, #pricing)) .mt-0 {
  margin-top: 0;
}

.mt-1 {
  margin-top: 1rem;
}

.mt-15 {
  margin-top: 1.5rem;
}

.mt-2 {
  margin-top: 2rem;
}

.mt-25 {
  margin-top: 2.5rem;
}

.mb-05 {
  margin-bottom: 0.5rem;
}

.mb-075 {
  margin-bottom: 0.75rem;
}

:where(body:not(#home, #pricing)) .note .textlink {
  display: inline;
  min-height: 0;
}

.units {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(0.6rem, 1fr));
  gap: 2px;
}

.units--wide {
  grid-template-columns: repeat(auto-fill, minmax(0.9rem, 1fr));
  gap: 3px;
}

.u {
  display: block;
  aspect-ratio: 1 / 1;
}

.sw {
  display: inline-block;
  flex: none;
  width: 0.8rem;
  height: 0.8rem;
  vertical-align: -0.05em;
}

.s-acquired {
  background: repeating-linear-gradient(45deg, var(--ink) 0 1.5px, transparent 1.5px 3.5px);
  box-shadow: inset 0 0 0 1px var(--ink);
}

.s-branch_of_national {
  width: 0.6em;
  height: 0.6em;
  background: var(--set-aside);
}

.s-independent {
  background: var(--accent);
}

.s-unknown {
  background: var(--ink);
}

.s-other {
  background: var(--rule-strong);
}

.legend .sw {
  width: 0.85rem;
  height: 0.85rem;
}

.legend .count {
  font-family: var(--sans);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.legend .share {
  text-align: right;
  color: var(--ink-3);
  font-family: var(--sans);
  font-variant-numeric: tabular-nums;
}

:where(body:not(#home, #pricing)) .sec__grid {
  display: grid;
  gap: 2rem var(--sec-gap-x);
  border-top: 1px solid var(--rule-strong);
  padding-top: 1.5rem;
}

:where(body:not(#home, #pricing)) .sec__grid > * {
  min-width: 0;
}

.note {
  margin-top: 2rem;
  max-width: 36rem;
  padding-left: 1rem;
  border-left: 1px solid var(--rule-strong);
  font-size: 1rem;
  color: var(--ink-2);
}

:where(body:not(#home, #pricing)) .pagehead .folio {
  --rule-strong: var(--ink-3);
}

:where(body:not(#home, #pricing)) .pagehead .legal-status {
  border-color: var(--accent);
  color: var(--accent);
}

.ruled {
  list-style: none;
  max-width: 50rem;
  margin-top: 1.5rem;
  border-top: 1px solid var(--rule-strong);
}

.ruled li {
  position: relative;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--rule);
  color: var(--ink-2);
}

.ruled li strong {
  color: var(--ink);
  font-weight: 600;
}

.cells {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 2.25rem;
  border-top: 1px solid var(--rule-strong);
}

.cells > * {
  padding: 1.25rem 1.25rem 1.5rem 0;
}

.cells > * + * {
  padding-left: 1.25rem;
  border-left: 1px solid var(--rule);
}

.cells h3 {
  margin: 0.6rem 0;
}

.cells p {
  font-size: 1rem;
  color: var(--ink-2);
}

.split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 3rem;
}

.split--wide-left {
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
}

.split--wide-right {
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
}

.split > * {
  min-width: 0;
}

.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  border-top: 1px solid var(--rule-strong);
  border-bottom: 1px solid var(--rule);
}

.stat {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-height: var(--target);
  padding: 1rem 1.25rem 1.1rem 0;
  text-align: left;
}

button.stat {
  border: 0;
  background: none;
  cursor: pointer;
}

.stat + .stat {
  padding-left: 1.25rem;
  border-left: 1px solid var(--rule);
}

button.stat:hover {
  background: var(--raised);
  box-shadow: inset 0 -2px 0 var(--ink-3);
}

button.stat[aria-pressed="true"] {
  background: var(--raised);
  box-shadow: inset 0 1px 0 var(--ink);
}

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

.stat__label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--sans);
  font-weight: 600;
  color: var(--ink-2);
}

.stat__label .sw {
  width: 0.75rem;
  height: 0.75rem;
}

.stat__share {
  font-family: var(--sans);
  font-size: var(--fine);
  color: var(--ink-3);
}

.bridge {
  border-top: 1px solid var(--rule-strong);
  font-family: var(--sans);
}

.bridge__row {
  display: grid;
  grid-template-columns: minmax(8rem, 15rem) 5rem minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--rule);
}

.bridge--compact .bridge__row {
  grid-template-columns: minmax(7rem, 12rem) 4.5rem minmax(0, 1fr);
}

.bridge__label {
  font-size: 0.9375rem;
}

.bridge__label small {
  display: block;
  font-size: var(--fine);
  color: var(--ink-3);
}

.bridge__value {
  text-align: right;
  font-family: var(--sans);
  font-variant-numeric: tabular-nums;
}

.bridge__track {
  position: relative;
  height: 0.9rem;
  background: var(--rule);
}

.bridge__bar {
  position: absolute;
  top: 0;
  bottom: 0;
  background: var(--ink);
}

.bridge__check {
  margin-top: 0.85rem;
  font-family: var(--sans);
  font-size: var(--fine);
  color: var(--ink-2);
}

.bridge__check .ok {
  color: var(--ink);
  font-weight: 600;
}

.bridge__check .gap {
  color: var(--accent);
  font-weight: 600;
}

.tbl-wrap {
  overflow-x: auto;
}

.tbl {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--sans);
  font-size: 0.9375rem;
  font-variant-numeric: lining-nums tabular-nums;
}

.tbl caption {
  padding-bottom: 0.6rem;
  text-align: left;
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  color: var(--ink-3);
}

.tbl th,
.tbl td {
  padding: 0.55rem 0.75rem 0.55rem 0;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--rule);
}

.tbl thead th {
  font-size: var(--fine);
  font-weight: 600;
  color: var(--ink-3);
  border-top: 1px solid var(--rule-strong);
  border-bottom: 1px solid var(--rule-strong);
  white-space: nowrap;
  vertical-align: bottom;
}

.tbl tbody th {
  font-weight: 500;
}

.tbl .r {
  text-align: right;
  font-family: var(--sans);
}

.tbl tfoot th,
.tbl tfoot td {
  border-top: 1px solid var(--rule-strong);
  border-bottom: 2px solid var(--rule-strong);
  font-weight: 600;
}

.tbl tbody tr:hover {
  background: var(--raised);
}

.barcell {
  width: 38%;
  min-width: 7rem;
  vertical-align: middle;
}

.stackbar {
  display: flex;
  height: 0.8rem;
  background: var(--rule);
}

.stackbar span {
  display: block;
  height: 100%;
}

.leaders {
  list-style: none;
  border-top: 1px solid var(--rule-strong);
}

.leaders li {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--rule);
  font-family: var(--sans);
  font-size: 0.9375rem;
}

.leaders .dots {
  flex: 1;
  min-width: 1rem;
  border-bottom: 1px dotted var(--ink-3);
  transform: translateY(-0.25em);
}

.leaders .count {
  font-family: var(--sans);
  font-weight: 600;
}

.yearchart {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 3px;
  align-items: end;
  min-height: 9rem;
  border-bottom: 1px solid var(--rule-strong);
}

.yearchart__col {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 2px;
  padding-bottom: 2px;
}

.yearchart__col .u {
  width: 100%;
  max-width: 1.1rem;
}

.yearchart__n {
  font-family: var(--sans);
  font-size: var(--fine);
  line-height: 1.4;
  color: var(--ink-3);
}

.yearchart__years {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 3px;
  margin-top: 0.4rem;
  font-family: var(--sans);
  font-size: var(--fine);
  color: var(--ink-3);
}

.yearchart__years span {
  overflow: visible;
  white-space: nowrap;
  text-align: center;
}

.yearchart__years span:not(:first-child):not(:last-child):not(:nth-child(5n + 1)) {
  visibility: hidden;
}

:where(body:not(#home, #pricing)) .band--sunk .label {
  color: var(--accent);
}

.folio {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--rule-strong);
}

.folio > div {
  padding: 0.75rem 1rem 0.85rem 0;
  border-bottom: 1px solid var(--rule);
}

.folio > div:not(:nth-child(3n + 1)) {
  padding-left: 1rem;
  border-left: 1px solid var(--rule);
}

.folio dt {
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  color: var(--ink-3);
}

.folio dd {
  margin-top: 0.2rem;
  font-family: var(--sans);
  font-size: 0.9375rem;
}

.callout {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.25rem 1.25rem;
  padding: 1.25rem 1.5rem;
  background: var(--raised);
  border: 1px solid var(--rule);
  border-left: 1px solid var(--rule-strong);
}

.callout .label {
  color: var(--accent);
}

.callout > :not(.label) {
  grid-column: 2;
}

.callout p {
  color: var(--ink-2);
}

.callout p + p {
  margin-top: 0.6rem;
}

blockquote.callout {
  display: block;
  font-family: var(--sans);
  font-style: normal;
  font-size: 1.25rem;
  line-height: 1.4;
  color: var(--ink);
}

blockquote.callout p {
  color: var(--ink);
}

.callout--flush {
  margin: 1.5rem 0 0;
}

.controls {
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 2rem;
  padding: 1.25rem;
  background: var(--raised);
  border: 1px solid var(--rule);
  border-top: 1px solid var(--ink);
}

.field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}

.field label {
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  color: var(--ink-3);
}

.field input,
.field select {
  width: 100%;
  min-height: var(--target);
  padding: 0 0.75rem;
  background: var(--bg);
  border: 1px solid var(--rule-strong);
  border-radius: 0;
  font-family: var(--sans);
  font-size: 1rem;
  color: var(--ink);
}

.field input:hover,
.field select:hover {
  border-color: var(--ink);
}

.field input:focus-visible,
.field select:focus-visible {
  outline-offset: 0;
  border-color: var(--accent);
}

.field select {
  appearance: none;
  padding-right: 2.25rem;
  background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);
  background-position: right 1.15rem top 50%, right 0.8rem top 50%;
  background-size: 0.35rem 0.35rem;
  background-repeat: no-repeat;
  cursor: pointer;
}

.field--sort {
  display: none;
}

.controls__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.5rem;
  margin: 1.25rem 0 0.75rem;
  font-family: var(--sans);
  font-size: 0.9375rem;
}

.controls__bar p {
  font-family: var(--sans);
  font-size: 0.9375rem;
  color: var(--ink-2);
}

.controls__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

:where(#universe) .tbl {
  font-size: 0.9375rem;
}

:where(#universe) .tbl thead th {
  padding: 0 0.75rem 0 0;
  vertical-align: middle;
  background: var(--bg);
  box-shadow: 0 1px 0 var(--rule-strong);
}

:where(#universe) .tbl thead th:has(button) {
  padding: 0;
}

:where(#universe) .tbl .tags li {
  white-space: normal;
}

:where(#universe) .tbl .lic summary {
  white-space: nowrap;
}

:where(#universe) .tbl td[data-label="Services"] {
  min-width: 9rem;
}

:where(#universe) .tbl td.src {
  min-width: 10rem;
}

:where(#universe) .tbl th button {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
  min-height: var(--target);
  padding: 0 0.75rem 0 0;
  border: 0;
  background: none;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

:where(#universe) .tbl thead th:first-child button {
  padding-left: 0.6rem;
}

:where(#universe) .tbl th button:hover {
  color: var(--ink);
}

:where(#universe) .tbl th .sort-ind {
  display: inline-grid;
  gap: 0.125rem;
  margin-left: 0.375rem;
  vertical-align: 0.05em;
  color: var(--ink-3);
}

:where(#universe) .tbl th .sort-ind::before,
:where(#universe) .tbl th .sort-ind::after {
  content: "";
  border-inline: 0.25rem solid transparent;
  forced-color-adjust: none;
}

:where(#universe) .tbl th .sort-ind::before {
  border-bottom: 0.3125rem solid currentColor;
}

:where(#universe) .tbl th .sort-ind::after {
  border-top: 0.3125rem solid currentColor;
}

:where(#universe) .tbl th[aria-sort="ascending"] .sort-ind::after,
:where(#universe) .tbl th[aria-sort="descending"] .sort-ind::before {
  visibility: hidden;
}

:where(#universe) .tbl th[aria-sort="ascending"],
:where(#universe) .tbl th[aria-sort="descending"] {
  color: var(--accent);
}

:where(#universe) .tbl th[aria-sort="ascending"] .sort-ind,
:where(#universe) .tbl th[aria-sort="descending"] .sort-ind {
  color: var(--accent);
}

:where(#universe) .tbl tbody th {
  min-width: 12rem;
  padding-left: 0.6rem;
  font-family: var(--sans);
  font-size: 1rem;
  font-weight: var(--w-display);
  line-height: 1.35;
}

:where(#universe) .tbl tbody tr:nth-child(even) {
  background: color-mix(in srgb, var(--ink) 2.2%, transparent);
}

:where(#universe) .tbl tbody tr:hover,
:where(#universe) .tbl tbody tr:focus-within {
  background: var(--raised);
}

:where(#universe) .tbl tbody tr:hover > :first-child,
:where(#universe) .tbl tbody tr:focus-within > :first-child {
  box-shadow: inset 1px 0 0 var(--accent);
}

.tags {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}

.tags li {
  padding: 0.05rem 0.4rem;
  border: 1px solid var(--rule);
  background: var(--raised);
  font-size: var(--fine);
  line-height: 1.5;
  color: var(--ink-2);
  white-space: nowrap;
}

.status {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  white-space: nowrap;
}

.lic summary {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.35rem;
  min-height: var(--target);
  cursor: pointer;
  list-style: none;
  text-decoration: underline dotted;
  text-underline-offset: 3px;
}

.lic summary::-webkit-details-marker {
  display: none;
}

.lic summary::before {
  content: "";
  flex: none;
  width: 0.4rem;
  height: 0.4rem;
  margin: 0.5em 0.35rem 0 0.1rem;
  border-right: 1.5px solid var(--ink-2);
  border-bottom: 1.5px solid var(--ink-2);
  transform: rotate(-45deg);
}

.lic[open] summary::before {
  transform: rotate(45deg);
}

.lic ul {
  list-style: none;
  margin-top: 0.25rem;
  border-top: 1px solid var(--rule);
}

.lic li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0 0.75rem;
  padding: 0.25rem 0;
  border-bottom: 1px solid var(--rule);
  font-family: var(--sans);
  font-size: var(--fine);
}

.lic li .st {
  font-family: var(--sans);
  color: var(--ink-3);
}

.lic li .st.is-current {
  color: var(--ink);
  font-weight: 600;
}

.acq-date,
.acq-later {
  display: block;
  font-family: var(--sans);
  font-size: var(--fine);
  color: var(--ink-3);
}

.src a {
  display: inline-flex;
  align-items: flex-start;
  min-height: var(--target);
  font-family: var(--sans);
  font-size: var(--fine);
  overflow-wrap: break-word;
}

.empty-row td {
  padding: 1.5rem 0.6rem;
  font-family: var(--sans);
  color: var(--ink-2);
}

.defs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2rem;
  margin-top: 1.25rem;
  border-top: 1px solid var(--rule-strong);
}

.defs > div {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--rule);
}

.defs dt {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--sans);
  font-weight: 600;
  font-size: 0.9375rem;
}

.defs dd {
  margin-top: 0.25rem;
  font-size: 0.9375rem;
  color: var(--ink-2);
}

.defs--codes {
  grid-template-columns: minmax(0, 1fr);
}

.defs--codes dt {
  font-family: var(--sans);
  font-weight: 500;
  font-size: var(--fine);
}

.timeline {
  list-style: none;
  margin-top: 2.25rem;
  border-top: 1px solid var(--rule-strong);
}

.timeline > li {
  display: grid;
  grid-template-columns: 9rem minmax(0, 1fr) 15rem;
  gap: 1.5rem 2rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--rule);
}

.timeline__when strong {
  display: block;
  line-height: 1;
  color: var(--accent);
}

.timeline__when span {
  display: block;
  font-family: var(--sans);
}

.timeline h3 {
  margin-bottom: 0.4rem;
}

.timeline p {
  max-width: 36rem;
  color: var(--ink-2);
}

.timeline__out {
  padding-left: 1rem;
  border-left: 1px solid var(--rule-strong);
  font-size: 0.9375rem;
  color: var(--ink-2);
}

.timeline__out .label {
  display: block;
  margin-bottom: 0.3rem;
  color: var(--ink);
}

/* The guarantee row keeps the three columns of the rows above it (founder 2026-11-10 evening, "align the guarantee":
   the band's own padding and left border had pushed its label, text and aside 1.25rem to the right). The band now
   bleeds 1rem into the gutter on each side through box-shadow, so the grid columns stay on the same lines. */
.timeline > li.timeline__guard {
  background: var(--raised);
  box-shadow: 1rem 0 0 var(--raised), -1rem 0 0 var(--raised), calc(-1rem - 1px) 0 0 var(--rule-strong);
}

.definition {
  margin-top: 2rem;
  max-width: 50rem;
}

.definition ol {
  list-style: none;
  counter-reset: def;
  border-top: 1px solid var(--rule-strong);
}

.definition li {
  counter-increment: def;
  position: relative;
  padding: 0.85rem 0 0.85rem 3rem;
  border-bottom: 1px solid var(--rule);
  font-size: 1.0625rem;
}

.definition li::before {
  content: counter(def);
  position: absolute;
  left: 0;
  top: 0.55rem;
  font-family: var(--sans);
  font-size: 2rem;
  line-height: 1;
  color: var(--accent);
}

.report {
  background: var(--raised);
  border: 1px solid var(--rule);
  box-shadow: inset 0 1px 0 var(--ink);
}

.report__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.25rem 1rem;
  padding: 1.1rem 1.25rem 0.9rem;
  border-bottom: 1px solid var(--rule-strong);
  font-family: var(--sans);
  font-size: 0.9375rem;
}

.report dl > div {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: 1rem;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid var(--rule);
}

.report dl > div:last-child {
  border-bottom: 0;
}

.report dt {
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  color: var(--ink-3);
  padding-top: 0.2rem;
}

.report dd {
  font-size: 1rem;
  color: var(--ink-2);
}

.legal-status {
  display: inline-block;
  padding: 0.2rem 0.6rem;
  border: 1px solid var(--accent);
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  color: var(--accent);
}

.facts {
  padding: 1.25rem 1.5rem;
  background: var(--raised);
  border: 1px solid var(--rule);
}

.facts .ruled {
  margin-top: 0;
}

.facts--doc {
  max-width: 46rem;
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 2rem;
}

.legal-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.5rem;
  max-width: 46rem;
  margin: 2rem 0 0;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--rule-strong);
  font-family: var(--sans);
  font-size: var(--fine);
  color: var(--ink-3);
}

.legal-doc {
  max-width: 42rem;
  padding-bottom: var(--section-gap);
  font-size: 1.125rem;
  line-height: 1.7;
}

.legal-doc > p:first-child {
  margin-top: 2rem;
  font-size: 1.25rem;
}

.legal-doc h2 {
  margin: 2.75rem 0 0.85rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rule);
  font-family: var(--sans);
  font-size: 1.5rem;
  font-weight: var(--w-display);
  line-height: 1.25;
}

.legal-doc p {
  color: var(--ink-2);
}

.legal-doc .placeholder {
  margin-top: 1rem;
  padding-left: 1rem;
  border-left: 1px solid var(--rule-strong);
  font-style: normal;
  color: var(--ink-3);
}

@media (min-width: 56.3125em) {
  .legal {
    display: grid;
    grid-template-columns: minmax(0, 42rem) minmax(0, 1fr);
    grid-template-rows: auto auto minmax(0, 1fr);
    column-gap: clamp(3rem, 7vw, 7rem);
    align-items: start;
    padding-top: clamp(2.5rem, 5vw, 3.5rem);
  }

  .legal .legal-doc {
    grid-column: 1;
    grid-row: 1 / span 3;
  }

  .legal .legal-doc > :first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  .legal .legal-meta {
    grid-column: 2;
    grid-row: 1;
    flex-direction: column;
    max-width: 24rem;
    margin: 0.35rem 0 0;
  }

  .legal .facts--doc {
    grid-column: 2;
    grid-row: 2;
    max-width: 24rem;
    margin: 1.75rem 0 0;
  }
}

.notfound {
  position: relative;
  overflow: hidden;
  padding: clamp(5rem, 12vw, 9rem) 0;
  background: var(--bg);
  color: var(--ink);
}

:where(body:not(#home, #pricing)) .notfound .wrap {
  position: relative;
}

:where(body:not(#home, #pricing)) .notfound .display {
  max-width: 16ch;
}

@media (min-width: 68.8125em) {
  :where(#universe) .tbl-wrap {
    overflow: visible;
  }

  :where(#universe) .tbl thead th {
    position: sticky;
    top: var(--mast-h);
    z-index: 2;
  }

  :where(#universe) .tbl tbody :is(tr, a, button, summary, [tabindex]) {
    scroll-margin-top: 3.5rem;
  }
}

@media (max-width: 68.75em) {
  .stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .stat:nth-child(4) {
    padding-left: 0;
    border-left: 0;
  }

  .stat:nth-child(n + 4) {
    border-top: 1px solid var(--rule);
  }

  .controls {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .timeline > li {
    grid-template-columns: 8rem minmax(0, 1fr);
  }

  .timeline__out {
    grid-column: 2;
  }
}

@media (max-width: 56.25em) {
  :where(body:not(#home, #pricing)) .sec__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
  }

  .split,
  .split--wide-left,
  .split--wide-right {
    grid-template-columns: minmax(0, 1fr);
  }

  .field--sort {
    display: flex;
  }

  :where(#universe) .tbl thead {
    display: none;
  }

  :where(#universe) .census-more:not([hidden]) {
    display: flex;
    justify-content: center;
    padding: 1.25rem 0 0;
  }

  :where(#universe) .tbl,
  :where(#universe) .tbl tbody,
  :where(#universe) .tbl tr,
  :where(#universe) .tbl th,
  :where(#universe) .tbl td {
    display: block;
  }

  :where(#universe) .tbl tbody tr {
    padding: 0.9rem 0;
    border-bottom: 1px solid var(--rule-strong);
  }

  :where(#universe) .tbl tbody tr:nth-child(even) {
    background: none;
  }

  :where(#universe) .tbl tbody th {
    min-width: 0;
    padding: 0 0 0.4rem;
    border: 0;
    font-size: 1.125rem;
  }

  :where(#universe) .tbl tbody td {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    gap: 0.75rem;
    min-width: 0;
    padding: 0.3rem 0;
    border: 0;
  }

  :where(#universe) .tbl .lic summary {
    white-space: normal;
  }

  :where(#universe) .tbl tbody td::before {
    content: attr(data-label);
    padding-top: 0.15rem;
    font-family: var(--sans);
    font-size: var(--fine);
    font-weight: 600;
    color: var(--ink-3);
  }

  :where(#universe) .tbl tbody tr:hover > :first-child,
  :where(#universe) .tbl tbody tr:focus-within > :first-child {
    box-shadow: none;
  }

  :where(#universe) .tbl .empty-row td {
    display: block;
  }

  :where(#universe) .tbl .empty-row td::before {
    content: none;
  }
}

@media (max-width: 40em) {
  .cells > *,
  .cells > * + * {
    padding-left: 0;
    border-left: 0;
    border-top: 0;
    border-bottom: 1px solid var(--rule);
  }

  .stats {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .stat:first-child {
    grid-column: 1 / -1;
  }

  .stat,
  .stat + .stat,
  .stat:nth-child(4) {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--rule);
  }

  .stat:nth-child(odd):not(:first-child) {
    padding-left: 1rem;
    border-left: 1px solid var(--rule);
  }

  .stat:first-child {
    border-top: 0;
  }

  .controls {
    grid-template-columns: minmax(0, 1fr);
    padding: 1rem;
  }

  .bridge__row,
  .bridge--compact .bridge__row {
    grid-template-columns: minmax(0, 1fr) 4rem;
  }

  .bridge__track {
    grid-column: 1 / -1;
  }

  .barcell {
    width: 30%;
    min-width: 4rem;
  }

  .folio {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .folio > div:not(:nth-child(3n + 1)) {
    padding-left: 0;
    border-left: 0;
  }

  .folio > div:nth-child(even) {
    padding-left: 1rem;
    border-left: 1px solid var(--rule);
  }

  .callout {
    grid-template-columns: minmax(0, 1fr);
  }

  .callout > :not(.label) {
    grid-column: 1;
  }

  .defs {
    grid-template-columns: minmax(0, 1fr);
  }

  .timeline > li {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.5rem 0.75rem;
    align-items: baseline;
  }

  .timeline > li > div:not([class]) {
    display: contents;
  }

  .timeline > li > div:not([class]) > :not(h3),
  .timeline__out {
    grid-column: 1 / -1;
  }

  .report dl > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.25rem;
  }

  .legal-doc {
    font-size: 1.0625rem;
  }
}

@media (max-width: 19.9375em) {
  .legend .share {
    grid-column: 2 / -1;
    text-align: left;
  }
}

@media print {
  .controls,
  .controls__bar .controls__actions {
    display: none;
  }

  .notfound,
  .report,
  .callout,
  .facts {
    background: var(--bg);
    color: #000;
    box-shadow: none;
  }

  .tbl-wrap {
    overflow: visible;
  }

  :where(#universe) .tbl thead th {
    position: static;
  }

  :where(body:not(#home, #pricing) main) thead {
    display: table-header-group;
  }

  :where(body:not(#home, #pricing) main) tr,
  .timeline > li {
    break-inside: avoid;
  }
}

:where(body:not(#home, #pricing)) .notfound .display {
  font-size: 2rem;
}

.timeline__when strong {
  font-family: var(--sans);
  font-size: 0.9375rem;
  font-weight: 600;
  font-variant-numeric: lining-nums tabular-nums;
}

.timeline__when span {
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--ink);
}

.notfound {
  min-height: 0;
}

:where(body:not(#home, #pricing) main) data,
:where(body:not(#home, #pricing) main) time {
  font-variant-numeric: lining-nums tabular-nums;
}

:where(body:not(#home, #pricing) main) time {
  white-space: nowrap;
}

.callout .label,
:where(body:not(#home, #pricing)) .band--sunk .label,
.timeline__when strong,
.crosses li::before,
.definition li::before,
.lic summary::before {
  color: var(--ink-3);
}

.lic summary:hover {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

.tags li,
.lic li,
.acq-date,
.acq-later,
.src a,
.stat__share {
  font-size: var(--fine);
}

.legal-doc:not(:has(> :not(.placeholder))) {
  min-height: 100vh;
}

:where(body:not(#home, #pricing)) .brief-next .home-link {
  display: inline;
  padding-block: 0;
}

:where(body:not(#home, #pricing)) .home-funnel .is-total :is(th, td) {
  font-weight: 600;
  color: var(--ink);
  border-top: 1px solid var(--ink);
  border-bottom: 0;
}

:where(body:not(#home, #pricing)) .home-funnel .is-total .is-neg {
  color: var(--accent);
}

:where(body:not(#home, #pricing)) .home-funnel .is-total td:last-child span {
  text-decoration: underline double;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.35em;
}

#brief .pagehead .display {
  font-size: 2.5rem;
  max-width: 32ch;
}

#brief .pagehead p {
  max-width: 68ch;
  margin-top: 1rem;
  color: var(--ink-2);
}

.brief {
  padding-block: 2.5rem 4.5rem;
}

.brief-doc {
  max-width: 60rem;
  background: var(--bg);
  border: 1px solid var(--rule);
  font-family: var(--sans);
}

.brief-doc__bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.25rem 1rem;
  padding: 0.625rem 1.25rem;
  background: var(--raised);
  border-bottom: 1px solid var(--rule);
  font-size: var(--fine);
}

.brief-doc__bar p + p {
  margin-top: 0;
}

:where(body:not(#home, #pricing)) .brief-doc__id {
  font-weight: 600;
  color: var(--ink);
  font-variant-numeric: lining-nums tabular-nums;
}

:where(body:not(#home, #pricing)) .brief-doc__state {
  font-weight: 600;
  color: var(--accent);
}

.brief-meta > div {
  display: grid;
  grid-template-columns: 9rem minmax(0, 1fr);
  gap: 0.25rem 1rem;
  padding: 0.625rem 1.25rem;
  border-bottom: 1px solid var(--rule);
  font-size: 0.9375rem;
  line-height: 1.5;
}

.brief-meta dt {
  color: var(--ink-3);
}

.brief-meta dd {
  margin: 0;
  color: var(--ink);
  font-variant-numeric: lining-nums tabular-nums;
}

.brief-doc__note {
  padding: 0.625rem 1.25rem;
  font-size: var(--fine);
  color: var(--ink-3);
}

.brief-doc h2 {
  padding: 1.75rem 1.25rem 0.625rem;
  border-top: 1px solid var(--rule);
  font-family: var(--sans);
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.3;
}

.brief-scroll {
  overflow-x: auto;
}

.brief-scroll:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.brief-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
  line-height: 1.45;
  font-variant-numeric: lining-nums tabular-nums;
}

.brief-table thead th {
  padding: 0.5rem 1.25rem;
  background: var(--raised);
  border-block: 1px solid var(--rule);
  font-size: var(--fine);
  font-weight: 600;
  text-align: left;
  color: var(--ink-3);
}

.brief-table tbody :is(th, td) {
  padding: 0.625rem 1.25rem;
  border-bottom: 1px solid var(--rule);
  text-align: left;
  vertical-align: top;
}

.brief-table tbody th {
  width: 24%;
  font-weight: 500;
  color: var(--ink);
}

.brief-table--signals tbody th {
  width: 34%;
}

.brief-table tbody td {
  color: var(--ink-2);
}

.brief-table tbody td:last-child:not(:nth-child(2)) {
  color: var(--ink-3);
}

.brief-table tbody tr:hover :is(th, td) {
  background: var(--raised);
}

:where(body:not(#home, #pricing)) .brief-unk {
  color: var(--ink-3);
}

.brief-held {
  display: inline-block;
  padding: 0 0.375rem;
  border: 1px dashed var(--rule-strong);
  font-size: var(--fine);
  font-weight: 600;
  line-height: 1.6;
  color: var(--ink-3);
}

.brief-mark {
  display: inline-block;
  min-width: 3.25rem;
  padding: 0 0.375rem;
  border: 1px solid var(--rule-strong);
  font-size: var(--fine);
  font-weight: 600;
  line-height: 1.6;
  text-align: center;
  color: var(--ink-3);
}

.brief-mark--yes {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--bg);
}

.brief-table--signals .brief-mark {
  margin-right: 0.5rem;
}

:where(body:not(#home, #pricing)) .brief-table tr.is-total :is(th, td) {
  font-weight: 600;
  color: var(--ink);
  border-top: 1px solid var(--ink);
}

.brief-table tr.is-yes :is(th, td),
.brief-table tr.is-yes:hover :is(th, td) {
  background: var(--raised);
  color: var(--ink);
}

.brief-held-block,
.brief-small,
.brief-tally {
  padding: 0 1.25rem 1rem;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--ink-2);
}

.brief-small {
  padding-top: 0.75rem;
  font-size: var(--fine);
  color: var(--ink-3);
}

.brief-tally strong {
  font-weight: 600;
  color: var(--ink);
}

.brief-sources {
  margin-top: 0;
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--rule);
  font-size: var(--fine);
  line-height: 1.55;
  color: var(--ink-3);
}

.brief-doc p + p,
.brief-doc p + h2,
.brief-doc div + h2,
.brief-doc div + p {
  margin-top: 0;
}

.brief-next {
  max-width: 60rem;
  margin-top: 1.25rem;
  font-family: var(--sans);
  font-size: 1rem;
  color: var(--ink-2);
}

@media (max-width: 35.99rem) {
  .brief-meta > div {
    grid-template-columns: minmax(0, 1fr);
  }

  .brief-doc__bar,
  .brief-meta > div,
  .brief-doc__note,
  .brief-doc h2,
  .brief-held-block,
  .brief-small,
  .brief-tally,
  .brief-sources {
    padding-inline: 1rem;
  }

  .brief-table thead th,
  .brief-table tbody :is(th, td) {
    padding-inline: 0.75rem;
  }
}

@media (max-width: 56.25em) {
  :where(#universe) .tbl tbody tr {
    content-visibility: auto;
    contain-intrinsic-size: auto 10rem;
  }
}

@media (max-width: 40em) {
  .tbl[data-county-table] .barcell {
    display: none;
  }

  .tbl[data-county-table] thead th {
    white-space: normal;
  }
}

.cells {
  display: block;
  max-width: 60rem;
  margin-top: 1.5rem;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--rule-strong);
}

.cells > *,
.cells > * + * {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.25rem 2rem;
  padding: 1rem 0;
  border: 0;
  border-bottom: 1px solid var(--rule);
}

@media (min-width: 48em) {
  .cells > *,
  .cells > * + * {
    grid-template-columns: minmax(0, 16rem) minmax(0, 1fr);
  }
}

.cells h3 {
  margin: 0;
  font-size: 1.0625rem;
  line-height: 1.4;
}

.cells p {
  margin: 0;
  font-size: 1rem;
}

:where(body:not(#home, #pricing)) .sec__grid {
  grid-template-columns: minmax(0, 1fr);
}

:where(body:not(#home, #pricing)) .notfound .display {
  max-width: 25em;
  font-size: 2.5rem;
  line-height: 1.12;
  text-wrap: balance;
}

@media (max-width: 40em) {
  :where(body:not(#home, #pricing)) .notfound .display {
    font-size: 2rem;
  }
}

.stat__value {
  font-family: var(--sans);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.2;
}

.stat__label {
  font-size: 0.9375rem;
}

.tbl-wrap,
.brief-scroll {
  overscroll-behavior-x: contain;
}

.timeline__when span {
  margin-top: 0;
}

.definition figcaption,
.report__head > span {
  font-family: var(--sans);
  font-size: 1rem;
  font-weight: 600;
  color: var(--ink);
}

@media (max-width: 40em) {
  #brief .pagehead .display {
    font-size: 2rem;
  }
}

:where(body:not(#home, #pricing) main) [data-checked] {
  text-wrap: balance;
}

.tbl-wrap :focus-visible {
  outline-offset: -2px;
}

/* ---------- Round 7b: ink and paper (founder pick 2026-11-10) */
/* Paper is the ground (the :root tokens). Navy is the second ground: the masthead, the page head of every page
   (the home hero, the 404 notice), the home proof card, the universe map panel and the footer. Inside a navy
   ground the same tokens are set again, so text, rules, buttons and focus rings follow without new rules.
   Borrowed idea: the inverted results card on DealSource, rebuilt as our navy proof card on paper.
   --lit is the one warm colour: deep amber on paper, the original amber on navy. */

:root {
  --lit: #8f5a0c; /* 5.12:1 on paper, 4.64:1 on the sunk paper */
}

.masthead,
.pagehead,
.home-hero,
.home-sample,
.notfound,
.map-fig,
.colophon {
  --bg: #13213a;
  --raised: #13213a;
  --ink: #f2ede2;
  --ink-2: #cdc7ba;
  --ink-3: #b0aa9d; /* 6.95:1 on navy */
  --rule: #6a7587; /* 3.45:1 on navy */
  --rule-strong: #6a7587;
  --accent: #e0a64a; /* 7.44:1 on navy */
  --on-accent: #13213a;
  --set-aside: #b0aa9d;
  --lit: #e0a64a;
  background: var(--bg);
  color: var(--ink);
}

/* The masthead and the page head read as one navy band. */
.masthead {
  border-bottom-color: var(--bg);
}

.pagehead,
.home-hero {
  padding-bottom: clamp(2.5rem, 5vw, 4rem);
}

.colophon {
  border-top: 0;
}

/* The draft notice sits under the footer, on paper. */
.draft-banner {
  --bg: #f4f1ea;
  --ink: #121a26;
  --ink-2: #3a4250;
  --rule: #827f77;
  --accent: #13213a;
}

/* The map keeps its lit quality on a navy panel that bleeds past the plot. */
.map-fig {
  box-shadow: 0 0 0 clamp(1rem, 2.5vw, 1.75rem) var(--bg);
}

/* The panel is as wide as its caption, so no empty navy sits beside the plot. */
.universe-map .map-fig {
  max-width: 44rem;
}

/* The warm marks on paper: step numerals, the totals, the independent squares, the running total bars. */
.steps li::before,
.home-sample [data-count="total"],
.home-funnel tr.is-total td:last-child,
:where(body:not(#home, #pricing)) .home-funnel .is-total td:last-child span {
  color: var(--lit);
}

.home-funnel tbody th {
  --accent: var(--lit);
}

.s-independent {
  background: var(--lit);
}

/* The 631 squares: an unknown owner is the map's own colour, navy on paper and amber on the navy panel. */
.s-unknown {
  background: var(--accent);
}

/* The county stack bars sit on a pale track so the grey segment still reads (5.14:1). */
.stackbar {
  background: #e2ddd1;
}

/* Booking modal (2026-11-11): Cal.com's booking page in a <dialog> over the page (assets/js/site.js openBooking).
   A paper bar with the title and the X, the frame below on Cal.com's own white ground. Display is set on [open]
   only: a closed dialog keeps the browser's display none. Full screen under 40em. */
dialog.book-modal {
  width: min(96vw, 72rem);
  height: min(92vh, 56rem);
  max-width: none;
  max-height: none;
  padding: 0;
  border: 1px solid var(--rule-strong);
  border-radius: 0;
  background: var(--bg);
  color: var(--ink);
}

dialog.book-modal[open] {
  display: flex;
  flex-direction: column;
}

.book-modal::backdrop {
  background: rgba(18, 26, 38, 0.55);
}

.book-modal__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: var(--target);
  padding: 0 0.5rem 0 1rem;
  border-bottom: 1px solid var(--rule);
  font: 600 var(--ui) / 1.2 var(--sans);
}

.book-modal__close {
  min-width: var(--target);
  min-height: var(--target);
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font: 400 1.5rem / 1 var(--sans);
  cursor: pointer;
}

.book-modal__close:hover {
  border-color: var(--ink);
}

.book-modal iframe {
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  border: 0;
  background: #fff;
}

.has-modal {
  overflow: hidden;
}

@media (max-width: 40em) {
  dialog.book-modal {
    width: 100vw;
    height: 100dvh;
    max-width: 100vw;
    max-height: 100dvh;
    margin: 0;
    border: 0;
  }
}

/* ---------- Sample universe pages and their hub (dev/build_universe_pages.py, 2026-11-10).
   One scoped block: every rule sits under :where(#universes), the wrapper the generator writes inside <main>. ---------- */
:where(#universes) .crumbs {
  margin-bottom: 1rem;
  font-family: var(--sans);
  font-size: var(--fine);
  color: var(--ink-3);
}

:where(#universes) .crumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

:where(#universes) .crumbs li + li::before {
  content: "/";
  margin-right: 0.5rem;
  color: var(--rule);
}

:where(#universes) .crumbs a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

:where(#universes) .crumbs [aria-current="page"] {
  color: var(--ink-2);
}

:where(#universes) .u-rank {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--rule-strong);
  font-family: var(--sans);
}

:where(#universes) .u-rank li {
  display: grid;
  grid-template-columns: minmax(8rem, 14rem) 4.5rem minmax(0, 1fr);
  grid-template-areas: "name n sq" "mix mix mix";
  gap: 0.2rem 1rem;
  align-items: center;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--rule);
}

:where(#universes) .u-rank__name {
  grid-area: name;
  font-size: 0.9375rem;
}

:where(#universes) .u-rank__n {
  grid-area: n;
  text-align: right;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

:where(#universes) .u-rank__mix {
  grid-area: mix;
  font-size: var(--fine);
  color: var(--ink-3);
  font-variant-numeric: tabular-nums;
}

:where(#universes) .u-rank__sq {
  grid-area: sq;
  max-width: 100%;
  height: auto;
}

:where(#universes) .u-legend__n {
  margin-left: 0.5rem;
  font-variant-numeric: tabular-nums;
}

:where(#universes) .u-why {
  margin-top: 0.5rem;
  color: var(--ink-2);
}

:where(#universes) .u-group {
  margin: 2rem 0 0.75rem;
  font-family: var(--sans);
  font-size: var(--fine);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-3);
}

:where(#universes) .u-group:first-child {
  margin-top: 0;
}

:where(#universes) .u-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: 1.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

:where(#universes) .u-card {
  padding-top: 0.75rem;
  border-top: 2px solid var(--accent);
}

:where(#universes) .u-card__title {
  margin: 0 0 0.35rem;
  font-family: var(--serif);
  font-size: 1.125rem;
}

:where(#universes) .u-card p {
  margin: 0;
  font-size: var(--fine);
  color: var(--ink-2);
}

:where(#universes) .bridge__row--total {
  font-weight: 600;
  border-bottom-color: var(--rule-strong);
}

/* A removed slice is hatched so it still reads on the grey track; the published universe is the accent. */
:where(#universes) .bridge__bar--removed {
  background: repeating-linear-gradient(135deg, var(--ink-3) 0 2px, transparent 2px 5px);
}

:where(#universes) .bridge__bar--final {
  background: var(--accent);
}

@media (max-width: 40em) {
  :where(#universes) .u-rank li {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "name n" "mix mix" "sq sq";
  }
}