:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#faf9f5;color:#141413}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}

:root{
  --ground:#f2f2f0; --ink:#141414; --muted:#7a7a77; --rule:#dcdcd8; --accent:#141414; --hover:#e8e8e5;
  --serif:"PP Neue Montreal", "Geist", "Helvetica Neue", Arial, sans-serif;
  --sans:"PP Neue Montreal", "Geist", "Helvetica Neue", Arial, sans-serif;
  --gutter:clamp(16px,3.2vw,40px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){--ground:#131313;--ink:#ededeb;--muted:#8d8d89;--rule:#2a2a28;--accent:#ededeb;--hover:#1d1d1c}
}
:root[data-theme="dark"]{--ground:#131313;--ink:#ededeb;--muted:#8d8d89;--rule:#2a2a28;--accent:#ededeb;--hover:#1d1d1c}
*{box-sizing:border-box}
html,body{background:var(--ground);color:var(--ink)}
body{margin:0;font:400 15px/1.6 var(--sans);padding-inline:var(--gutter);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
img{max-width:100%;display:block;height:auto}

/* header */
.top{border-bottom:0!important;position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--ground);display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 28px;padding-block:22px 16px;border-bottom:1px solid var(--rule)}
.name{font:400 clamp(22px,2.4vw,28px)/1 var(--sans);letter-spacing:-.01em}
.name small{display:block;font:500 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:6px}
nav{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:baseline;font-size:14px}
nav a{color:var(--muted);padding-block:2px;border-bottom:1px solid transparent}
nav a:hover{color:var(--ink)}
nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--ink)}
.navitem{position:relative;display:inline-block}
.navitem .sub{position:absolute;left:0;top:100%;display:none;flex-direction:column;gap:6px;background:var(--ground);padding:10px 12px 12px 0;min-width:120px;z-index:6}
@media (hover:hover){.navitem:hover .sub{display:flex}}
.navitem:has(a:focus-visible) .sub{display:flex}
.navitem.open .sub{display:flex}

.navitem .sub a{font-size:13.5px}
.lang{border:1px solid var(--rule);background:none;color:var(--ink);font:500 11px/1 var(--sans);letter-spacing:.12em;padding:6px 8px;border-radius:2px;cursor:pointer}
.lang span{color:var(--muted)} .lang b{font-weight:600}

main{padding-block:36px 72px;min-height:70vh}
.landing{display:flex;align-items:center;justify-content:center;width:100vw;margin-inline:calc(var(--gutter)*-1);height:100vh;height:100svh}
.landing img{width:min(52vw,680px);height:auto;object-fit:contain;margin-bottom:9vh;transition:opacity .3s}
.landing:hover img{opacity:.82}
body[data-view="landing"]{padding-inline:0;background:#ededeb}
body[data-view="landing"] .top{position:fixed;top:0;left:0;right:0;padding-inline:var(--gutter);background:transparent;border:0}
body[data-view="landing"] .name{visibility:hidden}
body[data-view="landing"] main{padding:0;min-height:0}
body[data-view="landing"] footer{display:none}
.section-title{margin:56px 0 28px;padding-top:24px;border-top:1px solid var(--rule)}
.section-title a{color:var(--muted)}
.section-title a:hover{color:var(--ink)}
.label{font:500 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* works index */
.home{max-width:1060px;margin-inline:auto}
.intro{display:flex;flex-direction:column;gap:6px;max-width:60ch;font:300 clamp(18px,1.8vw,22px)/1.4 var(--sans);margin:12px 0 0;color:var(--ink)}
.intro-sub{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 28px}
.card{display:flex;flex-direction:column;gap:12px}
.card .ph{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--hover)}
.card img{width:100%;height:100%;object-fit:cover;transition:opacity .3s}
.card:hover img{opacity:.85}
.pthumb::after{display:none}
.card h3{font:500 16px/1.2 var(--sans);margin:0}
.card p{margin:2px 0 0;color:var(--muted);font-size:13.5px}

/* project page */
.work{max-width:860px;margin-inline:auto}
.proj-head{display:block;margin-bottom:36px}
.kind{margin:10px 0 22px;font-size:14px;color:var(--muted)}
.proj-head h1{font:300 clamp(32px,4.4vw,52px)/1.05 var(--sans);margin:0;letter-spacing:-.03em;text-wrap:balance}
.facts{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 18px;margin:0;font-size:14px}
.facts dt{color:var(--muted)} .facts dd{margin:0}
.text{max-width:100%;margin:0 0 48px;font-size:15.5px}
.text.flow p{margin:0 0 1em}
.text p{margin:0 0 1em;break-inside:avoid-column}
.text .attr{display:block;margin-top:.75em;font-size:12.5px;line-height:1.5;color:var(--muted)}
.text blockquote{break-inside:avoid;margin:0 0 1em;padding-left:14px;border-left:1px solid var(--ink);font:300 19px/1.4 var(--sans)}
.plates{display:grid;grid-template-columns:1fr;gap:40px;align-items:start}
.plates figure{margin:0}

.plates.first{margin-bottom:40px;gap:20px}
.block{display:grid;gap:20px;margin-bottom:14px;align-items:start}
.block.center{max-width:62%;margin-inline:auto}
.block.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.block.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.block.fr{grid-template-columns:var(--fr)}
.block figure{margin:0}
.plate-cap{margin:0 0 42px;font-size:12.5px;line-height:1.5;color:var(--muted);max-width:70ch}
.block + .lead-quote{margin-bottom:42px}
.lead-quote{margin:0;font:400 15.5px/1.6 var(--sans);max-width:100%}
.credits{margin:32px 0 0;font-size:12.5px;color:var(--muted)}
.pager{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--rule);margin-top:64px;padding-top:18px;font-size:14px}
.pager a:hover{color:var(--accent)}
.ext{display:inline-block;margin-top:4px;border-bottom:1px solid currentColor;color:var(--accent)}

