/* Block: gallery-slider — same visual language as the KASH hangar slider */

.gallery-slider {
    --gallery-slider-ratio: 16 / 9;
    --gallery-slider-width: 1400px;
    /* .page is #f9f9f9 — content sections declare their own white, as
       section.service-rows.section-white does in interior.css. */
    background: #fff;
    padding: 70px 20px;
}
/* The next section brings its own big top padding (.service-rows .sr-row is
   140px in interior.css), which doubled the gap under the slider. Drop it only
   where that section directly follows this block, so other pages keep theirs. */
.gallery-slider + .service-rows .sr-row:first-child { padding-top: 0; }

.gallery-slider--ratio-4-3  { --gallery-slider-ratio: 4 / 3; }
.gallery-slider--ratio-1-1  { --gallery-slider-ratio: 1 / 1; }
.gallery-slider--ratio-21-9 { --gallery-slider-ratio: 21 / 9; }

/* 1140px matches the theme's .container, so the slider lines up with the
   text sections above and below it. */
.gallery-slider--width-content { --gallery-slider-width: 1140px; }
.gallery-slider--width-narrow  { --gallery-slider-width: 991px; }

.gallery-slider__swiper {
    position: relative;
    overflow: hidden;
    max-width: var(--gallery-slider-width);
    border-radius: 8px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .12);
    background: #000;
    margin: 0 auto;
}
.gallery-slider__swiper .swiper-slide {
    aspect-ratio: var(--gallery-slider-ratio);
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000;
}
.gallery-slider__swiper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gallery-slider__trigger {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    cursor: zoom-in;
    color: #fff;
}
.gallery-slider__trigger:focus {
    outline: 3px solid #fff;
    outline-offset: -6px;
}

.gallery-slider__zoom {
    position: absolute;
    right: 18px;
    bottom: 18px;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .55);
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .2s ease, transform .2s ease, background .2s ease;
    pointer-events: none;
}
.gallery-slider__trigger:hover .gallery-slider__zoom,
.gallery-slider__trigger:focus .gallery-slider__zoom {
    opacity: 1;
    transform: translateY(0);
}
.gallery-slider__trigger:hover .gallery-slider__zoom { background: rgba(0, 0, 0, .72); }

.gallery-slider__swiper .swiper-button-prev,
.gallery-slider__swiper .swiper-button-next {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(0, 0, 0, .45);
    color: #fff;
}
.gallery-slider__swiper .swiper-button-prev:after,
.gallery-slider__swiper .swiper-button-next:after {
    font-size: 16px;
    font-weight: 700;
}
.gallery-slider__swiper .swiper-pagination-bullet { background: rgba(255, 255, 255, .55); opacity: 1; }
.gallery-slider__swiper .swiper-pagination-bullet-active { background: #fff; }

/* Editor-only empty state */
.gallery-slider__placeholder {
    margin: 0;
    padding: 40px 20px;
    text-align: center;
    border: 1px dashed #c3c4c7;
    border-radius: 8px;
    color: #50575e;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    background: #f6f7f7;
}

body.admin-bar .fancybox__container {
    top: 32px;
    height: calc(100% - 32px);
}
body.admin-bar .fancybox__toolbar { top: 32px !important; }

@media (max-width: 768px) {
    .gallery-slider { padding: 40px 20px; }
    .gallery-slider__swiper .swiper-button-prev,
    .gallery-slider__swiper .swiper-button-next { width: 32px; height: 32px; }
    .gallery-slider__swiper .swiper-button-prev:after,
    .gallery-slider__swiper .swiper-button-next:after { font-size: 13px; }
    .gallery-slider__zoom {
        right: 12px;
        bottom: 12px;
        width: 36px;
        height: 36px;
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 782px) {
    body.admin-bar .fancybox__container {
        top: 46px;
        height: calc(100% - 46px);
    }
    body.admin-bar .fancybox__toolbar { top: 46px !important; }
}