/* ============================================================================
   cryptopru.com — shared design system (site.css)
   Canonical v5 brand: Libre Franklin (body/UI) + Source Serif 4 (display),
   burgundy --accent on cream. Loaded by all four live pages.

   The shared shell (header/footer/components) references namespaced --cp-*
   tokens so it stays on-brand even on pages that define their own :root
   tokens (the calibration/readiness tools do, until Phase 3 restyles them).
   ============================================================================ */

:root{
  /* canonical palette — standard names, for page bodies to adopt (Phase 3) */
  --paper:#FFFFFF; --paper-2:#F8F6F1; --paper-3:#F1ECE3;
  --ink:#1A1816; --ink-soft:#46413B; --ink-mute:#736A5F; --ink-faint:#82786A;
  --line:#E8E2D6; --line-soft:#F0EBE1;
  --accent:#6B1D1D; --accent-2:#561616; --accent-line:#D9B9B9; --accent-soft:#F7EBEB;
  --amber:#B47A1F; --forest:#2C4A3E; --gold:#8B6914; --navy:#1B3A52; --red:#B5341C;
  /* canonical status palette — single source for all tools (The Dry Run, perimeter, capital) */
  --green:#2C5F47; --green-soft:#E2EDE6; --amber-soft:#F6EDD6; --red-soft:#F7E3DE; --mono:'JetBrains Mono',ui-monospace,monospace;
  --r-btn:9px; --r-card:16px; --r-pill:999px;
  --shadow-sm:0 1px 2px rgba(26,24,22,.05),0 10px 24px -18px rgba(26,24,22,.16);
  --shadow:0 1px 2px rgba(26,24,22,.04),0 22px 48px -28px rgba(26,24,22,.18);
  --serif:'Source Serif 4',Georgia,serif;
  --sans:'Libre Franklin',system-ui,-apple-system,sans-serif;
  --ease:cubic-bezier(.2,.7,.3,1);

  /* namespaced shell tokens — immune to per-page :root overrides */
  --cp-paper:#FFFFFF; --cp-paper-2:#F8F6F1;
  --cp-ink:#1A1816; --cp-ink-soft:#46413B; --cp-ink-mute:#736A5F; --cp-ink-faint:#82786A;
  --cp-line:#E8E2D6;
  --cp-accent:#6B1D1D; --cp-accent-2:#561616; --cp-accent-line:#D9B9B9; --cp-accent-soft:#F7EBEB;
  --cp-serif:'Source Serif 4',Georgia,serif;
  --cp-sans:'Libre Franklin',system-ui,-apple-system,sans-serif;
}

