/* Components introduced by the final product-argument refactor. */

.vch-audience-list {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  list-style: none;
  margin: 30px 0 0;
  padding: 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
}
.vch-audience-list li {
  min-width: 0;
  padding: 16px 12px;
  color: var(--ink);
  font-weight: 700;
  text-align: center;
}
.vch-audience-list li + li { border-left: 1px solid var(--line); }

.vch-early-schedule {
  list-style: none;
  display: grid;
  gap: 1px;
  margin: 32px 0 0;
  padding: 3px 0 0;
  border-top: 3px solid var(--schedule-accent);
  background: var(--line);
}
.vch-early-schedule li {
  display: grid;
  grid-template-columns: 145px minmax(0, 1fr) 36px minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  padding: 18px 20px;
  background: var(--bg);
}
.vch-cycle-label {
  color: var(--schedule-accent);
  font-family: var(--font-display);
  font-size: 11px;
}
.vch-early-schedule div { min-width: 0; }
.vch-early-schedule strong,
.vch-early-schedule small { display: block; }
.vch-early-schedule strong { color: var(--ink); font-size: 14px; }
.vch-early-schedule small { margin-top: 5px; color: var(--muted); font-size: 12px; }
.vch-early-schedule i { color: var(--schedule-accent); font-style: normal; text-align: center; }

.vch-how-facts {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 30px 0 0;
  padding: 0;
}
.vch-how-facts li {
  min-width: 0;
  padding-top: 16px;
  border-top: 1px solid var(--schedule-line-strong);
  color: var(--muted);
  font-size: 13px;
}
.vch-how-facts strong { color: var(--ink); }

.vch-leverage-note {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 28px;
  margin-bottom: 42px;
  padding: 18px 0 18px 24px;
  border-left: 3px solid var(--accent);
}
.vch-leverage-note strong { color: var(--accent-ink); font-family: var(--font-display); font-size: 14px; }
.vch-leverage-note p { max-width: 70ch; color: var(--muted); }

.vch-confidence-levels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin: 34px 0 38px;
}
.vch-confidence-levels article { min-width: 0; padding-top: 22px; border-top: 3px solid var(--schedule-accent); }
.vch-confidence-levels article + article { border-top-color: var(--accent-2); }
.vch-confidence-levels span { color: var(--muted); font-family: var(--font-display); font-size: 10px; text-transform: uppercase; }
.vch-confidence-levels h3 { margin: 14px 0 9px; font-size: 18px; }
.vch-confidence-levels p { max-width: 56ch; color: var(--muted); }

.vch-argument-section { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.vch-argument-intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr); gap: 48px; align-items: end; }
.vch-argument-intro h2 { max-width: 22ch; }
.vch-argument-intro > p { color: var(--muted); }
.vch-argument-result {
  max-width: 76ch;
  margin-top: 28px;
  padding: 18px 0;
  border-top: 1px solid var(--line-strong);
  border-bottom: 1px solid var(--line-strong);
  color: var(--ink);
  font-weight: 700;
}

.vch-matrix-wrap { margin-top: 36px; overflow-x: auto; border-top: 3px solid var(--accent-2); }
.vch-neutral-matrix { width: 100%; min-width: 840px; border-collapse: collapse; table-layout: fixed; }
.vch-neutral-matrix th,
.vch-neutral-matrix td { padding: 15px 14px; border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); text-align: left; vertical-align: top; }
.vch-neutral-matrix th:first-child,
.vch-neutral-matrix td:first-child { border-left: 0; }
.vch-neutral-matrix thead th { color: var(--ink); font-family: var(--font-display); font-size: 11px; }
.vch-neutral-matrix tbody th { width: 22%; color: var(--ink); font-size: 13px; }
.vch-neutral-matrix td { color: var(--muted); font-size: 12px; }
.vch-neutral-matrix .vch-matrix-us { background: var(--us-col-bg); color: var(--ink); }
.vch-matrix-note { margin-top: 16px; color: var(--muted); font-size: 12px; }

.vch-founder-intro { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr); gap: 48px; align-items: end; }
.vch-founder-intro h2 { max-width: 20ch; }
.vch-founder-intro p { color: var(--muted); }
.vch-founder-log { margin-top: 36px; border-top: 3px solid var(--accent); }
.vch-founder-log-name { padding: 13px 0; color: var(--accent-ink); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.vch-founder-log dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.vch-founder-log dl > div { min-width: 0; padding: 18px 18px 18px 0; border-top: 1px solid var(--line); }
.vch-founder-log dl > div + div { padding-left: 18px; border-left: 1px solid var(--line); }
.vch-founder-log dt { color: var(--ink); font-family: var(--font-display); font-size: 17px; }
.vch-founder-log dd { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.vch-stack-cost { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 28px; margin-top: 24px; padding: 20px 0; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
.vch-stack-cost strong { color: var(--schedule-accent); font-family: var(--font-display); font-size: 18px; }
.vch-stack-cost p { max-width: 70ch; color: var(--muted); }

@media (max-width: 960px) {
  .vch-audience-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .vch-audience-list li:nth-child(4) { border-left: 0; }
  .vch-audience-list li:nth-child(n + 4) { border-top: 1px solid var(--line); }
  .vch-founder-log dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vch-founder-log dl > div:nth-child(3) { padding-left: 0; border-left: 0; }
}

@media (max-width: 759px) {
  .vch-audience-list,
  .vch-how-facts,
  .vch-confidence-levels,
  .vch-argument-intro,
  .vch-founder-intro,
  .vch-founder-log dl,
  .vch-stack-cost { grid-template-columns: 1fr; }
  .vch-audience-list li,
  .vch-audience-list li + li { padding: 13px 0; border-left: 0; border-top: 1px solid var(--line); text-align: left; }
  .vch-audience-list li:first-child { border-top: 0; }
  .vch-early-schedule li { grid-template-columns: 1fr 26px 1fr; gap: 8px; padding: 16px 0; }
  .vch-cycle-label { grid-column: 1 / -1; }
  .vch-leverage-note { grid-template-columns: 1fr; gap: 10px; padding-left: 18px; }
  .vch-founder-log dl > div,
  .vch-founder-log dl > div + div { padding: 16px 0; border-left: 0; border-top: 1px solid var(--line); }
}
