/* ============================================================================
   EasyGovernance — mk-paper.css: the PAPER register, shared (wave 0, 5 Sep 2026)
   ----------------------------------------------------------------------------
   The homepage candidate's register (prototypes/homepage-v2.css, the V3.1 brief)
   promoted into a layer any marketing page can stand on. Dom's 5-Sep ruling:
   "paper throughout, paper chrome — the dark fold is the homepage's device and
   nobody else's; a prospectus has one cover." So this file carries NO fold: it
   is the warm page, the ink type, the brass kicker, the hairline frame.

   HOW A PAGE ADOPTS IT (all three, or none):
     1. <link rel="stylesheet" href="/assets/marketing/marketing.css">  (base)
        <link rel="stylesheet" href="/assets/marketing/mk-paper.css">   (AFTER it)
     2. <body class="egch-paper">  — flips EGMarketing.chrome() to the ink header
        and hairline footer (the variant lives in marketing.js CH_CSS).
     3. The Fraunces link, VERBATIM — Dom's amendment: WONK 0 and SOFT 0 (both
        default because neither axis is requested), optical-size ON:
        https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500;0,9..144,600;1,9..144,500;1,9..144,600&display=swap
        Do NOT add axes to that URL; the fold italic is already the expressive
        ceiling of the face (the amendment).

   Load order matters: marketing.css still supplies .wrap, layout and the type
   scale; this file overrides its dark ground and dark text. A page on this
   layer must not carry .bg / .glow / .rail markup — those are the old dark
   furniture and they are display:none'd here as a belt, but the markup should
   simply not exist on a converted page (harness-marketing-estate.js checks).

   RULINGS BAKED IN (do not soften without Dom's word):
   - One colour per headline; emphasis is italic or weight, NEVER colour.
     The sky em and its glow are overridden dead here.
   - ONE accent: brass. #c9a23a reads 2.2:1 at eyebrow size on paper, so all
     small brass text on paper uses --brass-ink (#8f7220) — same metal, legible.
   - ~8px radii. No pills.
   - Captures live in hairline frames with NO browser costume.
   - Every var() this file uses is defined in this file (an undefined var()
     computes to nothing and silently empties the rule) — harness-checked.
   ========================================================================== */

:root{--mut:#8ea4cf;
  --paper:#faf8f3;          /* the warm off-white page */
  --ink:#1A2C57;            /* navy as INK — headlines, strong text */
  --ink-soft:#42506e;       /* body text on paper */
  --hairline:#e4dfd3;       /* warm hairline for frames and rules */
  --fold:#142146;           /* homepage's dark screen; here only as capture ground */
  --brass:#c9a23a;          /* THE one accent, at display size on dark grounds */
  --brass-ink:#8f7220;      /* brass deepened for small text on paper */
  --serif:'Fraunces',Georgia,serif}

/* the ground flips: warm paper, ink-soft body text */
body{background:var(--paper);color:var(--ink-soft)}

/* the old dark furniture cannot exist on paper — belt over the markup rule */
.bg,.glow,.rail,.startbtn,.cue{display:none}

/* ── type — Fraunces headlines in ink, one colour per headline ────────────── */
.hero h1,.bridge h2,.mk-h{font-family:var(--serif);font-weight:600;color:var(--ink);
  letter-spacing:-.015em}
.hero h1 em,.bridge h2 em{color:inherit;text-shadow:none}
.hero p,.bridge p{color:var(--ink-soft)}
.eyebrow,.bridge .eyebrow{color:var(--brass-ink)}

/* the numbered brass kicker — the estate's wayfinding device ("01 · Governance").
   Order is RULED (5 Sep): Governance · Board · Income, sitewide. */
.mk-kicker{display:block;font-size:.78rem;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass-ink);margin-bottom:10px;text-decoration:none}
a.mk-kicker:hover{color:var(--ink)}

/* ── buttons — the product's ~8px, never the marketing pill ───────────────── */
.btn{border-radius:8px}
.btn-p{background:var(--ink);color:#fff;box-shadow:0 4px 14px rgba(26,44,87,.18)}
.btn-p:hover{box-shadow:0 6px 18px rgba(26,44,87,.26)}
.btn-s{background:transparent;border:1px solid rgba(26,44,87,.35);color:var(--ink)}
.btn-s:hover{background:rgba(26,44,87,.06);border-color:var(--ink)}
.e-cta{border-radius:8px;color:var(--ink);border-color:rgba(26,44,87,.35)}
.e-cta:hover{background:rgba(26,44,87,.06);border-color:var(--ink)}

/* keyboard focus, visible on paper */
.btn:focus-visible,.e-cta:focus-visible,.mk-kicker:focus-visible,
a:focus-visible{outline:2px solid var(--brass-ink);outline-offset:3px}

/* ── the frame — hairline border, short soft shadow, product surface only ──
   Promoted verbatim from homepage-v2.css. NO BROWSER BAR — the frame is a
   border and a shadow, nothing else; the product speaks for itself. */
.hp-frame{background:#fff;border:1px solid var(--hairline);border-radius:12px;
  overflow:hidden;box-shadow:0 10px 28px rgba(26,44,87,.10)}
/* captures are 1484x812; the box holds the ratio so nothing jumps.
   ⚠️ NEVER put a max-height on THIS box — it carries an aspect-ratio, and a
   binding max-height makes Chrome transfer the clamped height back through the
   ratio and shrink the WIDTH too (measured on the homepage: a 1180px frame
   holding a 641px shot with 539px of white beside it). Cap the FRAME instead. */
.hp-shots{position:relative;aspect-ratio:1484/812;background:#0f1b39}
.hp-shots img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover}

/* ── prose containers that used to sit on dark ────────────────────────────── */
.fitem{background:#fff;border:1px solid var(--hairline)}
.fitem h4{color:var(--ink)}.fitem p{color:var(--ink-soft)}
.faq .eyebrow{color:var(--brass-ink)}
.faq h2,.close h2,.cards-sec h2,.vault h2{font-family:var(--serif);font-weight:600;
  color:var(--ink);letter-spacing:-.015em}
.close p,.cards-sec p,.vault p{color:var(--ink-soft)}
.cards-sec .eyebrow,.vault .eyebrow{color:var(--brass-ink)}
/* feature cards, where a cell earns its place (5-Sep amendment): paper cards,
   ink icons — the gradient icon chip dies with the register */
.ecard{background:#fff;border:1px solid var(--hairline)}
.ecard h3{color:var(--ink)}.ecard p{color:var(--ink-soft)}
.ecard .ico{background:var(--ink)}
.ecard .tag{color:var(--brass-ink);font-style:italic}
.ecard .drill{color:var(--ink)}.ecard .drill:hover{color:var(--brass-ink)}

/* the start door, mounted mid-page on the guides and security (Wave 0.3) */
.gdoor{margin:34px 0 0}
