:root{
  --wall:#F4F4F1; --paper:#FBFBF9; --ink:#1B1D1A; --body:#2A2C28;
  --steel:#6F736C; --meta:#53564F; --hair:#D5D6D0; --green:#5FAE34; --gutter:46px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0; background:var(--wall); color:var(--body);
  font-family:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif; font-weight:400;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;}
.page{position:relative; min-height:100vh; overflow:hidden;}
.rod{position:absolute; top:0; bottom:0; left:var(--gutter); width:1px; background:var(--hair);}
.rod .foot{position:absolute; left:50%; bottom:74px; width:26px; height:9px;
  transform:translateX(-50%); border-radius:50%; background:var(--green); opacity:0; filter:blur(.3px);
  animation:dusk 2.4s ease 1.1s forwards;}
@keyframes dusk{to{opacity:.92; box-shadow:0 0 22px 5px rgba(95,174,52,.42);}}
.wrap{max-width:1080px; margin:0 auto; padding:0 40px 0 96px;}
header{display:flex; justify-content:space-between; align-items:baseline;
  padding:38px 0 22px; border-bottom:1px solid var(--hair);}
.mark{font-weight:600; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink);}
.mark a{color:inherit; text-decoration:none;}
.section-tag{font-weight:500; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--steel);}
.section-tag a{color:inherit; text-decoration:none;}
.series{display:flex; gap:18px; align-items:center; padding:26px 0 8px;
  font-size:13px; letter-spacing:.12em; color:var(--steel); flex-wrap:wrap;}
.series .lbl{font-size:10px; letter-spacing:.24em; text-transform:uppercase; margin-right:6px;}
.series .lbl a{color:var(--steel); text-decoration:none;}
.series a{color:var(--steel); text-decoration:none; transition:color .25s;}
.series a:hover{color:var(--ink);}
.series .now{color:var(--ink); position:relative; font-weight:500;}
.series .now::after{content:""; position:absolute; left:50%; top:-9px; width:4px; height:4px; transform:translateX(-50%); border-radius:50%; background:var(--green);}
.eyebrow{font-weight:500; font-size:12px; letter-spacing:.22em; text-transform:uppercase; color:var(--steel); margin:54px 0 16px;}
h1{font-family:"Spectral",Georgia,serif; font-weight:300; font-size:clamp(2.3rem,6.2vw,4.2rem); line-height:1.04; margin:0 0 12px; letter-spacing:-.01em; color:var(--ink);}
h1 .num{font-style:italic; font-weight:300;}
.year{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--steel);}
.lead{max-width:54ch; margin:22px 0 0; font-size:clamp(1.05rem,2.2vw,1.25rem); line-height:1.5; font-weight:400; color:var(--ink);}
figure{margin:0;}
.hero{margin:46px 0 8px;}
.hero img{width:100%; height:auto; display:block;}
.cap{font-size:12px; letter-spacing:.02em; color:var(--meta); margin-top:12px; max-width:62ch; line-height:1.55;}
.viz{display:inline-block; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--green); border:1px solid var(--green); border-radius:2px; padding:3px 8px; margin-bottom:14px;}
.meta{display:flex; flex-wrap:wrap; gap:30px 56px; margin:60px 0 8px; padding-top:30px; border-top:1px solid var(--hair);}
.meta .row{min-width:120px;}
.meta .k{font-size:10.5px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--meta); display:block; margin-bottom:7px;}
.meta .v{font-size:15px; line-height:1.4; color:var(--ink);}
.lede{max-width:64ch; margin:54px 0;}
.lede p{font-size:1.02rem; line-height:1.72; margin:0 0 1.25em; color:var(--body);}
.duo{display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:start; margin:30px 0 80px;}
.duo.wide{grid-template-columns:1fr; gap:42px; align-items:stretch; margin-bottom:80px;}
.gallery{display:grid; grid-template-columns:1fr 1fr; gap:30px 30px; margin:30px 0 80px; align-items:start;}
.gallery figure{min-width:0;}
.gallery figure.span{grid-column:1 / -1;}
.gallery img{width:100%; height:auto; display:block;}
.gallery figure:not(.span) img{aspect-ratio:3 / 4; object-fit:cover;}
.duo img{width:100%; height:auto; display:block;}
footer{border-top:1px solid var(--hair); margin-top:30px; padding:34px 0 90px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:24px 40px; font-size:12px; letter-spacing:.04em; color:var(--steel);}
footer a{color:var(--ink); text-decoration:none; border-bottom:1px solid var(--hair); padding-bottom:2px; transition:border-color .25s;}
footer a:hover{border-color:var(--green);}
footer .next a{border:none; font-size:13px; letter-spacing:.08em;}
.reveal{opacity:0; transform:translateY(14px); transition:opacity .9s ease, transform .9s ease;}
.reveal.in{opacity:1; transform:none;}
a:focus-visible, .series a:focus-visible{outline:2px solid var(--green); outline-offset:3px;}
/* overview */
.subtitle{font-size:clamp(1.05rem,2.4vw,1.35rem); color:var(--ink); font-weight:400; margin:0 0 6px; max-width:50ch; line-height:1.4;}
.intro{max-width:64ch; margin:40px 0 6px;}
.intro p{font-size:1.04rem; line-height:1.72; margin:0 0 1.1em; color:var(--body);}
.works{margin:26px 0 40px;}
.work{display:grid; grid-template-columns:1.3fr 1fr; gap:42px; align-items:center;
  padding:46px 0; border-top:1px solid var(--hair); text-decoration:none; color:inherit; position:relative;}
