/* ═══════════════════════════════════════════════════════════════
   AI PRACTICE BROKER — PREMIUM LAYER
   A precision-instrument identity: navy ink, brass rule, paper ground.
   Loaded AFTER page styles; deliberately wins the cascade.
   ═══════════════════════════════════════════════════════════════ */


/* ── ORPHAN-TOKEN SAFETY NET (2026-08-12) ─────────────────────────────
   Pages were refactored to --p-* tokens; legacy pages still reference the
   old names, which resolved to NOTHING (transparent heroes, ghost text —
   "the washed-out site"). These fallbacks map every legacy token to the
   one house palette. Pages that define their own :root still win. */
:root{
  --navy-deep:#0B1D33; --navy-mid:#16345C; --deep:#0B1D33;
  --ink:#0B1D33; --ink-soft:#33415A; --text-dim:#4A5666; --muted:#6E7783; --faint:#8B93A0;
  --paper:#FCFDFE; --ivory:#FAF9F6; --bg:#FCFDFE; --surface:#FFFFFF; --panel:#FFFFFF;
  --card:#FFFFFF; --card-bg:#FFFFFF; --wash:#F4F7FB; --sand-dim:#F4F7FB;
  --rule:#E1E7EF; --rule-soft:#ECF1F7; --warm-rule:#E4E2DB; --line:#E1E7EF;
  --gold:#A67C2E; --gold-lit:#C9A15A; --gold-soft:rgba(166,124,46,.12); --bronze:#A67C2E;
  /* -dim tokens are used by legacy pages as pale BACKGROUND tints, and
     --blue-soft as soft navy TEXT — solid/dark values here break contrast. */
  --accent:#16345C; --blue:#16345C; --blue-dim:rgba(11,29,51,.06); --blue-soft:#33415A; --silver-blue:#8FA3BC;
  --teal:#1E6B4F; --teal-light:#2E8A68; --teal-pale:#E7F2ED; --green:#1E6B4F; --green-dim:rgba(30,107,79,.10);
  --red:#A4272B; --red-dim:rgba(164,39,43,.08); --amber:#9A6B12; --warn:#9A6B12; --warn-bg:#FBF3E2;
  --num:"ss01" 1; 
  --serif:'Newsreader', Georgia, 'Times New Roman', serif;
  --sans:-apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

:root{
  --p-ink:#0B1D33;          /* navy — primary ink */
  --p-ink-2:#16345C;        /* mid navy — links, accents */
  --p-body:#4A5666;         /* body copy, slightly cool */
  --p-mute:#6E7783;         /* captions */
  --p-paper:#FCFDFE;        /* page ground */
  --p-panel:#FFFFFF;        /* card ground */
  --p-sink:#F4F7FB;         /* recessed tile */
  --p-rule:#E1E7EF;         /* hairline */
  --p-rule-2:#CFD8E3;       /* stronger hairline */
  --p-brass:#A67C2E;        /* the one accent */
  --p-brass-lt:#C9A15A;
  --p-good:#1E6B4F;
  --p-warn:#9A6B12;
  --p-bad:#A4272B;
  --p-shadow-sm:0 1px 2px rgba(11,29,51,.05);
  --p-shadow:0 1px 2px rgba(11,29,51,.04), 0 10px 28px -14px rgba(11,29,51,.14);
  --p-shadow-lg:0 1px 3px rgba(11,29,51,.05), 0 24px 56px -24px rgba(11,29,51,.20);
  --p-ease:cubic-bezier(.22,.61,.36,1);
}

body{ background:var(--p-paper); color:var(--p-ink); }

/* ── TYPE ─────────────────────────────────────────────── */
h1,h2,h3,.sample-title,.credit-title,.slider-title,.cc-tier,.logo{
  font-family:'Source Serif 4',Georgia,serif; font-weight:700;
  letter-spacing:-.018em; text-wrap:balance; color:var(--p-ink);
}
h1{ line-height:1.06; }
h2{ line-height:1.15; }
p,li,td{ color:var(--p-body); }
.hero-sub,.sec-sub{ color:var(--p-body); }

/* Brass rule under section headings — the signature device */
h2.center::after,.sec-head::after{
  content:''; display:block; width:44px; height:2px; margin:16px auto 0;
  background:linear-gradient(90deg,var(--p-brass),var(--p-brass-lt));
}

/* Kicker chips: brass, not muddy navy-on-navy */
.kicker,.slider-badge,.credit-hook{
  background:linear-gradient(180deg,#FFFDF8,#FBF5E9)!important;
  border:1px solid rgba(166,124,46,.30)!important;
  color:#7A5A1E!important;
  box-shadow:inset 0 1px 0 #fff, var(--p-shadow-sm);
}

/* ── NAV ──────────────────────────────────────────────── */
.topnav{
  background:rgba(252,253,254,.82)!important;
  backdrop-filter:blur(14px) saturate(1.6);
  border-bottom:1px solid var(--p-rule);
  transition:box-shadow .3s var(--p-ease), padding .3s var(--p-ease);
}
.topnav.is-stuck{ box-shadow:0 1px 0 var(--p-rule), 0 8px 24px -18px rgba(11,29,51,.5); padding-top:14px; padding-bottom:14px; }
.logo{ font-size:19px; }
.logo span{ color:var(--p-brass); }

/* Scroll progress hairline */
#p-progress{
  position:fixed; top:0; left:0; height:2px; width:0%; z-index:99;
  background:linear-gradient(90deg,var(--p-ink-2),var(--p-brass));
  transition:width .1s linear; pointer-events:none;
}

/* ── SURFACES ─────────────────────────────────────────── */
.report-item,.calc-card,.price-card,.lever-col,.coaching-card,
.sample-wrapper,.credit-tracker,.slider-section,.coaching-section,
.snap-item,.val-method,.audit-deep,.slider-out-card,.cost-of-waiting,
.credit-meter,.credit-step{
  background:var(--p-panel); border-color:var(--p-rule);
}
.report-item,.calc-card,.lever-col,.coaching-card{
  box-shadow:var(--p-shadow); border-radius:16px;
  transition:transform .25s var(--p-ease), box-shadow .25s var(--p-ease), border-color .25s var(--p-ease);
}
.report-item:hover,.calc-card:hover,.coaching-card:hover{
  transform:translateY(-3px); box-shadow:var(--p-shadow-lg); border-color:var(--p-rule-2);
}
.sample-wrapper,.credit-tracker,.slider-section,.coaching-section{
  box-shadow:var(--p-shadow-lg); border-radius:22px;
}
.snap-item,.val-method,.slider-out-card,.cost-of-waiting,.credit-meter,
.credit-step,.calc-out,.calc-result,.audit-deep,.disclaimer-box{
  background:var(--p-sink)!important; border-color:var(--p-rule)!important;
}

/* Report tiles: brass corner index instead of emoji-as-decoration */
.report-grid{ counter-reset:rpt; }
.report-item{ position:relative; padding-top:26px; }
.report-item::before{
  counter-increment:rpt; content:counter(rpt,decimal-leading-zero);
  position:absolute; top:16px; right:18px;
  font:700 11px/1 'Inter',sans-serif; letter-spacing:.1em;
  color:var(--p-brass); opacity:.7;
}
.report-item::after{
  content:''; position:absolute; left:0; top:16px; bottom:16px; width:2px;
  background:linear-gradient(180deg,var(--p-brass),transparent);
  border-radius:2px; opacity:0; transition:opacity .25s var(--p-ease);
}
.report-item:hover::after{ opacity:1; }
.report-item h4{ color:var(--p-ink); font-size:16.5px; }

/* ── BUTTONS ──────────────────────────────────────────── */
.btn-primary,.submit-btn,.calc-btn{
  background:linear-gradient(180deg,#1B3E6B,#132F52)!important; color:#fff!important;
  border:1px solid #0E2647!important; border-radius:11px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 2px 6px -1px rgba(11,29,51,.30);
  transition:transform .12s var(--p-ease), box-shadow .2s var(--p-ease), filter .2s;
  letter-spacing:.005em;
}
.btn-primary:hover,.submit-btn:hover,.calc-btn:hover{
  filter:brightness(1.10); transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 8px 18px -6px rgba(11,29,51,.38);
}
.btn-primary:active,.submit-btn:active,.calc-btn:active{ transform:translateY(0); }
.btn-gold,.btn-primary.btn-gold{
  background:linear-gradient(180deg,#B8912F,#96731F)!important;
  border-color:#7E6019!important; color:#fff!important;
}
.btn-ghost{ background:#fff; border:1.5px solid var(--p-rule-2); color:var(--p-ink-2); border-radius:11px; }
.btn-ghost:hover{ border-color:var(--p-ink-2); background:var(--p-sink); }

/* ── FORMS ────────────────────────────────────────────── */
.fi-input,.fi-select,.fi-textarea,.calc-input{
  background:#fff!important; border:1px solid var(--p-rule-2)!important;
  color:var(--p-ink)!important; border-radius:10px;
  transition:border-color .15s, box-shadow .15s;
}
.fi-input:focus,.fi-select:focus,.fi-textarea:focus,.calc-input:focus{
  outline:none; border-color:var(--p-ink-2)!important;
  box-shadow:0 0 0 3px rgba(22,52,92,.13)!important;
}
.upload-box{ background:var(--p-sink); border:1.5px dashed var(--p-rule-2); }
.upload-box:hover{ border-color:var(--p-brass); }

/* ── TABLES ───────────────────────────────────────────── */
.data-table{ font-variant-numeric:tabular-nums; }
.data-table th{ background:var(--p-sink)!important; color:var(--p-mute)!important; border-bottom:1px solid var(--p-rule-2); }
.data-table td{ border-bottom:1px solid var(--p-rule); }
.data-table .total-row td{ background:#EFF4FA!important; color:var(--p-ink); border-top:2px solid var(--p-rule-2); }
.data-table .add{ color:var(--p-good); }
.data-table .sub{ color:var(--p-bad); }
.table-scroll{ overflow-x:auto; }

/* Sample report header stays dark — it reads as a document cover */
.sample-header{
  background:linear-gradient(135deg,#0B1D33,#16345C)!important;
  border-bottom:none!important;
}
.sample-header .sample-title{ color:#fff!important; }
.sample-header .sample-subtitle{ color:#A9BDD4!important; }
.sample-badge{ background:var(--p-brass)!important; color:#fff!important; }

/* ── SEMANTIC ─────────────────────────────────────────── */
.snap-value.green,.audit-val.pass,.li-roi.high,.cs-val,.credit-amount{ color:var(--p-good)!important; }
.snap-value.gold,.audit-val.warn,.li-roi.med{ color:var(--p-warn)!important; }
.audit-val.fail{ color:var(--p-bad)!important; }
.snap-value.blue,.val-range,.consensus-box .range,.soc-value,.horizon-value{ color:var(--p-ink)!important; }
.consensus-box{
  background:linear-gradient(180deg,#F7FAFD,#EFF4FA)!important;
  border:1px solid var(--p-rule-2)!important; box-shadow:var(--p-shadow-sm);
}
.consensus-box .label{ color:var(--p-brass)!important; letter-spacing:.16em; }
.flag-list li.red{ background:#FCF2F2!important; color:#8C2226!important; }
.flag-list li.green{ background:#F0F7F3!important; color:#1A5B43!important; }
.flag-list li.gold{ background:#FDF8ED!important; color:#7A5A1E!important; }
.rs-head{ color:var(--p-brass)!important; border-bottom:1px solid var(--p-rule-2)!important; letter-spacing:.16em; }

/* ── HERO CHART ───────────────────────────────────────── */
.p-hero-figure{ max-width:660px; margin:34px auto 0; }
.p-hero-figure svg{ width:100%; height:auto; display:block; overflow:visible; }
.p-draw{ stroke-dasharray:1; stroke-dashoffset:1; }
.p-band{ opacity:0; }
.p-dot{ opacity:0; }
.p-figcap{
  text-align:center; font-size:12px; color:var(--p-mute); margin-top:12px;
  letter-spacing:.02em;
}

/* ── SCROLL REVEAL ────────────────────────────────────── */
[data-p-reveal]{ opacity:0; transform:translateY(18px); }
[data-p-reveal].p-in{
  opacity:1; transform:none;
  transition:opacity .6s var(--p-ease), transform .6s var(--p-ease);
}

/* ── FOOTER ───────────────────────────────────────────── */
footer{ border-top:1px solid var(--p-rule); color:var(--p-mute); }
footer a{ color:var(--p-ink-2); text-decoration:none; border-bottom:1px solid rgba(22,52,92,.25); }
footer a:hover{ border-bottom-color:var(--p-ink-2); }

/* ── A11Y ─────────────────────────────────────────────── */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--p-brass); outline-offset:2px; border-radius:6px;
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation:none!important; transition:none!important; }
  [data-p-reveal]{ opacity:1!important; transform:none!important; }
  .p-draw{ stroke-dashoffset:0!important; }
  .p-band,.p-dot{ opacity:1!important; }
}

