/*
 * readiness.css — "Where you stand", the AI readiness check.
 *
 * Scoped under body.biz so nothing here can reach a visitor page. Every colour
 * is derived from the six site colours, or from the --biz-* surfaces that
 * business.css already remaps for dark mode, so this file follows the theme
 * without touching a file it does not own.
 *
 * Three ideas run through the whole sheet:
 *   1. A level is never a colour. It is a word in mono, a bar count and a bar
 *      height. The tint only agrees with the word.
 *   2. Everything survives 390px. The ladder rows stack, the option cards go
 *      one per line, the three lists become one column.
 *   3. It prints. The masthead, the picker and the questions drop away and the
 *      result becomes a sheet somebody can hand to a member of staff.
 *
 * Prefix is .rd-. Nothing here clashes with style.css, business.css, nav.css,
 * icons.css, bizcheck.css or biztools.css.
 */

/* ------------------------------------------------------------- tokens */

body.biz {
  --rd-mark:  color-mix(in srgb, var(--biz-ink) 82%, transparent);
  --rd-ghost: color-mix(in srgb, var(--biz-ink) 26%, transparent);
  --rd-card:  var(--biz-panel);
  --rd-line:  var(--biz-line);

  --rd-link:  var(--pine);

  --rd-l0: transparent;
  --rd-l1: color-mix(in srgb, var(--sandy) 55%, var(--biz-panel));
  --rd-l2: color-mix(in srgb, var(--shallow) 30%, var(--biz-panel));
  --rd-l3: color-mix(in srgb, var(--pine) 38%, var(--biz-panel));
  --rd-lna: color-mix(in srgb, var(--biz-ink) 6%, var(--biz-panel));
}

/* Dark. business.css remaps the --biz-* surfaces already, so most of this file
   follows on its own. What does not follow is anything built on --pine or
   --sandy, because those two are fixed brand colours the site never remaps.
   Pine on a dark panel is a link nobody can read, so it is named again here.
   Declared twice for the same reason business.css declares its own twice: once
   for the system setting, once for the explicit toggle. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body.biz {
    --rd-link: #8fd6d1;
    --rd-l1: color-mix(in srgb, var(--sandy) 26%, var(--biz-panel));
    --rd-l2: color-mix(in srgb, var(--shallow) 30%, var(--biz-panel));
    --rd-l3: color-mix(in srgb, #8fd6d1 26%, var(--biz-panel));
  }
}
:root[data-theme="dark"] body.biz {
  --rd-link: #8fd6d1;
  --rd-l1: color-mix(in srgb, var(--sandy) 26%, var(--biz-panel));
  --rd-l2: color-mix(in srgb, var(--shallow) 30%, var(--biz-panel));
  --rd-l3: color-mix(in srgb, #8fd6d1 26%, var(--biz-panel));
}

body.biz [hidden] { display: none !important; }

/* ------------------------------------------------- the seven parts grid */

.rd-parts {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(232px, 1fr));
}
.rd-part {
  background: var(--rd-card);
  border: 1px solid var(--rd-line);
  border-radius: 18px;
  padding: 18px 18px 16px;
}
.rd-part-n {
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .1em;
  color: var(--biz-soft);
  display: block;
  margin-bottom: 10px;
}
.rd-part h3 {
  margin: 0 0 6px;
  font-size: 1.04rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 9px;
}
.rd-part p { margin: 0; color: var(--biz-soft); font-size: .9rem; line-height: 1.5; }
.rd-part .rd-part-lv {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid var(--rd-line);
  font-family: var(--font-mono);
  font-size: .66rem;
  letter-spacing: .06em;
  color: var(--biz-soft);
  display: block;
}

/* --------------------------------------------------------- the picker */

.rd-pick {
  background: var(--rd-card);
  border: 1px solid var(--rd-line);
  border-radius: 18px;
  padding: 22px;
  max-width: 720px;
}
.rd-pick h3 { margin: 0 0 6px; font-size: 1.1rem; font-weight: 600; }
.rd-pick > p { margin: 0 0 14px; color: var(--biz-soft); font-size: .92rem; }

