/* =====================================================================
   THE REPERTORY NOTEBOOK (shepherdstownfilmsociety.org)
   Design system « projection room », prefix rpn-.
   Rehabilitation of the reference-work skeleton (fiches-reference):
   two asymmetric columns, titles set as margin headings (manchettes),
   entries separated by thin rules. Near-black ground, ivory text,
   curtain-red accent, a condensed display face over a reading serif.
   No cards, no shadows, no rounded corners, no remote font, no script.
   One identity only, dark by design: every colour below is fixed.
   Vocabulary: marquee (home opening), reel (numbered section tiles),
   band (one section of the home), roll (list of entries with a still),
   booth (curated block), plan (page grid), margin (repère column),
   reading (text column), para (heading + text block), manchette
   (heading set in the margin), plate (page photograph), colophon (footer).
   ===================================================================== */

:root {
  color-scheme: dark;

  /* 1. Palette, fixed for every band */
  --rpn-ground:        #14120F;   /* the room, lights down                 */
  --rpn-ground-lift:   #1B1815;   /* alternating bands                     */
  --rpn-ground-deep:   #0E0C0A;   /* colophon                              */
  --rpn-ivory:         #F2EDE3;   /* text                                  */
  --rpn-ivory-dim:     #B8AE9E;   /* notes, mentions, cotes                */
  --rpn-ivory-faint:   #8A8174;   /* the quietest metadata                 */
  --rpn-red:           #8E2B24;   /* curtain: fills, rules, button         */
  --rpn-red-ink:       #D8564A;   /* red as small text (4.8:1 on ground)   */
  --rpn-rule:          #33302A;   /* thin rule                             */
  --rpn-rule-strong:   #5A5347;   /* structuring rule                      */
  --rpn-selection:     #4A2320;

  /* 2. Type: system stacks only */
  --rpn-display: "Avenir Next Condensed", "Roboto Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --rpn-serif:   "Iowan Old Style", Charter, "Bitstream Charter", "Sitka Text", Cambria, Georgia, "Times New Roman", serif;

  --rpn-t-base:  clamp(1.02rem, 0.98rem + 0.2vw, 1.12rem);
  --rpn-t-small: 0.88rem;
  --rpn-t-cote:  0.76rem;
  --rpn-t-h1:    clamp(2.2rem, 1.4rem + 2.6vw, 3.8rem);
  --rpn-t-h1-in: clamp(1.9rem, 1.3rem + 2.2vw, 3.3rem);
  --rpn-t-h2:    clamp(1.45rem, 1.15rem + 1.1vw, 2.1rem);
  --rpn-t-h3:    clamp(1.15rem, 1.05rem + 0.45vw, 1.45rem);
  --rpn-leading: 1.58;

  /* 3. Rhythm */
  --rpn-frame:    82rem;     /* page width                                */
  --rpn-measure:  38rem;     /* reading column                            */
  --rpn-margin-w: 13rem;     /* margin column                             */
  --rpn-gutter:   clamp(1.4rem, 3vw, 3rem);
  --rpn-edge:     clamp(1rem, 3.4vw, 2.6rem);
  --rpn-step:     1.2rem;
  --rpn-band:     clamp(2.4rem, 5vw, 4.4rem);
}

/* =====================================================================
   BASE
   ===================================================================== */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; }
}
body {
  margin: 0;
  background: var(--rpn-ground);
  color: var(--rpn-ivory);
  font-family: var(--rpn-serif);
  font-size: var(--rpn-t-base);
  line-height: var(--rpn-leading);
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
}
::selection { background: var(--rpn-selection); color: var(--rpn-ivory); }
img, svg, picture { max-width: 100%; height: auto; display: block; }
a { color: var(--rpn-ivory); text-decoration: underline; text-decoration-color: var(--rpn-red-ink); text-decoration-thickness: 1px; text-underline-offset: 0.16em; }
a:hover { color: var(--rpn-red-ink); }
:focus-visible { outline: 2px solid var(--rpn-red-ink); outline-offset: 3px; }
h1, h2, h3, h4 { font-family: var(--rpn-display); font-weight: 600; line-height: 1.04; margin: 0; color: var(--rpn-ivory); letter-spacing: 0.005em; text-wrap: balance; }
p, ul, ol, figure, blockquote { margin: 0; }
time { font-variant-numeric: tabular-nums; }

