/* DebtStak site CSS — shared across all landing pages.
   Design system: navy ink + amber accent + institutional green, on a clean
   near-white paper. Archivo (display/body) + IBM Plex Mono (labels/data).
   Navy carries structure and primary buttons; amber is the single pop;
   green is the semantic "fits / available" hue. */

:root{
  /* --- core palette --- */
  --bg:#FAFAF7;            /* paper */
  --surface:#FFFFFF;       /* cards */
  --surface-2:#FCFCFA;
  --ink:#10233E;           /* deep navy — text + structure + primary buttons */
  --ink-2:#1A3357;         /* raised / hover navy */
  --slate:#31445E;         /* body-secondary */
  --slate-2:#7C8A9C;       /* muted labels */
  --green:#2E7D5B;         /* institutional green / links */
  --green-bright:#359268;
  --green-soft:#E9F3EE;
  --green-line:#CFE6DA;
  --amber:#E8A33D;         /* the pop */
  --amber-2:#EFB257;       /* amber hover */
  --amber-soft:#FBF3E4;
  --amber-ink:#A46B12;     /* amber text on light */
  --amber-line:#F0E2C4;
  --red:#C24141;
  --line:#E3E5E0;          /* hairline */

  /* --- backward-compat aliases (referenced inline in some pages) --- */
  --paper:#FAFAF7;
  --hairline:#E3E5E0;
  --hairline-strong:#D6D3C8;
  --orange:#E8A33D;        /* legacy "orange" is now amber */

  --display:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --body:'Archivo',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}

.wrap{max-width:1120px;margin:0 auto;padding:0 clamp(20px,5vw,44px);}
.wrap.narrow{max-width:820px;}

.eyebrow{
  font-family:var(--mono);
  font-size:12px;font-weight:500;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--amber-ink);
}

/* ---------- Top nav ---------- */
.topnav{
  position:sticky;top:0;z-index:50;
  background:rgba(250,250,247,0.85);
  backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--line);
}
.topnav-inner{
  max-width:1120px;margin:0 auto;
  padding:14px clamp(20px,5vw,44px);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.topnav .brand{
  font-family:var(--display);font-weight:800;font-size:19px;
  letter-spacing:-0.02em;color:var(--ink);
}
.topnav .brand .dot{color:var(--amber);}
.nav-links{display:flex;align-items:center;gap:4px;}
.nav-links a{
  font-size:14px;font-weight:500;color:var(--slate);
  padding:8px 14px;border-radius:8px;transition:color .15s,background .15s;
}
.nav-links a:hover{color:var(--ink);background:rgba(16,35,62,0.04);}
.nav-links .quote{
  color:#fff;background:var(--ink);font-weight:600;
  box-shadow:0 8px 20px -12px rgba(16,35,62,0.6);
}
.nav-links .quote:hover{background:var(--ink-2);color:#fff;}

/* ---------- Buttons ---------- */
.btn{
  font-family:var(--display);font-weight:600;font-size:15px;
  padding:13px 24px;border-radius:12px;text-decoration:none;
  display:inline-block;transition:transform .12s,background .15s,box-shadow .15s,border-color .15s;
}
.btn-primary{background:var(--ink);color:#fff;box-shadow:0 14px 30px -16px rgba(16,35,62,0.7);}
.btn-primary:hover{background:var(--ink-2);transform:translateY(-1px);}
.btn-ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line);}
.btn-ghost:hover{border-color:var(--slate-2);}
.btn-amber{background:var(--amber);color:var(--ink);box-shadow:0 14px 30px -16px rgba(232,163,61,0.7);}
.btn-amber:hover{background:var(--amber-2);transform:translateY(-1px);}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(24px,4vw,32px);}

/* ---------- Homepage hero ---------- */
.hero{position:relative;text-align:center;overflow:hidden;
  padding:clamp(56px,10vw,120px) 0 clamp(16px,4vw,32px);}
.hero::before{content:"";position:absolute;top:-28%;left:50%;transform:translateX(-50%);
  width:min(900px,120%);height:620px;z-index:0;pointer-events:none;filter:blur(20px);
  background:radial-gradient(58% 55% at 50% 40%,rgba(46,125,91,0.15),transparent 70%),
            radial-gradient(40% 38% at 72% 26%,rgba(232,163,61,0.16),transparent 70%);}
