:root {
  --ink: #0a0a0a;
  --paper: #fff;
  --quiet: #707070;
  --rule: #dedede;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.35;
  letter-spacing: 0;
}
a { color: inherit; text-decoration: none; }
a:hover { opacity: .55; }
img { display: block; width: 100%; height: auto; }

.site-header {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: start;
  padding: 18px 20px 0;
}
.identity { display: flex; gap: 18px; align-items: baseline; }
.identity strong { font-weight: 400; }
.identity span { color: var(--quiet); }
.identity-divider { padding: 0 5px; }
nav { display: flex; gap: 12px; justify-content: flex-end; white-space: nowrap; }
.home-page .site-header { font-size: 14px; padding-top: 20px; }
.home-page nav { font-size: inherit; padding-top: 0; gap: 16px; }

.project-index {
  display: flex;
  flex-direction: column;
  gap: clamp(80px, 14vh, 160px);
  width: min(100%, 1500px);
  margin: 0 auto;
  padding: 11vh 20px 20vh;
}
.project-link { display: block; width: min(42vw, 580px); min-width: 0; }
.project-link:nth-child(even) { align-self: flex-end; }
.home-page .project-index { gap: 12vh; padding-top: 9vh; }
.home-page .project-link:nth-child(1) { width: min(42vw, 620px); margin-left: 6vw; }
.home-page .project-link:nth-child(2) { width: min(38vw, 570px); margin-top: 0; margin-right: 9vw; }
.home-page .project-link:nth-child(3) { width: min(40vw, 600px); margin-top: 0; margin-left: 14vw; }
.project-cover { background: #f3f3f3; }
.project-cover img { width: 100%; height: auto; }
.project-meta { display: flex; justify-content: space-between; gap: 14px; margin-top: 8px; }
.project-meta span:last-child { color: var(--quiet); }

.page-title {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  width: min(82vw, 1180px);
  margin: 12vh auto 14vh;
  padding-top: 9px;
  border-top: 1px solid var(--rule);
}
.page-title h1, .page-title p { margin: 0; font-size: 14px; font-weight: 400; }
.page-title p { color: var(--quiet); }

.feed { width: min(100%, 1440px); margin: 0 auto; padding: 0 20px 18vh; }
.work { margin: 0 auto clamp(96px, 17vh, 220px); }
.work figure { margin: 0; }
.work figcaption { margin-top: 7px; color: var(--ink); }
.portrait-narrow { width: min(29vw, 370px); }
.portrait-mid { width: min(36vw, 470px); }
.landscape { width: min(52vw, 690px); }
.vessels-page .portrait-narrow { width: min(35vw, 460px); }
.vessels-page .portrait-mid { width: min(46vw, 610px); }
.seeds-page .portrait-narrow,
.seeds-page .portrait-mid { width: min(54vw, 720px); }
.seeds-page .work:nth-child(2) { margin-right: 14vw; }
.transition-page .landscape { width: min(39vw, 520px); }
.align-left { margin-left: 8vw; margin-right: auto; }
.align-right { margin-left: auto; margin-right: 7vw; }
.align-center { margin-left: auto; margin-right: auto; }

.info-page { width: min(100%, 1180px); margin: 0 auto; padding: 14vh 20px 18vh; }
.about-layout { display: grid; grid-template-columns: minmax(370px, 1.05fr) minmax(340px, .95fr); gap: clamp(44px, 7vw, 100px); align-items: start; }
.about-copy { max-width: 650px; font-size: 14px; }
.about-copy p { margin: 0; }
.about-copy p + p { margin-top: 1.35em; }
.about-images { width: 100%; justify-self: end; }
.exhibitions { margin-top: 18vh; }
.exhibitions h2 { margin: 0 0 42px; font-size: 18px; font-weight: 400; }
.exhibition { display: grid; grid-template-columns: minmax(190px, 1.3fr) minmax(190px, 1.15fr) minmax(120px, .65fr) 90px; gap: 24px; align-items: baseline; padding: 15px 0 22px; border-top: 1px solid var(--rule); font-size: 13px; }
.exhibition:last-child { border-bottom: 1px solid var(--rule); }
.exhibition span:not(:first-child) { color: var(--quiet); }
.exhibition span:last-child { text-align: right; }

.site-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding: 18px 20px 22px; border-top: 1px solid var(--rule); }
.site-footer p { margin: 0; }
.site-footer div:last-child { text-align: right; }
.series-contact { display: flex; justify-content: space-between; gap: 24px; padding: 18px 20px 22px; border-top: 1px solid var(--rule); }
.series-contact span { color: var(--quiet); }

@media (max-width: 720px) {
  body { font-size: 14px; }
  .site-header { grid-template-columns: 1fr; gap: 8px; padding-top: 14px; }
  nav { justify-content: flex-start; }
  .project-index { gap: 90px; padding-top: 11vh; }
  .project-link { width: 82vw; }
  .project-link:nth-child(even) { align-self: flex-end; }
  .home-page .site-header { font-size: 14px; }
  .home-page nav { font-size: inherit; gap: 14px; }
  .home-page .project-index { gap: 10vh; }
  .home-page .project-link:nth-child(1) { width: 88vw; margin-left: 3vw; }
  .home-page .project-link:nth-child(2) { width: 82vw; margin-top: 0; margin-right: 4vw; }
  .home-page .project-link:nth-child(3) { width: 85vw; margin-top: 0; margin-left: 7vw; }
  .page-title { width: calc(100% - 40px); margin: 10vh auto 12vh; }
  .work { margin-bottom: 110px; }
  .portrait-narrow, .portrait-mid { width: 72vw; }
  .landscape { width: calc(100vw - 40px); }
  .vessels-page .portrait-narrow { width: 76vw; }
  .vessels-page .portrait-mid { width: 84vw; }
  .seeds-page .portrait-narrow,
  .seeds-page .portrait-mid { width: 88vw; }
  .seeds-page .work:nth-child(2) { margin-right: 9vw; }
  .transition-page .landscape { width: 76vw; }
  .align-left { margin-left: 0; }
  .align-right { margin-right: 0; }
  .about-layout { grid-template-columns: 1fr; }
  .about-images { width: 94%; justify-self: end; }
  .exhibitions h2 { margin-bottom: 28px; font-size: 18px; }
  .exhibition { grid-template-columns: 1fr auto; gap: 7px 14px; padding: 14px 0 20px; }
  .exhibition span:nth-child(2), .exhibition span:nth-child(3) { grid-column: 1; }
  .exhibition span:last-child { grid-column: 2; grid-row: 1; }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer div:last-child { text-align: left; }
  .series-contact { flex-direction: column; gap: 4px; }
}