/* Epistemologically — portal stylesheet.
   Reuses the shared Mendoza Lab site design system (established in
   immuneentropy / etiodynamics / fm-demixing-engine).
   Self-contained, Cloudflare-Pages-safe (no external fonts/CDN required). */
:root{
  --bg:#070a10; --panel:#0f141d; --panel2:#0c1119; --ink:#eaf0f7; --muted:#8893a5;
  --line:#1b2431; --blue:#5aa9ff; --purple:#b98cff; --teal:#5ad1c8; --warn:#ffcf6b;
  --good:#67d98c; --bad:#ff6b7d; --radius:16px;
  --mono:'SF Mono',ui-monospace,'Cascadia Code',Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Inter,Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;line-height:1.55}
a{color:var(--blue);text-decoration:none}
.wrap{max-width:1100px;margin:0 auto;padding:0 22px}
.grad{background:linear-gradient(95deg,var(--blue),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}

/* nav */
nav.site{position:sticky;top:0;z-index:40;border-bottom:1px solid var(--line);
  background:rgba(7,10,16,.72);backdrop-filter:blur(12px)}
.navin{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--blue),var(--purple));
  display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.brand h1{font-size:17px;margin:0;font-weight:680;letter-spacing:-.01em}
.brand p{font-size:11px;margin:0;color:var(--muted)}
.navlinks{display:flex;align-items:center;gap:20px;font-size:14px}
.navlinks a{color:var(--muted)} .navlinks a:hover,.navlinks a.active{color:var(--ink)}
.btn{padding:9px 16px;border-radius:10px;font-size:13.5px;font-weight:600;border:1px solid var(--line);
  background:var(--panel);color:var(--ink);cursor:pointer;display:inline-block}
.btn.primary{background:linear-gradient(135deg,var(--blue),var(--purple));border:0;color:#06101f}
.btn:hover{border-color:var(--teal)}
@media(max-width:760px){.navlinks a:not(.btn){display:none}}

/* hero */
header.hero{padding:68px 0 48px;border-bottom:1px solid var(--line);
  background:radial-gradient(1100px 460px at 75% -10%, rgba(185,140,255,.12), transparent 60%),
             radial-gradient(900px 420px at 10% 0%, rgba(90,169,255,.10), transparent 55%)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
h2.hh{font-size:clamp(30px,5vw,54px);line-height:1.05;margin:16px 0 18px;font-weight:700;letter-spacing:-.025em;max-width:20ch}
.lede{font-size:clamp(16px,2.2vw,20px);color:#c4cdda;max-width:720px}
.hero-cta{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.chips{margin-top:26px;display:flex;flex-wrap:wrap;gap:8px}
.chip{font-family:var(--mono);font-size:11.5px;padding:5px 11px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}

/* sections */
section{padding:54px 0;border-bottom:1px solid var(--line)}
.kicker{font-family:var(--mono);font-size:12px;color:var(--teal);letter-spacing:.1em;text-transform:uppercase}
.kicker.warn{color:var(--warn)}
h3.sh{font-size:clamp(22px,3vw,30px);margin:10px 0 8px;letter-spacing:-.01em}
.sub{color:var(--muted);max-width:740px;margin:0 0 28px}
p{color:#c4cdda;max-width:760px}
p.wide{max-width:64ch}

/* grids */
.grid{display:grid;gap:18px}
.g3{grid-template-columns:repeat(3,1fr)} .g2{grid-template-columns:1fr 1fr}
@media(max-width:840px){.g3,.g2{grid-template-columns:1fr}}

/* cards / tiles */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.card h4{font-size:17px;margin:2px 0 8px}
.card p{font-size:14px;color:#aeb9c8;max-width:none}
.tile{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;display:flex;flex-direction:column;min-height:200px;transition:border-color .15s,transform .15s}
a.tile{color:inherit}
.tile.live:hover{border-color:rgba(90,209,200,.55);transform:translateY(-2px)}
.tile .badge{position:absolute;top:18px;right:18px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;padding:4px 9px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.tile .badge.live{color:var(--good);border-color:rgba(103,217,140,.4);background:rgba(103,217,140,.07)}
.tile .badge.research{color:var(--blue);border-color:rgba(90,169,255,.35)}
.tile .badge.poc{color:var(--warn);border-color:rgba(255,207,107,.35);background:rgba(255,207,107,.06)}
.tile h4{font-size:18px;margin:6px 0 8px;max-width:80%}
.tile p{font-size:14px;color:#aeb9c8;flex:1;max-width:none}
.tile .go{font-family:var(--mono);font-size:13px;color:var(--muted);margin-top:14px}
.tile.dim{opacity:.82}
.tico{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  background:rgba(90,169,255,.12);margin-bottom:6px}
.tico.p{background:rgba(185,140,255,.14)} .tico.t{background:rgba(90,209,200,.14)}

/* method steps */
.mrow{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:840px){.mrow{grid-template-columns:1fr}}
.mcard{background:var(--panel2);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.mcard .n{font-family:var(--mono);font-size:13px;color:var(--teal)}
.mcard h4{margin:8px 0 6px;font-size:16px}
.mcard p{font-size:13.5px;color:#aeb9c8;max-width:none}

/* honest band */
.honest{background:linear-gradient(180deg,rgba(255,207,107,.05),transparent);border:1px solid rgba(255,207,107,.26);
  border-radius:var(--radius);padding:24px}
.honest h3{color:var(--warn);margin:0 0 8px;font-size:18px}
.flag{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.flag:last-child{border-bottom:0}
.flag .ic{flex:0 0 auto;font-family:var(--mono);font-size:11px;padding:3px 8px;border-radius:6px;height:fit-content}
.flag .ic.no{background:rgba(255,107,125,.14);color:var(--bad)}
.flag .ic.yes{background:rgba(103,217,140,.14);color:var(--good)}
.flag .tx{font-size:14px;color:#c8d2de} .flag .tx b{color:var(--ink)}

.note{font-family:var(--mono);font-size:12px;color:var(--muted);line-height:1.6;max-width:74ch}

/* footer */
footer.site{padding:44px 0 80px;color:var(--muted);font-size:13px}
footer.site p{color:var(--muted);max-width:820px}
footer.site .fl{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:16px;font-size:13px}
footer.site .fl a{color:var(--muted)} footer.site .fl a:hover{color:var(--ink)}