/* ============================================================
   Prozpx: dark theme layer for the site pages (2026-09-29).
   Loaded LAST in <head>, after each page's own <style>, so these token
   values win. Covers both token families the pages use:
   - the light page system (--bg/--ink/--grey..., with -2 and 2 variants)
   - the original brand system (--white is the text colour, --font-d/-s/-m)
   Same palette as the homepage and the brand guidelines.
   ============================================================ */
:root{
  /* grounds */
  --bg:#07090F; --bg-2:#0A0F1A; --bg2:#0A0F1A;
  --surface:#0C1221; --elevated:#111B30; --deep:#0C1221;
  /* ink */
  --ink:#F6FAFF; --ink-2:#C7D1E0; --ink2:#C7D1E0; --white:#F6FAFF; --on-deep:#F6FAFF;
  --grey:#8B9BB4; --grey-2:#7F8DA5; --grey2:#7F8DA5; --grey-light:#8B9BB4;
  /* lines */
  --line:#1C2B42; --line-soft:#15213A; --border:#1C2B42; --border-hi:#263D60;
  /* accent (one hue) */
  --gold:#F5B800; --gold-hi:#FFCE47; --goldhi:#FFCE47;
  --gold-soft:rgba(245,184,0,.12); --goldsoft:rgba(245,184,0,.12);
  --gold-dim:rgba(245,184,0,.08); --gold-glow:rgba(245,184,0,.16);
  /* semantic states */
  --teal:#0DCCA8; --teal-soft:rgba(13,204,168,.12); --tealsoft:rgba(13,204,168,.12); --teal-dim:rgba(13,204,168,.08);
  --red:#FF6B7F; --red-soft:rgba(255,107,127,.12);
  /* type */
  --serif:'Fraunces',Georgia,serif; --sans:'Figtree',system-ui,sans-serif; --mono:'Space Mono',ui-monospace,monospace;
  --font-d:'Fraunces',Georgia,serif; --font-s:'Figtree',system-ui,sans-serif; --font-m:'Figtree',system-ui,sans-serif;
  /* depth, tinted to the canvas */
  --shadow-sm:0 1px 2px rgba(0,0,0,.3);
  --shadow:0 10px 26px -10px rgba(0,0,0,.6),0 2px 6px rgba(0,0,0,.3);
  --shadow-lg:0 30px 60px -20px rgba(0,0,0,.7),0 12px 28px -10px rgba(0,0,0,.4);
  color-scheme:dark;
}
body{background:var(--bg);color:var(--ink)}
::selection{background:var(--gold);color:#07090F}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* Primary actions: gold with dark ink, the same as the homepage CTA.
   In the light theme these were near-black buttons; on a dark ground that
   would be a dark button on a dark page. */
.btn-dark,.btn-on-dark,.btn-gold{background:var(--gold)!important;color:#07090F!important;box-shadow:none!important}
.btn-dark:hover,.btn-on-dark:hover,.btn-gold:hover{background:var(--gold-hi)!important;color:#07090F!important}
.btn-outline{border-color:var(--line)!important;color:var(--ink)!important}
.btn-outline:hover{border-color:var(--gold)!important;background:transparent!important;color:var(--gold)!important}
.btn-back{color:var(--grey)!important}

/* Form controls follow the ground. */
input,select,textarea{background-color:var(--surface);color:var(--ink);border-color:var(--line)}
input::placeholder,textarea::placeholder{color:var(--grey-2)}
select option{background:var(--surface);color:var(--ink)}
body > nav:not(.prz-nav){display:none}
