@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap");

:root {
  --ink: #082b45;
  --muted: #537083;
  --paper: #f4f2ed;
  --warm: #ecdfc8;
  --yellow: #f0b629;
  --aqua: #88d0ca;
  --line: rgba(8, 43, 69, 0.16);
  --sans: "DM Sans", Arial, sans-serif;
  --serif: "Playfair Display", Georgia, serif;
  --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

/* The paper sits on the root so it propagates to the canvas. That leaves a free
   layer between the canvas and the page content for the wallpaper below. */
html {
  scroll-behavior: smooth;
  background: var(--paper);
}

body {
  margin: 0;
  background: transparent;
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.5;
}

/* A fixed engraved plate of the research themes: phase transition bubbles,
   cosmic strings and walls, primordial black holes, halo density contours,
   chirps, a pulsar timing array, lensed rays and the horizon diagram. It is
   painted above the paper and below everything else, so sections with their own
   background mask it and open sections let it through. Because it is fixed, the
   page slides across the plate as you scroll. */
body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  background-image: url("cosmos-wallpaper.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  opacity: 1;
  pointer-events: none;
}

a { color: inherit; }

.skip-link {
  position: fixed;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 20;
  transform: translateY(-180%);
  border-radius: 0.2rem;
  background: var(--yellow);
  padding: 0.6rem 0.9rem;
  color: var(--ink);
  font-weight: 700;
}

.skip-link:focus { transform: translateY(0); }

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(1280px, calc(100% - 4rem));
  margin: 0 auto;
  min-height: 5.75rem;
}

.wordmark,
.site-header nav a,
.eyebrow,
.card-number,
.site-footer {
  font-family: var(--mono);
  font-size: 0.69rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  text-decoration: none;
  font-weight: 500;
}

.wordmark__dot {
  width: 0.62rem;
  height: 0.62rem;
  border-radius: 50%;
  background: var(--yellow);
}

.site-header nav { display: flex; gap: clamp(1rem, 3vw, 2.5rem); }

.site-header nav a,
.site-footer a {
  text-decoration: none;
  text-underline-offset: 0.35em;
}

.site-header nav a:hover,
.site-header nav a:focus-visible,
.site-footer a:hover,
.site-footer a:focus-visible { text-decoration: underline; }

.hero {
  display: grid;
  grid-template-columns: minmax(12rem, 0.38fr) minmax(0, 1fr);
  width: min(1280px, calc(100% - 4rem));
  min-height: min(720px, calc(100vh - 5.75rem));
  margin: 0 auto;
  border-top: 1px solid var(--line);
}

.hero__profile {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.25rem;
  padding: 2.5rem 0.85rem 2.5rem 0;
}

.hero__portrait {
  width: min(100%, 16rem);
  margin: 0;
}

.hero__portrait img {
  display: block;
  width: 100%;
  aspect-ratio: 0.82;
  border: 1px solid rgba(8, 43, 69, 0.25);
  object-fit: cover;
  object-position: center 27%;
  box-shadow: 0.65rem 0.65rem 0 var(--yellow);
}

.hero__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 4.5rem 2.75rem 4.5rem 0;
}

.eyebrow {
  margin: 0 0 1.2rem;
  color: var(--muted);
  font-weight: 500;
}

h1,
h2,
h3,
p { margin-top: 0; }

h1,
h2,
h3 { text-wrap: balance; }

h1,
h2 {
  font-family: var(--serif);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

h1 {
  max-width: 10ch;
  margin-bottom: 2rem;
  font-size: clamp(2.8rem, 5.4vw, 4.5rem);
}

.hero h1 {
  max-width: 12ch;
  margin-bottom: 1.65rem;
  font-size: clamp(2.7rem, 4vw, 4.25rem);
}

.hero__lede {
  max-width: 42rem;
  margin-bottom: 2.4rem;
  color: #23475e;
  font-size: clamp(1.06rem, 1.5vw, 1.25rem);
  line-height: 1.6;
}

.hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.25rem 1.8rem; }

