/* =========================================================
   PARADIGM RESERVES — INTERACTIVE APPENDIX
   Design system mirrors paradigm-pitch-deck.vercel.app
   ========================================================= */

:root {
  /* Surfaces */
  --bg: #000000;
  --bg-alt: #050506;
  --surface: #0A0A0B;
  --surface-2: #121214;
  --surface-3: #1A1A1D;

  /* Brand gold */
  --gold: #C9A961;
  --gold-2: #D4AF37;
  --gold-soft: #E5D3A3;
  --gold-dim: #8C7740;

  /* Text */
  --ink: #F2EBD9;
  --ink-soft: #B8B0A0;
  --muted: #7A7468;
  --muted-2: #5A554C;

  /* Chart */
  --coral: #D97757;     /* Bitcoin */
  --blue-soft: #93AABE; /* S&P */
  --neg: #C84B4B;       /* drawdown */
  --pos: #6B9B6B;       /* positive (use sparingly) */

  /* Hairlines */
  --rule: rgba(255,255,255,0.08);
  --rule-strong: rgba(255,255,255,0.14);
  --rule-gold: rgba(201,169,97,0.35);
  --rule-gold-soft: rgba(201,169,97,0.18);

  /* Layout */
  --max: 1240px;
  --max-narrow: 880px;
  --pad-x: clamp(20px, 4vw, 32px);
  --pad-y: clamp(64px, 8vw, 112px);

  /* Type */
  --t-eyebrow: 11px;
  --t-body: 16px;
  --t-small: 13px;
  --t-h2: clamp(28px, 3.2vw, 44px);
  --t-h3: clamp(20px, 2vw, 26px);
  --t-stat: clamp(32px, 4vw, 52px);

  /* Motion */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 180ms var(--ease);
  --t-med: 320ms var(--ease);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  scroll-behavior:smooth;
  scroll-padding-top:80px;
  background:var(--bg);
}
body{
  min-height:100dvh;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:400;
  font-size:var(--t-body);
  line-height:1.65;
  color:var(--ink-soft);
  background:var(--bg);
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
button{cursor:pointer;background:none;border:none;color:inherit;font:inherit}
a{color:var(--gold-2);text-decoration:none;transition:color var(--t-fast)}
a:hover{color:var(--gold-soft)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
::selection{background:rgba(201,169,97,0.3);color:var(--ink)}

/* ---------- Typography helpers ---------- */
.eyebrow{
  display:inline-block;
  font-size:var(--t-eyebrow);
  font-weight:600;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-bottom:18px;
}
h1,h2,h3,h4{
  font-family:inherit;
  color:var(--ink);
  font-weight:700;
  letter-spacing:-0.018em;
  line-height:1.1;
}
h2{
  font-size:var(--t-h2);
  margin-bottom:24px;
  position:relative;
}
h2.titled::after{
  content:"";
  display:block;
  width:68px;
  height:3px;
  background:var(--gold);
  margin-top:18px;
}
h3{
  font-size:var(--t-h3);
  margin-bottom:14px;
  letter-spacing:-0.012em;
}
p{max-width:72ch}
.lede{
  font-size:clamp(17px,1.4vw,20px);
  line-height:1.55;
  color:var(--ink);
  font-weight:400;
}
.kicker{
  color:var(--ink);
  font-weight:600;
  margin-bottom:6px;
  letter-spacing:-0.005em;
}
.muted{color:var(--muted)}
.small{font-size:var(--t-small);line-height:1.55}
em.italic-pull{
  font-style:italic;
  color:var(--gold-soft);
  display:block;
  margin-top:16px;
  font-weight:400;
}

/* ---------- Container ---------- */
.wrap{
  max-width:var(--max);
  margin:0 auto;
  padding:0 var(--pad-x);
}
.wrap-narrow{
  max-width:var(--max-narrow);
  margin:0 auto;
  padding:0 var(--pad-x);
}

/* ---------- Section ---------- */
section{
  padding:var(--pad-y) 0;
  background:var(--bg);
  position:relative;
}
section.alt{background:var(--bg-alt)}
section + section{border-top:1px solid var(--rule)}

/* ---------- Top Nav ---------- */
.nav{
  position:fixed;
  top:0; left:0; right:0;
  z-index:100;
  background:rgba(0,0,0,0.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(201,169,97,0.20);
}
.nav-inner{
  max-width:var(--max);
  margin:0 auto;
  padding:14px var(--pad-x);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.nav-logo{
  height:30px;
  width:auto;
  opacity:.95;
  transition:opacity var(--t-fast);
}
.nav-logo:hover{opacity:1}
.nav-links{
  display:flex;
  align-items:center;
  gap:28px;
}
.nav-links a{
  font-size:13px;
  font-weight:500;
  letter-spacing:0.04em;
  color:#C7BEA7;
  text-transform:none;
}
.nav-links a:hover{color:var(--gold-2)}
.nav-cta{
  background:var(--gold);
  color:#000 !important;
  padding:9px 16px;
  border-radius:2px;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.06em;
  text-transform:uppercase;
}
.nav-cta:hover{background:var(--gold-soft);color:#000 !important}
.nav-back{
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.nav-back:hover{color:var(--gold-2)}
.menu-btn{
  display:none;
  width:36px;
  height:36px;
  align-items:center;
  justify-content:center;
  border:1px solid var(--rule-gold);
  border-radius:2px;
  color:var(--gold-2);
}
#mobile-menu{
  display:none;
  flex-direction:column;
  background:rgba(0,0,0,0.96);
  border-top:1px solid var(--rule-gold-soft);
  padding:18px var(--pad-x);
  gap:14px;
}
#mobile-menu a{font-size:14px;color:var(--ink-soft)}
#mobile-menu.open{display:flex}

@media (max-width:880px){
  .nav-links{display:none}
  .menu-btn{display:flex}
}

/* ---------- Disclaimer strip ---------- */
.disclaimer-strip{
  position:fixed;
  bottom:0; left:0; right:0;
  z-index:90;
  background:rgba(0,0,0,0.94);
  backdrop-filter:blur(8px);
  border-top:1px solid var(--rule);
  padding:8px var(--pad-x);
  font-size:11px;
  letter-spacing:0.05em;
  color:var(--muted);
  text-align:center;
  text-transform:uppercase;
}
@media (max-width:680px){
  .disclaimer-strip{font-size:9.5px;letter-spacing:0.03em}
}

/* ---------- Access Gate ---------- */
.gate{
  position:fixed;
  inset:0;
  z-index:1000;
  background:#000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  transition:opacity 320ms var(--ease);
}
.gate.hidden{opacity:0;pointer-events:none}
.gate-card{
  width:100%;
  max-width:460px;
  background:var(--surface);
  border:1px solid var(--rule-gold);
  border-top:3px solid var(--gold);
  padding:48px 36px 36px;
  border-radius:2px;
  box-shadow:0 24px 80px rgba(0,0,0,0.7);
  text-align:center;
}
.gate-card .gate-logo{
  height:38px;
  margin:0 auto 28px;
  width:auto;
}
.gate-eyebrow{
  font-size:10px;
  letter-spacing:0.26em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-bottom:14px;
}
.gate-title{
  font-size:22px;
  color:var(--ink);
  margin-bottom:8px;
  letter-spacing:-0.01em;
}
.gate-sub{
  font-size:13px;
  color:var(--muted);
  margin-bottom:28px;
  line-height:1.55;
}
.gate-input,
.gate-form input[type="text"],
.gate-form input[type="email"],
.gate-form input[type="tel"],
.gate-form input[type="password"],
.gate-form > label.gate-check{
  display:block;
  width:100%;
}
.gate-form .gate-check{
  display:flex;
  width:100%;
}
.gate-form .gate-check input[type="checkbox"]{
  width:auto;
  display:inline-block;
  flex:0 0 auto;
}
.gate-input,
.gate-form input[type="text"],
.gate-form input[type="email"],
.gate-form input[type="tel"]{
  background:#000;
  border:1px solid var(--rule-strong);
  border-radius:2px;
  color:var(--ink);
  padding:12px 14px;
  font-size:14px;
  margin-bottom:12px;
  font-family:inherit;
  transition:border-color var(--t-fast);
}
.gate-input:focus,
.gate-form input:focus{
  outline:none;
  border-color:var(--gold);
}
.gate-check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  text-align:left;
  font-size:12px;
  color:var(--ink-soft);
  line-height:1.5;
  margin:14px 0;
}
.gate-check input{
  margin-top:3px;
  accent-color:var(--gold);
}
.gate-btn{
  width:100%;
  background:var(--gold);
  color:#000;
  font-weight:600;
  font-size:13px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  padding:14px;
  border-radius:2px;
  margin-top:8px;
  transition:background var(--t-fast),transform var(--t-fast);
}
.gate-btn:hover{background:var(--gold-soft);transform:translateY(-1px)}
.gate-error{
  color:#E78A8A;
  font-size:12px;
  margin-top:10px;
  min-height:16px;
}
.gate-foot{
  margin-top:22px;
  font-size:10px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--muted-2);
}

/* ---------- Hero (Cover) ---------- */
.hero{
  min-height:88vh;
  display:flex;
  align-items:center;
  padding:140px 0 var(--pad-y);
  background:
    radial-gradient(ellipse at 80% 30%, rgba(201,169,97,0.10), transparent 60%),
    radial-gradient(ellipse at 10% 80%, rgba(201,169,97,0.05), transparent 60%),
    #000;
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(201,169,97,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,169,97,0.04) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse at center, #000 30%, transparent 80%);
  -webkit-mask-image:radial-gradient(ellipse at center, #000 30%, transparent 80%);
  pointer-events:none;
}
.hero-inner{position:relative;z-index:1}
.hero-pill{
  display:inline-block;
  border:1px solid var(--rule-gold);
  background:rgba(201,169,97,0.06);
  color:var(--gold-2);
  font-size:10.5px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  padding:7px 14px;
  border-radius:2px;
  margin-bottom:32px;
}
.hero h1{
  font-size:clamp(34px, 5.4vw, 68px);
  font-weight:700;
  letter-spacing:-0.022em;
  color:#F5ECD4;
  line-height:1.05;
  margin-bottom:24px;
  max-width:18ch;
}
.hero-sub{
  font-size:clamp(16px, 1.4vw, 19px);
  color:var(--ink-soft);
  max-width:62ch;
  line-height:1.55;
  margin-bottom:48px;
}
.hero-stats{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
  margin-bottom:42px;
}
.stat-card{
  background:rgba(255,255,255,0.02);
  border-left:4px solid var(--gold);
  padding:20px 22px;
  border-radius:2px;
}
.stat-num{
  font-size:clamp(24px, 2.6vw, 36px);
  color:var(--gold);
  font-weight:700;
  letter-spacing:-0.015em;
  line-height:1.1;
}
.stat-label{
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-top:6px;
}
.stat-note{
  font-size:11.5px;
  color:var(--muted);
  margin-top:8px;
  line-height:1.4;
}
.hero-ctas{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:32px;
}
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 26px;
  border-radius:2px;
  font-size:13px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
  transition:all var(--t-fast);
  border:1px solid transparent;
}
.btn-gold{background:var(--gold);color:#000 !important}
.btn-gold:hover{background:var(--gold-soft);transform:translateY(-1px);box-shadow:0 8px 24px rgba(201,169,97,0.25)}
.btn-ghost{
  border-color:rgba(201,169,97,0.4);
  color:var(--gold-2) !important;
  background:transparent;
}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-soft) !important}
.hero-foot{
  font-size:11px;
  color:var(--muted);
  line-height:1.6;
  max-width:78ch;
  border-top:1px solid var(--rule);
  padding-top:18px;
  margin-top:18px;
}

@media (max-width:680px){
  .hero{padding-top:120px;min-height:auto}
  .hero h1{font-size:36px}
  .hero-stats{grid-template-columns:1fr}
}

/* ---------- TOC ---------- */
.toc-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}
.toc-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
  padding:24px 22px 22px;
  border-radius:2px;
  display:flex;
  flex-direction:column;
  gap:12px;
  transition:transform var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);
  text-decoration:none;
  color:inherit;
}
.toc-card:hover{
  transform:translateY(-3px);
  border-top-color:var(--gold-2);
  box-shadow:0 12px 32px rgba(0,0,0,0.5);
}
.toc-num{
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold-2);
  font-weight:600;
}
.toc-card h3{margin:0;color:var(--ink)}
.toc-card p{font-size:14px;color:var(--ink-soft);line-height:1.55;margin:0}
.toc-meta{
  margin-top:auto;
  padding-top:14px;
  border-top:1px solid var(--rule);
  font-size:11px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--muted);
  display:flex;
  justify-content:space-between;
}
.toc-meta .arrow{color:var(--gold-2)}

