/* Галерея (views/constructor/gallery.php). Виды: grid (сетка), carousel (лента со стрелками). Фото открывает Fancybox. */
.cb-gallery--grid {gap: clamp(12px, 1.6vw, 24px)}
.cb-gallery--carousel .cb-scroller__track {--cb-scroll-gap: clamp(12px, 1.6vw, 24px)}
.cb-gallery__item {display: flex; flex-direction: column; min-width: 0; margin: 0}

/* Плитка 4:3 */
.cb-gallery__link {position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 3; border-radius: var(--cb-radius); background: var(--cb-accent-soft); box-shadow: var(--cb-card-shadow); cursor: zoom-in; isolation: isolate}
.cb-gallery__link picture {height: 100%}
.cb-gallery--carousel .cb-gallery__link {box-shadow: none} /* лента обрезает тень по краям */
.cb .cb-gallery__img {display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1)}
.cb-gallery__link::after {content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(10, 18, 26, 0) 45%, rgba(10, 18, 26, .38)); opacity: 0; transition: opacity var(--cb-transition)}
.cb-gallery__zoom {position: absolute; right: 14px; bottom: 14px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255, 255, 255, .94); color: #16232d; box-shadow: 0 6px 18px rgba(10, 18, 26, .2); opacity: 0; transform: translateY(6px) scale(.9); transition: opacity var(--cb-transition), transform var(--cb-transition)}
.cb-gallery__zoom svg {display: block}
@media (hover: hover) {
    .cb-gallery__link:hover .cb-gallery__img {transform: scale(1.045)}
    .cb-gallery__link:hover::after, .cb-gallery__link:hover .cb-gallery__zoom {opacity: 1; transform: none}
}
.cb-gallery__link:focus-visible::after, .cb-gallery__link:focus-visible .cb-gallery__zoom {opacity: 1; transform: none}

.cb .cb-gallery__caption {margin: 12px 2px 0; color: var(--cb-fg); font-size: 15px; line-height: 1.45}

@media (max-width: 575px) {
    .cb-gallery--grid {gap: 10px}
    .cb-gallery--grid .cb-gallery__link {border-radius: var(--cb-radius-sm)}
    .cb-gallery--grid .cb-gallery__zoom {display: none}
    .cb .cb-gallery__caption {margin-top: 8px; font-size: 13px}
}