/* Next Token site pages (About, Contact, Privacy, Terms, the fit checklist): the revised Creative look.
   Ivan, 26 Oct 2026: "update colours and fonts About, Contact, Privacy, Terms" (the fit checklist first had these rules
   inline). Loaded after each page's own styles, which keep the export's layout and type. Colours as on
   brightwork-creative.html and brightwork-setup.html: paper #f4f2ec and surface #fbfaf6, dark green #14261d for the menu,
   footer and dark bands, accent blue #1c46d0 for the one primary action, links in running text and the note rule.
   Text: #14261d and #4c4f55 on light; #fbfaf6 and #bbbdb4 on dark. Type: Erode with the middle-dot fix (already set by the
   pages' own layer). */
:root{
  color-scheme:light;
  --bw-green:#14261d;--bw-on-dark:#fbfaf6;--bw-on-dark-2:color-mix(in oklch,#fbfaf6 74%,#14261d);
  --c-room:#f4f2ec;--c-panel:#fbfaf6;--c-bone:var(--bw-green);--c-muted:#4c4f55;--c-ink-muted:#4c4f55;
  --c-jade:#1c46d0;--c-jade-hover:color-mix(in oklch,#1c46d0 82%,var(--bw-green));
  --c-deep:var(--bw-green);--c-raised:#e2ded3;--c-line:#e2ded3;--c-paper-shade:#f4f2ec;--c-paper-line:#e2ded3;
  --bg:var(--c-room);--surface:var(--c-panel);--fg:var(--bw-green);--muted:#4c4f55;--border:#e2ded3;--accent:#1c46d0;--accent-ink:#fbfaf6;
  --paper:#f4f2ec;--paper-2:#fbfaf6;--card:#fbfaf6;
  --ink:var(--bw-green);--ink-soft:#4c4f55;--ink-faint:#4c4f55;
  --line:#e2ded3;--line-strong:#e2ded3;
  --cobalt:#1c46d0;--cobalt-deep:var(--c-jade-hover);--cobalt-wash:#fbfaf6;--on-cobalt:#fbfaf6;
}
html,body{background:#f4f2ec;color:var(--bw-green)}
::selection{background:#1c46d0;color:#fbfaf6}
.label,.lede,.legal ul,.fine{color:#4c4f55}
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline-color:var(--bw-green)}
.skip{background:var(--bw-green);color:#fbfaf6}
/* Dark bands: the menu and the footer, in dark green with light type. */
.site-header,.site-footer{background:var(--bw-green);color:#fbfaf6;--c-bone:#fbfaf6;--c-muted:var(--bw-on-dark-2);--c-raised:color-mix(in oklch,#fbfaf6 16%,var(--bw-green))}
.site-header nav a,.site-header .wordmark,.site-footer a,.site-footer .wordmark{color:#fbfaf6}
.footer-top p,.footer-bottom,.footer-bottom span{color:var(--bw-on-dark-2)}
.site-header a:focus-visible,.site-footer a:focus-visible{outline-color:#fbfaf6}
/* The closing band on the surface tone; the note on surface with the accent rule, as live. */
.closing{background:#fbfaf6}
.note{background:#fbfaf6;border-left:2px solid #1c46d0}
.btn-primary,.btn-primary:hover{background:#1c46d0;color:#fbfaf6}
.btn-primary:hover{background:var(--c-jade-hover)}
.btn-ghost{color:var(--bw-green);border-color:var(--bw-green)}
.prose a,.note a{color:#1c46d0}
/* Dark bands inside the page (About: "The finish matters."). */
.dark{background:var(--bw-green);color:#fbfaf6;--c-bone:#fbfaf6;--c-muted:var(--bw-on-dark-2)}
.dark h2,.dark h3,.dark .text-link,.dark strong{color:#fbfaf6}
.dark p,.dark .label,.dark li{color:var(--bw-on-dark-2)}
.dark a:focus-visible{outline-color:#fbfaf6}
/* Running text links on light (About's intro, Privacy and Terms), in the accent as on live. */
.lede a,.legal a{color:#1c46d0}
.large-copy{color:var(--bw-green)}
/* Contact: the two choice cards' text in the secondary grey (it was a mix of the old bone and panel tones). */
.contact-choice p,.contact-choice .office p{color:#4c4f55}