/* Base */
* { box-sizing: border-box; }
html, body { height: 100%; }
body{
  margin:0; color:var(--color-text); background:var(--color-bg);
  font: 400 var(--fs-md)/var(--lh) var(--font-mono);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{ max-width:100%; display:block; }
a{ color:var(--color-accent-turquoise); text-decoration:none; }
a:hover{ text-decoration:underline; }
.skip{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip:focus{ position:static; width:auto; height:auto; padding:var(--s-2); background:#000; }

.container{ width:var(--container); margin-inline:auto; }
.pad-vertical{ padding: var(--s-12) 0; }
section{ scroll-margin-top: 88px; }

/* Header with brand spacing */
.site-header{ position:sticky; top:0; z-index:50; background:linear-gradient(180deg,#0d0d0d,#0d0d0d80); backdrop-filter: blur(8px); border-bottom:1px solid var(--color-border); }
.site-header .container{ display:flex; align-items:center; gap:var(--s-6); padding: var(--s-4) 0; }
.brand .brand-mark{ height: var(--logo-h); }
.brand, .footer-brand{ margin: calc(0.5 * var(--logo-h)); padding-inline: calc(0.5 * var(--logo-h)); }

.nav-toggle{ display:none; background:none; border:1px solid var(--color-border); color:var(--color-text); border-radius:8px; padding:8px 10px; }
.site-nav ul{ display:flex; gap: var(--s-6); list-style:none; margin:0; padding:0; }
.site-nav a{ color:var(--color-text-2); }
.site-nav .btn-small{ padding:8px 12px; border-radius:8px; }
.is-active > a, a[aria-current="page"]{ color:#fff; }

@media (max-width:1024px){
  .nav-toggle{ display:block; }
  .site-nav{ display:none; }
  .site-nav.open{ display:block; position:absolute; left:0; right:0; top:100%; background:#0f0f0f; border-bottom:1px solid var(--color-border); }
  .site-nav ul{ flex-direction:column; gap:0; }
  .site-nav li{ border-top:1px solid var(--color-border); }
  .site-nav a{ display:block; padding:12px var(--s-4); }
}

/* Hero */
.hero{ position:relative; padding: var(--s-12) 0 var(--s-10); background: radial-gradient(1200px 600px at 15% 10%, rgba(44,63,147,0.15), transparent) , #0d0d0d; }
.hero-copy{ max-width:800px; }
.hero h1{ font-size: var(--fs-xxl); line-height: var(--lh-tight); margin: 0 0 var(--s-5); color:#fff; }
.subhead{ color: var(--color-text-2); margin: 0 0 var(--s-6); }
.cta-row{ display:flex; gap: var(--s-4); flex-wrap:wrap; }
.hero-watermark{ position:absolute; right:5%; top:10%; opacity:.06; width:min(38vw,520px); }

/* Stats */
.stats{ display:grid; grid-template-columns: repeat(3,1fr); gap: var(--s-6); padding: var(--s-10) 0; }
.stat{ background:#0f0f0f; border:1px solid var(--color-border); border-radius:12px; padding: var(--s-6); text-align:center; }
.stat-num{ color:#2c3f93; font-size:32px; font-weight:700; }
.stat-label{ color:var(--color-text-2); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
@media (max-width:640px){ .stats{ grid-template-columns:1fr; } }

/* Grid & cards */
.section-title{ color:#fff; font-size: var(--fs-xl); margin-bottom: var(--s-6); }
.grid{ display:grid; gap: var(--s-6); }
.grid-2{ grid-template-columns: 1.2fr .8fr; gap: var(--s-8); }
@media (max-width:1024px){ .grid-2{ grid-template-columns:1fr; } }

.cards{ grid-template-columns: repeat(2,minmax(0,1fr)); }
@media (min-width:1025px){ .cards{ grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width:640px){ .cards{ grid-template-columns: 1fr; } }

.card{
  background: #121212; border:1px solid var(--color-border);
  border-radius:12px; padding: var(--s-6); transition: border-color .15s ease, transform .15s ease;
}
.card:hover{ border-color: var(--color-accent-purple); transform: translateY(-2px); }
.card h3, .area-title{ color: var(--color-primary); margin:0 0 var(--s-3); }
.card .underline{ display:block; width:64px; height:3px; background: var(--color-accent-turquoise); opacity:.9; }

/* Bio card */
.bio-card{ display:grid; grid-template-columns: 112px 1fr; gap: var(--s-4); align-items:center; }
.avatar{ width:112px; height:112px; border-radius:999px; object-fit:cover; }

/* Buttons */
.btn{ display:inline-block; border:1px solid transparent; padding:12px 16px; border-radius:10px; font-weight:600; color:#fff; background:transparent; }
.btn-primary{ background: var(--color-primary); }
.btn-primary:hover{ background: linear-gradient(0deg,#2c3f93,#3146a8); }
.btn-secondary{ color: var(--color-accent-turquoise); border-color: var(--color-accent-turquoise); }
.btn-secondary:hover{ background: rgba(0,188,212,.12); }
.btn:focus{ outline: none; box-shadow: var(--focus); }

/* Inputs & forms */
.input, textarea.input, select.input{
  width:100%; background:#131313; color:#fff; border:1px solid var(--color-border);
  border-radius:10px; padding:12px; font: 400 var(--fs-md)/var(--lh) var(--font-mono);
}
.input::placeholder{ color:#c9c9c9; }
.input:focus{ outline:none; box-shadow:var(--focus); border-color:var(--color-accent-turquoise); }
.form{ display:grid; gap: var(--s-5); max-width:720px; }

/* Publications & Data */
.filter{ display:grid; gap: var(--s-4); grid-template-columns: 1fr 200px 160px; margin-bottom: var(--s-6); }
@media (max-width:640px){ .filter{ grid-template-columns:1fr; } }

.pub-list{ display:grid; gap: var(--s-4); }
.pub-item{ background:#101010; border:1px solid var(--color-border); border-radius:12px; padding: var(--s-5); display:grid; gap: var(--s-3); }
.pub-item h3{ margin:0; color:#fff; }
.meta{ color: var(--color-text-2); font-size: var(--fs-sm); display:flex; gap: var(--s-3); flex-wrap:wrap; }
.tag{ background: var(--color-accent-turquoise); color:#0a0a0a; border-radius:999px; padding:2px 10px; font-size:12px; }
.dl{ margin-left:auto; color: var(--color-accent-purple); }

/* Skeleton loader */
.skeleton .pub-item,
.skeleton::before{
  position:relative; overflow:hidden;
  background: linear-gradient(90deg, #101010 25%, #141414 37%, #101010 63%);
  background-size: 400% 100%; animation: shimmer 1s infinite linear;
}
@keyframes shimmer{ 0%{background-position:0 0} 100%{background-position: -135% 0} }

/* Tours */
.tour{ position:relative; overflow:hidden; padding:0; }
.tour-thumb{ height:160px; background: linear-gradient(180deg,#0f0f0f,#0b0b0b); border-bottom:1px solid var(--color-border); }
.tour-meta{ display:flex; align-items:center; gap: var(--s-4); padding: var(--s-5); }
.stat-circle{ width:42px; height:42px; border-radius:999px; background: var(--color-accent-turquoise); color:#0a0a0a; display:grid; place-items:center; font-weight:700; }

/* Logo wall */
.logo-wall{ display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--s-6); }
.logo-item{ background:#111; border:1px solid var(--color-border); border-radius:12px; padding: var(--s-6); filter: grayscale(1); transition: box-shadow .15s ease; }
.logo-item:hover{ box-shadow: 0 0 0 3px rgba(0,188,212,.25) inset; }

/* Footer */
.site-footer{ margin-top: var(--s-12); border-top:1px solid var(--color-border); background:#0f0f0f; }
.site-footer .container{ display:flex; align-items:center; justify-content:space-between; gap: var(--s-6); padding: var(--s-6) 0; }
.footer-nav{ list-style:none; display:flex; gap: var(--s-6); margin:0; padding:0; }
.legal{ color:var(--color-text-2); font-size:12px; }