.hsh-dual-showcase{
  --hsh-dual-height: 620px;
  --hsh-dual-gap: 16px;
  --hsh-dual-radius: 0px;
  --hsh-dual-overlay-opacity: 38;
  --hsh-arrow-size: 58px;
  --hsh-thumb-height: calc((var(--hsh-dual-height) - (var(--hsh-dual-gap) * 2)) / 3);
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(260px,1fr);
  gap:var(--hsh-dual-gap);
  align-items:stretch;
}
.hsh-dual-showcase *,
.hsh-dual-showcase *::before,
.hsh-dual-showcase *::after{box-sizing:border-box;}
.hsh-dual-showcase__main,
.hsh-dual-showcase__media,
.hsh-dual-showcase__main-image,
.hsh-dual-showcase__side,
.hsh-dual-showcase__thumbs,
.hsh-dual-showcase__thumb-slot,
.hsh-dual-showcase__thumb,
.hsh-dual-showcase__thumb img{width:100%;}
.hsh-dual-showcase__main,
.hsh-dual-showcase__media{height:var(--hsh-dual-height);}
.hsh-dual-showcase__media,
.hsh-dual-showcase__thumb,
.hsh-dual-showcase__thumb-slot{position:relative; overflow:hidden; border-radius:var(--hsh-dual-radius);}
.hsh-dual-showcase__main-image,
.hsh-dual-showcase__thumb img{display:block; height:100%; object-fit:cover;}
.hsh-dual-showcase__media{background:#ece7df; cursor:pointer;}
.hsh-dual-showcase__main-image{transition:transform .65s ease, opacity .3s ease; transform:scale(1);}
.hsh-dual-showcase.is-animating .hsh-dual-showcase__main-image{transform:scale(1.035); opacity:.92;}
.hsh-dual-showcase__overlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:2;
  padding:28px 28px 24px;
  background:linear-gradient(to top, rgba(0,0,0,calc(var(--hsh-dual-overlay-opacity) / 100)) 0%, rgba(0,0,0,0) 72%);
  pointer-events:none;
}
.hsh-dual-showcase__title{margin:0 0 6px; font-size:clamp(26px,2.2vw,42px); line-height:1.05; font-weight:500;}
.hsh-dual-showcase__caption{max-width:72%; font-size:15px; line-height:1.6;}
.hsh-dual-showcase__side{height:var(--hsh-dual-height); position:relative;}
.hsh-dual-showcase__thumbs{height:100%; display:grid; grid-template-rows:repeat(3, minmax(0, 1fr)); gap:var(--hsh-dual-gap);}
.hsh-dual-showcase__thumb-slot{height:var(--hsh-thumb-height); min-height:0; cursor:pointer; background:#ece7df;}
.hsh-dual-showcase__thumb-slot.is-hidden{visibility:hidden; pointer-events:none;}
.hsh-dual-showcase__thumb{display:block; height:100%; padding:0; border:0; border-radius:var(--hsh-dual-radius); background:#ece7df; cursor:pointer;}
.hsh-dual-showcase__thumb::before,
.hsh-dual-showcase__thumb::after{content:""; position:absolute; inset:0; pointer-events:none; transition:opacity .25s ease;}
.hsh-dual-showcase__thumb::before{background:linear-gradient(to top, rgba(0,0,0,.14), rgba(0,0,0,0) 55%); opacity:.2;}
.hsh-dual-showcase__thumb::after{border:1px solid rgba(255,255,255,.7); opacity:0;}
.hsh-dual-showcase__thumb:hover::before,
.hsh-dual-showcase__thumb:hover::after,
.hsh-dual-showcase__thumb-slot:hover .hsh-dual-showcase__thumb::before,
.hsh-dual-showcase__thumb-slot:hover .hsh-dual-showcase__thumb::after{opacity:1;}
.hsh-dual-showcase__thumb:hover img,
.hsh-dual-showcase__thumb-slot:hover img{transform:scale(1.03);}
.hsh-dual-showcase__thumb img{transition:transform .45s ease, opacity .25s ease;}
.hsh-dual-showcase__arrow{
  appearance:none;
  border:0;
  background:rgba(246,241,233,.94);
  color:#1f1c18;
  cursor:pointer;
  border-radius:999px;
  width:var(--hsh-arrow-size);
  height:var(--hsh-arrow-size);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:24px;
  line-height:1;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  z-index:5;
  box-shadow:0 8px 24px rgba(0,0,0,.16);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.hsh-dual-showcase__arrow:hover{transform:translateX(-50%) translateY(-1px); box-shadow:0 12px 28px rgba(0,0,0,.2);}
.hsh-dual-showcase__arrow--prev{top:calc((var(--hsh-thumb-height) - var(--hsh-arrow-size)) / 2);}
.hsh-dual-showcase__arrow--next{bottom:calc((var(--hsh-thumb-height) - var(--hsh-arrow-size)) / 2);}
.hsh-dual-showcase__arrow span{display:block; transform:translateY(-1px);}
.hsh-dual-showcase.is-single .hsh-dual-showcase__side{display:none;}
@media (max-width:1024px){
  .hsh-dual-showcase{grid-template-columns:minmax(0,1fr);}
  .hsh-dual-showcase__caption{max-width:100%;}
  .hsh-dual-showcase__side{height:300px;}
  .hsh-dual-showcase{--hsh-thumb-height: calc((300px - (var(--hsh-dual-gap) * 2)) / 3);}
}
@media (max-width:767px){
  .hsh-dual-showcase{gap:12px; --hsh-arrow-size:44px;}
  .hsh-dual-showcase__main,
  .hsh-dual-showcase__media{height:calc(var(--hsh-dual-height) - 132px); min-height:280px;}
  .hsh-dual-showcase__overlay{padding:18px 16px 16px;}
  .hsh-dual-showcase__title{font-size:22px;}
  .hsh-dual-showcase__caption{font-size:14px; line-height:1.45;}
  .hsh-dual-showcase__side{height:120px;}
  .hsh-dual-showcase__thumbs{grid-template-columns:repeat(3, minmax(0,1fr)); grid-template-rows:1fr; height:100%;}
  .hsh-dual-showcase__thumb-slot{height:100%;}
  .hsh-dual-showcase__arrow{top:50%; bottom:auto; transform:translateY(-50%);}
  .hsh-dual-showcase__arrow:hover{transform:translateY(-50%);}
  .hsh-dual-showcase__arrow--prev{left:12px;}
  .hsh-dual-showcase__arrow--next{left:auto; right:12px;}
  .hsh-dual-showcase__arrow--prev span{transform:rotate(90deg);}
  .hsh-dual-showcase__arrow--next span{transform:rotate(-90deg);}
  .hsh-dual-lightbox{padding:18px;}
}


.hsh-dual-lightbox{position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:99999; display:none; align-items:center; justify-content:center; padding:40px;}
.hsh-dual-lightbox.is-open{display:flex;}
.hsh-dual-lightbox__image{max-width:min(92vw,1400px); max-height:88vh; width:auto; height:auto; object-fit:contain; display:block;}
.hsh-dual-lightbox__close,.hsh-dual-lightbox__nav{position:absolute; border:0; background:rgba(255,255,255,.12); color:#fff; width:52px; height:52px; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:28px;}
.hsh-dual-lightbox__close{top:18px; right:18px;}
.hsh-dual-lightbox__nav--prev{left:18px;}
.hsh-dual-lightbox__nav--next{right:18px;}
html.hsh-dual-lightbox-open{overflow:hidden;}