@media (max-width:880px){.toc-grid{grid-template-columns:1fr}}

/* ---------- Two-col layout ---------- */
.two-col{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:48px;
  align-items:start;
}
@media (max-width:880px){.two-col{grid-template-columns:1fr;gap:32px}}

/* ---------- Pull-quote card ---------- */
.pullquote{
  background:var(--surface-2);
  border-left:4px solid var(--gold);
  padding:28px 26px;
  border-radius:2px;
  font-size:18px;
  line-height:1.45;
  color:var(--gold-soft);
  font-weight:400;
  font-style:italic;
}
.pullquote .attrib{
  display:block;
  margin-top:16px;
  font-style:normal;
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--muted);
}

/* ---------- Callout strip ---------- */
.callout{
  background:var(--surface-2);
  border-left:4px solid var(--gold);
  padding:22px 24px;
  border-radius:2px;
  margin:24px 0;
}
.callout .kicker{color:var(--gold-2);font-size:11px;letter-spacing:0.2em;text-transform:uppercase;margin-bottom:10px}
.callout p{color:var(--ink);font-size:15px;line-height:1.55;margin:0}

/* ---------- Principles grid (4-card) ---------- */
.feature-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:20px;
}
.feature-grid.three{grid-template-columns:repeat(3, 1fr)}
.feature-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
  padding:26px 24px;
  border-radius:2px;
  transition:transform var(--t-fast),box-shadow var(--t-fast);
}
.feature-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,0.5)}
.feature-num{
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold-2);
  font-weight:600;
  margin-bottom:10px;
}
.feature-card h4{font-size:17px;color:var(--ink);margin-bottom:8px;letter-spacing:-0.005em}
.feature-card p{font-size:14px;color:var(--ink-soft);line-height:1.6}

@media (max-width:680px){
  .feature-grid,.feature-grid.three{grid-template-columns:1fr}
}