.hero>*{position:relative;z-index:1;}
.pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);
  font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:var(--amber-ink);
  background:var(--amber-soft);border:1px solid var(--amber-line);padding:7px 14px;border-radius:999px;}
.pill .d{width:7px;height:7px;border-radius:50%;background:var(--amber);}
.hero h1{font-family:var(--display);font-size:clamp(36px,6.2vw,68px);font-weight:800;
  line-height:1.05;letter-spacing:-0.03em;margin:22px auto 0;max-width:17ch;text-wrap:balance;}
.hero h1 .accent{color:var(--amber);}
.hero .lede{color:var(--slate);font-size:clamp(17px,2.2vw,20px);max-width:58ch;margin:22px auto 0;}
.hero .cta-row{justify-content:center;}

/* ---------- Browser frame + product mock (homepage) ---------- */
.mock{max-width:860px;margin:clamp(38px,6vw,60px) auto 0;text-align:left;}
.browser{background:var(--surface);border:1px solid var(--line);border-radius:16px;
  overflow:hidden;box-shadow:0 44px 84px -46px rgba(16,35,62,0.4),0 8px 24px -14px rgba(16,35,62,0.14);}
.browser-bar{display:flex;align-items:center;gap:8px;padding:13px 18px;border-bottom:1px solid var(--line);}
.browser-dot{width:11px;height:11px;border-radius:50%;background:#e4e0d5;}
.browser-url{margin-left:12px;font-family:var(--mono);font-size:12px;color:var(--slate-2);}
.browser .sample-screen{border:none;border-radius:0;box-shadow:none;}
.browser .demo-video{display:block;width:100%;height:auto;background:var(--surface);}

/* ---------- Interior page header ---------- */
.masthead{
  padding:clamp(44px,7vw,80px) 0 clamp(24px,4vw,36px);
  border-bottom:1px solid var(--line);
}
.masthead .tagline{
  font-family:var(--display);font-weight:800;
  font-size:clamp(30px,5vw,50px);line-height:1.08;letter-spacing:-0.025em;
  margin:16px 0 0;max-width:20ch;text-wrap:balance;
}
.masthead .tagline .accent{color:var(--amber);}
.wordmark{font-family:var(--display);font-weight:800;font-size:clamp(28px,6vw,40px);
  letter-spacing:-0.02em;margin:14px 0 0;line-height:1;}
.wordmark .dot{color:var(--amber);}
.sub{color:var(--slate);font-size:clamp(16px,2.2vw,19px);margin:18px 0 0;max-width:60ch;}

/* ---------- Trust cards ---------- */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  margin:clamp(28px,5vw,44px) 0 0;}
.trust-item{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;}
.trust-item .k{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--green);display:block;margin-bottom:10px;}
.trust-item .v{font-size:15px;color:var(--slate);line-height:1.5;}

/* ---------- Section heads ---------- */
.section{margin-top:clamp(48px,7vw,88px);}
.section-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:clamp(24px,4vw,34px);
}
.section-head h2{font-family:var(--display);font-size:clamp(22px,3.2vw,32px);
  font-weight:800;letter-spacing:-0.02em;margin:0;}

/* ---------- Steps (how it works) ---------- */
.steps{display:grid;gap:12px;}
.step{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(14px,3vw,24px);
  background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:clamp(16px,2.6vw,22px);
}
.step .num{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--amber-ink);padding-top:2px;}
.step .label{font-family:var(--display);font-weight:700;font-size:17px;margin:0 0 4px;}
.step .desc{color:var(--slate);font-size:15px;margin:0;max-width:60ch;}
.ask{margin-top:20px;font-size:15.5px;color:var(--ink);}
.ask strong{color:var(--green);font-weight:600;}

