/* Actual Science — shared design system.
   Single source of truth for tokens. Studio overrides map onto these. */

:root{
  color-scheme: dark;

  /* surfaces */
  --bg:#0A0C12;
  --bg-elev:#10131C;
  --bg-soft:rgba(19,21,29,.72);
  --border:#222838;
  --border-strong:#33405A;

  /* ink */
  --ink:#ECEDF2;
  --muted:#9AA0B0;
  --faint:#61697D;

  /* accent + semantics (aligned with Studio) */
  --accent:#E4A24A;
  --accent-hot:#FF7A35;
  --accent-rgb:228,162,74;
  --cyan:#62D9FF;
  --violet:#9B8CFF;
  --success:#83E2B7;
  --danger:#FF867B;
  --steel:rgba(122,152,192,.13);

  --radius:14px;
  --radius-lg:18px;
  --maxw:1080px;

  --mono:"Space Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:var(--accent);text-decoration:none;}
a:hover,a:focus-visible{text-decoration:underline;}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px;}

.wrap{
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:clamp(1.25rem,5vw,2.5rem);
}

/* ---------- Nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(10,12,18,.82);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:.85rem;}
.nav-brand{
  display:flex;align-items:center;gap:.6rem;
  font-family:var(--mono);font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;font-size:.82rem;color:var(--ink);
}
.nav-brand:hover{text-decoration:none;color:var(--accent);}
.nav-mark{width:15px;height:15px;flex:none;}
.nav-links{display:flex;gap:1.4rem;align-items:center;flex-wrap:wrap;}
.nav-links a{
  font-family:var(--mono);text-transform:uppercase;
  font-size:.7rem;letter-spacing:.13em;color:var(--muted);
}
.nav-links a:hover{color:var(--ink);text-decoration:none;}
.nav-links a[aria-current="page"]{color:var(--accent);}

/* ---------- Type ---------- */
.eyebrow{
  font-family:var(--mono);text-transform:uppercase;
  font-size:.72rem;letter-spacing:.22em;color:var(--accent);margin:0;
}
.eyebrow::before{
  content:"";display:inline-block;width:.5rem;height:.5rem;
  background:var(--accent);margin-right:.65rem;
  vertical-align:middle;transform:translateY(-1px);
}
.wordmark{
  font-family:var(--mono);font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;line-height:1.02;
  font-size:clamp(2.3rem,7.5vw,5.4rem);margin:.9rem 0 0;
}
.thesis{
  font-family:var(--mono);color:var(--ink);
  font-size:clamp(1.02rem,2.5vw,1.5rem);margin:1.4rem 0 0;
}
.lede{
  font-size:clamp(1rem,2vw,1.14rem);color:var(--muted);
  max-width:58ch;margin:1.25rem 0 0;
}
h2.section-title{
  font-size:clamp(1.5rem,3.6vw,2.1rem);font-weight:650;
  letter-spacing:-.01em;margin:.75rem 0 0;
}

/* ---------- Sections ---------- */
.section{padding-block:clamp(3.25rem,7vw,5.5rem);}
.section + .section{border-top:1px solid var(--border);}

/* ---------- Cards ---------- */
.cards{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:1.9rem;}
.card{
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:clamp(1.5rem,3vw,2.25rem);
  transition:border-color .25s ease;
  display:flex;flex-direction:column;
}
.card:hover{border-color:var(--border-strong);}
a.card:hover{text-decoration:none;}
.tag{
  font-family:var(--mono);text-transform:uppercase;
  font-size:.7rem;letter-spacing:.16em;color:var(--accent);margin:0;
}
.tag::before{
  content:"";display:inline-block;width:.42rem;height:.42rem;
  background:var(--accent);margin-right:.55rem;
  vertical-align:middle;transform:translateY(-1px);
}
.tag.is-live{color:var(--success);}
.tag.is-live::before{background:var(--success);}
.card-title{
  font-size:clamp(1.5rem,3.6vw,2.05rem);font-weight:650;
  color:var(--ink);margin:.7rem 0 0;letter-spacing:-.01em;
}
.card-desc{
  color:var(--muted);font-size:1.02rem;line-height:1.66;
  max-width:62ch;margin:1rem 0 0;
}
.card-more{
  font-family:var(--mono);font-size:.72rem;text-transform:uppercase;
  letter-spacing:.13em;color:var(--accent);margin-top:auto;padding-top:1.5rem;
}
.card-more::after{content:" \2192";}

/* ---------- Spec tables ---------- */
.spec{margin:1.6rem 0 0;}
.spec-row{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:1.5rem;padding-block:.55rem;border-top:1px solid var(--border);
}
.spec-row dt{
  font-family:var(--mono);text-transform:uppercase;font-size:.7rem;
  letter-spacing:.09em;color:var(--faint);margin:0;white-space:nowrap;
}
.spec-row dd{
  font-family:var(--mono);font-size:.8rem;color:var(--ink);
  margin:0;text-align:right;
}
.spec-row dd.ok{color:var(--success);}

