/* Reuse the existing Ruah campaign colours, type and card treatments. */
.offer-caveat {
  margin-top: 22px;
  font-size: 14px;
  line-height: 1.8;
  color: #b9b5aa;
}
.offer-caveat strong { color: #e7d9b6; font-weight: 600; }
.monitoring-card {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}
.monitoring-card > div { min-width: 0; }
.monitoring-card .eyebrow { margin-bottom: 12px; }
.monitoring-card .offer-intro { max-width: 570px; }
.monitoring-card .button { flex-shrink: 0; }
.scope-note { max-width: 940px; white-space: normal; font-size: 13px; }
.audit-comparison { max-width: 940px; margin: 54px auto 0; }
.comparison-heading .eyebrow { margin-bottom: 12px; }
.comparison-heading > p:last-child { margin-top: 12px; font-size: 18px; }
.comparison-scroll {
  margin-top: 25px;
  overflow-x: auto;
  border: 1px solid #32322c;
  border-radius: 9px;
  background: #151514;
}
.comparison-scroll:focus-visible { outline: 2px solid var(--gold); outline-offset: 6px; }
.comparison-table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 760px; }
.comparison-table th, .comparison-table td {
  text-align: left;
  vertical-align: top;
  padding: 19px 18px;
  font-size: 14px;
  line-height: 1.8;
  border-bottom: 1px solid #32322c;
  overflow-wrap: anywhere;
}
.comparison-table th { font-weight: 600; color: #e7d9b6; }
.comparison-table thead th { color: var(--gold); background: #1d1b16; }
.comparison-table th:first-child { width: 18%; }
.comparison-table td { color: #b9b5aa; }
.comparison-table tbody tr:last-child > * { border-bottom: 0; }
.comparison-table a { color: #f1d18a; text-decoration: underline; text-underline-offset: 4px; }
.comparison-table a:hover { color: #fff0bf; }
.comparison-scroll-hint { display: none; }
.comparison-note { margin-top: 18px; font-size: 13px; line-height: 1.8; }
@media (min-width: 768px) {
  .offers-grid > .offer-card:not(.monitoring-card) .offer-intro { min-height: 90px; }
}
@media (max-width: 899px) {
  .monitoring-card { display: block; }
  .monitoring-card .button { margin-top: 22px; }
}
@media (max-width: 767px) {
  .monitoring-card .button { width: 100%; white-space: normal; }
  .offer-caveat, .scope-note, .comparison-note { font-size: 13px; }
  .comparison-heading > p:last-child { font-size: 16px; line-height: 1.8; }
  .comparison-scroll-hint { display: block; margin-top: 16px; font-size: 12px; color: #b9b5aa; }
  .comparison-scroll { margin-top: 12px; }
  .comparison-table th, .comparison-table td { padding: 16px; }
}