:root{
  --white:#FFFFFF; --black:#000000; --char:#38383B; --char-2:#2E2E31; --warm:#A8A6A1; --mist:#D9D8D5; --dim:#6E6E72; --line:#E6E5E2;
  --display:'League Gothic','Bebas Neue','Oswald',Impact,sans-serif;
  --body:'Cabin','Helvetica Neue',Arial,sans-serif;
  --btn:'Nunito','Cabin',sans-serif;
  --pad:clamp(20px,5vw,80px);
  --ease:cubic-bezier(.2,.7,.1,1);
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:90px; }
body{ margin:0; background:#fff; color:#000; font-family:var(--body); font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
h1,h2,h3,h4,p,figure,ul,ol,dl,dd{ margin:0; padding:0; } ul,ol{ list-style:none; }
a{ color:inherit; } img{ display:block; max-width:100%; } button{ font:inherit; color:inherit; }
:focus-visible{ outline:2px solid var(--warm); outline-offset:3px; }
::selection{ background:var(--char); color:#fff; }
.wrap{ max-width:1320px; margin:0 auto; padding:0 var(--pad); }
.kicker{ font-family:var(--display); text-transform:uppercase; font-size:clamp(22px,2vw,30px); color:var(--warm); line-height:1; letter-spacing:.02em; text-decoration:none; }
.h2{ font-family:var(--display); font-weight:400; text-transform:uppercase; font-size:clamp(48px,6.4vw,104px); line-height:.9; }
.sl{ font-style:italic; }
.progress-top{ position:fixed; left:0; top:0; height:3px; width:100%; transform-origin:0 50%; transform:scaleX(0); background:var(--warm); z-index:120; }

.js [data-reveal]{ opacity:0; transform:translateY(40px); transition:opacity 1s var(--ease), transform 1.1s var(--ease); }
.js [data-reveal].in{ opacity:1; transform:none; }
.js .wipe{ position:relative; }
.js .wipe::after{ content:""; position:absolute; inset:0; z-index:4; background:var(--cover,#fff); transform-origin:100% 50%; transition:transform 1.3s cubic-bezier(.7,0,.2,1) .1s; }
.js .wipe.in::after{ transform:scaleX(0); }

.pill{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:54px; padding:0 32px; border-radius:300px; border:0; text-decoration:none; font-family:var(--btn); font-weight:800; font-size:14px; cursor:pointer; background:#000; color:#fff; transition:background .35s, color .35s, transform .35s var(--ease); }
.pill:hover{ background:var(--char); }
.pill.ghost{ background:transparent; color:#000; box-shadow:inset 0 0 0 1.5px #000; } .pill.ghost:hover{ background:#000; color:#fff; }
.pill.warm{ background:var(--warm); color:#fff; } .pill.warm:hover{ background:#fff; color:var(--char); }
.dark .pill.ghost{ color:#fff; box-shadow:inset 0 0 0 1.5px #fff; } .dark .pill.ghost:hover{ background:#fff; color:#000; }
.pill .ar{ transition:transform .35s var(--ease); } .pill:hover .ar{ transform:translateX(4px); }

/* header */
.nav{ position:fixed; top:0; left:0; right:0; z-index:100; background:#fff; transition:box-shadow .4s, transform .5s var(--ease); }
.nav.shadow{ box-shadow:0 1px 0 var(--line); } .nav.hide{ transform:translateY(-100%); }
.nav-in{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px clamp(16px,2vw,28px); }
.logo{ display:flex; align-items:center; min-height:52px; text-decoration:none; } .logo img{ height:50px; width:auto; }
.right{ display:flex; align-items:center; gap:clamp(18px,2.4vw,40px); }
.links{ display:flex; align-items:center; gap:clamp(16px,2vw,28px); }
.links a{ font-family:var(--display); font-size:25px; text-transform:uppercase; text-decoration:none; line-height:1; padding:12px 0 10px; position:relative; }
.links a::after{ content:""; position:absolute; left:0; right:100%; bottom:2px; height:2px; background:var(--warm); transition:right .45s var(--ease); }
.links a:hover::after, .links a.on::after{ right:0; }
.icons{ display:flex; align-items:center; gap:6px; }
.icons a{ width:40px; height:40px; display:grid; place-items:center; border-radius:50%; transition:background .3s, color .3s; }
.icons a:hover{ background:#000; color:#fff; } .icons svg{ width:19px; height:19px; }
.burger{ display:none; background:none; border:0; width:44px; height:44px; cursor:pointer; position:relative; }
.burger span{ position:absolute; left:10px; right:10px; height:2px; background:#000; transition:transform .4s var(--ease), top .4s var(--ease); }
.burger span:nth-child(1){ top:17px; } .burger span:nth-child(2){ top:26px; }
.nav.open .burger span:nth-child(1){ top:21px; transform:rotate(45deg); } .nav.open .burger span:nth-child(2){ top:21px; transform:rotate(-45deg); }
@media (max-width:1060px){
  .burger{ display:block; }
  .right{ position:fixed; inset:0; height:100svh; background:#fff; flex-direction:column; justify-content:center; gap:30px; transform:translateY(-100%); visibility:hidden; transition:transform .6s var(--ease), visibility 0s .6s; z-index:-1; }
  .links{ flex-direction:column; gap:4px; } .links a{ font-size:clamp(46px,12vw,64px); }
  .nav.open .right{ transform:none; visibility:visible; transition:transform .6s var(--ease), visibility 0s; }
}

/* project hero */
.p-hero{ padding:clamp(130px,14vw,180px) 0 clamp(40px,5vw,70px); }
.crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; }
.crumbs a{ text-decoration:none; } .crumbs a:hover{ color:#000; } .crumbs .s{ color:var(--mist); font-family:var(--display); font-size:24px; }
.p-title{ font-family:var(--display); font-weight:400; text-transform:uppercase; font-size:clamp(76px,13vw,220px); line-height:.86; margin-top:22px; letter-spacing:.005em; }
.p-title .ln{ display:block; overflow:hidden; padding-bottom:.03em; }
.p-title .wd{ display:inline-block; transform:translateY(105%); animation:rise 1s var(--ease) forwards; }
@keyframes rise{ to{ transform:none; } }
.p-tag{ margin-top:24px; font-size:clamp(19px,1.7vw,24px); line-height:1.4; max-width:44ch; }
.p-tag:empty{ display:none; }
.p-meta{ display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:16px; font-weight:700; font-size:clamp(16px,1.3vw,19px); }
.p-meta span:not(:first-child){ color:var(--dim); font-weight:500; }

.lead{ position:relative; overflow:hidden; display:flex; justify-content:center; background:transparent; }
.lead img{ display:block; width:auto; max-width:100%; height:auto; max-height:86vh; object-fit:contain; }
.lead.contain{ background:#ECEBE8; padding:clamp(20px,4vw,60px); } .lead.contain img{ max-height:calc(86vh - 80px); }
.lead-video{ position:relative; aspect-ratio:16/9; max-height:80vh; background:#000; }

.intro{ display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(36px,6vw,110px); padding:clamp(70px,9vw,130px) 0; }
.facts{ border-top:2px solid #000; align-self:start; position:sticky; top:100px; }
.facts div{ padding:14px 0; border-bottom:1px solid var(--line); }
.facts dt{ font-family:var(--display); text-transform:uppercase; font-size:21px; color:var(--warm); line-height:1.1; }
.facts dd{ font-weight:600; }
.copy{ display:flex; flex-direction:column; gap:20px; }
.copy p{ max-width:66ch; color:#1d1d1f; }
.copy p:first-child{ font-size:clamp(20px,1.75vw,25px); line-height:1.45; color:#000; }
.copy .ext{ display:flex; flex-wrap:wrap; gap:12px; margin-top:10px; }
@media (max-width:900px){ .intro{ grid-template-columns:1fr; } .facts{ position:relative; top:0; } }

.stats{ display:grid; grid-template-columns:repeat(var(--n,3),1fr); padding:clamp(60px,7vw,100px) 0; }
.stats > div{ padding:0 clamp(10px,2vw,30px); border-left:1px solid #545458; }
.stats > div:first-child{ border-left:0; padding-left:0; }
.stats .v{ font-family:var(--display); font-size:clamp(70px,9vw,150px); line-height:.85; color:#fff; display:block; }
.stats .l{ font-family:var(--display); text-transform:uppercase; font-size:clamp(20px,1.8vw,26px); color:var(--warm); line-height:1.05; display:block; margin-top:10px; max-width:16ch; }
@media (max-width:700px){ .stats{ grid-template-columns:1fr; row-gap:36px; } .stats > div{ border-left:0; padding-left:0; } }
.dark{ background:var(--char); color:#fff; }

.gallery{ columns:3 300px; column-gap:clamp(12px,1.4vw,20px); padding-bottom:clamp(60px,8vw,110px); }
.gallery figure{ break-inside:avoid; margin:0 0 clamp(12px,1.4vw,20px); overflow:hidden; cursor:zoom-in; background:#F1F0EE; position:relative; }
.gallery img{ width:100%; height:auto; transition:transform 1.2s var(--ease), filter .6s; }
.gallery figure:hover img{ transform:scale(1.04); }
.gallery figure::after{ content:"+"; position:absolute; right:12px; top:12px; width:38px; height:38px; border-radius:50%; background:#fff; display:grid; place-items:center; font-size:22px; opacity:0; transform:scale(.6); transition:opacity .3s, transform .4s var(--ease); }
.gallery figure:hover::after{ opacity:1; transform:none; }

.sec{ padding:clamp(70px,9vw,130px) 0; position:relative; }
.sec-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 40px; margin-bottom:clamp(34px,4vw,56px); }
.editions{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:0; border-top:1px solid #545458; }
.ed{ padding:26px clamp(14px,1.6vw,26px) 34px 0; border-bottom:1px solid #545458; display:flex; flex-direction:column; gap:10px; }
.ed .n{ font-family:var(--display); font-size:22px; color:var(--warm); line-height:1; }
.ed h3{ font-family:var(--display); font-weight:400; text-transform:uppercase; font-size:clamp(32px,2.8vw,44px); line-height:.95; }
.ed .w{ font-weight:700; color:#E9E8E5; font-size:15px; }
.ed p{ color:#CFCDC9; font-size:15px; }
.artists{ margin-top:36px; color:#CFCDC9; max-width:90ch; font-size:15px; } .artists b{ color:#fff; }

.contrib{ border-top:2px solid #000; counter-reset:c; }
.contrib li{ border-bottom:1px solid var(--line); }
.contrib button{ width:100%; background:none; border:0; text-align:left; cursor:pointer; display:grid; grid-template-columns:70px 1fr 44px; gap:16px; align-items:center; padding:clamp(16px,2vw,24px) 0; }
.contrib .n{ font-family:var(--display); font-size:24px; color:var(--warm); }
.contrib .t{ font-family:var(--display); text-transform:uppercase; font-size:clamp(28px,3vw,46px); line-height:.95; transition:transform .5s var(--ease); }
.contrib button:hover .t{ transform:translateX(12px); }
.contrib .pl{ width:44px; height:44px; border-radius:50%; box-shadow:inset 0 0 0 1.5px #000; display:grid; place-items:center; transition:transform .45s var(--ease), background .3s, color .3s; }
.contrib li.open .pl{ transform:rotate(45deg); background:#000; color:#fff; }
.contrib .b{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .55s var(--ease); }
.contrib li.open .b{ grid-template-rows:1fr; }
.contrib .b > div{ overflow:hidden; }
.contrib .b p{ padding:0 60px 26px 86px; max-width:80ch; color:#2A2A2C; }
@media (max-width:640px){ .contrib button{ grid-template-columns:40px 1fr 44px; } .contrib .b p{ padding:0 0 22px 56px; } }

.videos{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr)); gap:20px; }
.vid{ position:relative; aspect-ratio:16/9; background:#000; overflow:hidden; cursor:pointer; border:0; padding:0; width:100%; }
.vid img{ width:100%; height:100%; object-fit:cover; opacity:.75; transition:opacity .4s, transform 1.2s var(--ease); }
.vid:hover img{ opacity:.95; transform:scale(1.04); }
.vid .play{ position:absolute; left:50%; top:50%; width:84px; height:84px; margin:-42px 0 0 -42px; border-radius:50%; background:#fff; display:grid; place-items:center; transition:transform .4s var(--ease); }
.vid:hover .play{ transform:scale(1.1); }
.vid .play::before{ content:""; border-left:22px solid #000; border-top:13px solid transparent; border-bottom:13px solid transparent; margin-left:6px; }
.vid iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

.related{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:30px; }

.next{ display:block; text-decoration:none; padding:clamp(70px,9vw,140px) 0; background:#000; color:#fff; position:relative; overflow:hidden; }
.next .kicker{ display:block; }
.next .big{ font-family:var(--display); text-transform:uppercase; font-size:clamp(70px,12vw,200px); line-height:.86; margin-top:14px; display:flex; align-items:center; gap:.2em; transition:transform .8s var(--ease); }
.next:hover .big{ transform:translateX(24px); }
.next .big .ar{ font-size:.5em; color:var(--warm); }
.next img{ position:absolute; right:var(--pad); top:50%; width:clamp(160px,22vw,340px); aspect-ratio:4/3; object-fit:cover; transform:translateY(-50%) rotate(4deg) scale(.9); opacity:0; transition:opacity .5s, transform .7s var(--ease); }
.next:hover img{ opacity:1; transform:translateY(-50%) rotate(-2deg) scale(1); }
@media (hover:none){ .next img{ opacity:.35; } }

.others{ padding:clamp(50px,6vw,80px) 0; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.chips a{ text-decoration:none; font-weight:600; font-size:14px; border:1px solid var(--line); border-radius:300px; padding:8px 16px; background:#FAFAF9; transition:background .3s, color .3s, border-color .3s; }
.chips a:hover, .chips a.on{ background:#000; color:#fff; border-color:#000; }

/* category page */
.cat-intro{ max-width:58ch; font-size:clamp(18px,1.5vw,22px); margin-top:26px; }
.grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(30px,3vw,46px) clamp(16px,1.8vw,26px); padding:clamp(40px,5vw,70px) 0 clamp(80px,9vw,130px); }
.gcard{ text-decoration:none; display:flex; flex-direction:column; gap:12px; }
.gcard .m{ position:relative; aspect-ratio:4/3.2; overflow:hidden; background:var(--char); }
.gcard .m img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease); }
.gcard:hover .m img{ transform:scale(1.06); }
.gcard .m .lab{ position:absolute; inset:0; display:flex; align-items:flex-end; padding:20px; font-family:var(--display); text-transform:uppercase; font-size:clamp(40px,3.6vw,60px); line-height:.88; color:#fff; background:var(--char); }
.gcard .num{ position:absolute; top:12px; left:12px; z-index:2; font-family:var(--display); font-size:21px; line-height:1; background:#fff; padding:7px 12px 5px; border-radius:300px; }
.gcard h3{ font-family:var(--display); font-weight:400; text-transform:uppercase; font-size:clamp(30px,2.6vw,42px); line-height:.95; transition:color .3s; }
.gcard:hover h3{ color:var(--dim); }
.gcard p{ font-size:14px; color:var(--dim); font-weight:600; }
@media (max-width:980px){ .grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .grid{ grid-template-columns:1fr; } }
.cat-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-top:30px; }
.cat-tabs a{ text-decoration:none; font-family:var(--display); text-transform:uppercase; font-size:22px; line-height:1; padding:11px 18px 9px; border-radius:300px; box-shadow:inset 0 0 0 1.5px #000; transition:background .3s, color .3s; }
.cat-tabs a:hover, .cat-tabs a.on{ background:#000; color:#fff; }

/* lightbox */
.lb{ position:fixed; inset:0; z-index:300; background:rgba(20,20,22,.96); display:grid; place-items:center; opacity:0; visibility:hidden; transition:opacity .4s, visibility 0s .4s; }
.lb.on{ opacity:1; visibility:visible; transition:opacity .4s; }
.lb img{ max-width:min(92vw,1500px); max-height:84vh; object-fit:contain; transform:scale(.96); transition:transform .5s var(--ease); }
.lb.on img{ transform:none; }
.lb button{ position:absolute; background:none; border:0; color:#fff; cursor:pointer; font-family:var(--display); font-size:30px; width:60px; height:60px; border-radius:50%; transition:background .3s; }
.lb button:hover{ background:rgba(255,255,255,.12); }
.lb .x{ top:18px; right:18px; } .lb .pv{ left:14px; top:50%; margin-top:-30px; } .lb .nx{ right:14px; top:50%; margin-top:-30px; }
.lb .ct{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%); color:var(--warm); font-family:var(--display); font-size:22px; }

/* contact band + footer */
.cta-band{ padding:clamp(70px,8vw,120px) 0; text-align:center; }
.cta-band .h2{ color:#fff; }
.cta-band p{ color:#E9E8E5; max-width:50ch; margin:20px auto 30px; }
footer{ padding:40px 0 50px; }
.foot{ display:grid; grid-template-columns:1fr 1fr; gap:24px 40px; align-items:start; max-width:700px; margin:0 auto; }
.foot .l{ display:flex; flex-direction:column; align-items:flex-end; gap:12px; text-align:right; }
.foot .ks{ display:block; height:64px; width:auto; }
.foot .r a{ display:block; text-transform:uppercase; font-size:15px; line-height:1.7; text-underline-offset:3px; }
.foot .r a:hover{ color:var(--warm); } .foot .icons a{ width:36px; height:36px; }
@media (max-width:560px){ .foot{ grid-template-columns:1fr; text-align:center; } .foot .l{ align-items:center; text-align:center; } .foot .r{ text-align:center; } }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .js [data-reveal]{ opacity:1; transform:none; } .js .wipe::after{ display:none; }
}

.vid.short{ aspect-ratio:9/16; max-width:min(380px,100%); max-height:none; margin:0 auto; display:block; }
.vid.playlist img{ opacity:.6; }
.videos .vid.short{ justify-self:center; }

.vfig{ margin:0; display:flex; flex-direction:column; gap:10px; }
.vfig.lead-vfig{ align-items:stretch; }
.vlink{ align-self:flex-start; font-family:var(--btn); font-weight:800; font-size:13px; text-decoration:none; color:var(--dim); border-bottom:1px solid currentColor; padding-bottom:2px; transition:color .3s; }
.vlink:hover{ color:var(--black); }
.vfig:has(.vid.short) .vlink{ align-self:center; }
.vid.vid-ext::after{ content:"Opens on YouTube"; position:absolute; left:50%; bottom:16px; transform:translateX(-50%); font-family:var(--btn); font-weight:800; font-size:12px; color:#fff; background:rgba(0,0,0,.55); padding:6px 12px; border-radius:300px; white-space:nowrap; }