/* Editorial pages: policies, guides, contact, 404, search. */

.bjc-prose { max-width: var(--bjc-measure); }
/* Section headings on content pages carry the same signature as the product
   page: the short teal rule above a display heading, a teal-edged H3. */
.bjc-prose h2 { position: relative; margin-top: var(--bjc-7); padding-top: var(--bjc-4); font-size: var(--bjc-display-3); }
.bjc-prose h2::before { content: ""; position: absolute; top: 0; left: 0; width: 40px; height: 3px; background: var(--bjc-teal); border-radius: 2px; }
.bjc-prose h3 { margin-top: var(--bjc-5); padding-left: var(--bjc-3); border-left: 3px solid var(--bjc-teal); font-family: var(--bjc-font-display); font-variation-settings: "opsz" 24; }
.bjc-prose > h2:first-child { margin-top: 0; }
/* The delivery page: the scene and the five steps take the full container,
   everything written keeps the reading measure. */
.bjc-page--journey .bjc-prose { max-width: none; }
.bjc-page--journey .bjc-prose > :not(.bjc-delivery-hero):not(.bjc-djourney) { max-width: var(--bjc-measure); }
.bjc-page--journey .bjc-prose > h1 { max-width: 24ch; }
.bjc-page--journey .bjc-djourney { margin-bottom: var(--bjc-8); }
.bjc-prose .bjc-djourney__label, .bjc-prose .bjc-djourney__text { border-left: 0; padding-left: 0; margin-top: 0; max-width: none; }
.bjc-prose .bjc-djourney__text { margin-top: var(--bjc-1); }
.bjc-prose h3 { margin-top: var(--bjc-5); }
.bjc-prose ul, .bjc-prose ol { padding-left: var(--bjc-5); }
.bjc-prose li + li { margin-top: var(--bjc-1); }
.bjc-prose table { width: 100%; border-collapse: collapse; margin-block: var(--bjc-4); }
.bjc-prose th, .bjc-prose td { padding: var(--bjc-3); text-align: left; border-bottom: 1px solid var(--bjc-line); vertical-align: top; }
.bjc-prose blockquote {
  margin: var(--bjc-5) 0; padding-left: var(--bjc-4);
  border-left: 3px solid var(--bjc-teal); color: var(--bjc-ink-muted);
}

/* ---- rendered content-pack blocks -------------------------------------- */

/* A long reference page needs a way in. Sixteen articles of terms without one
   is a wall. */
.bjc-toc {
  margin-block: var(--bjc-5);
  padding: var(--bjc-4) var(--bjc-5);
  background: var(--bjc-neutral);
  border-radius: var(--bjc-radius);
}
.bjc-toc__title { margin: 0 0 var(--bjc-2); font-size: var(--bjc-text-base); }
.bjc-toc ol { margin: 0; padding-left: var(--bjc-5); }
.bjc-toc li + li { margin-top: var(--bjc-1); }

.bjc-content__actions {
  display: flex; flex-wrap: wrap; gap: var(--bjc-3);
  margin-block: var(--bjc-4);
}
.bjc-content__field { margin-block: var(--bjc-2); }
.bjc-content__hint,
.bjc-content__version {
  color: var(--bjc-ink-muted);
  font-size: var(--bjc-text-sm);
}

.bjc-category-copy { margin-top: var(--bjc-4); }
.bjc-category-copy h2 { font-size: var(--bjc-text-xl); }

.bjc-quote-selection {
  margin-block: var(--bjc-4);
  padding: var(--bjc-4);
  border: 1px solid var(--bjc-line);
  border-radius: var(--bjc-radius);
  background: var(--bjc-neutral);
}
.bjc-quote-selection__card { margin: 0 0 var(--bjc-2); font-weight: var(--bjc-weight-medium); }

/* ---- comparison -------------------------------------------------------- */

/* The table scrolls sideways rather than shrinking its columns to unreadable
   widths; the row headings stay put so a value is never orphaned. */
.bjc-compare { max-width: none; }
.bjc-compare__table { min-width: 44rem; }
.bjc-compare { overflow-x: auto; }
.bjc-compare__table th[scope="row"] {
  position: sticky; left: 0;
  background: var(--bjc-white);
  font-weight: var(--bjc-weight-medium);
}
.bjc-compare__table thead th { vertical-align: bottom; }
.bjc-compare__remove { display: block; margin-top: var(--bjc-2); font-weight: var(--bjc-weight-normal); }
.bjc-compare__unknown { color: var(--bjc-ink-muted); font-style: italic; }
.bjc-compare__note { color: var(--bjc-ink-muted); font-size: var(--bjc-text-sm); }

/* ---- trader identity on the contact page (D30) ------------------------- */
.bjc-trader-identity { margin: 0 0 var(--bjc-6); padding: var(--bjc-4) var(--bjc-5); border: 1px solid var(--bjc-line); border-radius: var(--bjc-radius-lg); background: var(--bjc-neutral); }
.bjc-trader-identity h2 { margin: 0 0 var(--bjc-3); font-size: var(--bjc-text-lg); }
.bjc-trader-identity__list { display: grid; gap: var(--bjc-2); margin: 0; }
.bjc-trader-identity__list div { display: grid; grid-template-columns: minmax(0, 14rem) minmax(0, 1fr); gap: var(--bjc-3); font-size: var(--bjc-text-sm); }
.bjc-trader-identity__list dt { color: var(--bjc-ink-muted); }
.bjc-trader-identity__list dd { margin: 0; font-family: var(--bjc-font-mono); }
@media (max-width: 560px) { .bjc-trader-identity__list div { grid-template-columns: minmax(0, 1fr); gap: 0; } }
