:root {
  --paper: #f3f2ee;
  --paper-deep: #e7e4dc;
  --ink: #171715;
  --muted: #68665f;
  --gray: #7c7972;
  --blue: #e2e6ef;
  --red: #f2442e;
  --white: #fff;
  --rule: rgba(23, 23, 21, .2);
  --rule-dark: rgba(255, 255, 255, .24);
  --pad: clamp(1.25rem, 3.2vw, 4rem);
  --display: "Arial Narrow", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --body: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { max-width: 100%; overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: 84px; }
body { background: var(--paper); color: var(--ink); font-family: var(--body); margin: 0; max-width: 100%; overflow-x: clip; -webkit-font-smoothing: antialiased; }
body.nav-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input { color: inherit; font: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--red); color: var(--white); }
.skip-link { background: var(--white); left: 1rem; padding: .75rem 1rem; position: fixed; top: -5rem; z-index: 500; }
.skip-link:focus { top: 1rem; }
.scroll-progress { background: var(--red); height: 4px; left: 0; position: fixed; top: 0; transform: scaleX(0); transform-origin: left; width: 100%; z-index: 300; }

.site-header { align-items: stretch; background: rgba(243,242,238,.97); border-bottom: 1px solid var(--ink); display: grid; grid-template-columns: minmax(16rem, 1fr) auto; min-height: 84px; position: sticky; top: 0; z-index: 200; }
.identity { align-items: center; display: inline-flex; gap: .9rem; padding: .75rem var(--pad); width: max-content; }
.monogram { display: grid; grid-template-columns: repeat(2, 1.62rem); height: 2.9rem; position: relative; width: 3.4rem; }
.monogram::before { background: var(--red); content: ""; height: .7rem; left: 1.28rem; position: absolute; top: 1.05rem; width: .7rem; }
.monogram i { border-left: 5px solid var(--ink); border-top: 5px solid var(--ink); font-size: 0; height: 2.2rem; transform: skew(-4deg); width: 1.55rem; }
.monogram i:last-child { align-self: end; border-bottom: 5px solid var(--ink); border-left: 0; border-right: 5px solid var(--ink); border-top: 0; justify-self: end; }
.identity-name { font-size: 1rem; font-weight: 850; letter-spacing: .02em; line-height: 1; }
.identity-name small { color: var(--muted); display: block; font-size: .62rem; font-weight: 650; letter-spacing: .09em; margin-top: .38rem; text-transform: uppercase; }
.site-nav { display: flex; }
.site-nav a { align-items: center; border-left: 1px solid var(--ink); display: flex; font-size: .72rem; font-weight: 800; letter-spacing: .055em; padding: 0 clamp(.8rem, 1.4vw, 1.4rem); text-transform: uppercase; transition: background .2s, color .2s; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a.active { background: var(--ink); color: var(--white); outline: 0; }
.menu-toggle { display: none; }

.hero { border-bottom: 1px solid var(--ink); display: grid; grid-template-columns: minmax(0, 1fr) minmax(24rem, 32rem); min-height: clamp(42rem, 78vh, 50rem); }
.hero-copy { display: flex; flex-direction: column; padding: clamp(2.5rem, 5vw, 5rem) var(--pad) 2rem; }
.eyebrow { font-size: .78rem; font-weight: 800; letter-spacing: .1em; line-height: 1.45; margin: 0; text-transform: uppercase; }
.hero h1 { font-family: var(--display); font-size: clamp(5.2rem, 10vw, 11.8rem); font-stretch: condensed; font-weight: 850; letter-spacing: -.072em; line-height: .77; margin: auto 0; text-transform: uppercase; }
.hero h1 span { color: var(--gray); display: block; }
.hero h1 strong { display: block; font-weight: inherit; }
.hero-statement { align-items: end; border-top: 1px solid var(--ink); display: grid; gap: 2rem; grid-template-columns: 1fr auto; padding-top: 1rem; }
.hero-statement p { font-family: var(--display); font-size: clamp(1.8rem, 3.2vw, 3.8rem); font-weight: 760; letter-spacing: -.055em; line-height: .93; margin: 0; max-width: 42rem; text-transform: uppercase; }
.hero-statement em, .research-heading em, .contact em { color: var(--red); font-family: Georgia, "Times New Roman", serif; font-weight: 400; text-transform: none; }
.hero-statement a { font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.hero-statement a span { color: var(--red); font-size: 1.2rem; margin-left: .6rem; }
.hero-profile { align-items: stretch; background: #d9d7d0; display: grid; overflow: hidden; padding: clamp(1rem, 1.6vw, 1.5rem) clamp(1rem, 1.6vw, 1.5rem) 0; position: relative; }
.hero-profile::before { background: var(--red); content: ""; inset: 0 auto 0 0; position: absolute; width: clamp(.5rem, .8vw, .85rem); }
.hero-profile figure { align-content: center; display: grid; grid-template-rows: auto auto; height: 100%; margin: 0; min-height: 0; position: relative; z-index: 1; }
.portrait-toggle { appearance: none; aspect-ratio: 1146 / 1600; background: #d9d7d0; border: 0; cursor: pointer; min-height: 0; overflow: hidden; padding: 0; position: relative; width: 100%; }
.portrait-toggle img { height: 100%; inset: 0; margin: 0; position: absolute; transition: opacity .32s ease, transform .55s cubic-bezier(.16,1,.3,1); width: 100%; }
.portrait-primary { filter: saturate(.78) contrast(.98); object-fit: cover; object-position: center 18%; }
.portrait-alternate { background: transparent; clip-path: inset(.8% round 4.6%); object-fit: contain; opacity: 0; transform: scale(.985); }
.portrait-toggle.is-alternate .portrait-primary { opacity: 0; transform: scale(1.012); }
.portrait-toggle.is-alternate .portrait-alternate { opacity: 1; transform: none; }
.portrait-toggle:focus-visible { outline: 3px solid var(--red); outline-offset: -3px; }
.hero-profile figcaption { align-items: center; background: var(--red); color: var(--white); display: flex; font-size: .68rem; font-weight: 800; gap: 1rem; justify-content: space-between; letter-spacing: .06em; padding: .85rem 1rem; text-transform: uppercase; }

.section { border-bottom: 1px solid var(--ink); padding: 0 var(--pad) clamp(5rem, 9vw, 9rem); }
.section-label { display: block; font-size: .76rem; font-weight: 850; letter-spacing: .1em; margin: 0; padding: 1.15rem 0 .75rem; position: relative; text-transform: uppercase; width: max-content; }
.section-label::after { background: currentColor; bottom: 0; content: ""; height: 1px; left: 0; opacity: .68; position: absolute; width: 100%; }
.section-dark { background: var(--ink); color: var(--white); }
.section-label-dark { color: var(--white); }

.intro-grid { align-items: end; display: grid; gap: clamp(3rem, 8vw, 10rem); grid-template-columns: 1.25fr 1fr; padding: clamp(4rem, 8vw, 8rem) 0 0; }
.intro-grid > *, .research-heading > *, .publication-controls > *, .contact > * { min-width: 0; }
.intro h2 { font-family: var(--display); font-size: clamp(3.7rem, 7.4vw, 8.7rem); font-stretch: condensed; font-weight: 850; letter-spacing: -.066em; line-height: .84; margin: 0; text-transform: uppercase; }
.intro h2 span { color: var(--gray); display: block; }
.intro-copy p { font-size: clamp(1rem, 1.35vw, 1.22rem); line-height: 1.5; margin: 0 0 1.35rem; }
.intro-copy .lead { font-size: clamp(1.3rem, 2vw, 2rem); font-weight: 720; letter-spacing: -.03em; line-height: 1.16; }
.intro-copy a { border-bottom: 2px solid var(--red); }
.personal-life { margin: clamp(4rem, 8vw, 8rem) auto 0; max-width: 100rem; }
.personal-notes { color: var(--white); height: clamp(32rem, 44vw, 44rem); overflow: hidden; position: relative; }
.personal-notes::after { background: linear-gradient(90deg, rgba(16,16,15,.9) 0%, rgba(16,16,15,.68) 58%, rgba(16,16,15,.16) 100%); content: ""; inset: 0; position: absolute; }
.personal-notes > img { height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; }
.personal-notes-copy { align-content: end; display: grid; inset: 0; max-width: 45rem; padding: clamp(1.4rem, 3vw, 3rem); position: absolute; z-index: 1; }
.personal-kicker { color: #ff7161; font-size: .72rem; font-weight: 850; letter-spacing: .1em; margin: 0 0 auto; text-transform: uppercase; }
.personal-notes-copy h3 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.35rem, 4vw, 4.9rem); font-weight: 400; letter-spacing: -.045em; line-height: .98; margin: 0 0 2rem; max-width: 42rem; }
.personal-notes-copy p { color: rgba(255,255,255,.84); font-size: clamp(.95rem, 1.12vw, 1.08rem); line-height: 1.55; margin: 0 0 1rem; max-width: 42rem; }
.life-gallery { display: grid; gap: .8rem; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: clamp(20rem, 27vw, 26rem) clamp(12rem, 18vw, 18rem); margin-top: .8rem; }
.life-gallery-column { display: contents; }
.life-photo { appearance: none; backface-visibility: hidden; background: var(--paper-deep); border: 0; cursor: pointer; display: block; margin: 0; overflow: hidden; padding: 0; position: relative; text-align: left; width: 100%; }
.life-photo-captain { grid-column: span 3; }
.life-photo-cat { grid-column: span 4; }
.life-photo-city { grid-column: span 5; }
.life-photo:not(.life-photo-captain, .life-photo-cat, .life-photo-city) { grid-column: span 4; }
.life-photo img { filter: saturate(.45) contrast(.9) brightness(1.07); height: 100%; object-fit: cover; opacity: .88; transition: filter .45s ease, opacity .45s ease, transform .65s cubic-bezier(.16,1,.3,1); width: 100%; }
.life-photo-captain img { object-position: center 42%; }
.life-photo:hover img { filter: saturate(.72) contrast(.96) brightness(1.03); }
.life-photo.is-lit img { filter: saturate(1.05) contrast(1.01) brightness(1); opacity: 1; transform: scale(1.012); }
.life-photo span { background: rgba(23,23,21,.82); bottom: .7rem; color: var(--white); display: grid; gap: .2rem; left: .7rem; padding: .55rem .65rem; position: absolute; text-transform: uppercase; }
.life-photo strong { font-size: .66rem; font-weight: 820; letter-spacing: .07em; }
.life-photo small { color: rgba(255,255,255,.72); font-size: .58rem; font-weight: 720; letter-spacing: .06em; }
.life-photo:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }

.research-heading { align-items: end; display: grid; gap: clamp(3rem, 7vw, 8rem); grid-template-columns: 1.5fr 1fr; padding: clamp(4rem, 8vw, 8rem) 0 clamp(3rem, 5vw, 5rem); }
.research-heading h2 { font-family: var(--display); font-size: clamp(4rem, 8vw, 9.6rem); font-stretch: condensed; font-weight: 850; letter-spacing: -.072em; line-height: .82; margin: 0; text-transform: uppercase; }
.research-heading p { color: rgba(255,255,255,.68); font-size: clamp(1rem, 1.4vw, 1.28rem); line-height: 1.5; margin: 0; }
.research-themes { display: grid; gap: 1px; grid-template-columns: repeat(3, 1fr); }
.research-themes article { background: rgba(255,255,255,.055); display: flex; flex-direction: column; min-height: 25rem; padding: clamp(1.2rem, 2vw, 2rem); }
.research-themes article > span { color: var(--red); font-size: .74rem; font-weight: 850; letter-spacing: .1em; }
.research-themes h3 { font-family: var(--display); font-size: clamp(2.2rem, 3.5vw, 4.5rem); font-weight: 820; letter-spacing: -.06em; line-height: .9; margin: auto 0 1.2rem; text-transform: uppercase; }
.research-themes p { color: rgba(255,255,255,.68); font-size: .95rem; line-height: 1.48; margin: 0; max-width: 28rem; }
.research-loop { align-items: end; display: grid; gap: 3rem; grid-template-columns: minmax(12rem, .5fr) 2fr; padding: 3rem 0 0; }
.research-loop p { font-size: clamp(1.35rem, 1.65vw, 1.75rem); font-weight: 850; letter-spacing: .055em; margin: 0; text-transform: uppercase; }
.research-loop ol { display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; margin: 0; padding: 0; }
.research-loop li { border-top: 1px solid rgba(255,255,255,.42); font-size: clamp(1.25rem, 1.55vw, 1.62rem); font-weight: 800; line-height: 1.18; padding: 1rem .5rem 0 0; text-transform: uppercase; }
.research-loop li + li { padding-left: .85rem; }

.work-list { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); padding-top: clamp(3rem, 6vw, 6rem); }
.selected-paper { background: var(--white); display: flex; flex-direction: column; min-height: 21rem; padding: clamp(1.25rem, 2.2vw, 2.2rem); }
.selected-paper > p { color: var(--red); font-size: .7rem; font-weight: 850; letter-spacing: .09em; margin: 0; text-transform: uppercase; }
.selected-paper h3 { font-family: var(--display); font-size: clamp(1.7rem, 2.55vw, 3.2rem); font-weight: 790; letter-spacing: -.05em; line-height: 1; margin: auto 0 2.2rem; }
.selected-paper h3 a { background-image: linear-gradient(var(--red), var(--red)); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 2px; transition: background-size .25s ease; }
.selected-paper h3 a:hover, .selected-paper h3 a:focus-visible { background-size: 100% 2px; outline: 0; }
.selected-paper footer { align-items: end; border-top: 1px solid var(--rule); color: var(--muted); display: flex; font-size: .78rem; gap: 1rem; justify-content: space-between; line-height: 1.35; padding-top: .9rem; }
.selected-paper time { color: var(--ink); font-weight: 800; }

.section-blue { background: var(--blue); }
.publication-controls { align-items: end; display: grid; gap: clamp(2rem, 5vw, 5rem); grid-template-columns: minmax(19rem, .8fr) minmax(0, 1.2fr); padding: clamp(3rem, 6vw, 6rem) 0 2.5rem; }
.publication-search-control > label, .filter-checks legend { display: block; font-size: .7rem; font-weight: 850; letter-spacing: .09em; margin-bottom: .65rem; text-transform: uppercase; }
.publication-search-control > input { background: rgba(255,255,255,.55); border: 0; border-bottom: 2px solid var(--ink); border-radius: 0; font-size: clamp(1rem, 1.5vw, 1.25rem); outline: 0; padding: 1rem; width: 100%; }
.publication-search-control > input:focus { border-color: var(--red); }
.filter-checks { border: 0; display: flex; flex-wrap: wrap; gap: .6rem; margin: 0; padding: 0; }
.filter-checks legend { flex: 1 0 100%; float: none; margin: 0 0 .05rem; width: 100%; }
.filter-checks label { align-items: center; background: rgba(255,255,255,.5); cursor: pointer; display: inline-flex; font-size: .7rem; font-weight: 780; gap: .55rem; letter-spacing: .035em; padding: .65rem .8rem; text-transform: uppercase; }
.filter-checks input { accent-color: var(--red); height: 1rem; margin: 0; width: 1rem; }
.publication-status { color: var(--muted); font-size: .73rem; font-weight: 800; letter-spacing: .07em; margin: 0 0 1rem; text-transform: uppercase; }
.publication-list { list-style: none; margin: 0; padding: 0; }
.publication-item { border-top: 1px solid var(--rule); display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr) 5rem; padding: 1.25rem 0 1.45rem; }
.publication-year { color: var(--red); font-size: .72rem; font-weight: 850; letter-spacing: .08em; text-align: right; }
.publication-item h3 { font-size: clamp(1rem, 1.45vw, 1.3rem); letter-spacing: -.022em; line-height: 1.3; margin: 0 0 .75rem; }
.publication-item p { color: var(--muted); font-size: .78rem; line-height: 1.45; margin: .2rem 0 0; }
.publication-item a { text-decoration-color: var(--red); text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
.show-more { background: var(--ink); border: 0; color: var(--white); cursor: pointer; font-size: .74rem; font-weight: 850; letter-spacing: .07em; margin-top: 1.5rem; padding: 1rem 1.1rem; text-align: left; text-transform: uppercase; width: 100%; }
.show-more span { color: var(--red); float: right; font-size: 1.1rem; }

.contact { background: var(--red); color: var(--white); display: grid; gap: clamp(3rem, 8vw, 9rem); grid-template-columns: 1.4fr .6fr; padding: clamp(4rem, 7vw, 7rem) var(--pad) 2rem; }
.contact-main > p { font-size: .72rem; font-weight: 850; letter-spacing: .09em; margin: 0 0 4rem; text-transform: uppercase; }
.contact h2 { font-family: var(--display); font-size: clamp(4rem, 8.2vw, 10rem); font-weight: 850; letter-spacing: -.075em; line-height: .8; margin: 0; text-transform: uppercase; }
.contact em { color: var(--ink); }
.contact-copy { align-self: end; }
.contact-copy p { font-size: clamp(1rem, 1.4vw, 1.25rem); line-height: 1.5; margin: 0 0 2rem; }
.contact-copy > a { border-bottom: 2px solid var(--white); font-size: clamp(1rem, 1.6vw, 1.5rem); font-weight: 750; padding-bottom: .35rem; }
.contact-copy > a span { margin-left: .5rem; }
.contact-links { border-top: 1px solid rgba(255,255,255,.6); display: flex; font-size: .72rem; font-weight: 850; gap: 2rem; grid-column: 1 / -1; letter-spacing: .06em; margin-top: 3rem; padding-top: 1rem; text-transform: uppercase; }

.site-footer { align-items: center; background: var(--ink); color: var(--white); display: grid; font-size: .7rem; gap: 2rem; grid-template-columns: 1fr auto auto; padding: 1rem var(--pad); }
.identity-footer { padding: 0; }
.identity-footer .monogram { transform: scale(.72); transform-origin: left center; }
.identity-footer .monogram i { border-color: var(--white); }
.identity-footer .identity-name small { color: rgba(255,255,255,.58); }
.site-footer p { margin: 0; }
.lab-link { align-items: center; display: inline-flex; font-size: .82rem; font-weight: 850; gap: .65rem; line-height: .82; }
.lab-mark { display: grid; gap: 2px; grid-template-columns: repeat(3, 6px); grid-template-rows: repeat(3, 6px); }
.lab-mark i { background: var(--white); }
.lab-mark i:nth-child(2), .lab-mark i:nth-child(5) { background: var(--red); }
.lab-mark i:nth-child(3) { grid-row: span 2; }

.reveal { opacity: .72; transform: translateY(12px); transition: opacity .4s ease, transform .48s cubic-bezier(.16,1,.3,1); }
.reveal.is-visible { opacity: 1; transform: none; }

@media (min-width: 1800px) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(28rem, 35rem); }
}

