:root {
  --ink: #f0ede5;
  --paper: #080808;
  --red: #d51f18;
  --blue: #1250ff;
  --acid: #d7ff24;
  --muted: #75726b;
  --line: rgba(16,16,16,.22);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Source Serif 4", Georgia, serif;
}
a { color: inherit; }
.site-header {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px clamp(22px, 5vw, 76px);
  color: white;
  font-family: "IBM Plex Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 13px;
  font-weight: 600;
}
.wordmark { text-decoration: none; font-weight: 500; font-size: 15px; }
.wordmark span { color: var(--acid); }
.top-preorder {
  margin-left: auto;
  margin-right: clamp(18px, 3vw, 38px);
  padding: 10px 14px;
  color: white;
  background: var(--red);
  border: 1px solid var(--red);
  text-decoration: none;
  box-shadow: 0 9px 28px rgba(213,31,24,.3);
  transition: background .2s, color .2s;
}
.top-preorder:hover, .top-preorder:focus-visible { color: #101010; background: white; border-color: white; }
nav { display: flex; gap: clamp(18px, 3vw, 44px); }
nav a { text-decoration: none; opacity: .74; transition: opacity .2s; }
nav a:hover, nav a:focus-visible { opacity: 1; }
.hero {
  min-height: 100svh;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  align-items: center;
  gap: clamp(30px, 7vw, 110px);
  padding: 110px clamp(22px, 7vw, 108px) 70px;
  color: white;
  background:
    linear-gradient(98deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.56) 43%, rgba(0,0,0,.20) 72%, rgba(0,0,0,.42) 100%),
    linear-gradient(0deg, rgba(0,0,0,.34), transparent 40%),
    url("assets/weboj-red.png") center / cover no-repeat,
    #080808;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .13;
  background-image: repeating-linear-gradient(90deg, transparent 0 67px, rgba(255,255,255,.1) 68px);
  pointer-events: none;
}
.hero::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 5% auto 5% 2%;
  width: min(65%, 820px);
  pointer-events: none;
  background: radial-gradient(ellipse at 42% 48%, rgba(0,0,0,.78) 0%, rgba(0,0,0,.46) 48%, transparent 78%);
}
.hero-copy { position: relative; z-index: 1; }
.eyebrow, .section-label {
  margin: 0 0 20px;
  font: 600 12px/1.5 "IBM Plex Mono", monospace;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.eyebrow { color: var(--acid); }
h1 {
  margin: 0;
  font: 400 clamp(56px, 8vw, 132px)/.78 "Archivo Black", sans-serif;
  letter-spacing: -.07em;
}
h1 span {
  color: transparent;
  -webkit-text-stroke: 2px white;
}
.dek {
  max-width: 610px;
  margin: 35px 0 9px;
  font-size: clamp(19px, 2vw, 27px);
  line-height: 1.18;
}
.authors {
  margin: 0;
  color: rgba(255,255,255,.82);
  font: 600 13px/1.45 "IBM Plex Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .09em;
}
.hero-actions { display: flex; gap: 12px; margin-top: 38px; flex-wrap: wrap; }
.button {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 20px;
  border: 1px solid rgba(255,255,255,.45);
  text-decoration: none;
  font: 600 12px/1 "IBM Plex Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.button-primary { color: #101010; background: var(--acid); border-color: var(--acid); }
.button-preorder { color: white; background: var(--red); border-color: var(--red); box-shadow: 0 12px 34px rgba(213,31,24,.28); }
.button-preorder:hover { background: white; border-color: white; color: #101010; }
.button-quiet:hover { background: white; color: #101010; }
.cover-wrap {
  position: relative;
  z-index: 1;
  margin: 0;
  justify-self: center;
  width: min(390px, 100%);
  transform: rotate(1.5deg);
}
.cover-wrap img {
  display: block;
  width: 100%;
  box-shadow: 0 52px 110px rgba(0,0,0,.88), 18px 26px 42px rgba(0,0,0,.62), -8px 10px 32px rgba(18,80,255,.18), 0 0 0 1px rgba(255,255,255,.22);
}
.cover-wrap figcaption {
  margin-top: 12px;
  color: rgba(255,255,255,.5);
  font: 10px "IBM Plex Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.case-number {
  position: absolute;
  right: -18px;
  bottom: -28px;
  margin: 0;
  color: rgba(255,255,255,.055);
  font: 400 clamp(100px, 17vw, 260px)/1 "Archivo Black", sans-serif;
  letter-spacing: -.08em;
}
.thesis {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(80px, 11vw, 170px) clamp(22px, 8vw, 130px);
  background:
    linear-gradient(100deg, rgba(3,5,10,.88) 0%, rgba(3,5,10,.60) 48%, rgba(3,5,10,.30) 78%, rgba(3,5,10,.54) 100%),
    url("assets/weboj-blue.png") center / cover no-repeat;
}
.thesis > * { position: relative; z-index: 1; }
.thesis blockquote,
.thesis-grid { text-shadow: 0 3px 22px rgba(0,0,0,.92); }
.thesis::before,
.thesis::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  width: 58%;
  height: 120%;
  top: -10%;
  opacity: .42;
}
.thesis::before {
  right: -8%;
  opacity: .20;
  background: repeating-linear-gradient(112deg, transparent 0 47px, rgba(213,31,24,.48) 48px 49px, transparent 50px 91px);
  transform: rotate(-7deg);
}
.thesis::after {
  right: 6%;
  opacity: .24;
  background: repeating-linear-gradient(76deg, transparent 0 71px, rgba(18,80,255,.42) 72px 73px, transparent 74px 124px);
  transform: rotate(6deg);
}
.section-label { color: var(--red); }
blockquote {
  max-width: 1120px;
  margin: 0 0 70px;
  font: 400 clamp(37px, 5vw, 78px)/.98 "Archivo Black", sans-serif;
  letter-spacing: -.045em;
}
.thesis-grid {
  max-width: 1050px;
  margin-left: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 6vw, 90px);
  font-size: 19px;
  line-height: 1.62;
}
.thesis-grid p { margin: 0; }
.evidence-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  margin-top: 90px;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.evidence-strip span {
  padding: 18px 10px;
  border-right: 1px solid var(--line);
  text-align: center;
  font: 500 10px "IBM Plex Mono", monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.evidence-strip span:last-child { border-right: 0; }
.evidence-strip strong { font-family: "Archivo Black", sans-serif; font-weight: 400; letter-spacing: .04em; }
.documentary-note {
  position: relative;
  max-width: 760px;
  margin-top: clamp(52px, 7vw, 90px);
  padding: 26px 30px 28px;
  border-left: 3px solid var(--red);
  background: rgba(0,0,0,.34);
}
.documentary-note .section-label { margin-bottom: 10px; color: var(--acid); }
.documentary-note p:last-child { margin: 0; max-width: 680px; color: #e4e0d8; font-size: clamp(17px, 1.7vw, 22px); line-height: 1.42; }
.documentary-note strong { color: white; font-weight: 600; }
.image-dossier {
  position: relative;
  min-height: 720px;
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  grid-template-rows: 1fr 1fr;
  gap: 8px;
  padding: 8px;
  overflow: hidden;
  background: #050505;
}
.image-dossier figure, .case-imagery figure { margin: 0; overflow: hidden; background: #050505; }
.image-dossier img, .case-imagery img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dossier-portrait { grid-row: 1 / 3; }
.dossier-stamp {
  position: absolute;
  left: clamp(22px, 6vw, 90px);
  bottom: 36px;
  margin: 0;
  color: white;
  font: 400 clamp(52px, 8vw, 118px)/.78 "Archivo Black", sans-serif;
  letter-spacing: -.06em;
  mix-blend-mode: difference;
}
.preview {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(245px, .65fr) minmax(0, 1.6fr);
  gap: clamp(45px, 8vw, 125px);
  padding: clamp(80px, 10vw, 145px) clamp(22px, 8vw, 130px);
  color: #eeeae0;
  background: #111;
}
.preview::before,
.authors-section::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  background-size: cover;
  background-position: center;
  opacity: .17;
  filter: saturate(.9) contrast(1.08);
}
.preview::before {
  inset: 0;
  opacity: .78;
  background-image: linear-gradient(90deg, rgba(4,4,7,.80) 0%, rgba(4,4,7,.62) 28%, rgba(4,4,7,.36) 60%, rgba(4,4,7,.58) 100%), url("assets/weboj-blue.png");
  background-repeat: no-repeat;
  background-position: center, center;
  background-size: cover, cover;
}
.preview-aside { position: sticky; top: 35px; align-self: start; }
.preview-aside h2 {
  margin: 0 0 24px;
  font: 400 clamp(40px, 5vw, 67px)/.92 "Archivo Black", sans-serif;
  letter-spacing: -.05em;
}
.preview-aside > p:not(.section-label):not(.reading-time) { color: #a8a49d; font-size: 18px; line-height: 1.5; }
.rule { width: 60px; height: 5px; margin: 34px 0; background: var(--blue); }
.reading-time { color: #77736d; font: 10px/1.7 "IBM Plex Mono", monospace; text-transform: uppercase; letter-spacing: .1em; }
.preview-text {
  max-width: 780px;
  padding: clamp(26px, 4vw, 54px);
  font-size: clamp(18px, 1.55vw, 21px);
  line-height: 1.74;
  background: rgba(5,8,15,.78);
  border-left: 1px solid rgba(65,155,255,.58);
  box-shadow: 0 28px 90px rgba(0,0,0,.48);
  backdrop-filter: blur(3px);
}
.preview-text p { margin: 0 0 1.45em; }
.preview-text .dropcap::first-letter {
  float: left;
  margin: .06em .12em 0 0;
  color: var(--acid);
  font: 400 5.25em/.72 "Archivo Black", sans-serif;
}
.case-imagery {
  position: relative;
  min-height: 820px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 8px;
  padding: 8px;
  color: white;
  background: #111;
}
.gate-image { grid-row: 1 / 3; }
.gate-image img { object-position: center 82%; }
.knife-image { grid-column: 2; grid-row: 1; }
.call-image { grid-column: 2 / 4; grid-row: 2; }
.case-imagery-copy {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-column: 3;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: clamp(28px, 4vw, 64px);
  background:
    linear-gradient(110deg, rgba(2,17,68,.48), rgba(0,7,35,.74)),
    url("assets/blue-static-ocean-palms.png") center / cover no-repeat,
    var(--blue);
  box-shadow: inset 0 0 80px rgba(0,0,0,.28);
}
.case-imagery-copy > * { position: relative; z-index: 1; }
.case-imagery-copy .section-label { color: var(--acid); }
.case-imagery-copy h2 { margin: 0 0 36px; font: 400 clamp(27px, 3vw, 45px)/1 "Archivo Black", sans-serif; letter-spacing: -.04em; }
.visual-reconstruction {
  padding: clamp(80px, 10vw, 145px) clamp(8px, 3vw, 46px);
  color: white;
  background: #080808;
}
.visual-reconstruction-head {
  display: grid;
  grid-template-columns: .55fr 1.3fr .7fr;
  gap: clamp(28px, 5vw, 75px);
  align-items: end;
  padding: 0 clamp(14px, 5vw, 75px) clamp(48px, 7vw, 90px);
}
.visual-reconstruction-head h2 {
  margin: 0;
  font: 400 clamp(39px, 5vw, 74px)/.92 "Archivo Black", sans-serif;
  letter-spacing: -.05em;
}
.visual-reconstruction-head > p:last-child { margin: 0; color: #b8b3aa; font: 600 13px/1.65 "IBM Plex Mono", monospace; text-transform: uppercase; letter-spacing: .06em; }
.reconstruction-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: clamp(190px, 22vw, 360px);
  gap: 8px;
}
.reconstruction-grid figure { margin: 0; overflow: hidden; background: #171717; }
.reconstruction-grid img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.82) contrast(1.06); transition: filter .25s, transform .5s; }
.reconstruction-grid figure:hover img { filter: saturate(1) contrast(1.03); transform: scale(1.018); }
.reconstruction-grid .recon-wide { grid-column: span 2; }
.reconstruction-grid .recon-portrait { grid-row: span 2; }
.lost-witnesses {
  padding: clamp(80px, 10vw, 145px) clamp(22px, 6vw, 96px);
  color: white;
  background: #080808;
  border-top: 1px solid rgba(255,255,255,.18);
}
.lost-witnesses-head {
  display: grid;
  grid-template-columns: .48fr 1.15fr .72fr;
  gap: clamp(30px, 6vw, 90px);
  align-items: end;
  margin-bottom: clamp(48px, 7vw, 90px);
}
.lost-witnesses-head h2 {
  margin: 0;
  color: white;
  font: 400 clamp(48px, 7vw, 102px)/.84 "Archivo Black", sans-serif;
  letter-spacing: -.065em;
}
.lost-witnesses-head > p:last-child { margin: 0; color: #aaa59c; font: 13px/1.65 "IBM Plex Mono", monospace; }
.lost-witnesses-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 30px 12px;
}
.lost-witnesses-grid figure { margin: 0; min-width: 0; }
.lost-witnesses-grid figure:nth-child(1),
.lost-witnesses-grid figure:nth-child(2) { grid-column: span 6; }
.lost-witnesses-grid figure:nth-child(n+3) { grid-column: span 3; }
.lost-witnesses-grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: #111; }
.lost-witnesses-grid figure:nth-child(-n+2) img { aspect-ratio: 2.25 / 1; object-fit: contain; background: #eee; }
.lost-witnesses-grid figcaption {
  padding-top: 12px;
  color: white;
  font: 600 12px/1.5 "IBM Plex Mono", monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.people-records {
  padding: clamp(80px, 10vw, 145px) clamp(22px, 6vw, 96px);
  color: white;
  background: #080808;
  border-top: 1px solid rgba(255,255,255,.18);
}
.people-records-head {
  display: grid;
  grid-template-columns: .48fr 1.4fr;
  gap: clamp(30px, 6vw, 90px);
  align-items: end;
  margin-bottom: clamp(48px, 7vw, 90px);
}
.people-records-head h2 {
  margin: 0;
  font: 400 clamp(40px, 5.5vw, 80px)/.91 "Archivo Black", sans-serif;
  letter-spacing: -.055em;
}
.people-records-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px 12px;
}
.people-records-grid figure { margin: 0; min-width: 0; }
.people-records-grid .archive-wide { grid-column: span 2; }
.people-records-grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: grayscale(100%) contrast(1.06); transition: filter .25s; }
.people-records-grid figure:hover img { filter: grayscale(0%) contrast(1.02); }
.people-records-grid figcaption {
  padding: 12px 0 0;
  color: white;
  font: 600 13px/1.45 "IBM Plex Mono", monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.reading-page { background: #111; }
.reading-header {
  position: absolute;
  z-index: 3;
  inset: 0 0 auto 0;
  display: flex;
  justify-content: space-between;
  padding: 24px clamp(22px, 5vw, 76px);
  color: white;
  font: 600 13px "IBM Plex Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.reading-header a { text-decoration: none; }
.reading-hero {
  min-height: 74svh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  color: white;
  background: #080808;
}
.reading-hero > div {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 120px clamp(22px, 7vw, 100px) 75px;
  background:
    linear-gradient(115deg, rgba(8,8,8,.72), rgba(8,8,8,.91)),
    url("assets/weboj-red.png") center / cover no-repeat;
}
.reading-hero h1 { font-size: clamp(58px, 8vw, 118px); line-height: .82; }
.reading-hero > div > p:last-child { max-width: 520px; font-size: 21px; }
.reading-hero img { width: 100%; height: 74svh; object-fit: cover; opacity: .72; }
.long-read {
  display: grid;
  grid-template-columns: minmax(210px, .58fr) minmax(0, 1.5fr);
  gap: clamp(45px, 8vw, 125px);
  padding: clamp(80px, 10vw, 145px) clamp(22px, 8vw, 130px);
  color: #eeeae0;
}
.long-read aside { position: sticky; top: 40px; align-self: start; color: #b8b3aa; font: 600 13px/1.7 "IBM Plex Mono", monospace; text-transform: uppercase; letter-spacing: .08em; }
.long-read .preview-text h2 { margin: 70px 0 28px; color: var(--acid); font: 400 clamp(31px, 4vw, 50px)/1 "Archivo Black", sans-serif; letter-spacing: -.04em; }
.reading-end { display: grid; grid-template-columns: 1fr 1fr; min-height: 620px; color: white; background: var(--red); }
.reading-end img { width: 100%; height: 100%; object-fit: cover; }
.reading-end > div {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(35px, 7vw, 100px);
  background: #910a09;
}
.reading-end > div::before,
.reading-end > div::after { content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none; }
.reading-end > div::before {
  background: url("assets/hero-background-v4.jpg") center 72% / cover no-repeat;
  filter: contrast(1.14);
  transform: scale(1.01);
}
.reading-end > div::after { z-index: -1; background: linear-gradient(rgba(145,10,9,.66), rgba(80,4,4,.80)); }
.reading-end h2 { margin: 0 0 38px; font: 400 clamp(37px, 5vw, 68px)/.95 "Archivo Black", sans-serif; letter-spacing: -.05em; }
.preorder-section {
  display: grid;
  grid-template-columns: .48fr 1.4fr;
  gap: clamp(30px, 6vw, 90px);
  align-items: start;
  padding: clamp(80px, 10vw, 145px) clamp(22px, 8vw, 130px);
  color: white;
  background: linear-gradient(120deg, #080808 0 58%, #171717 100%);
  border-top: 1px solid rgba(255,255,255,.16);
}
.preorder-section h2 { margin: 0; font: 400 clamp(48px, 7vw, 100px)/.86 "Archivo Black", sans-serif; letter-spacing: -.06em; }
.preorder-section p:last-child { max-width: 660px; margin: 32px 0 0; color: #c7c2b8; font-size: clamp(18px, 1.8vw, 23px); line-height: 1.5; }
.authors-section { position: relative; isolation: isolate; overflow: hidden; padding: clamp(80px, 10vw, 145px) clamp(22px, 8vw, 130px); }
.authors-section::before {
  inset: 0 48% 0 0;
  background-image: linear-gradient(90deg, rgba(8,8,8,.72), rgba(8,8,8,.18) 72%, #080808), url("assets/weboj-blue.png");
  background-repeat: no-repeat;
  background-position: center, 62% center;
  background-size: cover, cover;
}
.author-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: white;
  border: 1px solid white;
}
.author-grid article { min-height: 315px; padding: clamp(28px, 5vw, 64px); background: var(--paper); }
.initials { color: var(--red); font: 400 58px/1 "Archivo Black", sans-serif; }
.author-grid h3 { margin: 50px 0 14px; font: 400 28px "Archivo Black", sans-serif; text-transform: uppercase; }
.author-grid p { max-width: 470px; margin: 0; font-size: 18px; line-height: 1.55; }
footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 30px;
  padding: 46px clamp(22px, 8vw, 130px);
  color: white;
  background: var(--red);
  font: 600 13px/1.6 "IBM Plex Mono", monospace;
  text-transform: uppercase;
  letter-spacing: .06em;
}
footer p { margin: 0; }
.footer-note { opacity: .82; text-align: right; font-size: 11px; }
.footer-note a { color: white; text-underline-offset: 4px; }
.contact-page { min-height: 100svh; color: white; background: #080808; }
.contact-main {
  min-height: 100svh;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr);
  gap: clamp(50px, 8vw, 130px);
  align-items: center;
  padding: 120px clamp(22px, 8vw, 130px) 75px;
  background:
    linear-gradient(110deg, rgba(0,0,0,.62), rgba(0,0,0,.88)),
    url("assets/weboj-red.png") center / cover no-repeat;
}
.contact-intro h1, .thanks-main h1 { font-size: clamp(54px, 7.5vw, 112px); }
.contact-intro > p:last-child, .thanks-main > p:not(.eyebrow) { max-width: 620px; color: #d4d0c7; font-size: clamp(19px, 2vw, 26px); line-height: 1.4; }
.contact-panel { padding: clamp(28px, 4vw, 54px); background: rgba(5,5,5,.82); border: 1px solid rgba(255,255,255,.2); box-shadow: 0 34px 90px rgba(0,0,0,.66); backdrop-filter: blur(8px); }
.contact-panel form { display: grid; gap: 22px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.contact-panel label { display: grid; gap: 9px; color: white; font: 600 12px/1.3 "IBM Plex Mono", monospace; letter-spacing: .1em; }
.contact-panel input, .contact-panel textarea { width: 100%; padding: 14px 15px; color: white; background: #111; border: 1px solid rgba(255,255,255,.28); border-radius: 0; font: 17px/1.4 "Source Serif 4", Georgia, serif; }
.contact-panel input:focus, .contact-panel textarea:focus { outline: 2px solid var(--acid); outline-offset: 2px; border-color: transparent; }
.contact-panel textarea { resize: vertical; }
.contact-panel button { width: fit-content; cursor: pointer; }
.honey-field { position: absolute; left: -10000px; width: 1px !important; height: 1px; overflow: hidden; }
.form-note { margin: 0; color: #aaa59c; font: 500 11px/1.55 "IBM Plex Mono", monospace; }
.thanks-main { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 90px clamp(22px, 11vw, 170px); background: radial-gradient(circle at 75% 30%, rgba(18,80,255,.34), transparent 38%), #080808; }
.thanks-main .button { margin-top: 28px; }
@media (max-width: 800px) {
  .site-header nav { display: none; }
  .top-preorder { margin-right: 0; padding: 9px 11px; font-size: 11px; }
  .hero {
    grid-template-columns: 1fr;
    padding-top: 125px;
    background-position: center, center, 64% center;
  }
  .hero-copy { padding-bottom: 15px; }
  .cover-wrap { width: min(330px, 82vw); }
  .thesis-grid, .author-grid { grid-template-columns: 1fr; }
  .thesis { background-position: center, 64% center; }
  .preorder-section { grid-template-columns: 1fr; }
  .evidence-strip { grid-template-columns: 1fr 1fr; }
  .evidence-strip span { border-bottom: 1px solid var(--line); }
  .preview { grid-template-columns: 1fr; }
  .preview::before { background-position: center, 61% center; opacity: .60; }
  .preview-aside { position: static; }
  .image-dossier { min-height: 760px; grid-template-columns: 1fr; grid-template-rows: 1.2fr 1fr 1fr; }
  .dossier-portrait { grid-row: auto; }
  .case-imagery { grid-template-columns: 1fr 1fr; grid-template-rows: 340px 300px auto; }
  .gate-image { grid-row: 1 / 3; }
  .knife-image { grid-column: 2; grid-row: 1; }
  .call-image { grid-column: 2; grid-row: 2; }
  .case-imagery-copy { grid-column: 1 / 3; grid-row: 3; }
  .visual-reconstruction-head { grid-template-columns: 1fr; }
  .reconstruction-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 240px; }
  .reconstruction-grid .recon-wide { grid-column: span 2; }
  .lost-witnesses-head { grid-template-columns: 1fr; }
  .lost-witnesses-grid figure:nth-child(n) { grid-column: span 6; }
  .lost-witnesses-grid figure:nth-child(-n+2) { grid-column: span 12; }
  .people-records-head { grid-template-columns: 1fr; }
  .people-records-grid { grid-template-columns: 1fr 1fr; }
  .people-records-grid .archive-wide { grid-column: span 2; }
  .reading-hero, .reading-end { grid-template-columns: 1fr; }
  .reading-hero img { height: 44svh; }
  .long-read { grid-template-columns: 1fr; }
  .long-read aside { position: static; }
  footer { align-items: flex-start; flex-direction: column; }
  .footer-note { text-align: left; }
  .contact-main { grid-template-columns: 1fr; padding-top: 125px; }
  .field-row { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
