:root {
  color-scheme: light;
  --bg: #f3efe7;
  --surface: #fbf8f1;
  --ink: #171717;
  --muted: #69645b;
  --line: rgba(23, 23, 23, .22);
  --accent: #2656d8;
  --signal: #ef4a35;
  --band: #d4c495;
  --band-ink: #181714;
  --display: Iowan Old Style, Baskerville, Georgia, serif;
  --sans: Avenir Next, Avenir, Helvetica Neue, Arial, sans-serif;
  --measure: 1280px;
  --section-space: clamp(64px, 8vw, 112px);
}

html[data-direction="independent"] {
  --bg: #f8f7f2;
  --surface: #fff;
  --ink: #111;
  --muted: #4f4f4a;
  --line: rgba(17, 17, 17, .32);
  --accent: #1760df;
  --signal: #ef4d35;
  --band: #eee938;
  --display: Arial Black, Arial, sans-serif;
  --sans: Helvetica Neue, Helvetica, Arial, sans-serif;
}

html[data-direction="counterpoint"] {
  --bg: #f4f0e7;
  --surface: #fffdf8;
  --ink: #121212;
  --muted: #514f4a;
  --line: rgba(18, 18, 18, .3);
  --accent: #5648c9;
  --signal: #f14f36;
  --band: #5648c9;
  --band-ink: #fffdf8;
  --display: Didot, Bodoni 72, Iowan Old Style, serif;
  --sans: Avenir Next, Avenir, Helvetica Neue, sans-serif;
}

html[data-direction="aperture"] {
  --bg: #ecf0ed;
  --surface: #f8faf7;
  --ink: #172326;
  --muted: #536064;
  --line: rgba(23, 35, 38, .28);
  --accent: #1d5f67;
  --signal: #ee5d3d;
  --band: #b8d8d1;
  --display: American Typewriter, Courier Prime, Courier New, monospace;
  --sans: Helvetica Neue, Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { overflow-x: hidden; scroll-behavior: smooth; }

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.55;
  text-rendering: optimizeLegibility;
}