@media (max-width: 1060px) {
  .menu-toggle { align-items: center; background: transparent; border: 0; border-left: 1px solid var(--ink); cursor: pointer; display: flex; font-size: .7rem; font-weight: 850; gap: .8rem; letter-spacing: .07em; padding: 0 var(--pad); text-transform: uppercase; }
  .menu-toggle i, .menu-toggle i::before { background: currentColor; content: ""; display: block; height: 2px; transition: transform .25s; width: 20px; }
  .menu-toggle i::before { transform: translateY(6px); }
  .menu-toggle[aria-expanded="true"] i { transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"] i::before { transform: rotate(90deg); }
  .site-nav { background: var(--red); color: var(--white); display: none; flex-direction: column; height: calc(100svh - 84px); inset: 84px 0 auto; position: fixed; }
  .site-nav.is-open { display: flex; }
  .site-nav a { border-bottom: 1px solid rgba(255,255,255,.6); border-left: 0; flex: 1; font-size: clamp(1.2rem, 4vw, 2.4rem); justify-content: space-between; padding: 0 var(--pad); }
  .site-nav a::after { content: "↘"; }
  .hero { grid-template-columns: minmax(0, 1fr) minmax(20rem, 28rem); }
  .hero h1 { font-size: clamp(5rem, 10vw, 8rem); }
  .research-themes { grid-template-columns: 1fr; }
  .research-themes article { min-height: 18rem; }
  .research-themes h3 { margin-top: auto; }
}

@media (max-width: 760px) {
  .identity-name small { display: none; }
  .identity { gap: .55rem; }
  .monogram { transform: scale(.8); transform-origin: left center; width: 2.9rem; }
  .menu-toggle span { display: none; }
  .hero { grid-template-columns: 1fr; min-height: 0; }
  .hero-copy { min-height: calc(82svh - 84px); }
  .hero h1 { font-size: clamp(4.4rem, 21vw, 7.3rem); line-height: .8; }
  .hero-statement { align-items: start; grid-template-columns: 1fr; }
  .hero-profile { min-height: 0; padding-top: 1rem; }
  .portrait-toggle { aspect-ratio: 1146 / 1600; }
  .hero-profile figcaption { flex-wrap: wrap; }
  .intro-grid, .research-heading, .contact { grid-template-columns: 1fr; }
  .intro-grid, .research-heading { gap: 2rem; }
  .personal-notes { min-height: 39rem; }
  .personal-notes::after { background: linear-gradient(0deg, rgba(16,16,15,.92) 0%, rgba(16,16,15,.58) 70%, rgba(16,16,15,.08) 100%); }
  .intro h2 { font-size: clamp(2.75rem, 11.8vw, 5rem); text-wrap: balance; }
  .research-heading h2 { font-size: clamp(3.5rem, 17vw, 6.4rem); }
  .research-loop { grid-template-columns: 1fr; }
  .research-loop ol { grid-template-columns: repeat(2, 1fr); row-gap: 1.4rem; }
  .research-loop p { font-size: 1.3rem; }
  .research-loop li { font-size: clamp(1.18rem, 5.4vw, 1.35rem); }
  .life-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
  .life-gallery .life-photo-captain, .life-gallery .life-photo-cat { grid-column: span 1; height: 18rem; }
  .life-gallery .life-photo-city { grid-column: 1 / -1; height: 13rem; }
  .life-gallery .life-photo:not(.life-photo-captain, .life-photo-cat, .life-photo-city, .life-photo-wide) { grid-column: span 1; height: 11rem; }
  .life-gallery .life-photo-wide { grid-column: 1 / -1; height: 11rem; }
  .work-list { grid-template-columns: 1fr; }
  .selected-paper { min-height: 18rem; }
  .publication-controls { align-items: stretch; gap: 2rem; grid-template-columns: 1fr; }
  .publication-item { gap: 1rem; grid-template-columns: minmax(0, 1fr) 3.5rem; }
  .contact { gap: 3rem; }
  .contact h2 { font-size: clamp(3.6rem, 17vw, 6.5rem); }
  .contact-links { align-items: start; flex-direction: column; gap: 1rem; margin-top: 1rem; }
  .site-footer { align-items: start; grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .hero-copy { min-height: 42rem; }
  .personal-notes { min-height: 46rem; }
  .filter-checks label { flex: 1 1 calc(50% - .6rem); }
  .publication-item { grid-template-columns: 1fr; }
  .publication-year { grid-row: 1; text-align: left; }
  .publication-content { grid-row: 2; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}