:root{
  --bg:#0b0f14;            /* page background */
  --ink:#e5e7eb;           /* main text */
  --muted:#9ca3af;         /* secondary text */
  --card:#0f172a;          /* cards */
  --border:#1f2937;        /* borders */
  --brand:#38bdf8;         /* link / highlight */
  --accent:#a78bfa;        /* secondary accent */
}

/* Base */
*{box-sizing:border-box}
html,body{
  margin:0;padding:0;
  background:var(--bg);
  color:var(--ink);
  font:16px/1.65 system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial,sans-serif;
}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}

/* Layout */
.wrap{max-width:1200px;margin:0 auto;padding:0 2rem}

/* Header */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(11,15,20,.92);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--border);
}
.site-footer{margin-top:3rem;padding:2rem 0;border-top:1px solid var(--border);color:var(--muted)}

/* Branding */
.brand{display:flex;gap:.9rem;align-items:center;padding:1.1rem 0}
.logo{
  width:44px;height:44px;border-radius:999px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand),var(--accent));
  color:#020617;font-weight:900;
}
.titleblock{display:flex;flex-direction:column}
.muted{color:var(--muted);font-size:.95rem}

/* Nav */
.nav{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center;padding-bottom:1.1rem}
.nav a{
  padding:.35rem .65rem;
  border-radius:999px;
  color:var(--muted);
  border:1px solid transparent;
  background:transparent;
}
.nav a:hover{
  color:var(--ink);
  border-color:var(--border);
  background:rgba(255,255,255,.03);
}

/* Type */
h1{font-size:clamp(2.6rem,5vw,4.2rem);margin:.6rem 0 1rem 0;line-height:1.08}
h2{font-size:2rem;margin:2rem 0 1rem}
h3{margin:1rem 0 .3rem}

/* Grids */
.grid{display:grid;gap:1.25rem}
.grid.cols-2{grid-template-columns:1fr}
@media(min-width:900px){.grid.cols-2{grid-template-columns:1.2fr .8fr}}

/* Cards */
.card{
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border:1px solid var(--border);
  border-radius:18px;
  padding:1.2rem;
  box-shadow:0 10px 40px rgba(0,0,0,.25);
}
.list{display:grid;gap:.8rem}

/* Pills */
.pill{
  display:inline-block;
  background:rgba(255,255,255,.03);
  border:1px solid var(--border);
  padding:.28rem .65rem;
  border-radius:999px;
  color:var(--muted);
}

/* Kicker */
.kicker{
  color:var(--brand);
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.72rem;
  font-weight:800;
}

/* HERO: full-screen feel */
.hero{
  padding:5rem 0 4rem;
  min-height:calc(100vh - 110px); /* fills screen under sticky header */
  display:flex;
  align-items:center;
  background:
    radial-gradient(900px 500px at 15% -10%, rgba(56,189,248,.14), transparent 60%),
    radial-gradient(900px 500px at 85% -10%, rgba(167,139,250,.14), transparent 60%),
    radial-gradient(1200px 700px at 50% 120%, rgba(255,255,255,.06), transparent 55%);
}

/* Footer row */
.footer-grid{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}

/* Publications */
.pub .title{font-weight:700}
.pub .meta{color:var(--muted);font-size:.95rem}

/* Search controls */
.searchbar{display:flex;gap:.6rem;flex-wrap:wrap;margin:.5rem 0}
input[type='search'],select{
  background:rgba(255,255,255,.03);
  border:1px solid var(--border);
  color:var(--ink);
  padding:.55rem .7rem;
  border-radius:.7rem;
  outline:none;
}
input[type='search']::placeholder{color:rgba(229,231,235,.55)}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  background:linear-gradient(135deg,var(--brand),var(--accent));
  color:#020617;border:none;border-radius:999px;
  padding:.65rem 1rem;font-weight:800;
}
.btn.ghost{
  background:rgba(255,255,255,.03);
  border:1px solid var(--border);
  color:var(--ink);
}
.btn.ghost:hover{background:rgba(255,255,255,.06)}

/* Images / gallery */
figure{margin:0}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.gallery img{
  width:100%;height:240px;object-fit:cover;
  border-radius:14px;border:1px solid var(--border);
  box-shadow:0 14px 40px rgba(0,0,0,.35);
}

/* Rule */
hr{border:none;border-top:1px solid var(--border);margin:1rem 0}