img { display: block; max-width: 100%; }
a { color: inherit; text-underline-offset: .18em; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

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

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 10px;
  left: 10px;
  padding: 10px 14px;
  transform: translateY(-150%);
  background: var(--ink);
  color: #fff;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: 700;
}
.skip-link:focus { transform: none; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

.section-shell,
.site-header,
.site-footer {
  width: min(calc(100% - 64px), var(--measure));
  margin-inline: auto;
}

.study-switcher {
  position: relative;
  z-index: 40;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 42px;
  padding: 6px max(20px, calc((100vw - var(--measure)) / 2));
  border-bottom: 1px solid var(--line);
  background: var(--ink);
  color: #fff;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.study-switcher > a { justify-self: start; }
.study-switcher strong { font-weight: 650; }
.study-switcher div { justify-self: end; display: flex; gap: 5px; }
.study-switcher div a {
  display: grid;
  min-width: 26px;
  height: 26px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.42);
  text-decoration: none;
}
.study-switcher div a[aria-current="page"] { background: var(--signal); color: #fff; border-color: var(--signal); }

.site-header {
  position: relative;
  z-index: 30;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 34px;
  min-height: 94px;
  border-bottom: 1px solid var(--line);
}
.site-mark {
  color: inherit;
  font-family: var(--display);
  font-size: 25px;
  font-weight: 700;
  letter-spacing: -.055em;
  text-decoration: none;
}
.site-mark span { color: var(--signal); }
.main-nav { display: flex; justify-content: flex-end; align-items: center; gap: clamp(18px, 3vw, 42px); }
.main-nav a, .nav-button, .subscribe-link {
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.main-nav a { padding-block: 13px; }
.main-nav a:hover, .nav-button:hover { color: var(--accent); }
.subscribe-link {
  padding: 10px 16px;
  border: 1px solid currentColor;
}
.menu-button { display: none; }

.hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .76fr);
  gap: clamp(44px, 6vw, 88px);
  align-items: start;
  min-height: 0;
  padding-block: clamp(34px, 4.5vw, 63px) clamp(68px, 8vw, 108px);
}
.hero-copy { position: relative; z-index: 3; }
.hero-role, .eyebrow, .option-label, .book-meta {
  margin: 0 0 17px;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.hero h1 {
  max-width: 850px;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(54px, 6.3vw, 96px);
  font-weight: 500;
  letter-spacing: -.052em;
  line-height: .98;
}
.title-mark {
  position: relative;
  display: inline-block;
  z-index: 0;
}
.title-mark::after {
  position: absolute;
  z-index: -1;
  left: -.03em;
  right: -.03em;
  bottom: -.03em;
  height: .085em;
  min-height: 6px;
  background: var(--accent);
  content: "";
  opacity: .9;
  transform: scaleX(0) rotate(-1.3deg);
  transform-origin: left center;
  animation: draw-mark .9s cubic-bezier(.16,.72,.24,1) .42s forwards;
}
@keyframes draw-mark { to { transform: scaleX(1) rotate(-1.3deg); } }
.hero-intro { max-width: 660px; margin: 32px 0 0; color: var(--muted); font-size: clamp(17px, 1.7vw, 21px); }
.hero-links { display: flex; align-items: center; gap: 26px; margin-top: 36px; }
.button {
  display: inline-flex;
  min-height: 47px;
  align-items: center;
  justify-content: center;
  padding: 11px 21px;
  border: 1px solid currentColor;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.3;
  text-decoration: none;
  text-transform: none;
  cursor: pointer;
}
.button-primary { border-color: var(--ink); background: var(--ink); color: #fff; }
.button-primary:hover { border-color: var(--signal); background: var(--signal); color: #fff; }
.button-small { min-height: 41px; padding: 8px 14px; font-size: 14px; }
.text-link { font-weight: 750; text-underline-offset: .26em; }
.button-reset { padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; text-decoration: underline; text-underline-offset: .26em; }
.hero-media {
  position: relative;
  z-index: 1;
  width: min(100%, 430px);
  margin: 0 30px 0 0;
  justify-self: end;
}
.hero-media::before {
  position: absolute;
  z-index: 4;
  top: -29px;
  left: -29px;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  background: var(--signal);
  content: "";
  mix-blend-mode: multiply;
  pointer-events: none;
  animation: signal-arrival 4.8s cubic-bezier(.16,.7,.18,1) .12s both;
}
.hero-media::after {
  position: absolute;
  z-index: -1;
  top: -7px;
  right: -30px;
  bottom: -8px;
  left: 17px;
  background: #c7a45c;
  content: "";
  transform: perspective(780px) rotateY(-5deg) rotateZ(.6deg);
  transform-origin: left center;
}
.hero-image-wrap {
  position: relative;
  z-index: 1;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #b9c5d5;
  box-shadow: 8px 10px 16px rgba(23,23,23,.22), 0 18px 34px rgba(0,0,0,.2);
}
.hero-image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 8% 50%;
  filter: grayscale(1) contrast(1.06);
}
.hero-media figcaption {
  position: relative;
  z-index: 2;
  max-width: 100%;
  margin: 0;
  padding: 9px 0 3px 24px;
  color: #30291d;
  font-size: 12px;
  text-align: right;
}
@keyframes signal-arrival {
  from { opacity: 0; transform: translateX(calc(100vw + 160px)) scale(.82); }
  to { opacity: .92; transform: translateX(0) scale(1); }
}
.pattern-band {
  position: relative;
  display: grid;
  height: 132px;
  overflow: hidden;
  place-items: center;
  border-block: 0;
  background: var(--band);
  color: var(--band-ink);
}
.pattern-stage { position: relative; width: min(94vw, 1540px); height: 100%; }
.pattern-stage > * { position: absolute; display: block; }
.pattern-stage .thread { left: -4%; width: 108%; height: 1px; background: currentColor; opacity: .68; }
.pattern-stage .thread-a { top: 34%; transform: rotate(2.5deg); }
.pattern-stage .thread-b { top: 53%; transform: rotate(-2deg); }
.pattern-stage .thread-c { top: 69%; transform: rotate(.8deg); }
.pattern-ring { border: 1px solid currentColor; border-radius: 50%; opacity: .78; }
.ring-a { top: 12%; left: 8%; width: 36%; height: 76%; animation: loom-rock 13s ease-in-out infinite alternate; }
.ring-b { top: 5%; left: 36%; width: 32%; height: 90%; animation: loom-rock 16s ease-in-out -5s infinite alternate-reverse; }
.ring-c { top: 17%; right: 5%; width: 34%; height: 68%; animation: loom-rock 11s ease-in-out -2s infinite alternate; }
.pattern-node { width: 13px; height: 13px; border-radius: 50%; background: var(--signal); }
.node-a { top: calc(34% - 6px); left: 6%; animation: node-run 12s ease-in-out infinite alternate; }
.node-b { top: calc(53% - 6px); left: 79%; animation: node-run-reverse 17s ease-in-out infinite alternate; }
.node-c { top: calc(69% - 5px); left: 48%; width: 10px; height: 10px; background: currentColor; animation: node-breathe 4s ease-in-out infinite; }
@keyframes loom-rock { from { transform: rotate(-3deg) scaleX(.96); } to { transform: rotate(4deg) scaleX(1.04); } }
@keyframes node-run { from { transform: translateX(0); } to { transform: translateX(77vw); } }
@keyframes node-run-reverse { from { transform: translateX(0); } to { transform: translateX(-68vw); } }
@keyframes node-breathe { 50% { transform: scale(1.8); opacity: .35; } }

.books-section, .stories-section { padding-block: var(--section-space); }
.section-intro { display: grid; grid-template-columns: 180px minmax(0, .95fr) minmax(230px, .7fr); gap: 34px; align-items: end; margin-bottom: 68px; }
.section-intro .eyebrow { align-self: start; padding-top: 12px; }
.section-intro h2, .contact-band h2, .pursuits-intro h1, .pursuit-section h2 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(42px, 5.2vw, 74px);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: 1;
}
.section-intro > p:last-child { margin: 0; color: var(--muted); font-size: 17px; }
.section-intro-simple { display: block; margin-bottom: 68px; }
.published-books { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(44px, 7vw, 90px); }
.published-book { position: relative; display: grid; grid-template-columns: minmax(180px, .8fr) minmax(210px, 1fr); gap: 29px; padding-top: 46px; border-top: 1px solid var(--ink); }
.published-book .year { position: absolute; top: 10px; left: 0; color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: .12em; }
.cover-stage {
  display: grid;
  min-height: 365px;
  align-items: center;
  justify-items: center;
  padding: 25px;
  background: var(--surface);
}
.cover-stage img { width: auto; height: auto; max-height: 335px; object-fit: contain; box-shadow: 0 13px 25px rgba(0,0,0,.18); }
.books-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3.5vw, 52px); }
.book-entry { position: relative; display: grid; grid-template-rows: auto 395px 1fr; gap: 22px; padding-top: 40px; border-top: 1px solid var(--ink); }
.book-entry .year { position: absolute; top: 9px; left: 0; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.book-entry .cover-stage {
  --cover-backplate: #c5d0de;
  position: relative;
  min-height: 0;
  height: 395px;
  isolation: isolate;
  justify-items: start;
  padding: 25px 0;
  background: transparent;
}
.book-entry .cover-stage::before {
  position: absolute;
  z-index: -1;
  top: 14%;
  left: 0;
  width: min(74%, 240px);
  height: 76%;
  background: var(--cover-backplate);
  content: "";
  transform: translate(16px, 10px) perspective(720px) rotateY(-7deg) rotateZ(-1.1deg);
  transform-origin: left center;
}
.cover-stage-sinai { --cover-backplate: #b8c7d8 !important; }
.cover-stage-kansmachine { --cover-backplate: #cfad68 !important; }
.cover-stage-manuscript { --cover-backplate: #b9a99a !important; }
.book-entry .cover-stage-kansmachine::before { transform: translate(19px, 8px) perspective(720px) rotateY(6deg) rotateZ(1.35deg); transform-origin: right center; }
.book-entry .cover-stage-manuscript::before { transform: translate(13px, 12px) perspective(720px) rotateY(-4deg) rotateZ(.45deg); }
.book-entry .cover-stage img {
  position: relative;
  z-index: 1;
  max-height: 345px;
  box-shadow: 8px 10px 16px rgba(23,23,23,.22), 0 18px 32px rgba(0,0,0,.2);
}
.book-entry .book-copy { align-self: start; }
.book-entry .book-copy h3 { font-size: clamp(29px, 3vw, 43px); }
.book-entry .book-copy blockquote { font-size: 15px; }
.manuscript-placeholder {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(100%, 224px);
  height: auto;
  aspect-ratio: 13 / 20;
  place-items: center;
  padding: 28px;
  background: #eeeae1;
  box-shadow: 8px 10px 16px rgba(23,23,23,.22), 0 18px 32px rgba(0,0,0,.2);
  font-family: var(--sans);
  font-size: clamp(22px, 2.2vw, 31px);
  font-weight: 650;
  line-height: 1.05;
  text-align: center;
}
.book-copy { align-self: center; }
.book-copy h3, .manuscript-copy h3, .story-card h3, .newsletter-band h3 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(30px, 3vw, 46px);
  font-weight: 550;
  letter-spacing: -.035em;
  line-height: 1.05;
}
.book-copy > p:not(.book-meta) { margin: 20px 0; color: var(--muted); }
.book-copy blockquote { margin: 22px 0; padding-left: 15px; border-left: 3px solid var(--signal); font-family: var(--display); font-size: 17px; }
.book-copy cite { display: block; margin-top: 7px; font-family: var(--sans); font-size: 11px; font-style: normal; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.book-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; }
.book-actions .text-link { font-size: 12px; }
.manuscript-feature {
  position: relative;
  display: grid;
  grid-template-columns: minmax(160px, .45fr) minmax(340px, 1.15fr) minmax(180px, .55fr);
  gap: clamp(30px, 6vw, 85px);
  align-items: center;
  margin-top: 92px;
  padding: clamp(38px, 6vw, 78px);
  overflow: hidden;
  border: 1px solid var(--ink);
  background: var(--surface);
}
.manuscript-status { align-self: start; }
.manuscript-status > p:last-child { color: var(--muted); font-size: 12px; line-height: 1.8; }
.manuscript-lede { color: var(--ink) !important; font-family: var(--display); font-size: 20px; }
.manuscript-copy > p { color: var(--muted); }
.manuscript-thread { position: relative; display: grid; min-height: 270px; place-items: center; }
.manuscript-thread::before, .manuscript-thread::after, .manuscript-thread span, .manuscript-thread i {
  position: absolute;
  border: 1px solid var(--accent);
  border-radius: 50%;
  content: "";
}
.manuscript-thread::before { width: 228px; height: 96px; transform: rotate(24deg); }
.manuscript-thread::after { width: 228px; height: 96px; transform: rotate(-24deg); }
.manuscript-thread span { width: 96px; height: 228px; transform: rotate(24deg); }
.manuscript-thread i { width: 96px; height: 228px; transform: rotate(-24deg); }
.manuscript-thread b { position: relative; z-index: 2; padding: 4px 8px; background: var(--surface); font-size: 10px; letter-spacing: .15em; }

.stories-section { border-top: 1px solid var(--line); }
.filter-panel { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; padding: 20px 0; border-block: 1px solid var(--line); }
.filter-group { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.filter-group > span { margin-right: 5px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.filter-group button, .clear-filters {
  min-height: 32px;
  padding: 5px 10px;
  border: 1px solid var(--ink);
  border-radius: 99px;
  background: transparent;
  color: inherit;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.filter-group button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent); color: white; }
.clear-filters { margin-left: auto; border: 0; text-decoration: underline; text-underline-offset: .2em; }
.clear-filters:disabled { opacity: .35; cursor: default; }
.filter-status { margin: 15px 0 28px; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.story-list { border-top: 1px solid var(--ink); }
.story-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(180px, .48fr) minmax(0, 1fr);
  column-gap: 25px;
  row-gap: 14px;
  align-items: baseline;
  padding: 27px 0;
  border-bottom: 1px solid var(--line);
}
.story-card[hidden] { display: none; }
.story-card-copy, .story-card-excerpt { min-width: 0; }
.story-card p { margin: 0; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.story-card h3 { font-size: clamp(25px, 3.2vw, 48px); }
.story-card h3 a { text-decoration: none; }
.story-card h3 a:hover { color: var(--accent); }
.story-card .text-link { grid-column: 1 / -1; }
.newsletter-band {
  display: grid;
  grid-template-columns: 1fr minmax(320px, .8fr);
  gap: clamp(42px, 8vw, 100px);
  align-items: center;
  margin-top: 0;
  padding: clamp(38px, 6vw, 76px);
  background: var(--band);
  color: var(--band-ink);
}
.newsletter-band, .newsletter-band * { font-family: var(--sans); }
.newsletter-band h3 { max-width: 660px; font-size: clamp(34px, 4.6vw, 61px); font-weight: 760; letter-spacing: -.04em; line-height: 1.02; }
.newsletter-band .eyebrow, .newsletter-band > div > p:last-child { color: inherit; }

/* Stories sampler */
.highlighted-stories { border-bottom: 1px solid var(--line); }
.archive-highlights { border-top: 0; }
.stories-sampler-action {
  display: flex;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  padding: 30px 0 0;
}
.stories-sampler-action p { max-width: 520px; margin: 0; color: var(--muted); font-size: 14px; }

/* Stories archive */
.stories-hero {
  position: relative;
  min-height: 0;
  padding-block: clamp(38px, 5vw, 68px) clamp(48px, 6vw, 78px);
  border-bottom: 1px solid var(--ink);
}
.stories-hero h1 {
  position: relative;
  isolation: isolate;
  width: fit-content;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(88px, 12vw, 172px);
  font-weight: 500;
  letter-spacing: -.075em;
  line-height: .8;
}
.page-title-word { position: relative; z-index: 1; }
.page-title-signal {
  position: absolute;
  z-index: 0;
  top: -.18em;
  left: -.12em;
  width: clamp(112px, 10vw, 158px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--signal);
  mix-blend-mode: multiply;
  pointer-events: none;
  animation: signal-arrival 4.8s cubic-bezier(.16,.7,.18,1) .12s both;
}
.page-title-deck { position: relative; z-index: 1; margin: 30px 0 0; color: var(--muted); font-size: clamp(15px, 1.6vw, 19px); }
.archive-total { display: flex; gap: 12px; align-items: baseline; margin: 28px 0 0; font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.archive-total strong { color: var(--signal); font-family: var(--display); font-size: 45px; font-weight: 500; letter-spacing: -.04em; line-height: 1; }

.series-shelf { padding-block: var(--section-space); border-bottom: 1px solid var(--line); }
.series-shelf .section-intro-simple { margin-bottom: 46px; }
.series-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.series-card { position: relative; display: flex; min-height: 410px; flex-direction: column; padding: clamp(28px, 4vw, 52px); border: 1px solid var(--ink); overflow: hidden; background: var(--surface); }
.series-card::after { display: none; }
.series-card h3 { position: relative; z-index: 1; max-width: 520px; font-size: clamp(34px, 4.2vw, 62px); }
.series-card > p:not(.series-number) { position: relative; z-index: 1; max-width: 600px; color: var(--muted); font-size: 16px; }
.series-number { margin: 0 0 50px; color: var(--signal); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.series-card > div { position: relative; z-index: 2; display: flex; gap: 18px; align-items: center; margin-top: auto; padding-top: 28px; }
.bunny-series { background: var(--band); color: var(--band-ink); }
.bunny-series::after { box-shadow: 0 0 0 28px var(--band), 0 0 0 29px currentColor; }
.bunny-series > p:not(.series-number) { color: inherit; opacity: .76; }

.archive-section { padding-block: clamp(58px, 7vw, 98px); }
.archive-heading { margin-bottom: 36px; }
.archive-heading h2 { margin: 0; font-family: var(--display); font-size: clamp(48px, 6.5vw, 88px); font-weight: 500; letter-spacing: -.055em; line-height: .95; }
.archive-filters { display: grid; gap: 10px; padding: 20px 0; border-block: 1px solid var(--line); }
.archive-filter-group { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.archive-filter-group > span { margin-right: 4px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.archive-filter-group button, .clear-archive-filters {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font-size: 11px;
  font-weight: 720;
  cursor: pointer;
}
.archive-filter-group button:hover { border-color: var(--ink); }
.archive-filter-group button[aria-pressed="true"] { border-color: var(--accent); background: var(--accent); color: #fff; }
.clear-archive-filters { margin-left: auto; border: 0; text-decoration: underline; text-underline-offset: .25em; }
.archive-result-bar { display: flex; justify-content: space-between; gap: 30px; padding: 18px 0; color: var(--muted); font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.archive-result-bar p { margin: 0; }
.archive-result-bar p:last-child { color: var(--signal); }
.archive-list { border-top: 1px solid var(--ink); }
.archive-story {
  position: relative;
  display: grid;
  grid-template-columns: minmax(260px, .68fr) minmax(0, 1.1fr) minmax(145px, .3fr) 26px;
  gap: 26px;
  align-items: center;
  min-height: 142px;
  padding: 27px 0;
  border-bottom: 1px solid var(--line);
}
.archive-story p { margin: 0; }
.archive-story-meta, .archive-story-collection { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.archive-story-collection { position: relative; z-index: 2; display: none; width: fit-content; text-underline-offset: .25em; }
.archive-story-collection[data-collection-name="Bunny diaries"],
.archive-story-collection[data-collection-name="Jerusalem Post: Ramallah dispatches"] { display: block; }
.story-card-collection { display: none; }
.story-card-collection[data-collection-name="Bunny diaries"],
.story-card-collection[data-collection-name="Jerusalem Post: Ramallah dispatches"] { display: inline; }
.archive-story-copy, .archive-story-excerpt { min-width: 0; }
.archive-story h3 {
  max-width: 100%;
  font-size: clamp(24px, 2.6vw, 39px);
  overflow-wrap: anywhere;
  -webkit-hyphens: auto;
  hyphens: auto;
}
.archive-story h3 a { text-decoration: none; }
.archive-story h3 a::after { position: absolute; inset: 0; content: ""; }
.archive-story h3 a:hover { color: var(--accent); }
.archive-story > span { justify-self: end; font-size: 20px; }
.archive-empty { margin: 0; padding: 60px 0; color: var(--muted); font-size: 18px; }
.archive-pagination { display: flex; gap: 6px; padding: 30px 0 0; overflow-x: auto; scrollbar-width: thin; }
.archive-pagination button { flex: 0 0 auto; min-height: 40px; padding: 8px 12px; border: 1px solid var(--line); background: transparent; color: inherit; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 13px; font-weight: 700; cursor: pointer; }
.archive-pagination button:hover:not(:disabled) { border-color: var(--ink); background: var(--surface); }
.archive-pagination button[aria-current="page"] { border-color: var(--ink); background: var(--ink); color: #fff; }
.archive-pagination button:disabled { opacity: .32; cursor: default; }

/* Individual Story pages */
.article-shell { width: min(calc(100% - 64px), 920px); margin-inline: auto; padding-block: 54px var(--section-space); }
.article-back { margin-bottom: 70px; font-size: 12px; font-weight: 750; }
.article-header { padding-bottom: 55px; border-bottom: 1px solid var(--ink); }
.article-header h1 { max-width: 900px; margin: 18px 0 30px; font-family: var(--display); font-size: clamp(55px, 8.2vw, 110px); font-weight: 500; letter-spacing: -.065em; line-height: .91; }
.article-summary { max-width: 750px; margin: 0; color: var(--muted); font-family: var(--display); font-size: clamp(23px, 3vw, 34px); line-height: 1.25; }
.article-meta { margin-top: 35px; color: var(--muted); font-size: 10px; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; }
.article-body { width: min(100%, 720px); margin: 70px auto 0; font-family: var(--display); font-size: clamp(19px, 2.1vw, 23px); line-height: 1.72; }
.article-body p { margin: 0 0 1.35em; }
.article-body p:first-child::first-letter { float: left; margin: .08em .1em 0 0; color: var(--signal); font-size: 4.2em; line-height: .72; }
.article-editorial-note { width: min(100%, 720px); margin: 70px auto 0; padding: 30px; border-left: 5px solid var(--signal); background: var(--surface); }
.article-editorial-note h2 { margin: 0 0 10px; font-family: var(--display); font-size: 31px; font-weight: 500; }
.article-editorial-note p { margin: 0; color: var(--muted); }
.series-navigation { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 85px; padding-top: 26px; border-top: 1px solid var(--line); }
.series-navigation a { padding: 15px; border: 1px solid var(--line); text-decoration: none; }
.series-navigation a:hover { border-color: var(--accent); color: var(--accent); }

html[data-direction="independent"] .stories-hero h1,
html[data-direction="independent"] .archive-heading h2,
html[data-direction="independent"] .series-card h3,
html[data-direction="independent"] .article-header h1 { font-family: var(--sans); font-weight: 900; letter-spacing: -.075em; }
html[data-direction="independent"] .series-card { border-width: 3px; box-shadow: 12px 12px 0 var(--ink); }
html[data-direction="counterpoint"] .series-card:first-child { transform: rotate(-.45deg); }
html[data-direction="counterpoint"] .series-card:last-child { transform: translateY(17px) rotate(.45deg); box-shadow: 12px 12px 0 var(--signal); }
html[data-direction="counterpoint"] .archive-story:nth-child(3n + 2) h3 { padding-left: clamp(0px, 3vw, 42px); }
html[data-direction="aperture"] .stories-hero::after { position: absolute; right: 1%; bottom: 36px; width: 210px; aspect-ratio: 1; border: 1px solid var(--accent); border-radius: 50%; content: ""; box-shadow: 0 0 0 28px var(--bg), 0 0 0 29px var(--accent); }
html[data-direction="aperture"] .series-card { border-radius: 0 85px 0 0; }
html[data-direction="aperture"] .archive-story { border-bottom-style: dotted; }
.inline-subscribe label { display: block; margin-bottom: 9px; font-size: 12px; font-weight: 800; }
.inline-subscribe > div { display: flex; }
.inline-subscribe input { width: 100%; min-height: 49px; padding: 11px 13px; border: 1px solid currentColor; border-right: 0; background: rgba(255,255,255,.72); color: #111; }
.inline-subscribe .button { background: var(--ink); color: #fff; }
.form-note, .form-status { margin: 10px 0 0; font-size: 11px; }
.newsletter-signup .form-message {
  margin: 0;
  padding: 16px 18px;
  border-left: 4px solid var(--accent);
  background: rgba(255,255,255,.24);
  font-size: 14px;
  line-height: 1.55;
}
.newsletter-signup .form-message--error { border-left-color: var(--signal); }
.newsletter-signup .form-message:not([hidden]) + .inline-subscribe { display: none; }

.bio-section {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 34px;
  padding-block: var(--section-space);
  border-bottom: 1px solid var(--line);
}
.bio-copy { max-width: 860px; margin: 0; font-family: var(--sans); font-size: clamp(17px, 1.55vw, 21px); letter-spacing: 0; line-height: 1.65; }
.about-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .72fr);
  gap: clamp(52px, 9vw, 130px);
  align-items: center;
  min-height: 0;
  padding-block: clamp(42px, 6vw, 82px);
}
.about-copy h1 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(48px, 6.5vw, 88px);
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .95;
}
.about-copy > p:last-child { max-width: 790px; margin: 32px 0 0; font-size: 18px; line-height: 1.7; }
.about-portrait { position: relative; margin: 0; }
.about-portrait::after { position: absolute; z-index: -1; inset: 18px -24px -22px 18px; background: #c7a45c; content: ""; transform: perspective(760px) rotateY(-5deg) rotateZ(.6deg); }
.about-portrait div { aspect-ratio: 4 / 5; overflow: hidden; box-shadow: 0 13px 25px rgba(0,0,0,.18); }
.about-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 9% 50%; filter: grayscale(1) contrast(1.06); }
.legal-shell { width: min(calc(100% - 64px), 980px); padding-block: clamp(42px, 6vw, 82px); }
.legal-header { padding-bottom: 58px; border-bottom: 1px solid var(--ink); }
.legal-header h1 { max-width: 900px; margin: 0; font-family: var(--display); font-size: clamp(54px, 7vw, 96px); font-weight: 500; letter-spacing: -.06em; line-height: .9; }
.legal-header > p:last-child { max-width: 680px; margin: 30px 0 0; color: var(--muted); font-size: 17px; }
.legal-copy { width: min(100%, 720px); margin: 65px auto 0; }
.legal-copy section { padding: 0 0 35px; }
.legal-copy h2 { margin: 0 0 10px; font-family: var(--display); font-size: clamp(28px, 3vw, 40px); font-weight: 550; letter-spacing: -.03em; }
.legal-copy p { margin: 0; color: var(--muted); font-size: 17px; line-height: 1.75; }
.contact-band { padding-block: var(--section-space); text-align: center; }
.contact-band h2 { max-width: 760px; margin-inline: auto; font-size: clamp(34px, 4.4vw, 58px); }
.contact-band > p:not(.eyebrow) { max-width: 680px; margin: 28px auto; color: var(--muted); font-size: 17px; }

.site-footer {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 30px;
  align-items: center;
  padding-block: 34px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.site-footer div { display: flex; justify-content: center; flex-wrap: wrap; gap: 18px 24px; }
.site-footer p { margin: 0; color: var(--muted); }
.social-link { display: inline-flex; gap: 7px; align-items: center; }
.social-icon { position: relative; display: inline-block; width: 16px; height: 16px; flex: 0 0 16px; }
.substack-icon { color: #ff6719; border-top: 2px solid currentColor; border-bottom: 7px double currentColor; }
.substack-icon::after { position: absolute; right: 3px; bottom: -1px; left: 3px; height: 6px; background: currentColor; clip-path: polygon(0 0,100% 0,50% 100%); content: ""; }
.instagram-icon { border: 0; border-radius: 4px; background: radial-gradient(circle at 30% 105%, #ffd600 0 20%, #ff7a00 35%, #ff0169 58%, #d300c5 76%, #7638fa 100%); box-shadow: inset 0 0 0 1.4px rgba(255,255,255,.95); }
.instagram-icon::before { position: absolute; inset: 3.5px; border: 1.5px solid #fff; border-radius: 50%; content: ""; }
.instagram-icon::after { position: absolute; top: 2.6px; right: 2.6px; width: 2.8px; height: 2.8px; border-radius: 50%; background: #fff; content: ""; }

.site-dialog {
  width: min(580px, calc(100% - 28px));
  max-height: calc(100vh - 28px);
  padding: clamp(28px, 5vw, 55px);
  overflow-y: auto;
  border: 1px solid var(--ink);
  border-radius: 0;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 26px 100px rgba(0,0,0,.3);
}
.site-dialog::backdrop { background: rgba(10,10,10,.62); backdrop-filter: blur(4px); }
.site-dialog h2 { margin: 0 0 16px; font-family: var(--display); font-size: clamp(36px, 6vw, 55px); line-height: 1; }
.dialog-close { position: absolute; top: 12px; right: 15px; border: 0; background: transparent; color: inherit; font-size: 30px; cursor: pointer; }
.site-dialog form { display: grid; gap: 9px; margin-top: 25px; }
.site-dialog label { margin-top: 7px; font-size: 12px; font-weight: 800; }
.site-dialog input:not([type="checkbox"]), .site-dialog select, .site-dialog textarea { width: 100%; padding: 11px; border: 1px solid var(--line); background: #fff; color: #111; }
.site-dialog .button { margin-top: 13px; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 15px; font-style: normal; font-weight: 700; letter-spacing: 0; line-height: 1.3; }
.order-price-note { margin: 20px 0 0; color: var(--muted); font-family: var(--sans); font-size: 12px; line-height: 1.65; }
.order-choices { display: grid; gap: 7px; margin: 6px 0 4px; padding: 0; border: 0; }
.order-choices legend { margin-bottom: 6px; padding: 0; font-size: 12px; font-weight: 800; }
.site-dialog .book-choice { display: flex; gap: 10px; align-items: center; margin: 0; padding: 3px 0; border: 0; font-size: 14px; cursor: pointer; }
.book-choice input { width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }
.checkbox-row { display: grid; grid-template-columns: auto 1fr; gap: 9px; align-items: start; font-weight: 500 !important; }
.checkbox-row input { margin-top: 4px; }

/* Brevo form integration. Structure and hooks come from Brevo's regular HTML
   embed; the presentation is the site's own. Brevo's stylesheet is deliberately
   not loaded so the dialogs keep the Field notes design. */
:where(.sib-form-message-panel) { display: none; }
.site-dialog .sib-form-message-panel {
  margin: 22px 0 0;
  padding: 14px 16px;
  border-left: 4px solid var(--accent);
  background: rgba(0,0,0,.04);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.55;
}
.site-dialog .form-message--error { border-left-color: var(--signal); }
.site-dialog .sib-form-message-panel__text { margin: 0; }
.site-dialog .sib-form { margin: 0; }
.site-dialog .form__entry { display: contents; }
.site-dialog .entry__field { display: block; }
.site-dialog .entry__label { margin-top: 7px; font-size: 12px; font-weight: 800; }
.site-dialog .entry__error {
  display: none;
  margin: 0;
  color: var(--signal);
  font-size: 12px;
  font-weight: 600;
}
.site-dialog .entry__error:not(:empty) { display: block; }
.site-dialog.is-complete form,
.site-dialog.is-complete .order-price-note { display: none; }
.site-dialog .required-mark { color: var(--signal); font-weight: 800; }
.site-dialog .form-privacy-note {
  margin: 14px 0 0;
  color: var(--muted);
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.6;
}
.site-dialog .form-privacy-note a { color: inherit; text-underline-offset: .22em; }
.input--hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; border: 0 !important; }
.toast { position: fixed; z-index: 90; right: 20px; bottom: 20px; max-width: 390px; padding: 13px 17px; transform: translateY(160%); background: var(--ink); color: #fff; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 14px; font-weight: 700; transition: transform .25s ease; }
.toast.is-visible { transform: none; }

.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(22px); transition: opacity .65s ease, transform .65s ease; }
.js .reveal.is-visible { opacity: 1; transform: none; }

/* 02 · Independent review */
html[data-direction="independent"] .site-mark { font-family: var(--sans); font-weight: 900; letter-spacing: -.06em; }
html[data-direction="independent"] .site-header { min-height: 78px; }
html[data-direction="independent"] .hero { grid-template-columns: minmax(0, 1.35fr) minmax(270px, .55fr); min-height: 730px; align-items: end; }
html[data-direction="independent"] .hero h1 { font-family: var(--sans); font-size: clamp(52px, 6.7vw, 104px); font-weight: 900; letter-spacing: -.072em; line-height: .86; text-transform: uppercase; }
html[data-direction="independent"] .hero-intro { max-width: 720px; font-weight: 550; }
html[data-direction="independent"] .hero-image-wrap { aspect-ratio: 3 / 4; box-shadow: 13px 13px 0 var(--signal); }
html[data-direction="independent"] .title-mark::after { bottom: .02em; height: .08em; }
html[data-direction="independent"] .pattern-band { height: 98px; }
html[data-direction="independent"] .section-intro h2,
html[data-direction="independent"] .contact-band h2,
html[data-direction="independent"] .pursuits-intro h1,
html[data-direction="independent"] .pursuit-section h2 { font-family: var(--sans); font-weight: 900; letter-spacing: -.06em; text-transform: uppercase; }
html[data-direction="independent"] .published-book { grid-template-columns: minmax(170px, .72fr) minmax(210px, 1fr); }
html[data-direction="independent"] .book-copy h3,
html[data-direction="independent"] .manuscript-copy h3 { font-family: var(--sans); font-weight: 900; text-transform: uppercase; }
html[data-direction="independent"] .story-list {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 34px 24px;
  padding-top: 35px;
}
html[data-direction="independent"] .story-card {
  display: block;
  grid-column: span 4;
  min-height: 260px;
  padding: 25px 0;
  border-top: 7px solid var(--ink);
  border-bottom: 0;
}
html[data-direction="independent"] .story-card:nth-child(2),
html[data-direction="independent"] .story-card:nth-child(5) { grid-column: span 8; }
html[data-direction="independent"] .story-card:nth-child(3) { align-self: end; min-height: 190px; }
html[data-direction="independent"] .story-card h3 { margin-top: 29px; font-family: var(--sans); font-size: clamp(27px, 3.8vw, 58px); font-weight: 900; letter-spacing: -.055em; text-transform: uppercase; }
html[data-direction="independent"] .story-card > span { position: absolute; right: 0; bottom: 15px; }
html[data-direction="independent"] .story-card[hidden] { display: none; }
html[data-direction="independent"] .newsletter-band h3,
html[data-direction="independent"] .bio-copy { font-family: var(--sans); font-weight: 850; }

/* 03 · Counterpoint */
html[data-direction="counterpoint"] .hero { grid-template-columns: minmax(0, .98fr) minmax(390px, .82fr); }
html[data-direction="counterpoint"] .hero-copy { padding-left: clamp(0px, 3vw, 42px); }
html[data-direction="counterpoint"] .hero-copy::before {
  position: absolute;
  z-index: -1;
  top: -52px;
  left: -5vw;
  width: 38%;
  height: 130%;
  border: 1px solid var(--accent);
  content: "";
  transform: rotate(-2deg);
}
html[data-direction="counterpoint"] .hero h1 { font-size: clamp(57px, 6.5vw, 98px); }
html[data-direction="counterpoint"] .hero-image-wrap { aspect-ratio: 5 / 6; border: 12px solid var(--surface); box-shadow: 25px 24px 0 var(--accent); transform: rotate(1.35deg); }
html[data-direction="counterpoint"] .hero-media figcaption { transform: translateX(23px); }
html[data-direction="counterpoint"] .published-book:nth-child(2) { transform: translateY(40px); }
html[data-direction="counterpoint"] .newsletter-band { transform: rotate(-.35deg); box-shadow: 17px 17px 0 var(--signal); }
html[data-direction="counterpoint"] .manuscript-feature { border-width: 2px; box-shadow: 13px 13px 0 var(--accent); }

/* 04 · Aperture */
html[data-direction="aperture"] .site-mark { letter-spacing: -.08em; }
html[data-direction="aperture"] .hero { grid-template-columns: minmax(0, 1fr) minmax(390px, .78fr); }
html[data-direction="aperture"] .hero::after {
  position: absolute;
  z-index: 0;
  top: 50%;
  right: -12vw;
  width: clamp(480px, 56vw, 760px);
  aspect-ratio: 1;
  border: 1px solid var(--accent);
  border-radius: 50%;
  content: "";
  transform: translateY(-50%);
  box-shadow: 0 0 0 47px var(--bg), 0 0 0 48px var(--line), 0 0 0 94px var(--bg), 0 0 0 95px var(--line);
}
html[data-direction="aperture"] .hero h1 { font-size: clamp(49px, 5.6vw, 82px); line-height: 1.04; }
html[data-direction="aperture"] .hero-image-wrap { position: relative; z-index: 1; aspect-ratio: 1; border-radius: 50%; box-shadow: none; }
html[data-direction="aperture"] .hero-media figcaption { position: relative; z-index: 2; }
html[data-direction="aperture"] .pattern-band { background: var(--ink); color: var(--bg); }
html[data-direction="aperture"] .cover-stage { border-radius: 50% 50% 5px 5px; }
html[data-direction="aperture"] .published-book { border-top-style: dotted; }
html[data-direction="aperture"] .manuscript-feature { border-radius: 150px 0 0 150px; padding-left: clamp(55px, 8vw, 110px); }
html[data-direction="aperture"] .story-card { border-bottom-style: dotted; }
html[data-direction="aperture"] .newsletter-band { border-radius: 0 120px 0 0; }

/* Field notes motion studies: the page stays fixed; only this divider changes. */
.stories-page .site-header { grid-template-columns: auto 1fr auto; }
.series-card h3 { font-family: var(--display); font-size: clamp(34px, 3.7vw, 54px); font-weight: 550; letter-spacing: -.04em; line-height: 1.04; }

html[data-direction="field-final"] .pattern-band {
  background: #d4c495;
  color: #23354c;
}

html[data-direction="field-ribbon"] .pattern-band {
  height: 148px;
  border-block: 0;
  background: #c6b173;
  color: #26313a;
}
html[data-direction="field-ribbon"] .pattern-stage .thread { opacity: .35; }
html[data-direction="field-ribbon"] .thread-a { top: 50%; transform: rotate(0); }
html[data-direction="field-ribbon"] .thread-b { top: 50%; transform: rotate(0) translateY(17px); }
html[data-direction="field-ribbon"] .thread-c { top: 50%; transform: rotate(0) translateY(-17px); }
html[data-direction="field-ribbon"] .pattern-ring { top: 13%; width: 72%; height: 74%; }
html[data-direction="field-ribbon"] .ring-a { left: -7%; animation: ribbon-turn-a 19s linear infinite; }
html[data-direction="field-ribbon"] .ring-b { left: 14%; animation: ribbon-turn-b 23s linear infinite reverse; }
html[data-direction="field-ribbon"] .ring-c { right: -6%; left: auto; animation: ribbon-turn-a 17s linear -6s infinite reverse; }
html[data-direction="field-ribbon"] .node-a { top: calc(50% - 6px); left: 4%; animation-duration: 15s; }
html[data-direction="field-ribbon"] .node-b { top: calc(50% + 11px); animation-duration: 21s; }
html[data-direction="field-ribbon"] .node-c { top: calc(50% - 22px); }
@keyframes ribbon-turn-a { from { transform: rotate(-5deg) scaleX(.72); } 50% { transform: rotate(7deg) scaleX(1.06); } to { transform: rotate(355deg) scaleX(.72); } }
@keyframes ribbon-turn-b { from { transform: rotate(5deg) scaleX(.88); } 50% { transform: rotate(-8deg) scaleX(1.08); } to { transform: rotate(365deg) scaleX(.88); } }

html[data-direction="field-constellation"] .pattern-band {
  height: 150px;
  border-color: rgba(239,244,234,.25);
  background: #19313b;
  color: #d9e0d8;
}
html[data-direction="field-constellation"] .pattern-stage .thread { background: linear-gradient(90deg, transparent, currentColor 10% 90%, transparent); opacity: .36; }
html[data-direction="field-constellation"] .thread-a { top: 29%; transform: rotate(-1deg); }
html[data-direction="field-constellation"] .thread-b { top: 55%; transform: rotate(1.5deg); }
html[data-direction="field-constellation"] .thread-c { top: 77%; transform: rotate(-.5deg); }
html[data-direction="field-constellation"] .pattern-ring { width: 9px; height: 9px; border: 0; background: currentColor; box-shadow: 9vw 22px 0 -2px currentColor, 20vw -11px 0 1px currentColor, 34vw 26px 0 -3px currentColor, 48vw -20px 0 -1px currentColor, 62vw 17px 0 1px currentColor, 76vw -9px 0 -2px currentColor; animation: constellation-drift 18s ease-in-out infinite alternate; }
html[data-direction="field-constellation"] .ring-a { top: 25%; left: 3%; }
html[data-direction="field-constellation"] .ring-b { top: 55%; left: 10%; animation-delay: -7s; animation-direction: alternate-reverse; }
html[data-direction="field-constellation"] .ring-c { top: 75%; left: 0; animation-delay: -11s; }
html[data-direction="field-constellation"] .node-a { top: 22%; animation-duration: 18s; box-shadow: 0 0 0 8px rgba(239,74,53,.14); }
html[data-direction="field-constellation"] .node-b { top: 70%; animation-duration: 22s; }
html[data-direction="field-constellation"] .node-c { top: 49%; background: #d9e0d8; }
@keyframes constellation-drift { to { transform: translateX(7vw) translateY(8px) rotate(12deg); } }

html[data-direction="field-knot"] .pattern-band {
  height: 158px;
  background: #bdc9b9;
  color: #26231e;
}
html[data-direction="field-knot"] .pattern-stage .thread { left: 6%; width: 88%; opacity: .32; }
html[data-direction="field-knot"] .thread-a { top: 23%; transform: rotate(4deg); }
html[data-direction="field-knot"] .thread-b { top: 51%; transform: rotate(-5deg); }
html[data-direction="field-knot"] .thread-c { top: 78%; transform: rotate(3deg); }
html[data-direction="field-knot"] .pattern-ring { top: -12%; width: 68%; height: 124%; transform-origin: center; }
html[data-direction="field-knot"] .ring-a { left: -2%; animation: knot-fold-a 13s cubic-bezier(.55,.05,.45,.95) infinite alternate; }
html[data-direction="field-knot"] .ring-b { left: 17%; animation: knot-fold-b 17s cubic-bezier(.55,.05,.45,.95) -5s infinite alternate-reverse; }
html[data-direction="field-knot"] .ring-c { right: -3%; left: auto; animation: knot-fold-a 21s cubic-bezier(.55,.05,.45,.95) -9s infinite alternate-reverse; }
html[data-direction="field-knot"] .node-a { top: 16%; animation-duration: 14s; }
html[data-direction="field-knot"] .node-b { top: 72%; animation-duration: 19s; }
html[data-direction="field-knot"] .node-c { top: 47%; left: 52%; background: var(--accent); animation: node-breathe 3s ease-in-out infinite; }
@keyframes knot-fold-a { from { transform: rotate(-9deg) scaleX(.54) skewX(8deg); } to { transform: rotate(12deg) scaleX(1.08) skewX(-10deg); } }
@keyframes knot-fold-b { from { transform: rotate(10deg) scaleX(.68) skewX(-9deg); } to { transform: rotate(-13deg) scaleX(1.12) skewX(11deg); } }

/* Pursuits */
.pursuits-page .stories-hero { padding-block: clamp(28px, 3.5vw, 46px) clamp(30px, 4vw, 52px); }
.pursuits-page .stories-hero h1 { font-size: clamp(62px, 7.2vw, 104px); line-height: .86; }
.pursuits-page .page-title-signal { width: clamp(76px, 8vw, 108px); }
.pursuit-section { border-bottom: 1px solid var(--line); }
.pursuit-bacongo {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) repeat(2, minmax(170px, 230px));
  gap: clamp(24px, 3.2vw, 48px);
  align-items: start;
  padding-block: clamp(44px, 5vw, 70px);
}
.pursuit-bacongo figure { margin: 0; }
.pursuit-heading-lockup {
  position: relative;
  display: inline-block;
  margin-bottom: 46px;
}
.pursuit-copy h2 {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(44px, 4.5vw, 66px);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: 1;
}
.pursuit-copy > p { max-width: 570px; margin: 0; color: var(--muted); font-size: 17px; }
.pursuit-copy .pursuit-subtitle {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: max-content;
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: normal;
  line-height: 1.45;
  white-space: nowrap;
}
.pursuit-image-stage {
  position: relative;
  isolation: isolate;
  width: 100%;
  max-width: 230px;
}
.pursuit-image-stage::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: var(--image-backing);
  content: "";
}
.pursuit-image-stage-poster { --image-backing: #a9b9b2; }
.pursuit-image-stage-poster::before { transform: translate(-9px, 10px) rotate(-2.2deg); }
.pursuit-image-stage-opening { --image-backing: #c9a95f; }
.pursuit-image-stage-opening::before { transform: translate(10px, 9px) rotate(2.5deg); }
.pursuit-image-stage img {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  box-shadow: 0 10px 20px rgba(28, 25, 20, .22);
}
.pursuit-album { width: 100%; height: auto; object-fit: contain; }
.pursuit-poster figcaption { max-width: 230px; margin-top: 12px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.pursuit-music {
  display: flex;
  gap: clamp(24px, 3.5vw, 44px);
  align-items: center;
  padding-block: clamp(42px, 5vw, 68px);
  border-bottom: 1px solid var(--line);
}
.pursuit-album { flex: 0 0 auto; width: clamp(118px, 12vw, 168px); box-shadow: 9px 9px 0 var(--signal); }
.pursuit-music-copy h2 { margin: 0 0 10px; font-family: var(--sans); font-size: 11px; font-weight: 750; letter-spacing: .13em; line-height: 1.3; }
.pursuit-music-copy p { margin: 0 0 22px; color: var(--ink); font-size: clamp(18px, 2vw, 25px); }

/* Overview */
.overview-page { --bg: #e7e2d9; background: var(--bg); }
.overview-header, .overview-footer, .overview-main { width: min(calc(100% - 64px), 1380px); margin-inline: auto; }
.overview-header { display: flex; justify-content: space-between; align-items: baseline; padding: 28px 0; border-bottom: 1px solid #1b1a18; }
.overview-mark { font-family: Iowan Old Style, Georgia, serif; font-size: 24px; font-weight: 700; text-decoration: none; }
.overview-mark span { color: #ed4d3b; }
.overview-header p { margin: 0; font-size: 11px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.overview-intro { display: grid; grid-template-columns: .4fr 1.5fr 1fr; gap: 35px; padding: 75px 0 68px; }
.kicker { margin: 9px 0 0; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.overview-intro h1 { margin: 0; font-family: Iowan Old Style, Georgia, serif; font-size: clamp(55px, 7vw, 100px); font-weight: 500; letter-spacing: -.055em; line-height: .9; }
.overview-intro > p:last-child { max-width: 500px; margin: 10px 0 0; font-size: 17px; }
.motion-options-list { display: grid; gap: 26px; padding-bottom: 58px; }
.motion-option-card { border: 1px solid #1b1a18; background: #f8f4ec; }
.motion-option-copy {
  display: grid;
  grid-template-columns: 130px minmax(220px, .7fr) minmax(260px, 1fr) auto;
  gap: 24px;
  align-items: baseline;
  padding: 25px 28px;
}
.motion-option-copy .option-label { margin: 0; }
.motion-option-copy h2 { margin: 0; font-family: Iowan Old Style, Georgia, serif; font-size: clamp(29px, 3vw, 43px); font-weight: 500; letter-spacing: -.035em; line-height: 1; }
.motion-option-copy p { margin: 0; }
.motion-option-copy a { font-size: 13px; font-weight: 700; white-space: nowrap; }
.motion-live-preview { display: block; width: 100%; height: 158px; border: 0; background: transparent; }
.motion-choice-note { margin: 0 0 80px; padding: 28px; border-left: 6px solid #ed4d3b; background: #f8f4ec; font-size: 17px; }
.motion-strip-page { display: grid; min-height: 100vh; margin: 0; overflow: hidden; place-items: center; background: transparent; }
.motion-strip-page .pattern-band { width: 100vw; }
.finalist-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.finalist-card { display: flex; min-height: 575px; flex-direction: column; padding: clamp(25px, 4vw, 50px); border: 1px solid #1b1a18; background: #f8f4ec; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.finalist-card:hover { transform: translateY(-5px); box-shadow: 0 14px 0 rgba(0,0,0,.13); }
.finalist-card > strong { margin-top: 31px; font-family: Iowan Old Style, Georgia, serif; font-size: 39px; line-height: 1; }
.finalist-card > p { max-width: 510px; }
.open-link { margin-top: auto; font-size: 12px; font-weight: 800; text-decoration: underline; text-underline-offset: .23em; }
.miniature { position: relative; display: block; height: 280px; margin-top: 22px; overflow: hidden; border: 1px solid currentColor; background: #f1ede4; }
.miniature b { position: absolute; top: 34px; left: 34px; z-index: 2; font-family: Iowan Old Style, Georgia, serif; font-size: clamp(20px, 2.5vw, 39px); font-weight: 500; letter-spacing: -.04em; line-height: .93; text-decoration: none; }
.miniature i { position: absolute; right: 0; width: 35%; height: 100%; background: linear-gradient(135deg, #bbb 0 24%, #333 24% 27%, #ddd 27% 55%, #777 55%); filter: grayscale(1); }
.miniature em { position: absolute; z-index: 3; top: 24px; right: 30%; width: 25px; height: 25px; border-radius: 50%; background: #ed4d3b; }
.miniature u { position: absolute; z-index: 2; left: 38%; bottom: 47px; width: 20%; height: 7px; background: #5b4dc6; transform: rotate(-2deg); }
.card-independent { background: #fff; }
.card-independent .miniature { background: #f8f7f2; border-width: 3px; }
.card-independent .miniature b { font-family: Arial Black, Arial, sans-serif; font-size: clamp(18px, 2.3vw, 33px); font-weight: 900; }
.card-independent .miniature em { border-radius: 0; width: 45px; height: 45px; }
.card-independent .miniature::after { position: absolute; right: 0; bottom: 0; width: 100%; height: 28px; background: #eee938; content: ""; }
.card-counterpoint .miniature { background: #f4f0e7; box-shadow: inset 17px 0 #5648c9; }
.card-counterpoint .miniature i { right: 4%; top: 5%; height: 90%; transform: rotate(2deg); box-shadow: 12px 11px #5648c9; }
.card-aperture { background: #eef1ef; }
.card-aperture .miniature { background: #ecf0ed; }
.card-aperture .miniature i { right: 2%; width: 48%; height: 100%; border-radius: 50%; }
.card-aperture .miniature::before { position: absolute; right: -4%; top: -20%; width: 55%; aspect-ratio: 1; border: 1px solid #1d5f67; border-radius: 50%; content: ""; box-shadow: 0 0 0 24px #ecf0ed, 0 0 0 25px #1d5f67; }
.card-aperture .miniature b { font-family: American Typewriter, Courier New, monospace; }
.card-field .miniature::after { position: absolute; right: 0; bottom: 0; left: 0; height: 42px; background: #d4c495; content: ""; }
.card-ribbon .miniature::after { background: repeating-linear-gradient(7deg, #c6b173 0 9px, #26313a 10px 11px, #c6b173 12px 22px); }
.card-constellation .miniature::after { background: radial-gradient(circle at 12% 38%, #ef4a35 0 4px, transparent 5px), radial-gradient(circle at 35% 68%, #d9e0d8 0 3px, transparent 4px), radial-gradient(circle at 68% 30%, #d9e0d8 0 4px, transparent 5px), #19313b; }
.card-knot .miniature::after { background: repeating-radial-gradient(ellipse at center, transparent 0 22px, #26231e 23px 24px, transparent 25px 43px), #bdc9b9; }
.decisions-note { padding: 90px 0; }
.decisions-note h2 { margin: 0 0 35px; font-family: Iowan Old Style, Georgia, serif; font-size: 45px; font-weight: 500; }
.decisions-note > div { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #1b1a18; }
.decisions-note p { margin: 0; padding: 22px 24px 10px 0; border-right: 1px solid rgba(0,0,0,.25); }
.decisions-note p + p { padding-left: 24px; }
.decisions-note p:last-child { border-right: 0; }
.overview-footer { display: flex; justify-content: space-between; padding: 28px 0; border-top: 1px solid #1b1a18; font-size: 12px; }
.overview-footer p { margin: 0; }

@media (max-width: 1050px) {
  .site-header { grid-template-columns: auto 1fr auto; gap: 18px; }
  .main-nav { gap: 18px; }
  .hero { grid-template-columns: minmax(0, 1fr) minmax(320px, .7fr); gap: 45px; }
  .hero h1 { font-size: clamp(48px, 7.3vw, 76px); }
  .section-intro { grid-template-columns: 135px 1fr; }
  .section-intro > p:last-child { grid-column: 2; }
  .published-book { grid-template-columns: 1fr; }
  .cover-stage { min-height: 350px; }
  .manuscript-feature { grid-template-columns: 150px 1fr; }
  .manuscript-thread { grid-column: 1 / -1; min-height: 190px; }
  .newsletter-band { grid-template-columns: 1fr; }
  .archive-story { grid-template-columns: minmax(170px, .5fr) minmax(0, 1fr) 26px; }
  .archive-story-copy { grid-column: 1; grid-row: 1 / span 2; }
  .archive-story-excerpt { grid-column: 2; grid-row: 1; }
  .archive-story-collection { grid-column: 2; grid-row: 2; }
  .archive-story > span { grid-column: 3; grid-row: 1 / span 2; }
  html[data-direction="independent"] .story-card { grid-column: span 6; }
  html[data-direction="independent"] .story-card:nth-child(2), html[data-direction="independent"] .story-card:nth-child(5) { grid-column: span 6; }
  .overview-intro { grid-template-columns: 1fr 2fr; }
  .overview-intro > p:last-child { grid-column: 2; }
  .pursuit-bacongo { grid-template-columns: minmax(0, 1fr) minmax(160px, 210px); }
  .pursuit-opening { grid-column: 1 / -1; }
  .pursuit-opening .pursuit-image-stage { max-width: 210px; }
}

@media (max-width: 900px) and (min-width: 761px) {
  .books-grid { grid-template-columns: 1fr; gap: 70px; }
  .book-entry { grid-template-columns: minmax(250px, .72fr) minmax(0, 1fr); grid-template-rows: auto; gap: 34px; }
  .book-entry .cover-stage, .manuscript-stage { height: 350px; }
  .book-entry .book-copy { align-self: center; }
}

@media (max-width: 760px) {
  :root { --section-space: 68px; }
  .section-shell, .site-header, .site-footer { width: min(calc(100% - 36px), var(--measure)); }
  .study-switcher { grid-template-columns: auto 1fr; padding-inline: 14px; }
  .study-switcher strong { display: none; }
  .study-switcher div { justify-self: end; }
  .site-header { grid-template-columns: 1fr auto; min-height: 72px; }
  .menu-button { display: block; justify-self: end; padding: 8px 11px; border: 1px solid currentColor; background: transparent; color: inherit; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
  .subscribe-link { display: none; }
  .main-nav { position: absolute; top: calc(100% - 1px); right: 0; left: 0; display: none; align-items: stretch; padding: 13px 18px 22px; border: 1px solid var(--line); background: var(--surface); box-shadow: 0 14px 30px rgba(0,0,0,.12); }
  .main-nav.is-open { display: grid; }
  .main-nav a, .nav-button { padding: 10px 0; text-align: left; }
  .hero, html[data-direction="independent"] .hero, html[data-direction="counterpoint"] .hero, html[data-direction="aperture"] .hero { display: flex; min-height: 0; flex-direction: column; gap: 48px; align-items: stretch; padding-block: 38px 64px; }
  .hero h1, html[data-direction="independent"] .hero h1, html[data-direction="counterpoint"] .hero h1, html[data-direction="aperture"] .hero h1 { font-size: clamp(47px, 13vw, 72px); }
  html[data-direction="independent"] .hero h1 { line-height: .9; }
  .hero-media { width: min(84%, 430px); margin-right: 18px; margin-left: auto; }
  .hero-media::after { top: -1px; right: -18px; }
  .hero-image-wrap, html[data-direction="counterpoint"] .hero-image-wrap { width: 100%; margin-left: 0; aspect-ratio: 4 / 3; }
  html[data-direction="aperture"] .hero::after { right: -48vw; bottom: -20px; top: auto; width: 130vw; transform: none; }
  html[data-direction="aperture"] .hero-image-wrap { width: 88%; aspect-ratio: 1; }
  html[data-direction="counterpoint"] .hero-copy::before { display: none; }
  html[data-direction="counterpoint"] .hero-image-wrap,
  html[data-direction="counterpoint"] .newsletter-band { transform: none; }
  .pattern-band { height: 105px; }
  html[data-direction="field-ribbon"] .pattern-band,
  html[data-direction="field-constellation"] .pattern-band,
  html[data-direction="field-knot"] .pattern-band { height: 118px; }
  .section-intro { display: block; margin-bottom: 48px; }
  .section-intro h2 { margin-bottom: 22px; }
  .published-books { grid-template-columns: 1fr; gap: 70px; }
  .books-grid { grid-template-columns: 1fr; gap: 68px; }
  .book-entry { grid-template-columns: 1fr; grid-template-rows: auto 370px auto; }
  .book-entry .cover-stage, .manuscript-stage { height: 370px; }
  .published-book { grid-template-columns: minmax(125px, .55fr) 1fr; gap: 21px; }
  .cover-stage { min-height: 300px; padding: 18px; }
  .cover-stage img { max-height: 270px; }
  html[data-direction="counterpoint"] .published-book:nth-child(2) { transform: none; }
  .manuscript-feature { grid-template-columns: 1fr; margin-top: 75px; padding: 34px 25px; }
  .manuscript-thread { grid-column: auto; min-height: 180px; }
  html[data-direction="aperture"] .manuscript-feature { border-radius: 90px 0 0; padding: 65px 25px 35px; }
  .filter-panel { align-items: flex-start; }
  .filter-group { width: 100%; }
  .filter-group > span { width: 82px; }
  .clear-filters { margin-left: 87px; }
  .story-card { grid-template-columns: 1fr; row-gap: 14px; }
  .story-card h3 { font-size: 31px; }
  html[data-direction="independent"] .story-list { grid-template-columns: 1fr; gap: 15px; }
  html[data-direction="independent"] .story-card, html[data-direction="independent"] .story-card:nth-child(2), html[data-direction="independent"] .story-card:nth-child(5) { grid-column: auto; min-height: 210px; }
  .newsletter-band { margin-inline: -18px; padding: 45px 25px; }
  .stories-sampler-action { align-items: flex-start; flex-direction: column; }
  .stories-hero { display: block; min-height: 0; padding-block: 44px 58px; }
  .stories-hero h1 { margin: 0; font-size: clamp(78px, 26vw, 132px); line-height: .78; }
  .page-title-signal { width: clamp(102px, 31vw, 132px); }
  .series-grid { grid-template-columns: 1fr; }
  .series-card { min-height: 0; }
  .series-card > div { align-items: flex-start; flex-direction: column; }
  html[data-direction="counterpoint"] .series-card:first-child,
  html[data-direction="counterpoint"] .series-card:last-child { transform: none; }
  .archive-filter-group { width: 100%; }
  .archive-filter-group > span:not(.visually-hidden) { width: 100%; margin-bottom: 2px; }
  .clear-archive-filters { margin-left: 0; }
  .archive-result-bar { align-items: flex-start; flex-direction: column; gap: 5px; }
  .archive-story { grid-template-columns: 1fr 24px; gap: 10px 16px; padding: 26px 0; }
  .archive-story-copy { grid-column: 1; grid-row: 1; }
  .archive-story-excerpt { grid-column: 1; grid-row: 2; }
  .archive-story-collection { grid-column: 1; grid-row: 3; }
  .archive-story h3 { font-size: 29px; }
  .archive-story > span { grid-column: 2; grid-row: 1 / span 3; }
  .article-shell { width: min(calc(100% - 36px), 920px); padding-top: 35px; }
  .article-back { margin-bottom: 48px; }
  .article-header h1 { font-size: clamp(49px, 15vw, 77px); }
  .article-body { margin-top: 52px; }
  .series-navigation { grid-template-columns: 1fr; }
  html[data-direction="aperture"] .stories-hero::after { right: -95px; bottom: 20px; width: 180px; }
  html[data-direction="counterpoint"] .newsletter-band { box-shadow: 8px 8px 0 var(--signal); }
  .inline-subscribe > div { display: grid; }
  .inline-subscribe input { border-right: 1px solid currentColor; border-bottom: 0; }
  .bio-section { grid-template-columns: 1fr; }
  .bio-copy { font-size: 18px; }
  .about-shell { grid-template-columns: 1fr; min-height: 0; }
  .about-portrait { width: min(82%, 430px); margin-left: auto; }
  .legal-shell { width: min(calc(100% - 36px), 980px); }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer div { justify-content: flex-start; }
  .overview-header, .overview-footer, .overview-main { width: min(calc(100% - 36px), 1380px); }
  .overview-intro { display: block; padding: 58px 0 48px; }
  .overview-intro h1 { margin: 18px 0 27px; }
  .motion-option-copy { grid-template-columns: 1fr; gap: 10px; }
  .motion-option-copy a { margin-top: 8px; white-space: normal; }
  .motion-live-preview { height: 118px; }
  .finalist-grid { grid-template-columns: 1fr; }
  .finalist-card { min-height: 540px; }
  .decisions-note > div { grid-template-columns: 1fr 1fr; }
  .decisions-note p:nth-child(2) { border-right: 0; }
}

@media (max-width: 480px) {
  .study-switcher > a { font-size: 10px; }
  .hero-links { align-items: flex-start; flex-direction: column; gap: 16px; }
  .hero-media { width: 91%; }
  .hero-image-wrap, html[data-direction="counterpoint"] .hero-image-wrap { width: 100%; }
  .published-book { grid-template-columns: 1fr; }
  html[data-direction="independent"] .published-book { grid-template-columns: 1fr; }
  .cover-stage { min-height: 340px; }
  .filter-group > span { width: 100%; }
  .clear-filters { margin-left: 0; }
  .newsletter-band { margin-inline: -18px; }
  .series-card { min-height: 470px; }
  .archive-pagination { margin-right: -18px; }
  .pursuits-page .stories-hero h1 { font-size: 58px; }
  .pursuit-bacongo { grid-template-columns: 1fr; }
  .pursuit-poster img { max-width: 190px; }
  .pursuit-opening { grid-column: auto; }
  .pursuit-opening img { max-width: 190px; }
  .pursuit-music { align-items: flex-start; }
  .pursuit-album { width: 104px; }
  .overview-header { display: block; }
  .overview-header p { margin-top: 8px; }
  .miniature { height: 235px; }
  .decisions-note > div { grid-template-columns: 1fr; }
  .decisions-note p, .decisions-note p + p { padding-left: 0; border-right: 0; border-bottom: 1px solid rgba(0,0,0,.25); }
  .overview-footer { display: block; }
  .overview-footer p { margin-top: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}

/* Publii master additions */
.standard-page { padding-block: clamp(54px, 8vw, 110px); }
.standard-page > h1, .story-article > h1 { margin: 0 0 42px; font-family: var(--display); font-size: clamp(50px, 7vw, 92px); font-weight: 500; line-height: 1; }
.tag-archive-route { margin: 36px 0; }
.story-article { padding-block: clamp(54px, 8vw, 110px); }
.story-article > .story-meta { margin-bottom: 18px; }
.story-body { max-width: 780px; font-family: var(--display); font-size: clamp(18px, 2vw, 22px); line-height: 1.72; }
.story-body img { height: auto; }
.story-series-heading,
.story-series-nav { display: none; }
.story-series-heading[data-series-name="Bunny diaries"],
.story-series-heading[data-series-name="Jerusalem Post: Ramallah dispatches"] {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 16px;
  max-width: 780px;
  margin: 0 0 32px;
  padding: 16px 20px;
  border-left: 7px solid var(--signal);
  background: var(--surface);
}
.story-series-kicker {
  color: var(--muted);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.story-series-name {
  color: var(--ink);
  font-family: var(--display);
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.1;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
.story-series-position {
  max-width: 780px;
  margin: 0 0 18px;
  color: var(--signal);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.story-series-position[hidden],
.story-sequence-nav[hidden] { display: none; }
.story-sequence-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  max-width: 780px;
  margin-top: clamp(40px, 6vw, 72px);
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.story-sequence-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: #fff !important;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}
.story-sequence-next { margin-left: auto; }
.story-sequence-link:hover,
.story-sequence-link:focus-visible { background: var(--signal); border-color: var(--signal); color: var(--ink) !important; }
.story-series-nav[data-series-name="Bunny diaries"],
.story-series-nav[data-series-name="Jerusalem Post: Ramallah dispatches"] {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  max-width: 780px;
  margin-top: clamp(40px, 6vw, 72px);
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.story-series-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}
.story-series-primary { background: var(--ink); color: #fff !important; }
.story-series-secondary { color: var(--ink); }
.story-series-nav a:hover,
.story-series-nav a:focus-visible { background: var(--signal); border-color: var(--signal); color: var(--ink) !important; }
.archive-story[hidden] { display: none; }

@media (min-width: 1051px) {
  .series-card h3 { min-height: 2.08em; }
}

@media (min-width: 761px) and (max-width: 1050px) {
  .series-card h3 { min-height: 3.12em; }
}

/* Featured-image thumbnails in Stories and Highlighted Stories. */
.story-card-excerpt, .archive-story-excerpt { display: flow-root; }
.story-thumbnail {
  display: block;
  float: left;
  width: 140px;
  max-width: 45%;
  height: auto;
  aspect-ratio: 8 / 5;
  object-fit: cover;
  margin: 0 18px 10px 0;
}
.story-card-excerpt .story-thumbnail { width: 180px; }
@media (max-width: 760px) {
  .story-card-excerpt .story-thumbnail, .archive-story-excerpt .story-thumbnail {
    width: 112px;
    margin-right: 14px;
  }
}