.work:last-child{border-bottom:1px solid var(--hair);}
.work .node{position:absolute; left:-50px; top:50%; transform:translateY(-50%);
  font-size:13px; letter-spacing:.1em; color:var(--steel); background:var(--wall); padding:6px 0;}
.work .thumb{overflow:hidden;}
.work .thumb img{width:100%; height:auto; display:block; transition:transform .6s ease;}
.work:hover .thumb img{transform:scale(1.03);}
.work .wt{font-family:"Spectral",Georgia,serif; font-weight:300; font-size:clamp(1.6rem,3.6vw,2.3rem); line-height:1.08; margin:0 0 10px; color:var(--ink);}
.work .wt .num{font-style:italic;}
.work .wlead{font-size:0.98rem; line-height:1.5; color:#34362F; margin:0 0 12px; max-width:46ch;}
.work .wmeta{font-size:12px; letter-spacing:.04em; color:var(--meta); line-height:1.6;}
.work .go{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--steel); margin-top:16px; display:inline-block; transition:color .25s;}
.work:hover .go{color:var(--green);}
.legal{max-width:72ch; margin:34px 0 50px;}
.legal h2{font-family:"Spectral",Georgia,serif; font-weight:300; font-size:clamp(1.5rem,3.4vw,2rem); margin:54px 0 16px; color:var(--ink); padding-top:26px; border-top:1px solid var(--hair);}
.legal h3{font-family:"Spectral",Georgia,serif; font-weight:400; font-size:1.18rem; margin:30px 0 8px; color:var(--ink);}
.legal p{font-size:1rem; line-height:1.72; margin:0 0 1.05em; color:var(--body);}
.legal .addr{color:var(--ink);}
.legal .hint{font-size:0.92rem; color:var(--steel); margin-top:34px;}
@media (max-width:760px){
  :root{--gutter:16px;}
  .wrap{padding:0 22px 0 44px;}
  .rod .foot{bottom:60px;}
  .meta{gap:24px 36px;}
  .duo{grid-template-columns:1fr; gap:34px;}
  .gallery{grid-template-columns:1fr; gap:34px;}
  header{flex-direction:column; gap:10px; align-items:flex-start;}
  .work{grid-template-columns:1fr; gap:18px;}
  .work .node{position:static; transform:none; display:inline-block; margin-bottom:6px; padding:0;}
}
@media (prefers-reduced-motion:reduce){
  .rod .foot{animation:none; opacity:.92; box-shadow:0 0 18px 4px rgba(95,174,52,.4);}
  .reveal{opacity:1; transform:none; transition:none;}
  .work .thumb img{transition:none;}
}