/* ---------- Product cards ---------- */
.product-list{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.product{
  display:flex;flex-direction:column;gap:14px;
  background:var(--surface);border:1px solid var(--line);border-radius:18px;
  padding:26px;text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s,border-color .18s;
}
.product:hover{transform:translateY(-3px);box-shadow:0 30px 50px -32px rgba(16,35,62,0.26);border-color:#d3ccba;}
.product.lead{background:linear-gradient(180deg,#fff,var(--green-soft));border-color:var(--green-line);}
.product .pname{font-family:var(--display);font-weight:700;font-size:19px;margin:0;}
.product .pdesc{color:var(--slate);font-size:14.5px;margin:0;flex:1;}
.product-status{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.pstatus{
  font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:0.1em;
  text-transform:uppercase;padding:6px 12px;border-radius:999px;white-space:nowrap;
}
.pstatus.now{background:var(--green);color:#fff;}
.pstatus.dev{background:var(--amber-soft);color:var(--amber-ink);}
/* Audience chip (Lender / Broker) — neutral, sits alongside the status chip. */
.paud{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:0.08em;
  text-transform:uppercase;padding:6px 11px;border-radius:999px;white-space:nowrap;
  background:var(--surface-2);color:var(--slate);border:1px solid var(--hairline-strong);}
/* Capability list inside an audience card (Brokers: two equal capabilities). */
.aud-cap{display:block;margin-top:9px;color:var(--slate);font-size:14px;}
.aud-cap b{color:var(--ink);font-weight:600;}
.product .pship{font-family:var(--mono);font-size:12px;color:var(--slate-2);white-space:nowrap;}
.product .arrow{font-family:var(--mono);color:var(--green);font-weight:700;font-size:14px;}

/* ---------- Sample screen (canonical, used on home + screener) ---------- */
.sample-screen{
  background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;
  box-shadow:0 30px 60px -40px rgba(16,35,62,0.32);max-width:600px;
}
.sample-screen .head{padding:20px 24px;border-bottom:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;}
.sample-screen .title{font-family:var(--display);font-weight:700;font-size:1.1rem;}
.sample-screen .facts{font-family:var(--mono);font-size:0.8rem;color:var(--slate);
  margin-top:0.5rem;line-height:1.55;font-variant-numeric:tabular-nums;}
.sample-screen .verdict{font-family:var(--mono);font-weight:600;font-size:0.72rem;
  letter-spacing:0.13em;text-transform:uppercase;padding:0.45rem 0.8rem;border-radius:8px;
  white-space:nowrap;background:var(--green-soft);color:var(--green);border:1px solid var(--green-line);}
.sample-screen .sec{padding:16px 24px;border-bottom:1px solid var(--line);}
.sample-screen .sec:last-child{border:none;}
.sample-screen .sec .lbl{font-family:var(--mono);font-size:0.66rem;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--slate-2);margin-bottom:0.6rem;}
.sample-screen .sec .row{font-size:0.92rem;margin-bottom:0.35rem;color:var(--ink);line-height:1.5;}
.sample-screen .sec .row:last-child{margin-bottom:0;}
.sample-screen .sec .row .ask{color:var(--green);font-family:var(--mono);font-size:0.74rem;}
.sample-screen .reco{font-size:0.95rem;color:var(--ink);line-height:1.55;}

/* ---------- Term sheet (pricing) ---------- */
.sheet{background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;
  box-shadow:0 30px 60px -44px rgba(16,35,62,0.28);}
.sheet-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--ink);color:#fff;padding:14px clamp(18px,3vw,24px);}
.sheet-bar .t{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:0.13em;text-transform:uppercase;}
.sheet-bar .status{font-family:var(--mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--amber);display:flex;align-items:center;gap:8px;}
.sheet-bar .status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--amber);}
.sheet-bar .status.soon{color:#C6CBD2;}
.sheet-bar .status.soon::before{background:#C6CBD2;}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);}
.tier{padding:clamp(20px,3vw,26px) clamp(18px,2.6vw,24px);border-right:1px solid var(--line);position:relative;}
.tier:last-child{border-right:none;}
.tier.lead{background:var(--green-soft);}
.tier .tname{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--slate-2);margin-bottom:14px;}
.tier.lead .tname{color:var(--green);}
.tier .price{font-family:var(--display);font-weight:800;font-size:clamp(28px,5vw,34px);
  letter-spacing:-0.02em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;}
.tier .price .per{font-size:14px;font-weight:500;color:var(--slate);letter-spacing:0;}
.tier .detail{margin-top:12px;font-size:14px;color:var(--slate);line-height:1.55;}
.tier .detail .incl{color:var(--ink);font-weight:600;}
.sheet-foot{border-top:1px solid var(--line);padding:16px clamp(18px,3vw,24px);
  font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--slate);}
.sheet-foot b{color:var(--ink);font-weight:600;}

/* ---------- About prose ---------- */
.prose p{color:var(--ink);font-size:16.5px;margin:0 0 16px;max-width:64ch;}
.prose p:last-child{margin-bottom:0;}
.prose .lead{font-size:19px;color:var(--ink);font-weight:500;}

/* ---------- Services ---------- */
.services{display:grid;gap:12px;margin-top:clamp(10px,2vw,14px);}
.service{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px 22px;}
.service .sname{font-family:var(--display);font-weight:700;font-size:16px;margin:0 0 5px;}
.service .sdesc{color:var(--slate);font-size:14.5px;margin:0;}

/* ---------- Example tiles ---------- */
.example-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:12px;}
.example{background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:20px 22px;font-size:15px;color:var(--ink);}
.example strong{color:var(--green);font-weight:600;}

/* ---------- CTA band (navy) ---------- */
.ctaband{position:relative;overflow:hidden;margin-top:clamp(48px,7vw,80px);
  background:linear-gradient(120deg,var(--ink),var(--ink-2) 72%);color:#fff;
  border-radius:24px;padding:clamp(40px,6vw,68px);text-align:center;
  box-shadow:0 40px 70px -42px rgba(16,35,62,0.7);}
.ctaband::after{content:"";position:absolute;right:-6%;top:-40%;width:420px;height:420px;
  border-radius:50%;background:radial-gradient(circle,rgba(232,163,61,0.26),transparent 62%);pointer-events:none;}
.ctaband>*{position:relative;z-index:1;}
.ctaband h2{font-family:var(--display);font-size:clamp(26px,4vw,40px);font-weight:800;
  letter-spacing:-0.02em;margin:0;text-wrap:balance;}
.ctaband p{color:rgba(255,255,255,0.82);max-width:56ch;margin:16px auto 0;}
.ctaband .cta-row{justify-content:center;}

/* ---------- Footer ---------- */
footer{
  margin-top:clamp(48px,7vw,72px);padding:32px 0 52px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:10px 24px;align-items:baseline;
  font-family:var(--mono);font-size:12px;letter-spacing:0.04em;color:var(--slate);
}
footer .brand{color:var(--ink);font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:-0.01em;}
footer a{color:var(--green);}
footer a:hover{text-decoration:underline;}

/* ---------- Entrance ---------- */
.reveal{opacity:0;transform:translateY(10px);animation:rise .6s cubic-bezier(.2,.7,.3,1) forwards;}
.reveal.d1{animation-delay:.05s;}
.reveal.d2{animation-delay:.12s;}
@keyframes rise{to{opacity:1;transform:none;}}

/* ---------- Responsive ---------- */
/* ---------- Memory layer section ---------- */
/* Two columns: the argument on the left, real product output on the right.
   The .memo cards deliberately echo the app's own divergence box (amber) and
   screen blocks (navy hairline) so the landing page shows the actual thing. */
.memory-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:clamp(20px,3vw,38px);
  margin-top:clamp(22px,3vw,32px);align-items:start;}