.rd-search { position: relative; }
.rd-search label {
  display: block;
  font-family: var(--font-mono);
  font-size: .66rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--biz-soft);
  margin-bottom: 7px;
}
.rd-search input {
  width: 100%;
  font: inherit;
  font-size: 1rem;
  padding: 13px 15px;
  border-radius: 14px;
  border: 1.5px solid var(--rd-line);
  background: var(--biz-ground);
  color: var(--biz-ink);
}
.rd-search input:focus-visible { outline: 2px solid var(--shallow); outline-offset: 2px; }

.rd-hits { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 7px; }
.rd-hit {
  width: 100%;
  text-align: left;
  font: inherit;
  cursor: pointer;
  background: var(--biz-ground);
  border: 1px solid var(--rd-line);
  border-radius: 13px;
  padding: 11px 14px;
  color: var(--biz-ink);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
}
.rd-hit:hover { border-color: var(--shallow); }
.rd-hit:focus-visible { outline: 2px solid var(--shallow); outline-offset: 2px; }
.rd-hit b { font-weight: 600; }
.rd-hit span { color: var(--biz-soft); font-size: .84rem; }
.rd-hit em {
  font-style: normal;
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--biz-soft);
  margin-left: auto;
}
.rd-none { margin: 12px 0 0; color: var(--biz-soft); font-size: .9rem; }

.rd-or {
  margin: 20px 0 12px;
  padding-top: 18px;
  border-top: 1px solid var(--rd-line);
  font-family: var(--font-mono);
  font-size: .66rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--biz-soft);
}
.rd-types { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.rd-type {
  font: inherit;
  font-size: .9rem;
  cursor: pointer;
  background: var(--biz-ground);
  border: 1px solid var(--rd-line);
  border-radius: 999px;
  padding: 9px 15px;
  color: var(--biz-ink);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.rd-type:hover { border-color: var(--shallow); }
.rd-type:focus-visible { outline: 2px solid var(--shallow); outline-offset: 2px; }
.rd-type[aria-pressed="true"] {
  background: var(--biz-ink);
  color: var(--biz-panel);
  border-color: var(--biz-ink);
}

/* ---------------------------------------------------- what we found */

.rd-found {
  margin: 18px 0 0;
  background: var(--biz-ground);
  border: 1px solid var(--rd-line);
  border-radius: 16px;
  padding: 17px 18px;
}
.rd-found h4 {
  margin: 0 0 4px;
  font-size: .98rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 9px;
}
.rd-found > p { margin: 0 0 12px; color: var(--biz-soft); font-size: .88rem; }
.rd-found .sg-facts { margin: 0; }
.rd-conf {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  font-family: var(--font-mono);
  font-size: .64rem;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--biz-soft);
  border: 1px solid var(--rd-line);
  border-radius: 999px;
  padding: 5px 11px;
}

.rd-go {
  margin-top: 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font: inherit;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  background: var(--biz-ink);
  color: var(--biz-panel);
  border: 0;
  border-radius: 999px;
  padding: 13px 24px;
}
.rd-go:hover { background: var(--pine); }
.rd-go:focus-visible { outline: 2px solid var(--shallow); outline-offset: 3px; }
.rd-go[disabled] { opacity: .45; cursor: not-allowed; }

/* ------------------------------------------------------ the questions */

.rd-quiz {
  background: var(--rd-card);
  border: 1px solid var(--rd-line);
  border-radius: 18px;
  padding: 24px;
  max-width: 760px;
}

.rd-prog { margin-bottom: 20px; }
.rd-prog-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--biz-soft);
  margin-bottom: 9px;
}
.rd-prog-bar { display: flex; gap: 4px; }
.rd-prog-bar i {
  flex: 1;
  height: 5px;
  border-radius: 3px;
  background: var(--rd-ghost);
}
.rd-prog-bar i.on { background: var(--rd-mark); }
.rd-prog-bar i.now { background: var(--shallow); }

.rd-q { margin: 0 0 4px; font-size: clamp(1.25rem, 3.4vw, 1.6rem); font-weight: 600; line-height: 1.28; }
/* The heading takes focus when the question changes, so a screen reader lands
   on the new question rather than on nothing. It carries tabindex="-1", so no
   keyboard user can ever reach it by tabbing and no ring is owed to anybody.
   Chrome decides focus-visible from the last input modality, which on a fresh
   page can be "keyboard", so both states have to be named. */
.rd-q:focus, .rd-q:focus-visible { outline: none; }
.rd-q-sub { margin: 0 0 18px; color: var(--biz-soft); font-size: .92rem; }