/* ── Shared header ─────────────────────────────────────────────────────── */
.site-header{
  position:sticky;top:0;z-index:1000;
  background:rgba(255,255,255,.88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--cp-line);
  font-family:var(--cp-sans);
}
.site-header *{box-sizing:border-box;}
.site-header__inner{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  max-width:1120px;margin:0 auto;padding:14px 28px;
}
.site-brand{display:inline-flex;align-items:baseline;gap:12px;text-decoration:none;white-space:nowrap;}
.site-brand__mark{font-family:var(--cp-serif);font-weight:700;font-size:20px;color:var(--cp-accent);letter-spacing:-.01em;}
.site-brand__rule{width:1px;height:15px;background:var(--cp-line);align-self:center;}
.site-brand__sub{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--cp-ink-faint);}
.site-nav{display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.site-nav a{
  color:var(--cp-ink-soft);text-decoration:none;font-size:15px;font-weight:500;white-space:nowrap;
  padding:4px 0;border-bottom:2px solid transparent;transition:color .15s var(--ease),border-color .15s var(--ease);
}
.site-nav a:hover{color:var(--cp-accent);}
.site-nav a.is-active{color:var(--cp-accent);font-weight:600;border-bottom-color:var(--cp-accent);}
.site-header a:focus-visible,.site-footer a:focus-visible{outline:3px solid var(--cp-accent-line);outline-offset:3px;border-radius:3px;}

/* ── Shared footer ─────────────────────────────────────────────────────── */
.site-footer{
  font-family:var(--cp-sans);background:var(--cp-paper-2);
  border-top:1px solid var(--cp-line);color:var(--cp-ink-mute);
  padding:clamp(40px,5vw,60px) 0 40px;margin-top:0;
}
.site-footer *{box-sizing:border-box;}
.site-footer__inner{max-width:1120px;margin:0 auto;padding:0 28px;}
.site-footer__top{
  display:flex;flex-wrap:wrap;gap:28px 56px;justify-content:space-between;align-items:flex-start;
  padding-bottom:28px;border-bottom:1px solid var(--cp-line);
}
.site-footer__brand{max-width:360px;}
.site-footer__by{color:var(--cp-ink-mute);font-size:13.5px;line-height:1.65;margin:14px 0 0;}
.site-footer__col{display:flex;flex-direction:column;gap:9px;}
.site-footer__h{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--cp-ink);margin-bottom:4px;}
.site-footer__col a{color:var(--cp-ink-mute);text-decoration:none;font-size:14.5px;transition:color .15s var(--ease);}
.site-footer__col a:hover{color:var(--cp-accent);}
.site-footer__note{margin:22px 0 0;color:var(--cp-ink-soft);font-size:13px;font-weight:500;line-height:1.6;}
.site-footer__disclaimer{margin:14px 0 0;color:var(--cp-ink-faint);font-size:12.5px;line-height:1.65;max-width:880px;}
.site-footer__disclaimer strong{color:var(--cp-ink-mute);font-weight:600;}

/* ── Reusable components (adopted by the tools in Phase 3) ─────────────── */
.site-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  background:var(--cp-accent);color:var(--cp-paper);border:1px solid var(--cp-accent);
  padding:13px 24px;border-radius:var(--r-btn,9px);
  font-family:var(--cp-sans);font-size:15px;font-weight:600;line-height:1;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:background .2s var(--ease),transform .15s var(--ease),box-shadow .2s var(--ease);
}
.site-btn:hover{background:var(--cp-accent-2);border-color:var(--cp-accent-2);transform:translateY(-1px);box-shadow:0 10px 24px -12px rgba(107,29,29,.5);}
.site-btn:active{transform:translateY(0);}
.site-btn:focus-visible{outline:3px solid var(--cp-accent-line);outline-offset:2px;}
.site-btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none;}
.site-btn--ghost{background:transparent;color:var(--cp-accent);border-color:var(--cp-line);}
.site-btn--ghost:hover{background:var(--cp-accent-soft);border-color:var(--cp-accent-line);box-shadow:none;}

.site-card{
  background:var(--cp-paper);border:1px solid var(--cp-line);border-radius:var(--r-card,16px);
  padding:28px;box-shadow:var(--shadow-sm);
}
.site-input,.site-select{
  width:100%;background:var(--cp-paper);border:1px solid var(--cp-line);color:var(--cp-ink);
  padding:12px 14px;border-radius:var(--r-btn,9px);font-family:var(--cp-sans);font-size:15px;
  transition:border-color .15s var(--ease),box-shadow .15s var(--ease);
}
.site-input:focus,.site-select:focus{outline:none;border-color:var(--cp-accent-line);box-shadow:0 0 0 3px var(--cp-accent-soft);}
.site-eyebrow{font-family:var(--cp-sans);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--cp-accent);}

/* ── Responsive + motion ──────────────────────────────────────────────── */
@media(max-width:720px){
  .site-header__inner{flex-direction:column;align-items:flex-start;gap:10px;padding:12px 18px;}
  .site-nav{gap:20px;flex-wrap:nowrap;overflow-x:auto;width:100%;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .site-nav::-webkit-scrollbar{display:none;}
  .site-nav a{font-size:14px;}
}
@media(prefers-reduced-motion:reduce){
  .site-header *,.site-footer *,.site-btn{transition:none!important;}
}