/* Journal: the Postwerks article lane (content/articles/ -> /<slug>/, /journal/).
   Loaded only on pages that need it, and only emitted when an article exists, so a
   build with no articles is byte-identical to one without the lane. Every value is a
   site.css token: no new fonts, no new colours, and the accent stays off body copy. */

/* body_html is a sanitised subset (h2 h3 p ul ol li a strong em blockquote table).
   .prose already sets p, h2, ul, li and links; this fills in the rest. */
.prose--journal { overflow-wrap: break-word; }
.prose--journal h3 {
  font-family: var(--display);
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.2;
  letter-spacing: -.015em;
  margin: 2rem 0 .6rem;
}
.prose--journal h2 + h3 { margin-top: 1rem; }
.prose--journal ol { padding-left: 1.3rem; margin: 0 0 1.35em; }
.prose--journal strong { font-weight: 600; }
.prose--journal blockquote {
  margin: 1.8rem 0;
  padding: 0 0 0 1.1rem;
  border-left: 1px solid var(--ink);
  color: var(--ink-2);
}
.prose--journal blockquote p:last-child { margin-bottom: 0; }

/* Tables read like the spec table on an item page: ink rule on top, hairlines
   between rows, labels in the 11px tracked caps. */
.prose--journal table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid var(--ink);
  margin: 1.8rem 0 2.2rem;
  font-size: .9375rem;
  font-variant-numeric: tabular-nums;
}
.prose--journal th,
.prose--journal td {
  text-align: left;
  vertical-align: top;
  padding: .72rem 1rem .72rem 0;
  border-bottom: 1px solid var(--rule);
}
.prose--journal th {
  font-size: var(--label);
  font-weight: 600;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--ink-3);
}
/* On a phone a wide table scrolls inside its own box rather than widening the page. */
@media (max-width: 620px) {
  .prose--journal table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

.faq { max-width: var(--measure); }
.faq .section-head { margin-top: 3.6rem; }
.faq .prose h3:first-child { margin-top: 0; }

/* ---------- the list: /journal/, the home section and the article rail ---------- */

.jlist { list-style: none; margin: 0; padding: 0; max-width: 52rem; }
.jrow { border-bottom: 1px solid var(--rule); }
.jrow a { display: block; padding: 1.5rem 0 1.6rem; text-decoration: none; }
.jrow-title {
  font-family: var(--display);
  font-weight: 700;
  font-size: clamp(1.5rem, 3.4vw, 2.4rem);
  line-height: 1;
  letter-spacing: var(--track-tight);
  margin: .55rem 0 .6rem;
}
.jrow p { max-width: var(--measure); margin: 0; color: var(--ink-2); font-size: .9375rem; line-height: 1.55; }
.jrow a:hover .jrow-title { color: var(--accent); }
.jlist--home .jrow-title,
.rail .jrow-title { font-size: clamp(1.25rem, 2.4vw, 1.6rem); }