:root {
  --ink: #24221e;
  --paper: #f5f0e7;
  --paper-deep: #e8e0d1;
  --rust: #943f32;
  --sage: #8d9276;
  --cream: #fffaf1;
  --line: rgba(36, 34, 30, 0.2);
}

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

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.65;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0.22;
  background-image:
    radial-gradient(circle at 18% 24%, rgba(36,34,30,.08) 0 0.5px, transparent .8px),
    radial-gradient(circle at 72% 61%, rgba(148,63,50,.05) 0 0.4px, transparent .7px);
  background-size: 9px 11px, 13px 15px;
  z-index: 20;
}

a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; }
h1, h2, h3, p, blockquote, figure { margin-top: 0; }
h1, h2, blockquote {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.site-header {
  align-items: center;
  display: flex;
  height: 84px;
  justify-content: space-between;
  padding: 0 5vw;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
}

.wordmark {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  letter-spacing: -0.03em;
}

nav { display: flex; gap: clamp(20px, 3vw, 48px); }
nav a, .eyebrow, .small-note, .project-meta, .press-grid span, .footer-small {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
nav a { letter-spacing: 0.08em; }
nav a:hover, nav a:focus-visible, .text-link:hover { color: var(--rust); }

.hero {
  min-height: min(890px, 100vh);
  overflow: hidden;
  padding: 170px 5vw 70px;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.9fr);
  align-items: center;
}

.hero::after {
  content: "";
  position: absolute;
  width: 42vw;
  height: 42vw;
  border: 1px solid rgba(148, 63, 50, 0.22);
  border-radius: 50%;
  right: -17vw;
  top: 7vw;
}

.hero-copy { max-width: 770px; position: relative; z-index: 2; }
.eyebrow { color: var(--rust); margin-bottom: 30px; }
.hero h1 { font-size: clamp(70px, 9vw, 142px); margin-bottom: 38px; }
.hero-intro { max-width: 610px; font-size: clamp(18px, 1.5vw, 23px); line-height: 1.6; }
.hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 30px; margin-top: 45px; }

.button {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 15px 24px;
  text-transform: uppercase;
  transition: transform 180ms ease, background 180ms ease;
}
.button:hover { transform: translateY(-2px); }
.button-dark { background: var(--ink); color: var(--cream); }
.button-dark:hover { background: var(--rust); }
.button-light { background: var(--cream); color: var(--ink); }
.text-link { border-bottom: 1px solid var(--ink); font-size: 13px; padding-bottom: 3px; }
.text-link span { padding-left: 8px; }

.hero-portrait {
  align-self: end;
  justify-self: center;
  max-width: 620px;
  position: relative;
  width: 100%;
  z-index: 2;
}
.hero-portrait img { filter: saturate(0.82); position: relative; z-index: 2; }
.portrait-wash {
  background: rgba(141, 146, 118, 0.28);
  border-radius: 54% 46% 42% 58% / 58% 50% 50% 42%;
  inset: 12% 6% 0;
  position: absolute;
  transform: rotate(-3deg);
}
.portrait-note {
  bottom: 5%;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 13px;
  font-style: italic;
  left: -5%;
  line-height: 1.4;
  position: absolute;
  transform: rotate(-4deg);
  z-index: 3;
}
.scroll-note {
  bottom: 35px;
  font-size: 10px;
  letter-spacing: .15em;
  position: absolute;
  text-transform: uppercase;
}
.scroll-note span { margin-left: 8px; }

.intro-strip {
  align-items: center;
  background: var(--ink);
  color: var(--cream);
  display: flex;
  justify-content: space-between;
  padding: 45px 5vw;
}
.intro-strip p { font-family: Georgia, serif; font-size: clamp(22px, 2.7vw, 40px); line-height: 1.2; margin: 0; max-width: 850px; }
.intro-strip span { color: rgba(255,250,241,.62); font-size: 11px; letter-spacing: .12em; max-width: 280px; text-transform: uppercase; }

