/* ═══════════════════════════════════════════════════════════════
   JOURNAL.CSS — Insights (blog) archive and single article.
   Templates: blog/archive.php, blog/index.php · helpers: partials/journal.php
   Uses the chrome.css tokens: black, white, #F5E500 and their opacities.
═══════════════════════════════════════════════════════════════ */
.jr{ background:#fff; }

/* shared black hero texture */
.jr-hero, .jr-phero{ position:relative; overflow:hidden; background:#000; color:#fff; }
.jr-hero::before, .jr-phero::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(var(--w-04) 1px, transparent 1px), linear-gradient(90deg, var(--w-04) 1px, transparent 1px); background-size:64px 64px;
  -webkit-mask-image:linear-gradient(90deg, transparent 5%, #000 75%); mask-image:linear-gradient(90deg, transparent 5%, #000 75%); }
.jr-hero .wrap, .jr-phero .wrap{ position:relative; }
.jr-hero .eyebrow, .jr-phero .eyebrow{ color:var(--yellow); }

/* ─── ARCHIVE HERO ─────────────────────────────────────────── */
.jr-hero{ border-bottom:2px solid var(--yellow); padding:clamp(40px, 6vw, 96px) 0 clamp(44px, 5vw, 80px); }
.jr-hero-grid{ display:grid; grid-template-columns:minmax(0, 1.35fr) minmax(0, .85fr); gap:36px clamp(32px, 5vw, 80px); align-items:end; }
.jr-hero h1{ font-size:clamp(44px, 7.4vw, 108px); line-height:.92; letter-spacing:-.045em; text-transform:uppercase; margin:0 0 24px; color:#fff; overflow-wrap:anywhere; }
.jr-hero h1 em{ font-style:normal; color:var(--yellow); }
.jr-hero .bm-lede{ color:var(--w-80); max-width:52ch; margin:0; }
.jr-search{ position:relative; display:flex; border:1px solid var(--w-24); background:#000; transition:border-color var(--t); }
.jr-search:focus-within{ border-color:var(--yellow); }
.jr-search .bi{ position:absolute; left:16px; top:50%; transform:translateY(-50%); color:var(--w-66); }
.jr-search input{ flex:1; min-width:0; min-height:54px; padding:0 14px 0 44px; background:transparent !important; border:0 !important; color:#fff !important; font-size:16px; }
.jr-search input::placeholder{ color:var(--w-66); }
.jr-search button{ flex:none; padding:0 22px; background:var(--yellow); color:#000; border:0; font-weight:700; font-size:14.5px; cursor:pointer; }
.jr-search button:hover{ background:#fff; }
.jr-stats{ display:grid; grid-template-columns:1fr 1fr; margin:22px 0 0; border-top:1px solid var(--w-14); }
.jr-stats div{ padding:16px 0 0; }
.jr-stats div + div{ padding-left:20px; border-left:1px solid var(--w-14); }
.jr-stats dt{ font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--w-66); }
.jr-stats dd{ margin:6px 0 0; font-family:var(--font-heading); font-weight:700; font-size:clamp(34px, 3.4vw, 48px); line-height:1; letter-spacing:-.04em; color:#fff; }
@media (max-width:900px){ .jr-hero-grid{ grid-template-columns:1fr; } }

/* topic bar */
.jr-topics{ position:sticky; top:var(--hdr-h); z-index:30; background:#fff; border-bottom:1px solid var(--color-border); }
.jr-topics .wrap{ display:flex; gap:8px; align-items:center; overflow-x:auto; padding-top:14px; padding-bottom:14px; scrollbar-width:none; }
.jr-topics .wrap::-webkit-scrollbar{ display:none; }
.jr-topic{ flex:none; display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:0 15px; border:1.5px solid rgba(0,0,0,.2); color:#000; font-weight:600; font-size:14px; text-decoration:none; transition:border-color var(--t), background-color var(--t), color var(--t); }
.jr-topic small{ font-size:12px; color:var(--color-muted); font-weight:600; }
.jr-topic:hover{ border-color:#000; }
.jr-topic.is-on{ background:#000; color:#fff; border-color:#000; }
.jr-topic.is-on small{ color:var(--yellow); }
.jr-clear{ flex:none; margin-left:auto; font-size:14px; font-weight:700; color:#000; text-decoration:underline; text-decoration-color:var(--yellow); text-decoration-thickness:3px; text-underline-offset:4px; white-space:nowrap; }

/* ─── CARDS ────────────────────────────────────────────────── */
.jr .jr-list{ padding-top:clamp(32px, 4vw, 56px); }
.jr-cover:has(.jr-art--y) .jr-cat{ background:#000; color:var(--yellow); }
.jr-sub{ margin:0 0 22px; padding-top:20px; border-top:2px solid #000; }
.jr-sub .eyebrow{ margin:0; }
.jr-grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(36px, 4vw, 56px) clamp(18px, 2vw, 28px); }
@media (max-width:1000px){ .jr-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:620px){ .jr-grid{ grid-template-columns:1fr; } }
.jr-card{ position:relative; display:flex; flex-direction:column; min-width:0; }
.jr-cover{ position:relative; display:block; aspect-ratio:16/10; overflow:hidden; background:#000; border:1px solid #000; }
.jr-cover img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.jr-card:hover .jr-cover img{ transform:scale(1.04); }
.jr-cat{ position:absolute; left:12px; top:12px; z-index:2; padding:5px 8px; background:var(--yellow); color:#000; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.jr-flag{ position:absolute; right:12px; top:12px; z-index:2; padding:5px 8px; background:#000; color:var(--yellow); border:1px solid var(--yellow); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.jr-body{ display:flex; flex-direction:column; flex:1; padding-top:18px; }
.jr-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; margin:0 0 10px; font-size:13px; color:var(--color-muted); }
.jr-meta span{ display:inline-flex; align-items:center; gap:14px; }
.jr-meta span::before{ content:""; width:5px; height:5px; background:var(--yellow); outline:1px solid #000; }
.jr-title{ font-size:clamp(20px, 1.6vw, 23px); line-height:1.2; letter-spacing:-.02em; margin:0 0 10px; }
.jr-title a{ color:#000; text-decoration:none; background-image:linear-gradient(var(--yellow), var(--yellow)); background-repeat:no-repeat; background-size:0 38%; background-position:0 90%; transition:background-size .45s var(--ease); }
.jr-card:hover .jr-title a, .jr-title a:focus-visible{ background-size:100% 38%; }
.jr-title a::after{ content:""; position:absolute; inset:0; z-index:1; }
.jr-ex{ margin:0 0 18px; font-size:15px; line-height:1.55; color:var(--color-muted); }
.jr-more{ margin-top:auto; align-self:flex-start; }
.jr-card:hover .jr-more .bi{ transform:translateX(4px); }
.jr-more .bi{ transition:transform var(--t); }

/* lead story */
.jr-card--lead{ display:grid; grid-template-columns:minmax(0, 1.2fr) minmax(0, 1fr); background:#000; color:#fff; margin-bottom:clamp(48px, 6vw, 88px); }
.jr-card--lead .jr-cover{ aspect-ratio:auto; min-height:clamp(300px, 34vw, 480px); border:0; }
.jr-card--lead .jr-body{ justify-content:center; padding:clamp(28px, 4vw, 60px); }
.jr-card--lead .jr-meta{ color:var(--w-66); }
.jr-card--lead .jr-meta span::before{ outline:0; }
.jr-card--lead .jr-title{ font-size:clamp(28px, 3.2vw, 46px); line-height:1.04; letter-spacing:-.035em; margin-bottom:16px; }
.jr-card--lead .jr-title a{ color:#fff; background-image:linear-gradient(var(--yellow), var(--yellow)); background-size:0 4px; background-position:0 100%; }
.jr-card--lead:hover .jr-title a{ background-size:100% 4px; }
.jr-card--lead .jr-ex{ color:var(--w-80); font-size:17px; }
.jr-card--lead .jr-more{ color:#fff; }
.jr-card--feat::after{ content:"Featured"; position:absolute; right:0; top:0; z-index:2; padding:8px 12px; background:var(--yellow); color:#000; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
@media (max-width:860px){ .jr-card--lead{ grid-template-columns:1fr; } .jr-card--lead .jr-cover{ min-height:0; aspect-ratio:16/10; } }

/* generated cover art (posts without a featured image) */
.jr-art{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:#000; color:#fff; --card-bg:#000; overflow:hidden; }
.jr-art--y{ background:var(--yellow); color:#000; --card-bg:var(--yellow); }
.jr-art-grid{ position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px); background-size:28px 28px; }
.jr-art--y .jr-art-grid{ background-image:linear-gradient(rgba(0,0,0,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,.08) 1px, transparent 1px); }
.jr-art-draw{ position:relative; z-index:1; width:58%; max-width:340px; transition:transform .8s var(--ease); }
.jr-art-draw svg{ width:100%; height:auto; display:block; }
.jr-art .y{ fill:var(--yellow); }
.jr-art--y .y{ fill:#000; }
.jr-card:hover .jr-art-draw{ transform:translateX(8px) scale(1.03); }
.jr-art-word{ position:absolute; right:-.04em; bottom:-.16em; font-family:var(--font-heading); font-weight:700; font-size:clamp(44px, 7vw, 110px); line-height:1; letter-spacing:-.05em; text-transform:uppercase; white-space:nowrap; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.2); pointer-events:none; }
.jr-art--y .jr-art-word{ -webkit-text-stroke-color:rgba(0,0,0,.22); }
.jr-card .jr-art-word{ font-size:clamp(32px, 3.6vw, 58px); }

/* pagination + empty state */
.jr-pages{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:clamp(48px, 6vw, 72px); padding-top:24px; border-top:2px solid #000; }
.jr-pg{ min-width:46px; height:46px; display:inline-flex; align-items:center; justify-content:center; padding:0 10px; border:1.5px solid rgba(0,0,0,.2); color:#000; font-weight:700; font-size:15px; text-decoration:none; transition:border-color var(--t), background-color var(--t); }
a.jr-pg:hover{ border-color:#000; background:var(--yellow); }
.jr-pg.is-on{ background:#000; border-color:#000; color:#fff; }
.jr-pg.is-off{ opacity:.35; }
.jr-pg-info{ margin-left:auto; font-size:13.5px; color:var(--color-muted); }
.jr-empty{ padding:clamp(32px, 5vw, 64px); border:1px solid var(--color-border); border-top:6px solid var(--yellow); }
.jr-empty h2{ font-size:clamp(24px, 2.6vw, 34px); margin:0 0 10px; }
.jr-empty p{ color:var(--color-muted); }
.jr-empty .btn{ margin-top:12px; }

/* ═══ SINGLE ARTICLE ═══════════════════════════════════════════ */
.jr-progress{ position:fixed; top:var(--hdr-h); left:0; right:0; height:4px; z-index:1400; pointer-events:none; }
.jr-progress span{ display:block; height:100%; background:var(--yellow); transform-origin:left; transform:scaleX(0); }
.jr-phero{ padding:clamp(36px, 5vw, 72px) 0 clamp(120px, 13vw, 190px); }
.jr-ptags{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.jr-ptag{ padding:6px 10px; background:var(--yellow); color:#000; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; text-decoration:none; }
a.jr-ptag:hover{ background:#fff; }
.jr-ptag--line{ background:transparent; color:var(--yellow); border:1px solid var(--yellow); }
.jr-ptitle{ font-size:clamp(36px, 5.4vw, 78px); line-height:1; letter-spacing:-.04em; max-width:19ch; margin:0 0 22px; color:#fff; text-transform:none; overflow-wrap:break-word; }
.jr-ptitle.is-long{ font-size:clamp(32px, 4.2vw, 60px); max-width:24ch; }
.jr-psub{ font-size:clamp(17px, 1.5vw, 21px); line-height:1.55; color:var(--w-80); max-width:62ch; margin:0 0 32px; }
.jr-pmeta{ display:flex; flex-wrap:wrap; align-items:center; gap:20px clamp(28px, 4vw, 56px); padding-top:24px; border-top:1px solid var(--w-14); }
.jr-author{ display:flex; align-items:center; gap:12px; }
.jr-author img{ width:48px; height:48px; object-fit:cover; object-position:center 20%; filter:grayscale(1); border:2px solid var(--yellow); }
.jr-author span{ font-size:13px; color:var(--w-66); line-height:1.35; }
.jr-author b{ display:block; color:#fff; font-size:15px; }
.jr-pmeta dl{ display:flex; flex-wrap:wrap; gap:16px clamp(24px, 3vw, 40px); margin:0; }
.jr-pmeta dt{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--yellow); }
.jr-pmeta dd{ margin:4px 0 0; font-size:15px; color:#fff; }

.jr-feature{ position:relative; z-index:2; margin-top:calc(-1 * clamp(96px, 11vw, 160px)); }
.jr-feature-fig{ position:relative; margin:0; aspect-ratio:21/9; overflow:hidden; background:#000; border:1px solid #000; }
.jr-feature-fig img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.jr-feature-fig .jr-art-draw{ width:40%; max-width:420px; }
@media (max-width:760px){ .jr-feature-fig{ aspect-ratio:16/10; } .jr-feature-fig .jr-art-draw{ width:62%; } }

.jr-layout{ display:grid; grid-template-columns:56px minmax(0, 1fr) 270px; gap:clamp(24px, 4vw, 64px); align-items:start; padding-top:clamp(40px, 5vw, 72px); padding-bottom:clamp(56px, 7vw, 100px); }
.jr-main{ min-width:0; max-width:760px; }
.jr-share{ position:sticky; top:calc(var(--hdr-h) + 28px); display:flex; flex-direction:column; border:1px solid var(--color-border); }
.jr-share-label{ padding:10px 0; font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; text-align:center; }
.jr-share a, .jr-share button{ width:54px; height:48px; display:flex; align-items:center; justify-content:center; border:0; border-top:1px solid var(--color-border); background:#fff; color:#000; font-size:17px; cursor:pointer; text-decoration:none; transition:background-color var(--t); }
.jr-share a:hover, .jr-share button:hover, .jr-share button.is-done{ background:var(--yellow); }

.jr-toc{ position:sticky; top:calc(var(--hdr-h) + 28px); max-height:calc(100vh - var(--hdr-h) - 56px); overflow:auto; border-top:2px solid #000; padding-top:14px; }
.jr-toc[hidden], .jr-toc-m[hidden]{ display:none; }
.jr-toc-title{ margin:0 0 6px; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.jr-toc-list{ list-style:none; margin:0; padding:0; counter-reset:t; }
.jr-toc-list li{ counter-increment:t; border-bottom:1px solid var(--color-divider-soft); }
.jr-toc-list a{ display:grid; grid-template-columns:30px minmax(0, 1fr); gap:4px; padding:10px 0; font-size:13.5px; line-height:1.4; color:var(--color-muted); text-decoration:none; transition:color var(--t); }
.jr-toc-list a::before{ content:counter(t, decimal-leading-zero); font-size:11px; font-weight:700; color:rgba(0,0,0,.4); padding-top:2px; }
.jr-toc-list a:hover{ color:#000; }
.jr-toc-list a.is-on{ color:#000; font-weight:600; }
.jr-toc-list a.is-on::before{ color:#000; background:linear-gradient(transparent 55%, var(--yellow) 55%); }
.jr-toc-back{ margin:14px 0 0; font-size:13px; }
.jr-toc-back a{ color:#000; font-weight:700; text-decoration:none; }
.jr-toc-m{ margin:0 0 32px; border:1px solid #000; }
.jr-toc-m summary{ display:flex; justify-content:space-between; align-items:center; padding:14px 16px; font-weight:700; font-size:14px; cursor:pointer; list-style:none; }
.jr-toc-m summary::-webkit-details-marker{ display:none; }
.jr-toc-m[open] summary{ border-bottom:1px solid var(--color-border); }
.jr-toc-m[open] summary .bi{ transform:rotate(180deg); }
.jr-toc-m .jr-toc-list{ padding:4px 16px 8px; }

@media (min-width:1101px){ .jr-toc-m{ display:none !important; } }
@media (max-width:1100px){
  .jr-layout{ grid-template-columns:56px minmax(0, 1fr); }
  .jr-toc{ display:none !important; }
}
@media (max-width:760px){
  .jr-layout{ grid-template-columns:1fr; }
  .jr-share{ position:static; flex-direction:row; flex-wrap:wrap; order:2; border-right:0; }
  .jr-share-label{ display:flex; align-items:center; padding:0 12px; }
  .jr-share a, .jr-share button{ border-top:0; border-left:1px solid var(--color-border); }
}

/* article typography */
.jr-prose{ font-size:18px; line-height:1.75; color:rgba(0,0,0,.84); overflow-wrap:break-word; }
.jr-prose > :first-child{ margin-top:0; }
.jr-prose p{ margin:0 0 1.25em; }
.jr-prose > p:first-of-type{ font-size:clamp(19px, 1.6vw, 22px); line-height:1.6; color:#000; }
.jr-prose h2{ position:relative; margin:2.3em 0 .75em; padding-top:28px; border-top:2px solid #000; font-size:clamp(26px, 2.6vw, 36px); line-height:1.12; letter-spacing:-.03em; color:#000; text-transform:none; scroll-margin-top:calc(var(--hdr-h) + 28px); }
.jr-prose h2::before{ content:""; position:absolute; left:0; top:-2px; width:72px; height:6px; background:var(--yellow); }
.jr-prose h3{ margin:1.9em 0 .55em; font-size:clamp(20px, 1.7vw, 24px); line-height:1.25; letter-spacing:-.02em; color:#000; text-transform:none; scroll-margin-top:calc(var(--hdr-h) + 28px); }
.jr-prose h4{ margin:1.6em 0 .5em; font-size:18px; color:#000; }
.jr-prose a{ color:#000; font-weight:500; text-decoration:underline; text-decoration-color:var(--yellow); text-decoration-thickness:3px; text-underline-offset:3px; transition:background-color var(--t); }
.jr-prose a:hover{ background:var(--yellow); }
.jr-prose strong, .jr-prose b{ color:#000; font-weight:700; }
.jr-prose ul, .jr-prose ol{ list-style:none; margin:0 0 1.5em; padding:0; }
.jr-prose ul > li{ position:relative; padding-left:28px; margin-bottom:.6em; }
.jr-prose ul > li::before{ content:""; position:absolute; left:3px; top:.62em; width:9px; height:9px; background:var(--yellow); outline:1px solid #000; }
.jr-prose ol{ counter-reset:o; }
.jr-prose ol > li{ counter-increment:o; position:relative; padding-left:44px; margin-bottom:.8em; min-height:28px; }
.jr-prose ol > li::before{ content:counter(o); position:absolute; left:0; top:.12em; width:28px; height:28px; display:flex; align-items:center; justify-content:center; background:#000; color:var(--yellow); font-family:var(--font-heading); font-weight:700; font-size:13px; }
.jr-prose blockquote{ margin:2em 0; padding:26px 30px; background:#000; color:#fff; border-left:6px solid var(--yellow); font-family:var(--font-heading); font-size:clamp(19px, 1.6vw, 23px); line-height:1.45; }
.jr-prose blockquote p{ margin:0 0 .6em; } .jr-prose blockquote p:last-child{ margin:0; }
.jr-prose blockquote strong, .jr-prose blockquote a{ color:var(--yellow); }
.jr-prose img{ max-width:100%; height:auto; border:1px solid var(--color-border); }
.jr-prose figure{ margin:2em 0; }
.jr-prose figcaption{ font-size:13px; color:var(--color-muted); margin-top:8px; }
.jr-prose hr{ border:0; border-top:2px solid #000; margin:2.4em 0; }
.jr-prose code{ padding:.1em .35em; background:rgba(0,0,0,.06); font-size:.9em; }
.jr-table{ margin:1.9em 0; overflow-x:auto; border:1px solid #000; }
.jr-table:focus-visible{ outline:3px solid var(--yellow); outline-offset:2px; }
.jr-prose table{ width:100%; min-width:520px; border-collapse:collapse; font-size:15px; line-height:1.5; }
.jr-prose th{ padding:12px 14px; background:#000; color:#fff; text-align:left; font-size:13px; font-weight:700; letter-spacing:.03em; vertical-align:bottom; }
.jr-prose td{ padding:12px 14px; border-top:1px solid var(--color-border); vertical-align:top; }
.jr-prose tbody tr:nth-child(even) td{ background:rgba(0,0,0,.03); }
.jr-prose td:first-child{ font-weight:600; color:#000; }

/* end-of-article blocks */
.jr-cta{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px 32px; margin:clamp(48px, 6vw, 72px) 0 28px; padding:clamp(28px, 4vw, 48px); background:var(--yellow); }
.jr-cta > div{ flex:1 1 360px; }
.jr-cta .eyebrow{ color:#000; }
.jr-cta h2{ font-size:clamp(24px, 2.6vw, 34px); line-height:1.08; letter-spacing:-.03em; text-transform:uppercase; margin:0 0 10px; }
.jr-cta .mark{ background:none; padding:0; text-decoration:underline; text-decoration-thickness:4px; text-underline-offset:6px; }
.jr-cta p{ margin:0; color:rgba(0,0,0,.78); }
.jr-cta .btn-dark:hover{ background:#fff; color:#000; border-color:#000; }
.jr-bio{ display:grid; grid-template-columns:96px minmax(0, 1fr); gap:24px; padding:clamp(24px, 3vw, 36px); background:#000; color:#fff; }
.jr-bio img{ width:96px; height:96px; object-fit:cover; object-position:center 20%; filter:grayscale(1); border:2px solid var(--yellow); }
.jr-bio .eyebrow{ color:var(--yellow); margin-bottom:6px; }
.jr-bio h2{ font-size:24px; margin:0; color:#fff; text-transform:none; }
.jr-bio-role{ margin:2px 0 12px; font-size:14px; color:var(--w-66); }
.jr-bio p{ font-size:15.5px; line-height:1.6; color:var(--w-80); }
.jr-bio-links{ display:flex; flex-wrap:wrap; gap:12px 24px; margin:14px 0 0; }
.jr-bio-links .bm-arrow{ color:#fff; }
@media (max-width:560px){ .jr-bio{ grid-template-columns:1fr; } }
.jr-related .bm-head{ margin-bottom:clamp(28px, 3vw, 44px); }

/* RTL articles (Arabic posts) */
.jr-post[dir="rtl"] .jr-prose ul > li{ padding-left:0; padding-right:28px; }
.jr-post[dir="rtl"] .jr-prose ul > li::before{ left:auto; right:3px; }
.jr-post[dir="rtl"] .jr-prose ol > li{ padding-left:0; padding-right:44px; }
.jr-post[dir="rtl"] .jr-prose ol > li::before{ left:auto; right:0; }
.jr-post[dir="rtl"] .jr-prose blockquote{ border-left:0; border-right:6px solid var(--yellow); }
.jr-post[dir="rtl"] .jr-prose h2::before{ left:auto; right:0; }
.jr-post[dir="rtl"] .jr-prose th{ text-align:right; }

@media print{
  .jr-progress, .jr-share, .jr-toc, .jr-toc-m, .jr-cta, .jr-related{ display:none !important; }
  .jr-phero{ background:#fff; color:#000; padding-bottom:20px; } .jr-ptitle, .jr-author b, .jr-pmeta dd{ color:#000; }
  .jr-feature{ margin-top:0; }
}

/* photos follow the studio's black-and-white treatment; colour returns on hover */
.jr-cover img{ filter:grayscale(1) contrast(1.05); transition:transform .9s var(--ease), filter .5s ease; }
.jr-card:hover .jr-cover img{ filter:none; }
.jr-toc-list a.is-on::before{ background:var(--yellow); align-self:start; padding:1px 3px; width:max-content; }
