:root {
  --ink: #090909;
  --paper: #f7f7f5;
  --white: #fff;
  --stone: #d6c8c4;
  --line: #d8d6d1;
  --muted: #686661;
  --accent: #e4002b;
  --serif: Georgia, "Times New Roman", serif;
  --sans: Arial, Helvetica, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--white);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
main { overflow: hidden; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 400; }
h1, h2 { font-family: var(--serif); letter-spacing: -.045em; line-height: .96; }
em { font-weight: 400; }

.site-header {
  align-items: center;
  background: rgba(9,9,9,.96);
  border-bottom: 1px solid rgba(255,255,255,.16);
  display: grid;
  grid-template-columns: minmax(230px,1fr) auto minmax(140px,1fr);
  min-height: 80px;
  padding: 0 3.25vw;
  position: relative;
  z-index: 10;
}
.wordmark { font-family: var(--serif); font-size: 18px; letter-spacing: .055em; white-space: nowrap; }
.wordmark sup { color: var(--accent); font-family: var(--sans); font-size: 8px; margin-left: 3px; top: -.7em; }
.site-header nav ul { align-items: center; display: flex; gap: 28px; list-style: none; margin: 0; padding: 0; }
.site-header nav a, .nav-cta { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.site-header nav a { color: #d7d7d4; }
.site-header nav a:hover, .site-header .current-menu-item > a { color: var(--white); }
.nav-cta { border-bottom: 1px solid var(--accent); justify-self: end; padding: 9px 0; }

.home-hero {
  background-color: #111;
  background-position: center;
  background-size: cover;
  display: flex;
  min-height: calc(100vh - 80px);
  padding: clamp(70px,10vw,150px) 6vw 42px;
  position: relative;
}
.home-hero > div { align-self: center; max-width: 820px; }
.home-hero h1 { font-size: clamp(58px,8.2vw,132px); margin: 0 0 28px; }
.home-hero > div > p:not(.eyebrow):not(.hero-actions) { color: #e1e0dc; font-family: var(--serif); font-size: clamp(18px,1.55vw,25px); max-width: 610px; }
.home-hero aside { bottom: 38px; display: flex; font-size: 11px; justify-content: space-between; left: 6vw; letter-spacing: .15em; position: absolute; right: 6vw; }
.eyebrow, .label { font-size: 12px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.eyebrow { color: #e9e6e2; margin-bottom: 28px; }
.eyebrow::before { background: var(--accent); content: ""; display: inline-block; height: 2px; margin: 0 13px 4px 0; width: 24px; }
.hero-actions { align-items: center; display: flex; gap: 28px; margin-top: 38px; }
.button {
  background: var(--accent);
  border: 1px solid var(--accent);
  color: var(--white);
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  padding: 15px 22px 14px;
  text-transform: uppercase;
  transition: .25s ease;
}
.button:hover { background: transparent; color: inherit; }
.text-link { border-bottom: 1px solid currentColor; display: inline-block; font-size: 13px; letter-spacing: .08em; padding-bottom: 5px; text-transform: uppercase; }

.page-hero {
  min-height: 640px;
  padding: clamp(110px,13vw,205px) 7vw 80px;
  position: relative;
}
.page-hero::after { background: var(--accent); bottom: 0; content: ""; height: 4px; left: 7vw; position: absolute; width: 48px; }
.page-hero h1 { font-size: clamp(62px,9.5vw,150px); margin: 0; max-width: 1100px; }
.page-hero .hero-copy { color: #bdbbb7; font-family: var(--serif); font-size: clamp(18px,1.75vw,27px); line-height: 1.35; margin: 48px 0 0 auto; max-width: 590px; }

.light { background: var(--paper); color: var(--ink); }
.split { display: grid; gap: 6vw; grid-template-columns: minmax(150px,1fr) minmax(300px,2fr); padding: clamp(85px,10vw,150px) 7vw; }
.label { color: var(--muted); }
.split h2 { font-size: clamp(42px,5vw,78px); max-width: 980px; }
.lead { font-family: var(--serif); font-size: clamp(21px,2.05vw,32px); line-height: 1.35; max-width: 850px; }
.split .text-link { margin-top: 28px; }
.signal { align-items: center; display: flex; font-family: var(--serif); font-size: clamp(35px,5vw,78px); gap: 2.5vw; justify-content: center; min-height: 270px; padding: 60px 5vw; }
.signal i { color: var(--accent); }

.cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.cards article { border-right: 1px solid var(--line); border-top: 1px solid var(--line); min-height: 355px; padding: 62px 7vw 58px; }
.cards article:nth-child(even) { border-right: 0; }
.cards span, .numbered > article > span, .edition-list > a > span, .press-list > a > span { color: var(--accent); font-size: 12px; font-weight: 700; letter-spacing: .18em; }
.cards h2 { font-size: clamp(34px,3.2vw,52px); margin: 58px 0 20px; }
.cards p { color: #4e4c48; max-width: 530px; }
.cards article > a { border-bottom: 1px solid var(--accent); display: inline-block; font-size: 13px; margin-top: 24px; padding-bottom: 4px; text-transform: uppercase; }

.numbered { padding: 0 7vw 80px; }
.numbered article { align-items: start; border-top: 1px solid var(--line); display: grid; gap: 3vw; grid-template-columns: 70px minmax(240px,.85fr) minmax(280px,1fr); padding: 44px 0 48px; }
.numbered h2 { font-size: clamp(29px,3vw,47px); margin: 0; }
.numbered p { color: #4e4c48; margin: 4px 0 0; max-width: 620px; }
.statement { padding: clamp(100px,12vw,180px) 7vw; text-align: center; }
.statement h2 { font-size: clamp(50px,8vw,120px); margin: 40px auto 0; }
.statement em { color: var(--stone); }
.clean-list { border-top: 1px solid var(--line); list-style: none; margin: 55px 0 0; padding: 0; }
.clean-list li { border-bottom: 1px solid var(--line); font-family: var(--serif); font-size: clamp(23px,2.2vw,34px); padding: 22px 0; }

.metrics { display: grid; grid-template-columns: repeat(3,1fr); padding: 0 7vw 120px; }
.metrics > div { border-left: 1px solid var(--line); padding: 55px 3vw; }
.metrics strong { display: block; font-family: var(--serif); font-size: clamp(52px,7vw,100px); font-weight: 400; line-height: 1; }
.metrics span { color: var(--muted); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; }
.center-cta { padding: clamp(100px,12vw,175px) 7vw; text-align: center; }
.center-cta h2 { font-size: clamp(43px,6vw,92px); margin: 0 auto 45px; max-width: 960px; }
.profile { display: grid; gap: 6vw; grid-template-columns: minmax(170px,1fr) minmax(300px,2fr); padding: 100px 7vw 140px; }
.profile h2 { font-size: clamp(50px,7vw,105px); }
.profile div > p:last-child { color: #4e4c48; max-width: 710px; }

.edition-list > a, .press-list > a {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 2.5vw;
  padding: 42px 7vw;
  transition: background .2s ease;
}
.edition-list > a { grid-template-columns: 60px 1fr 1fr auto; }
.edition-list > a:hover, .press-list > a:hover { background: #edeae6; }
.edition-list strong { font-family: var(--serif); font-size: clamp(52px,7vw,98px); font-weight: 400; line-height: 1; }
.edition-list small, .press-list small { color: var(--muted); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.edition-list i, .press-list i { font-size: 12px; font-style: normal; letter-spacing: .11em; text-transform: uppercase; }
.year-hero { min-height: 610px; padding: clamp(110px,13vw,190px) 7vw 75px; }
.year-hero h1 { font-size: clamp(130px,23vw,350px); line-height: .72; margin: 55px 0 90px; }
.year-hero > div { border-top: 1px solid #454545; display: grid; grid-template-columns: repeat(3,1fr); }
.year-hero > div span { border-right: 1px solid #454545; font-size: 12px; letter-spacing: .12em; padding: 22px 15px 0 0; text-transform: uppercase; }
.source { background: var(--stone); color: var(--ink); padding: 85px 7vw 100px; }
.source > p:not(.label) { font-family: var(--serif); font-size: clamp(25px,3vw,43px); line-height: 1.25; max-width: 880px; }
.source > div { border-top: 1px solid rgba(9,9,9,.25); display: flex; flex-wrap: wrap; gap: 20px 40px; margin-top: 55px; padding-top: 28px; }
.source a { border-bottom: 1px solid var(--accent); font-size: 12px; letter-spacing: .1em; padding-bottom: 5px; text-transform: uppercase; }

.press-list > a { grid-template-columns: 60px 1fr auto; padding-bottom: 52px; padding-top: 52px; }
.press-list h2 { font-size: clamp(31px,3.5vw,55px); margin: 12px 0 0; }
.note { background: var(--paper); color: var(--muted); padding: 0 7vw 90px; }
.note p { border-top: 1px solid var(--line); font-size: 13px; margin: 0; max-width: 800px; padding-top: 24px; }

.post-index { padding: 0 7vw 100px; }
.post-index article { align-items: start; border-top: 1px solid var(--line); display: grid; gap: 3vw; grid-template-columns: 105px 1fr auto; padding: 45px 0 50px; }
.post-index article > span { color: var(--muted); font-size: 12px; letter-spacing: .12em; }
.post-index h2 { font-size: clamp(30px,3.4vw,52px); margin-bottom: 15px; }
.post-index p { color: #4e4c48; margin: 0; max-width: 750px; }
.nav-links { display: flex; gap: 10px; justify-content: center; padding: 40px 0; }
.nav-links .page-numbers { border: 1px solid var(--line); padding: 9px 14px; }
.nav-links .current { background: var(--ink); color: var(--white); }
.single-entry { background: var(--paper); color: var(--ink); min-height: 70vh; padding: clamp(100px,12vw,180px) 7vw; }
.single-entry > article { margin: auto; max-width: 980px; }
.single-entry h1 { font-size: clamp(52px,7vw,104px); margin-bottom: 65px; }
.single-entry .eyebrow { color: var(--muted); }
.entry-content { font-family: var(--serif); font-size: clamp(20px,1.8vw,27px); line-height: 1.6; max-width: 760px; }
.entry-content a { border-bottom: 1px solid var(--accent); }
.single-entry .text-link { margin-top: 55px; }
.article { min-height: 40vh; padding: 90px 7vw 120px; }

.home-moment {
  align-items: start;
  background-position: center;
  background-size: cover;
  display: flex;
  flex-direction: column;
  justify-content: end;
  min-height: 760px;
  padding: 80px 7vw;
}
.home-moment > p { font-size: 12px; font-weight: 700; letter-spacing: .2em; }
.home-moment h2 { font-size: clamp(50px,7vw,105px); margin: 10px 0 40px; }

.site-footer {
  border-top: 1px solid #333;
  display: grid;
  gap: 7vw;
  grid-template-columns: 1.2fr .8fr 1fr;
  padding: 75px 5vw 55px;
}
.site-footer p, .site-footer a { font-size: 13px; }
.site-footer > div:first-child p { color: #989894; margin-top: 20px; }
.site-footer nav { display: grid; gap: 9px; }
.site-footer nav a:hover, .footer-contact a:hover { color: var(--stone); }
.footer-contact { text-align: right; }
.footer-contact p { color: #777; margin-top: 28px; }

@media (max-width: 1050px) {
  .site-header { grid-template-columns: 1fr auto; }
  .site-header nav { display: none; }
  .page-hero { min-height: 560px; }
}

@media (max-width: 720px) {
  .site-header { min-height: 70px; padding: 0 20px; }
  .wordmark { font-size: 14px; }
  .nav-cta { font-size: 10px; }
  .home-hero { min-height: calc(100svh - 70px); padding: 70px 24px 100px; }
  .home-hero aside { bottom: 26px; flex-direction: column; gap: 6px; left: 24px; right: 24px; }
  .hero-actions { align-items: start; flex-direction: column; }
  .page-hero { min-height: 500px; padding: 100px 24px 65px; }
  .page-hero::after { left: 24px; }
  .page-hero .hero-copy { margin-top: 35px; }
  .split, .profile { grid-template-columns: 1fr; padding: 75px 24px 90px; }
  .signal { align-items: start; flex-direction: column; gap: 0; padding: 75px 24px; }
  .signal i { display: none; }
  .cards { grid-template-columns: 1fr; }
  .cards article { border-right: 0; min-height: 0; padding: 52px 24px 60px; }
  .cards h2 { margin-top: 38px; }
  .numbered { padding: 0 24px 60px; }
  .numbered article { gap: 18px; grid-template-columns: 42px 1fr; padding: 36px 0 40px; }
  .numbered article p { grid-column: 2; }
  .statement, .center-cta { padding: 90px 24px; }
  .metrics { grid-template-columns: 1fr; padding: 0 24px 80px; }
  .metrics > div { border-bottom: 1px solid var(--line); border-left: 0; padding: 40px 0; }
  .edition-list > a, .press-list > a { gap: 16px; grid-template-columns: 38px 1fr; padding: 34px 24px; }
  .edition-list small, .edition-list i, .press-list i { grid-column: 2; }
  .year-hero { min-height: 520px; padding: 100px 24px 65px; }
  .year-hero h1 { margin: 70px 0 75px; }
  .year-hero > div { grid-template-columns: 1fr; }
  .year-hero > div span { border-bottom: 1px solid #454545; border-right: 0; padding: 14px 0; }
  .source { padding: 70px 24px 85px; }
  .post-index { padding: 0 24px 80px; }
  .post-index article { gap: 16px; grid-template-columns: 1fr; }
  .post-index article .text-link { margin-top: 8px; }
  .single-entry { padding: 100px 24px; }
  .home-moment { min-height: 630px; padding: 65px 24px; }
  .site-footer { grid-template-columns: 1fr; padding: 60px 24px 45px; }
  .footer-contact { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}
