/* 16 Oct 2026: tokens moved to Russell's Shared Signal 2.0 palette and type.
   Shared Signal — the Privacy, Terms and Disclosures pages, in Russell's v19
   legal-page layout: the site header, a two-tone title, the page's own painting
   behind the text, and each section on a white card. Header, footer and tokens
   are copied from index.html so the pages read as one site; keep them in step.
   Methodology and install keep _shared.css. */
:root{
  --ink:#0F172A; --ink-muted:#475569; --ink-faint:#64748B;
  --signal-50:#EFF5FF; --signal-100:#DBE8FE; --signal-200:#BFD7FE;
  --signal-300:#93BCFD; --signal-400:#5A9BFC; --signal-500:#1A7DFB;
  --signal-600:#0A5CF5; --signal-700:#0344CC; --signal-800:#0A3FBE;
  --violet-400:#8C7CEC; --violet-500:#6B5BE6; --violet-600:#5344C9;
  --paper:#FFFFFF;
  --content:76rem;
  /* the mist dissolves in and out again before the section below it */
  /* v61: clear through the top third so it stops hazing the tops of the clips */
  --band-fade:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0) 22%,
              rgba(0,0,0,.5) 48%,rgba(0,0,0,.78) 78%,rgba(0,0,0,0) 100%);
  --shadow-card:0 1px 2px rgba(22,35,58,.04), 0 12px 32px -18px rgba(12,48,120,.25);
  --sans:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Playfair Display",ui-serif,Georgia,"Times New Roman",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--signal-600)}
a:focus-visible{outline:2px solid var(--signal-500);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--content);margin:0 auto;padding-inline:20px}
@media (min-width:640px){.wrap{padding-inline:32px}}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;margin:0}

/* ---------------- header ---------------- */
header.site{position:sticky;top:0;z-index:40;background:rgba(251,252,254,.88);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--signal-100)}
header.site .wrap{display:flex;align-items:center;gap:20px;height:74px}
/* Russell's v14 mark, as v15 sizes it: his file cropped to the artwork (his
   LOGO_CROP fractions, applied once to the file rather than in CSS on every
   load), 40px tall in the header, 36px on phones and in the footer. */
.brand{display:flex;align-items:center;text-decoration:none;flex:none}
.brand img{display:block;height:40px;width:auto}
.brand img.sm{height:36px}
@media (max-width:639px){.brand img{height:36px}}
nav.top{margin-left:auto;display:flex;align-items:center;gap:26px}
nav.top a{color:var(--ink-muted);text-decoration:none;font-size:.95rem;font-weight:500}
nav.top a:hover{color:var(--ink)}
nav.top a.btn{color:#fff}
nav.top a.btn:hover{color:#fff}
nav.top a.dash{color:var(--ink);font-weight:600}
nav.top a.dash:hover{text-decoration:underline}
.btn{display:inline-flex;align-items:center;gap:8px;font:inherit;font-weight:600;
  cursor:pointer;border:0;border-radius:999px;padding:11px 22px;text-decoration:none;
  background:var(--signal-600);color:#fff;transition:background .15s ease}
.btn:hover{background:var(--signal-700)}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--signal-200)}
.btn.ghost:hover{background:var(--signal-50)}
.btn.sm{padding:9px 18px;font-size:.95rem}
@media (max-width:760px){
  nav.top a.navlink{display:none}
  header.site .wrap{height:66px}
}


/* ---------------- the page ---------------- */
main.lp{position:relative;overflow:hidden;background:#fff}
main.lp .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left top;
  filter:saturate(.7) brightness(1.04);pointer-events:none}
main.lp .veil{position:absolute;inset:0;background:rgba(255,255,255,.35)}
main.lp .wave{position:absolute;left:0;right:0;top:224px;width:100%;height:128px;opacity:.5;pointer-events:none}
main.lp .wave path{fill:none;stroke-dasharray:1 9;stroke-linecap:round}
@media (min-width:640px){main.lp .wave{top:256px}}
main.lp .inner{position:relative;padding-block:64px 96px}
@media (min-width:640px){main.lp .inner{padding-block:96px 128px}}
.lp-head,.lp-body{max-width:48rem}
@media (min-width:1024px){.right .lp-head,.right .lp-body{margin-left:auto}}
.lp-head h1{font-size:clamp(2.25rem,5vw,3rem);font-weight:300;line-height:1.15;color:var(--ink)}
.lp-head h1 b{font-weight:600;color:var(--signal-600)}
.lp-head .sub{margin:16px 0 0;font-size:1.12rem;line-height:1.65;color:var(--ink-muted);max-width:42rem}
.lp-head .dates{margin:12px 0 0;font-size:.875rem;font-weight:500;color:var(--ink-faint)}
.lp-head .intro{margin:20px 0 0;font-size:1.12rem;line-height:1.65;color:var(--ink-muted);max-width:42rem}
.lp-head .dates + .intro{margin-top:24px}
.lp-body{margin-top:48px;display:flex;flex-direction:column;gap:24px}
.lp-card{border-radius:16px;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.85);
  box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  padding:28px 24px;scroll-margin-top:112px}
