.gallery{padding:8rem 4vw 7rem;background:#101410;border-top:1px solid var(--line)}
.gallery-heading{display:grid;grid-template-columns:.75fr 1.6fr 1fr;gap:4vw;align-items:end;margin:0 auto 5rem;max-width:1500px}
.gallery-heading h2{font-family:var(--serif);font-size:clamp(2.4rem,4.5vw,5rem);font-weight:400;line-height:1.05;margin:0}
.gallery-heading>p:last-child{color:#aeb5ac;margin:0}
.gallery-heading em{color:var(--paper)}
.photo-showcase{max-width:1500px;margin:0 auto}
.photo-stage{position:relative;isolation:isolate;aspect-ratio:3/2;overflow:hidden;background:radial-gradient(circle at 50% 42%,#1b211c 0%,#080a08 72%);border:1px solid rgba(242,240,233,.16);box-shadow:0 34px 80px rgba(0,0,0,.28);touch-action:pan-y}
.photo-slide{position:absolute;inset:0;margin:0;display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .9s ease;z-index:0}
.photo-slide.is-active{opacity:1;pointer-events:auto;z-index:1}
.photo-slide img{display:block;width:100%;height:100%;object-fit:contain}
.photo-caption{position:absolute;z-index:2;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;padding:5rem 2rem 1.7rem;background:linear-gradient(0deg,rgba(3,5,3,.92),rgba(3,5,3,.56) 50%,transparent);color:var(--paper)}
.photo-caption>span:first-child{display:flex;flex-direction:column;gap:.22rem}
.photo-caption strong{font-family:var(--serif);font-size:clamp(1.15rem,2vw,1.75rem);font-weight:400}
.photo-caption small,.photo-count{text-transform:uppercase;letter-spacing:.15em;font-size:.65rem;color:#b8c0b5}
.photo-count{white-space:nowrap;padding-bottom:.25rem}
.photo-arrow,.photo-pause{position:absolute;z-index:3;border:1px solid rgba(255,255,255,.36);background:rgba(5,8,5,.62);color:#fff;backdrop-filter:blur(9px);cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .2s ease}
.photo-arrow{top:50%;width:3.25rem;height:3.25rem;border-radius:50%;font-size:1.25rem;transform:translateY(-50%)}
.photo-previous{left:1.25rem}
.photo-next{right:1.25rem}
.photo-pause{top:1.25rem;right:1.25rem;padding:.62rem .85rem;text-transform:uppercase;letter-spacing:.14em;font-size:.64rem}
.photo-arrow:hover,.photo-arrow:focus-visible,.photo-pause:hover,.photo-pause:focus-visible{background:rgba(82,108,48,.9);border-color:#dce8cb}
.photo-arrow:active{transform:translateY(-50%) scale(.94)}
.photo-thumbnails{display:flex;gap:.7rem;padding:1.15rem 0 .4rem;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#68755c #151a15}
.photo-thumbnails button{position:relative;flex:0 0 clamp(88px,8.2vw,122px);aspect-ratio:4/3;padding:4px;border:1px solid transparent;background:#090b09;opacity:.5;cursor:pointer;scroll-snap-align:center;transition:opacity .25s ease,border-color .25s ease,transform .25s ease}
.photo-thumbnails button:hover,.photo-thumbnails button:focus-visible{opacity:.86;border-color:#9cac87}
.photo-thumbnails button.is-active{opacity:1;border-color:var(--moss);transform:translateY(-3px)}
.photo-thumbnails img{display:block;width:100%;height:100%;object-fit:cover}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.purchase{margin-top:1.5rem}
.purchase-label{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:600;margin:0 0:.8rem}
.retailers{display:flex;flex-wrap:wrap;gap:.6rem}
.retailers .button{padding:.85rem 1rem}
.retailers .retailer{background:transparent;color:var(--ink);border:1px solid #969b91}
.retailers .retailer:hover{background:#dfe2d8}
.purchase-note{font-size:.76rem;color:#666d63;margin:1rem 0 0}
@media(max-width:1100px){
  .gallery-heading{grid-template-columns:1fr 2fr}
  .gallery-heading>p:last-child{grid-column:2}
}
@media(max-width:760px){
  .gallery{padding:6rem 0 5.5rem}
  .gallery-heading{grid-template-columns:1fr;margin:0 5vw 3rem;gap:1.2rem}
  .gallery-heading>p:last-child{grid-column:auto}
  .photo-stage{aspect-ratio:1/1;border-left:0;border-right:0}
  .photo-caption{padding:4.5rem 1.2rem 1.15rem}
  .photo-caption strong{font-size:1.08rem}
  .photo-arrow{width:2.75rem;height:2.75rem}
  .photo-previous{left:.7rem}
  .photo-next{right:.7rem}
  .photo-pause{top:.7rem;right:.7rem}
  .photo-thumbnails{padding:1rem 5vw .45rem;gap:.55rem}
  .photo-thumbnails button{flex-basis:84px}
}
@media(prefers-reduced-motion:reduce){
  .photo-slide,.photo-arrow,.photo-pause,.photo-thumbnails button{transition:none!important}
}