:root{
  --paper:#fffdf7;
  --ink:#202420;
  --lime:#dfe85f;
  --coral:#ff7965;
  --blue:#a9d8df;
  --mist:#f1f2ef;
  --page:clamp(18px,2.5vw,38px);
  --section:clamp(54px,7vw,104px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  font-size:14px;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
p,h1,h2,figure{margin:0}
img{max-width:100%}

.header{
  position:fixed;
  z-index:20;
  inset:0 0 auto;
  height:62px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:0 var(--page);
  background:var(--lime);
  font-size:13px;
  letter-spacing:.025em;
}
.wordmark{display:flex;align-items:center;width:36px;height:36px;border-radius:6px;overflow:hidden}
.wordmark img{display:block;width:100%;height:100%;object-fit:cover}
.nav{display:flex;gap:clamp(22px,3vw,42px)}
.nav a{position:relative;min-width:58px;text-align:center;transition:transform .22s cubic-bezier(.22,.72,.25,1)}
.nav a::before{content:"";position:absolute;left:-9px;top:50%;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:0;transform:translate(-4px,-50%);transition:opacity .18s ease,transform .22s cubic-bezier(.22,.72,.25,1)}
.nav a:hover,.nav a:focus-visible{transform:translateX(7px)}
.nav a:hover::before,.nav a:focus-visible::before{opacity:1;transform:translate(0,-50%)}
.nav a.active{font-weight:600}
.nav-work,.nav-about,.nav-shop{color:var(--ink)}
.nav-instagram{display:none}
.header-instagram{justify-self:end}
.header-instagram:hover{text-decoration:underline;text-underline-offset:4px}
.menu-button{display:none;width:34px;height:34px;padding:7px;border:0;background:none;cursor:pointer}
.menu-button span{display:block;width:100%;height:1.5px;margin:5px 0;background:currentColor;transition:transform .2s ease,opacity .2s ease}
.menu-button.is-open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-button.is-open span:nth-child(2){opacity:0}
.menu-button.is-open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

.subpage{padding-top:62px}
.page-title{
  min-height:clamp(130px,14vw,190px);
  padding:var(--page);
  display:flex;
  align-items:flex-end;
  background:var(--mist);
}
.page-title h1{font-size:clamp(30px,4.2vw,58px);font-weight:500;line-height:1;letter-spacing:-.035em}
.page-title-blue{background:var(--blue)}
.page-title-coral{background:var(--coral)}

.home-gallery{
  padding:calc(62px + 18px) var(--page) 30px;
}
.home-gallery-stage{display:grid;grid-template-columns:2fr 1fr;gap:14px;height:clamp(400px,calc(100svh - 210px),740px)}
.home-main,.home-carousel{min-width:0;overflow:hidden;height:100%}
.home-gallery img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.home-main img,.mobile-opening img{object-position:center 45%}
.home-carousel{touch-action:pan-y;outline-offset:4px}
.home-carousel-track{position:relative;display:flex;height:100%;transition:transform .6s cubic-bezier(.22,.68,.25,1);will-change:transform}
.home-carousel-track.is-resetting{transition:none}
.home-slide{flex:0 0 100%;min-width:0;height:100%;overflow:hidden}
.home-slide[data-mobile-only]{display:none}
.home-gallery-caption{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:16px}
.home-artist{margin-left:auto;text-align:right;font-size:clamp(21px,2.2vw,32px);line-height:1.3;letter-spacing:-.025em}
.home-gallery-controls{display:flex;gap:12px;align-items:center}
.home-gallery-count{font-size:13px;font-variant-numeric:tabular-nums;margin-right:12px;white-space:nowrap}
.home-gallery-controls button{display:grid;place-items:center;border:0;background:transparent;min-width:44px;min-height:44px;padding:8px;cursor:pointer;transition:transform .2s ease}
.gallery-prev,.gallery-next{font-size:26px;line-height:1}
.gallery-toggle{font-size:13px}
.home-gallery-controls button:hover{transform:translateX(3px)}
.home-gallery-controls button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

.section{padding:var(--section) var(--page)}
.section-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:24px;
  margin-bottom:24px;
}
.section-head h2,.label{
  font-size:13px;
  font-weight:500;
  letter-spacing:.02em;
}

.about{
  display:grid;
  grid-template-columns:1fr;
  background:var(--blue);
}
.about>.label{margin-bottom:28px}
.about-copy{
  width:min(100%,1120px);
  margin:0 auto;
  text-align:center;
}
.about-copy h1{
  min-height:2.6em;
  margin-bottom:26px;
  font-size:clamp(16px,1.65vw,22px);
  font-weight:500;
  line-height:1.3;
  letter-spacing:.005em;
}
.about-page .about-copy{text-align:left;margin:0}
.about-lead{display:grid;grid-template-columns:clamp(150px,17vw,230px) minmax(0,1fr);gap:clamp(28px,5vw,78px);align-items:center;margin-bottom:34px}
.about-page .about-copy h2{display:flex;flex-direction:column;align-items:flex-start;gap:10px;font-weight:400;line-height:1.02;white-space:nowrap}
.artist-name{font-size:clamp(32px,4.2vw,64px);letter-spacing:-.035em}
.artist-role{font-size:clamp(12px,1.25vw,18px);font-weight:500;letter-spacing:.01em}
.about-portrait{width:100%;max-width:230px;justify-self:start;overflow:hidden}
.about-portrait img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 42%;filter:contrast(.96)}
.about-page .about-statement{margin:0;max-width:850px}
.about-copy .about-statement{
  max-width:940px;
  margin:0 auto;
  font-size:clamp(16px,1.8vw,23px);
  line-height:1.55;
  letter-spacing:-.005em;
}

