:root{
  --ink:#141414;
  --soft:#3a3a3a;
  --muted:#8f8f8f;
  --faint:#ececec;
  --bg:#ffffff;
}
*{box-sizing:border-box;}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:'Inter','Helvetica Neue',Arial,sans-serif;
  font-weight:400;font-size:16px;line-height:1.65;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}

.wrap{max-width:1500px;margin:0 auto;padding:0 clamp(24px,5vw,80px);}

/* header */
.site-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:clamp(22px,3vw,40px) clamp(24px,5vw,80px);
}
.wordmark{font-size:13px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;}
.nav{display:flex;gap:clamp(20px,3vw,40px);}
.nav a{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:color .3s;}
.nav a:hover{color:var(--ink);}

/* eyebrow / labels */
.eyebrow{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted);}

/* hero */
.hero{padding:clamp(40px,7vw,110px) 0 clamp(30px,4vw,60px);text-align:center;}
.hero img{margin:0 auto;max-height:86vh;width:auto;}
.hero .cap{margin-top:22px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}

.lead{
  max-width:640px;margin:clamp(50px,8vw,120px) auto;text-align:center;
  font-weight:300;font-size:clamp(19px,2.4vw,26px);line-height:1.5;color:var(--soft);
  letter-spacing:-.01em;
}

/* section */
.section{padding:clamp(50px,7vw,110px) 0;}
.section-head{margin-bottom:clamp(30px,4vw,56px);}
.section-head h2{
  font-weight:300;font-size:clamp(26px,4.5vw,52px);letter-spacing:-.02em;
  line-height:1.05;margin:.35em 0 0;
}

/* two-up feature */
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;}
.two-up figcaption,.masonry figcaption{margin-top:16px;}
.title{font-size:14px;letter-spacing:.01em;}
.year{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:4px;}
figure{margin:0;}
figure a img{transition:opacity .4s ease;}
figure a:hover img{opacity:.82;}

/* masonry grid (series) */
.masonry{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(40px,4vw,64px);row-gap:clamp(34px,5vw,64px);align-items:start;}
.masonry.packed{row-gap:0;grid-auto-rows:1px;}
.masonry figure{margin:0;}

/* series index list */
.index-list{border-top:1px solid var(--faint);}
.index-row{
  display:flex;align-items:baseline;justify-content:space-between;
  border-bottom:1px solid var(--faint);padding:clamp(20px,2.6vw,34px) 0;transition:padding-left .35s ease;
}
.index-row:hover{padding-left:14px;}
.index-row .rn{width:52px;font-size:12px;letter-spacing:.2em;color:var(--muted);}
.index-row .nm{flex:1;font-weight:300;font-size:clamp(20px,3vw,34px);letter-spacing:-.01em;}
.index-row .en{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);width:150px;}
.index-row .ct{font-size:11px;letter-spacing:.18em;color:var(--muted);text-align:right;width:80px;}
.index-row.muted .nm{color:var(--muted);}

/* series header */
.series-hero{padding:clamp(50px,7vw,120px) 0 clamp(24px,3vw,50px);position:relative;}
.ghost-rn{font-size:clamp(80px,16vw,220px);font-weight:200;color:#f4f4f4;line-height:.8;letter-spacing:-.03em;}
.series-hero h1{font-weight:300;font-size:clamp(34px,6vw,72px);letter-spacing:-.02em;margin:.1em 0 .2em;}
.series-hero .desc{max-width:560px;color:var(--soft);font-weight:300;font-size:clamp(15px,1.6vw,18px);}

/* work detail */
.work{padding:clamp(30px,5vw,80px) 0;text-align:center;}
.work img{margin:0 auto;max-height:86vh;width:auto;}
.tomb{max-width:520px;margin:clamp(34px,5vw,60px) auto 0;}
.tomb .nm{font-size:14px;letter-spacing:.02em;}
.tomb .ti{font-weight:300;font-size:22px;letter-spacing:-.01em;margin:.2em 0 1em;}
.tomb .ln{font-size:13px;color:var(--muted);line-height:1.8;}
.inquire{
  display:inline-block;margin-top:30px;font-size:11px;letter-spacing:.26em;text-transform:uppercase;
  border-bottom:1px solid var(--ink);padding-bottom:5px;transition:opacity .3s;
}
.inquire:hover{opacity:.55;}
.back{display:inline-block;margin-top:8px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);}

/* about / contact */
.prose{max-width:620px;margin:clamp(40px,7vw,110px) auto;font-weight:300;font-size:clamp(16px,1.7vw,19px);line-height:1.75;color:var(--soft);}
.prose h1{font-weight:300;font-size:clamp(28px,4.5vw,52px);letter-spacing:-.02em;color:var(--ink);margin:0 0 .6em;}

/* footer */
.site-foot{border-top:1px solid var(--faint);margin-top:clamp(60px,8vw,120px);
  padding:36px clamp(24px,5vw,80px);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.site-foot span{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);}

/* reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .9s ease,transform .9s ease;}
.reveal.in{opacity:1;transform:none;}

@media(max-width:820px){
  .two-up{grid-template-columns:1fr;}
  .nav{gap:18px;}
  .index-row .en{display:none;}
}
@media(max-width:600px){.masonry{grid-template-columns:1fr;}}