/* text pages */
.page{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:24px 56px;max-width:1150px}
.page h1{font:300 clamp(34px,4vw,52px)/1 var(--sans);letter-spacing:-.025em;margin:0}
.prose{max-width:66ch}
.prose p{margin:0 0 1.1em}
.prose .lead{font:300 clamp(19px,1.9vw,22px)/1.45 var(--sans)}
.portrait{max-width:340px;margin:0 0 28px}
.portrait figcaption{font-size:12px;color:var(--muted);margin-top:6px}

.cv h2{font:500 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:40px 0 10px;padding-bottom:8px;border-bottom:1px solid var(--rule)}
.cv h2:first-child{margin-top:0}
.cv h3{font:400 17px/1.3 var(--sans);margin:18px 0 6px}
.row{display:grid;grid-template-columns:78px minmax(0,1fr);gap:16px;padding-block:5px;font-size:14.5px}
.row .y{font-variant-numeric:tabular-nums;color:var(--muted)}
.row i{font-style:italic}
.dl{display:inline-flex;gap:8px;align-items:center;margin-top:24px;border-bottom:1px solid var(--ink);padding-bottom:2px;font-size:14px}
.dl:hover{color:var(--muted)}

.plist{display:grid;gap:0}
.pitem{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px 28px;padding-block:24px;border-top:1px solid var(--rule)}
.pmeta{display:flex;flex-direction:column;gap:12px}
.pthumb{position:relative;display:block;width:100%;aspect-ratio:16/10;overflow:hidden}
.pthumb img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05) brightness(1.02)}
.pitem h3{font:400 20px/1.2 var(--sans);margin:0 0 8px}
.pitem p{margin:0 0 8px;max-width:66ch}
.links{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px}
.links a{color:var(--accent);border-bottom:1px solid currentColor}

.contact a.big{font:300 clamp(24px,3.2vw,36px)/1.2 var(--sans);letter-spacing:-.02em;border-bottom:1px solid var(--rule)}
.contact a.big:hover{border-color:var(--ink)}
.cgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px;margin-top:40px}
.cgrid p{margin:6px 0 0}

footer{border-top:1px solid var(--rule);padding-block:18px 28px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:12.5px;color:var(--muted)}
footer a:hover{color:var(--ink)}

