/* Flex Moulds PhotoSwipe presentation. Gesture physics remain PhotoSwipe-native. */
.flex-lightbox-image { cursor: zoom-in; }
.flex-lightbox-image:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }

.pswp {
  --pswp-bg: #050708;
  --pswp-placeholder-bg: #15191c;
  --pswp-icon-color: #fff;
  --pswp-icon-color-secondary: #050708;
  --pswp-icon-stroke-color: #050708;
  --pswp-icon-stroke-width: 1px;
  z-index: 100000;
}
.pswp__bg { backdrop-filter: blur(8px); }
.pswp__top-bar { height: 60px; background: linear-gradient(to bottom, rgba(5,7,8,.72), rgba(5,7,8,0)); }
.pswp__counter { height: 60px; padding: 0 20px; color: rgba(255,255,255,.82); font-size: 12px; font-weight: 700; line-height: 60px; letter-spacing: .12em; text-shadow: none; opacity: 1; }
.pswp__button { width: 48px; height: 48px; margin: 6px 5px 0 0; border-radius: 50%; background-color: rgba(15,18,20,.58); opacity: 1; transition: background-color .18s ease, transform .18s ease; }
.pswp__button:hover, .pswp__button:focus-visible { background-color: var(--red); transform: scale(1.04); outline: none; }
.pswp__button--arrow { width: 54px; height: 54px; margin: -27px 14px 0; border: 1px solid rgba(255,255,255,.28); }
.pswp__button--arrow:hover, .pswp__button--arrow:focus-visible { border-color: rgba(255,255,255,.8); }
.pswp__button--arrow .pswp__icn {
  top: 50%;
  right: auto;
  left: 50%;
  width: 30px;
  height: 30px;
  margin: 0;
  transform: translate(-50%, -50%);
}
.pswp__button--arrow--next .pswp__icn { transform: translate(-50%, -50%) scale(-1, 1); }
/* Center the PhotoSwipe SVG icons inside the custom circular controls.
   PhotoSwipe's default icon offsets (top:14px; left:9px) are designed for
   its stock rectangular buttons and visually shift these icons down/right. */
.pswp__button--zoom .pswp__icn,
.pswp__button--close .pswp__icn {
  top: 50%;
  right: auto;
  left: 50%;
  width: 24px;
  height: 24px;
  margin: 0;
  transform: translate(-50%, -50%);
}
.pswp__preloader { margin-right: 8px; }

@media (max-width: 700px) {
  .pswp__top-bar { height: 54px; }
  .pswp__counter { height: 54px; padding-left: 14px; line-height: 54px; }
  .pswp__button { width: 44px; height: 44px; margin-top: 5px; }
  .pswp__button--arrow { width: 46px; height: 46px; margin: -23px 7px 0; }
  .pswp__button--arrow .pswp__icn { width: 26px; height: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  .pswp__button { transition: none; }
}