.rpn-skip {
  position: absolute; left: -9999px; top: 0;
  background: var(--rpn-red); color: var(--rpn-ivory);
  padding: 0.6rem 1rem; font-family: var(--rpn-display); z-index: 60;
}
.rpn-skip:focus { left: 0.6rem; top: 0.6rem; position: fixed; }

.rpn-frame { width: 100%; max-width: var(--rpn-frame); margin: 0 auto; padding: 0 var(--rpn-edge); }

/* Small caps line used for cotes, kickers, labels */
.rpn-cote, .rpn-kicker, .rpn-label {
  font-family: var(--rpn-display);
  font-size: var(--rpn-t-cote);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rpn-ivory-dim);
  font-weight: 500;
}
.rpn-kicker { color: var(--rpn-red-ink); }
.rpn-kicker::before { content: ""; display: inline-block; width: 1.6rem; height: 1px; background: var(--rpn-red); vertical-align: middle; margin-right: 0.6rem; }

/* =====================================================================
   MASTHEAD
   ===================================================================== */

.rpn-masthead { border-bottom: 1px solid var(--rpn-rule-strong); background: var(--rpn-ground); }
.rpn-masthead__row {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 0.6rem 2rem; padding: 0.9rem 0 0.6rem;
}
.rpn-wordmark { display: flex; align-items: center; gap: 0.8rem; text-decoration: none; color: var(--rpn-ivory); }
.rpn-wordmark:hover { color: var(--rpn-ivory); }
.rpn-wordmark svg { width: 2.4rem; height: 2.4rem; flex: none; }
.rpn-wordmark__name {
  display: block; font-family: var(--rpn-display); font-weight: 700;
  font-size: clamp(1.45rem, 1.1rem + 1.4vw, 2.1rem); line-height: 1; letter-spacing: 0.04em; text-transform: uppercase;
}
.rpn-wordmark__line {
  display: block; font-family: var(--rpn-serif); font-style: italic; font-size: var(--rpn-t-small);
  color: var(--rpn-ivory-dim); margin-top: 0.25rem; letter-spacing: 0;
}
.rpn-edition { font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.12em; text-transform: uppercase; color: var(--rpn-ivory-faint); text-align: right; }
.rpn-edition span { display: block; }
@media (max-width: 55.99em) { .rpn-edition { display: none; } }

.rpn-nav { border-top: 1px solid var(--rpn-rule); }
.rpn-nav__toggle { position: absolute; opacity: 0; width: 1px; height: 1px; overflow: hidden; }
.rpn-nav__handle {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.65rem 0; cursor: pointer;
  font-family: var(--rpn-display); font-size: var(--rpn-t-small); letter-spacing: 0.14em; text-transform: uppercase; color: var(--rpn-ivory);
}
.rpn-nav__handle::after { content: "+"; color: var(--rpn-red-ink); font-size: 1.2rem; line-height: 1; }
.rpn-nav__toggle:checked ~ .rpn-nav__handle::after { content: "\2013"; }
.rpn-nav__toggle:focus-visible ~ .rpn-nav__handle { outline: 2px solid var(--rpn-red-ink); outline-offset: 3px; }
.rpn-nav__list { list-style: none; margin: 0; padding: 0; display: none; border-top: 1px solid var(--rpn-rule); }
.rpn-nav__toggle:checked ~ .rpn-nav__list { display: block; }
.rpn-nav__list li { border-bottom: 1px solid var(--rpn-rule); }
.rpn-nav__list a {
  display: block; padding: 0.7rem 0; text-decoration: none;
  font-family: var(--rpn-display); font-size: 0.98rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--rpn-ivory);
}
.rpn-nav__list a:hover, .rpn-nav__list a[aria-current="page"] { color: var(--rpn-red-ink); }
@media (min-width: 56em) {
  .rpn-nav__handle { display: none; }
  .rpn-nav__list { display: flex; flex-wrap: wrap; gap: 0 2rem; border-top: 0; }
  .rpn-nav__toggle:checked ~ .rpn-nav__list { display: flex; }
  .rpn-nav__list li { border-bottom: 0; }
  .rpn-nav__list a { padding: 0.7rem 0 0.6rem; border-bottom: 2px solid transparent; font-size: 0.9rem; }
  .rpn-nav__list a:hover, .rpn-nav__list a[aria-current="page"] { border-bottom-color: var(--rpn-red); color: var(--rpn-ivory); }
}

