/* =============================================================
   Samuel Wolf — personal site
   Hand-coded, no build step, no dependencies.
   Sidebar (left) + content (right) layout; sidebar is sticky.
   Design tokens live in :root — change a value once there.
   ============================================================= */

:root{
  --bg:        #ffffff;
  --text:      #1a1a1a;
  --muted:     #6b7280;
  --border:    #e5e7eb;
  --link:      #1a5db0;   /* medium academic blue */
  --link-hover:#103e78;
  --sidebar-w: 300px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;
  line-height:1.6;
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
}

a{ color:var(--link); text-decoration:none; text-underline-offset:2px; }
a:hover{ color:var(--link-hover); text-decoration:underline; }
a:focus-visible{ outline:2px solid var(--link); outline-offset:2px; border-radius:2px; }

/* ---------- layout ---------- */
.layout{
  display:flex;
  align-items:flex-start;
  gap:3.5rem;
  max-width:1080px;
  margin:0 auto;
  padding:3.5rem 2rem;
}
.sidebar{
  flex:0 0 var(--sidebar-w);
  position:sticky;
  top:3.5rem;
}
.content{
  flex:1 1 auto;
  min-width:0;
  max-width:760px;
}

/* ---------- sidebar ---------- */
.name{ font-size:2rem; font-weight:700; letter-spacing:-.01em; margin:0 0 1.25rem; text-align:center; }
.headshot{
  display:block;
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:cover;
  border-radius:4px;
}
.bio{ margin:1.25rem 0; }

.contact{ list-style:none; margin:1.25rem 0 0; padding:0; font-size:.95rem; }
.contact li{ margin:.5rem 0; }
.contact-email,
.contact li > a{ display:inline-flex; align-items:center; gap:.55rem; }
.contact-email{ color:var(--muted); }
.contact li > a{ color:var(--text); }
.contact li > a:hover{ color:var(--link); text-decoration:none; }
.contact svg{ flex:0 0 auto; color:var(--muted); }

.sidebar-foot{ margin:2rem 0 0; color:var(--muted); font-size:.8rem; }

/* ---------- content ---------- */
.content h2{ font-size:1.4rem; font-weight:700; margin:0 0 1.25rem; }
.pubs + .pubs{ margin-top:2.5rem; padding-top:2.5rem; border-top:1px solid var(--border); }

.entry{ margin-bottom:1.6rem; }
.entry:last-child{ margin-bottom:0; }
.entry-title{ margin:0; }
.entry-meta{ margin:.15rem 0 0; color:var(--muted); font-size:.95rem; font-style:italic; }
.entry-links{ margin:.35rem 0 0; font-size:.92rem; }

/* abstract disclosure (native <details>, no JS) */
.abstract{ margin-top:.4rem; }
.abstract summary{
  cursor:pointer;
  color:var(--link);
  font-size:.95rem;
  list-style:none;
  display:inline-flex;
  align-items:baseline;
  gap:.35rem;
  width:max-content;
}
.abstract summary::-webkit-details-marker{ display:none; }
.abstract summary::before{ content:"+"; display:inline-block; width:.7em; text-align:center; }
.abstract[open] summary::before{ content:"\2212"; } /* minus sign */
.abstract summary:hover{ text-decoration:underline; }
.abstract > p{ margin:.5rem 0 0; color:var(--text); max-width:62ch; }

/* ---------- mobile ---------- */
@media (max-width:820px){
  .layout{ flex-direction:column; gap:2rem; padding:2rem 1.25rem; }
  .sidebar{ position:static; flex-basis:auto; width:100%; }
  .headshot{ max-width:240px; margin:0 auto; }
  .content{ max-width:none; }
}