/* ---------- Bio cards ---------- */
.bios{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:24px;
}
.bio{
  background:var(--surface);
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
  padding:32px 28px;
  border-radius:2px;
  display:flex;
  flex-direction:column;
}
.bio.featured{
  background:var(--surface-2);
  border-top-color:var(--gold-2);
  box-shadow:0 0 0 1px rgba(201,169,97,0.18) inset;
}
.bio-num{
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-bottom:14px;
}
.bio-name{
  font-size:22px;
  color:var(--ink);
  margin-bottom:4px;
  letter-spacing:-0.012em;
  font-weight:700;
}
.bio-role{
  font-size:11px;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:18px;
  font-weight:600;
}
.bio-lede{
  font-size:14px;
  color:var(--gold-soft);
  font-style:italic;
  margin-bottom:18px;
  line-height:1.5;
}
.bio-body{
  font-size:14px;
  color:var(--ink-soft);
  line-height:1.65;
}
.bio-body p{margin-bottom:14px}
.bio-quote{
  margin-top:18px;
  padding:14px 16px;
  background:rgba(201,169,97,0.05);
  border-left:3px solid var(--gold);
  font-size:13.5px;
  color:var(--ink);
  font-style:italic;
  line-height:1.5;
}
.bio-foot{
  margin-top:auto;
  padding-top:18px;
  border-top:1px solid var(--rule);
  font-size:12px;
  color:var(--muted);
}
.bio-foot a{color:var(--gold-2)}

@media (max-width:880px){.bios{grid-template-columns:1fr}}

/* ---------- Annual stat strip ---------- */
.annual-strip{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:18px;
  margin-bottom:36px;
}
.annual-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-left:4px solid var(--gold);
  padding:24px 22px;
  border-radius:2px;
}
.annual-card.highlight{
  background:linear-gradient(180deg, rgba(201,169,97,0.10), rgba(201,169,97,0.02));
  border-left-color:var(--gold-2);
}
.annual-num{
  font-size:clamp(26px, 2.8vw, 38px);
  color:var(--gold);
  font-weight:700;
  letter-spacing:-0.018em;
  line-height:1;
}
.annual-year{
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-top:10px;
  font-weight:600;
}
.annual-note{
  font-size:11.5px;
  color:var(--muted);
  margin-top:8px;
  line-height:1.45;
}
@media (max-width:880px){.annual-strip{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.annual-strip{grid-template-columns:1fr}}

/* ---------- Chart blocks ---------- */
.chart-block{
  background:var(--surface);
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
  padding:28px 24px 22px;
  border-radius:2px;
  margin-bottom:24px;
}
.chart-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:18px;
}
.chart-title{font-size:17px;color:var(--ink);font-weight:600;margin-bottom:4px;letter-spacing:-0.005em}
.chart-sub{font-size:12.5px;color:var(--muted);letter-spacing:0.04em}
.chart-tabs{
  display:flex;
  gap:4px;
  background:var(--bg);
  border:1px solid var(--rule);
  border-radius:2px;
  padding:3px;
}
.chart-tabs button{
  padding:7px 14px;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted);
  border-radius:2px;
  transition:all var(--t-fast);
}
.chart-tabs button.active{
  background:rgba(201,169,97,0.12);
  color:var(--gold-2);
}
.chart-tabs button:hover:not(.active){color:var(--ink-soft)}
.chart-canvas-wrap{
  position:relative;
  height:340px;
  width:100%;
}
.chart-canvas-wrap.tall{height:380px}
.chart-canvas-wrap.short{height:260px}
.chart-foot{
  font-size:11.5px;
  color:var(--muted);
  margin-top:14px;
  line-height:1.55;
  border-top:1px solid var(--rule);
  padding-top:12px;
}

/* ---------- Key-stat row ---------- */
.keystat-row{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:14px;
  margin-top:18px;
}
.keystat{
  background:var(--surface-2);
  border-radius:2px;
  padding:16px 14px;
  text-align:left;
  border:1px solid var(--rule);
}
.keystat-val{
  font-size:18px;
  font-weight:700;
  color:var(--gold);
  letter-spacing:-0.01em;
  line-height:1.1;
}
.keystat-lbl{
  font-size:10.5px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin-top:6px;
  line-height:1.4;
}
@media (max-width:880px){.keystat-row{grid-template-columns:repeat(2,1fr)}}

/* ---------- Monthly grid (B IV) ---------- */
.month-grid-wrap{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}
.month-grid-block{
  background:var(--surface);
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
  border-radius:2px;
  padding:22px 20px;
}
.month-grid-block h4{
  font-size:13px;
  color:var(--gold-2);
  letter-spacing:0.18em;
  text-transform:uppercase;
  margin-bottom:14px;
  font-weight:600;
}
.month-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:13px;
  padding:6px 0;
  border-bottom:1px dashed var(--rule);
}
.month-row:last-child{border-bottom:none}
.month-row .m{color:var(--ink-soft)}
.month-row .v{color:var(--gold);font-weight:600;font-variant-numeric:tabular-nums}
.month-row .v.neg{color:var(--neg)}
.month-row .v.zero{color:var(--muted)}
.month-row.total{
  margin-top:8px;
  border-top:1px solid var(--rule-gold);
  border-bottom:none;
  padding-top:10px;
  font-weight:700;
}
.month-row.total .m{color:var(--ink);text-transform:uppercase;font-size:12px;letter-spacing:0.1em}
.month-row.total .v{color:var(--gold-2);font-size:15px}
@media (max-width:880px){.month-grid-wrap{grid-template-columns:1fr}}

/* ---------- Tear sheet ---------- */
.tearsheet{
  background:var(--surface);
  border:1px solid var(--rule-gold);
  border-top:3px solid var(--gold);
  border-radius:2px;
  padding:32px clamp(24px, 4vw, 40px);
}
.tearsheet h3{
  text-align:center;
  font-size:14px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-bottom:24px;
  font-weight:600;
}
.ts-meta{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
  padding:18px 0;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  margin-bottom:24px;
}
.ts-meta-cell .lbl{
  font-size:10.5px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--gold-2);
  font-weight:600;
  margin-bottom:6px;
}
.ts-meta-cell .val{font-size:14px;color:var(--ink);line-height:1.4}
.ts-table{
  width:100%;
  border-collapse:collapse;
}
.ts-table tr{border-bottom:1px solid var(--rule)}
.ts-table tr:last-child{border-bottom:none}
.ts-table td{
  padding:12px 0;
  font-size:14px;
  vertical-align:top;
}
.ts-table td:first-child{color:var(--ink-soft);width:60%}
.ts-table td:last-child{color:var(--gold);font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.ts-foot{
  font-size:11px;
  color:var(--muted);
  margin-top:20px;
  border-top:1px solid var(--rule);
  padding-top:14px;
  line-height:1.55;
}
@media (max-width:680px){.ts-meta{grid-template-columns:1fr}}

/* ---------- Q1 2026 month cards ---------- */
.q1-cards{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
  margin-bottom:24px;
}
.q1-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-left:4px solid var(--gold);
  border-radius:2px;
  padding:22px 20px;
}
.q1-card.total{
  background:var(--surface-2);
  border-left-color:var(--gold-2);
}
.q1-mon{
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--gold-2);
  font-weight:600;
}
.q1-pl{
  font-size:22px;
  color:var(--gold);
  font-weight:700;
  margin-top:8px;
  letter-spacing:-0.01em;
  font-variant-numeric:tabular-nums;
}
.q1-meta{
  font-size:11.5px;
  color:var(--muted);
  margin-top:10px;
  line-height:1.5;
}
.q1-meta strong{color:var(--ink-soft);font-weight:600}
@media (max-width:880px){.q1-cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.q1-cards{grid-template-columns:1fr}}

/* ---------- Methodology cards ---------- */
.method-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:14px;
}
.method-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-left:3px solid var(--gold-dim);
  border-radius:2px;
  padding:18px 20px;
}
.method-card h4{
  font-size:13px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--gold-2);
  font-weight:600;
  margin-bottom:8px;
}
.method-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.55;margin:0}
@media (max-width:680px){.method-grid{grid-template-columns:1fr}}

