/* The functions page: what every account brings (base) and what paveit advanced adds. */
.plan-table {
  width:100%;
  margin-top:clamp(36px,6dvh,56px);
  border-collapse:collapse;
  color:var(--ink);
  font-size:16px;
  line-height:1.5;
}

.plan-table thead th {
  padding:0 12px 12px;
  border-bottom:1px solid var(--line);
  color:var(--dim);
  font-size:14px;
  font-weight:600;
  text-align:center;
}

.plan-table thead th:first-child {
  padding-left:0;
  text-align:left;
}

/* Group headings, one per step of the lab workflow. */
.plan-table__group th {
  padding:clamp(28px,4dvh,40px) 0 10px;
  border-bottom:1px solid var(--line);
  color:var(--primary);
  font-size:clamp(20px,2.4vw,26px);
  font-weight:700;
  letter-spacing:-.02em;
  text-align:left;
}

.plan-table tbody th[scope="row"] {
  padding:12px 12px 12px 0;
  font-weight:500;
  text-align:left;
}

.plan-table td {
  width:clamp(64px,12vw,120px);
  padding:12px;
  color:var(--primary);
  font-size:18px;
  text-align:center;
  vertical-align:top;
}

.plan-table tbody tr:not(.plan-table__group) {
  border-bottom:1px solid var(--line);
}

/* The advanced column stands out a little. */
.plan-table td:last-child,
.plan-table thead th:last-child {
  background:color-mix(in srgb, var(--mark) 14%, transparent);
}

/* A row only paveit advanced brings: no colour of its own (the dash under base says it), just an
   accent on its left edge and a bolder name. */
.plan-table .plan-table__advanced th[scope="row"] {
  padding-left:14px;
  box-shadow:inset 3px 0 0 var(--mark);
  font-weight:600;
}

.plan-table__soon {
  display:inline-block;
  margin-left:6px;
  padding:0 7px;
  border:1px solid var(--primary);
  border-radius:999px;
  color:var(--primary);
  font-size:12px;
  font-weight:500;
  line-height:1.6;
  vertical-align:.12em;
  white-space:nowrap;
}


.plan-table__missing {
  color:var(--line);
}

.plan-table__detail {
  display:block;
  margin-top:2px;
  color:var(--dim);
  font-size:15px;
  font-weight:400;
}

/* The page ends like the Prüfablauf view (features.css): the footer carries on the wordmark's
   strip colour, without the line subpages otherwise draw above it. */
.feature-brand + .site-footer {
  border-top:0;
  background:var(--strip-bg);
}

@media (max-width:520px) {
  .plan-table { font-size:15px; }
  .plan-table__detail { font-size:14px; }
  .plan-table td { padding:12px 4px; }
  .plan-table .plan-table__advanced th[scope="row"] { padding-left:10px; }
}