:root{--paper:#F5F4F0;--ink:#1A1A1A;--mute:#6C6B66;--rule:#D8D6CE;--wash:#EAE8E1;--serif:'Newsreader','Iowan Old Style',Georgia,serif;--sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;--m:5vw;box-sizing:border-box}
*,*::before,*::after{box-sizing:inherit}
html{background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 20px/1.66 var(--serif);font-feature-settings:'kern','liga','onum';hanging-punctuation:first;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
@media (max-width:600px){body{font-size:19px}}
a{color:inherit;text-underline-offset:.28em;text-decoration-thickness:1px}
a:hover{color:var(--mute)}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
img{display:block;width:100%;height:auto}
p{margin:0 0 1.3em}
h1,h2,h3{font-family:var(--serif);font-weight:300;margin:0;font-optical-sizing:auto}
.skip{position:absolute;left:-999px;top:8px;background:var(--paper);padding:8px 12px;z-index:50}
.skip:focus{left:8px}
header.top{position:sticky;top:0;z-index:30;display:flex;justify-content:space-between;align-items:center;gap:24px;background:var(--paper);padding:calc(18px + env(safe-area-inset-top,0px)) var(--m) 18px}
.brand{font:400 19px/1 var(--serif);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
body.home .brand{visibility:hidden}
#nav{display:flex;gap:clamp(18px,2.2vw,34px);font-size:14px;letter-spacing:.11em;text-transform:uppercase}
#nav a,#menu a{text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px}
#nav a.on,#menu a.on{border-bottom-color:var(--ink)}
#mbtn{display:none;background:none;border:0;font:inherit;font-size:16px;color:var(--ink);padding:10px 0;cursor:pointer}
#menu{position:fixed;inset:0;z-index:40;background:var(--paper);display:flex;flex-direction:column;justify-content:center;gap:18px;padding:0 var(--m);font:300 clamp(24px,6.4vw,34px)/1.2 var(--serif);letter-spacing:.08em;text-transform:uppercase}
#menu[hidden]{display:none}
@media (max-width:1040px){#nav{display:none}#mbtn{display:block}}
main{min-height:70vh;outline:0}
.pad{padding:0 var(--m)}
.t1{font:300 clamp(46px,7vw,104px)/1.02 var(--serif);letter-spacing:-.015em}
.t2{font:300 clamp(28px,3.8vw,56px)/1.18 var(--serif);letter-spacing:-.01em}
.t3{font:300 clamp(30px,3.2vw,46px)/1.12 var(--serif)}
.col{max-width:660px}
.muted{color:var(--mute)}
.pagehead{padding:clamp(40px,7vw,100px) var(--m) clamp(56px,9vw,130px)}
.pagehead .t2{margin-top:clamp(24px,3vw,44px);max-width:20em}
/* home */
.hname{display:block;font:400 clamp(18px,1.6vw,22px)/1.3 var(--sans);margin-bottom:14px}
.home-t{padding:clamp(24px,5vw,72px) var(--m) clamp(36px,5vw,72px)}
.home-t h1{font-weight:300}
.home-t .t1{display:block;font-size:clamp(52px,9vw,140px);line-height:.98}
.himg{margin:0 0 0 auto;width:calc(100% - 12vw)}
.himg img{animation:rise 2.6s ease both}
@keyframes rise{from{opacity:0}to{opacity:1}}
.hlinks{display:flex;gap:40px;padding:clamp(36px,5vw,72px) var(--m) 0;font:300 clamp(24px,2.6vw,34px)/1.2 var(--serif)}
.hlinks a{text-decoration:none;border-bottom:1px solid var(--ink)}
@media (max-width:700px){.himg{width:100%}}
/* the work */
.w{display:flex;flex-wrap:wrap;gap:2.5vw;align-items:flex-end;margin:0 var(--m) clamp(90px,14vw,220px)}
.w .main,.w .second{display:block}
.w .wt{flex:1 0 100%;order:3;display:block;text-decoration:none;text-transform:uppercase;letter-spacing:.06em}
.w a{text-decoration:none}
.w .wt:hover{color:var(--mute)}
.ph{background:var(--wash);color:var(--mute);aspect-ratio:3/2;display:grid;place-items:center;font-size:16px;text-align:center;padding:16px}
@media (max-width:700px){.w{margin-inline:var(--m)}.w>*{width:100%!important;margin-left:0!important}}
/* galleries */
.gal{padding:0 var(--m)}
.gi{margin-inline:auto}
.s-xl{width:100%}.s-l{width:78%}.s-m{width:54%}.s-s{width:34%}
.a-l{margin-left:0}.a-r{margin-right:0}
.gap-s{margin-top:6vw}.gap-m{margin-top:12vw}.gap-l{margin-top:22vw}
.gp{display:flex;gap:3vw;align-items:flex-end;justify-content:center}
.gp>img{flex:1 1 0;min-width:0;width:auto}
@media (max-width:700px){.s-l{width:100%}.s-m{width:88%}.s-s{width:70%}}
.nxt{padding:clamp(80px,14vw,200px) var(--m) 0;font:300 clamp(22px,2.4vw,30px)/1.3 var(--serif)}
.nxt a{text-decoration:none;border-bottom:1px solid var(--ink)}
/* manifesto */
.man{padding:clamp(40px,6vw,90px) var(--m) 0}
.man p{font:300 clamp(30px,4.6vw,68px)/1.14 var(--serif);letter-spacing:-.012em;margin:0 0 clamp(90px,15vw,220px);max-width:18em}
.man p.r{margin-left:auto}.man p.m{margin-left:14%}
.man p.end{font-size:clamp(64px,14vw,220px);line-height:.95;margin-bottom:clamp(60px,8vw,120px)}
.man .title{font:400 clamp(18px,1.6vw,22px)/1.3 var(--sans);margin:0 0 clamp(70px,10vw,140px);max-width:none}
@media (max-width:700px){.man p.m{margin-left:0}}
/* long form */
.long{padding:0 var(--m) clamp(60px,9vw,120px)}
.long .t2{max-width:16em;margin-bottom:clamp(48px,7vw,96px)}
.long p{max-width:660px}
.long .pull{font:300 clamp(28px,3.6vw,52px)/1.18 var(--serif);letter-spacing:-.01em;max-width:18em;margin:1.1em 0 1.3em}
.sig{margin-top:3em}.sig p{margin:0}
.chap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--m);padding:clamp(56px,8vw,120px) 0 0}
.chap .sans .grp p:first-child::first-line{font-variant-caps:small-caps;letter-spacing:.05em}
.num{display:block;font:300 clamp(26px,2.6vw,36px)/1 var(--serif);color:var(--mute);letter-spacing:.06em;margin:0 0 .5em}
.pagehead .num{margin-bottom:clamp(20px,3vw,40px)}
.w .wt .num{display:inline;font-size:.62em;margin:0 .9em 0 0;vertical-align:.15em}
.chap .lab .num{margin-bottom:.6em}
h1,h2,h3,.ttl,.t1,.t2,.t3{text-wrap:balance}
main{animation:turn .8s ease both}
@keyframes turn{from{opacity:0}to{opacity:1}}
#nav,#mbtn,.frm,footer,.ph,.note,.art .info{font-family:var(--sans)}
.art .info{font-size:16px}
footer .col2{display:flex;flex-direction:column;gap:2px}
footer .col2 span:last-child{color:var(--mute);font-size:14px}
@media (max-width:760px){.chap{grid-template-columns:1fr;gap:10px}}
.quote{font:300 clamp(28px,3.8vw,56px)/1.2 var(--serif);max-width:18em;margin:clamp(70px,10vw,140px) 0 0}
.quote span{display:block}
.art{margin:0 0 clamp(90px,14vw,200px)}
.art .info{max-width:520px;padding-top:20px;font-size:16px;line-height:1.7}
.art .info p{margin:0 0 .5em}
.areas{list-style:none;padding:0;margin:0 0 2em;font:300 clamp(26px,3vw,40px)/1.4 var(--serif)}
.cta{display:inline-block;font:500 15px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:3px}
.ttl{font:300 clamp(34px,5.2vw,76px)/1.05 var(--serif);letter-spacing:.05em;text-transform:uppercase;max-width:14em}
.serif .grp{margin:0 0 clamp(70px,11vw,170px)}
.serif .grp p{font:300 clamp(24px,2.8vw,40px)/1.32 var(--serif);letter-spacing:-.005em;max-width:24em;margin:0 0 .9em}
.serif .grp p.pull{font-size:clamp(34px,4.8vw,70px);line-height:1.12;max-width:16em;letter-spacing:-.012em}
.serif .grp p.end{font-size:clamp(64px,14vw,220px);line-height:.95;letter-spacing:0}
.serif .grp:nth-child(3n+2){margin-left:10%}.serif .grp:nth-child(3n){margin-left:22%}
@media (max-width:700px){.serif .grp:nth-child(n){margin-left:0}}
.sans .grp{margin:0 0 clamp(48px,7vw,96px)}
.sans .grp p{font:400 clamp(19px,1.5vw,21px)/1.7 var(--serif);max-width:34em;margin:0 0 .9em;text-wrap:pretty}
.sans .grp p.pull{font:300 clamp(30px,4vw,58px)/1.15 var(--serif);max-width:16em;margin:.3em 0}
@media (max-width:600px){.sans .grp p{font-size:19px}}
.lab{font:500 14px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;margin:0}
.chap .sans .grp{margin:0}
.plist{list-style:none;padding:0;margin:0 0 2.2em;font:500 15px/2.1 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.plist a{text-decoration:none;border-bottom:1px solid var(--ink)}
.kv{margin:0 0 1.6em}.kv div{display:flex;gap:24px;max-width:560px;border-top:1px solid var(--rule);padding:10px 0}.kv dt{flex:0 0 120px;font:500 14px/1.7 var(--sans);letter-spacing:.14em;text-transform:uppercase}.kv dd{margin:0}

.frm{display:flex;flex-direction:column;gap:22px;max-width:560px;margin-top:clamp(40px,6vw,80px)}
.frm label{display:flex;flex-direction:column;font-size:15px;color:var(--mute)}
.frm input,.frm textarea{background:transparent;border:0;border-bottom:1px solid var(--ink);border-radius:0;color:var(--ink);font:inherit;font-size:18px;padding:10px 0;resize:vertical}
.frm input:focus,.frm textarea:focus{outline:0;border-bottom-width:2px}
.frm button{align-self:flex-start;background:none;border:0;border-bottom:1px solid var(--ink);padding:0 0 2px;font:300 28px/1.2 var(--serif);color:var(--ink);cursor:pointer}
.frm button:hover{color:var(--mute);border-color:var(--mute)}
footer{margin-top:clamp(90px,12vw,180px);padding:40px var(--m) calc(40px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;justify-content:space-between;gap:18px 40px;font-size:16px}
footer nav{display:flex;flex-wrap:wrap;gap:8px 28px}
footer a{text-decoration:none;border-bottom:1px solid var(--rule)}
#toast{position:fixed;left:var(--m);right:var(--m);bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:60;max-width:560px;background:var(--ink);color:var(--paper);font:16px/1.5 var(--sans);padding:14px 18px;cursor:pointer;user-select:text}
#toast[hidden]{display:none}

/* magazine layer */
.phero{position:relative;min-height:min(74svh,780px);display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.phero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phero::after,.band::after{content:"";position:absolute;inset:0;background:rgba(15,15,15,.5)}
.phero .inner{position:relative;z-index:1;width:100%;padding:clamp(80px,10vw,150px) var(--m) clamp(36px,5vw,72px)}
.phero .ttl{color:#fff}
.phero .t2{color:#fff;margin:clamp(20px,2.4vw,36px) 0 0;max-width:20em}
.phero+.pad{padding-top:clamp(70px,10vw,150px)}
.band{position:relative;min-height:min(92svh,1000px);display:flex;align-items:center;color:#fff;overflow:hidden;margin:clamp(70px,10vw,150px) 0}
.band>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.band .inner{position:relative;z-index:1;width:100%;padding:clamp(70px,9vw,140px) var(--m)}
.band .grp{margin:0!important}
.band .grp p,.band .grp p.pull,.band .grp p.end{color:#fff!important}
.fb{margin:clamp(70px,10vw,150px) 0}
.fb img{width:100%;height:auto}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--m);align-items:center;margin:clamp(70px,10vw,150px) 0}
.split figure{margin:0}
.split .serif .grp{margin:0}
@media (max-width:760px){.split{grid-template-columns:1fr}}
.off.m{margin-left:12%}.off.r{margin-left:24%}
@media (max-width:700px){.off.m,.off.r{margin-left:0}}
.plate{margin:0 0 clamp(90px,14vw,200px)}
.plate img{width:100%;height:auto}
.plate.full .pinfo{padding-top:26px}
.pstory{max-width:34rem}
.pstory p{font:300 clamp(24px,2.6vw,38px)/1.3 var(--serif);margin:0}
.pstory.lg p{font-size:clamp(20px,1.9vw,27px);line-height:1.5;margin:0 0 .85em}
.pstory.lg{max-width:38rem}
.plate.full .pstory{margin-bottom:clamp(36px,5vw,70px)}
.plate.full .pstory.m{margin-left:12%}.plate.full .pstory.r{margin-left:24%}
.plate.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);grid-template-areas:"story fig" "info fig";gap:clamp(28px,4vw,56px) var(--m)}
.plate.split.r{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-areas:"fig story" "fig info"}
.plate.split .pstory{grid-area:story;align-self:start;margin:0}
.plate.split figure{grid-area:fig;align-self:center}
.plate.split .pinfo{grid-area:info;align-self:end}
.plate figure{margin:0}
.pinfo .kv{margin-bottom:1.2em}
@media (max-width:760px){.plate.split,.plate.split.r{grid-template-columns:1fr;grid-template-areas:none;gap:26px}.plate.split .pstory,.plate.split figure,.plate.split .pinfo{grid-area:auto}.plate.full .pstory.m,.plate.full .pstory.r{margin-left:0}}
.coll{background:#0F0F0F;color:#EDEDEB;margin:clamp(90px,14vw,200px) 0 0;padding:clamp(80px,12vw,180px) var(--m) clamp(50px,7vw,100px)}
.coll .ttl,.coll .t2{color:#fff}
.coll .t2{margin:clamp(20px,2.4vw,36px) 0 clamp(70px,10vw,150px)}
.coll .muted,.coll .kv dt{color:#9A9994}
.coll a{color:#EDEDEB}
.coll .kv div{border-top-color:#2B2B29}
.coll .ph{background:#1A1A19;color:#9A9994}
.coll .pstory p{color:#EDEDEB}
.coll .plate:last-child{margin-bottom:0}
main:has(.coll)+footer{margin-top:0}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}