/* =====================================================================
   BREADCRUMB
   ===================================================================== */

.rpn-trail { padding: 0.9rem 0 0; font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.1em; text-transform: uppercase; color: var(--rpn-ivory-faint); }
.rpn-trail ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.3rem 0.5rem; }
.rpn-trail li + li::before { content: "/"; color: var(--rpn-red); margin-right: 0.5rem; }
.rpn-trail a { color: var(--rpn-ivory-dim); text-decoration: none; }
.rpn-trail a:hover { color: var(--rpn-red-ink); }
.rpn-trail [aria-current="page"] { color: var(--rpn-ivory); }

/* =====================================================================
   HOME · MARQUEE (opening: text facing the photograph, before any h2)
   ===================================================================== */

.rpn-marquee {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.6rem var(--rpn-gutter);
  padding: clamp(1.2rem, 2.6vw, 2rem) 0 clamp(1.4rem, 2.8vw, 2.2rem);
  border-bottom: 1px solid var(--rpn-rule-strong);
  align-items: center;
}
@media (min-width: 62em) { .rpn-marquee { grid-template-columns: minmax(0, 11fr) minmax(0, 10fr); } }
.rpn-marquee__text > * + * { margin-top: 0.9rem; }
.rpn-marquee h1 { font-size: var(--rpn-t-h1); line-height: 0.98; letter-spacing: -0.005em; max-width: 17ch; text-transform: uppercase; }
.rpn-marquee h1 em { font-style: normal; color: var(--rpn-red-ink); }
.rpn-deck { font-size: clamp(1.05rem, 1rem + 0.3vw, 1.2rem); line-height: 1.5; max-width: 34rem; color: var(--rpn-ivory); }
.rpn-actions { display: flex; flex-wrap: wrap; gap: 0.7rem 1rem; align-items: center; }
.rpn-button {
  display: inline-block; text-decoration: none;
  background: var(--rpn-red); color: var(--rpn-ivory);
  font-family: var(--rpn-display); font-size: 0.92rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600;
  padding: 0.85rem 1.4rem; border: 1px solid var(--rpn-red);
  transition: background 140ms ease, border-color 140ms ease;
}
.rpn-button:hover { background: #A5342B; border-color: #A5342B; color: var(--rpn-ivory); }
.rpn-button--line { background: transparent; border-color: var(--rpn-rule-strong); }
.rpn-button--line:hover { background: transparent; border-color: var(--rpn-ivory); color: var(--rpn-ivory); }
.rpn-tally { list-style: none; margin: 0; padding: 0.8rem 0 0; border-top: 1px solid var(--rpn-rule); display: flex; flex-wrap: wrap; gap: 0.3rem 1.8rem; }
.rpn-tally li { font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.14em; text-transform: uppercase; color: var(--rpn-ivory-dim); }
.rpn-tally b { color: var(--rpn-ivory); font-weight: 700; font-size: 1.05rem; letter-spacing: 0.04em; margin-right: 0.35rem; }
.rpn-marquee__still { margin: 0; }
.rpn-marquee__still img { width: 100%; height: auto; border: 1px solid var(--rpn-rule-strong); }
.rpn-marquee__still figcaption { font-size: var(--rpn-t-small); color: var(--rpn-ivory-faint); padding-top: 0.5rem; font-style: italic; }

/* =====================================================================
   HOME · REEL (numbered section tiles)
   ===================================================================== */

.rpn-reel { padding: clamp(1.6rem, 3vw, 2.4rem) 0 calc(var(--rpn-band) * 0.8); }
.rpn-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 0.4rem 2rem; border-bottom: 1px solid var(--rpn-rule-strong); padding-bottom: 0.7rem; margin-bottom: 1.4rem; }
.rpn-head h2 { font-size: var(--rpn-t-h2); text-transform: uppercase; letter-spacing: 0.02em; }
.rpn-head h2 .rpn-no { color: var(--rpn-red-ink); margin-right: 0.6rem; font-weight: 500; }
.rpn-head__note { font-family: var(--rpn-serif); font-style: italic; font-size: var(--rpn-t-small); color: var(--rpn-ivory-dim); max-width: 34rem; }
.rpn-head__link { font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none; color: var(--rpn-red-ink); white-space: nowrap; }
.rpn-head__link:hover { color: var(--rpn-ivory); }
.rpn-head__link::after { content: " \2192"; }
@media (max-width: 45.99em) { .rpn-head { grid-template-columns: minmax(0, 1fr); } .rpn-head__link { white-space: normal; } }

