/* Plain content pages: page.php, index.php, 404.php.
 *
 * These three have no counterpart in the Next.js build - an unmatched route
 * there was a framework 404, and there was no generic page template because
 * every route was hand-built. So there is nothing to port, and nothing here is
 * copied from a CSS Module.
 *
 * It is deliberately minimal: enough to make an editor-created page or a 404
 * readable and on-brand, and no more. The legal pages now have their own layout
 * in legal.css; these table and code rules remain useful fallback formatting
 * for other editor-created pages.
 */

.basic-page {
  background: var(--paper);
  margin: 0 auto;
  max-width: 780px;
  padding: clamp(3rem, 6vw, 6rem) 4.5vw clamp(4rem, 7vw, 7rem);
}

.basic-page .kicker {
  color: var(--green-deep);
  font-size: .76rem;
  font-weight: 760;
  letter-spacing: .12em;
  margin: 0 0 .8rem;
  text-transform: uppercase;
}

.basic-page h1 {
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  font-weight: 550;
  letter-spacing: -.05em;
  line-height: 1.04;
  margin: 0 0 1.5rem;
}

.basic-page h2 {
  font-size: clamp(1.4rem, 2.6vw, 2rem);
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1.15;
  margin: 2.5rem 0 .9rem;
}

.basic-page h3 {
  font-size: 1.15rem;
  font-weight: 650;
  letter-spacing: -.02em;
  margin: 2rem 0 .6rem;
}

.basic-page p,
.basic-page li {
  color: var(--ink-muted);
  line-height: 1.65;
}

.basic-page p { margin: 0 0 1.1rem; }

.basic-page ul,
.basic-page ol { margin: 0 0 1.1rem; padding-left: 1.3rem; }

.basic-page li { margin-bottom: .45rem; }

.basic-page a {
  color: var(--green-deep);
  text-decoration: underline;
  text-underline-offset: .18em;
}

.basic-page a:hover { color: var(--forest); }

.basic-page img { border-radius: .8rem; height: auto; }

/* Tables in editor-created pages scroll inside their own box rather than
 * widening the document on narrow screens. */
.basic-page .table-scroll { overflow-x: auto; }

.basic-page table {
  border-collapse: collapse;
  font-size: .92rem;
  margin: 0 0 1.4rem;
  min-width: 30rem;
  width: 100%;
}

.basic-page th,
.basic-page td {
  border-bottom: 1px solid var(--line);
  color: var(--ink-muted);
  line-height: 1.55;
  padding: .6rem .8rem .6rem 0;
  text-align: left;
  vertical-align: top;
}

.basic-page th { color: var(--ink); font-weight: 650; }

.basic-page code {
  background: var(--green-soft);
  border-radius: .3rem;
  font-size: .9em;
  padding: .1rem .3rem;
}

.basic-page article + article {
  border-top: 1px solid var(--line);
  margin-top: 2rem;
  padding-top: 2rem;
}

@media (max-width: 760px) {
  .basic-page { padding-left: 1rem; padding-right: 1rem; }
}