.memory-copy p{color:var(--slate);font-size:16px;margin:0 0 14px;}
.memory-copy p:last-child{margin-bottom:0;}
.memory-copy strong{color:var(--ink);font-weight:600;}
.memo-stack{display:flex;flex-direction:column;gap:14px;}
.memo{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 20px;}
.memo .whr{display:block;font-family:var(--mono);font-size:10.5px;font-weight:600;
  letter-spacing:0.1em;text-transform:uppercase;color:var(--slate-2);margin-bottom:10px;}
.memo .said{display:block;font-size:14px;color:var(--slate-2);margin-bottom:6px;}
.memo .line{display:block;font-size:15.5px;color:var(--ink);line-height:1.55;}
.memo.diverge{background:var(--amber-soft);border-color:var(--amber-line);}
.memo.diverge .whr{color:var(--amber-ink);}
.memo.inject{border-left:3px solid var(--green);}

@media (max-width:900px){
  .memory-grid{grid-template-columns:1fr;}
  .trust{grid-template-columns:1fr;}
  .product-list{grid-template-columns:1fr;}
  .tiers{grid-template-columns:1fr;}
  .tier{border-right:none;border-bottom:1px solid var(--line);}
  .tier:last-child{border-bottom:none;}
  .example-grid{grid-template-columns:1fr;}
  .section-head{flex-direction:column;gap:6px;align-items:flex-start;}
  .nav-links a:not(.quote){display:none;}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal{animation:none;opacity:1;transform:none;}
  *{transition:none!important;}
}

/* Reduced motion: the hero demo video stays on its poster (paused via JS). */

:focus-visible{outline:2px solid var(--amber);outline-offset:2px;}

/* cache-bust 20260710 */