/* ---------- Lessons (3 stacked) ---------- */
.lesson{
  background:var(--surface);
  border:1px solid var(--rule);
  border-left:4px solid var(--gold);
  border-radius:2px;
  padding:24px 26px;
  margin-bottom:14px;
}
.lesson .kicker{color:var(--gold-2);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;margin-bottom:10px}
.lesson h4{font-size:18px;color:var(--ink);margin-bottom:8px;letter-spacing:-0.005em}
.lesson p{font-size:14.5px;color:var(--ink-soft);line-height:1.6;margin:0}

/* ---------- Tabs (chapter-level) ---------- */
.chapter-tabs{
  display:flex;
  gap:4px;
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:2px;
  padding:5px;
  margin-bottom:36px;
  flex-wrap:wrap;
}
.chapter-tabs button{
  flex:1;
  min-width:140px;
  padding:14px 18px;
  font-size:11.5px;
  font-weight:600;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--muted);
  border-radius:2px;
  transition:all var(--t-fast);
  text-align:center;
}
.chapter-tabs button.active{
  background:rgba(201,169,97,0.12);
  color:var(--gold-2);
  box-shadow:inset 0 0 0 1px var(--rule-gold-soft);
}
.chapter-tabs button:hover:not(.active){color:var(--ink-soft);background:rgba(255,255,255,0.02)}
.chapter-panel{display:none}
.chapter-panel.active{display:block;animation:fadeUp 360ms var(--ease)}
@keyframes fadeUp{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

/* ---------- Sub-section headings inside chapter ---------- */
.sub-h{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin:48px 0 18px;
  padding-bottom:10px;
  border-bottom:1px solid var(--rule-gold-soft);
}
.sub-h .num{
  font-size:11px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--gold-2);
  font-weight:600;
  flex-shrink:0;
}
.sub-h h3{
  margin:0;
  font-size:21px;
  color:var(--ink);
  letter-spacing:-0.012em;
}
.sub-h:first-of-type{margin-top:0}

/* ---------- TradeCAP showcase ---------- */
.tradecap{
  background:linear-gradient(135deg, var(--surface-2), var(--surface));
  border:1px solid var(--rule-gold);
  border-top:3px solid var(--gold);
  border-radius:2px;
  padding:36px clamp(24px, 4vw, 40px);
  margin-bottom:36px;
}
.tc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;margin-bottom:20px}
.tc-name{
  font-size:24px;
  color:var(--ink);
  font-weight:700;
  letter-spacing:-0.018em;
}
.tc-tag{
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--gold-2);
  background:rgba(201,169,97,0.08);
  padding:6px 12px;
  border:1px solid var(--rule-gold-soft);
  border-radius:2px;
  font-weight:600;
}
.tc-lede{
  font-size:15px;
  color:var(--ink);
  line-height:1.6;
  margin-bottom:24px;
}
.tc-principles{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:16px;
}
.tc-principle{
  padding:18px 20px;
  background:rgba(0,0,0,0.3);
  border:1px solid var(--rule);
  border-radius:2px;
}
.tc-principle .num{
  font-size:11px;
  letter-spacing:0.2em;
  color:var(--gold);
  font-weight:600;
  margin-bottom:6px;
}
.tc-principle h4{font-size:14.5px;color:var(--ink);margin-bottom:6px;letter-spacing:-0.003em}
.tc-principle p{font-size:13px;color:var(--ink-soft);line-height:1.55;margin:0}
.tc-foot{
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid var(--rule);
  font-size:12px;
  color:var(--muted);
  font-style:italic;
}
@media (max-width:680px){.tc-principles{grid-template-columns:1fr}}

/* ---------- FAQ accordion ---------- */
.faq{
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:2px;
  margin-bottom:10px;
  overflow:hidden;
  transition:border-color var(--t-fast);
}
.faq[open]{border-color:var(--rule-gold)}
.faq summary{
  padding:18px 22px;
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  font-size:15px;
  font-weight:600;
  color:var(--ink);
  letter-spacing:-0.005em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";
  font-size:24px;
  color:var(--gold-2);
  font-weight:300;
  transition:transform 220ms var(--ease);
  flex-shrink:0;
  width:24px;
  text-align:center;
}
.faq[open] summary::after{transform:rotate(45deg)}
.faq-body{
  padding:0 22px 22px;
  font-size:14.5px;
  color:var(--ink-soft);
  line-height:1.65;
  border-top:1px solid var(--rule);
  padding-top:16px;
}
.faq-body p{margin-bottom:12px}
.faq-body p:last-child{margin-bottom:0}

/* ---------- Glossary ---------- */
.glossary{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:16px;
}
.gloss-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-left:3px solid var(--gold);
  border-radius:2px;
  padding:18px 20px;
}
.gloss-term{
  font-size:14px;
  color:var(--gold-2);
  font-weight:600;
  letter-spacing:-0.005em;
  margin-bottom:6px;
}
.gloss-def{font-size:13.5px;color:var(--ink-soft);line-height:1.6}
@media (max-width:680px){.glossary{grid-template-columns:1fr}}

/* ---------- One-pager block ---------- */
.onepager{
  background:var(--surface);
  border:1px solid var(--rule-gold);
  border-top:3px solid var(--gold);
  border-radius:2px;
  padding:32px clamp(24px, 4vw, 40px);
}
.onepager h3{
  text-align:center;
  font-size:14px;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-bottom:24px;
}
.op-table{width:100%;border-collapse:collapse}
.op-table tr{border-bottom:1px solid var(--rule)}
.op-table tr:last-child{border-bottom:none}
.op-table td{padding:14px 0;font-size:14px;vertical-align:top}
.op-table td:first-child{
  color:var(--gold-2);
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  font-weight:600;
  width:35%;
  padding-right:20px;
}
.op-table td:last-child{color:var(--ink);line-height:1.5}

/* ---------- Risk grid (12-card) ---------- */
.risk-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}
.risk-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-left:3px solid var(--gold-dim);
  border-radius:2px;
  padding:18px 20px;
}
.risk-code{
  font-size:11px;
  letter-spacing:0.18em;
  color:var(--neg);
  font-weight:700;
  margin-bottom:6px;
}
.risk-card h4{font-size:14px;color:var(--ink);margin-bottom:6px;letter-spacing:-0.003em}
.risk-card p{font-size:12.5px;color:var(--ink-soft);line-height:1.55;margin:0}
@media (max-width:880px){.risk-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.risk-grid{grid-template-columns:1fr}}

/* ---------- Final CTA ---------- */
.commit{
  background:
    radial-gradient(ellipse at 50% 0%, rgba(201,169,97,0.12), transparent 60%),
    var(--bg);
  text-align:center;
  padding:var(--pad-y) 0;
}
.commit h2{margin-bottom:20px;border:none}
.commit h2::after{margin:18px auto 0}
.commit-sub{
  font-size:17px;
  color:var(--ink-soft);
  max-width:60ch;
  margin:0 auto 36px;
  line-height:1.6;
}
.commit-cards{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:16px;
  max-width:980px;
  margin:0 auto 32px;
}
.contact-card{
  background:var(--surface);
  border:1px solid var(--rule);
  border-top:3px solid var(--gold);
  border-radius:2px;
  padding:24px 22px;
  text-align:left;
  display:block;
  transition:transform var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);
}
.contact-card.featured{
  background:var(--surface-2);
  border-top-color:var(--gold-2);
  box-shadow:0 0 0 1px rgba(201,169,97,0.18) inset;
}
.contact-card:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 32px rgba(0,0,0,0.5);
}
.cc-name{font-size:16px;color:var(--ink);font-weight:700;margin-bottom:2px;letter-spacing:-0.005em}
.cc-role{
  font-size:11px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-bottom:14px;
  font-weight:600;
}
.cc-email{font-size:13px;color:var(--gold-soft);word-break:break-all}
.cc-meta{
  font-size:11px;
  color:var(--muted);
  margin-top:10px;
  letter-spacing:0.06em;
}
@media (max-width:880px){.commit-cards{grid-template-columns:1fr;max-width:480px}}