.rpn-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.6rem var(--rpn-gutter); }
@media (min-width: 46em) { .rpn-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rpn-tile { display: grid; gap: 0.7rem; }
.rpn-tile__still { margin: 0; position: relative; }
.rpn-tile__still img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.rpn-tile__no {
  position: absolute; left: 0; bottom: 0;
  background: var(--rpn-ground); color: var(--rpn-red-ink);
  font-family: var(--rpn-display); font-weight: 700; font-size: 1.6rem; line-height: 1; letter-spacing: 0.04em;
  padding: 0.45rem 0.8rem 0.3rem; border-top: 1px solid var(--rpn-red); border-right: 1px solid var(--rpn-red);
}
.rpn-tile h3 { font-size: var(--rpn-t-h3); text-transform: uppercase; letter-spacing: 0.03em; }
.rpn-tile h3 a { text-decoration: none; }
.rpn-tile h3 a:hover { color: var(--rpn-red-ink); }
.rpn-tile p { font-size: var(--rpn-t-small); color: var(--rpn-ivory-dim); }
.rpn-tile__count { font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.14em; text-transform: uppercase; color: var(--rpn-ivory-faint); }

/* =====================================================================
   HOME · BANDS (one per section) and ROLL (entries with a still)
   ===================================================================== */

.rpn-band { padding: var(--rpn-band) 0; border-top: 1px solid var(--rpn-rule-strong); scroll-margin-top: 1rem; }
.rpn-band--lift { background: var(--rpn-ground-lift); }
.rpn-band__intro { max-width: 40rem; color: var(--rpn-ivory-dim); margin-bottom: 1.4rem; }

.rpn-roll { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rpn-rule-strong); }
.rpn-entry {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.7rem var(--rpn-gutter);
  padding: 1.2rem 0; border-bottom: 1px solid var(--rpn-rule);
}
@media (min-width: 46em) { .rpn-entry { grid-template-columns: minmax(0, 3fr) minmax(0, 7fr); align-items: start; } }
.rpn-entry__still { margin: 0; }
.rpn-entry__still a { display: block; }
.rpn-entry__still img { width: 100%; aspect-ratio: 7 / 4; object-fit: cover; transition: opacity 140ms ease; }
.rpn-entry__still a:hover img { opacity: 0.85; }
.rpn-entry__text > * + * { margin-top: 0.45rem; }
.rpn-entry__text h3 { font-size: var(--rpn-t-h3); line-height: 1.12; }
.rpn-entry__text h3 a { text-decoration: none; }
.rpn-entry__text h3 a:hover { color: var(--rpn-red-ink); text-decoration: underline; }
.rpn-entry__text p { color: var(--rpn-ivory-dim); font-size: 0.98rem; max-width: 44rem; }
.rpn-entry__cote { display: flex; flex-wrap: wrap; gap: 0.3rem 1rem; }
.rpn-entry__cote .rpn-mark { color: var(--rpn-red-ink); }
.rpn-roll--compact .rpn-entry { padding: 0.9rem 0; }
@media (min-width: 46em) { .rpn-roll--compact .rpn-entry { grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr); } }

/* =====================================================================
   HOME · BOOTH (curated block, two stills and a list)
   ===================================================================== */