@media (max-width:760px){
  .top{position:static}
  .navitem .sub{position:static;display:flex;flex-direction:row;gap:14px;padding:0 0 0 12px}
  nav{gap:4px 16px}
  .proj-head,.page{grid-template-columns:1fr}
  .plates{grid-template-columns:1fr}
  .block.cols-2,.block.cols-3{grid-template-columns:1fr}
  .block.fr{grid-template-columns:1fr}
  .block.center{max-width:100%}
  .landing img{width:min(80vw,420px)}
  .pitem{grid-template-columns:1fr;gap:12px}
  .pmeta{max-width:280px}
  .row{grid-template-columns:62px minmax(0,1fr)}
  .grid{grid-template-columns:1fr}
  main{padding-block:24px 56px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* bio */
.prose.bio{max-width:820px}
.prose.bio p{font:400 15.5px/1.6 var(--sans);margin:0 0 1.1em;text-align:justify;hyphens:auto;-webkit-hyphens:auto}
.prose.bio strong{font-weight:600}
.prose.bio a.hl{font-weight:500;color:inherit;background:linear-gradient(transparent 60%,color-mix(in srgb,var(--ink) 13%,transparent) 60%);padding:0 1px;transition:background .2s,color .2s}
.prose.bio a.hl:hover{background:var(--ink);color:var(--ground)}
.bio-lead{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:32px;align-items:stretch;margin-bottom:1.7em}
.bio-lead-text p:last-child{margin-bottom:0}
.bio-photo{position:relative;margin:0;min-height:240px;box-shadow:10px 10px 0 var(--hover)}
.bio-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.bio-map{grid-column:1/-1;margin-top:56px;clear:both}
.bio-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.bio-card{display:block}
.bio-card .ph{aspect-ratio:4/5;overflow:hidden;background:var(--hover)}
.bio-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.bio-card:hover img{transform:scale(1.04)}
.bio-card .k{font:500 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:14px 0 4px}
.bio-card h3{font:400 clamp(19px,1.9vw,24px)/1.2 var(--sans);letter-spacing:-.01em;margin:0 0 6px}
.bio-card .d{margin:0;font-size:13.5px;line-height:1.5;color:var(--muted);max-width:34ch}
@media (max-width:760px){.bio-cards{grid-template-columns:1fr}.bio-card .ph{aspect-ratio:3/2}.bio-lead{grid-template-columns:1fr}.bio-photo{order:-1;height:340px;box-shadow:none}.bio-lead{gap:20px}}
.pitem{scroll-margin-top:120px}
/* clean line arrows */
.arr{display:inline-block;width:.8em;height:.8em;vertical-align:-.07em;background:currentColor;-webkit-mask:var(--arr) center/contain no-repeat;mask:var(--arr) center/contain no-repeat}
.arr-ne{--arr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.8 9.2L9.2 2.8M4.2 2.8h5v5'/%3E%3C/svg%3E")}
.arr-r{--arr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 6h9M7 2.5L10.5 6 7 9.5'/%3E%3C/svg%3E")}
.arr-l{--arr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 6h-9M5 2.5L1.5 6 5 9.5'/%3E%3C/svg%3E")}
.arr-se{--arr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.8 2.8L9.2 9.2M9.2 4.2v5h-5'/%3E%3C/svg%3E")}
.arr-d{--arr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 1.5v9M2.5 7L6 10.5 9.5 7'/%3E%3C/svg%3E")}
.arr-u{--arr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 10.5v-9M2.5 5L6 1.5 9.5 5'/%3E%3C/svg%3E")}
/* Home: phones only, never on the landing page */
.homelink{display:none}
@media (max-width:760px){ body:not([data-view="landing"]) #nav .homelink{display:inline} }

/* projects page: title + period on the left (laptop keeps the original two-column layout) */
.projects-head{display:flex;flex-direction:column;align-items:flex-start;gap:14px;text-align:left}
@media (max-width:760px){
  /* phone only: one centred column, small image, text justified to the image width */
  .projects-page{--pw:min(78vw,300px);display:block;position:relative;max-width:none}
  .projects-head{margin-bottom:22px}
  .projects-page .plist{display:flex;flex-direction:column;align-items:center;width:100%;margin-inline:auto}
  .projects-page .pitem{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%;padding-block:44px 40px;text-align:center}
  .projects-page .pitem:first-child{padding-top:4px;border-top:0}
  .projects-page .pmeta{width:var(--pw);max-width:none;align-items:center;gap:14px}
  .projects-page .pthumb{width:var(--pw);aspect-ratio:4/3}
  .projects-page .pitem > div:last-child{width:var(--pw)}
  .projects-page .pitem h3{font-size:19px;margin:0 0 10px}
  .projects-page .pitem p{max-width:none;margin:0 0 12px;font-size:14px;line-height:1.6;text-align:justify;hyphens:auto;-webkit-hyphens:auto}
  .projects-page .links{justify-content:center;gap:6px 14px;font-size:13px}
}

/* landing: truly centred (the negative gutter margin pushed it off-centre) */
body[data-view="landing"] .landing{margin-inline:0}
@media (max-width:760px){
  /* top bar: the whole menu on one slim line, on every page (landing included) */
  body{display:flex;flex-direction:column}
  .top{display:contents}
  #nav{order:-2;display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:baseline;gap:0 20px;position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--ground);margin-inline:calc(var(--gutter)*-1);padding:13px var(--gutter) 11px;border-bottom:1px solid var(--rule);font-size:12.5px;line-height:1.3;white-space:nowrap}
  #nav a{padding-block:2px}
  #nav .navitem{display:inline-block;position:relative}
  #nav .navitem .sub{position:absolute;left:0;top:calc(100% + 15px);display:none;flex-direction:column;gap:2px;min-width:0;padding:6px 22px 10px 0;background:var(--ground)}
  #nav .navitem .sub a{font-size:12.5px;color:var(--muted);padding-block:5px}
  #nav .navitem .sub a[aria-current="page"]{color:var(--ink)}
  #nav .navitem.open .sub{display:flex}
  body[data-view="landing"] #nav .navitem .sub{background:transparent}
  #nav .lang{margin-left:auto;padding:4px 6px;font-size:10.5px;letter-spacing:.1em}
  .name{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  main{flex:1 0 auto}
  /* landing: menu over the image, image bigger and exactly at the centre of the screen */
  body[data-view="landing"] #nav{position:fixed;top:0;left:0;right:0;margin-inline:0;padding:16px var(--gutter) 0;background:transparent;border:0}
  .landing{height:100vh;height:100dvh}
  .landing img{width:min(100vw,620px);margin-bottom:0}
  /* works: two previews per row, 4:5, Instagram-style */
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 3px;margin-inline:calc(var(--gutter)*-1)}
  .card{gap:7px}
  .card .ph{aspect-ratio:4/5}
  /* exhibition title: below the photo, left, same style as the "Selected exhibitions" label, no shadow */
  .card > div:not(.ph){display:block;padding:0 8px}
  .card > div:not(.ph) p{display:none}
  .card > div:not(.ph) h3{margin:0;font:500 11px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
  .card:hover img{opacity:1}
}
@media (max-width:340px){ #nav{font-size:11.5px;gap:0 12px} #nav .navitem .sub a{font-size:11.5px} .card > div:not(.ph) h3{font-size:10px;letter-spacing:.1em} }

/* contact form */
.contact p.big{font:300 clamp(24px,3.2vw,36px)/1.2 var(--sans);letter-spacing:-.02em;margin:0;user-select:all;overflow-wrap:anywhere}
.ccopy{display:block;margin-top:16px;background:none;border:0;border-bottom:1px solid var(--rule);padding:0 0 2px;font:400 13px/1.4 var(--sans);color:var(--muted);cursor:pointer;transition:color .2s,border-color .2s}
.ccopy:hover{color:var(--ink);border-color:var(--ink)}
.csend{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:22px}
.csend .label{margin-right:4px}
.cbtn{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border:1px solid var(--ink);border-radius:999px;background:none;color:var(--ink);font:500 13px/1 var(--sans);cursor:pointer;transition:background .2s,color .2s,opacity .2s}
.cbtn:hover,.cbtn:focus-visible{background:var(--ink);color:var(--ground)}
.cbtn[aria-disabled="true"]{opacity:.35;pointer-events:none}

.press .row{padding-block:7px}
.press .row.gstart{margin-top:22px;padding-top:12px;border-top:1px solid var(--rule)}
.press .row.gstart:first-child{margin-top:0;border-top:0;padding-top:7px}
.press .pt{display:block}
.press .pm{display:block;margin-top:2px;font-size:13px;line-height:1.45;color:var(--muted)}
/* lightbox gallery */
.work figure img{cursor:default;position:relative;transition:transform .35s cubic-bezier(.2,.6,.2,1)}
@media (hover:hover){.work figure img:hover{transform:scale(1.02);z-index:2}}
.work figure img:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.lb{position:fixed;inset:0;z-index:1000;background:color-mix(in srgb,var(--ground) 76%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s}
.lb.open{opacity:1;visibility:visible}
.lb-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:calc(clamp(48px,7vh,72px) + env(safe-area-inset-top,0px)) clamp(60px,8vw,120px) calc(clamp(48px,7vh,72px) + env(safe-area-inset-bottom,0px))}
.lb-img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;user-select:none;-webkit-user-drag:none;transition:opacity .18s ease;cursor:default;box-shadow:0 14px 50px rgba(0,0,0,.14)}
.lb-img.swap{opacity:0}
.lb button{position:absolute;display:flex;align-items:center;justify-content:center;width:52px;height:52px;background:none;border:0;border-radius:50%;color:var(--ink);cursor:pointer;opacity:.7;transition:opacity .2s,background .2s}
.lb button:hover,.lb button:focus-visible{opacity:1;background:color-mix(in srgb,var(--ink) 8%,transparent)}
.lb button svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.lb-close{top:calc(10px + env(safe-area-inset-top,0px));right:12px}
.lb-prev,.lb-next{top:50%;margin-top:-26px}
.lb-prev{left:10px}.lb-next{right:10px}
.lb-count{position:absolute;left:0;right:0;bottom:calc(18px + env(safe-area-inset-bottom,0px));text-align:center;color:var(--ink);opacity:.75;font:500 12px/1 var(--sans);letter-spacing:.14em;pointer-events:none}
@media (max-width:760px){
  .lb-stage{padding:calc(60px + env(safe-area-inset-top,0px)) 6px calc(64px + env(safe-area-inset-bottom,0px))}
  .lb-prev,.lb-next{top:auto;margin-top:0;bottom:calc(6px + env(safe-area-inset-bottom,0px))}
  .lb-prev{left:14px}.lb-next{right:14px}
}


/* static pages */
a.lang{display:inline-block;text-decoration:none}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}