/* ---------- Footer ---------- */
footer{
  background:#000;
  border-top:1px solid var(--rule);
  padding:48px 0 80px;
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
}
footer .wrap{padding-top:0}
.foot-logo{
  height:28px;
  width:auto;
  opacity:.85;
  margin:0 auto 24px;
  display:block;
}
.foot-rule{
  height:1px;
  background:var(--rule-gold-soft);
  margin:24px auto;
  max-width:200px;
}
.foot-block{margin-bottom:24px}
.foot-block h4{
  font-size:11px;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--gold-2);
  margin-bottom:8px;
  font-weight:600;
}
.foot-block p{font-size:11.5px;color:var(--muted);line-height:1.6;max-width:none}
.foot-meta{
  text-align:center;
  border-top:1px solid var(--rule);
  padding-top:20px;
  margin-top:24px;
  font-size:11px;
  color:var(--muted-2);
  letter-spacing:0.04em;
}

/* ---------- Prepared-for strip ---------- */
.prepared-strip{
  background:rgba(201,169,97,0.04);
  border-bottom:1px solid var(--rule-gold-soft);
  padding:10px var(--pad-x);
  font-size:11px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--gold-2);
  text-align:center;
  margin-top:60px;
  display:none;
}
.prepared-strip.show{display:block}
.prepared-strip strong{color:var(--gold-soft);font-weight:600;letter-spacing:0.08em}

/* Print niceties (won't be used but free) */
@media print{
  .nav,.disclaimer-strip,.gate{display:none}
  body{color:#000;background:#fff}
}

/* ===== Executive Summary chapter additions ===== */

/* Annual returns strip */
.annual-strip{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0 8px;
}
.annual-strip > div{
  border:1px solid var(--rule-gold-soft);
  border-top:2px solid var(--gold);
  background:rgba(201,169,97,0.03);
  padding:18px 16px;
}
.annual-strip .yr{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--gold-2);margin-bottom:8px;
}
.annual-strip .pct{
  font-family:var(--font-num,inherit);
  font-size:28px;font-weight:600;color:var(--ink);letter-spacing:-0.01em;
  font-variant-numeric:tabular-nums;
}
@media (max-width:680px){.annual-strip{grid-template-columns:1fr}}

/* 2025 month grid */
.month-grid-2025{
  display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:18px 0;
}
.month-tile{
  border:1px solid var(--rule);
  background:rgba(255,255,255,0.015);
  padding:14px 10px;text-align:center;
  border-top:2px solid var(--gold);
}
.month-tile.neg{
  border-top-color:#A13544;
  background:rgba(161,53,68,0.04);
}
.month-label{
  font-size:10px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--muted);margin-bottom:6px;
}
.month-val{
  font-size:15px;font-weight:600;color:var(--ink);
  font-variant-numeric:tabular-nums;letter-spacing:-0.005em;
}
.month-tile.neg .month-val{color:#D87080}
@media (max-width:880px){.month-grid-2025{grid-template-columns:repeat(4,1fr)}}
@media (max-width:520px){.month-grid-2025{grid-template-columns:repeat(3,1fr)}}

/* Illustrative growth rows */
.growth-grid{display:flex;flex-direction:column;gap:14px;margin:20px 0}
.growth-row{
  display:grid;
  grid-template-columns:1fr 1.1fr auto 1.1fr auto 1.1fr 1fr;
  align-items:center;gap:14px;
  border:1px solid var(--rule-gold-soft);
  border-left:3px solid var(--gold);
  background:rgba(201,169,97,0.025);
  padding:20px 22px;
}
.growth-start,.growth-end{display:flex;flex-direction:column;gap:4px}
.growth-end{text-align:right}
.growth-num{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold-2);
}
.growth-val{
  font-size:22px;font-weight:600;color:var(--ink);letter-spacing:-0.01em;
  font-variant-numeric:tabular-nums;
}
.growth-end .growth-val{color:var(--gold-soft);font-size:24px}
.growth-arrow{
  color:var(--gold);font-size:20px;letter-spacing:0.05em;
  display:flex;align-items:center;gap:4px;
}
.growth-step{display:flex;flex-direction:column;gap:4px;text-align:left}
.growth-step .small,.growth-step .muted{font-size:11px;color:var(--muted);letter-spacing:0.04em;line-height:1.3}
.growth-step .growth-val{font-size:18px;color:var(--ink);}
.growth-arrow{justify-content:center;font-size:16px}
@media (max-width:980px){
  .growth-row{grid-template-columns:1fr 1fr;text-align:left;gap:14px 18px}
  .growth-end{text-align:left;grid-column:span 2;border-top:1px solid var(--rule-gold-soft);padding-top:14px;margin-top:6px}
  .growth-arrow{display:none}
}
@media (max-width:560px){
  .growth-row{grid-template-columns:1fr}
  .growth-end{grid-column:span 1}
}

/* Bridge callout — link to deeper appendix sections */
.bridge-callout{
  border:1px solid var(--rule-gold-soft);
  border-left:3px solid var(--gold);
  background:linear-gradient(90deg, rgba(201,169,97,0.05), transparent 80%);
  padding:18px 22px;border-radius:0;
}
.bridge-callout .kicker{
  color:var(--gold-2);font-size:10px;letter-spacing:0.2em;
  text-transform:uppercase;margin-bottom:6px;
}
.bridge-callout p{
  margin:0;color:var(--ink-soft);font-size:14px;line-height:1.6;
}
.bridge-callout a{
  color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(201,169,97,0.4);
  transition:border-color 180ms var(--ease,ease);
}
.bridge-callout a:hover{border-bottom-color:var(--gold)}

/* Tables (terms etc.) */
.table-wrap{overflow-x:auto;margin:14px 0}
.terms-table{
  width:100%;border-collapse:collapse;font-size:14px;
}
.terms-table th,.terms-table td{
  text-align:left;padding:12px 14px;
  border-bottom:1px solid var(--rule);
  vertical-align:top;
}
.terms-table thead th{
  background:rgba(201,169,97,0.04);
  color:var(--gold-2);
  font-size:11px;letter-spacing:0.16em;text-transform:uppercase;font-weight:600;
  border-bottom:1px solid var(--rule-gold-soft);
}
.terms-table td:first-child{
  color:var(--ink);font-weight:500;width:38%;
}
.terms-table td{color:var(--ink-soft);font-size:14px;line-height:1.55}
.terms-table tbody tr:hover{background:rgba(255,255,255,0.012)}

/* ============================================================
   INSTITUTIONAL POLISH — PASS 1
   Strips decorative gold, calms hero, makes tabs sticky,
   moves eyebrows to neutral. Last in cascade — overrides above.
   ============================================================ */

