/* ====== Base ====== */
:root{
  --bg:#000;
  --panel:#0b0b0b;
  --ink:#e7e7e7;
  --muted:#9b9b9b;
  --accent:#E02020;
  --radius:18px;
}
@font-face{
  font-family:'JetBrainsMonoCF';
  src:url('assets/jetbrains-mono.woff2') format('woff2');
  font-weight:400 800; font-style:normal; font-display:swap;
}
*{box-sizing:border-box}
html,body{height:100%;flex:1}
body{margin:0;background:var(--bg);color:var(--ink);font-family:JetBrainsMonoCF,ui-monospace,Consolas,Menlo,monospace}
a{color:#fff;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:24px 18px}
.nav{display:flex;justify-content:space-between;align-items:center;gap:12px}
.logo{font-size:22px;font-weight:900;letter-spacing:.3px}
.logo .accent{color:var(--accent);text-shadow:0 0 22px rgba(224,32,32,.4)}
.nav .btn{padding:10px 14px;border:1px solid #1b1b1b;background:#0a0a0a;border-radius:12px}
.nav .btn.primary{background:var(--accent);border-color:#b31818;box-shadow:0 0 32px rgba(224,32,32,.35);color:#fff}

.grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
@media (max-width:980px){.grid{grid-template-columns:1fr}}

.panel{background:linear-gradient(180deg,#0a0a0a,#050505);border:1px solid #141414;border-radius:var(--radius);box-shadow:0 10px 40px rgba(0,0,0,.45)}

.scan{position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.02),rgba(255,255,255,.02) 2px,transparent 2px,transparent 4px);mix-blend-mode:screen;animation:scan 6s linear infinite}
@keyframes scan{0%{transform:translateY(-10px)}100%{transform:translateY(10px)}}

/* ====== Terminal ====== */
.term{overflow:hidden}
.chrome{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid #101010;background:radial-gradient(120% 100% at 50% -10%, #111 0,#0b0b0b 60%, #070707 100%);border-top-left-radius:var(--radius);border-top-right-radius:var(--radius)}
.dots{display:flex;gap:8px}
.d{width:10px;height:10px;border-radius:50%;background:#222;box-shadow:inset 0 0 0 2px #000}
.d.red{background:#e0443e}.d.yellow{background:#ffbe2e}.d.green{background:#28c840}
.crumb{color:#bcbcbc}
.cluster{margin-left:auto}
.pill{display:inline-flex;gap:6px;align-items:center;border:1px solid #1e1e1e;background:#0b0b0b;padding:6px 10px;border-radius:999px;color:#cfcfcf;font-size:12px}
.term-body{padding:14px 16px 18px;min-height:260px}
.line{line-height:1.6}
.dim{color:#8d8d8d}
.hint{padding:8px 14px 16px;color:#8a8a8a;font-size:12px}

/* ====== Hero Copy ====== */
.hero-copy{padding:22px 20px}
.brand{font-weight:900;font-size:56px;letter-spacing:.5px;margin:10px 0 6px;display:inline-block;position:relative}
.brand:before,.brand:after{content:'';}
.brand:before{left:-1px;text-shadow:-2px 0 rgba(255,255,255,.1);clip-path:inset(0 0 70% 0);animation:g1 3.5s infinite}
.brand:after{left:1px;color:var(--accent);clip-path:inset(30% 0 0 0);mix-blend-mode:screen;animation:g2 3.5s infinite}
@keyframes g1{0%,100%{transform:translate(0,0)}15%{transform:translate(1px,-1px)}25%{transform:translate(-1px,1px)}45%{transform:translate(.5px,0)}65%{transform:translate(-.5px,.5px)}}
@keyframes g2{0%,100%{transform:translate(0,0)}12%{transform:translate(-1px,1px)}28%{transform:translate(1px,-1px)}40%{transform:translate(0,.5px)}60%{transform:translate(.5px,0)}}

.hero-copy h2{margin:6px 0 8px;font-size:28px}
.hero-copy p{color:#d0d0d0;opacity:.92}
.cta{display:flex;gap:10px;margin:12px 0 8px}
.btn{padding:10px 14px;border:1px solid #1b1b1b;background:#0a0a0a;border-radius:12px}
.btn.primary{background:var(--accent);border-color:#b31818;box-shadow:0 0 32px rgba(224,32,32,.35);color:#fff}
.badges{display:flex;gap:8px;list-style:none;padding:0;margin:10px 0 0}

/* ====== Cards / Docs ====== */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:10px}
@media (max-width:980px){.cards{grid-template-columns:1fr}}
.card{background:linear-gradient(180deg,#0b0b0b,#070707);border:1px solid #121212;border-radius:16px;padding:16px}
.card h3{margin:4px 0 10px;font-size:16px}
.card p{color:#cfcfcf}
.tags{margin-top:8px}

.docs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:18px;align-items:stretch}
.docs .doc{display:flex;flex-direction:column;height:100%;flex:1}
.docs pre{background:#0a0a0a;border:1px solid #151515;border-radius:12px;padding:14px;overflow:auto;min-height:200px;display:flex;flex-direction:column;height:100%;flex:1}
code{color:#ddd}

/* ====== Install ====== */
.install{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px;align-items:stretch}
@media (max-width:980px){.install{grid-template-columns:1fr}}
.install .panel{padding:16px;height:100%;flex:1}
.muted{color:var(--muted)}
.bullets{line-height:1.8}

/* ====== Footer ====== */
.footer{display:flex;justify-content:space-between;gap:12px;color:#8c8c8c;font-size:13px;padding:22px 18px 40px}

.brand .accent{color:var(--accent);text-shadow:0 0 22px rgba(224,32,32,.4)}