.exhibition-feature{background:#fff}
.exhibition-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.exhibition-feature-grid figure{aspect-ratio:4/3;overflow:hidden}
.exhibition-feature-grid img{display:block;width:100%;height:100%;object-fit:cover}
.exhibition-feature-grid a{display:block;height:100%}

.archive-section{background:var(--mist)}
.archive-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:30px 10px;
}
.archive-card a{display:block}
.archive-image{position:relative;overflow:hidden}
.archive-card img{
  display:block;
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  transition:transform .35s cubic-bezier(.22,.72,.25,1);
}
.archive-hover{
  position:absolute;
  inset:auto 0 0;
  min-height:38%;
  display:grid;
  grid-template-columns:1fr auto;
  align-content:space-between;
  gap:8px;
  padding:10px;
  background:rgba(169,216,223,.94);
  font-size:11px;
  transform:translateY(102%);
  transition:transform .28s cubic-bezier(.22,.72,.25,1);
}
.archive-view{grid-column:1/3;align-self:end;font-weight:500}
.archive-card a:hover img,.archive-card a:focus-visible img{transform:scale(1.025)}
.archive-card a:hover .archive-hover,.archive-card a:focus-visible .archive-hover{transform:translateY(0)}
.archive-card p{
  display:flex;
  justify-content:space-between;
  margin-top:7px;
  font-size:14px;
}
.archive-card a:focus-visible{outline:2px solid var(--ink);outline-offset:4px}

.studio{background:var(--paper)}
.studio-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  width:min(100%,820px);
}
.studio-grid img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}

.profile{
  display:grid;
  grid-template-columns:1fr 2.4fr;
  gap:clamp(50px,7vw,110px);
  background:var(--coral);
}
.cv-page{min-height:calc(100svh - 62px)}
.profile-intro{display:grid;grid-template-columns:95px 1fr}
.bio,.cv-list{font-size:13px}
.bio p+p{margin-top:5px}
.cv-groups{display:block}
.cv-group{
  display:grid;
  grid-template-columns:145px minmax(0,1fr);
  gap:20px;
  margin-bottom:30px;
}
.cv-group:last-child{margin-bottom:0}
.cv-list p{
  display:grid;
  grid-template-columns:55px minmax(0,1fr);
  gap:10px;
  margin-bottom:7px;
}
.media-link{display:flex;justify-content:space-between;gap:18px}
.media-link:hover span:first-child{text-decoration:underline;text-underline-offset:3px}