/* ---------- Pull quote ---------- */
.pull{
  margin:1.6rem 0 0;color:var(--muted);
  border-left:2px solid var(--accent);
  padding-left:1.05rem;max-width:58ch;font-size:1.06rem;
}
.statement{
  font-size:clamp(1.15rem,3vw,1.6rem);color:var(--ink);
  font-weight:450;line-height:1.5;max-width:42ch;margin:1.6rem 0 0;
}

/* ---------- Publication list ---------- */
.pubs{list-style:none;margin:1.9rem 0 0;padding:0;}
.pubs li{padding-block:1.15rem;border-top:1px solid var(--border);}
.pub-venue{
  font-family:var(--mono);text-transform:uppercase;font-size:.68rem;
  letter-spacing:.14em;color:var(--faint);margin:0;
}
.pub-venue .state{color:var(--accent);}
.pub-venue .state.published{color:var(--success);}
.pub-title{font-size:1.06rem;color:var(--ink);margin:.4rem 0 0;max-width:64ch;line-height:1.5;}
.pub-doi{font-family:var(--mono);font-size:.76rem;margin:.4rem 0 0;}

/* ---------- Callout ---------- */
.note{
  border:1px solid var(--border);border-left:2px solid var(--cyan);
  background:var(--bg-elev);border-radius:0 var(--radius) var(--radius) 0;
  padding:1.15rem 1.35rem;margin-top:1.9rem;color:var(--muted);
  font-size:.96rem;max-width:66ch;
}
.note strong{color:var(--ink);font-weight:600;}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--border);padding-block:2.75rem;}
.footer-inner{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;}
.foot-name{
  font-family:var(--mono);text-transform:uppercase;letter-spacing:.12em;
  color:var(--ink);font-size:.9rem;margin:0;
}
.foot-meta{color:var(--muted);font-size:.9rem;margin:.35rem 0 0;}
.foot-links p{margin:.35rem 0 0;font-size:.9rem;}
.foot-copy{font-family:var(--mono);color:var(--faint);font-size:.78rem;margin:2.25rem 0 0;}

/* ---------- Responsive ---------- */
@media (max-width:760px){
  .cards{grid-template-columns:1fr;}
  .nav-inner{flex-direction:column;align-items:flex-start;gap:.6rem;}
  .nav-links{gap:1.1rem;}
  .spec-row{flex-direction:column;gap:.15rem;}
  .spec-row dd{text-align:left;}
}

/* ---------- Motion ---------- */
.fade-in{opacity:1;}
@media (prefers-reduced-motion: no-preference){
  .fade-in{opacity:0;transform:translateY(9px);animation:rise .8s ease forwards;}
  .fade-in:nth-child(2){animation-delay:.08s;}
  .fade-in:nth-child(3){animation-delay:.16s;}
  .fade-in:nth-child(4){animation-delay:.24s;}
}
@keyframes rise{to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;}}

/* ---------- Landing hero ---------- */
.hero{
  position:relative;overflow:hidden;min-height:86vh;
  display:flex;align-items:center;
  padding-block:clamp(4rem,10vh,7rem);
  border-bottom:1px solid var(--border);
}
#field{position:absolute;inset:0;width:100%;height:100%;z-index:0;}
.contour{fill:none;stroke:var(--steel);stroke-width:1;vector-effect:non-scaling-stroke;}
.crit{fill:var(--accent);opacity:.85;}
.crit-cross{stroke:var(--accent);stroke-width:1.4;vector-effect:non-scaling-stroke;opacity:.8;}
.hero-scrim{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(130% 100% at 45% 32%, transparent 0%, rgba(10,12,18,.15) 55%, rgba(10,12,18,.82) 100%),
    linear-gradient(180deg, rgba(10,12,18,.55) 0%, transparent 22%, transparent 70%, rgba(10,12,18,.9) 100%);
}
.hero-inner{position:relative;z-index:2;}

/* ---------- Featured full-width card ---------- */
a.feature{
  display:block;
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:clamp(1.5rem,3vw,2.25rem);
  margin-top:1.9rem;
  transition:border-color .25s ease;
}
a.feature:hover{border-color:var(--border-strong);text-decoration:none;}
.feature-head{display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;flex-wrap:wrap;}
.feature-specs{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:0 1.5rem;margin:1.5rem 0 0;
}
.feature-specs .spec-row{border-top:1px solid var(--border);}
@media (max-width:700px){
  .feature-specs{grid-template-columns:1fr;}
}