/* MassGrowth Markets storefront: the holding page's look (white paper, navy-graphite ink, silver hairlines,
   IBM Plex Sans), carried through the whole page. No inline styles and no scripts: the site's policy allows
   neither (_headers). */
:root {
  --paper: #ffffff;
  --ink: #182230;
  --ink-2: #4a5566;
  --ink-3: #5f6b7a;
  --silver-1: #f2f4f7;
  --silver-2: #d5dae1;
  --silver-3: #8c96a3;
  --blue: #00508f; /* the logo's blue: the chart's target, a progress bar, focus rings */
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: clip; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 400 1rem/1.55 "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a { color: var(--ink); }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; border-radius: 6px; }
[id] { scroll-margin-top: 1.5rem; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 1rem; top: -4rem; padding: .5rem .75rem; border-radius: 6px; background: var(--ink); color: #ffffff; text-decoration: none; }
.skip:focus { top: 1rem; }

.page {
  max-width: 68rem;
  margin: 0 auto;
  padding: clamp(1.25rem, 4vw, 2.5rem) clamp(1rem, 5vw, 3.5rem);
}

/* The figures and the name: brushed graphite-silver, crossed once by a sheen as the page opens. */
.metal {
  color: var(--ink);
  background-image:
    linear-gradient(100deg, transparent 0 40%, rgba(255, 255, 255, 0.9) 50%, transparent 60% 100%),
    linear-gradient(180deg, #7a8594 0%, #3e4a5b 52%, #5c6878 100%);
  background-size: 260% 100%, 100% 100%;
  background-repeat: no-repeat;
  background-position: 0% 0, 0 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: sheen 1.6s cubic-bezier(.4, 0, .2, 1) .3s both;
}
@keyframes sheen {
  from { background-position: 100% 0, 0 0; }
  to { background-position: 0% 0, 0 0; }
}
@media (prefers-reduced-motion: reduce) { .metal { animation: none; } }
@media (forced-colors: active) { .metal { -webkit-text-fill-color: CanvasText; background: none; } }

/* The bar: as the holding page. */
.bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.25rem 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--silver-2);
}
.wordmark {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  font-weight: 600;
  font-size: clamp(1rem, 0.9rem + 0.5vw, 1.125rem);
  letter-spacing: -0.01em;
  color: var(--ink-2);
  white-space: nowrap;
  text-decoration: none;
}
.wordmark img { height: 40px; width: auto; display: block; }
.links { display: flex; align-items: center; gap: 1.75rem; }
.links a { font-size: 0.9375rem; color: var(--ink-2); text-decoration: none; white-space: nowrap; }
.links a:hover { color: var(--ink); }
/* The way into the client area: on every page, on a phone as well, where the section links give way to it. */
.links a.signin {
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  padding: 0 1.125rem;
  border-radius: 8px;
  box-shadow: inset 0 0 0 1px var(--silver-2);
  color: var(--ink);
  font-weight: 500;
  transition: box-shadow .2s ease;
}
.links a.signin:hover { box-shadow: inset 0 0 0 1px var(--silver-3); }
@media (max-width: 860px) { .links .opt { display: none; } }

/* The opening: as the holding page, with the two ways in. */
.hero { padding: clamp(3rem, 12vh, 8rem) 0 clamp(3.5rem, 10vh, 7rem); max-width: 52rem; }
h1 {
  margin: 0;
  font-weight: 500;
  font-size: clamp(2.25rem, 1.2rem + 4.6vw, 4.75rem);
  line-height: 1.04;
  letter-spacing: -0.025em;
  text-wrap: balance;
}
.lead {
  margin: clamp(1.75rem, 4vw, 2.75rem) 0 0;
  max-width: 40rem;
  font-size: clamp(1.125rem, 0.98rem + 0.7vw, 1.5rem);
  line-height: 1.5;
  color: var(--ink-2);
}
.lead b { font-weight: 600; }
.ctas { margin-top: clamp(2rem, 4vw, 2.75rem); display: flex; flex-wrap: wrap; gap: 0.75rem; }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.125rem;
  padding: 0 1.5rem;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  transition: background-color .2s ease, box-shadow .2s ease;
}
.btn-ink { background: var(--ink); color: #ffffff; }
.btn-ink:hover { background: #0c1420; color: #ffffff; }
.btn-line { background: #ffffff; color: var(--ink); box-shadow: inset 0 0 0 1px var(--silver-2); }
.btn-line:hover { box-shadow: inset 0 0 0 1px var(--silver-3); }
@media (max-width: 520px) { .ctas .btn { width: 100%; } }

/* The opening's film: the trading floor behind the words, on a phone and a computer alike. It is an image, not a
   video element, so it plays like a GIF with no controls, iPhone Low Power Mode included: Safari takes the MP4 as an
   image (decoded by the phone's video hardware: Safari plays animated AVIF slowly), and the other browsers take the
   animated AVIF. The light grade is baked in (saturate 1.5, brightness 1.1, contrast 0.97, then 78% over white).
   It reaches the window's edges, fades into the page at the top and the bottom, and a soft white light sits behind
   the words. The still frame shows while it loads, to a visitor who asks for reduced motion, and to a browser
   without AVIF. */
.hero { position: relative; isolation: isolate; }
.hero-film,
.hero::after {
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: calc((min(68rem, 100vw) - 100vw) / 2 - clamp(1rem, 5vw, 3.5rem)); /* from the words' edge out to the window's */
  width: 100vw;
  pointer-events: none;
}
.hero-film {
  overflow: hidden;
  background: url("/media/hero-floor-v1.jpg") var(--film-at) / cover no-repeat;
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 6%, #000 78%, transparent);
  mask-image: linear-gradient(180deg, transparent, #000 6%, #000 78%, transparent);
}
.hero-film picture,
.hero-film img { display: block; width: 100%; height: 100%; }
.hero-film img { object-fit: cover; object-position: var(--film-at); }
.hero::after { content: ""; background: var(--film-light); }
@media (max-width: 899.98px) {
  .hero {
    padding-bottom: 18vh;
    --film-at: 62% 45%;
    --film-light: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.6) 12%, rgba(255, 255, 255, 0.64) 36%, rgba(255, 255, 255, 0.78) 42%, rgba(255, 255, 255, 0.78) 60%, rgba(255, 255, 255, 0.34) 68%, rgba(255, 255, 255, 0.16) 86%, rgba(255, 255, 255, 0) 100%);
  }
}
@media (min-width: 900px) {
  /* On a computer the opening fills the first screen below the bar (the page's top padding, the 40px logo, the
     bar's 1rem and its hairline), with the words centred in it; the next section starts at the fold. */
  .hero {
    max-width: 46rem;
    min-height: calc(100vh - clamp(1.25rem, 4vw, 2.5rem) - 40px - 1rem - 1px);
    min-height: calc(100svh - clamp(1.25rem, 4vw, 2.5rem) - 40px - 1rem - 1px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    --film-at: 50% 30%;
    --film-light: linear-gradient(90deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.9) 36%, rgba(255, 255, 255, 0.6) 52%, rgba(255, 255, 255, 0.18) 68%, rgba(255, 255, 255, 0) 80%);
  }
  .hero .lead { max-width: 34rem; }
}
@media (forced-colors: active), print { .hero-film, .hero::after { display: none; } }

/* Each section: a hairline, the title on the left, the content on the right (stacked on a phone). */
.sec {
  border-top: 1px solid var(--silver-2);
  padding: clamp(3.5rem, 9vw, 6.5rem) 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
}
@media (min-width: 900px) { .sec { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 4rem; } }
h2 {
  margin: 0;
  font-weight: 500;
  font-size: clamp(1.75rem, 1.1rem + 2.4vw, 3rem);
  line-height: 1.08;
  letter-spacing: -0.022em;
  text-wrap: balance;
}
.sub { margin: 1rem 0 0; max-width: 22rem; font-size: 1.0625rem; color: var(--ink-2); }
.say { margin: 0; max-width: 38rem; font-size: clamp(1.125rem, 1rem + 0.4vw, 1.3125rem); line-height: 1.5; color: var(--ink-2); }
h3 { margin: 0; font-size: 1.125rem; font-weight: 600; letter-spacing: -0.005em; }

/* The two rules. */
.figs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem clamp(1.5rem, 4vw, 3rem); }
.big { display: block; font-weight: 500; font-size: clamp(4rem, 2rem + 7vw, 7rem); line-height: 1; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.fig h3 { margin-top: 1rem; }
.fig p { margin: 0.5rem 0 0; color: var(--ink-2); }
.lines { list-style: none; margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; border-top: 1px solid var(--silver-2); }
.lines li { padding: 1rem 0; border-bottom: 1px solid var(--silver-2); color: var(--ink-2); }
.lines b { color: var(--ink); font-weight: 600; }

/* The illustration: a Phase 1 account between its floor and its target. */
.chart-fig { margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; }
.chart { position: relative; width: 100%; aspect-ratio: 2 / 1; }
.chart svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: visible; }
.tag { position: absolute; right: 0; transform: translateY(-145%); font-size: 0.8125rem; line-height: 1; color: var(--ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.tag b { font-weight: 600; color: var(--ink); }
.tag-target { top: 16.667%; }
.tag-start { top: 50%; }
.tag-floor { top: 83.333%; }
.chart-cap { margin: 1.25rem 0 0; max-width: 34rem; font-size: 0.875rem; line-height: 1.5; color: var(--ink-3); }
.draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 2.4s cubic-bezier(.45, 0, .2, 1) .35s forwards; }
.dot { opacity: 0; animation: appear .5s ease 2.6s forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes appear { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .draw { animation: none; stroke-dashoffset: 0; } .dot { animation: none; opacity: 1; } }

/* Three steps. */
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.steps li { border-top: 1px solid var(--silver-2); padding-top: 1.25rem; }
.phase { margin: 0; font-size: 0.9375rem; font-weight: 600; color: var(--ink-2); }
.steps .big { font-size: clamp(3.25rem, 1.8rem + 4.5vw, 5rem); margin-top: 0.75rem; }
.steps p { margin: 0.75rem 0 0; color: var(--ink-2); }
.steps .phase { margin: 0; }
.after { margin: clamp(2rem, 4vw, 2.75rem) 0 0; max-width: 36rem; color: var(--ink-2); }
@media (max-width: 640px) { .steps { grid-template-columns: minmax(0, 1fr); gap: 2rem; } }

/* The accounts: a term sheet per programme. */
.track + .track { margin-top: clamp(3rem, 6vw, 4.5rem); }
.track-note { margin: 0.5rem 0 0; max-width: 36rem; color: var(--ink-2); }
.sheet { margin-top: 1.5rem; overflow-x: auto; }
.terms { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.terms th, .terms td { padding: 1rem 0 1rem 0.75rem; border-bottom: 1px solid var(--silver-2); text-align: right; font-size: 1.0625rem; white-space: nowrap; }
.terms thead th { font-size: clamp(1.0625rem, 0.9rem + 0.6vw, 1.375rem); font-weight: 500; letter-spacing: -0.01em; padding-bottom: 0.875rem; border-bottom: 1px solid var(--ink); }
.terms thead th:first-child { text-align: left; padding-left: 0; font-size: 0.875rem; font-weight: 400; color: var(--ink-3); }
.terms tbody th { text-align: left; font-weight: 500; padding-left: 0; white-space: normal; }
.terms tbody th span { display: block; font-size: 0.875rem; font-weight: 400; color: var(--ink-3); margin-top: 0.125rem; }
/* The price closes each sheet, between two ink rules like its sizes, with a way to start under each size. */
.terms tr:has(+ .price) > * { border-bottom-color: var(--ink); }
.terms .price td { font-size: 1.375rem; font-weight: 600; letter-spacing: -0.01em; }
.terms .price > * { border-bottom-color: var(--ink); }
.terms .go > * { padding-top: 1.25rem; border-bottom: 0; }
.btn-go { min-height: 2.75rem; padding: 0 1.375rem; font-size: 0.9375rem; }
@media (max-width: 560px) {
  .terms th, .terms td { font-size: 0.9375rem; padding: 0.875rem 0 0.875rem 0.5rem; }
  .terms thead th { font-size: 1rem; }
  .terms .price td { font-size: 1.125rem; }
  .btn-go { min-height: 2.5rem; padding: 0 0.875rem; }
}

/* The firm, and what is in the account. */
.quad { margin-top: clamp(2rem, 4vw, 2.75rem); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1.5rem, 4vw, 3rem); }
.quad > div { border-top: 1px solid var(--silver-2); padding: 1.25rem 0 1.75rem; }
.quad p { margin: 0.375rem 0 0; color: var(--ink-2); }
.quad.first { margin-top: 0; }
@media (max-width: 640px) { .quad { grid-template-columns: minmax(0, 1fr); } }

/* "If you grow, we grow with you" opens on a band: the draft's chart film, turned light (inverted) in the "rich"
   grade and baked in, behind the words. It reaches the window's edges and fades into the page on every side, with a
   soft white light behind the words; on a phone the candles sit to the right of them. The four statements follow
   below, across the page. Same image rules as the opening's film (Safari takes the MP4, the others the AVIF). */
.sec.firm { grid-template-columns: minmax(0, 1fr); gap: 0; }
.firm-band {
  position: relative;
  isolation: isolate;
  text-align: center;
  padding: clamp(5rem, 16vh, 10rem) 0;
  --chart-at: 50% 50%;
  --chart-light: radial-gradient(ellipse 34% 40% at 50% 50%, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0));
}
.band-film,
.firm-band::after {
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: calc((min(68rem, 100vw) - 100vw) / 2 - clamp(1rem, 5vw, 3.5rem)); /* from the page's edge out to the window's */
  width: 100vw;
  pointer-events: none;
}
.band-film {
  overflow: hidden;
  background: url("/media/success-chart-v1.jpg") var(--chart-at) / cover no-repeat;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent), linear-gradient(180deg, transparent, #000 24%, #000 76%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent), linear-gradient(180deg, transparent, #000 24%, #000 76%, transparent);
  mask-composite: intersect;
}
.band-film picture,
.band-film img { display: block; width: 100%; height: 100%; }
.band-film img { object-fit: cover; object-position: var(--chart-at); }
.firm-band::after { content: ""; background: var(--chart-light); }
.firm-band h2 { margin: 0 auto; font-size: clamp(2rem, 1.2rem + 3.4vw, 3.75rem); line-height: 1.06; letter-spacing: -0.02em; }
.firm-band .say { margin: 1.5rem auto 0; max-width: 34rem; }
@media (max-width: 640px) {
  .firm-band {
    --chart-at: 80% 50%;
    --chart-light: radial-gradient(ellipse 64% 30% at 50% 50%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0));
  }
}
@media (forced-colors: active), print { .band-film, .firm-band::after { display: none; } }

.panel-fig { margin: 0; }
.panel { border: 1px solid var(--silver-2); border-radius: 12px; padding: clamp(1.25rem, 3vw, 1.75rem); background: #ffffff; }
.panel-top { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.chip { display: inline-flex; align-items: center; min-height: 1.625rem; padding: 0 0.625rem; border-radius: 6px; background: var(--silver-1); font-size: 0.8125rem; font-weight: 500; color: var(--ink-2); }
.acct { font-size: 0.9375rem; font-weight: 600; }
.pair { margin-top: 1.5rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.k { display: block; font-size: 0.8125rem; color: var(--ink-3); }
.v { display: block; margin-top: 0.125rem; font-size: clamp(1.5rem, 1.2rem + 1vw, 1.875rem); font-weight: 500; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.meter { margin-top: 1.5rem; }
.meter-row { display: flex; justify-content: space-between; gap: 0.75rem; font-size: 0.875rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.meter-row b { color: var(--ink); font-weight: 600; }
.meter-row span:last-child { white-space: nowrap; }
@media (max-width: 420px) { .meter-row { flex-direction: column; gap: 0.125rem; } }
.track-bar { margin-top: 0.5rem; height: 6px; border-radius: 999px; background: var(--silver-1); overflow: hidden; }
.track-bar span { display: block; height: 100%; border-radius: 999px; background: var(--blue); }
.track-bar.ink span { background: var(--ink); }
.w40 { width: 40%; }
.w93 { width: 93%; }
.floor { margin-top: 1.375rem; padding-top: 1.125rem; border-top: 1px solid var(--silver-1); display: flex; justify-content: space-between; gap: 0.75rem; font-size: 0.875rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.floor b { color: var(--ink); font-weight: 600; }
.panel-cap { margin: 0.75rem 0 0; font-size: 0.8125rem; color: var(--ink-3); }

/* Questions. */
.faq { border-top: 1px solid var(--silver-2); }
.faq details { border-bottom: 1px solid var(--silver-2); }
.faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem 0; font-size: 1.0625rem; font-weight: 500; color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary svg { flex: none; color: var(--ink-3); transition: transform .25s ease; }
.faq details[open] summary svg { transform: rotate(45deg); }
.faq details p { margin: 0; padding: 0 2.5rem 1.5rem 0; color: var(--ink-2); }
.faq details p a { color: var(--ink); text-underline-offset: 0.18em; }
.ask { margin: 1.75rem 0 0; color: var(--ink-2); }
.ask a { color: var(--ink); text-underline-offset: 0.18em; }

/* The foot: as the holding page. */
footer { padding-top: 1rem; border-top: 1px solid var(--silver-2); display: grid; gap: 0.75rem; }
.foot-links { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
.foot-links a { font-size: 0.8125rem; color: var(--ink-2); text-decoration: none; }
.foot-links a:hover { color: var(--ink); }
.legal { margin: 0; max-width: 46rem; font-size: 0.8125rem; color: #5f6b7a; }
/* The company's registration, as the law asks: small and light, but still easy to read (4.6:1 on white). */
.reg { margin: -0.375rem 0 0; font-size: 0.6875rem; line-height: 1.5; color: #6b7685; }

/* The firm's documents (the rules, the terms, privacy, risk, refunds): the contents beside the text on a computer,
   one reading column on a phone. */
.doc-head { padding: clamp(2.5rem, 8vh, 5rem) 0 clamp(2rem, 5vh, 3rem); max-width: 46rem; }
.doc-head h1 { font-size: clamp(2.25rem, 1.4rem + 3vw, 3.5rem); }
/* The page for an address that is not here (404.html): room before the foot. */
.doc-head.lost { padding-bottom: clamp(4rem, 16vh, 9rem); }
.doc-head .updated { margin: 1rem 0 0; font-size: 0.9375rem; color: var(--ink-3); }
.doc-head .opening { margin: 1.5rem 0 0; max-width: 40rem; font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem); line-height: 1.55; color: var(--ink-2); }
.draft-note { margin: 1.5rem 0 0; max-width: 40rem; padding: 0.875rem 1rem; border-left: 3px solid var(--blue); background: var(--silver-1); font-size: 0.9375rem; line-height: 1.55; color: var(--ink-2); }
.doc-body { border-top: 1px solid var(--silver-2); padding: clamp(2rem, 5vw, 3.5rem) 0 clamp(3.5rem, 9vw, 6rem); display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.doc-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.doc-toc a { font-size: 0.9375rem; line-height: 1.4; color: var(--ink-2); text-decoration: none; }
.doc-toc a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 0.18em; }
@media (max-width: 899.98px) { .doc-toc { padding-bottom: 1.75rem; border-bottom: 1px solid var(--silver-2); } }
@media (min-width: 900px) {
  .doc-body { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 4rem; }
  .doc-toc { position: sticky; top: 1.5rem; align-self: start; }
}
.doc-text { max-width: 42rem; }
.doc-text section + section { margin-top: 3rem; }
.doc-text h2 { font-size: clamp(1.375rem, 1.2rem + 0.6vw, 1.625rem); line-height: 1.2; letter-spacing: -0.015em; }
.doc-text h3 { margin-top: 1.75rem; font-size: 1.0625rem; }
.doc-text p, .doc-text li { line-height: 1.65; color: var(--ink-2); }
.doc-text p { margin: 0.875rem 0 0; }
.doc-text ul, .doc-text ol { margin: 0.875rem 0 0; padding-left: 1.25rem; }
.doc-text li + li { margin-top: 0.5rem; }
.doc-text li::marker { color: var(--silver-3); }
.doc-text b { color: var(--ink); font-weight: 600; }
.doc-text a { color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.doc-text mark { background: #fff3c4; color: var(--ink); padding: 0 0.15em; border-radius: 3px; }
.doc-table { width: 100%; margin: 1rem 0 0; border-collapse: collapse; font-size: 0.9375rem; }
.doc-table th, .doc-table td { padding: 0.75rem 1rem 0.75rem 0; border-bottom: 1px solid var(--silver-2); text-align: left; vertical-align: top; line-height: 1.5; }
.doc-table th { color: var(--ink); font-weight: 600; }
.doc-table td { color: var(--ink-2); }
.doc-table tr > :last-child { padding-right: 0; }

/* The foot's second row: the firm's documents. */
.foot-docs { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
.foot-docs a { font-size: 0.8125rem; color: var(--ink-3); text-decoration: none; }
.foot-docs a:hover { color: var(--ink); }