*{box-sizing:border-box}
html,body{margin:0;background:#fbfbfa;color:#141413;-webkit-font-smoothing:antialiased}
a{color:#141413;text-decoration:none}
a:hover{color:#8e8d88}
img{max-width:100%}
:root{--px:clamp(16px,2.6vw,40px);--py:clamp(16px,2.2vw,28px);--ease:cubic-bezier(.2,.7,.2,1)}
.site{font-family:'Inter Tight',system-ui,sans-serif;font-size:13px;line-height:1.25;text-transform:uppercase;background:#fbfbfa;color:#141413}
.muted{color:#8e8d88}
.r{text-align:right}
button{all:unset;cursor:pointer}

/* header */
.site-header{position:fixed;left:0;right:0;top:0;z-index:20;background:#fbfbfa;padding:var(--py) var(--px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:start;pointer-events:none}
.logo{grid-column:1 / span 4;font-size:clamp(20px,2.2vw,30px);font-weight:400;letter-spacing:.32em;line-height:1;pointer-events:auto}
.nav{grid-column:7 / span 4;display:flex;flex-wrap:wrap;gap:8px 24px;pointer-events:auto}
.nav a{color:#a9a8a3}
.nav a:hover{color:#a9a8a3}
.nav a.is-active,.nav a.is-active:hover{color:#141413}
.side{grid-column:11 / span 2;justify-self:end;display:flex;gap:24px;pointer-events:auto}
.about-link,.about-link:hover{color:#141413}

/* recent (list) */
.stage{position:relative;height:100vh}
.stage-sticky{position:sticky;top:0;height:100vh;overflow:hidden;user-select:none;-webkit-user-select:none}
.strip{position:absolute;left:50%;top:0;display:flex;flex-direction:column;gap:6px;will-change:transform}
.strip img{display:block;width:100%;flex:none;object-fit:cover;background:#ecebe7;cursor:pointer;transform:scale(.88);transition:transform .45s var(--ease)}
.strip img.is-active{transform:scale(1)}
.strip img.is-nocursor{cursor:none}
.l-info{position:absolute;left:var(--px);right:var(--px);top:50%;transform:translateY(-50%);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px 16px;align-items:center;align-content:start;pointer-events:none}
.l-name{grid-column:1 / span 3;height:16px;position:relative}
.l-names{position:absolute;left:0;top:0;display:flex;flex-direction:column;pointer-events:auto;transition:transform .45s var(--ease)}
.l-names span{height:16px;line-height:16px;white-space:nowrap;color:#a9a8a3;transition:color .3s ease;cursor:pointer}
.l-names span.is-active{color:#141413}
.l-year{grid-column:4 / span 2}
.l-med{grid-column:9 / span 2}
.l-com{grid-column:11 / span 2;text-align:right}
.l-foot{position:absolute;left:var(--px);right:var(--px);bottom:var(--py);display:flex;justify-content:space-between;align-items:flex-end;gap:16px;pointer-events:none}
.see-more{pointer-events:auto;font-size:11px;color:#141413;border-bottom:1px solid #141413;padding-bottom:1px}
.see-more:hover{color:#8e8d88;border-color:#8e8d88}
.l-prog{color:#8e8d88;font-size:11px}

/* archive (grid) */
.grid{padding:clamp(96px,16vh,160px) var(--px) 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:40px 6px}
.g-item{display:flex;flex-direction:column;gap:10px;cursor:pointer;outline:none}
.g-item.has-project{cursor:none}
.g-item img{display:block;width:100%;aspect-ratio:3 / 4;object-fit:cover;background:#ecebe7}
.g-cap{display:flex;gap:24px}
.g-title{flex:1;min-width:0}

/* shared page */
.page-main{padding:clamp(96px,16vh,160px) var(--px) 0;display:flex;flex-direction:column;gap:clamp(40px,7vh,72px)}
.spacer,.title-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:end}
.page-title{grid-column:1 / span 6;margin:0;font-size:clamp(28px,3.4vw,48px);font-weight:300;letter-spacing:-.02em;line-height:1;text-transform:none}
.count{grid-column:12 / span 1;text-align:right}
.frame{position:relative;background:#ecebe7;overflow:hidden}
.frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

/* exhibitions */
.exh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:56px 16px}
.exh{display:flex;flex-direction:column;gap:12px}
.exh-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;border-top:1px solid #141413;padding-top:10px}

/* articles */
.a-list{display:flex;flex-direction:column;border-top:1px solid #141413}
.a-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:start;padding:16px 0;border-bottom:1px solid #e2e0da;cursor:pointer;color:#141413;outline:none}
.a-row:hover{background:#f3f2ef;color:#141413}
.a-thumb{grid-column:1 / span 2}
.a-pub{grid-column:3 / span 4;display:flex;flex-direction:column;gap:4px}
.a-title{grid-column:7 / span 3;text-transform:none;font-size:15px;line-height:1.3}
.a-type{grid-column:10 / span 2}
.a-cta{grid-column:12 / span 1;text-align:right}

/* about */
.signature{padding:clamp(110px,18vh,180px) var(--px) 0;display:flex;justify-content:center}
.signature span{font-family:'Mrs Saint Delafield',cursive;font-size:clamp(88px,15vw,220px);line-height:1;text-transform:none;letter-spacing:0;color:#141413;transform:rotate(-4deg);white-space:nowrap}
.about{min-height:60vh;padding:clamp(56px,10vh,110px) var(--px) 0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;border-top:1px solid #e2e0da}
.ab-label{grid-column:span 3}
.ab-text{grid-column:span 6;display:flex;flex-direction:column;gap:1em;font-size:18px;line-height:1.45;text-transform:none}
.ab-text p{margin:0;text-wrap:pretty}

/* footer */
.site-footer{padding:clamp(80px,14vh,160px) var(--px) var(--py);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:end}
.ft-lead,.ft-mail{font-size:clamp(20px,5vw,72px);font-weight:300;letter-spacing:-.03em;line-height:1;text-transform:none}
.ft-lead{grid-column:1 / -1;color:#8e8d88}
.ft-mail{grid-column:span 8;overflow-wrap:anywhere}
.ft-side{grid-column:span 4;display:flex;justify-content:flex-end;gap:24px}

/* custom cursor */
.cursor{position:fixed;left:0;top:0;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;pointer-events:none;z-index:30;color:#141413}
.cursor[hidden]{display:none}
.cursor-box{width:9px;height:9px;border:1px solid #141413;background:#fbfbfa}
.cursor-text{background:#fbfbfa;padding:1px 3px}

/* overlays */
.overlay{position:fixed;inset:0;background:#fbfbfa;z-index:50}
.overlay[hidden]{display:none}
.overlay.is-project{overflow:auto}
.overlay.is-simple{display:grid;grid-template-rows:auto 1fr auto;padding:var(--py) var(--px);gap:20px;cursor:zoom-out}
.o-bar{display:flex;justify-content:space-between}
.o-img{min-height:0;display:flex;justify-content:center;gap:16px}
.o-img img{display:block;min-width:0;max-width:100%;max-height:100%;object-fit:contain}
.o-img.is-pair img{max-width:50%}
.o-meta{display:flex;justify-content:space-between;gap:16px;color:#8e8d88}
.o-caption{text-transform:none}
.p-bar{position:sticky;top:0;background:#fbfbfa;display:flex;justify-content:space-between;padding:var(--py) var(--px)}
.p-body{padding:clamp(24px,6vh,64px) var(--px) clamp(48px,10vh,120px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px 16px;align-items:start}
.p-info{grid-column:1 / span 4;display:flex;flex-direction:column;gap:32px;min-width:0}
.p-info h1{margin:0;font-size:clamp(28px,3.4vw,48px);font-weight:300;letter-spacing:-.02em;line-height:1.05}
.p-rows{display:grid;grid-template-columns:96px 1fr;gap:8px 16px}
.p-imgs{grid-column:6 / span 7;display:flex;flex-direction:column;gap:16px}
.p-imgs img{display:block;width:100%;height:auto;background:#ecebe7}

/* mobile */
@media (max-width:699px){
  .logo{grid-column:1 / -1}
  .nav{grid-column:1 / span 8;gap:8px 14px}
  .side{grid-column:9 / span 4;gap:14px}
  .l-info{left:0;right:0;top:auto;bottom:0;transform:none;padding:16px 16px 48px;background:#fbfbfa;min-height:112px}
  .l-name{grid-column:1 / span 8;overflow:hidden}
  .l-year{grid-column:9 / span 4;text-align:right}
  .l-med{display:none}
  .l-com{grid-column:1 / -1;text-align:left}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .a-thumb{grid-column:1 / span 4;grid-row:span 3}
  .a-pub,.a-title{grid-column:5 / span 8}
  .a-type{grid-column:5 / span 5}
  .a-cta{grid-column:10 / span 3}
  .ab-label,.ab-text,.ft-mail,.ft-side,.p-info,.p-imgs{grid-column:1 / -1}
  .ft-side{justify-content:flex-start}
}
