@charset "UTF-8";

:root {
  --ink: #17372d;
  --muted: #52665d;
  --paper: #f2eee4;
  --cream: #fffaf0;
  --green: #285b46;
  --deep: #103d30;
  --gold: #d7af54;
  --rust: #a8442f;
  --line: #a7aa9d;
  --serif: Georgia, "Times New Roman", serif;
  --sans: Arial, Helvetica, sans-serif;
}

body {
  color: var(--ink);
  background-color: var(--paper);
  background-image:
    radial-gradient(circle at 14% 18%, rgba(168, 68, 47, .035) 0 1px, transparent 1.5px),
    radial-gradient(circle at 77% 63%, rgba(16, 61, 48, .035) 0 1px, transparent 1.5px),
    repeating-linear-gradient(0deg, rgba(23, 55, 45, .012) 0, rgba(23, 55, 45, .012) 1px, transparent 1px, transparent 5px);
  background-size: 17px 19px, 23px 29px, 100% 5px;
  font-family: var(--sans);
}

a { color: var(--deep); text-underline-offset: 4px; }
.status-bar { background: var(--ink); color: var(--cream); font-size: .68rem; letter-spacing: .12em; }
.status-inner,
.site-nav,
.page-shell,
.edition-notice,
.edition-pager { width: min(calc(100% - 64px), 1260px); }
.status-inner { padding: .62rem 0; }
.status-inner strong { color: #f0b8a7; }
.site-nav { min-height: 92px; }
.site-nav > div a {
  padding: .5rem .75rem;
  font-size: .67rem;
  letter-spacing: .12em;
  background: rgba(255, 250, 240, .34);
}
.wordmark,
.footer-wordmark { font-size: 3.2rem; }
.edition-notice {
  border-width: 1px 1px 1px 5px;
  border-color: var(--gold);
  background: rgba(255, 250, 240, .62);
  font-size: .88rem;
}

.masthead { border-bottom: 0; padding: 2.2rem 2rem 1.7rem; }
.masthead__inner {
  max-width: 1260px;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "kicker title" "meta dek";
  align-items: end;
  column-gap: 2rem;
  row-gap: .45rem;
  border-bottom: 1px solid var(--line);
  padding-bottom: 1.4rem;
  text-align: left;
}
.kicker,
.eyebrow,
.story-label,
.proof-label,
.proof-attribution {
  margin: 0;
  color: var(--deep);
  font-size: .66rem;
  line-height: 1.35;
  letter-spacing: .16em;
}
.kicker { grid-area: kicker; padding-bottom: .35rem; }
.masthead h1 {
  grid-area: title;
  margin: 0;
  font: 500 clamp(2.7rem, 5.3vw, 5.4rem)/.9 var(--serif);
  letter-spacing: -.07em;
}
.edition-line {
  grid-area: meta;
  display: flex;
  gap: .55rem;
  font-size: .66rem;
  line-height: 1.45;
  letter-spacing: .08em;
  white-space: nowrap;
}
.masthead .dek {
  grid-area: dek;
  margin: 0;
  max-width: 45rem;
  color: var(--muted);
  font: 400 1.03rem/1.45 var(--serif);
}

.edition-pager { max-width: 1260px; }
.edition-pager__item { background: rgba(255, 250, 240, .55); }
.edition-pager__item.is-disabled { background: rgba(231, 227, 217, .7); }
.page-shell { padding-bottom: 5rem; }
.lead-story { padding: 3.2rem 0 4.5rem; border-bottom: 1px solid var(--ink); }
.lead-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(290px, .62fr);
  gap: clamp(2.5rem, 6vw, 6.5rem);
  align-items: center;
}
.lead-copy { min-width: 0; }
.lead-story h2 {
  margin: .9rem 0 1.4rem;
  max-width: 920px;
  font: 500 clamp(3.4rem, 6.3vw, 6.9rem)/.86 var(--serif);
  letter-spacing: -.066em;
}
.lead-story h2 em { color: var(--rust); font-weight: 400; }
.standfirst {
  max-width: 53rem;
  margin: 0 0 1.65rem;
  padding-left: 1rem;
  border-left: 2px solid var(--gold);
  font: 400 clamp(1.22rem, 1.9vw, 1.65rem)/1.42 var(--serif);
}
.story-copy { columns: 2; column-gap: 2.25rem; }
.story-copy p { margin: 0 0 1rem; break-inside: avoid; }

.proof-card {
  position: relative;
  padding: clamp(1.6rem, 3vw, 2.35rem);
  color: var(--cream);
  background: var(--deep);
  box-shadow: 11px 11px 0 var(--rust);
  isolation: isolate;
}
.proof-card::before {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(215, 175, 84, .42);
  pointer-events: none;
  z-index: -1;
}
.proof-label { color: var(--cream); }
.proof-amount {
  margin: .35rem 0 -.1rem;
  color: var(--gold);
  font: 500 clamp(4.8rem, 8vw, 7.2rem)/1 var(--serif);
  letter-spacing: -.07em;
}
.proof-amount span { font-size: .42em; letter-spacing: 0; text-transform: uppercase; }
.proof-card h3 { margin: 0 0 1.1rem; color: var(--cream); font: 400 1.55rem/1.08 var(--serif); }
.proof-card > p:not([class]) { margin: 0 0 1.2rem; font-size: .88rem; line-height: 1.55; }
.proof-attribution { color: var(--gold); padding-top: 1rem; border-top: 1px solid rgba(255, 250, 240, .35); }