.section { padding: 130px 5vw; }
.section-heading { display: grid; grid-template-columns: 0.7fr 1.3fr 1fr; gap: 5vw; align-items: start; margin-bottom: 80px; }
.section-heading h2, .birds-copy h2, .journal-copy h2, footer h2 { font-size: clamp(52px, 6vw, 92px); margin-bottom: 0; }
.section-summary { max-width: 520px; }

.project-meta { border-top: 1px solid var(--line); margin-top: 45px; }
.project-meta div { border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 1fr 1.5fr; padding: 10px 0; }
.project-meta dt { color: rgba(36,34,30,.55); }
.project-meta dd { margin: 0; }

.poster-gallery {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(12px, 2vw, 32px);
  align-items: start;
}
.poster-gallery figure { grid-column: span 4; box-shadow: 0 12px 35px rgba(36,34,30,.12); overflow: hidden; }
.poster-gallery figure:nth-child(2) { margin-top: 8vw; }
.poster-gallery figure:nth-child(3) { margin-top: 3vw; }
.poster-gallery figure:nth-child(4) { margin-top: -2vw; }
.poster-gallery figure:nth-child(5) { margin-top: 6vw; }
.poster-gallery figure:nth-child(6) { margin-top: 1vw; }
.poster-gallery img { transition: transform 450ms ease; }
.poster-gallery figure:hover img { transform: scale(1.018); }

.project-story {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 6vw;
  grid-template-columns: 1fr 1fr;
  margin: 90px 0 0 25%;
  padding-top: 40px;
}
.project-story p { max-width: 570px; }
.dropcap::first-letter {
  color: var(--rust);
  float: left;
  font-family: Georgia, serif;
  font-size: 75px;
  line-height: .75;
  padding: 10px 10px 0 0;
}

.birds-section {
  align-items: center;
  background: #dfe1d4;
  display: grid;
  gap: 7vw;
  grid-template-columns: 0.72fr 1.28fr;
}
.birds-copy p:not(.eyebrow):not(.small-note) { font-size: 19px; max-width: 550px; }
.small-note { border-top: 1px solid rgba(36,34,30,.24); margin-top: 45px; padding-top: 14px; }
.birds-board { background: var(--cream); box-shadow: 0 18px 50px rgba(36,34,30,.12); padding: 20px; transform: rotate(1deg); }
.birds-board figcaption { font-family: Georgia, serif; font-size: 13px; font-style: italic; padding: 16px 4px 0; }

.statement-section {
  display: grid;
  gap: 6vw;
  grid-template-columns: .55fr 1.45fr;
  padding: 140px 5vw;
}
.statement-label { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; }
.statement-copy blockquote { font-size: clamp(50px, 6vw, 96px); margin-bottom: 70px; max-width: 1200px; }
.columns { border-top: 1px solid var(--line); display: grid; gap: 5vw; grid-template-columns: 1fr 1fr; padding-top: 35px; }

.journal-section {
  align-items: center;
  background: var(--paper-deep);
  display: grid;
  gap: 7vw;
  grid-template-columns: 1.2fr .8fr;
}
.kitchen-image { transform: rotate(-1deg); }
.journal-copy h2 { margin-bottom: 40px; }
.journal-copy > p:not(.eyebrow):not(.hand-note) { max-width: 580px; }
.hand-note { color: var(--rust); font-family: Georgia, serif; font-size: 22px; font-style: italic; margin-top: 35px; transform: rotate(-2deg); }

.press-section { padding: 120px 5vw; }
.press-grid { border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(3, 1fr); }
.press-grid article { border-right: 1px solid var(--line); padding: 35px 4vw 30px 0; }
.press-grid article + article { padding-left: 4vw; }
.press-grid article:last-child { border-right: 0; }
.press-grid span { color: var(--rust); }
.press-grid h3 { font-family: Georgia, serif; font-size: clamp(25px, 2.4vw, 38px); font-weight: 400; line-height: 1.1; margin: 24px 0; }

