/* Approval prototype only. Loaded by the journal index and B01, not other articles.
   Reference: Balance classic_3 grid and verified single_style_style-3. */
.journal-balance {
  --journal-paper:#f7f6f2;
  --journal-grey:#e5e6e3;
  --journal-ink:#202625;
  background:var(--journal-paper);
  color:var(--journal-ink);
}
.journal-balance .bj-shell { width:calc(100% - 2 * var(--gutter)); max-width:1290px; margin-inline:auto; }
.journal-balance h1,.journal-balance h2 { font-family:var(--display); font-weight:500; letter-spacing:-.025em; text-wrap:balance; }
.journal-balance h1::before,.journal-balance h1::after,.journal-balance h2::before,.journal-balance h2::after { content:none; }
.bj-index-opening { padding:76px 0 40px; text-align:center; }
.bj-index-opening .eyebrow { color:var(--petrol-text); margin:0 0 14px; }
.bj-index-opening h1 { max-width:none; font-size:72px; line-height:1.05; }
.bj-index-opening .bj-intro { max-width:740px; margin:24px auto 0; font:400 20px/1.65 var(--body); }
/* Approved overview subtitle: same body type scale as the other page introductions. */
.journal-balance .bj-index-opening .bj-intro--overview { font-size:clamp(20px,1.6vw,22px); line-height:1.7; text-wrap:balance; }
/* A distinct editorial closing, not another post or a second contact CTA. */
.bj-about {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  align-items:center;
  gap:clamp(32px,5vw,72px);
  margin:clamp(56px,6vw,88px) 0;
  padding:clamp(32px,4.5vw,64px);
  background:var(--journal-grey);
  font:400 20px/1.7 var(--body);
}
.bj-about > * { min-width:0; }
.bj-about .eyebrow { color:var(--petrol-text); margin:0 0 14px; }
.bj-about h2 { font-size:clamp(36px,3.6vw,52px); line-height:1.08; margin:0; }
.bj-about > p { max-width:46ch; margin:0; }
.bj-draft-note { margin:22px auto 0; font:400 18px/1.55 var(--body); }
.bj-controls { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:40px; }
.bj-filter { display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; min-width:0; }
.bj-filter label { font:500 18px/1.5 var(--body); }
.bj-filter select { max-width:100%; width:390px; min-height:48px; border:1px solid #909a97; border-radius:0; padding:10px 36px 10px 14px; background:transparent; color:inherit; font:400 18px/1.5 var(--body); }
.bj-status { margin:0; font:400 18px/1.5 var(--body); white-space:nowrap; }
.bj-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:54px 30px; align-items:start; }
.bj-card { min-width:0; border:0; box-shadow:none; border-radius:0; background:none; }
.bj-card figure { margin:0 0 22px; aspect-ratio:4/3; overflow:hidden; background:var(--journal-grey); }
.bj-card img { width:100%; height:100%; object-fit:cover; object-position:50% 0%; }
.bj-card .bj-card-category { color:var(--petrol-text); font:500 18px/1.45 var(--body); margin:0 0 10px; }
.bj-card h2 { font-size:34px; line-height:1.13; margin:0; }
.bj-card a { display:block; }
.bj-card a:hover h2 { color:var(--petrol-text); }
.bj-card .bj-image-open { padding:24px; display:grid; place-items:center; }
.bj-image-open figcaption { width:100%; max-width:30ch; text-align:center; font:400 18px/1.5 var(--body); color:#45504d; }
.bj-image-open figcaption span { display:block; }
.bj-image-open figcaption span:first-child { font-weight:600; margin-bottom:12px; }
.bj-pagination { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin:56px 0 0; }
.bj-pagination a { display:flex; min-width:48px; min-height:48px; padding:9px 14px; align-items:center; justify-content:center; font:500 18px/1.5 var(--body); }
.bj-pagination a[aria-current=page] { background:var(--journal-ink); color:var(--journal-paper); }
.bj-pagination a:hover { background:var(--journal-grey); color:var(--journal-ink); }
.bj-fallback { margin-block:48px 80px; }
.bj-fallback h2 { font-size:36px; margin-bottom:24px; }
.bj-fallback ul { columns:2; column-gap:48px; }
.bj-fallback li { break-inside:avoid; margin:0 0 16px; }
.bj-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* The wide image and overlapping title belong together; no text crosses a face. */
.bj-article-hero { height:612px; margin:0; background:#191d1e; }
.bj-article-hero img { width:100%; max-width:1280px; height:100%; margin:auto; object-fit:cover; object-position:50% 0%; }
.bj-title-panel { position:relative; max-width:1060px; width:calc(100% - 60px); margin:-100px auto 0; padding:48px 55px; text-align:center; background:var(--journal-paper); }
.bj-title-panel .bj-card-category { margin:0 0 20px; font:500 18px/1.5 var(--body); color:var(--petrol-text); }
.bj-title-panel h1 { font-size:66px; line-height:1.04; max-width:900px; margin-inline:auto; }
.bj-title-panel .bj-draft-note { margin-top:24px; }
.bj-article-body { width:calc(100% - 2 * var(--gutter)); max-width:1290px; margin:0 auto; padding:42px 0 76px; font:400 20px/1.75 var(--body); }
.bj-article-body > p,.bj-article-body > h2,.bj-article-body > section { max-width:720px; margin-inline:auto; }
.bj-article-body p { margin:0 0 28px; }
.bj-article-body > p { margin-inline:auto; }
.bj-article-body .journal-intro { font-size:22px; line-height:1.65; margin:0 0 42px; }
.bj-article-body > .journal-intro { margin-inline:auto; }
.bj-article-body h2 { font-size:40px; line-height:1.12; margin:50px 0 24px; }
.bj-article-body > h2 { margin-inline:auto; }
.bj-article-body a { color:var(--petrol-text); font-weight:600; text-decoration:none; }
.bj-article-body a:hover { color:var(--journal-ink); }
.bj-article-body .journal-related { margin-top:60px; padding:0; }
.bj-article-body .journal-related h2 { margin-top:0; }
.bj-article-body .journal-related ul { list-style:none; padding:0; margin:0; display:grid; gap:20px; }
.bj-article-body .journal-related li { padding:0; margin:0; }
.bj-article-body .journal-related a { display:inline-block; padding-block:4px; }
.bj-article-back { margin:40px auto 0; max-width:720px; display:flex; align-items:center; min-height:48px; font-size:18px; }
.bj-article-spread { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; margin:48px 0; }
.bj-article-spread figure { margin:0; aspect-ratio:3/2; padding:30px; background:var(--journal-grey); display:grid; place-items:center; }
.bj-article-spread figcaption { max-width:36ch; }

@media(max-width:1120px) {
  .bj-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bj-title-panel { padding:38px; }
  .bj-title-panel h1 { font-size:56px; }
  .bj-article-hero { height:520px; }
  .bj-controls { align-items:end; }
}
@media(max-width:700px) {
  .bj-index-opening { padding:64px 0 30px; }
  .bj-index-opening h1 { font-size:56px; }
  .bj-index-opening .eyebrow { font-size:18px; }
  .bj-index-opening .bj-intro { font-size:18px; line-height:1.65; margin-top:20px; }
  .bj-draft-note { font-size:18px; line-height:1.5; }
  .bj-controls { display:block; margin-bottom:32px; }
  .bj-filter { display:block; }
  .bj-filter label { display:block; margin-bottom:8px; }
  .bj-filter select { width:100%; }
  .bj-status { margin-top:18px; }
  .bj-grid { grid-template-columns:1fr; gap:40px; }
  .bj-card h2 { font-size:32px; }
  .bj-card figure { margin-bottom:20px; }
  .bj-card .bj-image-open { padding:20px; }
  .bj-image-open figcaption { font-size:18px; line-height:1.4; }
  .bj-pagination { gap:5px; margin:40px 0 0; }
  .bj-about { grid-template-columns:1fr; gap:24px; padding:32px 24px; font-size:18px; }
  .bj-fallback ul { columns:1; }
  .bj-article-hero { height:340px; }
  .bj-title-panel { width:calc(100% - 32px); padding:28px 20px 22px; margin-top:-56px; }
  .bj-title-panel h1 { font-size:36px; line-height:1.1; }
  .bj-title-panel .bj-card-category { margin-bottom:14px; }
  .bj-title-panel .bj-draft-note { margin-top:20px; }
  .bj-article-body { font-size:18px; line-height:1.75; padding:30px 0 60px; }
  .bj-article-body .journal-intro { font-size:20px; line-height:1.65; margin-bottom:32px; }
  .bj-article-body h2 { font-size:34px; margin:40px 0 22px; }
  .bj-article-spread { grid-template-columns:1fr; gap:20px; margin:36px 0; }
  .bj-article-spread figure { padding:20px; }
}
@media(prefers-reduced-motion:reduce) { .journal-balance { scroll-behavior:auto; } }
