/* Portraits page only: retain site identity and hero image dimensions. */
.gallery-page .portrait-hero-open{display:block;width:100%;padding:0;cursor:pointer;color:inherit;font:inherit;}
.gallery-page .portrait-hero-cap{margin-top:14px;}
.gallery-page .portrait-hero-photo{min-width:0;}
.gallery-page .portrait-hero-open img{transform:none!important;}
.gallery-page .detail-hero h1{font-size:clamp(64px,7vw,108px);line-height:1;}
.gallery-page #gallery .g-row{margin-bottom:32px;}
@media(min-width:981px){
.gallery-page .detail-hero{align-items:start;}
.gallery-page .detail-hero>div:first-child{align-self:start;padding-top:clamp(36px,9vh,90px);}
.gallery-page .detail-hero>div:first-child>p:not(.eyebrow){max-width:390px;margin-top:25px;}
}
@media(max-width:980px){.gallery-page .portrait-hero-photo{display:none!important;}}
@media(max-width:768px){
.gallery-page .detail-hero h1{font-size:clamp(58px,14vw,84px);}
.gallery-page .detail-hero>div:first-child>p:not(.eyebrow){max-width:310px;}
}

.gallery-page .detail-hero h1{font-family:var(--serif)!important;font-weight:300!important;font-size:clamp(72px,8vw,128px)!important;line-height:.88!important;letter-spacing:-.045em!important;}
@media(min-width:981px){.gallery-page .detail-hero{grid-template-columns:.9fr 1.2fr!important;gap:clamp(36px,4vw,64px)!important;}.gallery-page .portrait-hero-open img{height:min(68vh,740px)!important;object-fit:contain!important;background:transparent!important;}}
@media(max-width:768px){.gallery-page .detail-hero h1{font-size:clamp(64px,15vw,94px)!important;}}
.lb img{width:auto!important;height:auto!important;max-width:calc(100vw - 110px)!important;max-height:calc(100vh - 100px)!important;max-height:calc(100dvh - 100px)!important;}
.lb-cap{margin-top:14px!important;}
@media(max-width:768px){.lb img{max-width:96vw!important;max-height:calc(100vh - 110px)!important;max-height:calc(100dvh - 110px)!important;}}


/* 2026-10-01 lightbox refinement: mobile swipe navigation + desktop caption clearance. */
@media(max-width:768px){
  .lb-p,.lb-n{display:none!important;}
  .lb{touch-action:pan-y pinch-zoom;overscroll-behavior:contain;}
  #lb-img{will-change:translate,opacity;user-select:none;-webkit-user-select:none;-webkit-user-drag:none;}
  #lb-img.lb-slide-from-right{animation:kmLbInFromRight .18s cubic-bezier(.22,.61,.36,1);}
  #lb-img.lb-slide-from-left{animation:kmLbInFromLeft .18s cubic-bezier(.22,.61,.36,1);}
  .lb-cap{margin-top:26px!important;}
}
@keyframes kmLbInFromRight{from{translate:24px 0;opacity:.35}to{translate:0 0;opacity:1}}
@keyframes kmLbInFromLeft{from{translate:-24px 0;opacity:.35}to{translate:0 0;opacity:1}}

@media(min-width:769px){
  .lb{box-sizing:border-box;padding:20px 48px 18px;}
  .lb img{
    max-width:calc(100vw - 112px)!important;
    max-height:calc(100vh - 150px)!important;
    max-height:calc(100dvh - 150px)!important;
    flex:0 1 auto;
  }
  .lb-cap{
    margin-top:24px!important;
    flex:0 0 auto;
  }
}


/* 2026-10-01 A: static random desktop hero. One portrait per visit; no slider UI. */
@media(min-width:981px){
  .gallery-page .portrait-random-stage{
    display:block!important;
    width:100%!important;
    height:min(68vh,740px)!important;
    min-height:440px;
    overflow:hidden!important;
    background:transparent!important;
  }
  .gallery-page .portrait-random-stage picture{
    display:block!important;
    width:100%!important;
    height:100%!important;
  }
  .gallery-page .portrait-random-stage img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:transparent!important;
    transform:none!important;
  }
}

/* Mobile lightbox: X must always remain above the image; portrait arrows never render. */
@media(max-width:768px){
  .lb.on{
    overflow:hidden!important;
    height:100vh!important;
    height:100dvh!important;
    overscroll-behavior:none!important;
    touch-action:pinch-zoom!important;
  }
  .lb .lb-p,.lb .lb-n,
  .lb .lb-p[hidden],.lb .lb-n[hidden]{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .lb .lb-x{
    display:flex!important;
    visibility:visible!important;
    opacity:.86!important;
    position:fixed!important;
    top:max(12px,env(safe-area-inset-top))!important;
    right:max(12px,env(safe-area-inset-right))!important;
    z-index:1005!important;
    width:44px!important;
    height:44px!important;
    padding:0!important;
    margin:0!important;
    align-items:center!important;
    justify-content:center!important;
    color:#f0f0ee!important;
    background:rgba(7,20,18,.24)!important;
    border:0!important;
    border-radius:50%!important;
    font-size:28px!important;
    font-weight:300!important;
    line-height:1!important;
    text-shadow:0 1px 8px rgba(0,0,0,.55)!important;
    -webkit-appearance:none!important;
    appearance:none!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }
  .lb #lb-img{position:relative!important;z-index:1!important;}
  .lb .lb-cap{position:relative!important;z-index:2!important;}
}

/* 2026-10-01 gallery top spacing refinement.
   Desktop: bring the first gallery row slightly closer to the hero.
   Mobile: reduce the space from the intro copy ending in “figures.” to the first portraits to about half. */
@media(min-width:981px){
  .gallery-page > .section{
    padding-top:clamp(68px,8.2vw,118px)!important;
  }
}
@media(max-width:768px){
  /* Match the Portraits 01 top position to Inverted World 02 on mobile.
     Keep the text block fixed there; tighten the gallery by shortening the section below it. */
  .gallery-page{
    padding-top:0!important;
  }
  .gallery-page .detail-hero{
    min-height:auto!important;
    padding-top:112px!important;
    padding-bottom:0!important;
    gap:0!important;
  }
  .gallery-page .detail-hero>div:first-child{
    padding-top:0!important;
  }
  .gallery-page > .section{
    padding-top:37px!important;
  }
  .gallery-page #gallery{
    margin-top:0!important;
  }
}
