/* ---------- Credits, Privacy and the 404 page in the advisory home's look (owner, 2026-11-06) ----------
   "also ensure all other pages i.e. people follow the same branding. as the other pages." Linked after home.css (which sets
   the tokens, Newsreader Text 300 headings, Archivo text, the ink buttons and the dark advisory header) and silver-light.css,
   before footer.css. Only these three pages load it. The words on the pages do not change; this file sets their look:
   the silver stage (home.css --stage-top/mid/bot), serif headings, spectrum hairlines as the one accent, surface cards.
   Contrast: ink is 15:1 or more on the stage and on --surface; --muted is 6.5:1 on --stage-top and 7.3:1 on --surface
   (home.css). */

/* A short moving spectrum hairline under a page's opening heading (the language of the home's seams). */
.credits__body > h1::after {
  content: ""; display: block; width: 96px; height: 2px; margin-top: 28px; border-radius: 2px; pointer-events: none;
  background: var(--spectrum-flow) 0 0 / 200% 100% repeat-x; animation: spectrum-flow var(--flow-slow) linear infinite; }

/* ---------- Credits, Privacy, 404: the silver stage with the light behind the heading ---------- */
/* The light starts from the stage gradient the home and Testimonials use, so it meets the page ground with no seam. */
.credits > .silver-light { --sl-top: #dcdfe4; --sl-bot: #edeef1; }
/* At least one screen less the footer, so a short page (the 404) keeps the footer at the window's foot. */
.credits { min-height: calc(100svh - 140px); padding: calc(var(--nav-h) + 120px) 0 120px; background: var(--stage-bot); }
.credits__body > h1.h2 { font-size: clamp(44px, 6vw, 80px); line-height: 1.02; letter-spacing: -0.02em; color: var(--ink); text-wrap: balance; }
.credits__body > h1 + .lead { margin-top: 28px; }
.credits .lead { font-size: 17px; line-height: 27px; color: var(--muted); }
/* Credits' section titles in the serif, like the home's subheads. */
.credits__body > h2 { margin: 64px 0 16px; font-family: var(--font-display); font-weight: 300; font-size: 30px; line-height: 1.15; letter-spacing: -0.012em; color: var(--ink); }
.credits__body li strong { font-weight: 500; }
.credits__body li { border-top-color: var(--line); }
/* Privacy: clean rows under hairlines; the topic in Archivo 500. */
.legal__item h2 { font-weight: 500; }
.legal__item, .legal__date { border-top-color: var(--line); }
.legal__item:first-of-type { margin-top: 64px; }
/* 404 */
.notfound__go { margin-top: 36px; }
.notfound .btn { height: 48px; padding: 0 28px; font-size: 15px; }
@media (max-width: 809px) {
  .credits { padding: calc(var(--nav-h) + 72px) 0 80px; }
  .credits__body > h2 { margin-top: 48px; font-size: 26px; }
  .legal__item:first-of-type { margin-top: 44px; }
}

/* Reduced motion: the hairline holds its resting colour. Forced colours: a plain system line. */
@media (prefers-reduced-motion: reduce) {
  .credits__body > h1::after { animation: none; }
}
@media (forced-colors: active) {
  .credits__body > h1::after { forced-color-adjust: none; background: CanvasText; animation: none; }
}