@media (min-width:640px){.lp-card{padding:36px}}
.lp-card h2{font-size:clamp(1.3rem,2.4vw,1.55rem);font-weight:600;line-height:1.25;color:var(--ink)}
.lp-card h3{font-family:var(--sans);font-size:1rem;font-weight:600;letter-spacing:0;margin:22px 0 0;color:var(--ink)}
.lp-card p,.lp-card li{font-size:1.06rem;line-height:1.7;color:var(--ink-muted)}
.lp-card p{margin:16px 0 0}
.lp-card h2 + p{margin-top:16px}
.lp-card > p:first-child{margin-top:0}
.lp-card b,.lp-card strong{color:var(--ink)}
.lp-card ul,.lp-card ol{margin:12px 0 0;padding-left:24px}
.lp-card li{margin:8px 0 0}
.lp-card li::marker{color:var(--signal-400)}
.lp-card a,.lp-head a{color:var(--signal-600);font-weight:600;text-decoration:underline;
  text-decoration-color:var(--signal-200);text-underline-offset:4px;overflow-wrap:anywhere}
.lp-card a:hover,.lp-head a:hover{color:var(--signal-700);text-decoration-color:var(--signal-400)}
.lp-card .tw{overflow-x:auto;margin-top:16px}
.lp-card table{border-collapse:collapse;width:100%;font-size:.95rem}
.lp-card th,.lp-card td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--signal-100);vertical-align:top;color:var(--ink-muted)}
.lp-card th{font-weight:600;color:var(--ink);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}
.lp-card.short{background:rgba(242,247,254,.92)}
.lp-cta{margin-top:24px;display:flex;flex-direction:column;gap:16px;border-radius:16px;
  background:var(--signal-800);padding:28px 24px}
@media (min-width:640px){.lp-cta{flex-direction:row;align-items:center;justify-content:space-between;padding:28px 36px}}
.lp-cta h2{font-family:var(--sans);font-size:1.25rem;font-weight:600;letter-spacing:0;color:#fff}
.lp-cta p{margin:4px 0 0;color:var(--signal-200)}
.lp-cta a{flex:none;display:inline-flex;justify-content:center;border-radius:999px;background:#fff;
  color:var(--signal-700);padding:12px 24px;font-weight:600;text-decoration:none;white-space:nowrap}
.lp-cta a:hover{background:var(--signal-50)}

/* ---------------- footer ---------------- */
footer.site{border-top:1px solid var(--signal-100);background:var(--paper);
  padding-block:34px 60px}
footer.site .row{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start}
footer.site .tag{margin:8px 0 0;font-size:.9rem;color:var(--ink-faint)}
footer.site .ps{max-width:36rem;margin:10px 0 0;font-size:.8rem;line-height:1.6;color:var(--ink-faint)}
footer.site nav{margin-left:auto;display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
footer.site nav a{font-size:.9rem;font-weight:500;color:var(--ink-muted);text-decoration:none}
footer.site nav a:hover{color:var(--ink);text-decoration:underline}
footer.site .legal{margin:26px 0 0;font-size:.8rem;color:var(--ink-faint);line-height:1.6;max-width:62rem}
footer.site .copy{margin:14px 0 0;font-size:.8rem;color:var(--ink-faint)}
@media (max-width:760px){footer.site nav{margin-left:0}}