.contact{
  display:grid;
  grid-template-columns:1fr 3fr;
  gap:25px;
  background:#fff;
}
.contact-copy{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  font-size:16px;
}
.contact-copy p{max-width:520px}
.contact-copy a{
  flex:0 0 auto;
  padding-bottom:3px;
  border-bottom:1px solid currentColor;
  font-size:13px;
  overflow-wrap:anywhere;
}

footer{
  display:flex;
  justify-content:space-between;
  padding:20px var(--page);
  background:var(--ink);
  color:var(--paper);
  font-size:11px;
}
footer a:hover{text-decoration:underline;text-underline-offset:4px}

@media(max-width:760px){
  body{font-size:16px}
  .header{grid-template-columns:1fr auto;gap:14px;height:64px}
  .wordmark{width:36px;height:36px}
  .menu-button{display:block;justify-self:end}
  .nav{
    display:none;
    position:absolute;
    top:64px;
    left:0;
    right:0;
    min-height:calc(100dvh - 64px);
    padding:38px var(--page);
    background:var(--lime);
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    font-size:clamp(28px,9vw,42px);
    line-height:1.15;
    letter-spacing:-.025em;
  }
  .nav.open{display:flex}
  .nav a{width:100%;min-width:0;padding:10px 0;text-align:left;transition:transform .14s ease,opacity .14s ease}
  .nav a::before{display:none}
  .nav a:active{transform:translateX(4px);opacity:.68}
  .nav a.active{text-decoration:none}
  .nav-instagram{display:block;margin-top:auto;font-size:16px;letter-spacing:0}
  .header-instagram{display:none}
  .subpage{padding-top:64px}
  .page-title{min-height:118px;padding-top:26px;padding-bottom:24px}
  .page-title h1{font-size:clamp(32px,11vw,48px)}
  .home-gallery{
    padding-top:calc(64px + 16px);
    padding-left:var(--page);
    padding-right:0;
    padding-bottom:30px;
  }
  .home-gallery-stage{display:block;height:clamp(330px,60svh,620px)}
  .home-gallery .home-main{display:none}
  .home-carousel-track{gap:10px}
  .home-slide,.home-slide[data-mobile-only]{display:block;flex-basis:86%}
  .home-gallery-caption{flex-direction:column;align-items:stretch;gap:24px;padding-right:var(--page);margin-top:12px}
  .home-gallery-controls{justify-content:space-between;width:100%;gap:4px}
  .home-gallery-count{margin-right:auto;font-size:14px}
  .gallery-toggle{font-size:14px}
  .home-artist{align-self:flex-end;font-size:24px}
  .section{padding-top:58px;padding-bottom:58px}
  .section-head h2,.label{font-size:15px}
  .about-copy h1{min-height:3.2em}
  .about-copy .about-statement{min-height:0}
  .about-lead{display:grid;grid-template-columns:86px minmax(0,1fr);gap:14px;margin-bottom:30px}
  .about-page .about-copy h2{gap:7px}
  .artist-name{font-size:clamp(17px,5vw,21px)}
  .artist-role{font-size:clamp(10px,2.8vw,12px)}
  .about-portrait{max-width:86px}
  .exhibition-feature-grid{grid-template-columns:1fr 1fr}
  .exhibition-feature-grid figure:first-child{grid-column:1/3}
  .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 9px}
  .archive-card p{font-size:13px}
  .studio-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
  .profile{grid-template-columns:1fr;gap:48px}
  .profile-intro{grid-template-columns:110px 1fr}
  .bio,.cv-list{font-size:15px}
  .cv-group{grid-template-columns:140px minmax(0,1fr)}
  .contact{grid-template-columns:1fr}
  .contact-copy{display:block}
  .contact-copy a{display:inline-block;margin-top:28px}
  .contact-copy a{font-size:15px}
}
@media(hover:none),(pointer:coarse){
  .archive-hover{display:none}
  .archive-card a:hover img,.archive-card a:focus-visible img{transform:none}
}
@media(max-width:440px){
  .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .studio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .profile-intro,.cv-group{grid-template-columns:1fr;gap:14px}
  .cv-list p{grid-template-columns:48px minmax(0,1fr);gap:8px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .archive-card img,.archive-hover,.nav a,.nav a::before{transition:none}
  .home-carousel-track,.home-gallery-controls button{transition:none}
}
