/* ============================================================================
   bridge2b.css — re-skins pages built on the older redesign.css to the
   homepage 2b style (Archivo · paper / ink / gold · square corners).
   Load order on those pages: redesign.css → page <style> → site2b.css → this.
   Scope: <body class="p2b">.
   ========================================================================== */

/* 1 · Old redesign.css tokens → 2b tokens (shared names like --ink/--muted/--rule
       already come from site2b.css) */
:root{
  --bg:#f5f3ef; --bg-soft:#efe9df; --bg-1:#efe9df; --surface:#fff; --ink-2:#2e3036;
  --inv-bg:#1d1f24; --inv-ink:#f5f3ef; --inv-ink2:#d8d5ce; --inv-muted:#a9a6a0; --inv-rule:#3a3d44;
  --accent:#c9913f; --accent-2:#e2b262; --hot:#a3261a; --bad:#a3261a; --good:#1f6b3a; --warn:#8a5a14;
  --rule-2:rgba(29,31,36,.4);
  --hairline:2px solid rgba(29,31,36,.2);
  --f-display:"Archivo",system-ui,sans-serif;
  --f-body:"Archivo",system-ui,sans-serif;
  --f-mono:"Archivo",system-ui,sans-serif;
  --radius:0px;
}
:root[data-contrast="high"]{
  --bg:#000; --bg-soft:#000; --bg-1:#000; --surface:#000; --ink-2:#fff;
  --inv-bg:#000; --inv-ink:#fff; --inv-ink2:#fff; --inv-muted:#fff; --inv-rule:#fff;
  --accent:#ffe14d; --accent-2:#ffe14d; --hot:#ffe14d; --bad:#ffe14d; --good:#ffe14d; --warn:#ffe14d;
  --rule-2:#fff; --hairline:3px solid #fff;
}

/* 2 · Base */
body.p2b{background:var(--paper);color:var(--ink);font-family:Archivo,system-ui,sans-serif;font-feature-settings:normal}
body.p2b h1,body.p2b h2,body.p2b h3,body.p2b h4{font-family:Archivo,system-ui,sans-serif}
body.p2b ::selection{background:var(--gold);color:var(--on-gold)}

/* 3 · The shared 2b header must win over redesign.css .nav / .links */
body.p2b .nav{justify-content:flex-start;color:var(--ink)}
body.p2b .nav .links a{color:var(--ink);opacity:1}
body.p2b .mnav a{color:var(--ink)}

/* 4 · Square Modernist corners inside page content (keep genuinely round things round) */
body.p2b main *:not(img):not(video):not(iframe):not([class*="dot"]):not([class*="swatch"]):not([class*="avatar"]):not([class*="circle"]):not([class*="ring"]):not([class*="round"]):not([class*="pill-round"]),
body.p2b .p2b-main *:not(img):not(video):not(iframe):not([class*="dot"]):not([class*="swatch"]):not([class*="avatar"]):not([class*="circle"]):not([class*="ring"]):not([class*="round"]){border-radius:0 !important}

/* 5 · redesign.css buttons → 2b buttons */
body.p2b .btn{border-radius:0;font-weight:800;font-family:Archivo,system-ui,sans-serif;cursor:pointer}
body.p2b .btn-primary{background:var(--gold);color:var(--on-gold);border:2px solid var(--gold)}
body.p2b .btn-primary:hover{background:var(--gold-dk);border-color:var(--gold-dk);color:#fff}
body.p2b .btn-secondary{background:transparent;color:var(--ink);border:2px solid var(--ink)}
body.p2b .btn-secondary:hover{background:var(--ink);color:var(--paper)}
:root[data-contrast="high"] body.p2b .btn-primary:hover{color:#000;background:#fff;border-color:#fff}

/* 6 · Mono labels become Archivo small caps-style labels */
body.p2b .mono{font-family:Archivo,system-ui,sans-serif;font-weight:600;letter-spacing:.1em}

/* 7 · Focus ring */
body.p2b :focus-visible{outline:3px solid var(--focus);outline-offset:3px}

/* 8 · Layout: align redesign.css sections with the 2b 1280px container */
:root{--pad-x:48px;--col-max:1184px}
@media (max-width:980px){ :root{--pad-x:24px} }

/* 9 · Headlines: dark ink, emphasised words in dark gold (readable on paper) */
body.p2b main h1 em,body.p2b main h2 em,body.p2b .p2b-main h1 em,body.p2b .p2b-main h2 em{font-style:normal;color:var(--gold-dk)}
body.p2b .pe-hero h1{color:var(--ink);font-weight:800;letter-spacing:-1.5px}
body.p2b .pe-hero h1 em{font-weight:800}

/* 10 · Flat colour: drop the old decorative glows behind heroes */
body.p2b [class*="hero"]::before,body.p2b [class*="hero"]::after{background:none!important}
body.p2b [class*="hero"] h1{color:var(--ink)}
:root[data-contrast="high"] body.p2b [class*="hero"] h1{color:#fff}
