:root {
  --paper: #f3f1ed;
  --ink: #11110f;
  --muted: #77746e;
  --rule: rgba(17, 17, 15, .18);
  --gutter: clamp(1rem, 2.2vw, 2.25rem);
}

.cv { display:grid; grid-template-columns:1fr 2fr; gap:2rem; border-top:1px solid var(--rule); padding:24px 0 64px; }
.cv h2 { font-size:14px; font-weight:400; margin:0; }
.cv dl { margin:0; display:grid; grid-template-columns:85px 1fr; gap:24px 18px; }
.cv dt { color:var(--muted); }
.cv dd { margin:0; }
.cv p { margin:0 0 12px; max-width:760px; }
.cv a { text-decoration:underline; text-underline-offset:3px; }
@media(max-width:720px) { .cv { grid-template-columns:1fr; } .cv dl { grid-template-columns:70px 1fr; } }

.archive-gallery { display:grid; grid-template-columns:1fr 1fr; gap:70px 40px; max-width:1050px; margin:0 auto 120px; }
.archive-gallery figure { margin:0; }
.archive-gallery img { display:block; width:100%; height:auto; }
.archive-gallery figcaption { color:var(--muted); font-size:12px; margin-top:12px; }
@media(max-width:720px) { .archive-gallery { grid-template-columns:1fr; gap:40px; } }
.archive-project { border-top:1px solid var(--rule); padding-top:32px; }
.archive-project-header { display:grid; grid-template-columns:1fr 2fr; gap:2rem; max-width:1050px; margin:0 auto 52px; }
.archive-project-header > div { grid-column:2; }
.archive-project-header h2 { max-width:780px; margin:.5rem 0 0; font-size:clamp(2rem,4.5vw,4.8rem); font-weight:400; letter-spacing:-.055em; line-height:.95; }
@media(max-width:720px) { .archive-project-header { grid-template-columns:1fr; } .archive-project-header > div { grid-column:1; } }
* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.35;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
a:focus-visible, summary:focus-visible { outline:2px solid var(--ink); outline-offset:6px; }
.lab-selection { margin:0; aspect-ratio:auto; }
.lab-selection a { display:block; }
.lab-selection img { display:block; width:100%; height:auto; }
.lab-selection figcaption { font-size:12px; color:var(--muted); margin-top:12px; }
.lab-intro { min-height:48vh; }
.study-index { display:block; margin-bottom:90px; border-top:1px solid var(--rule); }
.study-index a { display:grid; grid-template-columns:1fr 1.5fr 1fr; gap:16px; border-bottom:1px solid var(--rule); padding:18px 0; color:var(--ink); }
.study-index a span { color:var(--muted); font-size:13px; }
.study-index a span:last-child { text-align:right; }
.lab-study { scroll-margin-top:24px; margin-bottom:110px; }
.study-heading { display:grid; grid-template-columns:1fr 2fr; gap:24px; border-top:1px solid var(--rule); padding:24px 0 55px; }
.study-heading h2 { font-size:clamp(2.5rem,6vw,6rem); line-height:1; letter-spacing:-.055em; font-weight:400; margin:0 0 18px; }
.study-heading p:not(.eyebrow) { max-width:620px; font-size:18px; }
.study-heading .study-subtitle { margin:0 0 32px; }
.study-heading .study-note { color:var(--muted); font-size:13px!important; margin-top:25px; }
.study-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 28px; align-items:start; }
.study-gallery figure { margin:0; }
.study-gallery img { display:block; width:100%; height:auto; }
.study-gallery figcaption { margin-top:12px; color:var(--muted); font-size:12px; }
.study-more { margin-top:42px; }
.study-more summary { cursor:pointer; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); padding:18px 0; margin-bottom:35px; }
.study-more summary span { float:right; color:var(--muted); }
@media(max-width:720px) { .study-heading { grid-template-columns:1fr; } .study-gallery { grid-template-columns:1fr; gap:32px; } .study-index a { grid-template-columns:30px 1fr; } .study-index a span:last-child { grid-column:2; text-align:left; } }

.site-header {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  min-height: 104px;
  padding: 18px var(--gutter);
  border-bottom: 1px solid var(--rule);
}