.source-line span,
.source-stack::before { color: var(--rust); letter-spacing: .15em; }
.story-grid {
  grid-template-columns: 1.25fr .75fr;
  gap: 0;
  margin: 0;
  border-bottom: 1px solid var(--ink);
}
.story-card {
  padding: 3.2rem clamp(1.5rem, 4vw, 3.7rem);
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: transparent;
}
.story-card:nth-child(even) { border-right: 0; }
.story-card--wide { grid-column: auto; grid-row: span 2; background: rgba(255, 250, 240, .44); }
.story-card:last-child { grid-column: 1 / -1; border-right: 0; }
.story-card:last-child > * { max-width: 56rem; }
.story-card--alert {
  background: var(--rust);
  color: var(--cream);
  box-shadow: inset 0 0 0 8px rgba(255, 250, 240, .09);
}
.story-card--alert .story-label,
.story-card--alert a { color: var(--cream); }
.story-card--alert .source-line span { color: #ffd191; }
.story-card h2 {
  font-size: clamp(2rem, 3.6vw, 3.65rem);
  line-height: .98;
  letter-spacing: -.045em;
}
.story-card:not(.story-card--wide) h2 { font-size: clamp(1.65rem, 2.5vw, 2.55rem); }
.story-card .caveat { border-color: currentColor; }
.source-stack { display: flex; flex-wrap: wrap; gap: .75rem 1.1rem; }
.source-stack::before { content: "Sources"; flex-basis: 100%; }

.briefs { padding: 4.8rem 0; }
.briefs-grid { grid-template-columns: .85fr 1.15fr; gap: 2rem; }
.briefs-grid article {
  padding: 1rem 0 0;
  border: 0;
  border-top: 5px solid var(--gold);
  background: transparent;
}
.briefs-grid article:last-child { border-color: var(--green); }
.briefs-grid h3 { font-size: clamp(1.65rem, 2.6vw, 2.6rem); line-height: 1.03; }
.notes {
  padding: 3.2rem;
  color: var(--cream);
  background: var(--ink);
}
.notes .eyebrow { color: var(--gold); }
.notes a { color: var(--cream); }
footer { width: min(calc(100% - 64px), 1260px); min-height: 132px; border-color: var(--ink); }

@media (max-width: 900px) {
  .masthead__inner { grid-template-columns: 1fr; grid-template-areas: "kicker" "title" "meta" "dek"; }
  .lead-layout { grid-template-columns: 1fr; }
  .lead-story h2 { max-width: 780px; }
  .proof-card { max-width: 520px; }
  .story-grid { grid-template-columns: 1fr; }
  .story-card,
  .story-card:nth-child(even) { border-right: 0; }
  .story-card--wide { grid-row: auto; }
}

@media (max-width: 620px) {
  .status-inner,
  .site-nav,
  .page-shell,
  .edition-notice,
  .edition-pager,
  footer { width: calc(100% - 34px); }
  .site-nav { min-height: 78px; gap: .5rem; }
  .site-nav > div { gap: .35rem; }
  .site-nav > div a { padding: .43rem .48rem; font-size: .57rem; letter-spacing: .08em; }
  .wordmark,
  .footer-wordmark { font-size: 2.45rem; }
  .edition-notice { font-size: .78rem; }
  .masthead { padding: 1.8rem 17px 1rem; }
  .masthead__inner { padding-bottom: 1rem; }
  .masthead h1 { font-size: clamp(2.75rem, 14vw, 4rem); }
  .edition-line { white-space: normal; flex-wrap: wrap; }
  .edition-line span[aria-hidden] { display: none; }
  .masthead .dek { font-size: .95rem; }
  .lead-story { padding: 2.4rem 0 3.6rem; }
  .lead-layout { gap: 2.25rem; }
  .lead-story h2 { font-size: clamp(3.05rem, 15.1vw, 4.75rem); }
  .standfirst { font-size: 1.2rem; }
  .story-copy { columns: 1; }
  .proof-card { margin-right: 8px; padding: 1.55rem; box-shadow: 8px 8px 0 var(--rust); }
  .proof-amount { font-size: 5.2rem; }
  .story-card { padding: 2.6rem 0; }
  .story-card--wide { padding-inline: 0; background: transparent; }
  .story-card--alert { margin-inline: -17px; padding-inline: 17px; }
  .story-card h2,
  .story-card:not(.story-card--wide) h2 { font-size: 2.25rem; }
  .briefs { padding: 3.8rem 0; }
  .briefs-grid { grid-template-columns: 1fr; gap: 2.6rem; }
  .notes { margin-inline: -17px; padding: 2.5rem 17px; }
  footer { min-height: 110px; }
}

@media (max-width: 390px) {
  .wordmark { font-size: 2.3rem; }
  .lead-story h2 { font-size: 14.5vw; }
  .proof-card h3 { font-size: 1.35rem; }
  .source-line { align-items: flex-start; flex-direction: column; gap: .25rem; }
}
