:root {
  --night: #10141d;
  --ink: #171a21;
  --paper: #f1eadc;
  --cream: #f4eee2;
  --gold: #dfc57e;
  --red: #9e3439;
  --muted: #6c665e;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Baskerville, Georgia, serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { background: var(--paper); scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--serif); }
a { color: inherit; text-underline-offset: .18em; }
img { display: block; max-width: 100%; }
h1, h2, h3, p, figure, blockquote { margin-top: 0; }
.annex-header { position: absolute; z-index: 5; top: 0; right: 0; left: 0; width: min(1180px, calc(100% - 48px)); margin: auto; padding: 1.3rem 0; display: flex; justify-content: space-between; align-items: center; color: var(--cream); font: 700 .62rem/1.2 var(--sans); letter-spacing: .09em; text-transform: uppercase; }
.annex-home { color: var(--gold); text-decoration: none; }
.annex-nav { display: flex; gap: 1.2rem; }
.annex-nav a { color: rgba(244,238,226,.86); text-decoration: none; }
.annex-nav a:hover, .annex-nav a:focus-visible, .annex-home:hover, .annex-home:focus-visible { color: var(--gold); }
.annex-kicker { margin: 0 0 1rem; color: var(--red); font: 750 .64rem/1.25 var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.annex-fr { margin: 1.1rem 0 0; color: var(--muted); font-size: clamp(.98rem, 1.3vw, 1.1rem); font-style: italic; line-height: 1.55; }

.manuc-hero { position: relative; min-height: 100svh; overflow: hidden; display: grid; align-items: center; color: var(--cream); background: var(--night); }
.manuc-hero figure, .manuc-hero figure img { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
.manuc-hero figure img { object-fit: cover; object-position: center 52%; filter: saturate(.56) contrast(1.1) brightness(.64); }
.manuc-hero::after { position: absolute; z-index: 1; inset: 0; content: ""; background: linear-gradient(90deg, rgba(7,10,16,.94), rgba(7,10,16,.57) 54%, rgba(7,10,16,.15)), linear-gradient(0deg, rgba(7,10,16,.82), transparent 64%); }
.manuc-hero-copy { position: relative; z-index: 2; width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 8rem 0 clamp(5rem, 12vh, 8rem); }
.manuc-hero .annex-kicker { color: var(--gold); }
.manuc-hero h1 { max-width: 820px; margin: 0; font-size: clamp(4.1rem, 9vw, 9.1rem); font-weight: 400; letter-spacing: -.073em; line-height: .8; }
.manuc-hero h1 em, h2 em { color: var(--gold); font-weight: 400; }
.manuc-hero .annex-fr { color: rgba(244,238,226,.79); }
.manuc-deck { max-width: 610px; margin: 1.7rem 0 0 clamp(.15rem, 8vw, 6.2rem); font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.55; }
.manuc-scroll { position: absolute; z-index: 3; right: max(2rem, 6vw); bottom: 1.9rem; color: rgba(244,238,226,.85); font: 700 .59rem/1.25 var(--sans); letter-spacing: .13em; text-decoration: none; text-transform: uppercase; }
.manuc-scroll span { margin-left: .5rem; color: var(--gold); font-size: 1.15rem; }

.manuc-story { overflow: hidden; }
.manuc-arrivals { width: min(1180px, calc(100% - 48px)); margin: auto; padding: clamp(4.5rem, 8vw, 7.5rem) 0; display: grid; grid-template-columns: .32fr 1fr; gap: clamp(2rem, 8vw, 9rem); }
.manuc-section-head { padding-top: .6rem; display: flex; flex-direction: column; justify-content: space-between; border-top: 1px solid rgba(23,26,33,.25); }
.manuc-number { margin: 2rem 0 0; color: var(--gold); font-size: clamp(4rem, 8vw, 8rem); font-style: italic; letter-spacing: -.08em; line-height: .75; }
.manuc-arrivals-copy { max-width: 810px; }
.manuc-arrivals h2, .manuc-man h2, .manuc-names h2, .manuc-treaty h2, .manuc-courtyard h2 { margin: 0 0 1.8rem; font-size: clamp(3.3rem, 6.9vw, 7.1rem); font-weight: 400; letter-spacing: -.068em; line-height: .83; }
.manuc-lede { max-width: 730px; font-size: clamp(1.18rem, 1.9vw, 1.58rem); line-height: 1.52; }

.manuc-man { padding: clamp(5rem, 11vw, 10rem) max(1.5rem, 7vw); display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(250px, .52fr); gap: clamp(3rem, 10vw, 12rem); color: var(--cream); background: #172033; }
.manuc-man-copy { max-width: 700px; }
.manuc-man .annex-kicker, .manuc-passport .annex-kicker { color: var(--gold); }
.manuc-man-copy h2 { color: #f3eddf; }
.manuc-man-copy p { color: #d4d0c8; font-size: clamp(1.04rem, 1.48vw, 1.22rem); line-height: 1.72; }
.manuc-man-copy p + p { margin-top: 1.15rem; }
.manuc-man-copy em { color: #e4c77f; }
.manuc-passport { align-self: end; padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.035); }
.manuc-passport ol { margin: 1.7rem 0 1.3rem; padding: 0; list-style: none; }
.manuc-passport li { display: grid; grid-template-columns: 5rem 1fr; gap: 1rem; padding: .85rem 0; border-top: 1px solid rgba(255,255,255,.18); }
.manuc-passport li:last-child { border-bottom: 1px solid rgba(255,255,255,.18); }
.manuc-passport b { color: var(--gold); font: 750 .68rem/1.4 var(--sans); letter-spacing: .08em; }
.manuc-passport span { color: #f0eadf; font-size: 1.04rem; }
.manuc-passport-note { margin: 0; color: #b4b0a9; font-size: .95rem; font-style: italic; line-height: 1.5; }

.manuc-names { width: min(1180px, calc(100% - 48px)); margin: auto; padding: clamp(4.5rem, 8vw, 7.5rem) 0; }
.manuc-names-title { width: min(790px, 100%); }
.manuc-name-grid { margin-top: clamp(3rem, 7vw, 6rem); display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(23,26,33,.25); border-left: 1px solid rgba(23,26,33,.25); }
.manuc-name-grid div { min-height: 155px; padding: clamp(1.15rem, 2.3vw, 2rem); display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid rgba(23,26,33,.25); border-bottom: 1px solid rgba(23,26,33,.25); }
.manuc-name-grid b { color: var(--red); font-size: clamp(1.75rem, 3.1vw, 3.1rem); font-weight: 400; letter-spacing: -.05em; }
.manuc-name-grid span { max-width: 12rem; color: var(--muted); font: .76rem/1.4 var(--sans); letter-spacing: .025em; }
.manuc-names-note { width: min(600px, 88%); margin: clamp(3rem, 6vw, 5rem) 0 0 auto; color: #4d4a45; font-size: clamp(1.13rem, 1.7vw, 1.42rem); font-style: italic; line-height: 1.55; }
/* The note is a 600px column, set right. Its French echo is a sibling rather than
   a child, so it inherits neither the measure nor the alignment: it ran the full
   width of the section at the base size, and the two halves of one sentence read
   as two unrelated blocks. Tied to the note by adjacency so the pair stays one
   visual unit whatever else is added to the section. */
.manuc-names-note + .fr-echo { width: min(600px, 88%); margin: .7rem 0 0 auto; font-size: clamp(1rem, 1.5vw, 1.25rem); }

.manuc-historic { position: relative; width: min(1020px, calc(100% - 48px)); margin: 0 auto; padding: clamp(.75rem, 1.4vw, 1.2rem); background: #dac8a5; transform: rotate(-.7deg); }
.manuc-historic img { width: 100%; max-height: 77svh; object-fit: cover; object-position: center; filter: sepia(.2) contrast(.94); }
.manuc-historic figcaption, .manuc-courtyard figcaption { margin-top: .75rem; color: var(--muted); font: .6rem/1.45 var(--sans); letter-spacing: .09em; text-transform: uppercase; }
.manuc-room { width: min(1180px, calc(100% - 48px)); margin: clamp(1.5rem, 4vw, 4rem) auto clamp(4.5rem, 8vw, 7.5rem); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .85fr); gap: clamp(3rem, 8vw, 9rem); align-items: center; }
.manuc-room .manuc-historic { width: 100%; margin: 0; }
.manuc-room-copy h2 { margin: 0 0 1.6rem; color: var(--ink); font-size: clamp(2.8rem, 5.2vw, 5.8rem); font-weight: 400; letter-spacing: -.06em; line-height: .86; }
.manuc-room-copy > p:not(.annex-kicker):not(.fr-echo):not(.fr-echo--head) { color: #4c4943; font-size: clamp(1.03rem, 1.45vw, 1.2rem); line-height: 1.7; }
.manuc-room blockquote { margin: clamp(2rem, 4vw, 3.5rem) 0 0; padding: 1rem 0 0 1.3rem; border-left: 2px solid var(--red); }
.manuc-room blockquote p { margin: 0; color: var(--red); font-size: clamp(1.35rem, 2.1vw, 2.05rem); font-style: italic; line-height: 1.28; }
.manuc-room cite { display: block; margin-top: .7rem; color: var(--muted); font: .66rem/1.35 var(--sans); letter-spacing: .1em; text-transform: uppercase; }

.manuc-treaty { position: relative; margin-top: clamp(4.5rem, 8vw, 7.5rem); padding: clamp(4.5rem, 8vw, 7.5rem) max(1.5rem, 7vw); overflow: hidden; color: #f0eadf; background: #10151f; }
.manuc-treaty::before { position: absolute; top: -2.8vw; right: -1vw; color: rgba(223,197,126,.045); content: "1812"; font-size: 23vw; font-style: italic; line-height: 1; pointer-events: none; }
.manuc-treaty-intro, .manuc-treaty-copy, .manuc-treaty-fallout { position: relative; z-index: 1; width: min(1120px, 100%); margin-inline: auto; }
.manuc-treaty-intro { display: grid; grid-template-columns: .33fr 1fr; align-items: end; gap: clamp(2rem, 8vw, 9rem); }
.manuc-treaty-intro .annex-kicker { align-self: start; color: var(--gold); }
.manuc-treaty-intro .manuc-number { margin: 0; }
.manuc-treaty-intro h2 { grid-column: 2; margin-top: -1rem; color: #f5efe4; }
/* The heading echo belongs in the heading's column, exactly as the h2 above.
   This was an inline style="grid-column: 2" on the element; same declaration,
   kept with the rest of the layout instead of on the markup. */
.manuc-treaty-intro .fr-echo--head { grid-column: 2; }
.manuc-treaty-copy { max-width: 760px; margin: clamp(3rem, 6vw, 6rem) 0 0 calc(33.333% + clamp(2rem, 4vw, 4rem)); }
.manuc-treaty-copy > p { color: #d3cec5; font-size: clamp(1.05rem, 1.55vw, 1.25rem); line-height: 1.73; }
.manuc-treaty-copy > p + p { margin-top: 1.2rem; }
.manuc-treaty blockquote { margin: clamp(3rem, 6vw, 5rem) 0 0; padding: 1.2rem 0 0 1.45rem; border-left: 2px solid var(--gold); }
.manuc-treaty blockquote p { margin: 0 0 .35rem; color: var(--gold); font-size: clamp(2rem, 4vw, 3.8rem); font-style: italic; line-height: 1; }
.manuc-treaty blockquote span { color: #e1dbce; font-size: clamp(1.05rem, 1.5vw, 1.23rem); }
.manuc-treaty-fallout { margin-top: clamp(4rem, 9vw, 8rem); padding-top: 1.25rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 4vw, 4rem); border-top: 1px solid rgba(255,255,255,.2); }
.manuc-treaty-fallout p { margin: 0; color: #bbb8b2; font-size: .98rem; line-height: 1.6; }
.manuc-treaty-fallout b { display: block; margin-bottom: .55rem; color: var(--gold); font: 750 .61rem/1.4 var(--sans); letter-spacing: .13em; text-transform: uppercase; }

.manuc-courtyard { width: min(1180px, calc(100% - 48px)); margin: auto; padding: clamp(4.5rem, 8vw, 7.5rem) 0; display: grid; grid-template-columns: minmax(0, .84fr) minmax(0, 1.16fr); gap: clamp(3rem, 8vw, 9rem); align-items: center; }
.manuc-courtyard-copy { max-width: 500px; }
.manuc-courtyard-copy p:not(.annex-kicker):not(.fr-echo):not(.fr-echo--head) { color: #4d4b47; font-size: clamp(1.04rem, 1.48vw, 1.2rem); line-height: 1.7; }
.manuc-courtyard-copy p + p { margin-top: 1.15rem; }
.manuc-courtyard figure { margin: 0; }
.manuc-courtyard img { width: 100%; aspect-ratio: 1 / .86; object-fit: cover; filter: saturate(.74) contrast(1.03); box-shadow: 20px 24px 0 rgba(158,52,57,.12); }
.manuc-sources { width: min(850px, calc(100% - 48px)); margin: auto; padding: clamp(4.5rem, 8vw, 7rem) 0; }
.manuc-sources h2 { margin: 0 0 1rem; color: var(--red); font: 750 .66rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.manuc-sources ul { margin: 0; padding-left: 1rem; }
.manuc-sources li { margin: .45rem 0; color: var(--muted); font-size: .93rem; line-height: 1.5; }

/* Shared destination-page treatment retained for Architecture and Art. */
.annex-hero { position: relative; min-height: min(760px, 88svh); overflow: hidden; display: grid; align-items: end; color: var(--cream); background: var(--night); }
.annex-hero figure, .annex-hero figure img { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; }
.annex-hero figure img { object-fit: cover; filter: saturate(.72) contrast(1.08) brightness(.72); }
.annex-hero::after { position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, rgba(7,10,16,.91), rgba(7,10,16,.52) 59%, rgba(7,10,16,.16)), linear-gradient(0deg, rgba(7,10,16,.9), transparent 67%); content: ""; }
.annex-hero--architecture figure img { object-position: center; }
.annex-hero--art figure img { object-position: center 35%; }
.annex-hero-copy { position: relative; z-index: 2; width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 8rem 0 clamp(3rem, 10vh, 7rem); }
.annex-hero h1 { max-width: 780px; margin: 0; font-size: clamp(3.7rem, 8vw, 8.4rem); font-weight: 400; letter-spacing: -.065em; line-height: .82; }
.annex-hero h1 em { color: var(--gold); font-weight: 400; }
.annex-hero .annex-fr { color: rgba(244,238,226,.82); }
.annex-deck { max-width: 630px; margin: 1.8rem 0 0; font-size: clamp(1.02rem, 1.5vw, 1.24rem); line-height: 1.55; }
.annex-story { width: min(1120px, calc(100% - 48px)); margin: 0 auto; padding: clamp(4rem, 10vw, 9rem) 0; }
.annex-intro { max-width: 780px; margin-bottom: clamp(4rem, 8vw, 7rem); }
.annex-intro h2, .annex-panel h2 { margin: 0 0 1rem; font-size: clamp(2.5rem, 5.1vw, 5.7rem); font-weight: 400; letter-spacing: -.055em; line-height: .9; }
.annex-intro p, .annex-panel p { font-size: clamp(1.03rem, 1.45vw, 1.22rem); line-height: 1.65; }
.annex-intro .annex-fr, .annex-panel .annex-fr { color: var(--muted); font-size: clamp(.95rem, 1.25vw, 1.08rem); }
.annex-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 6vw, 6rem); align-items: start; }
.annex-panel { padding-top: 1.5rem; border-top: 1px solid rgba(23,26,33,.28); }
.annex-panel h2 { font-size: clamp(2rem, 3.6vw, 3.6rem); }
.annex-panel h3 { margin: 2.2rem 0 .6rem; color: var(--red); font: 750 .68rem/1.3 var(--sans); letter-spacing: .13em; text-transform: uppercase; }
.annex-panel p { margin: 0 0 1.15rem; }
.annex-figure { margin: clamp(4rem, 9vw, 8rem) 0; }
.annex-figure img { display: block; width: 100%; max-height: 75svh; object-fit: cover; }
.annex-figure figcaption { margin-top: .65rem; color: var(--muted); font: .63rem/1.45 var(--sans); letter-spacing: .09em; text-transform: uppercase; }
.annex-statement { margin: clamp(3rem, 7vw, 7rem) 0 0; padding: clamp(2rem, 5vw, 4rem); color: var(--cream); background: var(--night); font-size: clamp(1.75rem, 3.8vw, 4.2rem); line-height: 1; letter-spacing: -.045em; }
.annex-statement em { color: var(--gold); }
.annex-statement span { display: block; margin-top: 1.2rem; color: rgba(244,238,226,.74); font-size: .45em; line-height: 1.25; font-style: italic; letter-spacing: 0; }
.annex-sources { padding: 2rem 0 0; border-top: 1px solid rgba(23,26,33,.28); }
.annex-sources h2 { margin: 0 0 .85rem; color: var(--red); font: 750 .66rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.annex-sources ul { margin: 0; padding-left: 1rem; }
.annex-sources li { margin: .35rem 0; color: var(--muted); font-size: .9rem; line-height: 1.45; }
.annex-sources a { text-underline-offset: .18em; }

@media (max-width: 760px) {
  .annex-header { width: calc(100% - 32px); padding: 1rem 0; font-size: .51rem; }
  .annex-nav { gap: .7rem; }
  .manuc-hero { min-height: 88svh; }
  .manuc-hero figure img { object-position: 58% 50%; }
  .manuc-hero::after { background: linear-gradient(0deg, rgba(7,10,16,.94), rgba(7,10,16,.38) 72%, rgba(7,10,16,.64)); }
  .manuc-hero-copy { width: calc(100% - 32px); padding: 7rem 0 5.2rem; }
  .manuc-hero h1 { font-size: clamp(3.6rem, 17vw, 5.5rem); }
  .manuc-deck { margin-left: 0; font-size: 1rem; line-height: 1.48; }
  .manuc-scroll { right: 1rem; bottom: 1.2rem; font-size: .48rem; }
  .manuc-arrivals, .manuc-man, .manuc-treaty-intro, .manuc-courtyard { grid-template-columns: 1fr; }
  .manuc-arrivals, .manuc-names, .manuc-courtyard { width: calc(100% - 32px); }
  .manuc-arrivals { gap: 2.4rem; padding-block: 5rem; }
  .manuc-section-head { display: block; }
  .manuc-section-head .manuc-number { display: none; }
  .manuc-arrivals h2, .manuc-man h2, .manuc-names h2, .manuc-treaty h2, .manuc-courtyard h2 { font-size: clamp(3rem, 14vw, 4.6rem); }
  .manuc-lede { font-size: 1.13rem; }
  .manuc-man { gap: 3.5rem; padding: 5rem 1rem; }
  .manuc-man-copy, .manuc-passport { width: min(100%, 620px); margin-inline: auto; }
  .manuc-name-grid { grid-template-columns: repeat(2, 1fr); }
  .manuc-name-grid div { min-height: 125px; }
  .manuc-names-note { width: 100%; }
  .manuc-names-note + .fr-echo { width: 100%; }
  .manuc-historic { width: calc(100% - 32px); transform: none; }
  .manuc-room { width: calc(100% - 32px); margin: 1.5rem auto 5.5rem; grid-template-columns: 1fr; gap: 3rem; }
  .manuc-room .manuc-historic { width: 100%; }
  .manuc-room-copy h2 { font-size: clamp(2.7rem, 12vw, 4.25rem); }
  .manuc-treaty { margin-top: 5rem; padding: 5rem 1rem; }
  .manuc-treaty-intro { gap: .5rem; }
  .manuc-treaty-intro .manuc-number { display: none; }
  .manuc-treaty-intro h2 { grid-column: auto; margin-top: 0; }
  .manuc-treaty-copy { width: 100%; margin: 3rem 0 0; }
  .manuc-treaty-fallout { grid-template-columns: 1fr; gap: 1.6rem; }
  .manuc-courtyard { gap: 3.5rem; padding-block: 6rem; }
  .manuc-courtyard-copy { max-width: none; }
  .manuc-sources { width: calc(100% - 32px); }
  .annex-hero { min-height: 88svh; }
  .annex-hero::after { background: linear-gradient(0deg, rgba(7,10,16,.92), rgba(7,10,16,.38) 72%, rgba(7,10,16,.62)); }
  .annex-hero-copy { width: calc(100% - 32px); padding: 7rem 0 2.7rem; }
  .annex-hero h1 { font-size: clamp(3.15rem, 15vw, 4.8rem); }
  .annex-deck { margin-top: 1.25rem; font-size: 1rem; line-height: 1.45; }
  .annex-story { width: calc(100% - 32px); padding: 4rem 0; }
  .annex-intro { margin-bottom: 3.5rem; }
  .annex-intro h2 { font-size: clamp(2.65rem, 12vw, 4rem); }
  .annex-intro p, .annex-panel p { font-size: 1rem; line-height: 1.55; }
  .annex-grid { grid-template-columns: 1fr; gap: 2.8rem; }
  .annex-figure { margin: 3.5rem 0; }
  .annex-statement { margin-top: 3.5rem; padding: 1.65rem; font-size: clamp(2rem, 9vw, 3rem); }
}

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

/* Long-form art and architecture chapters. The rhythm changes deliberately from
   gallery wall to newspaper column to keep the reading experience alive. */
.chapter-page {
  --chapter-night: #10151e;
  --chapter-ink: #171a20;
  --chapter-paper: #eee6d6;
  --chapter-warm: #d9c39d;
  --chapter-red: #9d3f42;
  --chapter-line: rgba(23,26,32,.24);
  background: var(--chapter-paper);
  color: var(--chapter-ink);
}
.chapter-page, .chapter-page * { box-sizing: border-box; }
.chapter-page .chapter-nav {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  left: 0;
  width: min(1240px, calc(100% - 48px));
  margin: auto;
  padding: 1.45rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  color: #f5eee1;
  font: 720 .62rem/1.2 var(--sans);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.chapter-nav a { color: inherit; text-decoration: none; }
.chapter-home { color: #ecd28d !important; }
.chapter-nav nav { display: flex; gap: clamp(.7rem, 1.6vw, 1.5rem); }
.chapter-nav nav a { color: rgba(248,241,229,.78); }
.chapter-nav a:hover, .chapter-nav a:focus-visible { color: #ecd28d; outline: 0; }
.chapter-hero { position: relative; min-height: 100svh; overflow: hidden; display: grid; align-items: end; isolation: isolate; color: #f7f0e4; background: var(--chapter-night); }
.chapter-hero > figure, .chapter-hero > figure img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; margin: 0; }
.chapter-hero > figure img { object-fit: cover; filter: saturate(.68) contrast(1.08) brightness(.62); }
.chapter-hero::after { position: absolute; z-index: -1; inset: 0; content: ""; background: linear-gradient(90deg, rgba(8,11,16,.94), rgba(8,11,16,.57) 56%, rgba(8,11,16,.15)), linear-gradient(0deg, rgba(8,11,16,.9), transparent 64%, rgba(8,11,16,.28)); }
.chapter-hero-copy { width: min(1240px, calc(100% - 48px)); margin: auto; padding: 9rem 0 clamp(5.8rem, 12vh, 9rem); }
.chapter-kicker { margin: 0 0 1.25rem; color: var(--chapter-red); font: 760 .66rem/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.chapter-hero .chapter-kicker { color: #e4c478; }
.chapter-hero h1 { max-width: 930px; margin: 0; font-size: clamp(4.3rem, 9.2vw, 10.2rem); font-weight: 400; letter-spacing: -.075em; line-height: .78; text-wrap: balance; }
.chapter-hero h1 em, .chapter-page h2 em { color: #e5c36f; font-weight: 400; }
.chapter-fr { margin: 1.2rem 0 0; color: #79685b; font-size: clamp(.98rem, 1.25vw, 1.12rem); font-style: italic; line-height: 1.55; }
.chapter-hero .chapter-fr { color: rgba(246,238,224,.79); }
.chapter-deck { max-width: 660px; margin: 1.5rem 0 0 clamp(0rem, 7vw, 6.4rem); font-size: clamp(1.07rem, 1.62vw, 1.38rem); line-height: 1.55; }
/* Same reason as .manuc-names-note: the deck is a 660px measure, and the echo
   beside it took the full width of the hero. */
.chapter-deck + .fr-echo { max-width: 660px; margin-left: clamp(0rem, 7vw, 6.4rem); }
.chapter-down { position: absolute; right: max(1.5rem, 5vw); bottom: 1.65rem; color: #f8f0e2; font: 720 .62rem/1 var(--sans); letter-spacing: .14em; text-decoration: none; text-transform: uppercase; }
.chapter-down span { margin-left: .5rem; color: #e6c979; font-size: 1.15rem; }
.chapter-story { overflow: hidden; }
.chapter-story h2 { margin: 0; font-size: clamp(3rem, 6.2vw, 7rem); font-weight: 400; letter-spacing: -.065em; line-height: .84; text-wrap: balance; }
.chapter-story p { font-size: clamp(1.03rem, 1.4vw, 1.2rem); line-height: 1.72; }
.chapter-opening { width: min(1100px, calc(100% - 48px)); margin: auto; padding: clamp(4.5rem, 8vw, 7.5rem) 0 clamp(5rem, 10vw, 9rem); display: grid; grid-template-columns: .31fr 1fr; gap: clamp(2.5rem, 9vw, 10rem); }
.chapter-marker { padding-top: .25rem; border-top: 1px solid var(--chapter-line); }
.chapter-marker span { display: block; margin-top: 1.2rem; color: var(--chapter-red); font-size: clamp(4rem, 7vw, 7rem); font-style: italic; letter-spacing: -.09em; line-height: .7; }
.chapter-marker small { display: block; margin-top: 2rem; color: #706961; font: 700 .63rem/1.45 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.chapter-opening h2 { margin-bottom: 1.7rem; }
.chapter-opening > div:last-child > p:last-child { max-width: 770px; color: #4e4c48; }
.chapter-lede { max-width: 750px; margin-bottom: 1.3rem; font-size: clamp(1.2rem, 1.9vw, 1.55rem) !important; line-height: 1.5 !important; }
.chapter-image { position: relative; width: min(1380px, calc(100% - 48px)); margin: 0 auto; }
.chapter-image::before { position: absolute; z-index: -1; top: 1.2rem; right: -1.2rem; bottom: -1.2rem; left: 1.2rem; content: ""; background: #c7a963; }
.chapter-image img { width: 100%; max-height: 82svh; object-fit: cover; }
.chapter-image figcaption, .chapter-feature figcaption, .chapter-transylvania figcaption, .chapter-card figcaption { margin-top: .75rem; color: #706a61; font: .61rem/1.45 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.image--church img { object-position: center 45%; }
.image--painting { width: min(930px, calc(100% - 48px)); padding: clamp(.55rem, 1.2vw, 1rem); background: #302b2a; }
.image--painting::before { top: 1rem; right: -1rem; bottom: -1rem; left: 1rem; background: #ad3f42; }
.image--painting img { max-height: none; object-fit: contain; background: #211e1e; }
.image--painting figcaption { color: #dfd5c4; }
.chapter-split { margin-top: clamp(4.5rem, 8vw, 7.5rem); padding: clamp(4.5rem, 8vw, 7.5rem) max(1.5rem, 7vw); display: grid; grid-template-columns: minmax(0,.84fr) minmax(300px,1.16fr); gap: clamp(3rem, 10vw, 12rem); }
.chapter-split--ink { color: #f1ebdf; background: #172031; }
.chapter-split--ink .chapter-kicker { color: #e3c277; }
.chapter-split--ink .chapter-fr { color: #aaa69d; }
.chapter-split--ink .chapter-prose { color: #d4d0c9; }
.chapter-split--paper { margin-top: 0; background: #d8cbb4; }
.chapter-prose { max-width: 700px; padding-top: .5rem; }
.chapter-prose p { margin: 0; }
.chapter-prose p + p { margin-top: 1.2rem; }
.chapter-essay { position: relative; padding: clamp(4.5rem, 8vw, 7.5rem) max(1.5rem, 7vw); overflow: hidden; }
.chapter-essay::before { position: absolute; z-index: 0; top: -3vw; right: -1vw; color: rgba(55,48,39,.06); content: "PARIS"; font-size: 21vw; font-style: italic; letter-spacing: -.1em; line-height: 1; pointer-events: none; }
.chapter-essay-grid, .chapter-avenue, .chapter-feature, .chapter-cards, .chapter-transylvania, .chapter-closing, .chapter-sources, .chapter-circuit { position: relative; z-index: 1; width: min(1100px, 100%); margin-inline: auto; }
.chapter-essay-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(3rem, 10vw, 12rem); }
/* A fr-echo is a sibling of the English it mirrors, but in a two-column grid a
   sibling is a grid item — so the echo was auto-placed into column 2, pushing
   the body into column 1 and leaving the right half of the section empty. The
   title and its echo are now one item, .chapter-essay-head, in the manner of
   .chapter-feature-copy, so grid flow has nothing to misplace. Placing them
   explicitly instead was tried first and is not enough: the body column then
   spans both rows, its height stretches the first row, and the echo is pushed
   to the bottom of the column away from the title it belongs to. */
.chapter-essay-grid > div { max-width: 620px; }
.chapter-essay-grid > .chapter-essay-head { max-width: none; align-self: start; }
.chapter-essay-grid p { margin: 0; }
.chapter-essay-grid p + p { margin-top: 1.2rem; }
.chapter-avenue { padding: clamp(4.5rem, 8vw, 7.5rem) 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 10vw, 11rem); }
.chapter-avenue h2 { margin-bottom: 1.7rem; }
.chapter-avenue-head > p:last-child { max-width: 480px; color: #5a554f; }
/* The year list is shorter than the text column beside it. Left to stretch it
   fills the row and its first entry rides up against the section top, so the
   two columns start at different heights and the list reads as a stray column.
   Centring it against the taller column is the same treatment .chapter-feature
   already gives its own two-column grid. Collapses to a no-op on mobile, where
   the grid is a single column and each row is its own height. */
.avenue-notes { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--chapter-line); align-self: center; }
.avenue-notes li { padding: 1.4rem 0; display: grid; grid-template-columns: 6rem 1fr; gap: 1rem; border-bottom: 1px solid var(--chapter-line); }
.avenue-notes b { color: var(--chapter-red); font-size: clamp(1.8rem, 2.8vw, 2.7rem); font-weight: 400; letter-spacing: -.06em; line-height: 1; }
.avenue-notes span { color: #504e4a; font-size: 1.03rem; line-height: 1.55; }
.chapter-feature { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(280px,.78fr); gap: clamp(3rem, 9vw, 10rem); align-items: center; }
.chapter-feature figure, .chapter-transylvania figure, .chapter-card { margin: 0; }
.chapter-feature figure { padding: clamp(.6rem, 1.1vw, 1rem); background: #ded2ba; box-shadow: 22px 27px 0 rgba(157,63,66,.13); }
.chapter-feature figure img { width: 100%; min-height: 570px; object-fit: cover; }
.feature--athenaeum figure img { object-position: center; }
.chapter-feature-copy h2 { margin-bottom: 1.5rem; }
.chapter-feature-copy p:not(.chapter-kicker) { color: #4e4b46; }
.chapter-feature-copy p + p { margin-top: 1.1rem; }
.chapter-cards { margin-top: clamp(4.5rem, 8vw, 7.5rem); display: grid; grid-template-columns: 1.1fr .9fr; gap: 0; background: #171d29; }
.chapter-card { min-height: 405px; }
.chapter-card--copy { padding: clamp(2rem, 5vw, 4.5rem); color: #f1ebdf; }
.chapter-card--copy .chapter-kicker { color: #e4c578; }
.chapter-card--copy h2 { margin-bottom: 1.4rem; font-size: clamp(2.8rem, 4.9vw, 5.6rem); }
.chapter-card--copy p:not(.chapter-kicker) { max-width: 520px; color: #cbc8c1; }
.chapter-card--image { position: relative; overflow: hidden; }
.chapter-card--image img { width: 100%; height: 100%; min-height: 405px; object-fit: cover; }
.chapter-card--image figcaption { position: absolute; right: 1.4rem; bottom: 1.2rem; left: 1.4rem; margin: 0; color: #fff7e7; text-shadow: 0 1px 4px rgba(0,0,0,.8); }
.chapter-transylvania { padding: clamp(4.5rem, 8vw, 7.5rem) 0; display: grid; grid-template-columns: minmax(0,1.08fr) minmax(280px,.92fr); gap: clamp(3rem, 9vw, 10rem); align-items: center; }
.chapter-transylvania figure { order: 2; }
.chapter-transylvania figure img { width: 100%; min-height: 570px; object-fit: cover; filter: saturate(.76) contrast(1.03); }
.chapter-transylvania h2 { margin-bottom: 1.5rem; }
.chapter-transylvania p:not(.chapter-kicker) { color: #4e4b46; }
.chapter-closing { padding: clamp(4.5rem, 8vw, 7.5rem) 0; text-align: center; }
.chapter-closing .chapter-kicker { color: var(--chapter-red); }
.chapter-closing h2 { max-width: 930px; margin-inline: auto; }
.chapter-closing > p:not(.chapter-kicker):not(.fr-echo):not(.fr-echo--head) { max-width: 780px; margin: 2rem auto 0; color: #5a554f; }
.chapter-closing .chapter-fr { color: #82614d; }

/* The closing claim is that the layers all survive, so two of them sit behind
   the claim: Calea Victoriei as a 1900 postcard on one side, the same street in
   2022 on the other. Multiplied onto the paper rather than laid over it, which
   keeps only the darker line-work — the sky and the pale stone drop out on
   their own and the screen stays as quiet as the rest of the page.

   One pseudo-element per photograph, each carrying a single-axis mask. Two
   stacked masks would need mask-composite to fade the horizontal and vertical
   edges together, and that composite is not reliably applied — the fades
   silently collapse and the photographs show their own rectangular borders.
   `cover` fills the section on both axes so no vertical edge is ever exposed,
   which leaves the horizontal fade as the only mask each one needs.

   z-index:-1 is safe because annex.css already gives .chapter-closing a
   z-index:1, making the section a stacking context, so the layers paint above
   its own background and below the text. Scoped to this page on purpose:
   art.html's closing is the deep red panel and must not inherit any of it. */
.architecture-page .chapter-closing { isolation: isolate; }
.architecture-page .chapter-closing::before,
.architecture-page .chapter-closing::after {
  content: "";
  position: absolute; inset: 0; z-index: -1;
  pointer-events: none;
  background-size: cover;
  background-repeat: no-repeat;
  mix-blend-mode: multiply;
  filter: grayscale(.85);
  opacity: .16;
}
/* A veil of paper rides on top of each photograph, clear at the outer edge and
   opaque by the middle. The photographs can then stay legible where they are
   not fighting the text, while the centred column of type gets plain paper
   instead of stonework. It is why the weight can sit at .16 rather than the
   .10 that would be needed without it. */
.architecture-page .chapter-closing::before {
  background-image:
    linear-gradient(to right,
      color-mix(in srgb, var(--paper) 12%, transparent) 0%,
      color-mix(in srgb, var(--paper) 48%, transparent) 12%,
      color-mix(in srgb, var(--paper) 84%, transparent) 26%,
      color-mix(in srgb, var(--paper) 92%, transparent) 49%),
    url(./assets/calea-victoriei-1900.webp);
  background-position: left center;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 32%, transparent 49%);
          mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 32%, transparent 49%);
}
.architecture-page .chapter-closing::after {
  background-image:
    linear-gradient(to left,
      color-mix(in srgb, var(--paper) 12%, transparent) 0%,
      color-mix(in srgb, var(--paper) 48%, transparent) 12%,
      color-mix(in srgb, var(--paper) 84%, transparent) 26%,
      color-mix(in srgb, var(--paper) 92%, transparent) 49%),
    url(./assets/calea-victoriei-2022.webp);
  background-position: right center;
  -webkit-mask-image: linear-gradient(to left, transparent 0, #000 14%, #000 32%, transparent 49%);
          mask-image: linear-gradient(to left, transparent 0, #000 14%, #000 32%, transparent 49%);
}
.chapter-sources { padding: 3rem 0 5rem; border-top: 1px solid var(--chapter-line); }
.chapter-sources > h2 { margin-bottom: 2rem; color: var(--chapter-red); font: 760 .68rem/1.3 var(--sans); letter-spacing: .15em; text-transform: uppercase; }
.chapter-source-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 8vw, 8rem); }
.chapter-source-grid h3 { margin: 0 0 1rem; color: #524c43; font: 760 .67rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.chapter-source-grid ul { margin: 0; padding-left: 1.15rem; }
.chapter-source-grid li { margin: .55rem 0; color: #625c54; font-size: .87rem; line-height: 1.55; }
.chapter-source-grid a { text-underline-offset: .18em; }

/* Art diverges into the cooler, more typographic register of an atelier and a newsroom. */
.art-page { --chapter-paper: #e8e3d8; --chapter-red: #a74448; --chapter-line: rgba(31,36,49,.24); }
.art-hero > figure img { object-position: center 28%; filter: saturate(.58) contrast(1.1) brightness(.62); }
.art-hero::after { background: linear-gradient(90deg, rgba(10,13,21,.96), rgba(10,13,21,.54) 58%, rgba(10,13,21,.2)), linear-gradient(0deg, rgba(10,13,21,.9), transparent 65%); }
.art-page .chapter-opening { background: #e8e3d8; }
.art-split { margin-top: clamp(4.5rem, 8vw, 7.5rem); }
.feature--grigorescu { padding: clamp(4.5rem, 8vw, 7.5rem) 0; }
.feature--grigorescu figure { order: 2; background: #dfd6c1; box-shadow: -22px 27px 0 rgba(60,78,104,.16); }
.feature--grigorescu figure img { min-height: 480px; object-fit: contain; background: #d5c7ab; }
.chapter-essay--art { color: #e9e4d9; background: #27334a; }
.chapter-essay--art::before { color: rgba(231,226,217,.045); content: "VOIX"; }
.chapter-essay--art .chapter-kicker { color: #e4c577; }
.chapter-essay--art .chapter-essay-grid > div { color: #d1d3d5; }
.chapter-essay--art .chapter-fr { color: #aeb1b8; }
.chapter-german { padding: clamp(4.5rem, 8vw, 7.5rem) max(1.5rem, 7vw); display: grid; grid-template-columns: minmax(180px,.44fr) minmax(0,1fr); gap: clamp(3rem, 10vw, 12rem); color: #ece7dc; background: #171f2d; }
.chapter-german > * { width: min(100%, 780px); }
.chapter-german figure { width: min(100%, 390px); margin: 0 0 0 auto; align-self: start; padding: .75rem; background: #ddd4c2; transform: rotate(-1deg); }
.chapter-german figure img { width: 100%; max-height: 520px; object-fit: cover; filter: grayscale(1) contrast(1.08); }
.chapter-german figcaption { margin-top: .7rem; color: #534c43; font: .58rem/1.45 var(--sans); letter-spacing: .09em; text-transform: uppercase; }
.chapter-german-copy { padding-top: .25rem; }
.chapter-german-copy .chapter-kicker { color: #e3c477; }
.chapter-german-copy h2 { margin-bottom: 1.6rem; }
.chapter-german-copy p:not(.chapter-kicker) { color: #d5d2cb; }
.chapter-german-copy p + p { margin-top: 1.15rem; }
.chapter-press { position: relative; padding: clamp(4.5rem, 8vw, 7.5rem) max(1.5rem, 7vw); overflow: hidden; background: #e6dfd0; }
.chapter-press::before { position: absolute; top: -1.5rem; right: -1.5rem; color: rgba(38,43,56,.045); content: "PRESS"; font: italic 20vw/.8 var(--serif); letter-spacing: -.1em; pointer-events: none; }
.press-head, .press-grid, .press-afterword { position: relative; z-index: 1; width: min(1100px, 100%); margin-inline: auto; }
.press-head { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 8vw, 8rem); align-items: end; }
/* Echoes sat as bare siblings in a two-column grid, so auto-placement zig-zagged
   every item — kicker and its echo stacked in the left column, the h2 stranded
   alone on the right, row 1 column 2 left empty. Pinning each item to an
   explicit row stopped that but was wrong in a subtler way: the deck spanned
   two rows, which inflated the row the title occupied and pushed the title's
   echo hundreds of pixels below the title. Three cells, each a unit, leaves
   grid flow nothing to misplace. The kicker keeps its full-bleed row. */
.press-head-kicker { grid-column: 1 / -1; align-self: start; }
.press-head-title { grid-column: 1; }
.press-head-deck { grid-column: 2; max-width: 430px; }
.press-head .chapter-kicker { margin-bottom: 0; }
.press-head h2 { margin: 0; }
.press-head-deck > p { margin: 0; color: #5a554e; }
.press-head-deck > p.fr-echo { margin-top: 1.2rem; }
.press-grid { margin-top: clamp(4rem, 8vw, 7rem); display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--chapter-line); border-left: 1px solid var(--chapter-line); }
.press-grid article { min-height: 260px; padding: clamp(1.2rem, 2.4vw, 2.1rem); border-right: 1px solid var(--chapter-line); border-bottom: 1px solid var(--chapter-line); }
.press-date { margin: 0 0 2.2rem; color: var(--chapter-red); font: 700 .67rem/1 var(--sans) !important; letter-spacing: .1em; }
.press-grid h3 { margin: 0 0 .8rem; font-size: clamp(1.35rem, 2.1vw, 2.2rem); font-weight: 400; letter-spacing: -.035em; line-height: 1.05; }
.press-grid article p:last-child { margin: 0; color: #5e5951; font-size: .94rem; line-height: 1.55; }
.press-afterword { margin-top: clamp(3.5rem, 8vw, 7rem); padding-top: 1.3rem; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 8vw, 8rem); border-top: 1px solid var(--chapter-line); }
.press-afterword p { margin: 0; color: #5a554e; }
.chapter-circuit { padding: clamp(4.5rem, 8vw, 7.5rem) 0; text-align: center; }
.chapter-circuit h2 { margin-bottom: clamp(2.25rem, 3.5vw, 3.5rem); }
/* :last-child was the body paragraph until an echo was added after it; the echo
   then inherited the 760px measure and centring and the English lost them, so the
   two traded places. Both are named explicitly instead. */
.chapter-circuit > p:not(.chapter-kicker):not(.fr-echo) { max-width: 760px; margin: clamp(2.25rem, 3.6vw, 3.5rem) auto 0; color: #58534c; }
.chapter-circuit > p.fr-echo { max-width: 760px; margin: clamp(1.25rem, 2vw, 1.75rem) auto 0; }
.circuit-line { margin-top: clamp(1.5rem, 2.4vw, 2.25rem); display: flex; align-items: center; justify-content: center; gap: 1.1rem; color: #8e343a; font: 700 clamp(.62rem, .9vw, .76rem)/1 var(--sans); letter-spacing: .11em; text-transform: uppercase; }
.circuit-line i { width: clamp(1.5rem, 5vw, 6rem); height: 1px; background: #aa8e57; }
.art-closing { color: #f2ecdf; background: #9c3c42; }
.art-closing .chapter-kicker, .art-closing .chapter-fr { color: #f0d688; }
.art-closing h2 em { color: #f5d991; }

@media (max-width: 820px) {
  .chapter-page .chapter-nav { width: calc(100% - 32px); padding: 1.05rem 0; font-size: .54rem; }
  .chapter-nav nav { gap: .65rem; }
  .chapter-hero { min-height: 91svh; }
  .chapter-hero::after { background: linear-gradient(0deg, rgba(8,11,16,.95), rgba(8,11,16,.4) 72%, rgba(8,11,16,.66)); }
  .chapter-hero-copy { width: calc(100% - 32px); padding: 7rem 0 5rem; }
  .chapter-hero h1 { font-size: clamp(3.4rem, 15vw, 6.1rem); line-height: .82; }
  .chapter-deck { margin-left: 0; font-size: 1rem; line-height: 1.48; }
  .chapter-deck + .fr-echo { margin-left: 0; }
  .chapter-down { right: 1rem; bottom: 1.1rem; }
  .chapter-story h2 { font-size: clamp(2.8rem, 12vw, 4.8rem); }
  .chapter-opening { width: calc(100% - 32px); padding-block: 5rem; grid-template-columns: 1fr; gap: 2.2rem; }
  .chapter-marker { display: flex; align-items: center; justify-content: space-between; }
  .chapter-marker span { margin: 0; font-size: 3.6rem; }
  .chapter-marker small { margin: 0; text-align: right; }
  .chapter-opening h2 { margin-bottom: 1.25rem; }
  .chapter-opening > div:last-child > p:last-child, .chapter-prose { max-width: none; }
  .chapter-lede { font-size: 1.17rem !important; }
  .chapter-image { width: calc(100% - 32px); }
  .chapter-image::before { top: .7rem; right: -.7rem; bottom: -.7rem; left: .7rem; }
  .chapter-image img { max-height: 68svh; }
  .chapter-split, .chapter-essay, .chapter-german, .chapter-press { padding: 5rem 1rem; }
  .chapter-split, .chapter-essay-grid, .chapter-avenue, .chapter-feature, .chapter-transylvania, .chapter-german, .press-head, .press-afterword { grid-template-columns: 1fr; }
  /* Explicit column placement above would otherwise create a phantom second
     column once the grid collapses to one, overlapping the title and the body. */
  .press-head-kicker, .press-head-title, .press-head-deck,
  .manuc-treaty-intro h2, .manuc-treaty-intro .fr-echo--head { grid-column: auto; }
  .chapter-split { gap: 2.5rem; }
  .chapter-essay-grid { gap: 2.5rem; }
  .chapter-avenue, .chapter-feature, .chapter-transylvania { width: calc(100% - 32px); gap: 3rem; padding-block: 5rem; }
  .chapter-feature figure, .chapter-transylvania figure { width: 100%; }
  .chapter-feature figure img, .chapter-transylvania figure img { min-height: 420px; max-height: 65svh; }
  .chapter-feature figure { order: 0; box-shadow: 13px 16px 0 rgba(157,63,66,.13); }
  .feature--grigorescu { padding-block: 5rem; }
  .feature--grigorescu figure { order: 0; }
  .chapter-transylvania figure { order: 0; }
  .chapter-cards { width: calc(100% - 32px); margin-top: 5rem; grid-template-columns: 1fr; }
  .chapter-card--copy { min-height: auto; }
  .chapter-card--image, .chapter-card--image img { min-height: 330px; }
  .chapter-transylvania figcaption { margin-bottom: 0; }
  .chapter-closing, .chapter-circuit { width: calc(100% - 32px); padding-block: 5rem; }
  .chapter-closing > p:not(.chapter-kicker):not(.fr-echo):not(.fr-echo--head) { margin-top: 1.4rem; }
  /* Half-width views of the pair leave nothing legible on a phone, so the
     photographs turn on their side: 1900 above, 2022 below, which also reads in
     chronological order. The veil and the mask both switch to the vertical
     axis, meeting in the middle where the type sits. */
  .architecture-page .chapter-closing::before {
    background-image:
      linear-gradient(to bottom,
        color-mix(in srgb, var(--paper) 12%, transparent) 0%,
        color-mix(in srgb, var(--paper) 52%, transparent) 14%,
        color-mix(in srgb, var(--paper) 88%, transparent) 30%,
        color-mix(in srgb, var(--paper) 94%, transparent) 47%),
      url(./assets/calea-victoriei-1900.webp);
    background-position: center top;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 11%, #000 29%, transparent 47%);
            mask-image: linear-gradient(to bottom, transparent 0, #000 11%, #000 29%, transparent 47%);
  }
  .architecture-page .chapter-closing::after {
    background-image:
      linear-gradient(to top,
        color-mix(in srgb, var(--paper) 12%, transparent) 0%,
        color-mix(in srgb, var(--paper) 52%, transparent) 14%,
        color-mix(in srgb, var(--paper) 88%, transparent) 30%,
        color-mix(in srgb, var(--paper) 94%, transparent) 47%),
      url(./assets/calea-victoriei-2022.webp);
    background-position: center bottom;
    -webkit-mask-image: linear-gradient(to bottom, transparent 53%, #000 71%, #000 89%, transparent 100%);
            mask-image: linear-gradient(to bottom, transparent 53%, #000 71%, #000 89%, transparent 100%);
  }
  .chapter-sources { width: calc(100% - 32px); padding-bottom: 4rem; }
  .chapter-source-grid { grid-template-columns: 1fr; gap: 2rem; }
  .chapter-german { gap: 3rem; }
  .chapter-german figure { width: min(230px, 65vw); margin: 0; }
  .press-head .chapter-kicker { margin-bottom: 1.1rem; }
  .press-grid { grid-template-columns: 1fr 1fr; margin-top: 3rem; }
  .press-grid article { min-height: 220px; }
  .press-afterword { margin-top: 3rem; gap: 1.5rem; }
  .circuit-line { gap: .55rem; flex-wrap: wrap; }
  .circuit-line i { width: 1.2rem; }
}

@media (max-width: 480px) {
  .chapter-page .chapter-nav { font-size: .46rem; }
  .chapter-nav nav { gap: .45rem; }
  .chapter-hero-copy { padding-bottom: 4.2rem; }
  .chapter-hero h1 { font-size: clamp(3.2rem, 16vw, 4.55rem); }
  .chapter-kicker { font-size: .59rem; }
  .chapter-story p { font-size: 1rem; line-height: 1.62; }
  .chapter-image img { max-height: 58svh; }
  .image--painting img { max-height: none; }
  .avenue-notes li { grid-template-columns: 4.2rem 1fr; }
  .chapter-feature figure img, .chapter-transylvania figure img { min-height: 340px; }
  .press-grid { grid-template-columns: 1fr; }
  .press-grid article { min-height: auto; }
  .circuit-line { font-size: .54rem; }
}