/* Story pages, the /news/ hub and the homepage Latest stories block. Loads after mobile.css.
   Story bodies carry the classes the issue page styles inline. :where() adds no specificity, so each rule below weighs the same
   as it does in that inline block, and the html-prefixed phone floors and stacked tables in mobile.css win here just as they do there. */

.stripe { height: 6px; background: linear-gradient(90deg, var(--deep-blue) 0 50%, #b2432a 50% 100%); }

/* ---------- Article ---------- */
.news-article { max-width: 760px; margin: 0 auto; padding: 32px 18px 56px; }
.news-head h1 {
  margin: 10px 0 12px;
  font: 600 clamp(2rem, 4.4vw, 3rem)/1.08 Fraunces, Georgia, serif;
  color: var(--deep-blue);
  overflow-wrap: break-word;
  text-wrap: balance;
}
.news-head .dek { margin: 0; font: italic 400 1.2rem/1.55 Fraunces, Georgia, serif; color: var(--ink-soft); }
.news-head .byline { display: block; margin: 12px 0 0; font-size: .9rem; line-height: 1.5; color: var(--ink-soft); }
.news-head .byline a,
.news-corrections a,
.news-all a,
.news-hub__empty a,
.news-credit a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--deep-blue);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.news-photo { margin: 14px 0 26px; }
.news-photo img { display: block; width: 100%; height: auto; }
.news-photo figcaption { margin-top: 8px; font: 14px/1.4 Inter, system-ui, sans-serif; color: var(--ink-soft); }
.news-caption { font-weight: 600; color: var(--ink); }
.news-credit { margin-left: 6px; }
.news-sources { margin-top: 40px; padding-top: 18px; border-top: 1px solid var(--seafoam); }
.news-sources h2 { margin: 0 0 6px; font: 600 1.4rem/1.2 Fraunces, Georgia, serif; color: var(--deep-blue); }
.news-sources ul { list-style: none; }
.news-sources li { border-top: 1px solid rgba(31, 58, 77, .1); }
.news-sources li:first-child { border-top: 0; }
.news-sources a {
  display: block;
  min-height: 44px;
  padding: 11px 0;
  font-size: .9rem;
  line-height: 1.5;
  color: var(--deep-blue);
  text-decoration: underline;
  text-underline-offset: 2px;
  overflow-wrap: anywhere;
}
.news-sources li.news-source-plain { padding: 11px 0; font-size: .9rem; line-height: 1.5; color: var(--ink-soft); overflow-wrap: anywhere; }
.news-crest { display: block; width: 72px; height: 72px; margin: 10px 0 0; border-radius: 4px; }
.news-corrections { margin: 24px 0 0; font-size: 1.0625rem; line-height: 1.55; color: var(--ink-soft); }
.news-all { margin: 0; font-size: 1.0625rem; line-height: 1.55; font-weight: 700; }

/* ---------- Article body: text from Markdown ---------- */
:where(.news-body) h2 { margin: 30px 0 10px; font: 600 clamp(1.45rem, 2.6vw, 1.8rem)/1.15 Fraunces, Georgia, serif; color: var(--deep-blue); }
:where(.news-body) h3 { margin: 24px 0 8px; font: 600 1.25rem/1.2 Fraunces, Georgia, serif; color: var(--deep-blue); }
:where(.news-body) p { margin: 0 0 14px; font-size: 1.125rem; line-height: 1.65; }
:where(.news-body) ul, :where(.news-body) ol { margin: 0 0 16px; padding-left: 1.4em; }
:where(.news-body) li { margin: 0 0 8px; font-size: 1.125rem; line-height: 1.65; }
:where(.news-body) a { color: var(--deep-blue); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }

/* ---------- Article body: the issue page's classes, one column ---------- */
:where(.news-body) .lbl, :where(.news-head) .lbl, :where(.news-hub) .lbl {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
  font: 700 .68rem/1 Inter, system-ui, sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #b2432a;
}
:where(.news-body) .lbl::after, :where(.news-head) .lbl::after, :where(.news-hub) .lbl::after { content: ""; flex: 1; height: 1px; background: var(--seafoam); }
:where(.news-body) .front { display: block; }
:where(.news-body) .paper { max-width: none; padding: 0; }
:where(.news-body) .lead h2 { margin: 0 0 14px; font: 600 clamp(1.7rem, 2.8vw, 2.5rem)/1.1 Fraunces, serif; color: var(--deep-blue); text-wrap: balance; }
:where(.news-body) .lead figure { margin: 0 0 14px; }
:where(.news-body) .lead img { display: block; width: 100%; height: auto; }
:where(.news-body) figcaption.c, :where(.news-body) .c { margin-top: 6px; font: .78rem/1.4 Inter, system-ui, sans-serif; color: var(--ink-soft); }
:where(.news-body) .lead p { max-width: 68ch; margin: 0 0 12px; font-size: 1.125rem; line-height: 1.65; }
:where(.news-body) .lead p.first::first-letter { float: left; margin: 7px 10px 0 0; font: 600 3.8rem/.85 Fraunces, serif; color: #b2432a; }
:where(.news-body) .side h3 { margin: 0 0 8px; font: 600 1.25rem/1.2 Fraunces, serif; color: var(--deep-blue); }
:where(.news-body) .side p { margin: 0 0 8px; font-size: 1.125rem; line-height: 1.65; }
:where(.news-body) .side .block { margin: 0 0 26px; padding: 0 0 26px; border-bottom: 1px solid var(--seafoam); }
:where(.news-body) .side .block:last-child { border-bottom: 0; }
:where(.news-body) .score2 { margin: 2px 0 6px; font: 600 1.4rem/1.1 Fraunces, serif; color: var(--deep-blue); }
:where(.news-body) .srcline { margin-top: 8px; font-size: .78rem; line-height: 1.5; color: var(--ink-soft); }
:where(.news-body) .srcline a { overflow-wrap: anywhere; }
:where(.news-body) .gbtn {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 6px;
  padding: 9px 14px;
  border: 1px solid var(--deep-blue);
  font-size: .84rem;
  font-weight: 700;
  color: var(--deep-blue);
  text-decoration: none;
}
:where(.news-body) .rail { margin: 0 0 20px; padding: 22px 22px 18px; border-top: 5px solid #b2432a; background: var(--deep-blue); color: #fff; }
:where(.news-body) .rail .lbl { color: var(--bone); }
:where(.news-body) .rail .lbl::after { background: rgba(255, 255, 255, .25); }
:where(.news-body) .rail .rh { margin: 0 0 10px; font: 600 1.35rem/1.15 Fraunces, serif; color: #fff; }
:where(.news-body) .rail table { width: 100%; border-collapse: collapse; font-size: .86rem; }
:where(.news-body) .rail td { padding: 7px 0; border-top: 1px solid rgba(255, 255, 255, .18); vertical-align: top; color: #fff; }
:where(.news-body) .rail td:first-child { width: 42%; font: 700 .68rem/1.5 Inter, system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #c9d8cf; }
:where(.news-body) .rail .hot td:first-child { color: #f0b8a8; }
:where(.news-body) .rail .fine { margin: 10px 0 0; font-size: .82rem; line-height: 1.5; color: #dfe8e3; }
:where(.news-body) .band { position: relative; display: grid; align-items: end; min-height: 420px; margin: 28px 0 0; color: #fff; }
:where(.news-body) .band img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
:where(.news-body) .band::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26, 37, 43, .55) 0%, rgba(26, 37, 43, .68) 38%, rgba(26, 37, 43, .9) 100%); }
:where(.news-body) .band .txt { position: relative; z-index: 1; padding: 60px 22px 28px; }
:where(.news-body) .band .lbl { color: #f0b8a8; }
:where(.news-body) .band .lbl::after { background: rgba(255, 255, 255, .3); }
:where(.news-body) .band h2 { margin: 0 0 10px; font: 600 clamp(1.5rem, 2.3vw, 2.1rem)/1.1 Fraunces, serif; color: #fff; text-wrap: balance; }
:where(.news-body) .band p { margin: 0 0 8px; font-size: 1.125rem; line-height: 1.65; }
:where(.news-body) .band .srcline { color: #dfe8e3; }
:where(.news-body) .band .srcline a { color: #fff; }
:where(.news-body) .navy { margin: 28px 0 0; padding: 36px 0 40px; background: var(--deep-blue); color: #fff; }
:where(.news-body) .navy .in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; padding: 0 22px; }
:where(.news-body) .navy .lbl { color: #f0b8a8; }
:where(.news-body) .navy .lbl::after { background: rgba(255, 255, 255, .25); }
:where(.news-body) .navy h2 { margin: 0 0 14px; font: 600 clamp(1.9rem, 3vw, 2.7rem)/1.08 Fraunces, serif; color: #fff; text-wrap: balance; }
:where(.news-body) .navy p { font-size: 1.125rem; line-height: 1.65; color: #eef2ee; }
:where(.news-body) .navy .card { position: relative; padding: 20px 22px; border-top: 6px solid #b2432a; background: #fff; color: var(--ink); }
:where(.news-body) .navy .card::before { content: ""; position: absolute; left: 0; top: -6px; width: 50%; height: 6px; background: var(--sand); }
:where(.news-body) .navy table { width: 100%; border-collapse: collapse; font-size: .9rem; }
:where(.news-body) .navy td { padding: 9px 6px 9px 0; border-bottom: 1px solid var(--seafoam); vertical-align: top; }
:where(.news-body) .navy td:first-child { width: 34%; font: 700 .66rem/1.5 Inter, system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #b2432a; }
:where(.news-body) .navy .card .srcline { margin-top: 10px; color: var(--ink-soft); }
:where(.news-body) .navy .card a { color: var(--deep-blue); }
:where(.news-body) .navy .gbtn { margin-top: 12px; }
:where(.news-body) .navy > .in a:not(.gbtn), :where(.news-body) .rail a, :where(.news-body) .band a { color: inherit; }
:where(.news-body) .navy .card a:not(.gbtn) { color: var(--deep-blue); }
/* The issue colors this caption inline for its dark section; here it sits on a light page. */
:where(.news-body) .c[style] { color: var(--ink-soft) !important; }
:where(.news-body) .twin { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 14px 0 8px; }
:where(.news-body) .twin img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
:where(.news-body) .mosaic2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 14px 0 12px; }
:where(.news-body) .mosaic2 figure { position: relative; margin: 0; }
:where(.news-body) .mosaic2 img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
:where(.news-body) .mosaic2 figcaption { position: absolute; left: 10px; bottom: 10px; padding: 5px 8px; background: rgba(26, 37, 43, .55); font: 700 .66rem/1 Inter, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #fff; }
:where(.news-body) .sec2 { padding: 28px 0 0; }
:where(.news-body) .sec2 p { max-width: 70ch; font-size: 1.125rem; line-height: 1.65; }
:where(.news-body) .week { display: grid; grid-template-columns: repeat(5, 1fr); margin: 14px 0 0; border: 1px solid var(--seafoam); background: #fff; }
:where(.news-body) .week div { padding: 14px 12px; border-right: 1px solid var(--seafoam); font-size: .86rem; line-height: 1.45; }
:where(.news-body) .week div:last-child { border-right: 0; }
:where(.news-body) .week b { display: block; margin-bottom: 4px; font: 700 .68rem/1.4 Inter, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #b2432a; }
:where(.news-body) .week .hot { background: var(--deep-blue); color: #fff; }
:where(.news-body) .week .hot b { color: #f0b8a8; }
:where(.news-body) .ballot { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr)); gap: 14px 24px; margin: 16px 0 10px; }
:where(.news-body) .ballot div { padding-top: 8px; border-top: 2px solid var(--deep-blue); font-size: .92rem; line-height: 1.5; }
:where(.news-body) .ballot b { display: block; margin-bottom: 4px; font: 700 .66rem/1.4 Inter, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #b2432a; }
:where(.news-body) .list2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 12px 26px; margin: 14px 0 8px; padding: 0; list-style: none; }
:where(.news-body) .list2 li { margin: 0; padding-top: 10px; border-top: 1px solid var(--seafoam); font-size: .95rem; line-height: 1.55; }
:where(.news-body) .list2 li b { color: var(--deep-blue); }
:where(.news-body) .list2 li a { font-size: .78rem; }
:where(.news-body) .pub { margin: 16px 0 0; padding: 20px 22px; border: 1px solid var(--seafoam); border-top: 4px solid var(--sand); background: #fff; }
:where(.news-body) .pub p { max-width: 70ch; font-size: 1.125rem; line-height: 1.65; }
:where(.news-body) .pub h3 { margin: 14px 0 4px; font: 600 1.15rem/1.2 Fraunces, serif; color: var(--deep-blue); }
:where(.news-body) > :first-child { margin-top: 0; padding-top: 0; }
@media (max-width: 800px) {
  :where(.news-body) .week { grid-template-columns: 1fr 1fr; }
  :where(.news-body) .band { min-height: 0; }
  :where(.news-body) .rail { background: var(--deep-blue); }
}
@media (max-width: 560px) {
  :where(.news-body) .week { grid-template-columns: 1fr; }
  :where(.news-body) .twin { grid-template-columns: 1fr; }
}

/* ---------- Ad units (scripts/ad-slots.cjs). Width and height on each image hold its space, so nothing jumps as it loads. ---------- */
.ad-unit { text-align: center; }
.ad-unit__label { margin: 0 0 6px; font: 600 .75rem/1.3 Inter, system-ui, sans-serif; letter-spacing: .04em; color: var(--ink-soft); }
.ad-unit a { display: inline-block; max-width: 100%; vertical-align: top; }
.ad-unit img { display: block; max-width: 100%; height: auto; }
.ad-unit--leaderboard { padding: 12px 16px 14px; border-bottom: 1px solid rgba(31, 58, 77, .12); }
.latest-stories__ad { padding: 14px 0 18px; border-top: 1px solid rgba(31, 58, 77, .16); }
.latest-stories__list .ad-unit a { display: inline-block; min-height: 0; padding: 0; border-top: 0; }
.ad-unit--inline { margin: 24px 0; }
.news-issue__ad { padding: 18px 0 20px; border-top: 1px solid rgba(31, 58, 77, .16); }
.news-issue__ad .ad-unit--inline { margin: 0; }
/* The sidebar shows only where its column fits beside the page; below that the inline unit stands in for it. */
.ad-unit--sidebar { display: none; }
@media (min-width: 901px) { .latest-stories__ad { grid-column: 1 / -1; } }
@media (min-width: 1240px) {
  .news-layout { display: grid; grid-template-columns: minmax(0, 860px) 300px; gap: 0 40px; justify-content: center; align-items: start; }
  .news-layout--article { grid-template-columns: minmax(0, 760px) 300px; }
  .news-layout > .news-article, .news-layout > .news-issue { width: 100%; margin: 0; }
  .ad-unit--sidebar { display: block; position: sticky; top: 72px; margin: 32px 0 56px; }
  .ad-unit--inline, .news-issue__ad { display: none; }
}

/* ---------- /advertise/ ---------- */
.advertise__table { width: 100%; margin: 6px 0 14px; border-collapse: collapse; font-size: 1rem; line-height: 1.45; }
.advertise__table caption { position: absolute; left: -9999px; }
.advertise__table th { padding: 8px 12px 8px 0; border-bottom: 2px solid var(--deep-blue); font: 700 .8125rem/1.3 Inter, system-ui, sans-serif; text-align: left; color: var(--deep-blue); }
.advertise__table td { padding: 10px 12px 10px 0; border-bottom: 1px solid rgba(31, 58, 77, .16); vertical-align: top; }
.advertise__table td:first-child { font-weight: 600; }
.advertise__sponsor { margin-top: 18px; }

/* ---------- /news/ hub ---------- */
.news-hub { max-width: 860px; margin: 0 auto; padding: 36px 18px 64px; }
.news-hub h1 { margin: 0 0 22px; font: 600 clamp(2rem, 4.4vw, 3rem)/1.08 Fraunces, Georgia, serif; color: var(--deep-blue); }
.news-hub__list { list-style: none; }
.news-hub__list li { padding: 20px 0 22px; border-top: 1px solid rgba(31, 58, 77, .16); }
.news-hub__list h2 { font: 600 clamp(1.35rem, 2.6vw, 1.7rem)/1.2 Fraunces, Georgia, serif; color: var(--deep-blue); }
.news-hub__list h2 a { display: inline-block; min-height: 44px; padding: 2px 0; }
.news-hub__list h2 a:hover { color: #b2432a; }
.news-hub__list p { margin: 4px 0 0; font-size: 1.0625rem; line-height: 1.55; color: var(--ink-soft); }
.news-hub__empty { font-size: 1.0625rem; line-height: 1.55; color: var(--ink-soft); }

/* ---------- Homepage Latest stories: text only ---------- */
.latest-stories { padding: 34px 0 22px; }
.latest-stories .section-heading { margin-bottom: 14px; }
.latest-stories__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; list-style: none; }
.latest-stories__list a { display: block; min-height: 44px; padding: 14px 0 16px; border-top: 1px solid rgba(31, 58, 77, .16); }
.latest-stories__meta { display: block; margin-bottom: 4px; font: 700 .875rem/1.35 Inter, system-ui, sans-serif; color: #b2432a; }
.latest-stories__head { display: block; font: 600 1.25rem/1.25 Fraunces, Georgia, serif; color: var(--deep-blue); }
.latest-stories__list a:hover .latest-stories__head { color: #b2432a; }
.latest-stories__all { margin: 4px 0 0; font-weight: 700; }
.latest-stories__all a { display: inline-flex; align-items: center; min-height: 44px; color: var(--deep-blue); text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 900px) { .latest-stories__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .latest-stories__list { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Sunday Issue page (/issues/<date>/, built by build-news.cjs) ---------- */
.news-issue { max-width: 860px; margin: 0 auto; padding: 32px 18px 64px; }
.news-issue__head h1 { margin: 10px 0 12px; font: 600 clamp(2rem, 4.4vw, 3rem)/1.08 Fraunces, Georgia, serif; color: var(--deep-blue); overflow-wrap: break-word; text-wrap: balance; }
.news-issue__head .dek { margin: 0; font: italic 400 1.2rem/1.55 Fraunces, Georgia, serif; color: var(--ink-soft); }
.news-issue__head .byline { margin: 12px 0 0; font-size: .9rem; line-height: 1.5; color: var(--ink-soft); }
.news-issue__head .byline a { color: var(--deep-blue); text-decoration: underline; text-underline-offset: 2px; }
.news-issue__section { margin: 38px 0 4px; padding-bottom: 8px; border-bottom: 2px solid var(--deep-blue); font: 700 .8125rem/1.3 Inter, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #b2432a; }
.news-issue__list { list-style: none; margin: 0; padding: 0; }
.news-issue__item { display: grid; grid-template-columns: 148px minmax(0, 1fr); gap: 4px 18px; align-items: start; padding: 18px 0 20px; border-top: 1px solid rgba(31, 58, 77, .16); }
.news-issue__item:first-child { border-top: 0; }
.news-issue__photo { margin: 0; }
.news-issue__photo img { display: block; width: 100%; height: auto; }
.news-issue__photo figcaption { margin-top: 5px; font: 12px/1.35 Inter, system-ui, sans-serif; color: var(--ink-soft); }
.news-issue__photo .news-caption { font-weight: 600; color: var(--ink); }
.news-issue__text h3 { margin: 0; font: 600 1.3rem/1.2 Fraunces, Georgia, serif; color: var(--deep-blue); overflow-wrap: break-word; }
.news-issue__text h3 a { display: inline-block; min-height: 44px; padding: 2px 0; color: inherit; }
.news-issue__text h3 a:hover { color: #b2432a; }
.news-issue__text p { margin: 4px 0 0; font-size: 1.0625rem; line-height: 1.55; color: var(--ink-soft); }
.news-issue__item.is-lead { grid-template-columns: minmax(0, 1fr); }
.news-issue__item.is-lead .news-issue__photo figcaption { font-size: 14px; }
.news-issue__item.is-lead .news-issue__text h3 { margin-top: 10px; font-size: clamp(1.6rem, 3.2vw, 2.2rem); line-height: 1.12; }
.news-issue__item.is-lead .news-issue__text p { font-size: 1.1875rem; }
.news-issue__editor .news-body h3 { margin: 18px 0 8px; font: 600 clamp(1.6rem, 3.2vw, 2.2rem)/1.12 Fraunces, Georgia, serif; color: var(--deep-blue); overflow-wrap: break-word; }
.news-issue__editor .news-body h4 { margin: 26px 0 8px; font: 600 1.25rem/1.2 Fraunces, Georgia, serif; color: var(--deep-blue); }
.news-issue .news-all { margin: 26px 0 0; font-size: 1.0625rem; font-weight: 700; }
.news-issue .news-all a { display: inline-flex; align-items: center; min-height: 44px; color: var(--deep-blue); text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 560px) {
  .news-issue__item { grid-template-columns: 112px minmax(0, 1fr); gap: 4px 14px; }
  .news-issue__item.is-lead { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Sponsored: a tint and a label on the page and every card, so paid content cannot be taken for news ---------- */
.news-sponsored-label {
  display: inline-block;
  margin: 0 0 10px;
  padding: 4px 10px;
  background: #f0a81c;
  font: 700 .875rem/1.35 Inter, system-ui, sans-serif;
  color: var(--ink);
}
.news-article--sponsored { background: #fdeec2; }
.news-hub__list li.is-sponsored { padding: 16px 16px 18px; background: #fdeec2; }
.news-hub__list li.is-sponsored .news-sponsored-label { margin: 0 0 6px; font-size: .875rem; color: var(--ink); }
.news-issue__item.is-sponsored { grid-template-columns: minmax(0, 1fr); padding: 16px 16px 18px; background: #fdeec2; }
.news-issue__item.is-sponsored .news-sponsored-label { justify-self: start; margin: 0; }
.latest-stories__list li.is-sponsored a { padding: 14px 12px 16px; background: #fdeec2; }
.latest-stories__list li.is-sponsored .latest-stories__meta { color: var(--ink); }