.picture-wraper { position: relative; width: 100%; }
    .media-frame{ position: relative; width: 100%; aspect-ratio: 2 / 3; background: #f5f5f5; overflow: hidden; }
    .media-frame a { display: block; width: 100%; height: 100%; }
    .media-frame img, .media-frame a img { width: 100%; height: 100%; object-fit: cover; display: block !important; visibility: visible !important; opacity: 1 !important; }
    .db-product-zoom-trigger { position: relative; cursor: pointer; }
    .db-product-zoom-trigger::after {
        content: "";
        position: absolute;
        right: 14px;
        bottom: 14px;
        width: 36px;
        height: 36px;
        z-index: 1;
        border-radius: 50%;
        background: rgba(255, 255, 255, .92);
        box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
        pointer-events: none;
        opacity: 0;
        transition: opacity .16s ease;
    }
    .db-product-zoom-trigger::before {
        content: "";
        position: absolute;
        right: 24px;
        bottom: 24px;
        z-index: 2;
        width: 16px;
        height: 16px;
        background: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%230f1f33' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='8.5' cy='8.5' r='5.6'/%3E%3Cpath d='M13 13l4 4'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
        pointer-events: none;
        opacity: 0;
        transition: opacity .16s ease;
    }
    .db-product-zoom-trigger:hover::before,
    .db-product-zoom-trigger:hover::after,
    .db-product-zoom-trigger:focus-visible::before,
    .db-product-zoom-trigger:focus-visible::after { opacity: 1; }

    @media (max-width: 992px){
        .gallery, .gallery > .picture, .gallery > .picture .picture-wraper, .gallery > .picture .picture-wraper.swiper,
        .gallery > .picture .picture-wraper .swiper-wrapper, .gallery > .picture .picture-wraper .swiper-slide,
        .gallery > .picture .picture-wraper .db-product-zoom-trigger, .gallery > .picture .picture-wraper .single-picture,
        .gallery > .picture .picture-wraper .media-frame { width: 100% !important; max-width: 100% !important; }
        .gallery > .picture { width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; padding-left: 0 !important; padding-right: 0 !important; left: 0; right: 0; position: relative !important; }
        .gallery > .picture .picture-wraper { display: block !important; overflow: hidden !important; }
        .gallery > .picture .picture-wraper #picture-swiper-wraper { display: flex !important; }
        .gallery > .picture .picture-wraper .swiper-wrapper { display: flex !important; }
        .gallery > .picture .picture-wraper .swiper-slide { flex: 0 0 100% !important; }
        .gallery > .picture .picture-wraper .db-product-zoom-trigger, .gallery > .picture .picture-wraper .single-picture { display: block !important; }
        .gallery > .picture .picture-wraper.swiper, .gallery > .picture .picture-wraper.swiper .swiper-slide,
        .gallery > .picture .picture-wraper.swiper .media-frame { touch-action: pan-y pinch-zoom !important; }
        .gallery > .picture .picture-wraper.swiper { overflow: hidden !important; }
        .gallery > .picture .picture-wraper .media-frame { overflow: hidden !important; border-radius: 0 !important; }
        .gallery > .picture .picture-wraper .media-frame img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
        .db-details-carousel-arrow { z-index: 5; }
    }

    @media (min-width: 993px){
        .media-frame img{ object-fit: contain; background: #fff; }
        .picture-wraper{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
        .picture-wraper .swiper-wrapper{ display: contents !important; }
        .picture-wraper .swiper-slide{ width: auto !important; }
        .db-details-carousel-arrow{ display:none !important; }
    }
    .db-details-carousel-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; cursor:pointer; width:44px; height:44px; }
    .db-carousel-arrow-left{ left:8px; }
    .db-carousel-arrow-right{ right:8px; }

    html.db-product-zoom-no-scroll,
    body.db-product-zoom-no-scroll { overflow: hidden !important; }
    .db-product-zoom-modal[hidden] { display: none !important; }
    .db-product-zoom-modal {
        position: fixed;
        inset: 0;
        z-index: 2100000000;
        background: #fff;
        color: #111;
    }
    .db-product-zoom-thumbs {
        position: absolute;
        left: 32px;
        top: 50%;
        z-index: 3;
        display: flex;
        flex-direction: column;
        gap: 10px;
        max-height: calc(100vh - 96px);
        padding: 2px;
        overflow-y: auto;
        transform: translateY(-50%);
        scrollbar-width: none;
    }
    .db-product-zoom-thumbs::-webkit-scrollbar { display: none; }
    .db-product-zoom-modal .db-product-zoom-thumb {
        all: unset;
        box-sizing: border-box !important;
        display: block !important;
        width: 66px;
        height: 86px;
        flex: 0 0 auto;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: none !important;
        max-height: none !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 1px solid transparent !important;
        border-radius: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
        cursor: pointer !important;
        overflow: hidden;
    }
    .db-product-zoom-modal .db-product-zoom-thumb.is-active {
        border-color: #0f1f33 !important;
    }
    .db-product-zoom-modal .db-product-zoom-thumb img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .db-product-zoom-stage {
        position: absolute;
        inset: 0;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: auto;
        padding: 72px 84px 50px;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    .db-product-zoom-stage.is-zoomed {
        display: block;
        text-align: center;
        cursor: grab;
    }
    .db-product-zoom-stage.is-zoomed:active { cursor: grabbing; }
    .db-product-zoom-image {
        display: block;
        width: auto;
        height: auto;
        max-width: min(92vw, 1280px);
        max-height: calc(100vh - 130px);
        object-fit: contain;
        cursor: zoom-in;
        user-select: none;
        -webkit-user-drag: none;
    }
    .db-product-zoom-stage.is-zoomed .db-product-zoom-image {
        display: inline-block;
        max-width: none;
        max-height: none;
        cursor: zoom-out;
    }
    .db-product-zoom-modal .db-product-zoom-close,
    .db-product-zoom-modal .db-product-zoom-nav {
        all: unset;
        position: absolute;
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        z-index: 2;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: none !important;
        max-height: none !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #0f1f33 !important;
        font-size: 0 !important;
        line-height: 1;
        text-shadow: none !important;
        text-transform: none !important;
        cursor: pointer !important;
    }
    .db-product-zoom-modal .db-product-zoom-close {
        top: 18px;
        right: 22px;
        width: 52px !important;
        height: 52px !important;
        border-radius: 50% !important;
        background: rgba(255, 255, 255, .94) !important;
        box-shadow: 0 2px 14px rgba(0, 0, 0, .1) !important;
    }
    .db-product-zoom-modal .db-product-zoom-close::before,
    .db-product-zoom-modal .db-product-zoom-close::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 20px;
        height: 1.5px;
        background: #0f1f33;
        transform-origin: center;
    }
    .db-product-zoom-modal .db-product-zoom-close::before {
        transform: translate(-50%, -50%) rotate(45deg);
    }
    .db-product-zoom-modal .db-product-zoom-close::after {
        transform: translate(-50%, -50%) rotate(-45deg);
    }
    .db-product-zoom-modal .db-product-zoom-nav {
        top: 50%;
        width: 56px !important;
        height: 72px !important;
        transform: translateY(-50%);
    }
    .db-product-zoom-modal .db-product-zoom-nav::before {
        content: "";
        display: block;
        width: 18px;
        height: 18px;
        border-top: 1.5px solid #0f1f33;
        border-right: 1.5px solid #0f1f33;
    }
    .db-product-zoom-modal .db-product-zoom-prev::before { transform: rotate(-135deg); }
    .db-product-zoom-modal .db-product-zoom-next::before { transform: rotate(45deg); }
    .db-product-zoom-prev { left: 16px; }
    .db-product-zoom-next { right: 16px; }
    .db-product-zoom-modal.has-thumbs .db-product-zoom-nav { display: none !important; }
    .db-product-zoom-nav[hidden] { display: none !important; }
    .db-product-zoom-modal .db-product-zoom-close:focus-visible,
    .db-product-zoom-modal .db-product-zoom-nav:focus-visible,
    .db-product-zoom-modal .db-product-zoom-thumb:focus-visible {
        outline: 1px solid #0f1f33 !important;
        outline-offset: 3px;
    }
    .db-product-zoom-counter {
        position: absolute;
        left: 50%;
        bottom: 18px;
        z-index: 2;
        transform: translateX(-50%);
        font-size: 13px;
        line-height: 1;
        color: #555;
    }
    @media (max-width: 992px) {
        .db-product-zoom-stage { padding: 64px 0 44px; }
        .db-product-zoom-image { max-width: 100vw; max-height: calc(100vh - 108px); }
        .db-product-zoom-thumbs {
            left: 50%;
            right: auto;
            top: auto;
            bottom: 10px;
            flex-direction: row;
            max-width: calc(100vw - 24px);
            max-height: none;
            transform: translateX(-50%);
            overflow-x: auto;
            overflow-y: hidden;
        }
        .db-product-zoom-modal .db-product-zoom-thumb {
            width: 48px;
            height: 64px;
        }
        .db-product-zoom-modal .db-product-zoom-close { top: 10px; right: 10px; }
        .db-product-zoom-modal .db-product-zoom-nav { width: 46px !important; height: 64px !important; }
        .db-product-zoom-prev { left: 0; }
        .db-product-zoom-next { right: 0; }
    }