/* One prepared-photo gallery for homes, units, developments and partner details. */
@layer page {
  .dev__gallery { min-width: 0; }
  .gallery { position: relative; overflow: hidden; border-radius: var(--radius-l); background: transparent; }
  .gallery__track { display: flex; width: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; aspect-ratio: 4 / 3; max-height: 40rem; min-width: 0; min-height: 0; margin: 0; padding: 0; list-style: none; overscroll-behavior-x: contain; }
  .gallery__track::-webkit-scrollbar { display: none; }
  .gallery__slide { flex: 0 0 100%; scroll-snap-align: start; position: relative; min-width: 0; min-height: 0; }
  .gallery__slide img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; cursor: zoom-in; }
  .gallery__slide img[data-placeholder] { padding: 12%; opacity: 0.45; cursor: default; }
  .gallery__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid var(--line); background: rgb(255 255 255 / 0.92); color: var(--ink); display: none; align-items: center; justify-content: center; }
  .gallery[data-ready] .gallery__nav { display: inline-flex; }
  .gallery__nav--prev { left: var(--sp-3); }
  .gallery__nav--next { right: var(--sp-3); }
  .gallery__counter { position: absolute; left: 50%; transform: translateX(-50%); bottom: var(--sp-3); background: rgb(22 35 59 / 0.75); color: #fff; font-size: var(--fs-xs); padding: 0.15rem 0.6rem; border-radius: 2rem; }
  .gallery__placeholder { position: absolute; inset: auto 0 var(--sp-3); text-align: center; color: var(--ink-2); font-size: var(--fs-s); }
  .gallery__save { position: absolute; left: var(--sp-3); top: var(--sp-3); }
  .gallery__all { position: absolute; right: var(--sp-3); bottom: var(--sp-3); display: none; }
  .gallery__thumbs { display: flex; gap: var(--sp-2); height: 4.75rem; box-sizing: border-box; overflow-x: auto; padding-block: var(--sp-2); scrollbar-width: thin; overscroll-behavior-x: contain; }
  .gallery__thumb { flex: 0 0 5.5rem; width: 5.5rem; height: 3.75rem; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: var(--radius); background: transparent; opacity: 0.65; }
  .gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
  .gallery__thumb[aria-current] { opacity: 1; border-color: var(--brand); }
  .gallery__thumb:hover, .gallery__thumb:focus-visible { opacity: 1; }
  @media (min-width: 48em) {
    .gallery__track { aspect-ratio: 16 / 10; }
    .gallery[data-ready] .gallery__all { display: inline-flex; }
    .gallery__thumb { flex-basis: 6rem; width: 6rem; height: 4rem; }
    .gallery__thumbs { height: 5rem; }
  }
  /* Lightbox: a dialog with a snapped strip of every photo. */
  .lightbox { border: 0; padding: 0; background: #0b1120; color: #fff; width: 100vw; height: 100dvh; max-width: none; max-height: none; }
  .lightbox::backdrop { background: #0b1120; }
  .lightbox__bar { display: flex; justify-content: space-between; align-items: center; padding: var(--sp-3) var(--sp-4); font-size: var(--fs-s); }
  .lightbox__close { color: #fff; }
  .lightbox__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; height: calc(100dvh - 3.5rem); scrollbar-width: none; }
  .lightbox__track::-webkit-scrollbar { display: none; }
  .lightbox__slide { flex: 0 0 100%; scroll-snap-align: start; display: grid; place-items: center; padding: 0 var(--sp-4) var(--sp-4); }
  .lightbox__slide img, .lightbox__slide video { max-height: 100%; max-width: 100%; width: auto; height: auto; object-fit: contain; }
  .lightbox__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 3rem; height: 3rem; border-radius: 50%; background: rgba(255, 255, 255, 0.15); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
  .lightbox__nav--prev { left: var(--sp-4); }
  .lightbox__nav--next { right: var(--sp-4); }
  .lightbox__track { touch-action: pan-y pinch-zoom; }
  .lightbox--thumbs .lightbox__track { height: calc(100dvh - 3.5rem - 4.75rem); }
  .lightbox__thumbs { display: flex; gap: var(--sp-2); overflow-x: auto; padding: var(--sp-2) var(--sp-4) var(--sp-3); scrollbar-width: thin; }
  .lightbox__thumb { flex: none; width: 4.5rem; height: 3.375rem; border-radius: var(--radius); overflow: hidden; opacity: 0.6; border: 2px solid transparent; padding: 0; background: rgba(255, 255, 255, 0.08); }
  .lightbox__thumb img { width: 100%; height: 100%; object-fit: cover; }
  .lightbox__thumb[aria-current] { opacity: 1; border-color: #fff; }
  .lightbox__thumb:hover { opacity: 0.9; }
  .gallery__tours { position: absolute; left: var(--sp-3); bottom: var(--sp-3); display: flex; flex-wrap: wrap; gap: var(--sp-2); }
  .gallery__tour { background: rgba(255, 255, 255, 0.94); }

}