.rpn-booth { padding: var(--rpn-band) 0; border-top: 1px solid var(--rpn-rule-strong); display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.8rem var(--rpn-gutter); }
@media (min-width: 62em) { .rpn-booth { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } }
.rpn-booth__aside > * + * { margin-top: 1rem; }
.rpn-booth__aside h2 { font-size: var(--rpn-t-h2); text-transform: uppercase; letter-spacing: 0.02em; }
.rpn-booth__aside p { color: var(--rpn-ivory-dim); max-width: 30rem; }
.rpn-diptych { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; margin-top: 1.3rem; }
.rpn-diptych figure { margin: 0; }
.rpn-diptych img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.rpn-booth__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rpn-rule-strong); }
.rpn-booth__list li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: 0.2rem 0.8rem; padding: 0.95rem 0; border-bottom: 1px solid var(--rpn-rule); }
.rpn-booth__list .rpn-no { grid-row: 1 / span 2; font-family: var(--rpn-display); color: var(--rpn-red-ink); font-size: 1.3rem; font-weight: 500; line-height: 1.2; }
.rpn-booth__list h3 { font-size: 1.12rem; line-height: 1.15; }
.rpn-booth__list h3 a { text-decoration: none; }
.rpn-booth__list h3 a:hover { color: var(--rpn-red-ink); text-decoration: underline; }
.rpn-booth__list p { grid-column: 2; font-size: var(--rpn-t-small); color: var(--rpn-ivory-dim); }

/* =====================================================================
   INNER PAGES · PLAN (margin column + reading column)
   ===================================================================== */

.rpn-plan { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem var(--rpn-gutter); padding: 1.3rem 0 3rem; align-items: start; }
.rpn-margin { order: 2; }
.rpn-reading { order: 1; min-width: 0; }
@media (min-width: 62em) {
  .rpn-plan { grid-template-columns: var(--rpn-margin-w) minmax(0, 1fr); }
  .rpn-plan > .rpn-margin { grid-column: 1; grid-row: 1; order: 0; position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
  .rpn-plan > .rpn-reading { grid-column: 2; grid-row: 1; order: 0; }
  .rpn-plan--inverse { grid-template-columns: minmax(0, 1fr) var(--rpn-margin-w); }
  .rpn-plan--inverse > .rpn-margin { grid-column: 2; }
  .rpn-plan--inverse > .rpn-reading { grid-column: 1; }
}
.rpn-margin { font-size: var(--rpn-t-small); color: var(--rpn-ivory-dim); border-top: 2px solid var(--rpn-red); padding-top: 0.7rem; }
.rpn-margin__title { font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.14em; text-transform: uppercase; color: var(--rpn-ivory); margin: 0 0 0.45rem; }
.rpn-margin ul { list-style: none; margin: 0 0 1.4rem; padding: 0; }
.rpn-margin li { border-bottom: 1px solid var(--rpn-rule); }
.rpn-margin li a { display: block; padding: 0.32rem 0; color: var(--rpn-ivory-dim); text-decoration: none; }
.rpn-margin li a:hover { color: var(--rpn-red-ink); }
.rpn-margin li a[aria-current="page"] { color: var(--rpn-ivory); }
.rpn-margin__note { font-style: italic; color: var(--rpn-ivory-faint); }

/* Opening of a page: cote, h1, standfirst, meta */
.rpn-opening { padding: 0.6rem 0 1.4rem; max-width: 46rem; }
.rpn-opening > * + * { margin-top: 0.8rem; }
.rpn-opening h1 { font-size: var(--rpn-t-h1-in); line-height: 1.02; text-transform: uppercase; letter-spacing: 0.005em; }
.rpn-standfirst { font-size: clamp(1.08rem, 1rem + 0.35vw, 1.25rem); line-height: 1.5; color: var(--rpn-ivory); }
.rpn-meta { display: flex; flex-wrap: wrap; gap: 0.3rem 1.4rem; font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.12em; text-transform: uppercase; color: var(--rpn-ivory-faint); }
.rpn-meta a { color: var(--rpn-ivory-dim); text-decoration: none; }
.rpn-meta a:hover { color: var(--rpn-red-ink); }

.rpn-plate { margin: 0 0 1.6rem; }
.rpn-plate img { width: 100%; height: auto; border: 1px solid var(--rpn-rule-strong); }
.rpn-plate figcaption { font-size: var(--rpn-t-small); color: var(--rpn-ivory-faint); font-style: italic; padding-top: 0.45rem; }

/* Body: blocks with the heading set in the margin (manchette) */
.rpn-body { border-top: 1px solid var(--rpn-rule-strong); }
.rpn-para { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 var(--rpn-gutter); padding: 1.25rem 0; border-bottom: 1px solid var(--rpn-rule); align-items: start; }
.rpn-para p + p, .rpn-para ul + p, .rpn-para p + ul, .rpn-para ol + p, .rpn-para p + ol { margin-top: var(--rpn-step); }
.rpn-para p, .rpn-para li { max-width: var(--rpn-measure); }
.rpn-para ul, .rpn-para ol { padding-left: 1.2rem; }
.rpn-para li + li { margin-top: 0.35rem; }
.rpn-para h3 { font-size: 1.15rem; margin-top: var(--rpn-step); max-width: var(--rpn-measure); }
.rpn-para a { color: var(--rpn-ivory); }
.rpn-para a:hover { color: var(--rpn-red-ink); }
.rpn-manchette {
  font-family: var(--rpn-display); font-size: 0.98rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--rpn-red-ink); line-height: 1.22; padding-top: 0.15rem; margin-bottom: 0.7rem;
}
.rpn-para--lead p:first-child { font-size: clamp(1.06rem, 1rem + 0.3vw, 1.2rem); }
@media (min-width: 62em) {
  .rpn-para { grid-template-columns: 11rem minmax(0, 1fr); gap: 0.6rem var(--rpn-gutter); }
  .rpn-para > *:not(.rpn-manchette) { grid-column: 2; }
  .rpn-manchette { grid-column: 1; grid-row: 1; text-align: right; margin-bottom: 0; }
}