.rd-opts { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.rd-opt {
  width: 100%;
  text-align: left;
  font: inherit;
  cursor: pointer;
  background: var(--biz-ground);
  border: 1.5px solid var(--rd-line);
  border-radius: 15px;
  padding: 14px 16px;
  color: var(--biz-ink);
  display: grid;
  gap: 5px;
}
.rd-opt:hover { border-color: var(--shallow); }
.rd-opt:focus-visible { outline: 2px solid var(--shallow); outline-offset: 2px; }
.rd-opt[aria-pressed="true"] { border-color: var(--biz-ink); background: var(--rd-card); }
.rd-opt-lv {
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 8px;
}
.rd-opt-t { font-size: .95rem; line-height: 1.5; }
.rd-opt-mark {
  margin-left: auto;
  font-family: var(--font-sans);
  font-size: .62rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--biz-soft);
  border: 1px solid var(--rd-line);
  border-radius: 999px;
  padding: 3px 9px;
}

.rd-qfoot {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--rd-line);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.rd-back, .rd-restart {
  font: inherit;
  font-size: .88rem;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 6px 2px;
  color: var(--biz-soft);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.rd-back:hover, .rd-restart:hover { color: var(--biz-ink); }
.rd-back:focus-visible, .rd-restart:focus-visible { outline: 2px solid var(--shallow); outline-offset: 2px; }
.rd-qfoot .rd-go { margin: 0; padding: 11px 20px; font-size: .94rem; }
.rd-qfoot .rd-spacer { flex: 1; }

.rd-tip {
  margin: 14px 0 0;
  background: var(--biz-quiet);
  border: 1px solid var(--rd-line);
  border-radius: 14px;
  padding: 13px 15px;
  display: flex;
  gap: 11px;
  align-items: flex-start;
  font-size: .89rem;
  color: var(--biz-soft);
}
.rd-tip .ic { flex: none; margin-top: 2px; }
.rd-tip b { color: var(--biz-ink); font-weight: 600; }

/* ---------------------------------------------------------- the result */

.rd-verdict h2 { margin: 0 0 8px; }
.rd-who {
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--biz-soft);
  margin: 0 0 10px;
}

/* the counts. The design system's .sg-cap spans every track, which stops
   auto-fit collapsing the empty ones, so the columns are named here instead. */
#rd-out .sg-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 660px; }
#rd-out .sg-stats.has-na { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 880px; }

/* the ladder — the picture of where you stand */

.rd-ladder { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.rd-ladder-cap { margin: 26px 0 0; }
.rd-row {
  background: var(--rd-card);
  border: 1px solid var(--rd-line);
  border-radius: 16px;
  padding: 16px 20px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 5px 26px;
  align-items: center;
}
.rd-row h3 {
  margin: 0;
  font-size: 1.02rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  grid-column: 1;
}
.rd-steps { grid-column: 2; grid-row: 1 / span 2; width: 168px; height: 50px; display: block; }
.rd-steps .rd-on   { fill: var(--rd-mark); stroke: none; }
.rd-steps .rd-off  { fill: color-mix(in srgb, var(--biz-ink) 5%, transparent); stroke: var(--rd-ghost); stroke-width: 1.3; stroke-dasharray: 3.5 3.5; }
.rd-steps .rd-flat { fill: none; stroke: var(--rd-ghost); stroke-width: 1.8; stroke-dasharray: 5 5; stroke-linecap: round; }
.rd-row-say { margin: 0; grid-column: 1; color: var(--biz-soft); font-size: .91rem; line-height: 1.5; }

.rd-lv {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-mono);
  font-size: .64rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  border: 1px solid var(--rd-line);
  border-radius: 999px;
  padding: 4px 10px;
  white-space: nowrap;
}
.rd-lv-0 { background: var(--rd-l0); color: var(--biz-soft); }
.rd-lv-1 { background: var(--rd-l1); color: var(--biz-ink); }
.rd-lv-2 { background: var(--rd-l2); color: var(--biz-ink); }
.rd-lv-3 { background: var(--rd-l3); color: var(--biz-ink); }
.rd-lv-na { background: var(--rd-lna); color: var(--biz-soft); }

/* three lists */

