/* Chroniques sombres du Journal. Les deux compositions témoins ont leur propre feuille. */
.j-journal-story .j-story-opening { border-bottom: 1px solid var(--j-line); }
.j-story-rail {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding-top: .45rem; font: 650 .85rem/1.35 var(--j-body-font);
}
.j-story-rail a, .j-story-return { min-height: 44px; display: inline-flex; align-items: center; text-underline-offset: .24em; }
.j-story-rail span { color: var(--j-text-accent); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; text-align: right; }
.j-story-spread {
  display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "title" "cover" "byline";
  gap: .85rem; padding: .5rem 0 1.3rem;
}
.j-story-spread.j-story-text-only { grid-template-areas: "title" "byline"; }
.j-story-headline { grid-area: title; align-self: end; z-index: 1; min-width: 0; font-weight: 400; }
.j-story-name {
  display: block; font: italic 800 clamp(3.1rem, 12.2vw, 6.4rem)/.94 var(--j-display-font);
  color: var(--j-text); text-transform: uppercase; letter-spacing: -.026em; text-wrap: balance;
}
.j-story-headline-long .j-story-name { font-size: clamp(2.45rem, 9.8vw, 4.8rem); }
.j-story-name em { display: block; color: var(--j-text-accent); font-size: 1.46em; line-height: .89; }
.j-story-separator { position: absolute; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; white-space: nowrap; }
.j-story-subtitle {
  display: block; max-width: 37ch; margin-top: .65rem;
  font: italic clamp(1.22rem, 3.7vw, 1.8rem)/1.23 var(--j-reading-font); text-wrap: pretty;
}
.j-story-cover { grid-area: cover; min-width: 0; position: relative; }
.j-story-cover img { width: 100%; aspect-ratio: 1.55; object-fit: cover; object-position: 50% 52%; }
.j-story-byline { grid-area: byline; color: var(--j-muted); font: 600 .85rem/1.5 var(--j-body-font); }
.j-story-reportage .j-story-spread:not(.j-story-text-only) { grid-template-areas: "cover" "title" "byline"; }
.j-story-reportage .j-story-cover::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(0deg, var(--j-surface), transparent 32%); pointer-events: none;
}
.j-story-reportage .j-story-cover + .j-story-byline { margin-top: .2rem; }
.j-story-reportage .j-story-spread:not(.j-story-text-only) .j-story-headline { margin-top: -2.2rem; }

.j-story-reader {
  width: min(calc(100% - 2 * var(--j-gutter)), var(--j-reading)); margin-inline: auto;
  padding-block: clamp(1.2rem, 3.5vw, 3rem) 3rem;
}
.j-story-jumps { display: flex; align-items: start; column-gap: 1rem; padding-bottom: .3rem; margin-bottom: 1.55rem; border-block: 1px solid var(--j-line); }
.j-story-toc { flex: 1 1 auto; min-width: 0; }
.j-story-toc summary, .j-story-plan {
  display: flex; align-items: center; gap: .55rem; min-height: 44px; padding-block: .35rem;
  font: 700 .94rem/1.4 var(--j-body-font);
}
.j-story-toc summary { cursor: pointer; list-style: none; }
.j-story-toc summary::-webkit-details-marker { display: none; }
.j-story-toc summary::after { content: "+"; font-size: 1.15rem; }
.j-story-toc[open] summary::after { content: "−"; }
.j-story-toc nav { display: grid; padding-bottom: .5rem; }
.j-story-toc nav a { display: flex; align-items: center; min-height: 44px; padding: .35rem 0; font: 600 .95rem/1.4 var(--j-body-font); }
.j-story-plan { flex: none; color: var(--j-text-accent); }
.j-story-reader .article-content { color: var(--j-text); font: 400 clamp(1.04rem, 1.6vw, 1.16rem)/1.72 var(--j-body-font); }
.j-story-reportage .article-content { font-family: var(--j-reading-font); }
.j-story-reader .article-content > p:first-of-type { font-size: 1.12em; line-height: 1.55; }
.j-story-reader[data-repeat-headline] .article-content > h2:first-child { display: none; }
.j-story-reader[data-repeat-headline] .article-content > h2:first-child + p { margin-top: 0; }
.j-story-reader .article-content :is(h2,h3,h4) { text-wrap: pretty; scroll-margin-top: 1.3rem; }
.j-story-reader .article-content h2 { margin-top: 2.2rem; line-height: 1.13; }
.j-story-reader .article-content > :is(ul,ol) { padding-left: 1.4rem; }
.j-story-reader .article-content li::marker { color: var(--j-text-accent); }
.j-story-reader .article-content hr { border: 0; border-top: 1px solid var(--j-line); }
.j-story-reader .article-content :is(blockquote,.jerry-action-plan) {
  padding: .8rem 1rem; border-inline-start: 2px solid var(--j-line);
  background: var(--j-surface-raised); border-radius: 0;
}
.j-story-reader .article-content blockquote strong:first-child { color: var(--j-text-accent); }
/* Les encadrés et le CTA de l’ancienne édition portent leurs couleurs directement dans le HTML. */
.j-story-reader .article-content div[style*="background:"] { background: var(--j-surface-raised) !important; color: var(--j-text); border-color: var(--j-line) !important; }
.j-story-reader .article-content :is(h4,strong,span)[style*="color:"] { color: var(--j-text-accent) !important; }
.j-story-reader .article-content a[style*="background:"] { background: var(--j-action) !important; color: var(--j-action-text) !important; display: inline-block; }
.j-story-diagnostic { border-top: 1px solid var(--j-line); padding: 1.25rem 0; margin-top: 2.5rem; }
.j-story-diagnostic .sidebar h3 { font: italic 800 1.7rem/1.15 var(--j-display-font); }
.j-story-diagnostic .sidebar p { margin-top: .55rem; color: var(--j-muted); }
.j-story-diagnostic .btn-cta { margin-top: .9rem; }
.j-story-return { font-size: .9rem; }
@media (min-width: 48rem) {
  .j-story-rail { padding-top: 1rem; }
  .j-story-spread, .j-story-reportage .j-story-spread:not(.j-story-text-only) {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); grid-template-rows: 1fr auto auto 1fr;
    grid-template-areas: ". cover" "title cover" "byline cover" ". cover"; align-content: center;
    gap: .85rem clamp(1.5rem, 3vw, 3rem); padding-block: 1rem 2.3rem;
  }
  .j-story-spread.j-story-text-only { grid-template-columns: minmax(0, 48rem); grid-template-rows: auto auto; grid-template-areas: "title" "byline"; }
  .j-story-spread .j-story-cover { align-self: center; }
  .j-story-cover img { aspect-ratio: 1.25; }
  .j-story-name { font-size: clamp(3.5rem, 6.35vw, 6rem); }
  .j-story-headline-long .j-story-name { font-size: clamp(2.9rem, 5.2vw, 4.5rem); }
  .j-story-subtitle { margin-top: 1rem; font-size: clamp(1.35rem, 2.1vw, 1.85rem); }
  .j-story-spread:has(.j-story-name em) .j-story-cover { margin-inline-start: -3.5rem; }
  .j-story-spread:has(.j-story-name em) .j-story-cover::after {
    content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--j-surface), transparent 28%); pointer-events: none;
  }
  .j-story-reportage .j-story-spread:not(.j-story-text-only) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); grid-template-areas: "cover ." "cover title" "cover byline" "cover ."; }
  .j-story-reportage .j-story-cover::after { background: linear-gradient(270deg, var(--j-surface), transparent 16%); }
  .j-story-reportage .j-story-spread:not(.j-story-text-only) .j-story-headline { margin: 0; }
}