/* Read next */
.rpn-onward { margin-top: 2rem; }
.rpn-onward__title { font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.14em; text-transform: uppercase; color: var(--rpn-ivory-dim); margin-bottom: 0.6rem; }
.rpn-onward__title::before { content: ""; display: inline-block; width: 1.6rem; height: 1px; background: var(--rpn-red); vertical-align: middle; margin-right: 0.6rem; }

/* Hub: section roll before the text */
.rpn-section-roll { margin: 0 0 2rem; }
.rpn-section-roll .rpn-head { margin-bottom: 0; border-bottom: 0; padding-bottom: 0.6rem; }

/* Service pages */
.rpn-service .rpn-para p { max-width: 40rem; }

/* =====================================================================
   COLOPHON (footer), colours fixed: never black on black
   ===================================================================== */

.rpn-colophon { background: var(--rpn-ground-deep); color: var(--rpn-ivory-dim); border-top: 2px solid var(--rpn-red); padding: 2.2rem 0 2.4rem; font-size: var(--rpn-t-small); }
.rpn-colophon__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.6rem var(--rpn-gutter); }
@media (min-width: 46em) { .rpn-colophon__grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); } }
.rpn-colophon h2 { font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.14em; text-transform: uppercase; color: var(--rpn-ivory); margin-bottom: 0.6rem; font-weight: 600; }
.rpn-colophon p { color: var(--rpn-ivory-dim); max-width: 30rem; }
.rpn-colophon p + p { margin-top: 0.6rem; }
.rpn-colophon ul { list-style: none; margin: 0; padding: 0; }
.rpn-colophon li { padding: 0.2rem 0; border-bottom: 1px solid var(--rpn-rule); }
.rpn-colophon a { color: var(--rpn-ivory); text-decoration: none; }
.rpn-colophon a:hover { color: var(--rpn-red-ink); }
.rpn-colophon__sign { font-family: var(--rpn-display); letter-spacing: 0.06em; text-transform: uppercase; color: var(--rpn-ivory); font-size: 0.82rem; }
.rpn-colophon__foot { border-top: 1px solid var(--rpn-rule-strong); margin-top: 1.6rem; padding-top: 0.9rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.3rem 1.4rem; font-family: var(--rpn-display); font-size: var(--rpn-t-cote); letter-spacing: 0.12em; text-transform: uppercase; color: var(--rpn-ivory-faint); }

/* =====================================================================
   404
   ===================================================================== */

.rpn-lost { padding: 3rem 0 4rem; max-width: 40rem; }
.rpn-lost > * + * { margin-top: 1rem; }
.rpn-lost h1 { font-size: var(--rpn-t-h1-in); text-transform: uppercase; }

/* =====================================================================
   PRINT
   ===================================================================== */

@media print {
  body { background: #fff; color: #000; }
  .rpn-nav, .rpn-margin, .rpn-onward, .rpn-skip, .rpn-colophon, .rpn-actions { display: none; }
  .rpn-plan { grid-template-columns: minmax(0, 1fr); }
  a { color: inherit; text-decoration: none; }
}