.button {
  display: inline-block;
  border-radius: 99px;
  padding: 0.88rem 1.25rem;
  text-decoration: none;
  font-size: 0.93rem;
  font-weight: 700;
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.button--bright { background: var(--yellow); box-shadow: inset 0 0 0 1px rgba(8, 43, 69, 0.12); }
.button:hover { transform: translateY(-2px); box-shadow: 0 5px 0 var(--ink); }

.text-link {
  display: inline-flex;
  gap: 0.35rem;
  align-items: center;
  text-decoration: underline;
  text-decoration-color: var(--yellow);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.4em;
  font-size: 0.94rem;
  font-weight: 600;
}

.research__lede { grid-column: 2; max-width: 44rem; margin: 1.1rem 0 0; color: var(--muted); font-size: 1.06rem; line-height: 1.65; }

.einstein-quote, .pull-quote { padding: clamp(3rem, 6vw, 5rem) max(2rem, calc((100% - 1060px) / 2)); border-bottom: 1px solid var(--line); background: #f8f6f0; color: var(--ink); }
.einstein-quote__inner, .pull-quote__inner { display: grid; grid-template-columns: 3.5rem minmax(0, 45rem); align-items: start; gap: 1.2rem; max-width: 54rem; margin: 0 auto; }
.einstein-quote__mark, .pull-quote__mark { color: var(--yellow); font-family: var(--serif); font-size: 4.5rem; line-height: 0.72; }
.einstein-quote blockquote, .pull-quote blockquote { margin: 0; }
.einstein-quote blockquote p, .pull-quote blockquote p { margin: 0; color: #23475e; font-family: var(--serif); font-size: clamp(1.05rem, 1.5vw, 1.35rem); font-style: italic; line-height: 1.65; }
.einstein-quote blockquote p + p, .pull-quote blockquote p + p { margin-top: 0.85rem; }
.einstein-quote cite, .pull-quote cite { display: block; margin-top: 1rem; color: var(--muted); font-family: var(--mono); font-size: 0.64rem; font-style: normal; letter-spacing: 0.07em; text-transform: uppercase; }

.research { padding: clamp(5rem, 9vw, 8.5rem) max(2rem, calc((100% - 1280px) / 2)); }

.section-heading { display: grid; grid-template-columns: 0.55fr 1fr; align-items: baseline; margin-bottom: 3.7rem; }
.section-heading .eyebrow { margin: 0; }

h2 { margin-bottom: 0; font-size: clamp(2.4rem, 3.8vw, 3.6rem); }

.research-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }

.research-card {
  position: relative;
  display: flex;
  min-height: 23.5rem;
  flex-direction: column;
  overflow: hidden;
  padding: 1.65rem;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #faf9f5;
}

.research-card--black-hole { background: #163f58; color: #fff; }
.research-card--matter { background: var(--aqua); }
.card-number { color: var(--muted); }
.research-card--black-hole .card-number { color: #bdd4d2; }

.research-card h3 {
  max-width: 13ch;
  margin: auto 0 1rem;
  font-family: var(--serif);
  font-size: clamp(1.85rem, 2.5vw, 2.5rem);
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 1;
}

.research-card p { max-width: 29ch; margin: 0; font-size: 0.96rem; line-height: 1.58; }

.card-mark {
  position: absolute;
  right: 1.4rem;
  top: 1rem;
  color: var(--yellow);
  font-family: var(--serif);
  font-size: 3.2rem;
  line-height: 1;
}

.research-card--matter .card-mark { color: var(--ink); }

.research-bridge { display: grid; grid-template-columns: minmax(12rem, 0.55fr) minmax(0, 1fr); align-items: center; gap: 2rem; margin-top: 2.2rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.research-bridge__label { color: var(--muted); font-family: var(--mono); font-size: 0.63rem; letter-spacing: 0.07em; text-transform: uppercase; }
.research-bridge p { max-width: 34rem; margin: 0; color: var(--muted); font-size: 0.96rem; line-height: 1.5; }

.research-map {
  padding: clamp(5rem, 9vw, 8.5rem) max(2rem, calc((100% - 1280px) / 2));
  background: #102f45;
  color: #fff;
}

.section-heading--map { margin-bottom: 3rem; }
.research-map .eyebrow { color: var(--aqua); }
.research-map h2 { max-width: 12ch; }

.publication-topic {
  font-family: var(--mono);
  font-size: 0.67rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; margin: -1px; padding: 0; border: 0; clip: rect(0 0 0 0); white-space: nowrap; }
.network-instruction { max-width: 38rem; margin: -1.2rem 0 2rem auto; color: #c9d8d9; font-size: 0.95rem; }
.research-network { margin: 0; }

.network-canvas {
  position: relative;
  min-height: 109rem;
  overflow: hidden;
  border: 1px solid rgba(136, 208, 202, 0.32);
  background:
    radial-gradient(circle at 50% 34%, rgba(240, 182, 41, 0.11), transparent 23%),
    linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px);
  background-size: auto, 3rem 3rem, 3rem 3rem;
}

.network-node { position: absolute; z-index: 2; color: #fff; text-align: center; }
a.network-node { text-decoration: none; transition: box-shadow 160ms ease, transform 160ms ease; }
a.network-node:hover,
a.network-node:focus-visible { box-shadow: 0 0 0 3px var(--yellow); transform: translateY(-3px); }
.network-node__primary { display: block; color: inherit; text-decoration: none; }
.network-node__primary:hover strong,
.network-node__primary:focus-visible strong { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 0.18em; }
.network-node strong { display: block; font-family: var(--serif); font-size: clamp(1.1rem, 1.8vw, 1.75rem); font-weight: 500; letter-spacing: -0.035em; line-height: 1.08; }
.network-node small { display: block; margin-top: 0.65rem; font-family: var(--mono); font-size: 0.57rem; letter-spacing: 0.045em; line-height: 1.45; text-transform: uppercase; }
.network-kicker { display: block; margin-bottom: 0.65rem; color: var(--yellow); font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.09em; text-transform: uppercase; }
.network-subfields { display: grid; justify-items: center; gap: 0.35rem; margin-top: 0.72rem; }
.network-subfields a { display: inline-block; max-width: 100%; border-bottom: 1px solid currentColor; color: inherit; font-family: var(--mono); font-size: 0.55rem; letter-spacing: 0.045em; line-height: 1.3; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.network-subfields a:hover,
.network-subfields a:focus-visible { border-bottom-color: var(--ink); color: var(--ink); }

.network-node--circle { display: grid; width: 9.5rem; aspect-ratio: 1; place-content: center; border: 1px solid rgba(195, 217, 217, 0.48); border-radius: 50%; color: #d6e3e3; font-family: var(--serif); font-size: 1.3rem; line-height: 1.08; }
.network-node--qft { top: 2.4rem; left: 9%; }
.network-node--gr { top: 2.4rem; right: 9%; }

.network-node--foundation { top: 2.8rem; left: 34%; width: 32%; min-height: 9.2rem; padding: 1.25rem 1.5rem; border: 1px solid rgba(195, 217, 217, 0.42); background: rgba(6, 31, 50, 0.85); }
.network-node--foundation strong { font-size: clamp(1.25rem, 2vw, 2rem); }

.network-node--side { top: 18.2rem; display: flex; width: 23%; min-height: 12rem; flex-direction: column; align-items: center; justify-content: center; padding: 1.35rem; border: 1px solid rgba(8, 43, 69, 0.14); color: var(--ink); }
.network-node--production { left: 2.5%; background: var(--yellow); }
.network-node--eras { right: 2.5%; background: var(--aqua); }
.network-node--side .network-kicker { color: rgba(8, 43, 69, 0.65); }

.network-node--question { top: 16.8rem; left: 34%; width: 32%; min-height: 12.2rem; padding: 1.45rem 1.6rem; border: 2px solid var(--yellow); background: #f4f2ed; color: var(--ink); }
.network-node--question .network-kicker { color: #9b6a00; }
.network-node--question strong { font-size: clamp(1.5rem, 2.35vw, 2.45rem); line-height: 1.04; }

.network-node--mechanism { top: 33.5rem; display: grid; width: 17%; min-height: 9.8rem; align-content: center; padding: 1rem 0.5rem; border: 1px solid rgba(195, 217, 217, 0.32); background: #153b53; }
.network-node--mechanism strong { font-size: clamp(1rem, 1.6vw, 1.5rem); line-height: 1.04; }
.network-node--mechanism::after { position: absolute; top: 100%; left: 50%; width: 1px; height: 5rem; background: rgba(136, 208, 202, 0.7); content: ""; }
.network-node--mechanism::before { position: absolute; top: calc(100% + 4.65rem); left: calc(50% - 4px); z-index: 1; border-top: 7px solid rgba(136, 208, 202, 0.82); border-right: 4px solid transparent; border-left: 4px solid transparent; content: ""; }
.network-node--transition { left: 15%; }
.network-node--inflation { left: 34%; }
.network-node--walls { left: 53%; }
.network-node--strings { left: 72%; }
.network-symbol { display: block; min-height: 2.7rem; margin-bottom: 0.5rem; color: var(--aqua); font-family: var(--serif); font-size: 2.25rem; letter-spacing: -0.18em; line-height: 1; }
.network-symbol--bubbles { position: relative; width: 3.25rem; height: 2.7rem; min-height: 2.7rem; margin-right: auto; margin-left: auto; color: var(--aqua); font-size: 0; letter-spacing: 0; }
.network-symbol--bubbles span { position: absolute; width: 0.92rem; height: 0.92rem; border: 2px solid currentColor; border-radius: 50%; }
.network-symbol--bubbles span:nth-child(1) { top: 0.78rem; left: 0.38rem; width: 1.08rem; height: 1.08rem; transform: rotate(-9deg); }
.network-symbol--bubbles span:nth-child(2) { top: 0.53rem; left: 1.24rem; width: 0.9rem; height: 0.9rem; transform: rotate(13deg); }
.network-symbol--bubbles span:nth-child(3) { top: 1.07rem; left: 1.69rem; width: 1.02rem; height: 1.02rem; transform: rotate(-17deg); }
.network-symbol--bubbles span:nth-child(4) { top: 0.12rem; left: 1.02rem; width: 0.72rem; height: 0.72rem; transform: rotate(8deg); }
.network-node--walls .network-symbol,
.network-node--strings .network-symbol { color: var(--yellow); }
.network-symbol--string-loop { width: 3.25rem; height: 2.7rem; min-height: 2.7rem; margin-right: auto; margin-left: auto; color: var(--yellow); overflow: visible; transform: rotate(-12deg); }
.network-symbol--string-loop path { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 4; vector-effect: non-scaling-stroke; }

.network-node--bridge { top: 49.5rem; left: 14%; width: 75%; padding: 0.8rem 1rem; border-top: 1px solid rgba(136, 208, 202, 0.65); border-bottom: 1px solid rgba(136, 208, 202, 0.65); color: var(--aqua); font-family: var(--mono); font-size: 0.73rem; letter-spacing: 0.12em; text-transform: uppercase; }
.network-node--observatories { top: 69.7rem; left: 16%; width: 68%; }
.network-node--astrophysics { top: 94.7rem; left: 14%; width: 75%; }

.network-node--outcome { top: 54rem; display: grid; width: 19%; min-height: 7.7rem; align-content: center; padding: 0.7rem; border: 1px solid rgba(195, 217, 217, 0.3); background: rgba(6, 31, 50, 0.78); }
.network-node--pbh,
.network-node--curvature,
.network-node--gw { min-height: 10.2rem; }
.network-node--outcome strong { font-size: clamp(1.12rem, 1.6vw, 1.55rem); line-height: 1.04; }
.network-node--outcome .network-subfields { margin-top: 0.5rem; }
.network-node--outcome .network-subfields a { color: var(--yellow); }
.network-node--outcome .network-subfields a:hover,
.network-node--outcome .network-subfields a:focus-visible { border-bottom-color: #fff; color: #fff; }
.network-node--pbh { top: 54rem; left: 12%; width: 24%; }
.network-node--smbh { top: 100rem; left: 38%; width: 24%; }
.network-node--smbh strong { font-size: clamp(1.05rem, 1.5vw, 1.45rem); }
.network-node--curvature { left: 45.5%; width: 20%; }
.network-node--gw { left: 75%; width: 20%; }
.network-node--outcome .network-symbol { min-height: 1.5rem; font-size: 1.55rem; }
.network-node--outcome .network-symbol--gw { position: relative; width: 4.2rem; height: 3rem; min-height: 3rem; margin: 0 auto 0.5rem; color: var(--aqua); font-size: 0; letter-spacing: 0; }
.network-symbol--gw .gw-polarization { position: absolute; top: 50%; left: 50%; width: 3.7rem; height: 1.25rem; border: 2px solid currentColor; border-radius: 50%; transform-origin: center; }
.network-symbol--gw .gw-polarization--horizontal { transform: translate(-50%, -50%); }
.network-symbol--gw .gw-polarization--vertical { opacity: 0.78; transform: translate(-50%, -50%) rotate(90deg); }
.network-node--detector { top: 73.5rem; display: grid; width: 23%; min-height: 9rem; align-content: center; padding: 0.9rem 0.75rem; border: 1px solid rgba(8, 43, 69, 0.2); color: var(--ink); }
.network-node--detector strong { font-size: clamp(1.05rem, 1.55vw, 1.5rem); line-height: 1.04; }
.network-node--moon { top: 84rem; left: 75%; background: #d9f2ef; }
.network-node--pta { left: 75%; background: #f8e7b4; }
.network-node--ligo { left: 51%; background: #f4f2ed; }
.network-node--lensing { left: 26%; background: #e7e3ef; }
.network-node--telescopes { top: 73.5rem; left: 1%; background: #f3dfc2; }
.network-node--detector small { display: block; margin-top: 0.5rem; color: #537083; font-family: var(--mono); font-size: 0.55rem; letter-spacing: 0.06em; line-height: 1.3; text-transform: uppercase; }
.network-symbol--pbh { width: 1.7rem; min-height: 1.7rem !important; margin: 0 auto 0.7rem; border-radius: 50%; background: linear-gradient(135deg, #f4f2ed, #05080b 72%); }
.network-symbol--smbhb { position: relative; width: 4.9rem; height: 3rem; min-height: 3rem; margin: 0 auto 0.5rem; color: var(--aqua); font-size: 0; letter-spacing: 0; }
.network-symbol--smbhb .smbhb__disk { position: absolute; top: 0.97rem; z-index: 1; width: 2.15rem; height: 0.82rem; border: 2px solid currentColor; border-radius: 50%; box-shadow: 0 0 0.35rem currentColor; }
.network-symbol--smbhb .smbhb__disk::after { position: absolute; inset: 0.16rem 0.28rem; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; border-radius: 50%; content: ""; opacity: 0.82; }
.network-symbol--smbhb .smbhb__disk--one { left: 0.15rem; color: var(--yellow); transform: rotate(-16deg); }
.network-symbol--smbhb .smbhb__disk--two { right: 0.15rem; color: var(--aqua); transform: rotate(17deg); }
.network-symbol--smbhb .smbhb__hole { position: absolute; top: 0.91rem; z-index: 2; width: 1.05rem; height: 1.05rem; border: 1px solid rgba(244, 242, 237, 0.48); border-radius: 50%; background: #020509; box-shadow: 0 0 0.5rem rgba(2, 5, 9, 0.9); }
.network-symbol--smbhb .smbhb__hole--one { left: 0.79rem; }
.network-symbol--smbhb .smbhb__hole--two { right: 0.79rem; }

.network-symbol--earth-moon { position: relative; width: 4.6rem; height: 3rem; min-height: 3rem; margin: 0 auto 0.5rem; color: #2d6d75; font-size: 0; letter-spacing: 0; filter: drop-shadow(0 0 0.25rem rgba(45, 109, 117, 0.18)); }
.earth-moon__orbit { position: absolute; inset: 0.2rem 0.15rem; border: 1.4px dashed currentColor; border-radius: 50%; opacity: 0.82; transform: rotate(-18deg); }
.earth-moon__satellite { position: absolute; top: 1.92rem; right: 0.13rem; z-index: 2; width: 0.32rem; height: 0.32rem; border: 1px solid #2d6d75; border-radius: 50%; background: var(--yellow); box-shadow: 0 0 0 0.11rem rgba(240, 182, 41, 0.25); }
.earth-moon__earth { position: absolute; top: 0.87rem; left: 1.53rem; width: 1.2rem; aspect-ratio: 1; border: 1px solid rgba(8, 43, 69, 0.25); border-radius: 50%; background: radial-gradient(circle at 32% 28%, #fff 0 8%, #a8e2da 28%, #3d8d94 63%, #21616d 100%); box-shadow: 0 0 0 0.2rem rgba(136, 208, 202, 0.15), 0 0 0.4rem rgba(45, 109, 117, 0.25); }
.earth-moon__moon { position: absolute; top: -0.08rem; left: 2.04rem; z-index: 3; width: 0.52rem; aspect-ratio: 1; border: 1px solid rgba(8, 43, 69, 0.28); border-radius: 50%; background: radial-gradient(circle at 34% 30%, #fff 0 12%, #f4f2ed 45%, #c3d1d4 100%); box-shadow: 0 0 0 0.13rem rgba(240, 182, 41, 0.22), 0 0 0.3rem rgba(8, 43, 69, 0.18); }

.network-symbol--pta { width: 4.8rem; height: 3.15rem; min-height: 3.15rem; margin: 0 auto 0.5rem; color: #1685c5; overflow: visible; filter: drop-shadow(0 0 0.25rem rgba(22, 133, 197, 0.2)); }
.network-symbol--pta .pta-beams { fill: currentColor; opacity: 0.74; }
.network-symbol--pta .pta-pulsars { fill: #e8f7f3; stroke: currentColor; stroke-width: 1.8; }
.network-symbol--pta .pta-pulsars circle { filter: drop-shadow(0 0 0.14rem rgba(22, 133, 197, 0.38)); }
.network-symbol--pta .pta-signals { fill: none; stroke: #5bb8e8; stroke-linecap: round; stroke-width: 1.8; opacity: 0.92; }

.network-symbol--ligo { width: 4.6rem; height: 3rem; min-height: 3rem; margin: 0 auto 0.5rem; color: #188d86; overflow: visible; filter: drop-shadow(0 0 0.25rem rgba(24, 141, 134, 0.2)); }
.network-symbol--ligo .ligo-arms { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; }
.network-symbol--ligo .ligo-test-masses { fill: #f4f2ed; stroke: currentColor; stroke-width: 1.6; }
.network-symbol--ligo .ligo-beamsplitter { fill: var(--yellow); stroke: currentColor; stroke-width: 2; }

.network-symbol--lensing { width: 4.8rem; height: 3rem; min-height: 3rem; margin: 0 auto 0.5rem; color: #6a6e93; overflow: visible; filter: drop-shadow(0 0 0.25rem rgba(106, 110, 147, 0.2)); }
.network-symbol--lensing .lensing-rays { fill: none; stroke: currentColor; stroke-linecap: round; stroke-width: 2.2; }
.network-symbol--lensing .lensing-source { fill: var(--yellow); stroke: rgba(8, 43, 69, 0.22); stroke-width: 1; filter: drop-shadow(0 0 0.2rem rgba(240, 182, 41, 0.42)); }
.network-symbol--lensing .lensing-lens { fill: currentColor; stroke: rgba(8, 43, 69, 0.25); stroke-width: 1; filter: drop-shadow(0 0 0.18rem rgba(106, 110, 147, 0.46)); }
.network-symbol--lensing .lensing-telescope { fill: #082b45; stroke: #082b45; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }

.network-symbol--telescopes { width: 5rem; height: 3.2rem; min-height: 3.2rem; margin: 0 auto 0.5rem; overflow: visible; filter: drop-shadow(0 0 0.25rem rgba(8, 43, 69, 0.18)); }
.network-symbol--telescopes .telescopes-signal { fill: none; stroke-linecap: round; stroke-width: 2.2; opacity: 0.9; }
.network-symbol--telescopes .telescopes-signal--orange { stroke: #d88122; }
.network-symbol--telescopes .telescopes-signal--green { stroke: #2b9b83; }
.network-symbol--telescopes .telescopes-scope,
.network-symbol--telescopes .telescopes-person { fill: #082b45; stroke: #082b45; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.network-symbol--telescopes .telescopes-tube { fill: #1a6173; stroke: #082b45; stroke-width: 2; }
.network-symbol--telescopes .telescopes-eyepiece { fill: var(--yellow); stroke: #082b45; stroke-width: 2; }
.network-symbol--telescopes .telescopes-tripod { fill: none; stroke: #082b45; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.6; }
.network-symbol--telescopes .telescopes-tripod rect { fill: #082b45; stroke: none; }

.network-edge { --edge-color: rgba(136, 208, 202, 0.72); position: absolute; z-index: 1; width: 8rem; height: 1px; background: var(--edge-color); transform-origin: left center; }
.network-edge::after { position: absolute; top: -4px; right: -1px; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 7px solid var(--edge-color); content: ""; }
.network-edge--foundation { top: 12rem; left: 50%; width: 4.8rem; transform: rotate(90deg); }
.network-edge--qft-to-question { top: 11.6rem; left: 16.5%; width: 14rem; transform: rotate(22deg); }
.network-edge--gr { top: 11.5rem; left: 82.5%; width: 14rem; transform: rotate(157deg); }
.network-edge--production { top: 23rem; left: 34%; width: 8.5%; transform: rotate(180deg); }
.network-edge--eras { top: 23rem; left: 66%; width: 8.5%; }
.network-edge--transition { top: 28.9rem; left: 49%; width: 25%; transform: rotate(161deg); }
.network-edge--inflation { top: 28.9rem; left: 49%; width: 10%; transform: rotate(125deg); }
.network-edge--walls { top: 28.9rem; left: 51%; width: 12%; transform: rotate(49deg); }
.network-edge--strings { top: 28.9rem; left: 51%; width: 28%; transform: rotate(18deg); }
.network-edge--to-pbh { top: 52.1rem; left: 24%; width: 2.2rem; transform: rotate(90deg); }
.network-edge--to-curvature { top: 52.1rem; left: 55.5%; width: 2.2rem; transform: rotate(90deg); }
.network-edge--to-gw { top: 52.1rem; left: 85%; width: 2.2rem; transform: rotate(90deg); }
.network-edge--curvature-to-pbh { top: 57.85rem; left: 46%; width: 9.75%; transform: rotate(180deg); }
.network-edge--curvature-to-gw { top: 57.85rem; left: 65%; width: 10.15%; }
.network-edge--gw-to-moon { top: 64.2rem; left: 94.5%; width: 19.9rem; transform: rotate(84deg); }
.network-edge--gw-to-pta { top: 63.1rem; left: 85%; width: 10.4rem; transform: rotate(90deg); }
.network-edge--smbh-to-pta { top: 100rem; left: 50%; width: 33rem; transform: rotate(-32deg); }
.network-edge--smbh-to-moon { top: 100rem; left: 50%; width: 30rem; transform: rotate(-14deg); }
.network-edge--pbh-to-ligo { top: 64rem; left: 35.5%; width: 27%; transform: rotate(26deg); }
.network-edge--curvature-to-lensing { top: 63.1rem; left: 46%; width: 20.1rem; transform: rotate(148.7deg); }
.network-edge--production-to-telescopes { top: 30.2rem; left: 14%; width: 43rem; transform: rotate(92deg); }
.network-edge--curvature-to-telescopes { top: 64.2rem; left: 55.5%; width: 33.8%; transform: rotate(158.6deg); }

.map-keywords { display: grid; grid-template-columns: minmax(15rem, 0.52fr) 1.48fr; gap: 2rem; margin-top: 4.25rem; padding-top: 2.35rem; border-top: 1px solid rgba(136, 208, 202, 0.38); }
.map-keywords__intro .eyebrow { margin-bottom: 0.75rem; }
.map-keywords h3 { max-width: 11ch; margin: 0; font-family: var(--serif); font-size: clamp(1.75rem, 2.5vw, 2.5rem); font-weight: 500; letter-spacing: -0.045em; line-height: 1; }
.map-keywords__list { display: flex; align-content: flex-start; flex-wrap: wrap; gap: 0.6rem; }
.map-keyword { display: inline-flex; align-items: center; min-height: 2.25rem; padding: 0.45rem 0.7rem; border: 1px solid rgba(195, 217, 217, 0.45); color: #fff; font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.045em; line-height: 1.2; text-decoration: none; text-transform: uppercase; transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease; }
.map-keyword:hover,
.map-keyword:focus-visible { box-shadow: 0 0 0 2px #fff; transform: translateY(-2px); }
.map-keyword--foundation { border-color: rgba(240, 182, 41, 0.78); background: rgba(240, 182, 41, 0.15); }
.map-keyword--production { border-color: rgba(240, 182, 41, 0.78); color: #ffde87; }
.map-keyword--dynamics { border-color: rgba(136, 208, 202, 0.8); color: #c4efeb; }
.map-keyword--fossils { border-color: rgba(244, 242, 237, 0.72); }
.map-keyword--observables { border-color: rgba(136, 208, 202, 0.8); background: rgba(136, 208, 202, 0.15); color: #d5f3f0; }

.publications { padding: clamp(5rem, 9vw, 8.5rem) max(2rem, calc((100% - 1280px) / 2)); background: #ebe8e0; }
.publications__intro { max-width: 48rem; margin: -1.5rem 0 2.4rem; color: var(--muted); font-size: 1.05rem; }
.publication-filter { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0.45rem; margin: -1rem 0 1.65rem; padding: 0.65rem 0.8rem; background: var(--ink); color: #fff; font-family: var(--mono); font-size: 0.67rem; letter-spacing: 0.04em; line-height: 1.45; text-transform: uppercase; }
.publication-filter a { color: var(--yellow); text-underline-offset: 0.28em; }
.publication-empty { margin: -0.55rem 0 1.65rem; color: #9b2f2f; font-family: var(--serif); font-size: 1.35rem; }

.paper-matrix-wrap { max-width: 66rem; border: 1px solid var(--ink); background: #f8f6f0; box-shadow: 0.7rem 0.7rem 0 var(--yellow); }
.paper-matrix { width: 100%; border-collapse: collapse; table-layout: auto; }
.paper-matrix th,
.paper-matrix td { border-right: 1px solid rgba(8, 43, 69, 0.2); border-bottom: 1px solid rgba(8, 43, 69, 0.22); }
.paper-matrix tr > :last-child { border-right: 0; }
.paper-matrix tbody tr:last-child > * { border-bottom: 0; }
.paper-matrix thead th { padding: 1.05rem 0.8rem; color: var(--ink); font-family: var(--mono); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.06em; text-align: left; text-transform: uppercase; }
.paper-matrix__year { width: 5.3rem; }
.paper-matrix__paper { width: auto; }

.paper-row { background: #f8f6f0; transition: background 150ms ease; }
.paper-row:nth-child(even) { background: #f0eee8; }
.paper-row:hover { background: #fff; }
.paper-year { padding: 1rem 0.8rem; color: var(--muted); font-family: var(--mono); font-size: 0.67rem; letter-spacing: 0.06em; vertical-align: top; text-transform: uppercase; }
.paper-title { padding: 0; font-weight: 400; text-align: left; }
.paper-title > a { display: block; padding: 0.85rem 1rem 0.35rem; color: var(--ink); font-family: var(--serif); font-size: 1rem; line-height: 1.25; text-decoration: none; }
.paper-title > a span { display: block; margin-top: 0.35rem; color: var(--muted); font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.05em; text-transform: uppercase; }
.paper-title > a:hover,
.paper-title > a:focus-visible { background: rgba(248, 208, 92, 0.25); }
.paper-title > a:hover span,
.paper-title > a:focus-visible span { color: var(--ink); text-decoration: underline; text-decoration-color: var(--yellow); text-underline-offset: 0.25em; }
.paper-authors { margin: 0; padding: 0.25rem 1rem 0.15rem; color: var(--muted); font-family: var(--serif); font-size: 0.79rem; line-height: 1.45; }
.paper-authors__label { margin-right: 0.22rem; color: var(--ink); font-family: var(--mono); font-size: 0.53rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.paper-author--self { color: var(--ink); font-weight: 700; }
.paper-tags { display: flex; flex-wrap: wrap; gap: 0.32rem; padding: 0.3rem 1rem 0.85rem; }
.paper-tag { display: inline-flex; align-items: center; min-height: 1.5rem; padding: 0.22rem 0.38rem; border: 1px solid var(--line); color: var(--ink); font-family: var(--mono); font-size: 0.53rem; letter-spacing: 0.035em; line-height: 1.1; text-decoration: none; text-transform: uppercase; transition: box-shadow 150ms ease, transform 150ms ease; }
.paper-tag:hover,
.paper-tag:focus-visible { box-shadow: 0 0 0 2px var(--ink); transform: translateY(-1px); }
.paper-tag--foundation { border-color: #947100; background: #fff7d9; }
.paper-tag--production { border-color: #b87b00; background: #fff0bf; }
.paper-tag--dynamics { border-color: #6f9ca3; background: #e0eff1; }
.paper-tag--fossils { border-color: var(--ink); background: #e0e8e8; }
.paper-tag--observables { border-color: #5faaa4; background: #d9f2ef; }

.paper-matrix-source { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 2.1rem; }
.paper-matrix-source p { margin: 0; color: var(--muted); font-family: var(--mono); font-size: 0.67rem; letter-spacing: 0.05em; text-transform: uppercase; }
.paper-matrix-source .button { flex: 0 0 auto; }

.textbook {
  padding: clamp(5rem, 9vw, 8.5rem) max(2rem, calc((100% - 1280px) / 2));
  background: var(--warm);
}

.textbook__heading {
  display: grid;
  grid-template-columns: 0.55fr 1fr;
  align-items: end;
  gap: 2rem;
  margin-bottom: 3.7rem;
}

.textbook__heading .eyebrow { align-self: start; margin: 0; }
.textbook__heading h2 { max-width: 14ch; margin: 0 0 1rem; }
.textbook__subtitle { max-width: 40rem; margin: 0; color: var(--muted); font-size: 1.08rem; line-height: 1.6; }

.textbook__layout {
  display: grid;
  grid-template-columns: minmax(12rem, 0.42fr) minmax(0, 1.58fr);
  align-items: start;
  gap: clamp(2.5rem, 7vw, 7rem);
  max-width: 1100px;
}

.textbook__cover { width: min(100%, 20rem); margin: 0; }
.textbook__cover-frame { padding: 0; background: transparent; box-shadow: none; }
.textbook__cover img { display: block; width: 100%; height: auto; }
.textbook__cover figcaption { margin-top: 1.35rem; color: var(--muted); font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.06em; line-height: 1.5; text-transform: uppercase; }

.textbook__content { max-width: 48rem; }
.textbook__content > p { max-width: 44rem; margin: 0 0 1.35rem; font-size: 1.1rem; line-height: 1.7; }
.textbook__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem 1.6rem; margin: 2.3rem 0 2.6rem; }
.textbook__actions .text-link { font-size: 0.9rem; }

.textbook__details { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(8, 43, 69, 0.25); border-bottom: 1px solid rgba(8, 43, 69, 0.25); }
.textbook__details div { display: grid; gap: 0.35rem; padding: 1rem 1rem 1rem 0; border-right: 1px solid rgba(8, 43, 69, 0.18); }
.textbook__details div + div { padding-left: 1rem; }
.textbook__details div:last-child { border-right: 0; }
.textbook__details span,
.textbook__topics > span { color: var(--muted); font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.07em; text-transform: uppercase; }
.textbook__details strong { font-family: var(--serif); font-size: 1rem; font-weight: 500; line-height: 1.15; }

.textbook__topics { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.7rem; }
.textbook__topics > span { margin-right: 0.35rem; }
.textbook__topics a { display: inline-flex; min-height: 2rem; align-items: center; border: 1px solid rgba(8, 43, 69, 0.3); padding: 0.35rem 0.6rem; color: var(--ink); font-family: var(--mono); font-size: 0.59rem; letter-spacing: 0.04em; text-decoration: none; text-transform: uppercase; transition: background 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.textbook__topics a:hover,
.textbook__topics a:focus-visible { background: var(--yellow); box-shadow: 0 0 0 2px var(--ink); transform: translateY(-2px); }

.outreach { padding: clamp(5rem, 9vw, 8.5rem) max(2rem, calc((100% - 1280px) / 2)); background: #102f45; color: #fff; }
.outreach__heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.72fr); align-items: end; gap: 3rem; margin-bottom: 3.7rem; }
.outreach .eyebrow { color: var(--aqua); }
.outreach h2 { max-width: 11ch; }
.outreach__lede { max-width: 31rem; margin: 0; color: #c9d8d9; font-size: 1.06rem; line-height: 1.65; }
.peace-note { display: grid; grid-template-columns: minmax(9rem, 0.3fr) minmax(0, 1fr); gap: 2rem; width: min(1280px, 100% - 4rem); margin: 0 auto 3.7rem; padding: clamp(1.6rem, 3vw, 2.4rem); border: 1px solid var(--line); border-left: 0.35rem solid var(--ink); background: var(--warm); color: var(--ink); }
.peace-note__label { color: var(--ink); font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.08em; text-transform: uppercase; }
.peace-note__body { max-width: 56rem; }
.peace-note h2 { max-width: 16ch; margin: 0 0 0.8rem; font-family: var(--serif); font-size: clamp(1.55rem, 2.5vw, 2.35rem); font-weight: 500; letter-spacing: -0.045em; line-height: 1; }
.peace-note p { max-width: 52rem; margin: 0; color: var(--ink); font-size: 0.94rem; line-height: 1.65; }
.peace-note p + p { margin-top: 0.9rem; }
.peace-note p a { text-decoration-color: var(--yellow); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.note-coda { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr); align-items: start; gap: 0.9rem; margin-top: 1.9rem; padding-top: 1.5rem; border-top: 1px solid rgba(8, 43, 69, 0.22); }
.note-coda__mark { color: #b08428; font-family: var(--serif); font-size: 3rem; line-height: 0.68; }
.note-coda blockquote { max-width: 50rem; margin: 0; }
.note-coda blockquote p { margin: 0; color: #23475e; font-family: var(--serif); font-size: clamp(0.92rem, 1.15vw, 1.06rem); font-style: italic; line-height: 1.55; }
.note-coda cite { display: block; margin-top: 0.8rem; color: rgba(8, 43, 69, 0.78); font-family: var(--mono); font-size: 0.6rem; font-style: normal; letter-spacing: 0.07em; text-transform: uppercase; }

/* Kept on solid paper: this is the longest stretch of body copy on the page,
   and the wallpaper behind five paragraphs makes for tiring reading. */
.sesame { padding: clamp(4rem, 7vw, 6.5rem) max(2rem, calc((100% - 1280px) / 2)); background: var(--paper); }
.sesame__heading { display: grid; grid-template-columns: 0.55fr 1fr; align-items: baseline; gap: 2rem; margin-bottom: 2.8rem; }
.sesame__heading .eyebrow { margin: 0 0 0.7rem; }
.sesame h2 { max-width: 14ch; margin: 0; font-family: var(--serif); font-size: clamp(1.8rem, 3vw, 2.9rem); font-weight: 500; letter-spacing: -0.045em; line-height: 1; }
.sesame__lede { max-width: 32rem; margin: 0; color: var(--muted); font-size: 1.06rem; line-height: 1.65; }
.sesame__body { max-width: 52rem; }
.sesame__body p { margin: 0; color: var(--ink); font-size: 0.97rem; line-height: 1.7; }
.sesame__body p + p { margin-top: 1rem; }

.quote-band { display: grid; grid-template-columns: minmax(0, 1fr); margin-top: 3.2rem; border-top: 1px solid var(--line); }
.quote-card { padding-top: 2rem; }
.quote-card--wide { grid-column: 1 / -1; }
.quote-card__figure { max-width: 58rem; margin: 0 0 1.9rem; }
.quote-card__figure img { display: block; width: 100%; height: auto; border: 1px solid var(--line); }
.quote-card--wide blockquote { max-width: 58rem; }
.quote-card--wide blockquote p { font-size: clamp(1rem, 1.3vw, 1.2rem); }
.quote-card__mark { display: block; margin-bottom: 0.5rem; color: var(--yellow); font-family: var(--serif); font-size: 3rem; line-height: 0.6; }
.quote-card blockquote { margin: 0; }
.quote-card blockquote p { margin: 0; color: #23475e; font-family: var(--serif); font-size: clamp(0.95rem, 1.15vw, 1.1rem); font-style: italic; line-height: 1.5; }
.quote-card blockquote p + p { margin-top: 0.75rem; }
.quote-card cite { display: block; margin-top: 0.9rem; color: var(--muted); font-family: var(--mono); font-size: 0.6rem; font-style: normal; letter-spacing: 0.07em; text-transform: uppercase; }
.outreach-grid { display: grid; grid-template-columns: 1.12fr 0.94fr 0.94fr; gap: 1px; border: 1px solid rgba(195, 217, 217, 0.38); background: rgba(195, 217, 217, 0.38); }
.outreach-card { position: relative; display: flex; min-height: 25rem; flex-direction: column; overflow: hidden; padding: 1.65rem; }
.outreach-card::after { position: absolute; right: -2.8rem; bottom: -2.8rem; width: 10.5rem; aspect-ratio: 1; border: 1px solid currentColor; border-radius: 50%; content: ""; opacity: 0.2; }
.outreach-card--magazine { background: var(--yellow); color: var(--ink); }
.outreach-card--talk { background: #0a263b; color: #fff; }
.outreach-card--videos { background: var(--aqua); color: var(--ink); }
.outreach-card__number,
.outreach-card__type { position: relative; z-index: 1; font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.08em; text-transform: uppercase; }
.outreach-card__number { color: currentColor; opacity: 0.62; }
.outreach-card__type { max-width: 21ch; margin: 0 0 0.75rem; opacity: 0.76; }
.outreach-card__media { position: relative; z-index: 1; display: block; overflow: hidden; margin: 1rem -0.25rem 1.25rem; border: 1px solid rgba(8, 43, 69, 0.36); background: #fff; text-decoration: none; }
.outreach-card__media img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform 220ms ease, filter 220ms ease; }
.outreach-card__media::after { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 54%, rgba(4, 24, 39, 0.42)); content: ""; pointer-events: none; }
.outreach-card__media:hover img,
.outreach-card__media:focus-visible img { filter: saturate(1.08); transform: scale(1.035); }
.outreach-card__media-badge { position: absolute; right: 0.65rem; bottom: 0.6rem; z-index: 1; padding: 0.28rem 0.42rem; background: rgba(4, 24, 39, 0.84); color: #fff; font-family: var(--mono); font-size: 0.55rem; letter-spacing: 0.06em; text-transform: uppercase; }
.outreach-card--talk .outreach-card__media { border-color: rgba(136, 208, 202, 0.62); }
.outreach-card h3 { position: relative; z-index: 1; max-width: 12ch; margin: 0 0 1rem; font-family: var(--serif); font-size: clamp(1.8rem, 2.5vw, 2.65rem); font-weight: 500; letter-spacing: -0.045em; line-height: 0.98; }
.outreach-card > p:not(.outreach-card__type) { position: relative; z-index: 1; max-width: 29ch; margin: 0 0 1.8rem; font-size: 0.95rem; line-height: 1.6; }
.outreach-card .text-link { position: relative; z-index: 1; width: fit-content; margin-top: auto; }
.outreach-card--talk .outreach-card__type { color: var(--aqua); opacity: 1; }
.outreach-card--talk .text-link { text-decoration-color: var(--yellow); }
.outreach-video-list { position: relative; z-index: 1; display: grid; gap: 1.15rem; margin-top: 1.1rem; }
.outreach-video-item { display: block; color: inherit; text-decoration: none; }
.outreach-video-title { display: block; margin-bottom: 0.45rem; color: var(--ink); font-family: var(--serif); font-size: 1rem; letter-spacing: -0.02em; line-height: 1.15; text-decoration: underline; text-decoration-color: rgba(8, 43, 69, 0.5); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.outreach-video-item:hover .outreach-video-title,
.outreach-video-item:focus-visible .outreach-video-title { text-decoration-color: var(--ink); text-decoration-thickness: 2px; }
.outreach-video-thumb { display: block; overflow: hidden; border: 1px solid rgba(8, 43, 69, 0.4); background: #fff; }
.outreach-video-thumb img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform 220ms ease, filter 220ms ease; }
.outreach-video-item:hover .outreach-video-thumb img,
.outreach-video-item:focus-visible .outreach-video-thumb img { filter: saturate(1.08); transform: scale(1.025); }

.outreach-archive { margin-top: 3.7rem; padding-top: 2.2rem; border-top: 1px solid rgba(195, 217, 217, 0.38); }
.outreach-archive-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; border: 1px solid rgba(195, 217, 217, 0.38); background: rgba(195, 217, 217, 0.38); }
.outreach-entry { display: grid; grid-template-columns: 6.4rem minmax(0, 1fr); gap: 1.35rem; padding: 1.35rem; background: #f4f2ed; color: var(--ink); }
.outreach-entry--kibbutz { background: #d9f2ef; }
.outreach-entry--desert { background: #f8e7b4; }
.outreach-entry--castle { background: #e7e3ef; }
.outreach-entry__date { display: flex; flex-direction: column; gap: 0.65rem; }
.outreach-entry__date time { color: var(--muted); font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.06em; line-height: 1.35; text-transform: uppercase; }
.outreach-entry__date span { color: var(--muted); font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.04em; line-height: 1.35; text-transform: uppercase; }
.outreach-entry h4 { max-width: 30ch; margin: 0 0 0.6rem; font-family: var(--serif); font-size: clamp(1.28rem, 1.9vw, 1.75rem); font-weight: 500; letter-spacing: -0.035em; line-height: 1.05; }
.outreach-entry p { max-width: 39ch; margin: 0 0 1rem; color: #34566a; font-size: 0.84rem; line-height: 1.5; }
.outreach-entry__links { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; }
.outreach-entry__links a { color: var(--ink); font-family: var(--mono); font-size: 0.57rem; letter-spacing: 0.04em; text-decoration-color: var(--ink); text-decoration-thickness: 1px; text-underline-offset: 0.25em; text-transform: uppercase; }
.outreach-entry__links a:hover,
.outreach-entry__links a:focus-visible { text-decoration-thickness: 2px; }

.teaching { position: relative; overflow: hidden; padding: clamp(5rem, 9vw, 8.5rem) max(2rem, calc((100% - 1280px) / 2)); background: #d9f2ef; color: var(--ink); }
.teaching::before { position: absolute; top: -10rem; right: -7rem; width: 28rem; height: 28rem; border: 1px solid rgba(8, 43, 69, 0.18); border-radius: 50%; box-shadow: 0 0 0 2.8rem rgba(8, 43, 69, 0.045), 0 0 0 5.6rem rgba(8, 43, 69, 0.035); content: ""; pointer-events: none; }
.teaching__heading { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.72fr); align-items: end; gap: 3rem; margin-bottom: 3.7rem; }
.teaching .eyebrow { color: #2d6d75; }
.teaching h2 { max-width: 12ch; margin-bottom: 0; }
.teaching__lede { max-width: 31rem; margin: 0; color: #34566a; font-size: 1.06rem; line-height: 1.65; }
.teaching__stats { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 3.7rem; border-top: 1px solid rgba(8, 43, 69, 0.25); border-bottom: 1px solid rgba(8, 43, 69, 0.25); }
.teaching__stats > div { display: grid; gap: 0.2rem; min-height: 7.4rem; align-content: center; padding: 1rem 1.4rem 1rem 0; border-right: 1px solid rgba(8, 43, 69, 0.2); }
.teaching__stats > div + div { padding-left: 1.4rem; }
.teaching__stats > div:last-child { border-right: 0; }
.teaching__stats strong { font-family: var(--serif); font-size: clamp(2rem, 3.3vw, 3rem); font-weight: 500; letter-spacing: -0.045em; line-height: 0.9; }
.teaching__stats span { font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.07em; text-transform: uppercase; }
.teaching__stats small { max-width: 23ch; color: #537083; font-size: 0.78rem; line-height: 1.35; }
.teaching__columns { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(19rem, 0.82fr); gap: 1px; border: 1px solid rgba(8, 43, 69, 0.24); background: rgba(8, 43, 69, 0.24); }
.teaching-panel { padding: clamp(1.5rem, 3vw, 2.7rem); }
.teaching-panel--academic { background: #fffdf8; }
.teaching-panel--lecturing { display: flex; flex-direction: column; background: var(--yellow); }
.teaching-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2.1rem; }
.teaching-panel__head .eyebrow { margin: 0; }
.teaching-panel__mark { color: rgba(8, 43, 69, 0.35); font-family: var(--serif); font-size: 3.2rem; line-height: 0.7; }
.teaching-panel h3 { max-width: 12ch; margin: 0 0 1rem; font-family: var(--serif); font-size: clamp(1.8rem, 2.6vw, 2.7rem); font-weight: 500; letter-spacing: -0.05em; line-height: 0.96; }
.teaching-panel__intro { max-width: 38rem; margin: 0 0 2rem; color: #34566a; font-size: 0.95rem; line-height: 1.6; }
.teaching-course-list { border-top: 1px solid rgba(8, 43, 69, 0.2); }
.teaching-course { display: grid; grid-template-columns: 6.8rem minmax(0, 1fr); gap: 1.2rem; padding: 1.15rem 0; border-bottom: 1px solid rgba(8, 43, 69, 0.2); }
.teaching-course__meta { display: flex; flex-direction: column; gap: 0.45rem; }
.teaching-course__meta time,
.teaching-course__meta span,
.teaching-lecture__date time,
.teaching-lecture__date span { color: #537083; font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.05em; line-height: 1.35; text-transform: uppercase; }
.teaching-course h4 { margin: 0 0 0.35rem; font-family: var(--serif); font-size: clamp(1.2rem, 1.7vw, 1.55rem); font-weight: 500; letter-spacing: -0.03em; line-height: 1.05; }
.teaching-course p { max-width: 45ch; margin: 0 0 0.7rem; color: #34566a; font-size: 0.82rem; line-height: 1.5; }
.teaching-links { display: flex; flex-wrap: wrap; gap: 0.55rem 1rem; }
.teaching-links a { color: var(--ink); font-family: var(--mono); font-size: 0.57rem; letter-spacing: 0.04em; text-decoration-color: var(--yellow); text-decoration-thickness: 1px; text-underline-offset: 0.25em; text-transform: uppercase; }
.teaching-links a:hover,
.teaching-links a:focus-visible { text-decoration-thickness: 2px; }
.teaching-panel--lecturing .eyebrow { color: rgba(8, 43, 69, 0.68); }
.teaching-lecture { display: grid; grid-template-columns: 6.2rem minmax(0, 1fr); gap: 1.1rem; margin-top: 1.5rem; padding-top: 1.35rem; border-top: 1px solid rgba(8, 43, 69, 0.25); }
.teaching-lecture__date { display: flex; flex-direction: column; gap: 0.55rem; }
.teaching-lecture__venue { margin: 0 0 0.65rem; font-family: var(--serif); font-size: 1.35rem; letter-spacing: -0.025em; line-height: 1.08; }
.teaching-lecture p:not(.teaching-lecture__venue) { margin: 0 0 1rem; color: #34566a; font-size: 0.86rem; line-height: 1.55; }
.teaching-links--stacked { display: grid; justify-content: start; gap: 0.45rem; }

.cv,
.talks { padding: clamp(5rem, 9vw, 8.5rem) max(2rem, calc((100% - 1280px) / 2)); }
.cv__heading { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(16rem, 1fr); align-items: end; gap: 2rem; margin-bottom: 2.7rem; }
.cv__heading h2 { max-width: 10ch; }
.cv__lede { max-width: 34rem; margin: 0; color: #34566a; font-size: 1.06rem; line-height: 1.6; }
.cv-panel { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(17rem, 0.75fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.cv-panel__main { padding: clamp(2rem, 4vw, 3.5rem); background: var(--ink); color: #fff; }
.cv-panel__main .eyebrow { color: var(--aqua); }
.cv-panel__main h3 { max-width: 18ch; margin: 0 0 1rem; font-family: var(--serif); font-size: clamp(1.8rem, 3vw, 2.75rem); font-weight: 500; letter-spacing: -0.045em; line-height: 1; }
.cv-panel__main > p:not(.eyebrow) { max-width: 38rem; margin: 0 0 2rem; color: #c9d8d9; line-height: 1.6; }
.cv-panel__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem 1.45rem; }
.cv-panel__actions .text-link { color: #fff; text-decoration-color: var(--aqua); }
.cv-panel__index { display: grid; align-content: center; gap: 1rem; padding: clamp(1.6rem, 3vw, 2.8rem); background: #fff; }
.cv-panel__index > span { color: var(--muted); font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.08em; text-transform: uppercase; }
.cv-panel__index a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 0.9rem; border-top: 1px solid var(--line); font-family: var(--serif); font-size: 1.18rem; letter-spacing: -0.02em; line-height: 1.1; text-decoration-color: var(--yellow); text-underline-offset: 0.25em; }
.cv-panel__index a span { color: #a57308; font-family: var(--mono); font-size: 0.72rem; }
.talks__heading { margin-bottom: 2.7rem; }
.talks__heading h2 { max-width: 12ch; }
.cv-overview { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: 1px; border: 1px solid var(--line); background: var(--line); }
.cv-card { display: flex; min-height: 16.5rem; flex-direction: column; padding: 1.55rem; background: #fff; }
.cv-card--current { background: var(--yellow); }
.cv-card__label { margin: 0 0 auto; color: var(--muted); font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.08em; text-transform: uppercase; }
.cv-card--current .cv-card__label { color: rgba(8, 43, 69, 0.65); }
.cv-card h3 { max-width: 12ch; margin: 2rem 0 0.9rem; font-family: var(--serif); font-size: clamp(1.75rem, 2.6vw, 2.65rem); font-weight: 500; letter-spacing: -0.045em; line-height: 1; }
.cv-card p:not(.cv-card__label) { max-width: 30ch; margin: 0 0 1rem; font-size: 0.92rem; line-height: 1.55; }
.cv-card span,
.cv-card a { margin-top: auto; color: var(--muted); font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.04em; line-height: 1.45; text-transform: uppercase; }
.cv-card a { color: var(--ink); font-weight: 700; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 0.25em; }
.cv-timeline { display: grid; grid-template-columns: repeat(4, 1fr); margin: 3.5rem 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.cv-timeline article { min-height: 9.2rem; padding: 1.1rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.cv-timeline time { display: block; margin-bottom: 2.1rem; color: #a57308; font-family: var(--mono); font-size: 0.67rem; letter-spacing: 0.06em; }
.cv-timeline strong,
.cv-timeline span { display: block; }
.cv-timeline strong { margin-bottom: 0.35rem; font-family: var(--serif); font-size: 1.25rem; font-weight: 500; letter-spacing: -0.03em; line-height: 1.05; }
.cv-timeline span { color: var(--muted); font-size: 0.84rem; line-height: 1.45; }
.cv-talks { background: var(--ink); color: #fff; }
.cv-talks__statement { padding: clamp(2rem, 4vw, 3.5rem); padding-bottom: clamp(1.8rem, 3vw, 2.8rem); }
.cv-talks__statement .eyebrow { color: var(--aqua); }
.cv-talks h3 { max-width: 22ch; margin: 0 0 1.4rem; font-family: var(--serif); font-size: clamp(1.8rem, 2.7vw, 2.8rem); font-weight: 500; letter-spacing: -0.05em; line-height: 0.98; }
.cv-talks__statement > p:not(.eyebrow) { max-width: 35rem; margin-bottom: 2rem; color: #c9d8d9; line-height: 1.65; }
.cv-talks__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem 1.45rem; }
.cv-talks__actions .text-link { color: #fff; text-decoration-color: var(--aqua); }
.cv-talk-archive { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid rgba(195, 217, 217, 0.3); background: rgba(4, 24, 39, 0.47); }
.cv-talk-list { padding: clamp(1.4rem, 3vw, 2.7rem); }
.cv-talk-list + .cv-talk-list { border-left: 1px solid rgba(195, 217, 217, 0.3); }
.cv-talk-list summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; color: #fff; font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.055em; list-style: none; text-transform: uppercase; }
.cv-talk-list summary::-webkit-details-marker { display: none; }
.cv-talk-list summary span:last-child { color: var(--aqua); }
.cv-talk-list ul { display: grid; gap: 0.2rem; margin: 1.3rem 0 0; padding: 0; list-style: none; }
.cv-talk-list li { display: grid; grid-template-columns: 4.8rem 1fr; gap: 0.8rem; padding: 0.82rem 0; border-top: 1px solid rgba(195, 217, 217, 0.17); }
.cv-talk-list time { padding-top: 0.12rem; color: var(--aqua); font-family: var(--mono); font-size: 0.58rem; letter-spacing: 0.04em; text-transform: uppercase; }
.cv-talk-list a { color: #fff; font-family: var(--serif); font-size: 1.13rem; letter-spacing: -0.02em; line-height: 1.05; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 0.23em; }
.cv-talk-list a span { display: block; margin-top: 0.25rem; color: #aac0c1; font-family: var(--sans); font-size: 0.76rem; letter-spacing: 0; line-height: 1.3; }

.about {
  display: grid;
  grid-template-columns: minmax(6rem, 0.34fr) minmax(12rem, 0.66fr) 1.25fr;
  gap: 2rem;
  padding: clamp(5rem, 10vw, 9.5rem) max(2rem, calc((100% - 1060px) / 2));
  background: var(--warm);
}

.about__number { color: rgba(8, 43, 69, 0.3); font-family: var(--serif); font-size: clamp(5rem, 10vw, 8rem); line-height: 0.75; }
.about__portrait { align-self: center; max-width: 18rem; margin: 0; }
.about__portrait img { display: block; width: 100%; aspect-ratio: 0.82; border: 1px solid rgba(8, 43, 69, 0.25); object-fit: cover; object-position: center 27%; box-shadow: 0.75rem 0.75rem 0 var(--yellow); }
.about__content { max-width: 43rem; }
.about__content h2 { margin-bottom: 1.7rem; }
.about__content > p:not(.eyebrow) { max-width: 40rem; margin-bottom: 1.9rem; font-size: 1.13rem; line-height: 1.7; }
.about__content > p a { text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 0.22em; }
.text-link--dark { text-decoration-color: var(--ink); }

.contact { padding: clamp(5rem, 9vw, 8rem) max(2rem, calc((100% - 1280px) / 2)); background: var(--ink); color: #fff; }
.contact .eyebrow { color: var(--aqua); }
.contact h2 { max-width: 13ch; margin-bottom: 1.75rem; }
.contact__email { display: inline-block; margin-bottom: 1.5rem; color: var(--yellow); font-family: var(--serif); font-size: clamp(1.7rem, 3.2vw, 3.1rem); font-weight: 500; letter-spacing: -0.045em; text-decoration-thickness: 1px; text-underline-offset: 0.16em; }
.contact__location { margin: 0; color: #c3d1d4; font-size: 0.94rem; }

.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.6rem max(2rem, calc((100% - 1280px) / 2)); background: #061f32; color: #b7c9cc; }

:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }

@media (max-width: 1050px) {
  .hero { grid-template-columns: minmax(10.75rem, 0.36fr) minmax(0, 1fr); }
  .hero__copy { padding-right: 2rem; }
  .outreach__heading { grid-template-columns: 1fr; gap: 1.4rem; }
  .peace-note { grid-template-columns: 1fr; gap: 0.8rem; }
  .sesame__heading { grid-template-columns: 1fr; gap: 1.4rem; }
  .outreach-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .outreach-entry { grid-template-columns: 5rem minmax(0, 1fr); }
  .teaching__heading { grid-template-columns: 1fr; gap: 1.4rem; }
  .textbook__heading { grid-template-columns: 1fr; gap: 1.4rem; }
  .textbook__layout { gap: 3rem; }
  .cv__heading { grid-template-columns: 1fr; gap: 1.4rem; }
  .cv-panel { grid-template-columns: 1fr; }
  .cv-overview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cv-timeline { grid-template-columns: repeat(2, 1fr); }
  .cv-talks { grid-template-columns: 1fr; }
  .cv-talk-archive { grid-template-columns: 1fr; border-top: 1px solid rgba(195, 217, 217, 0.3); border-left: 0; }
  .cv-talk-list + .cv-talk-list { border-top: 1px solid rgba(195, 217, 217, 0.3); border-left: 0; }
  .network-canvas { display: grid; min-height: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; padding: 0.85rem; }
  .network-node { position: relative; inset: auto; width: auto; min-height: 7rem; }
  .network-node--side { min-height: 11.5rem; }
  .network-node--pbh,
  .network-node--curvature,
  .network-node--gw { min-height: 9.5rem; }
  .network-node--circle { aspect-ratio: auto; border-radius: 0.35rem; }
  .network-node--foundation,
  .network-node--question,
  .network-node--bridge { grid-column: 1 / -1; }
  .network-node--qft { order: 1; }
  .network-node--gr { order: 2; }
  .network-node--foundation { order: 3; }
  .network-node--question { order: 4; }
  .network-node--production { order: 5; }
  .network-node--eras { order: 6; }
  .network-node--transition { order: 7; }
  .network-node--inflation { order: 8; }
  .network-node--walls { order: 9; }
  .network-node--strings { order: 10; }
  .network-node--bridge { order: 11; min-height: 0; }
  .network-node--pbh { order: 12; }
  .network-node--curvature { order: 13; }
  .network-node--gw { order: 14; grid-column: 1 / -1; }
  .network-node--observatories { order: 15; min-height: 0; }
  .network-node--telescopes { order: 16; }
  .network-node--lensing { order: 17; }
  .network-node--ligo { order: 18; }
  .network-node--pta { order: 19; }
  .network-node--moon { order: 20; }
  .network-node--astrophysics { order: 21; min-height: 0; }
  .network-node--smbh { order: 22; }
  .network-node--mechanism::before,
  .network-node--mechanism::after,
  .network-edge { display: none; }
  .map-keywords { grid-template-columns: 1fr; gap: 1.4rem; }
  .map-keywords h3 { max-width: 17ch; }
  .research-bridge { grid-template-columns: 1fr; gap: 0.85rem; }
}

@media (max-width: 720px) {
  .site-header,
  .hero { width: min(100% - 2.25rem, 1280px); }
  .site-header { min-height: 4.7rem; }
  .site-header nav { flex-wrap: wrap; justify-content: flex-end; gap: 0.4rem 0.7rem; }
  .site-header nav a { font-size: 0.54rem; }
  .hero { grid-template-columns: 1fr; }
  .hero__copy { padding: 4.25rem 0 3.6rem; }
  .outreach-grid { grid-template-columns: 1fr; }
  .outreach-card { min-height: 20rem; }
  .outreach-archive-grid { grid-template-columns: 1fr; }
  .outreach-entry { grid-template-columns: 1fr; gap: 0.8rem; }
  .teaching__stats { grid-template-columns: 1fr; }
  .teaching__stats > div,
  .teaching__stats > div + div { min-height: 0; padding: 1rem 0; border-right: 0; border-bottom: 1px solid rgba(8, 43, 69, 0.2); }
  .teaching__stats > div:last-child { border-bottom: 0; }
  .teaching__columns { grid-template-columns: 1fr; }
  .teaching-course,
  .teaching-lecture { grid-template-columns: 1fr; gap: 0.65rem; }
  .textbook__layout { grid-template-columns: 1fr; gap: 2.8rem; }
  .textbook__cover { width: min(15rem, 100%); }
  .textbook__details { grid-template-columns: 1fr; }
  .textbook__details div,
  .textbook__details div + div { padding: 0.9rem 0; border-right: 0; border-bottom: 1px solid rgba(8, 43, 69, 0.18); }
  .textbook__details div:last-child { border-bottom: 0; }
  .cv-panel__actions { align-items: flex-start; flex-direction: column; }
  .cv-overview,
  .cv-timeline { grid-template-columns: 1fr; }
  .cv-card { min-height: 14rem; }
  .cv-timeline article { min-height: 7.5rem; }
  .section-heading { display: block; }
  .section-heading .eyebrow { margin-bottom: 1rem; }
  .research-grid { grid-template-columns: 1fr; }
  .research-card { min-height: 18.5rem; }
  .paper-matrix-wrap { box-shadow: 0.4rem 0.4rem 0 var(--yellow); }
  .paper-matrix-source { align-items: flex-start; flex-direction: column; }
  .map-keywords { margin-top: 3rem; padding-top: 1.75rem; }
  .map-keyword { min-height: 2.1rem; font-size: 0.58rem; }
  .paper-tags { padding-bottom: 0.75rem; }
  .paper-tag { font-size: 0.5rem; }
  .einstein-quote__inner, .pull-quote__inner { grid-template-columns: 1fr; gap: 0.6rem; }
  .einstein-quote__mark, .pull-quote__mark { font-size: 3.5rem; }
  .note-coda { grid-template-columns: 1fr; gap: 0.4rem; }
  .note-coda__mark { font-size: 2.6rem; }
  .quote-card { padding-top: 1.7rem; }
  .quote-card__figure { margin-bottom: 1.4rem; }
  .network-instruction { margin-left: 0; }
  .network-canvas { grid-template-columns: 1fr; }
  .network-node--foundation,
  .network-node--question,
  .network-node--bridge,
  .network-node--gw { grid-column: auto; }
  .network-node--question { min-height: 10rem; }
  .hero__profile { display: flex; align-items: flex-start; gap: 1.25rem; padding: 3.5rem 0 1rem; }
  .hero__portrait { max-width: 15rem; }
  .site-footer { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button { transition: none; }
}

/* On a narrow screen the plate is cropped to its middle, which roughly doubles
   the effective line weight, so it needs to sit further back. */
@media (max-width: 720px) {
  body::before { opacity: 0.72; }
}

/* Anyone who has asked for more contrast, or is printing the page, gets the
   plain paper instead. */
@media (prefers-contrast: more) {
  body::before { display: none; }
}

@media print {
  body::before { display: none; }
}
