/* Variant E — Warm scientific journal.
   Dark hero, then cream paper with a display serif, a split panel (plate + flat field), Quanta-style
   eyebrow labels, a ruled paper list with mono dates. */
:root {
  --ground: #f6f1e8;
  --ink: #1d1a17;
  --muted: #6b645c;
  --rule: rgba(29, 26, 23, 0.16);
  --accent: #a8431f;            /* rust */
  --field: #a8431f;             /* the one saturated field */
  --band: #efe8db;
  --band-ink: #1d1a17;
  --band-muted: #6b645c;
  --band-accent: #a8431f;
  --nav-ink: #f6f1e8;
  --nav-bg: transparent;
  --hero-scrim: linear-gradient(90deg, rgba(23,21,19,0.78) 0%, rgba(23,21,19,0.35) 42%, rgba(23,21,19,0) 70%);
  --hero-accent: #e9c9b4;
  --hero-muted: rgba(246,241,232,0.85);
  --stop-align: center;

  --serif-display: "Newsreader", "Iowan Old Style", Georgia, serif;   /* Fraunces dropped: its quirky f and soft terminals distracted */
  --serif: "Source Serif 4", Georgia, serif;
  --sans: "Source Serif 4", Georgia, serif;      /* body is serif in this language */
  --mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --wordmark-font: 500 22px/1 var(--serif-display);
  --wordmark-tracking: -0.02em;
  --wordmark-case: none;
  --display-font: 400 clamp(44px, 6.2vw, 88px)/1.02 var(--serif-display);
  --display-tracking: -0.02em;
  --h2-font: 500 clamp(30px, 3.4vw, 46px)/1.08 var(--serif-display);
  --h2-tracking: -0.015em;
  --h3-font: 600 19px/1.3 var(--serif);
  --statement-font: 400 clamp(22px, 2.4vw, 32px)/1.35 var(--serif);
  --radius: 0px;
}
body { font-size: 17.5px; }
.wm-1 { font-weight: 600; } .wm-2 { font-weight: 400; font-style: italic; }
.nav-links a { font-family: var(--mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
.eyebrow { font-family: var(--mono); font-weight: 500; letter-spacing: 0.14em; }
.display em { font-style: italic; font-weight: 400; }
.stop .lede { font-size: clamp(18px, 1.7vw, 22px); }

/* split panel after the hero */
.split { display: grid; grid-template-columns: 1fr 1fr; min-height: 560px; }
.split-plate { background: #000; position: relative; margin: 0; min-height: 420px; }
.split-plate video, .split-plate img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.split-plate .split-still { display: none; }
.split-plate figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 28px 20px 12px; font: 500 11.5px/1.4 var(--mono); letter-spacing: 0.03em; color: rgba(246,241,232,0.82); background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0)); }
@media (prefers-reduced-motion: reduce) { .split-plate .split-still { display: block; } }
.split-field { background: var(--field); color: #fbf3ea; display: flex; flex-direction: column; justify-content: center; padding: 64px max(32px, 6vw); }
.split-field .eyebrow { color: #fbf3ea; opacity: 0.85; }
.split-text { font: 400 clamp(22px, 2.2vw, 30px)/1.35 var(--serif); max-width: 24em; }
.split-focus { margin-top: 24px; font-size: 17px; line-height: 1.5; opacity: 0.9; max-width: 36em; }
@media (max-width: 760px) { .split { grid-template-columns: 1fr; } .split-plate { aspect-ratio: 4 / 3; min-height: 0; } }

/* sections */
.section-head { margin-bottom: 40px; }
.section-lede { font-size: 19px; }

/* pillars: Quanta eyebrow system over image cards */
.pillar-grid { gap: 28px 24px; grid-template-columns: repeat(2, 1fr); }
.pillar { aspect-ratio: auto; background: transparent; color: var(--ink); }
.pillar video, .pillar img { aspect-ratio: 3 / 2; height: auto; opacity: 1; border-radius: 0; }
.pillar:hover video { transform: none; }
.pillar-text { position: static; padding: 16px 0 0; background: none; }
.pillar-num { font-family: var(--mono); color: var(--accent); }
.pillar h3 { font: 500 30px/1.1 var(--serif-display); letter-spacing: -0.01em; margin: 6px 0 8px; }
.pillar p { font-size: 17px; opacity: 1; color: var(--muted); }

/* resources on a slightly darker cream band */
.resources .section-lede { color: var(--band-muted); }
.resource h3 { font: 600 20px/1.25 var(--serif); }
.resource p { font-size: 15.5px; }
.resources .mono { color: var(--accent); }

/* papers: ruled list, mono dates, figure right */
.paper-grid { display: block; }
.paper { grid-template-columns: 1fr 200px; gap: 28px; padding: 22px 0; border-top: 1px solid var(--rule); }
.paper .paper-fig { order: 2; }
.paper-venue { color: var(--muted); }
.paper h3 { font: 500 24px/1.2 var(--serif-display); letter-spacing: -0.01em; }
.paper-authors { font-size: 15px; }
.tag { font-family: var(--mono); border-color: var(--rule); background: transparent; }
@media (max-width: 760px) { .paper { grid-template-columns: 1fr; } .paper .paper-fig { order: 0; } }

/* news: mono bylines */
.news-list li { grid-template-columns: 170px 1fr; }
.news-date { color: var(--accent); }
.news-body a { font-weight: 600; }

/* join on the band */
.join .button { border-color: var(--ink); color: var(--ink); }
.join .button:hover { background: var(--ink); color: var(--ground); }

/* research themes */
.themes .section-head { margin-bottom: 12px; }
.theme { padding: 44px 0; gap: 56px; }
.theme-q { font: 500 clamp(28px, 3vw, 40px)/1.1 var(--serif-display); letter-spacing: -0.012em; }
.theme-body { font-size: 18.5px; }
.theme-papers a { font-weight: 600; }

/* hiring */
.hiring-strip { background: var(--ink); }
.hiring-label { color: #e9a58a; }
.hiring-title { font: 500 21px/1.25 var(--serif-display); }
.nav-badge { background: var(--accent); }
.opening { background: var(--ground); border-color: var(--ink); }
.opening-title { font-family: var(--serif-display); font-weight: 500; }

/* portrait screens: the subject is centered in the portrait frames, so the text sits at the bottom */
@media (max-aspect-ratio: 4/5) {
  :root {
    --stop-align: end;
    --hero-scrim: linear-gradient(180deg, rgba(23,21,19,0.55) 0%, rgba(23,21,19,0) 22%, rgba(23,21,19,0) 48%, rgba(23,21,19,0.88) 78%);
  }
  .stop { padding-bottom: 9vh; }
  .display { font-size: clamp(34px, 9.5vw, 48px); }
  .display-2 { font-size: clamp(28px, 7.6vw, 40px); }
}

/* the nav floats over the hero without a blurred band */
.nav { backdrop-filter: none; -webkit-backdrop-filter: none; }