/* v3-pages.css — redesign v3 "the gallery wall" for every inner page of history.sesow.com (records e/, press/, films/,
   event pages, search). Loaded LAST so it re-points each page's own tokens to the v3 palette and type.
   Claude, 2026-10-23 (Matt: "start restyling and make the web page best in breed"). */
:root {
  --v3-wall: #fbfbf9; --v3-panel: #ffffff; --v3-ink: #141416; --v3-soft: #55585f; --v3-rule: #e3e3df; --v3-tint: #f1f1ed;
  --v3-acc: #d9520f; --v3-acc-hi: #f2601b; --v3-cobalt: #2445d4;
  --v3-display: "Bricolage Grotesque", "Arial Black", Impact, sans-serif;
  --v3-text: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --v3-read: "Source Serif 4", Georgia, "Times New Roman", serif;
  /* re-point the older page tokens */
  --bg: var(--v3-wall); --bg2: var(--v3-tint); --card: var(--v3-panel); --paper: var(--v3-wall); --paper-2: var(--v3-tint);
  --ink: var(--v3-ink); --ink2: var(--v3-soft); --ink3: var(--v3-soft); --ink-2: var(--v3-soft); --rule: var(--v3-rule);
  --red: var(--v3-acc); --link: var(--v3-acc); --gold: #a87a06; --yellow: var(--v3-acc-hi); --yel: var(--v3-acc-hi); --blue: var(--v3-cobalt);
  --fd: var(--v3-display); --display: var(--v3-display); --fm: var(--v3-text); --fu: var(--v3-text); --mono: var(--v3-text);
  --fb: var(--v3-text); --body: var(--v3-text);
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --v3-wall: #121315; --v3-panel: #1a1b1e; --v3-ink: #f1f1ee; --v3-soft: #a4a7ae; --v3-rule: #2c2e33; --v3-tint: #1f2024;
  --v3-acc: #ff7a35; --v3-acc-hi: #ff7a35; --v3-cobalt: #8ea2ff; --gold: #e8b53a; color-scheme: dark } }
:root[data-theme="dark"] {
  --v3-wall: #121315; --v3-panel: #1a1b1e; --v3-ink: #f1f1ee; --v3-soft: #a4a7ae; --v3-rule: #2c2e33; --v3-tint: #1f2024;
  --v3-acc: #ff7a35; --v3-acc-hi: #ff7a35; --v3-cobalt: #8ea2ff; --gold: #e8b53a; color-scheme: dark }

body.v3p { background: var(--v3-wall) !important; color: var(--v3-ink); font-family: var(--v3-text); font-size: 16.5px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body.v3p a { color: inherit; text-decoration-color: var(--v3-acc); text-underline-offset: 3px; }
body.v3p a:hover { color: var(--v3-acc); }
body.v3p h1, body.v3p h2, body.v3p h3 { font-family: var(--v3-display); letter-spacing: -.012em; text-transform: none; text-wrap: balance; }
body.v3p h2 { font-weight: 800; }

/* breadcrumb bar */
body.v3p .bar { background: var(--v3-tint) !important; color: var(--v3-soft) !important; border-bottom: 1px solid var(--v3-rule) !important; font: 500 14px/1.4 var(--v3-text) !important; letter-spacing: 0 !important; text-transform: none; }
body.v3p .bar a { color: var(--v3-ink) !important; text-decoration: none; border-bottom: 1px solid var(--v3-rule); }
body.v3p .bar a:hover { color: var(--v3-acc) !important; }

/* titles and labels */
body.v3p .ttl { font-family: var(--v3-display) !important; font-weight: 800 !important; font-size: clamp(2.1rem, 4.6vw, 3.9rem) !important; line-height: 1 !important; letter-spacing: -.025em !important; text-transform: none !important; margin: 26px 0 12px !important; max-width: 22ch; }
body.v3p .eyebrow, body.v3p .label, body.v3p .isv-k, body.v3p .sm-h .sm-n { font: 600 12.5px/1.3 var(--v3-text) !important; letter-spacing: .12em !important; text-transform: uppercase; color: var(--v3-acc) !important; }
body.v3p .lead { font-family: var(--v3-text); font-size: clamp(18px, 1.3vw, 20px); line-height: 1.6; }
body.v3p .lines { font-family: var(--v3-text) !important; color: var(--v3-soft); }

/* key-facts wall label */
body.v3p .kf { background: var(--v3-panel) !important; border: 1px solid var(--v3-rule) !important; border-left: 4px solid var(--v3-acc-hi) !important; border-top: 1px solid var(--v3-rule) !important; border-radius: 0 !important; font-family: var(--v3-text) !important; }
body.v3p .kf dt { color: var(--v3-soft) !important; font: 600 12.5px var(--v3-text) !important; letter-spacing: .1em; }
body.v3p .kf-links a { font: 600 13.5px/1 var(--v3-text) !important; border: 1.5px solid var(--v3-ink) !important; color: var(--v3-ink) !important; border-radius: 999px !important; padding: 8px 12px !important; background: transparent !important; }
body.v3p .kf-links a:last-child { background: var(--v3-ink) !important; color: var(--v3-wall) !important; }
body.v3p .kf-links a:hover { background: var(--v3-acc-hi) !important; border-color: var(--v3-acc-hi) !important; color: #fff !important; }

/* sections */
body.v3p section.src, body.v3p section.notes, body.v3p section.quotes, body.v3p section.fbw, body.v3p section.prl, body.v3p section.gal, body.v3p section.vid, body.v3p section.doc { border-top: 2px solid var(--v3-ink); padding-top: 18px; margin-top: 34px; }
body.v3p blockquote { border-left: 4px solid var(--v3-acc-hi) !important; background: transparent !important; padding: 4px 0 4px 18px !important; margin: 14px 0 !important; font: 600 clamp(19px, 2vw, 23px)/1.35 var(--v3-display) !important; letter-spacing: -.005em; }
body.v3p blockquote footer { font: 500 14px var(--v3-text) !important; color: var(--v3-soft) !important; margin-top: 8px; }
body.v3p .post { background: var(--v3-panel) !important; border: 1px solid var(--v3-rule) !important; border-radius: 0 !important; }
body.v3p .gal figure { background: var(--v3-panel) !important; border: 1px solid var(--v3-rule) !important; }
body.v3p .gal figcaption, body.v3p .sm-f figcaption { font-family: var(--v3-text) !important; font-size: 13px !important; color: var(--v3-soft) !important; }
body.v3p .cite { font-family: var(--v3-text) !important; background: var(--v3-tint) !important; border: 0 !important; }
body.v3p .plain li { border-bottom: 1px solid var(--v3-rule) !important; }
body.v3p .pn a { font: 700 1.05rem/1.3 var(--v3-display) !important; letter-spacing: -.005em !important; color: var(--v3-ink) !important; }
body.v3p .pn a span { color: var(--v3-acc) !important; }

/* THE ARTICLE — full text, set for reading */
body.v3p .isv { border-top: 3px solid var(--v3-ink) !important; padding-top: 20px !important; margin-top: 30px !important; background: transparent !important; }
body.v3p .isv-h, body.v3p .art-h { font: 800 clamp(1.7rem, 3.2vw, 2.4rem)/1.05 var(--v3-display) !important; letter-spacing: -.02em !important; text-transform: none !important; color: var(--v3-ink) !important; }
body.v3p .isv-doc, body.v3p .pf-doc { background: var(--v3-panel) !important; border: 1px solid var(--v3-rule) !important; border-radius: 0 !important; padding: clamp(16px, 3vw, 30px) !important; margin: 18px 0 26px !important; }
body.v3p .isv-doc h3, body.v3p .pf-doc h3 { font: 800 clamp(1.4rem, 2.6vw, 1.9rem)/1.12 var(--v3-display) !important; margin: 4px 0 6px !important; }
body.v3p .isv-m { font: 500 14.5px var(--v3-text) !important; color: var(--v3-soft) !important; }
body.v3p .isv-tx, body.v3p .doc-tx, body.v3p .pf-tx, body.v3p .orig, body.v3p .ocr-b { font-family: var(--v3-read) !important; max-width: 68ch; }
body.v3p .isv-tx p, body.v3p .doc-tx p, body.v3p .pf-tx p, body.v3p .ocr-b p { font: 400 18.5px/1.72 var(--v3-read) !important; margin: 0 0 1.05em !important; color: var(--v3-ink); }
body.v3p .art-credit, body.v3p .isv-hint, body.v3p .doc-hint, body.v3p .doc-how { font: italic 14px/1.5 var(--v3-text) !important; color: var(--v3-soft) !important; }
body.v3p .isv-pages figure, body.v3p .dpages figure { background: var(--v3-tint); border: 1px solid var(--v3-rule); }
body.v3p .orig { border-left: 4px solid var(--v3-acc-hi) !important; }

/* folds */
body.v3p details.cx-d > .cx-s, body.v3p details.cx-more > summary { border-left-color: var(--v3-acc-hi) !important; border-radius: 0 !important; background: var(--v3-panel) !important; font-family: var(--v3-text) !important; }
body.v3p .cx-tools button, body.v3p .cx-tb button { border-radius: 999px !important; font-family: var(--v3-text) !important; }

/* press room index / film pages */
body.v3p .phero { background: #141416 !important; border-bottom: 5px solid var(--v3-acc-hi) !important; }
body.v3p .phero .eyebrow { color: #ffb27a !important; }
body.v3p .big { font-family: var(--v3-display) !important; font-weight: 800 !important; letter-spacing: -.03em !important; }
body.v3p .nums div { border-top-color: var(--v3-acc-hi) !important; }
body.v3p .nums b { font-family: var(--v3-display) !important; font-weight: 800 !important; }
body.v3p .callout { background: var(--v3-acc-hi) !important; color: #fff !important; }
body.v3p .callout a { color: #fff !important; }
body.v3p .yrs { background: var(--v3-wall) !important; }
body.v3p .card { border-radius: 0 !important; }

/* the v3 nav replaces the old top nav bar */
body.v3p header.topnav { display: none !important; }