.identity {
  display: flex;
  flex-direction: column;
  width: max-content;
  letter-spacing: -.02em;
}

.identity span:last-child { color: var(--muted); }

nav { display: flex; gap: clamp(1rem, 2.4vw, 2.6rem); }

nav a { color: var(--muted); transition: color 160ms ease; }
nav a:hover, nav a.active { color: var(--ink); }
nav a.active::after { content: ""; display: block; border-bottom: 1px solid; margin-top: 3px; }

main { padding: 0 var(--gutter); }

.intro {
  display: grid;
  grid-template-columns: 1fr 2fr;
  min-height: 46vh;
  padding: 24px 0 52px;
  align-items: end;
}

.eyebrow { margin: 0; color: var(--muted); align-self: start; }

h1 {
  max-width: 980px;
  margin: 0;
  font-size: clamp(2.7rem, 6.2vw, 7.2rem);
  font-weight: 400;
  letter-spacing: -.065em;
  line-height: .93;
}

.work-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(3rem, 9vw, 10rem) clamp(1rem, 2vw, 2rem);
  padding: 5vw 0 14vw;
}

.work { margin: 0; overflow: hidden; background: #e8e5df; }
.work img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 500ms cubic-bezier(.2,.7,.2,1); }
.work:hover img { transform: scale(1.012); }
.work--wide { grid-column: 1 / span 8; aspect-ratio: 16 / 9; }
.work--portrait { grid-column: 8 / span 4; aspect-ratio: 3 / 4; }
.work--offset { margin-top: 14vw; }
.work--square { grid-column: 2 / span 5; aspect-ratio: 1 / 1; }
.work--right { grid-column: 5 / span 8; }
.work--small { grid-column: 2 / span 4; }

.practice-note {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 2rem;
  padding: 24px 0 min(18vw, 230px);
  border-top: 1px solid var(--rule);
}

.practice-note p {
  grid-column: 2;
  max-width: 830px;
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2.7rem);
  line-height: 1.12;
  letter-spacing: -.035em;
}

.text-link { grid-column: 2; width: max-content; margin-top: 2rem; border-bottom: 1px solid; }

footer {
  display: flex;
  justify-content: space-between;
  margin: 0 var(--gutter);
  padding: 18px 0 30px;
  border-top: 1px solid var(--rule);
  color: var(--muted);
}

.page-intro {
  display: grid;
  grid-template-columns: 1fr 2fr;
  min-height: 65vh;
  padding: 24px 0 70px;
}

.page-intro h1 { grid-column: 2; align-self: end; }
.page-intro .eyebrow { grid-column: 1; grid-row: 1; }

.page-copy {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 2rem;
  padding: 24px 0 14vw;
  border-top: 1px solid var(--rule);
}

.page-copy > * { grid-column: 2; }
.page-copy p { max-width: 760px; margin: 0 0 1em; font-size: clamp(1.25rem, 2vw, 2.2rem); line-height: 1.2; letter-spacing: -.025em; }
.page-copy .small { max-width: 580px; color: var(--muted); font-size: 14px; line-height: 1.4; letter-spacing: 0; }

.index-list { grid-column: 1 / -1; list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--rule); }
.index-list li { display: grid; grid-template-columns: 1fr 2fr; gap: 2rem; padding: 14px 0; border-bottom: 1px solid var(--rule); }
.index-list span:first-child { color: var(--muted); }

@media (max-width: 720px) {
  .site-header { grid-template-columns: 1fr; gap: 24px; min-height: 130px; }
  nav { justify-content: space-between; }
  .intro, .page-intro { grid-template-columns: 1fr; min-height: 55vh; }
  .intro h1, .page-intro h1 { grid-column: 1; align-self: end; }
  .work-grid { gap: 18vw 10px; }
  .work--wide { grid-column: 1 / -1; }
  .work--portrait { grid-column: 5 / -1; }
  .work--square { grid-column: 1 / span 8; }
  .work--right { grid-column: 2 / -1; }
  .work--small { grid-column: 1 / span 7; }
  .practice-note, .page-copy { grid-template-columns: 1fr; }
  .practice-note p, .practice-note .text-link, .page-copy > * { grid-column: 1; }
  .index-list li { grid-template-columns: 1fr; gap: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .work img { transition: none; }
}