/* ----- Eyebrows: gold → muted neutral ----- */
.eyebrow{ color: #8B8579; font-weight: 500; letter-spacing: 0.24em; }
.toc-num,
.feature-num,
.bridge-callout .kicker,
.callout .kicker,
.toc-meta .arrow{ color: #8B8579 !important; }
.toc-card:hover .toc-num,
.toc-card:hover .toc-meta .arrow{ color: var(--gold) !important; transition: color 200ms ease; }

/* ----- Strip gold accent strips off cards ----- */
.toc-card,
.feature-card,
.kpi-card,
.month-tile,
.month-tile.neg,
.annual-strip > div,
.callout,
.bridge-callout{
  border-top-width: 1px !important;
  border-top-color: var(--rule) !important;
  border-left-width: 1px !important;
  border-left-color: var(--rule) !important;
}
.month-tile.neg{ border-left-color: rgba(161,53,68,0.25) !important; }

/* Bridge callout: remove gradient + accent rail, calm hairline */
.bridge-callout{
  background: rgba(255,255,255,0.015) !important;
  border: 1px solid var(--rule) !important;
  padding: 20px 24px !important;
}
.bridge-callout p{ color: var(--ink-soft) !important; }
.bridge-callout a{
  color: var(--ink) !important;
  border-bottom: 1px solid #4a463c !important;
}
.bridge-callout a:hover{ border-bottom-color: var(--gold) !important; color: var(--gold) !important; }

/* Callout: same treatment */
.callout{
  background: rgba(255,255,255,0.015) !important;
  border: 1px solid var(--rule) !important;
}

/* Stat tiles: drop the gold left rail */
.stat-card{ border-left: 1px solid var(--rule) !important; }

/* Toc cards hover: subtle, not gold */
.toc-card:hover{
  border-color: #58524a !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4) !important;
  transform: translateY(-2px);
}

/* ----- Hero: quieter, no gradient mesh, single editorial column ----- */
.hero{
  min-height: 92vh;
  background: #0F0E0C !important;
  padding: 160px 0 100px !important;
}
.hero::before{ display: none !important; } /* kill the grid mesh */

.hero-pill{
  background: transparent !important;
  border: 1px solid var(--rule) !important;
  color: #9C9588 !important;
  font-size: 10px !important;
  letter-spacing: 0.28em !important;
  padding: 8px 16px !important;
  margin-bottom: 56px !important;
}

.hero h1{
  font-family: 'Source Serif 4', 'Source Serif Pro', 'Tiempos Headline', Georgia, serif !important;
  font-weight: 400 !important;
  font-size: clamp(36px, 5.2vw, 64px) !important;
  letter-spacing: -0.018em !important;
  color: #ECE7DA !important;
  line-height: 1.08 !important;
  max-width: 18ch !important;
  margin-bottom: 18px !important;
}

.hero-deck{
  font-family: 'Source Serif 4', 'Source Serif Pro', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(18px, 1.8vw, 24px);
  color: #B5AE9F;
  letter-spacing: -0.005em;
  margin: 0 0 32px;
  max-width: 50ch;
  line-height: 1.4;
}

.hero-sub{
  color: #A8A294 !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  max-width: 60ch !important;
  margin-bottom: 64px !important;
}

/* Hero meta strip (prepared for / date / class) */
.hero-meta{
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 56px;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  padding: 24px 0;
  margin-bottom: 48px;
  max-width: 720px;
}
.hero-meta > div{ display: flex; flex-direction: column; gap: 6px; }
.hero-meta-label{
  font-size: 10px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: #6F6A5F;
  font-weight: 500;
}
.hero-meta-val{
  font-size: 14px;
  color: #D4CFC2;
  font-weight: 500;
  letter-spacing: -0.005em;
}
@media (max-width: 720px){
  .hero-meta{ grid-template-columns: 1fr; gap: 18px; }
}

/* Hero foot: smaller, more humble */
.hero-foot{
  font-size: 11.5px !important;
  color: #6F6A5F !important;
  line-height: 1.6 !important;
  max-width: 80ch !important;
  margin-top: 56px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--rule) !important;
}

/* ----- Hero CTAs: less candy, more ink ----- */
.btn-gold{
  background: #D4CFC2 !important;
  color: #0F0E0C !important;
  border: 1px solid #D4CFC2 !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
}
.btn-gold:hover{ background: var(--gold) !important; border-color: var(--gold) !important; transform: none !important; }
.btn-ghost{
  border: 1px solid var(--rule) !important;
  color: #B5AE9F !important;
}
.btn-ghost:hover{ border-color: #6F6A5F !important; color: #ECE7DA !important; background: transparent !important; }

/* ----- STICKY CHAPTER TABS ----- */
/* Pin the tab bar to the top of the viewport while reading inside a chapter */
.chapter-tabs{
  position: sticky;
  top: 60px; /* nav height */
  z-index: 40;
  background: rgba(15,14,12,0.96);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--rule) !important;
  padding: 6px !important;
  margin: 0 0 40px !important;
  border-radius: 2px !important;
}
.chapter-tabs button.active{
  background: rgba(236,231,218,0.06) !important;
  color: #ECE7DA !important;
  box-shadow: inset 0 0 0 1px var(--rule) !important;
}
/* Subtle gold underline indicator on active tab — single small accent */
.chapter-tabs button.active::after{
  content: "";
  display: block;
  width: 18px;
  height: 1px;
  background: var(--gold);
  margin: 6px auto 0;
}
.chapter-tabs button:hover:not(.active){
  color: #C7BEA7 !important;
  background: rgba(255,255,255,0.018) !important;
}
.chapter-panel{ scroll-margin-top: 140px; }

/* ----- TOC: drop gold strips ----- */
.toc-card{
  border-top: 1px solid var(--rule) !important;
}

/* ----- Tabular figures everywhere it matters ----- */
.stat-num,
.month-val,
.growth-val,
.kpi-num,
.big-num,
table td,
table th{
  font-variant-numeric: tabular-nums lining-nums;
}

/* ----- Rebalanced color: stat / KPI numbers go ivory not gold ----- */
.stat-num,
.month-val{ color: #ECE7DA !important; }
.month-tile.neg .month-val{ color: #D87080 !important; }

/* ----- Nav: hairline border instead of goldish ----- */
.nav{ border-bottom-color: var(--rule) !important; }
.nav-cta{
  background: transparent !important;
  color: var(--ink) !important;
  border: 1px solid var(--rule) !important;
  padding: 9px 16px !important;
}
.nav-cta:hover{
  background: var(--ink) !important;
  color: #0F0E0C !important;
  border-color: var(--ink) !important;
}

/* Section dividers between major sections — calm hairline */
section{ border-top: 1px solid var(--rule); }
section.alt{ border-top: 1px solid var(--rule); }

/* Background — neutralize the off-black */
body{ background: #0F0E0C !important; }
section, section.alt{ background: transparent; }

/* ============================================================
   APOLLO CREAM REBUILD — LIGHT MODE, CREAM + OXBLOOD
   Final override block. Wins all cascade fights.
   Replaces dark+gold with cream paper + oxblood accent.
   ============================================================ */

:root{
  /* === Surfaces === */
  --bg: #F4EFE3 !important;             /* warm cream */
  --bg-alt: #EDE6D4 !important;         /* darker cream band */
  --surface: #FFFFFF !important;        /* pure white cards */
  --surface-2: #FAF6EC !important;      /* alt surface */
  --surface-3: #F8F3E5 !important;

  /* === Accent (oxblood replaces gold) === */
  --gold: #7C2A1F !important;
  --gold-2: #5A1E15 !important;         /* hover (darker) */
  --gold-soft: #9B3F30 !important;      /* lighter accent */
  --gold-dim: #B8836B !important;

  /* === Text === */
  --ink: #1A1814 !important;            /* warm near-black */
  --ink-soft: #3A3530 !important;
  --muted: #6B6358 !important;
  --muted-2: #8B8579 !important;

  /* === Chart === */
  --coral: #B8633F !important;
  --blue-soft: #4A5C70 !important;
  --neg: #8C2F23 !important;
  --pos: #3F6B3A !important;

  /* === Hairlines === */
  --rule: #D9D2BE !important;
  --rule-strong: #B8AF99 !important;
  --rule-gold: #B89180 !important;
  --rule-gold-soft: #D4BBAE !important;
}

/* === Page background === */
body{
  background: #F4EFE3 !important;
  color: #1A1814 !important;
}
section{ background: transparent !important; border-top: 1px solid #D9D2BE !important; }
section.alt{ background: #EDE6D4 !important; border-top: 1px solid #D9D2BE !important; }

/* === Hero (cover) === */
.hero{
  background: #F4EFE3 !important;
  border-bottom: 1px solid #D9D2BE !important;
}
.hero::before{ display: none !important; }
.hero h1{ color: #1A1814 !important; }
.hero-deck{ color: #5A1E15 !important; }   /* italic deck in oxblood */
.hero-sub{ color: #4A453E !important; }
.hero-pill{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
  color: #6B6358 !important;
}
.hero-meta{
  border-top: 1px solid #D9D2BE !important;
  border-bottom: 1px solid #D9D2BE !important;
}
.hero-meta-label{ color: #8B8579 !important; }
.hero-meta-val{ color: #1A1814 !important; }
.hero-foot{
  color: #8B8579 !important;
  border-top: 1px solid #D9D2BE !important;
}

/* === Buttons === */
.btn-gold{
  background: #1A1814 !important;
  color: #F4EFE3 !important;
  border: 1px solid #1A1814 !important;
}
.btn-gold:hover{
  background: #7C2A1F !important;
  border-color: #7C2A1F !important;
  color: #F4EFE3 !important;
}
.btn-ghost{
  background: transparent !important;
  border: 1px solid #B8AF99 !important;
  color: #1A1814 !important;
}
.btn-ghost:hover{
  border-color: #1A1814 !important;
  color: #1A1814 !important;
  background: rgba(124,42,31,0.04) !important;
}

/* === Nav === */
.nav{
  background: rgba(244,239,227,0.95) !important;
  backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid #D9D2BE !important;
}
.nav-links a{ color: #4A453E !important; }
.nav-links a:hover{ color: #7C2A1F !important; }
.nav-cta{
  background: #1A1814 !important;
  color: #F4EFE3 !important;
  border: 1px solid #1A1814 !important;
}
.nav-cta:hover{
  background: #7C2A1F !important;
  border-color: #7C2A1F !important;
  color: #F4EFE3 !important;
}
.menu-btn{ color: #1A1814 !important; }
#mobile-menu{
  background: #F4EFE3 !important;
  border-bottom: 1px solid #D9D2BE !important;
}
#mobile-menu a{ color: #1A1814 !important; border-bottom-color: #D9D2BE !important; }

/* === Logo: switch to dark-on-light variant === */
.nav-logo{ content: url("assets/logo-dark-on-light.jpg") !important; }

/* === Gate (access overlay) === */
#gate-overlay{
  background: rgba(244,239,227,0.97) !important;
}
.gate-card,
#gate-overlay .gate-card{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
  color: #1A1814 !important;
  box-shadow: 0 8px 32px rgba(26,24,20,0.08) !important;
}
.gate-card h2,
#gate-overlay h2{ color: #1A1814 !important; }
.gate-card p,
#gate-overlay p{ color: #4A453E !important; }
.gate-card label,
#gate-overlay label{ color: #6B6358 !important; }
.gate-card input,
#gate-overlay input{
  background: #FAF6EC !important;
  border: 1px solid #D9D2BE !important;
  color: #1A1814 !important;
}
.gate-card input:focus,
#gate-overlay input:focus{
  border-color: #7C2A1F !important;
  background: #FFFFFF !important;
  outline: none !important;
}
.gate-btn{
  background: #1A1814 !important;
  color: #F4EFE3 !important;
}
.gate-btn:hover{ background: #7C2A1F !important; }

/* Prepared-for strip */
#prepared-strip{
  background: #EDE6D4 !important;
  border-bottom: 1px solid #D9D2BE !important;
  color: #6B6358 !important;
}
#prepared-strip strong,
#prepared-name{ color: #1A1814 !important; }

/* === Eyebrow === */
.eyebrow{ color: #6B6358 !important; }

/* === Headings === */
h1, h2, h3, h4{ color: #1A1814 !important; }
h2.titled::after{
  background: #7C2A1F !important;     /* the underline accent */
}

/* === Body text === */
p, li, dd, dt{ color: #1A1814; }
.lede{ color: #3A3530 !important; }
.muted{ color: #6B6358 !important; }
.small{ color: #4A453E !important; }
em, i{ color: inherit; }

/* === Links === */
a{ color: #7C2A1F !important; }
a:hover{ color: #5A1E15 !important; }

/* === TOC cards === */
.toc-card{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
  color: #1A1814 !important;
}
.toc-card:hover{
  border-color: #7C2A1F !important;
  box-shadow: 0 8px 24px rgba(26,24,20,0.08) !important;
}
.toc-num{ color: #6B6358 !important; }
.toc-card h3{ color: #1A1814 !important; }
.toc-card p{ color: #4A453E !important; }
.toc-meta{ border-top: 1px solid #D9D2BE !important; color: #8B8579 !important; }
.toc-meta .arrow{ color: #6B6358 !important; }
.toc-card:hover .toc-meta .arrow,
.toc-card:hover .toc-num{ color: #7C2A1F !important; }

/* === Chapter sub-tabs (sticky) === */
.chapter-tabs{
  background: rgba(244,239,227,0.97) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid #D9D2BE !important;
  box-shadow: 0 1px 0 rgba(26,24,20,0.04) !important;
}
.chapter-tabs button{
  color: #6B6358 !important;
  background: transparent !important;
}
.chapter-tabs button:hover:not(.active){
  color: #1A1814 !important;
  background: rgba(26,24,20,0.04) !important;
}
.chapter-tabs button.active{
  background: #FFFFFF !important;
  color: #1A1814 !important;
  box-shadow: inset 0 0 0 1px #D9D2BE !important;
}
.chapter-tabs button.active::after{
  background: #7C2A1F !important;       /* oxblood underline indicator */
}

/* === Cards: feature, KPI, callout === */
.feature-card,
.kpi-card,
.callout,
.bridge-callout,
.stat-card{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
  color: #1A1814 !important;
  box-shadow: none !important;
}
.feature-card:hover{
  border-color: #B8AF99 !important;
  box-shadow: 0 4px 16px rgba(26,24,20,0.06) !important;
  transform: translateY(-2px);
}
.feature-num,
.kpi-label,
.bridge-callout .kicker,
.callout .kicker{ color: #6B6358 !important; }
.feature-card h4,
.kpi-num,
.callout p,
.bridge-callout p,
.stat-num{ color: #1A1814 !important; }
.feature-card p{ color: #4A453E !important; }
.kpi-num{ font-weight: 600 !important; }
.bridge-callout{
  background: #FAF6EC !important;
}
.bridge-callout a{
  color: #7C2A1F !important;
  border-bottom: 1px solid #D4BBAE !important;
}
.bridge-callout a:hover{
  border-bottom-color: #7C2A1F !important;
  color: #5A1E15 !important;
}
.stat-card{ border-left: 1px solid #D9D2BE !important; }
.stat-label{ color: #6B6358 !important; }
.stat-note{ color: #8B8579 !important; }

/* === Tables === */
table{ background: #FFFFFF !important; }
table th{
  background: #EDE6D4 !important;
  color: #1A1814 !important;
  border-bottom: 1px solid #D9D2BE !important;
}
table td{
  color: #1A1814 !important;
  border-bottom: 1px solid #D9D2BE !important;
}
table tbody tr:hover{ background: #FAF6EC !important; }
.terms-table th{
  background: #FAF6EC !important;
  color: #6B6358 !important;
  border-bottom: 1px solid #D9D2BE !important;
}
.terms-table td:first-child{ color: #1A1814 !important; }
.terms-table td{ color: #4A453E !important; }
.table-wrap{ background: #FFFFFF !important; border: 1px solid #D9D2BE !important; }

/* === Month tiles (Track Record) === */
.month-tile{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
}
.month-tile.neg{
  background: #FBF1ED !important;
  border-color: #E5C8C0 !important;
}
.month-label{ color: #6B6358 !important; }
.month-val{ color: #3F6B3A !important; }   /* positive months green */
.month-tile.neg .month-val{ color: #8C2F23 !important; }   /* negative oxblood */

/* === Annual strip === */
.annual-strip > div{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
}
.annual-strip .yr{ color: #6B6358 !important; }
.annual-strip .pct{ color: #1A1814 !important; }

/* === Growth rows === */
.growth-row{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
}
.growth-num{ color: #6B6358 !important; }
.growth-val{ color: #1A1814 !important; }
.growth-end .growth-val{ color: #7C2A1F !important; }
.growth-arrow{ color: #B8AF99 !important; }
.growth-step .small,
.growth-step .muted{ color: #6B6358 !important; }
.growth-step .growth-val{ color: #1A1814 !important; }

/* === Hero pill / inline pills === */
.kpi-pill,
.tag,
.pill{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
  color: #1A1814 !important;
}

/* === Disclosures / Footer === */
footer,
.site-footer,
.footer{
  background: #EDE6D4 !important;
  color: #6B6358 !important;
  border-top: 1px solid #D9D2BE !important;
}
.disclosure-band,
.confidential-band{
  background: #EDE6D4 !important;
  color: #6B6358 !important;
  border-color: #D9D2BE !important;
}

/* === Highlights / pull-quotes === */
blockquote,
.pullquote{
  background: #FAF6EC !important;
  border-left: 3px solid #7C2A1F !important;
  color: #1A1814 !important;
}

/* === Scrollbar (subtle for cream) === */
::-webkit-scrollbar{ width: 12px; height: 12px; }
::-webkit-scrollbar-track{ background: #EDE6D4; }
::-webkit-scrollbar-thumb{ background: #B8AF99; border: 3px solid #EDE6D4; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover{ background: #6B6358; }

/* === Focus === */
:focus-visible{ outline: 2px solid #7C2A1F !important; outline-offset: 3px; }

/* === Selection === */
::selection{ background: #7C2A1F; color: #F4EFE3; }

/* === Gate fixes (correct selectors) === */
.gate{
  background: rgba(244,239,227,0.97) !important;   /* cream wash, not black */
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
.gate-card{
  background: #FFFFFF !important;
  border: 1px solid #D9D2BE !important;
  color: #1A1814 !important;
  box-shadow: 0 12px 48px rgba(26,24,20,0.08) !important;
}
.gate-eyebrow{ color: #6B6358 !important; }
.gate-title{ color: #1A1814 !important; }
.gate-sub{ color: #4A453E !important; }
.gate-input,
.gate-form input[type="text"],
.gate-form input[type="email"],
.gate-form input[type="tel"],
.gate-form input[type="password"]{
  background: #FAF6EC !important;
  border: 1px solid #D9D2BE !important;
  color: #1A1814 !important;
}
.gate-input:focus,
.gate-form input:focus{
  border-color: #7C2A1F !important;
  background: #FFFFFF !important;
  box-shadow: 0 0 0 3px rgba(124,42,31,0.12) !important;
  outline: none !important;
}
.gate-input::placeholder,
.gate-form input::placeholder{ color: #A19883 !important; }
.gate-error{ color: #8C2F23 !important; }
.gate-foot{ color: #8B8579 !important; }
.gate-form label{ color: #6B6358 !important; }
.gate-form .checkbox-row,
.gate-form .checkbox-row label{ color: #4A453E !important; }
.gate-form input[type="checkbox"]{ accent-color: #7C2A1F !important; }

/* ============================================================
   APOLLO CREAM — FINAL POLISH PASS
   ============================================================ */

/* Disclaimer strip — was dark, now cream hairline band */
.disclaimer-strip{
  background: #EDE6D4 !important;
  border-top: 1px solid #D9D2BE !important;
  color: #6B6358 !important;
  letter-spacing: 0.06em !important;
  font-weight: 500 !important;
}

/* Footer — keep cream, tidy text colors */
footer{
  background: #EDE6D4 !important;
  border-top: 1px solid #D9D2BE !important;
  color: #4A453E !important;
}
footer .foot-block h4{ color: #1A1814 !important; }
footer .foot-block p,
footer .foot-block li{ color: #6B6358 !important; }
footer a{ color: #7C2A1F !important; }
footer a:hover{ color: #5A1E15 !important; }
footer .foot-rule{ background: #D9D2BE !important; border: none !important; height: 1px !important; }

/* Footer logo — switch to dark-on-light */
footer .foot-logo{
  content: url("assets/logo-dark-on-light.jpg") !important;
  filter: none !important;
  opacity: 1 !important;
}

/* Gate logo — also dark-on-light */
.gate-logo{
  content: url("assets/logo-dark-on-light.jpg") !important;
}

/* Hero — tighten vertical rhythm (was too airy) */
#cover .hero,
.hero{
  padding-top: 56px !important;
  padding-bottom: 64px !important;
}

/* Chart legend & axis text — make sure they read on cream
   (Chart.js draws inline; CSS won't reach canvas, but defensive
   captions/notes outside the canvas often inherit dark-mode colors) */
.chart-foot,
.chart-block .chart-foot,
.chart-block p,
.chart-block .small-note{
  color: #6B6358 !important;
}
.chart-title{ color: #1A1814 !important; }
.chart-sub{ color: #6B6358 !important; }

/* Chart year-toggle pills (2023/2024/2025) — cream chips */
.chart-tabs button{
  background: transparent !important;
  color: #6B6358 !important;
  border: 1px solid #D9D2BE !important;
}
.chart-tabs button.active{
  background: #FFFFFF !important;
  color: #1A1814 !important;
  border-color: #1A1814 !important;
  box-shadow: inset 0 0 0 1px #D9D2BE !important;
}

/* Defensive: any dark surface left over */
[style*="background: #0A0A"],
[style*="background-color: #0A0A"]{
  background: #FFFFFF !important;
}

/* ============================================================
   APOLLO CREAM — SEMANTIC COLOR FIX (positive=green, neg=oxblood)
   The chart bars and big return numbers were rendering oxblood;
   that conflicts with finance convention (red = down).
   ============================================================ */

/* Positive return cards (Annual Returns: +48.31%, +130.02%, +64.30%, +242.63%) */
.annual-num{ color: #3F6B3A !important; }
.annual-card{ border-left-color: #3F6B3A !important; }
.annual-card.highlight{
  background: linear-gradient(180deg, rgba(63,107,58,0.08), rgba(63,107,58,0.02)) !important;
  border-left-color: #3F6B3A !important;
}
.annual-year{ color: #6B6358 !important; }

/* Year totals at bottom of monthly grids */
.month-row.total .v{ color: #3F6B3A !important; font-weight: 600 !important; }

/* Benchmark comparison table — WHCG numbers are positive returns,
   keep them visually distinct (ink-bold, not oxblood-red) */
.compare-row strong,
.compare-table strong{ color: #1A1814 !important; }

/* Stat cards if they show positive figures */
.stat-num{ color: #1A1814 !important; }

/* Generic positive/negative utility classes if used anywhere */
.pos, .positive, .num-pos{ color: #3F6B3A !important; }
.neg, .negative, .num-neg{ color: #7C2A1F !important; }

/* Sign-aware inline numbers (e.g. "+47.47%") in commentary blocks */
.sign-pos{ color: #3F6B3A !important; }
.sign-neg{ color: #7C2A1F !important; }