:root {
  --paper:#f8f7f3;
  --ink:#242c29;
  --muted:#647069;
  --green:#345c4b;
  --line:#dcded6;
  --tint:#edf0e8
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:30px
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.75 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased
}
a {
  color:inherit;
  text-decoration:none
}
a:hover {
  color:var(--green)
}
a:focus-visible,summary:focus-visible {
  outline:2px solid var(--green);
  outline-offset:6px
}
::selection {
  background:#d7e4d6
}
.shell {
  max-width:1180px;
  margin:auto;
  padding-inline:48px
}
.site-header {
  height:112px;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.wordmark {
  font:700 30px Georgia,serif;
  letter-spacing:-2px
}
.wordmark span {
  color:var(--green)
}
nav {
  display:flex;
  gap:34px;
  font-size:13px
}
nav a {
  padding:7px 0
}
nav a[aria-current] {
  border-bottom:1px solid var(--green)
}
.hero {
  display:grid;
  grid-template-columns:1fr 310px;
  gap:72px;
  align-items:center;
  padding:65px 0 72px
}
.eyebrow {
  text-transform:uppercase;
  letter-spacing:1.9px;
  font-size:10px;
  font-weight:650;
  color:var(--muted);
  margin:0 0 20px
}
.status-dot {
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--green);
  margin-right:7px;
  vertical-align:1px
}
h1,h2,h3,p {
  margin-top:0
}
h1 {
  font:normal clamp(54px,6vw,78px)/1.1 Georgia,"Times New Roman",serif;
  letter-spacing:-3.6px;
  margin-bottom:23px
}
.name-period {
  color:var(--green)
}
.hero-statement {
  font:normal 33px/1.35 Georgia,serif;
  letter-spacing:-.6px;
  margin-bottom:22px
}
.hero-statement em {
  color:var(--green);
  font-weight:normal
}
.hero-description {
  font-size: 17px;
  line-height:1.9;
  color:var(--muted);
  max-width:485px;
  margin-bottom:30px
}
.social-links {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:22px;
  font-size:12px
}
.social-links a {
  white-space:nowrap
}
.button {
  background:var(--green);
  color:#fff;
  padding:11px 17px;
  display:inline-flex;
  gap:20px;
  border:1px solid var(--green)
}
.button:hover {
  background:#244635;
  color:#fff
}
.portrait {
  margin:0;
  position:relative;
  padding:0 13px 13px 0
}
.portrait:after {
  content:"";
  position:absolute;
  inset:16px 0 0 16px;
  border:1px solid #a9b5a5;
  z-index:-1
}
.portrait img {
  width:100%;
  height:355px;
  display:block;
  object-fit:cover;
  object-position:50% 56%;
  filter:saturate(.7)
}
.affiliations {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 0;
  border-block:1px solid var(--line);
  font:18px Georgia,serif
}
.affiliations .eyebrow {
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
.affiliations a span {
  font:12px sans-serif;
  color:var(--muted);
  margin-left:13px
}
.section-grid {
  display:grid;
  grid-template-columns:310px 1fr;
  gap:72px;
  padding:76px 0;
  border-bottom:1px solid var(--line)
}
h2 {
  font:normal 31px/1.3 Georgia,serif;
  letter-spacing:-.65px;
  margin-bottom:0
}
.section-heading .eyebrow,.section-top .eyebrow {
  margin-bottom:15px
}
.prose {
  font-size: 16px;
  color:#505c55;
  line-height:1.95
}
.prose p {
  margin-bottom:19px
}
.prose a,.news-list a {
  color:var(--green);
  text-decoration:underline;
  text-decoration-color:#b4c3b4;
  text-underline-offset:3px
}
.background {
  border-top:1px solid var(--line);
  margin-top:26px;
  padding-top:18px;
  font-size: 14px
}
.background summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  color:var(--green)
}
.background summary::-webkit-details-marker {
  display:none
}
.background[open] summary {
  margin-bottom:16px
}
.background[open] summary span {
  transform:rotate(45deg)
}
.background p {
  margin:0
}
.research-section {
  padding:65px 0
}
.section-top {
  display:flex;
  justify-content:space-between;
  align-items:end;
  margin-bottom:32px;
  gap:24px
}
.research-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  background:var(--tint);
  border:1px solid #e0e5da
}
.research-grid article {
  padding:27px 25px 25px
}
.research-grid article+article {
  border-left:1px solid #d5ddce
}
.research-number {
  font:12px Georgia,serif;
  color:#6b8169
}
.research-grid h3 {
  font:20px/1.3 Georgia,serif;
  margin:22px 0 14px
}
.research-grid p {
  font-size: 15px;
  color:#5b675c;
  line-height:1.85;
  margin-bottom:23px
}
.topic {
  display:block;
  font-size: 12px;
  color:var(--green)
}
.selected-work {
  padding:6px 0 70px;
  border-bottom:1px solid var(--line)
}
.text-link {
  font-size:12px;
  white-space:nowrap;
  color:var(--green)
}
.text-link span {
  margin-left:12px
}
.paper-row {
  display:grid;
  grid-template-columns:145px 1fr 20px;
  gap:25px;
  border-top:1px solid var(--line);
  padding:26px 0;
  transition:background .2s
}
.paper-row:hover {
  background:var(--tint)
}
.paper-venue {
  font-size:11px;
  color:var(--green);
  line-height:1.7
}
.paper-venue span {
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-top:4px
}
.paper-row h3 {
  font:20px/1.4 Georgia,serif;
  margin:0 0 9px
}
.paper-row p {
  font-size: 14px;
  color:var(--muted);
  margin:0
}
.paper-row>span:last-child {
  color:var(--green)
}
.news-section {
  padding-block:65px
}
.news-list ul {
  list-style:none;
  margin:0;
  padding:0
}
.news-list li {
  font-size: 15px;
  color:#505c55;
  padding:0 0 19px 19px;
  position:relative;
  border-left:1px solid var(--line)
}
.news-list li:before {
  content:"";
  width:5px;
  height:5px;
  background:#8b9c86;
  position:absolute;
  top:9px;
  left:-3px;
  border-radius:50%
}
.news-list li:last-child {
  padding-bottom:0
}
.news-list strong {
  font-size: 13px;
  color:var(--green)
}
.contact-strip {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:50px 0;
  gap:25px
}
.contact-strip .eyebrow {
  margin-bottom:12px
}
.contact-strip h2 {
  font-size:26px
}
.contact-strip>a {
  font-size:14px;
  color:var(--green);
  border-bottom:1px solid #a7b6a1;
  padding-bottom:6px
}
.contact-strip>a span {
  margin-left:16px
}
.site-footer {
  border-top:1px solid var(--line);
  padding-block:24px 36px;
  display:flex;
  justify-content:space-between;
  gap:16px;
  font-size:10px;
  color:var(--muted)
}
.skip-link {
  position:fixed;
  top:-100px;
  left:20px;
  background:var(--green);
  color:white;
  padding:12px;
  z-index:10
}
.skip-link:focus {
  top:10px
}
.publication-page {
  padding-top:65px;
  padding-bottom:65px
}
.publication-page h1 {
  font-size:62px
}
.publication-intro {
  color:var(--muted);
  font-size:15px;
  max-width:650px;
  margin:20px 0 45px
}
.publication-intro a {
  display:block;
  color:var(--green);
  font-size:12px;
  margin-top:15px
}
.publication-page>ul {
  list-style:none;
  padding:0;
  counter-reset:papers
}
.publication-page>ul>li {
  position:relative;
  padding:27px 0 27px 55px;
  border-top:1px solid var(--line);
  font-size: 16px;
  line-height:1.9
}
.publication-page>ul>li:before {
  counter-increment:papers;
  content:counter(papers,decimal-leading-zero);
  position:absolute;
  left:0;
  top:30px;
  color:var(--green);
  font:13px Georgia,serif
}
.publication-page li::first-line {
  font-size:18px;
  color:var(--ink)
}
.publication-page li a {
  color:var(--green);
  border-bottom:1px solid #a7b6a1;
  margin-left:6px;
  font-size: 14px
}
.publication-page ins {
  text-decoration:none;
  font-weight:650
}
.publication-page li strong {
  font-weight:600;
  color:var(--green)
}

