/* ---- News detail A — centred long-read ---------------------------------- */

/* Article body system (shared vocabulary across all three variants) */
.art{max-width:var(--maxw-text);margin:0 auto}
.art > *{max-width:var(--maxw-text)}
.art p{font-size:var(--t-body-lg);line-height:var(--lh-body);color:var(--ink-90);margin:0 0 1.15em}
.art p.first{font-size:var(--t-lead);line-height:1.34;letter-spacing:-.02em;color:var(--cream);margin-bottom:1em}
.art h2{font-size:var(--t-display-sm);margin:var(--gap-lg) 0 var(--gap-sm)}
.art h3{font-family:var(--f-display);font-weight:800;letter-spacing:var(--ls-display-tight);
  font-size:var(--t-lead);line-height:1.12;margin:var(--gap-md) 0 var(--gap-xs);color:var(--cream)}
.art a:not(.pill){color:inherit;text-decoration:none;
  box-shadow:inset 0 -1px 0 0 var(--ink-rim);
  transition:box-shadow var(--d-fast) var(--e-enter),color var(--d-fast) var(--e-enter)}
.art a:not(.pill):hover{color:var(--cream);box-shadow:inset 0 -1px 0 0 var(--cream)}
.art ul,.art ol{margin:0 0 1.3em;padding-left:1.35em;color:var(--ink-90);font-size:var(--t-body-lg)}
.art li{margin-bottom:.5em;padding-left:.25em}
.art ul li::marker{color:var(--accent)}
.art ol li::marker{font-family:var(--f-mono);font-weight:700;color:var(--ink-56);font-size:.85em}

/* pull-quote */
.pull{margin:var(--gap-lg) 0;padding:0 0 0 var(--gap-md);
  border-left:2px solid var(--accent);max-width:var(--maxw-text)}
.pull p{font-family:var(--f-display);font-weight:800;letter-spacing:var(--ls-display-tight);
  font-size:var(--t-display-sm);line-height:1.1;color:var(--cream);margin:0 0 var(--gap-sm)}
.pull cite{display:block;font-style:normal;font-size:var(--t-label);letter-spacing:var(--ls-label);
  text-transform:uppercase;font-weight:700;color:var(--ink-56)}

/* figure + placeholder image */
figure{margin:var(--gap-lg) 0}
.ph{border-radius:var(--r-card);aspect-ratio:16/9;
  background:linear-gradient(150deg,
    color-mix(in oklab,var(--accent) 22%,var(--navy-700)),
    var(--navy) 52%, var(--navy-950));
  box-shadow:inset 0 0 0 1px var(--ink-hairline),var(--sh-sm)}
.ph.wide{aspect-ratio:21/9}
figcaption{margin-top:var(--gap-sm);font-size:var(--t-label);letter-spacing:.02em;
  text-transform:none;color:var(--ink-56);line-height:1.5}

/* stat callout */
.statcall{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg);
  margin:var(--gap-lg) 0;max-width:var(--maxw-text)}
.statcall .n{font-family:var(--f-display);font-weight:800;letter-spacing:var(--ls-display);
  font-size:var(--t-display-lg);line-height:1;color:var(--cream)}
.statcall .l{margin-top:10px;font-size:var(--t-label);letter-spacing:var(--ls-label);
  text-transform:uppercase;font-weight:700;color:var(--ink-90)}

/* hero */
.hero{padding:calc(var(--pad-band) + 46px) var(--gut) 0}
.hero .wrap-text{margin:0 auto}
.hero h1{font-size:var(--t-display-md);margin:var(--gap-sm) 0 var(--gap-md)}
.hero .lede{max-width:var(--maxw-text)}
.byline{display:flex;flex-wrap:wrap;gap:var(--gap-sm) var(--gap-md);align-items:center;
  margin-top:var(--gap-md);padding-top:var(--gap-sm);border-top:1px solid var(--ink-hairline);
  font-size:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;
  font-weight:700;color:var(--ink-56)}
.herofig{max-width:var(--maxw);margin:var(--gap-lg) auto 0;padding:0 var(--gut)}
.herofig .ph{aspect-ratio:21/9}
.herofig figcaption{max-width:var(--maxw-text)}

/* related */
.rel{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-md);margin-top:var(--gap-lg)}
.rel .card{display:block;text-decoration:none}
.rel .date{font-family:var(--f-mono);font-size:var(--t-label);letter-spacing:.04em;color:var(--ink-56)}
.rel h3{font-size:var(--t-lead);line-height:1.1;margin-top:var(--gap-xs);color:var(--cream)}
.relwrap{max-width:var(--maxw-text);margin:0 auto}

@media (max-width:760px){
  .statcall,.rel{grid-template-columns:1fr}
  .herofig{padding:0 var(--gut)}
}