:root{--paper:#faf8f5;--ink:#2b2a28;--mute:#77726a}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
body{margin:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;background:var(--paper);color:var(--ink);font:18px/1.75 Georgia,'Iowan Old Style','Palatino Linotype',Palatino,serif}
header{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem 2rem;flex-wrap:wrap;padding:clamp(1.25rem,3vw,2.25rem) clamp(1.25rem,5vw,4rem)}
.name{font-family:'Cormorant Garamond','Palatino Linotype',Palatino,'Book Antiqua',Georgia,serif;font-weight:400;font-size:clamp(1.25rem,2.4vw,1.6rem);letter-spacing:.05em;color:var(--ink);text-decoration:none}
nav a{margin-left:clamp(1rem,2.5vw,2.25rem);font-size:1rem;color:var(--mute);text-decoration:none}
nav a:first-child{margin-left:0}
nav a:hover,nav a[aria-current]{color:var(--ink)}
a:focus-visible,button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
main{flex:1 0 auto;padding:0 clamp(1.25rem,5vw,4rem) 4rem}
footer{padding:1.5rem clamp(1.25rem,5vw,4rem) 2.5rem;color:var(--mute);font-size:.9rem;text-align:center}
.home header{flex-direction:column;align-items:center;gap:.9rem;padding-bottom:1.25rem}
.home .name{font-weight:300;font-size:clamp(2rem,5.2vw,3.5rem);letter-spacing:.06em;line-height:1.1;text-align:center}
.hero{text-align:center}
.hero>a{display:block}
.hero .crop,.group figure.big .crop{width:min(100%,calc((100svh - 13rem)*var(--ar)*.8));margin:0 auto}
.more{display:inline-block;margin:1.4rem 0 0;font-size:1rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:.2rem}
.crop{overflow:hidden;width:100%;aspect-ratio:var(--ar)}
.crop img{display:block;max-width:none;height:auto}
figure{margin:0;position:relative}
.num{position:absolute;top:.5rem;left:.5rem;background:rgba(250,248,245,.92);color:#2b2a28;font:600 .85rem/1 system-ui,sans-serif;padding:.35rem .5rem;border-radius:2px;pointer-events:none}
#paintings{scroll-margin-top:1rem;max-width:1100px;margin:clamp(4rem,9vw,7rem) auto 0}
.group{--g:clamp(1rem,2vw,1.75rem);display:flex;flex-wrap:wrap;justify-content:center;gap:var(--g);margin-bottom:clamp(3.5rem,8vw,6.5rem)}
.group:last-child{margin-bottom:0}
.brk{flex-basis:100%;height:0;margin-top:calc(var(--g)*-1)}
.group figure{flex:0 0 calc((100% - 2*var(--g))/3)}
.group figure.big{flex:0 0 100%}
@media(max-width:900px){.group figure{flex-basis:calc((100% - var(--g))/2)}
.group figure.big{flex-basis:100%}
}
@media(max-width:560px){.group figure{flex-basis:100%}
}
.zoom{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
#lb{position:fixed;inset:0;background:var(--paper);display:flex;align-items:center;justify-content:center;padding:3.5rem 1.5rem 1.5rem;cursor:zoom-out;z-index:10}
#lbc{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
#lbc .crop{width:min(100%,calc((100vh - 5.5rem)*var(--ar)))}
#lb button{position:absolute;top:1rem;right:1.25rem;border:0;background:none;font:inherit;font-size:1rem;color:var(--mute);cursor:pointer}
.text{max-width:34rem;margin:clamp(1rem,5vw,4rem) auto}
.text h1{font-weight:400;font-size:clamp(1.8rem,4vw,2.6rem);margin:0 0 1.5rem}
.text a{color:var(--ink);text-underline-offset:.2em}
.home header{text-align:center}
.home .name{display:block}
.group figure,.hero .crop{cursor:zoom-in}
