:root{
  --bg:#0a0e16;
  --bg-alt:#0d1420;
  --surface:#121a2a;
  --border:#223049;
  --text:#dbe3ee;
  --text-dim:#8c99b3;
  --heading:#f5f8fc;
  --accent:#22d3ee;
  --amber:#f5a524;
  --radius:12px;
  --container:1120px;
  --container-narrow:820px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1,h2,h3 { color: var(--heading); line-height:1.2; margin: 0 0 0.5em; }
p { margin: 0 0 1em; color: var(--text); }
ul { margin:0; padding:0; list-style:none; }

.container { max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.container.narrow { max-width: var(--container-narrow); }

.section { padding: 88px 0; scroll-margin-top: 84px; }
.section.alt { background: var(--bg-alt); }
.section-title { font-size: clamp(1.6rem, 2.4vw, 2.1rem); margin-bottom: 28px; }
.section-intro { color: var(--text-dim); margin-bottom: 24px; }
.section-footnote { color: var(--text-dim); font-size: 0.95rem; margin-top: 28px; }

.site-header {
  position: sticky; top:0; z-index: 50;
  background: rgba(10,14,22,0.85);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
.header-inner { display:flex; align-items:center; justify-content:space-between; height:68px; }
.wordmark { font-size:1.3rem; font-weight:700; color: var(--heading); letter-spacing:0.02em; }
.wordmark:hover { text-decoration:none; }
.nav { display:flex; gap:28px; }
.nav a { color: var(--text-dim); font-weight:500; font-size:0.95rem; }
.nav a:hover { color: var(--heading); text-decoration:none; }
.nav-toggle { display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px; }
.nav-toggle span { width:22px; height:2px; background: var(--heading); display:block; }

.hero {
  padding: 120px 0 96px;
  background:
    radial-gradient(60% 60% at 15% 0%, rgba(34,211,238,0.14), transparent 60%),
    radial-gradient(50% 50% at 100% 10%, rgba(245,165,36,0.08), transparent 60%);
}
.eyebrow { color: var(--accent); text-transform:uppercase; letter-spacing:0.12em; font-size:0.85rem; font-weight:600; margin-bottom:12px; }
.hero h1 { font-size: clamp(2.2rem, 5vw, 3.4rem); max-width: 780px; }
.hero .lede { font-size:1.15rem; color: var(--text-dim); max-width:640px; margin-top:18px; }

.badge-row { display:flex; flex-wrap:wrap; gap:10px; margin: 28px 0; }
.badge {
  display:inline-flex; align-items:center;
  padding:7px 14px; border-radius:999px;
  border:1px solid var(--border); background: var(--surface);
  font-size:0.82rem; color: var(--text-dim);
}
.badge-accent { border-color: rgba(245,165,36,0.5); color: var(--amber); background: rgba(245,165,36,0.08); }

.cta-row { display:flex; flex-wrap:wrap; gap:14px; margin-top:8px; }
.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:12px 22px; border-radius:8px; font-weight:600; font-size:0.95rem;
  transition: transform .15s ease, background .15s ease;
}
.btn:hover { text-decoration:none; transform: translateY(-1px); }
.btn-primary { background: var(--accent); color:#04222b; }
.btn-primary:hover { background:#5ce0f5; }
.btn-secondary { border:1px solid var(--border); color: var(--heading); }
.btn-secondary:hover { border-color: var(--accent); color: var(--accent); }

.fact-list { display:flex; flex-direction:column; border-top:1px solid var(--border); }
.fact-list li { display:flex; gap:24px; padding:16px 0; border-bottom:1px solid var(--border); }
.fact-label { flex:0 0 200px; color: var(--text-dim); font-weight:600; font-size:0.9rem; }

.callout { border-left:3px solid var(--accent); padding:14px 20px; background: var(--surface); border-radius:0 8px 8px 0; }
.equation {
  text-align:center; font-size:1.4rem; font-family: "Cambria Math", Cambria, Georgia, serif;
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius);
  padding: 22px; margin: 24px 0;
}
.check-list li { position:relative; padding:8px 0 8px 26px; border-bottom:1px solid var(--border); }
.check-list li:last-child { border-bottom:none; }
.check-list li::before { content:"—"; position:absolute; left:0; color: var(--accent); }

.disclaimer-box {
  background: var(--surface); border:1px solid var(--border); border-left:3px solid var(--amber);
  border-radius: 0 var(--radius) var(--radius) 0; padding:18px 22px; margin:20px 0; font-size:0.92rem; color: var(--text-dim);
}
.disclaimer-box strong { color: var(--heading); }

.table-wrap { overflow-x:auto; margin:24px 0; }
table { width:100%; border-collapse:collapse; font-size:0.95rem; }
th, td { text-align:left; padding:12px 16px; border-bottom:1px solid var(--border); }
th { color: var(--text-dim); font-weight:600; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.04em; }
tbody tr:hover { background: var(--surface); }

.grid { display:grid; gap:20px; margin-top:8px; }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.card { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding:26px; }
.card-index { color: var(--accent); font-weight:700; font-size:0.85rem; letter-spacing:0.08em; }
.team-card .role { color: var(--accent); font-weight:600; font-size:0.9rem; margin-bottom:12px; }
.linkedin-link { display:inline-block; margin-top:8px; font-weight:600; font-size:0.9rem; }

.contact-list li { display:flex; gap:24px; padding:14px 0; border-bottom:1px solid var(--border); }
.contact-list .fact-label { flex:0 0 120px; }

.site-footer { border-top:1px solid var(--border); padding:36px 0; background: var(--bg-alt); }
.site-footer p { color: var(--text-dim); font-size:0.85rem; text-align:center; margin:0; }

.reveal { opacity:0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 860px) {
  .grid-3 { grid-template-columns: 1fr; }
  .grid-2 { grid-template-columns: 1fr; }
  .fact-list li, .contact-list li { flex-direction:column; gap:4px; }
}
@media (max-width: 720px) {
  .nav { position:absolute; top:68px; left:0; right:0; background: var(--bg); flex-direction:column; gap:0; border-bottom:1px solid var(--border); display:none; }
  .nav.is-open { display:flex; }
  .nav a { padding:14px 24px; border-bottom:1px solid var(--border); }
  .nav-toggle { display:flex; }
}