footer {
  background: var(--ink);
  color: var(--cream);
  display: grid;
  gap: 7vw;
  grid-template-columns: 1.1fr .9fr;
  padding: 110px 5vw 35px;
}
footer .eyebrow { color: #d98b78; }
.footer-lead .button { margin-top: 45px; }
.footer-details { align-self: end; max-width: 520px; }
.footer-details > p:first-child { color: rgba(255,250,241,.7); font-size: 19px; }
address { border-top: 1px solid rgba(255,255,255,.2); display: flex; flex-direction: column; font-style: normal; margin-top: 40px; padding-top: 22px; }
address a { font-family: Georgia, serif; font-size: 25px; margin-bottom: 12px; }
.footer-small { color: rgba(255,250,241,.45); margin-top: 32px; }
.footer-base { border-top: 1px solid rgba(255,255,255,.2); display: flex; font-size: 11px; grid-column: 1 / -1; justify-content: space-between; letter-spacing: .1em; margin-top: 45px; padding-top: 25px; text-transform: uppercase; }

@media (max-width: 900px) {
  body { font-size: 16px; }
  .hero { grid-template-columns: 1fr; padding-top: 135px; }
  .hero h1 { font-size: clamp(65px, 18vw, 110px); }
  .hero-portrait { margin-top: 55px; max-width: 540px; }
  .scroll-note { display: none; }
  .intro-strip { align-items: flex-start; flex-direction: column; gap: 24px; }
  .section-heading { grid-template-columns: 1fr; }
  .section-heading h2 { max-width: 700px; }
  .section-summary { margin-left: 20%; }
  .project-story { margin-left: 0; }
  .birds-section, .journal-section { grid-template-columns: 1fr; }
  .statement-section { grid-template-columns: 1fr; }
  .statement-label { flex-direction: row; }
}

@media (max-width: 620px) {
  .site-header { height: 70px; }
  .wordmark { font-size: 21px; }
  nav { gap: 16px; }
  nav a:nth-child(3) { display: none; }
  .hero { padding: 125px 6vw 55px; }
  .hero h1 { font-size: clamp(60px, 20vw, 88px); }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .portrait-note { left: 0; }
  .intro-strip, .section, .statement-section, .press-section { padding-left: 6vw; padding-right: 6vw; }
  .intro-strip { padding-bottom: 35px; padding-top: 35px; }
  .section { padding-bottom: 85px; padding-top: 85px; }
  .section-heading { gap: 18px; margin-bottom: 45px; }
  .section-heading h2, .birds-copy h2, .journal-copy h2, footer h2 { font-size: 49px; }
  .section-summary { margin-left: 0; }
  .poster-gallery { display: flex; margin-right: -6vw; overflow-x: auto; padding: 0 6vw 30px 0; scroll-snap-type: x mandatory; }
  .poster-gallery figure { flex: 0 0 76vw; margin-top: 0 !important; scroll-snap-align: start; }
  .project-story { gap: 18px; grid-template-columns: 1fr; margin-top: 55px; }
  .birds-board { padding: 10px; }
  .statement-section { padding-bottom: 90px; padding-top: 90px; }
  .statement-label { align-items: flex-start; flex-direction: column; margin-bottom: 20px; }
  .statement-copy blockquote { font-size: 46px; margin-bottom: 45px; }
  .columns { gap: 15px; grid-template-columns: 1fr; }
  .press-grid { grid-template-columns: 1fr; }
  .press-grid article, .press-grid article + article { border-bottom: 1px solid var(--line); border-right: 0; padding: 28px 0; }
  footer { grid-template-columns: 1fr; padding-left: 6vw; padding-right: 6vw; }
  address a { font-size: 20px; }
  .footer-base { align-items: flex-start; flex-direction: column; gap: 8px; }
}

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