/* ══════════════════════════════════════════════════════════════════════════
   PRICING COMPARISON + ENTERPRISE POSITIONING                        v139
   Loaded after drapto.system.css. Uses the existing tokens only — no new
   colour literals, so the palette stays unified with the rest of the site.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── TIER COMPARISON MATRIX ─────────────────────────────────────────────── */
.pcmp { margin: var(--s-6) 0 0; }

/* Real table so it stays readable without JS and screen readers get the
   row/column relationship. .tbl-scroll (v139) does the horizontal scroll. */
.pcmp table { width: 100%; border-collapse: collapse; min-width: 720px; }

.pcmp th, .pcmp td {
  padding: var(--s-3) var(--s-4);
  text-align: left;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
.pcmp thead th {
  font-family: var(--font-display);
  font-size: 15px;
  color: var(--ink);
  border-bottom: 2px solid var(--d-line);
  white-space: nowrap;
}
.pcmp thead th span {
  display: block;
  font-family: var(--font-body);
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ink-3);
  white-space: normal;
  margin-top: 2px;
}
.pcmp tbody th {
  font-weight: 600;
  font-size: 14px;
  color: var(--ink-2);
  width: 30%;
}
.pcmp td { font-size: 14px; color: var(--ink-2); }

/* The recommended column reads as one continuous band, not four loose cells. */
.pcmp .is-focus { background: var(--d-cloud); }
.pcmp thead .is-focus { border-bottom-color: var(--d-electric); }

.pcmp-price { font-family: var(--font-display); font-size: 21px; color: var(--ink); letter-spacing: -.02em; }
.pcmp-price small { display: block; font-family: var(--font-body); font-size: 12px; font-weight: 500; color: var(--ink-3); letter-spacing: 0; }

/* Yes/no as a mark, not the word — the eye scans a column of marks far
   faster than a column of "Yes". */
