/* Info / trust pages: /pricing/, /terms/, /privacy/, /refund/ (layouts/info-page.njk).
   Builds on article.css + blog-components.css; only adds what those lack. */

.info-page__lede {
  max-width: 760px;
  margin-top: 18px;
  font-size: 18px;
  line-height: 1.6;
  color: var(--text-secondary);
}

.info-page__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.info-page h2,
.info-page h3 {
  scroll-margin-top: 100px;
}

/* Tables scroll inside their wrapper on small screens instead of widening the page.
   blog-components.css gives .comparison-table a min-width and its own border/margin. */
.info-page .comparison-table-wrapper {
  margin: 20px 0 28px;
}
.info-page .comparison-table-wrapper .comparison-table {
  /* undo the block/max-content rule blog-components.css applies to every article table;
     the wrapper does the scrolling here */
  display: table;
  width: 100%;
  max-width: none;
  overflow: visible;
  margin: 0;
  border: 0;
  border-radius: 0;
  min-width: 0;
}
/* Tables with 5+ columns keep a floor and scroll inside the wrapper on phones. */
.info-page .comparison-table-wrapper .comparison-table.is-wide {
  min-width: 560px;
}
.info-page .comparison-table td.num,
.info-page .comparison-table th.num {
  text-align: right;
  white-space: nowrap;
}

.info-page__toc {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0 8px;
  padding: 0;
  list-style: none;
}
.info-page .info-page__toc li {
  margin: 0;
  padding: 0;
}
.info-page .info-page__toc li::before {
  content: none;
}
.info-page__toc a {
  display: inline-block;
  padding: 6px 12px;
  font-size: 14px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text-secondary);
  text-decoration: none;
}
.info-page__toc a:hover {
  color: var(--text-primary);
  border-color: var(--accent);
}

.info-page__links {
  font-size: 15px;
  color: var(--text-secondary);
}

.info-page__muted {
  font-size: 14px;
  color: var(--text-muted);
}

@media (max-width: 480px) {
  .info-page__lede { font-size: 16px; }
  /* Let 3-4 column price tables fit a phone without sideways scrolling. */
  .info-page .comparison-table thead th,
  .info-page .comparison-table tbody td { padding: 10px; }
  .info-page .comparison-table tbody td:first-child,
  .info-page .comparison-table thead th:first-child { min-width: 0; }
}
