:root {
  --paper:#f2efe8;
  --ink:#171715;
  --muted:#777168;
  --wine:#6e4f59;
  --sage:#647063;
  --line:rgba(23,23,21,.17);
  --cream:#e8e1d7;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:99;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;object-fit:cover}
.serif,h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:400}
nav{
  position:fixed;z-index:70;left:0;right:0;top:0;
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 3.2vw;background:rgba(242,239,232,.82);
  backdrop-filter:blur(14px);border-bottom:1px solid rgba(23,23,21,.08);
}
.logo{font-size:14px;font-weight:700;letter-spacing:.16em}
.navlinks{display:flex;gap:26px;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.hero{
  min-height:100vh;padding:104px 3.2vw 3.2vw;
  display:grid;grid-template-columns:.84fr 1.16fr;gap:3.2vw;align-items:end;
}
.hero-copy{padding:3vw 0 2.5vw}
.kicker{font-size:10px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:28px}
h1{font-size:clamp(64px,7.1vw,126px);line-height:.84;letter-spacing:-.055em;margin:0 0 35px}
.hero p{max-width:550px;color:rgba(23,23,21,.7);font-size:18px;margin:0 0 35px}
.text-link{display:inline-flex;align-items:center;gap:12px;font-size:10px;text-transform:uppercase;letter-spacing:.17em;border-bottom:1px solid currentColor;padding-bottom:7px}
.hero-image{
  height:calc(100vh - 136px);min-height:650px;overflow:hidden;position:relative;background:#ddd5cb;
}
.hero-image img{object-position:center 30%}
.hero-image:after{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 64%,rgba(20,20,18,.18));
}
.hero-caption{
  position:absolute;z-index:2;bottom:18px;right:18px;color:white;
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;
}
.manifesto{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:1fr 2fr;padding:28px 3.2vw;gap:6vw;align-items:center;
}
.manifesto .label{font-size:10px;letter-spacing:.17em;text-transform:uppercase}
.manifesto .statement{font-family:Georgia,serif;font-size:clamp(25px,3vw,46px);line-height:1.05;letter-spacing:-.03em}
.section{padding:9vw 3.2vw}
.intro-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:7vw}
.num{font-size:10px;letter-spacing:.17em;text-transform:uppercase}
h2{font-size:clamp(48px,6.5vw,105px);line-height:.88;letter-spacing:-.045em;margin:0 0 36px}
.lead{font-family:Georgia,serif;font-size:clamp(27px,3.2vw,52px);line-height:1.08;letter-spacing:-.028em;max-width:900px}
.small{max-width:650px;color:rgba(23,23,21,.68);font-size:15px;margin-top:28px}
.visual-essay{
  margin-top:7vw;display:grid;grid-template-columns:1.08fr .64fr .78fr;gap:18px;align-items:start;
}
.photo{position:relative;overflow:hidden;background:#d7d0c6}
.photo.one{height:700px}
.photo.two{height:530px;margin-top:120px}
.photo.three{height:620px;margin-top:45px}
.photo.one img{object-position:center 42%}
.photo.two img{object-position:center 34%}
.photo.three img{object-position:center 40%}
.photo-label{
  position:absolute;left:16px;bottom:15px;background:rgba(242,239,232,.88);
  padding:8px 10px 7px;font-size:9px;letter-spacing:.15em;text-transform:uppercase;
}
.story{background:var(--ink);color:var(--paper)}
.story .small{color:rgba(242,239,232,.64)}
.story-layout{margin-top:7vw;display:grid;grid-template-columns:1fr .9fr;gap:5vw;align-items:center}
.story-image{height:760px;overflow:hidden}
.story-image img{object-position:center 26%}
.story-quote{font-family:Georgia,serif;font-size:clamp(36px,4.8vw,75px);line-height:1.02;letter-spacing:-.04em}
.story-note{font-size:12px;line-height:1.75;color:rgba(242,239,232,.62);max-width:500px;margin-top:34px}
.values{padding-bottom:6vw}
.value-row{margin-top:5vw;border-top:1px solid var(--line)}
.value{
  display:grid;grid-template-columns:.2fr .8fr 1fr;gap:2vw;
  padding:26px 0;border-bottom:1px solid var(--line);align-items:start;
}
.value .index,.value .title{font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.value .desc{font-family:Georgia,serif;font-size:clamp(25px,2.5vw,41px);line-height:1.08;letter-spacing:-.02em}
.interlude{
  margin:0 3.2vw 9vw;min-height:72vh;position:relative;overflow:hidden;background:#c8c0b5;
}
.interlude img{position:absolute;inset:0;object-position:center 46%}
.interlude:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,20,18,.58),rgba(20,20,18,.08) 58%,transparent)}
.interlude-copy{position:absolute;z-index:2;left:4vw;top:50%;transform:translateY(-50%);color:white;max-width:650px}
.interlude-copy h3{font-size:clamp(44px,6vw,94px);line-height:.91;letter-spacing:-.045em;margin:0 0 22px}
.interlude-copy p{max-width:470px;color:rgba(255,255,255,.8)}
.journal-grid{margin-top:5vw;display:grid;grid-template-columns:1.16fr .84fr .84fr;gap:22px}
.card{border-top:1px solid var(--line);padding-top:13px}
.card-img{aspect-ratio:4/5;overflow:hidden;margin-bottom:17px}
.card:nth-child(1) .card-img img{object-position:center 34%}
.card:nth-child(2) .card-img img{object-position:center 28%}
.card:nth-child(3) .card-img img{object-position:center 35%}
.card small{font-size:9px;letter-spacing:.15em;text-transform:uppercase}
.card h3{font-size:30px;line-height:1.04;letter-spacing:-.025em;margin:12px 0}
.card p{color:rgba(23,23,21,.62);font-size:13px;max-width:370px}
.closing{
  min-height:90vh;position:relative;display:flex;align-items:flex-end;overflow:hidden;color:white;
}
.closing img{position:absolute;inset:0;object-position:center 44%}
.closing:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,12,10,.05),rgba(12,12,10,.64))}
.closing-inner{position:relative;z-index:2;width:100%;padding:4vw 3.2vw 2.6vw}
.closing h2{font-size:clamp(65px,9vw,150px);max-width:1050px;margin-bottom:4vw}
footer{border-top:1px solid rgba(255,255,255,.42);padding-top:20px;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:24px;font-size:11px;line-height:1.8}
footer b{letter-spacing:.16em}
@media(max-width:900px){
  nav{padding:16px 18px} .navlinks{display:none}
  .hero{grid-template-columns:1fr;padding:94px 18px 28px} .hero-copy{order:2}
  .hero-image{height:68vh;min-height:0;order:1} h1{font-size:18vw}
  .manifesto{grid-template-columns:1fr;padding:24px 18px;gap:14px}
  .section{padding:90px 18px} .intro-grid{grid-template-columns:1fr;gap:28px}
  .visual-essay{grid-template-columns:1fr 1fr} .photo.one{grid-column:1/3;height:620px}
  .photo.two,.photo.three{height:420px;margin-top:0}
  .story-layout{grid-template-columns:1fr} .story-image{height:620px}
  .value{grid-template-columns:.2fr .8fr} .value .desc{grid-column:2}
  .interlude{margin:0 18px 90px;min-height:72vh}
  .interlude-copy{left:24px;right:24px}
  .journal-grid{grid-template-columns:1fr} .card-img{aspect-ratio:5/4}
  .closing{min-height:78vh} footer{grid-template-columns:1fr}
}