
@font-face{font-family:'Newsreader';font-style:normal;font-weight:300 500;font-display:swap;src:url('/assets/fonts/newsreader.woff2') format('woff2');}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:300 500;font-display:swap;src:url('/assets/fonts/newsreader-italic.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-500.woff2') format('woff2');}

:root{
  --paper:#FBFAF7; --ink:#15120F; --soft:#6E675E; --rule:#E4E0D8; --hair:#EFECE5;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.wrap{max-width:1160px;margin:0 auto;padding:0 48px}
.narrow{max-width:660px;margin:0 auto;padding:0 48px}

/* header */
header.site{padding:34px 0 0}
header.site .wrap{display:flex;justify-content:space-between;align-items:baseline;gap:30px;flex-wrap:wrap}
.brand{font-size:19px;letter-spacing:-.01em}
nav.site a{font-family:var(--sans);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--soft);margin-left:28px}
nav.site a:hover{color:var(--ink)}

/* intro */
.intro{padding:96px 0 78px}
.intro h1{font-size:clamp(36px,5vw,60px);font-weight:400;line-height:1.08;letter-spacing:-.022em;max-width:16ch;margin-bottom:34px}
.intro p{font-size:20px;line-height:1.62;max-width:56ch;color:var(--ink)}
.intro p + p{margin-top:20px}
.dek{font-family:var(--sans);font-size:11px;letter-spacing:.17em;text-transform:uppercase;color:var(--soft);margin-bottom:30px}

/* sequence */
.seq{border-top:1px solid var(--rule)}
.work{padding:78px 0;border-bottom:1px solid var(--hair);display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:56px;align-items:start}
.work .img{background:var(--hair)}
.work .img img{width:100%;display:block}
.label{font-family:var(--sans);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--soft);line-height:2}
.work h2{font-size:27px;font-weight:400;letter-spacing:-.02em;margin:2px 0 16px}
.work .blurb{font-size:16.5px;line-height:1.6;color:var(--soft);margin-bottom:18px}
.more{font-family:var(--sans);font-size:11px;letter-spacing:.13em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:2px}

/* painting page */
.pmeta{padding:74px 0 0}
.back{font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
.ptitle{font-size:clamp(34px,4.4vw,52px);font-weight:400;letter-spacing:-.022em;margin:26px 0 14px}
.pspecs{font-family:var(--sans);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--soft);padding-bottom:34px;border-bottom:1px solid var(--rule)}
.plate{padding:44px 0 12px}
.plate img{width:100%;display:block}
.cap{font-family:var(--sans);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--soft);padding:14px 0 0}
.essay{padding:56px 0 10px}
.epi{font-style:italic;font-size:19px;line-height:1.62;color:var(--soft);border-left:1px solid var(--rule);padding-left:22px;margin-bottom:34px}
.epi cite{display:block;font-style:normal;font-family:var(--sans);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;margin-top:12px}
.essay p{margin-bottom:22px}
.lyric{font-style:italic;color:var(--soft);border-left:1px solid var(--rule);padding-left:22px;margin:26px 0}
.process{padding:74px 0 30px;border-top:1px solid var(--rule);margin-top:66px}
.phead{font-family:var(--sans);font-size:11px;letter-spacing:.17em;text-transform:uppercase;color:var(--soft);margin-bottom:8px}
.pnote{font-size:16.5px;color:var(--soft);max-width:52ch;margin-bottom:38px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.grid img{width:100%;display:block;background:var(--hair)}
.pager{display:flex;justify-content:space-between;gap:24px;padding:56px 0 100px;border-top:1px solid var(--rule);margin-top:60px;font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
footer.site{border-top:1px solid var(--rule);padding:38px 0 70px;font-family:var(--sans);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--soft)}
footer.site .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.divider{padding:64px 0;text-align:center;font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}

@media (max-width:820px){
  .wrap,.narrow{padding:0 22px}
  .work{grid-template-columns:1fr;gap:22px;padding:48px 0}
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .intro{padding:56px 0 44px}
  nav.site a{margin-left:0;margin-right:20px}
  header.site .wrap{gap:14px}
}

/* grief series — more air than anywhere else */
.gs-open{padding:120px 0 96px}
.gs-open .dek{margin-bottom:34px}
.gs-open h1{font-size:clamp(38px,5.2vw,62px);font-weight:400;line-height:1.06;letter-spacing:-.022em;max-width:15ch;margin-bottom:46px}
.gs-open p{font-size:19.5px;line-height:1.7;margin-bottom:24px}
.stage{padding:120px 0;border-top:1px solid var(--hair)}
.stage .n{font-family:var(--sans);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);margin-bottom:14px}
.stage h2{font-size:clamp(28px,3.4vw,40px);font-weight:400;letter-spacing:-.02em;margin-bottom:40px}
.stage .plate img{width:100%;display:block;background:var(--hair)}
.stage .words{padding-top:38px;font-size:19px;line-height:1.7;color:var(--ink);max-width:46ch}
.whole{padding:130px 0 110px;border-top:1px solid var(--rule)}
.whole img{width:100%;display:block;background:var(--hair)}
.whole .cap{padding-top:18px}
.close{padding:0 0 150px;text-align:center}
.close p{font-size:23px;line-height:1.55;font-style:italic;color:var(--ink);max-width:30ch;margin:0 auto 18px}
.close cite{font-family:var(--sans);font-style:normal;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft)}

/* about */
.about{padding:96px 0 40px}
.about h1{font-size:clamp(34px,4.4vw,52px);font-weight:400;letter-spacing:-.022em;margin-bottom:44px}
.about p{font-size:19px;line-height:1.72;margin-bottom:24px}
.about em{font-style:italic}
.commission{margin-top:44px;padding-top:34px;border-top:1px solid var(--rule)}
.commission a{border-bottom:1px solid var(--ink)}

.essaypage{padding:88px 0 40px}
.essaypage h1{font-size:clamp(34px,4.6vw,54px);font-weight:400;letter-spacing:-.022em;margin-bottom:16px}
.essaypage .stamp{font-family:var(--sans);font-size:11px;letter-spacing:.17em;text-transform:uppercase;color:var(--soft);padding-bottom:30px;border-bottom:1px solid var(--rule);margin-bottom:46px}
.essaypage p{font-size:19px;line-height:1.74;margin-bottom:26px}
.essaypage .lead{font-style:italic;font-size:21px;color:var(--soft)}
.essaypage a{border-bottom:1px solid var(--rule)}
.essaypage a:hover{border-color:var(--ink)}
.figure{margin:44px 0}
.figure img{width:100%;display:block;background:var(--hair)}
.figure .cap{font-family:var(--sans);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--soft);padding-top:14px}
.refbox{margin:44px 0;padding:26px 28px;background:#F3F0EA}
.refbox .k{font-family:var(--sans);font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--soft);margin-bottom:10px}
.refbox .t{font-size:19px;margin-bottom:6px}
.refbox .m{font-size:15.5px;color:var(--soft);margin-bottom:14px}
.refbox a{font-family:var(--sans);font-size:12px;letter-spacing:.11em;text-transform:uppercase;border-bottom:1px solid var(--ink)}
.endline{font-size:22px;letter-spacing:-.01em;padding:14px 0 0}