.rd-lists {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  margin-top: 26px;
  align-items: start;
}
.rd-list {
  background: var(--rd-card);
  border: 1px solid var(--rd-line);
  border-radius: 18px;
  padding: 20px;
}
.rd-list > h3 {
  margin: 0 0 4px;
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--biz-soft);
  font-weight: 500;
}
.rd-list > p { margin: 0 0 14px; font-size: .88rem; color: var(--biz-soft); }
.rd-list ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 13px; }
.rd-item { display: grid; grid-template-columns: 22px 1fr; gap: 4px 10px; }
.rd-item > .ic { grid-column: 1; grid-row: 1 / span 3; margin-top: 2px; color: var(--biz-soft); }
.rd-item b { grid-column: 2; font-weight: 600; font-size: .95rem; line-height: 1.4; }
.rd-item span { grid-column: 2; color: var(--biz-soft); font-size: .87rem; line-height: 1.5; }
.rd-item a {
  grid-column: 2;
  font-size: .87rem;
  font-weight: 500;
  color: var(--rd-link);
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, currentColor 40%, transparent);
  justify-self: start;
  margin-top: 3px;
  line-height: 1.4;
}
.rd-item a:hover { border-bottom-color: currentColor; }
.rd-more {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--rd-line);
  font-size: .85rem;
  color: var(--biz-soft);
}

/* the single biggest gap. The one bougainvillea on this screen. */
.rd-item.rd-first b::after {
  content: "Biggest gap";
  display: inline-block;
  margin-left: 9px;
  vertical-align: middle;
  font-family: var(--font-mono);
  font-size: .58rem;
  font-weight: 400;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #fff;
  background: var(--bougie);
  border-radius: 999px;
  padding: 3px 9px;
}

/* the three jobs */

.rd-three { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); }
.rd-job {
  background: var(--rd-card);
  border: 1px solid var(--rd-line);
  border-radius: 18px;
  padding: 20px;
  display: flex;
  flex-direction: column;
}
.rd-job-n {
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .1em;
  color: var(--biz-soft);
  display: block;
  margin-bottom: 10px;
}
.rd-job h3 { margin: 0 0 7px; font-size: 1.08rem; font-weight: 600; line-height: 1.3; }
.rd-job .rd-job-one { margin: 0 0 13px; color: var(--biz-soft); font-size: .9rem; line-height: 1.5; }
.rd-job .rd-job-why {
  margin: 0 0 13px;
  padding-left: 12px;
  border-left: 2px solid var(--shallow);
  font-size: .88rem;
  line-height: 1.5;
}
.rd-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 13px; padding: 0; list-style: none; }
.rd-tag {
  font-family: var(--font-mono);
  font-size: .6rem;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--biz-soft);
  border: 1px solid var(--rd-line);
  border-radius: 999px;
  padding: 4px 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.rd-job .rd-job-step { margin: 0 0 13px; font-size: .9rem; line-height: 1.55; }
.rd-job .rd-job-step b { font-weight: 600; }
.rd-job .rd-job-cost { margin: 0 0 14px; font-size: .84rem; color: var(--biz-soft); line-height: 1.5; }
.rd-job .rd-job-go {
  margin-top: auto;
  font-size: .87rem;
  font-weight: 500;
  color: var(--rd-link);
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, currentColor 40%, transparent);
  align-self: start;
}
.rd-job .rd-job-go:hover { border-bottom-color: currentColor; }

/* the actions under the result */

.rd-actions {
  margin-top: 26px;
  padding-top: 20px;
  border-top: 1px solid var(--rd-line);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
}
.rd-actions .rd-go { margin: 0; }
.rd-saved {
  font-family: var(--font-mono);
  font-size: .64rem;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--biz-soft);
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

/* ------------------------------------------------------ the step foot */

.rd-next {
  background: var(--rd-card);
  border: 1px solid var(--rd-line);
  border-radius: 18px;
  padding: 24px;
  max-width: 720px;
}
.rd-next .rd-next-k {
  margin: 0 0 8px;
  font-family: var(--font-mono);
  font-size: .68rem;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--biz-soft);
}
.rd-next h2 { margin: 0 0 8px; font-size: clamp(1.3rem, 3vw, 1.7rem); font-weight: 600; }
.rd-next h2 a { color: inherit; text-decoration: none; border-bottom: 2px solid var(--shallow); }
.rd-next h2 a:hover { border-bottom-color: currentColor; }
.rd-next > p { margin: 0 0 16px; color: var(--biz-soft); font-size: .94rem; }
.rd-also {
  margin: 0;
  padding-top: 15px;
  border-top: 1px solid var(--rd-line);
  font-size: .88rem;
  color: var(--biz-soft);
}
.rd-also a { color: var(--rd-link); }