.pcmp-y, .pcmp-n { display: inline-block; width: 18px; height: 18px; border-radius: 50%; line-height: 18px; text-align: center; font-size: 11px; font-weight: 700; }
.pcmp-y { background: var(--d-success); color: #fff; }
.pcmp-n { background: var(--line); color: var(--ink-3); }

/* ── BED → TIER SCALE ───────────────────────────────────────────────────── */
.bedscale { margin: var(--s-6) 0 0; }
.bedscale-track { display: flex; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.bedscale-seg { flex: 1; padding: var(--s-4); border-right: 1px solid var(--line); min-width: 0; }
.bedscale-seg:last-child { border-right: 0; }
.bedscale-seg b { display: block; font-family: var(--font-display); font-size: 15px; color: var(--ink); }
.bedscale-seg i { display: block; font-style: normal; font-size: 12px; color: var(--ink-3); margin-top: 2px; }
.bedscale-seg u { display: block; text-decoration: none; font-size: 13.5px; font-weight: 600; color: var(--d-electric); margin-top: var(--s-2); }
.bedscale-seg.is-quoted u { color: var(--ink-3); }

@media (max-width: 720px) {
  .bedscale-track { flex-direction: column; }
  .bedscale-seg { border-right: 0; border-bottom: 1px solid var(--line); }
  .bedscale-seg:last-child { border-bottom: 0; }
}

/* ── SHARED HOSPITAL–EMPLOYER NETWORK ───────────────────────────────────── */
.netmap { margin: var(--s-6) 0 0; }
.netmap svg { display: block; width: 100%; height: auto; }
.netmap-cap { font-size: 13px; color: var(--ink-3); margin-top: var(--s-3); }

.nm-box { fill: #fff; stroke: var(--d-line); stroke-width: 1.5; }
.nm-box.is-hosp { fill: var(--d-cloud); stroke: var(--d-electric); }
.nm-box.is-corp { fill: var(--d-cloud); stroke: var(--d-success); }
.nm-box.is-join { fill: var(--d-ink); stroke: var(--d-ink); }

.nm-t { font-family: var(--font-display); font-size: 13px; fill: var(--ink); }
.nm-s { font-size: 11px; fill: var(--ink-3); }
.nm-t.on-dark, .nm-s.on-dark { fill: #fff; }
.nm-s.on-dark { fill: var(--d-line); }

.nm-lead { font-family: var(--font-display); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.nm-lead.is-hosp { fill: var(--d-electric); }
.nm-lead.is-corp { fill: var(--d-success); }

.nm-link { fill: none; stroke: var(--d-line); stroke-width: 1.5; }
.nm-link.is-hosp { stroke: var(--d-electric); }
.nm-link.is-corp { stroke: var(--d-success); }

/* ── HEADING OUTLINE REPAIR (v139) ──────────────────────────────────────────
   22 pages skipped a heading level (h1→h3, h2→h4), which breaks the outline
   a screen reader navigates by. The tags were promoted to close the gap; the
   styling that lived on the old level is mirrored here so nothing moves
   visually. Same declarations as .card h3 and .f-col h4 in drapto.system.css. */
.card h2 {
  font-family: var(--font-display);
  font-size: 18.5px;
  letter-spacing: -.01em;
  margin-bottom: 8px;
}
.f-col h3 { color: var(--ink); }
/* .dvs-col h3 needs no rule — h4 there was unstyled, so h3 inherits the same
   heading defaults it already had. */

/* ── MODULE MAP ─────────────────────────────────────────────────────────── */
.modmap { margin: var(--s-6) 0 0; }
.modmap svg { display: block; width: 100%; height: auto; min-width: 720px; }
.modmap-cap { font-size: 13px; color: var(--ink-3); margin-top: var(--s-3); }

.mm-colbg { fill: var(--d-cloud); stroke: none; }
.mm-h { font-family: var(--font-display); font-size: 14px; fill: var(--ink); letter-spacing: -.01em; }
.mm-n { font-family: var(--font-mono, var(--font-body)); font-size: 12px; fill: var(--ink-3); }
.mm-rule { stroke: var(--d-line); stroke-width: 1.5; }

/* One chip per shipped module. Fill marks which arm of the network it serves,
   matching the network diagram above it so the two read as one system. */
.mm-chip rect { fill: #fff; stroke: var(--d-line); stroke-width: 1.25; }
.mm-arm-h rect { stroke: var(--d-electric); }
.mm-arm-c rect { stroke: var(--d-success); }
.mm-arm-hc rect { stroke: var(--d-ink); }

.mm-m { font-family: var(--font-display); font-size: 12.5px; fill: var(--ink); }
.mm-s { font-size: 10.5px; fill: var(--ink-3); }
.mm-key { font-size: 11px; fill: var(--ink-3); }

/* ── DOMAIN PILLARS ─────────────────────────────────────────────────────── */
.pil-g { display: grid; gap: var(--s-4); grid-template-columns: minmax(0,1fr); margin: var(--s-6) 0 0; }
@media (min-width: 881px) { .pil-g { grid-template-columns: repeat(2, minmax(0,1fr)); } }

.pil { border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s-5); background: #fff; min-width: 0; }
.pil-h { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s-3); }
.pil-h b { font-family: var(--font-display); font-size: 19px; color: var(--ink); letter-spacing: -.02em; }
.pil-h span { font-size: 12px; color: var(--ink-3); white-space: nowrap; }
.pil-lead { font-size: 14.5px; color: var(--d-electric); font-weight: 600; margin-top: var(--s-2); }
.pil-blurb { font-size: 14px; color: var(--ink-3); margin-top: var(--s-2); }

.pil-list { list-style: none; margin: var(--s-4) 0 0; padding: 0; display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
.pil-list li { background: #fff; padding: var(--s-3) var(--s-4); display: flex; align-items: baseline; gap: var(--s-3); min-width: 0; border-left: 3px solid var(--d-line); }
.pil-list li.pil-arm-h { border-left-color: var(--d-electric); }
.pil-list li.pil-arm-c { border-left-color: var(--d-success); }
.pil-list li.pil-arm-hc { border-left-color: var(--d-ink); }
.pil-list b { font-size: 13.5px; color: var(--ink); white-space: nowrap; }
.pil-list span { font-size: 12.5px; color: var(--ink-3); min-width: 0; }

/* ── MONEY FLOW (company/how-we-make-money) ─────────────────────────────── */
.moneyflow { margin: var(--s-6) 0 0; }
.moneyflow svg { display: block; width: 100%; height: auto; min-width: 680px; }
.moneyflow-cap { font-size: 13px; color: var(--ink-3); margin-top: var(--s-3); }

.mf-lane { font-family: var(--font-display); font-size: 12px; fill: var(--ink-3);
           letter-spacing: .06em; text-transform: uppercase; }
.mf-box { fill: #fff; stroke: var(--d-line); stroke-width: 1.5; }
.mf-box.is-free  { stroke: var(--d-success); }
.mf-box.is-fee   { stroke: var(--d-electric); }
.mf-box.is-sub   { stroke: var(--d-ink); }
.mf-box.is-never { fill: var(--d-cloud); stroke: var(--d-line); stroke-dasharray: 4 3; }

.mf-w  { font-family: var(--font-display); font-size: 13px; fill: var(--ink); }
.mf-s  { font-size: 11.5px; fill: var(--ink-3); }
.mf-s2 { font-size: 11.5px; fill: var(--ink-2); }

.mf-flow { fill: none; stroke: var(--d-line); stroke-width: 1.5; }
.mf-flow.is-free { stroke: var(--d-success); }
.mf-flow.is-fee  { stroke: var(--d-electric); }
.mf-flow.is-sub  { stroke: var(--d-ink); }

.mf-tag { font-size: 11px; }
.mf-tag.is-free { fill: var(--d-success); }
.mf-tag.is-sub  { fill: var(--ink-3); }

/* The only place a percentage is taken, so it is the only filled block. */
.mf-cut  { fill: var(--d-electric); }
.mf-cutt { font-size: 11.5px; font-weight: 600; fill: #fff; }

.mf-div { stroke: var(--d-line); stroke-width: 1; }

/* ── FREE / PAID BOUNDARY (pricing/doctors) ─────────────────────────────── */
.freeline { margin: var(--s-6) 0 0; }
.freeline svg { display: block; width: 100%; height: auto; min-width: 700px; }
.freeline-cap { font-size: 13px; color: var(--ink-3); margin-top: var(--s-3); }

.fl-lane { font-family: var(--font-display); font-size: 12px; fill: var(--ink-3);
           letter-spacing: .06em; text-transform: uppercase; }
.fl-box { fill: #fff; stroke-width: 1.5; stroke: var(--d-line); }
.fl-box.is-free  { stroke: var(--d-success); }
.fl-box.is-paid  { stroke: var(--d-electric); }
/* Dashed, because these are refusals — not a tier anyone can reach. */
.fl-box.is-never { fill: var(--d-cloud); stroke-dasharray: 4 3; }

.fl-price { font-family: var(--font-display); font-size: 19px; letter-spacing: -.02em; }
.fl-price.is-free  { fill: var(--d-success); }
.fl-price.is-paid  { fill: var(--d-electric); }
.fl-price.is-never { fill: var(--ink-3); font-size: 14px; }
.fl-i { font-size: 12px; fill: var(--ink-2); }

/* ── PAYER TIMING FIGURES (blog) ────────────────────────────────────────── */
.blfig { margin: var(--s-5) 0; }
.blfig svg { display: block; width: 100%; height: auto; min-width: 680px; }
.blfig-cap { font-size: 12.5px; color: var(--ink-3); margin-top: var(--s-2); }

.nc-lane { font-family: var(--font-display); font-size: 12px; fill: var(--ink-3);
           letter-spacing: .06em; text-transform: uppercase; }
.nc-track { fill: var(--d-cloud); stroke: var(--d-line); stroke-width: 1; }
/* The hours nobody is watching, which is where the window is actually lost. */
.nc-dead { fill: var(--line); opacity: .55; }
.nc-good { fill: var(--d-success); opacity: .16; }
.nc-tick { stroke: var(--ink-3); stroke-width: 1.5; }
.nc-tick.is-good { stroke: var(--d-success); stroke-width: 2; }
.nc-tick.is-late { stroke: var(--ink-3); stroke-dasharray: 3 2; }
.nc-tick.is-end  { stroke: var(--d-electric); stroke-width: 2; }
.nc-m { font-size: 11.5px; fill: var(--ink-3); }
.nc-m.is-late { fill: var(--ink-3); }
.nc-m.is-end  { fill: var(--d-electric); font-weight: 600; }
.nc-in { font-size: 11.5px; fill: var(--ink-2); }
.nc-in.is-good { fill: var(--d-success); font-weight: 600; }
.nc-div { stroke: var(--d-line); stroke-width: 1; }
.nc-out { fill: #fff; stroke: var(--d-electric); stroke-width: 1.5; stroke-dasharray: 4 3; }
.nc-o1 { font-family: var(--font-display); font-size: 12.5px; fill: var(--ink); }
.nc-o2 { font-size: 11.5px; fill: var(--d-electric); }
.nc-note { font-size: 11.5px; fill: var(--ink-3); }

.eh-safe { fill: var(--d-success); opacity: .14; }
.eh-warn { fill: var(--d-success); opacity: .34; }
.eh-over { fill: var(--d-electric); }
.eh-p { font-family: var(--font-display); font-size: 14px; }
.eh-p.is-good { fill: var(--d-success); }
.eh-p.is-end  { fill: var(--d-electric); }
.eh-lab { font-size: 11.5px; }
.eh-lab.is-good { fill: var(--d-success); }
.eh-lab.is-end  { fill: var(--d-electric); }

/* ── SHORTFALL TRIAGE (blog/reading-settlement-advice) ──────────────────── */
.sh-src { fill: var(--d-cloud); stroke: var(--d-line); stroke-width: 1.5; }
.sh-srct { font-family: var(--font-display); font-size: 13px; fill: var(--ink); }
.sh-srcs { font-size: 11.5px; fill: var(--ink-3); }
.sh-writeoff { font-size: 11.5px; fill: var(--ink-3); }
.sh-writeoff2 { font-size: 11.5px; fill: var(--ink-3); font-style: italic; }
.sh-flow { fill: none; stroke: var(--d-line); stroke-width: 1.5; }

.sh-b, .sh-act { fill: #fff; stroke-width: 1.5; stroke: var(--d-line); }
.sh-b.is-known, .sh-act.is-known { stroke: var(--d-line); }
.sh-b.is-copay, .sh-act.is-copay { stroke: var(--d-success); }
.sh-b.is-open { stroke: var(--d-electric); }
/* The only bucket worth acting on is the only filled one. */
.sh-act.is-open { fill: var(--d-electric); stroke: var(--d-electric); }

.sh-n { font-family: var(--font-display); font-size: 13px; fill: var(--ink); }
.sh-a { font-family: var(--font-display); font-size: 13px; fill: var(--ink); }
.sh-s { font-size: 11.5px; fill: var(--ink-3); }
.sh-a.on-fill { fill: #fff; }
.sh-s.on-fill { fill: var(--d-line); }
.sh-note { font-size: 11.5px; fill: var(--ink-3); }

/* ── OPD LEAKS (blog/clinic-revenue-leaks-india) ────────────────────────── */
.lk-hd { font-family: var(--font-display); font-size: 11.5px; fill: var(--ink-3);
         letter-spacing: .06em; text-transform: uppercase; }
.lk-rule { stroke: var(--d-line); stroke-width: 1; }
.lk-row { fill: #fff; stroke: var(--d-line); stroke-width: 1.25; }
.lk-row.is-worst { fill: var(--d-cloud); stroke: var(--d-electric); }
.lk-n { font-family: var(--font-display); font-size: 13px; fill: var(--ink); }
.lk-s { font-size: 11.5px; fill: var(--ink-3); }
.lk-m { font-size: 12px; fill: var(--ink-2); }
.lk-vis.is-part { fill: none; stroke: var(--ink-3); stroke-width: 1.25; stroke-dasharray: 3 2; }
.lk-vis.is-none { fill: var(--d-electric); stroke: none; }
.lk-vt { font-size: 11px; fill: var(--ink-3); }
.lk-vt.on-fill { fill: #fff; font-weight: 600; }
.lk-note { font-size: 11.5px; fill: var(--ink-3); }