@media(min-width:1400px) {
  .hero {
    padding-top:85px;
    padding-bottom:85px
  }

}

@media(max-width:1000px) {
  .shell {
    padding-inline:32px
  }
  .hero {
    gap:40px;
    grid-template-columns:1fr 270px
  }
  .hero-statement {
    font-size:29px
  }
  .social-links {
    gap:15px
  }
  .section-grid {
    grid-template-columns:240px 1fr;
    gap:40px
  }
  .research-grid article {
    padding:23px 19px
  }
  .topic {
    font-size: 12px
  }

}

@media(max-width:740px) {
  .shell {
    padding-inline:24px
  }
  .site-header {
    height:86px
  }
  nav {
    gap:23px;
    font-size:12px
  }
  .hero {
    padding:35px 0 40px;
    grid-template-columns:1fr;
    gap:34px
  }
  .hero h1 {
    font-size:clamp(42px,12vw,58px);
    letter-spacing:-2px
  }
  .hero-statement {
    font-size:30px
  }
  .hero-description {
    max-width:none
  }
  .portrait {
    width:220px;
    max-width:100%;
    padding:0 10px 10px 0
  }
  .portrait img {
    height:250px;
    object-position:50% 53%
  }
  .affiliations {
    flex-wrap:wrap;
    gap:20px;
    font-size:16px
  }
  .affiliations .eyebrow {
    width:100%;
    font-size:9px
  }
  .section-grid {
    grid-template-columns:1fr;
    gap:28px;
    padding:45px 0
  }
  .section-heading h2 br {
    display:none
  }
  h2 {
    font-size:28px
  }
  .research-section {
    padding:44px 0
  }
  .research-grid {
    grid-template-columns:1fr
  }
  .research-grid article {
    padding:23px
  }
  .research-grid article+article {
    border-left:0;
    border-top:1px solid #d5ddce
  }
  .research-grid h3 {
    margin-top:12px
  }
  .research-grid p {
    margin-bottom:15px
  }
  .topic {
    font-size: 12px
  }
  .section-top {
    align-items:start
  }
  .paper-row {
    grid-template-columns:1fr 20px;
    gap:9px 15px
  }
  .paper-venue {
    grid-column:1/-1
  }
  .paper-venue span {
    display:inline;
    margin-left:12px
  }
  .paper-row h3 {
    font-size:19px
  }
  .selected-work {
    padding-bottom:35px
  }
  .contact-strip {
    align-items:start;
    flex-direction:column;
    padding-block:36px
  }
  .site-footer {
    flex-wrap:wrap;
    font-size:9px
  }
  .site-footer span:nth-child(2) {
    display:none
  }
  .publication-page {
    padding-top:35px
  }
  .publication-page h1 {
    font-size:49px
  }
  .publication-page>ul>li {
    padding-left:34px;
    font-size: 16px
  }
  .publication-page li::first-line {
    font-size:17px
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  * {
    transition:none!important
  }

}

.internship-experience {
  border-top: 1px solid var(--line);
  margin-top: 28px;
  padding-top: 24px;
}
.internship-experience .eyebrow { margin-bottom: 12px; }
.internship-experience h3 {
  font: 22px/1.4 Georgia, serif;
  margin-bottom: 5px;
}
.internship-experience h3 a { text-decoration: none; }
.internship-experience .experience-role {
  font-size: 14px;
  color: var(--green);
  margin-bottom: 12px;
}

.contact-strip > .button {
  color: #fff;
  font-size: 12px;
  padding: 11px 17px;
  border: 1px solid var(--green);
}
.contact-strip > .button span { margin-left: 0; }