/* -------------------------------------------------------------- phone */

@media (max-width: 640px) {
  .rd-pick, .rd-quiz, .rd-next { padding: 18px; border-radius: 16px; }
  .rd-row { grid-template-columns: 1fr; row-gap: 12px; padding: 15px 17px; }
  .rd-steps { grid-column: 1; grid-row: auto; width: 168px; max-width: 100%; height: 46px; }
  .rd-list { padding: 17px; }
  .rd-job { padding: 17px; }
  .rd-hit em { margin-left: 0; width: 100%; }
  .rd-qfoot .rd-spacer { display: none; }
  .rd-qfoot .rd-go { width: 100%; justify-content: center; }
}

@media (max-width: 400px) {
  .rd-opt { padding: 13px 14px; }
  .rd-opt-lv { flex-wrap: wrap; }
  .rd-opt-mark { margin-left: 0; }
  .rd-prog-top { font-size: .62rem; letter-spacing: .05em; }
}

/* ------------------------------------------------------------- motion */

@media (prefers-reduced-motion: reduce) {
  .rd-opt, .rd-hit, .rd-type, .rd-go { transition: none !important; }
}

/* -------------------------------------------------------------- print
   What comes out of the printer is the result and nothing else: the shape,
   the three lists and the three jobs. Somebody can hand that to staff. */

@media print {
  .masthead, .flagstripe, footer, .inpage, .navsheet, .sitesearch,
  #the-seven, #rd-start, #rd-check, #rd-next, .rd-actions, .modal,
  .bizfacts, .dateline, .crumbs, .kicker, .bizhead .stand,
  .bizhead .stand-2 { display: none !important; }

  /* The printed sheet is the result and nothing else, so it can be handed to
     whoever is going to do the work without eight pages of explanation. */
  .bizhead h1 { font-size: 20pt; margin: 0 0 6pt; }
  .rd-verdict h2, .rd-verdict > p:last-child { display: none; }
  .rd-who { margin-top: 0; }

  body.biz { background: #fff; color: #000; font-size: 11pt; }
  body.biz section { padding: 0 0 12pt; background: none !important; }
  .bizhead { padding: 0 0 10pt; background: none; }

  .rd-list, .rd-job, .rd-row {
    background: none;
    border: 1px solid #999;
    break-inside: avoid;
  }
  .rd-lists { grid-template-columns: 1fr 1fr; }
  .rd-three { grid-template-columns: 1fr 1fr; }
  .rd-item span, .rd-list > p, .rd-row-say, .rd-job .rd-job-one { color: #333; }
  .rd-item a, .rd-job .rd-job-go { color: #000; border-bottom: 0; }
  .rd-item a::after, .rd-job .rd-job-go::after { content: ""; }
  .rd-steps .rd-on { fill: #000; }
  .rd-steps .rd-off, .rd-steps .rd-flat { stroke: #999; }
  .rd-lv { border-color: #666; background: none !important; color: #000; }
  .rd-item.rd-first b::after { color: #000; background: none; border: 1px solid #000; }
}

/* -------------------------------------------------- the pick-up note
   Sits above all three panels because it belongs to the page, not to any one
   of them. Its own thin band so it does not collide with the section rhythm. */

.rd-resume-sec { padding: 18px 0 0 !important; }
.rd-resume-sec .rd-tip { max-width: 720px; margin: 0; }
@media print { .rd-resume-sec { display: none !important; } }
.rd-resume-sec .rd-tip a { color: var(--rd-link); font-weight: 500; white-space: nowrap; }

/* the heading above the three jobs */
.rd-h { margin: 34px 0 0; font-size: 1.3rem; font-weight: 600; }
.rd-sub { margin: 6px 0 0; color: var(--biz-soft); max-width: 64ch; }
.rd-sub a { color: var(--rd-link); }
.rd-hint { margin: 10px 0 0; font-size: .86rem; color: var(--biz-soft); }
