.kit.comparison-table {
  color: rgba(var(--color-text));
}

.kit .comparison-table__heading {
  font-family: var(--kit-font-display);
  font-weight: 700;
  font-size: clamp(28px, 3.2vw, 40px);
  letter-spacing: -0.02em;
  text-align: center;
  margin: 0 0 40px;
}

.comparison-table__scroll {
  overflow-x: auto;
  border: 1px solid rgba(var(--color-entry-line), 0.1);
  border-radius: var(--kit-radius);
  background: rgba(var(--color-card-background));
}

/* Cells keep the user-agent padding and header weights except where the design sets them. */
.comparison-table__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  min-width: 640px;
}

.comparison-table__head {
  background: rgba(var(--color-background));
  color: rgba(var(--color-text));
}

.comparison-table__head th {
  padding: 18px 14px;
  font-weight: 600;
}

.comparison-table__head .comparison-table__corner {
  text-align: left;
  padding: 18px 20px;
}

.comparison-table__head .comparison-table__own-head {
  font-family: var(--kit-font-display);
  font-weight: 700;
  font-size: 15px;
}

.kit .comparison-table__logo {
  height: 19px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
}

.comparison-table__row {
  border-top: 1px solid rgba(var(--color-entry-line), 0.1);
}

.comparison-table__row:nth-child(even) {
  background: rgba(var(--color-text), 0.02);
}

.comparison-table__label {
  padding: 16px 20px;
  font-weight: 600;
}

.comparison-table__cell {
  text-align: center;
  color: rgba(var(--color-light-text));
}

.comparison-table__cell.is-yes {
  color: rgba(var(--color-highlight));
}

.comparison-table__cell.is-no {
  opacity: 0.5;
}

.comparison-table__cell--own {
  color: rgba(var(--color-highlight));
  font-weight: 700;
}
