/*=====================================
  GALLERY PAGE — MOBILE SINGLE SLIDE
======================================*/

.gallery-dots{
    display:none;
}

/* A shorter page intro avoids the large empty band above the gallery. */
body .gallery-page{
    min-height:0;
    padding-top:110px;
    padding-bottom:64px;
}

.gallery-page .section-title.fade-up{
    opacity:1;
    transform:none;
}

.gallery-page .section-title{
    margin-bottom:24px;
}

@media(max-width:768px){

    .gallery-page{
        padding-top:92px;
        padding-bottom:42px;
        padding-right:20px;
        padding-left:20px;
        overflow:hidden;
    }

    .gallery-page .section-title{
        margin-bottom:18px;
    }

    .gallery-page .gallery-grid{
        display:flex !important;
        width:100%;
        gap:0 !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
        scroll-snap-type:x mandatory;
        scroll-behavior:smooth;
        scrollbar-width:none;
        overscroll-behavior-x:contain;
        touch-action:pan-x;
    }

    .gallery-page .gallery-grid::-webkit-scrollbar{
        display:none;
    }

    .gallery-page .gallery-card{
        flex:0 0 100% !important;
        width:100% !important;
        min-width:100% !important;
        max-width:100% !important;
        height:auto !important;
        min-height:0 !important;
        max-height:none !important;
        aspect-ratio:4 / 5;
        margin:0 !important;
        border:1px solid rgba(224,184,79,.38);
        border-radius:20px;
        background:#090909;
        scroll-snap-align:center;
        scroll-snap-stop:always;
        box-shadow:0 18px 42px rgba(0,0,0,.42);
    }

    .gallery-page .gallery-card img{
        display:block;
        width:100% !important;
        height:100% !important;
        object-fit:contain !important;
        object-position:center;
        border:0;
        border-radius:19px;
        transform:none !important;
    }

    .gallery-dots{
        display:flex;
        align-items:center;
        justify-content:center;
        flex-wrap:wrap;
        gap:8px;
        min-height:22px;
        margin-top:22px;
    }

    .gallery-dots[hidden]{
        display:none;
    }

    .gallery-dot{
        width:7px;
        height:7px;
        padding:0;
        border:0;
        border-radius:999px;
        background:rgba(255,255,255,.28);
        cursor:pointer;
        transition:width .25s ease, background-color .25s ease;
    }

    .gallery-dot:hover,
    .gallery-dot:focus-visible{
        transform:none;
        background:rgba(224,184,79,.72);
        outline:none;
    }

    .gallery-dot.active{
        width:22px;
        background:#E0B84F;
    }

}

/* BONDOK GALLERY — EDITORIAL LUXURY */
.gallery-page{width:min(1260px,100%);margin:0 auto;padding:132px 28px 78px !important}
.gallery-editorial-intro{max-width:780px;margin:0 auto 42px;text-align:center}
.gallery-editorial-eyebrow{display:block;margin-bottom:13px;color:#E0B84F;font-size:11px;letter-spacing:2.4px}
.gallery-editorial-intro h1{margin:0;color:#fff;font:500 clamp(34px,5vw,58px)/1.16 'Cinzel',serif}
.gallery-editorial-intro p{max-width:650px;margin:17px auto 0;color:#9d9d9d;font-size:14px;line-height:1.85}
.gallery-filter-tabs{display:flex;justify-content:center;gap:8px;margin-top:27px}.gallery-filter-tabs button{min-width:90px;min-height:38px;padding:0 15px;border:1px solid rgba(255,255,255,.09);border-radius:999px;color:#888;background:rgba(255,255,255,.018);font-size:10px;letter-spacing:1.2px;cursor:pointer}.gallery-filter-tabs button.active,.gallery-filter-tabs button:hover{color:#111;border-color:#E0B84F;background:#E0B84F}
.gallery-editorial-grid{display:grid !important;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px !important;overflow:visible !important}.gallery-editorial-grid .gallery-card{position:relative;grid-column:span 4;min-height:390px;border:1px solid rgba(255,255,255,.07);border-radius:16px;overflow:hidden;background:#080808;cursor:pointer;box-shadow:0 18px 46px rgba(0,0,0,.28)}.gallery-editorial-grid .gallery-card.gallery-featured{grid-column:span 6;min-height:500px}.gallery-editorial-grid .gallery-media{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s ease,filter .55s ease}.gallery-editorial-grid .gallery-card:hover .gallery-media{transform:scale(1.035);filter:brightness(.82)}
.gallery-card-index{position:absolute;left:14px;bottom:12px;color:rgba(255,255,255,.72);font-size:10px;letter-spacing:1px}.gallery-play-badge{position:absolute;inset:50% auto auto 50%;width:54px;height:54px;display:grid;place-items:center;transform:translate(-50%,-50%);border:1px solid rgba(224,184,79,.6);border-radius:50%;color:#E0B84F;background:rgba(0,0,0,.58);backdrop-filter:blur(8px)}
.gallery-editorial-popup .gallery-popup-stage{position:relative;max-width:min(78vw,1080px);max-height:82vh}.gallery-editorial-popup .popup-media{display:block;max-width:100%;max-height:82vh;object-fit:contain}.gallery-popup-count{position:absolute;right:12px;bottom:10px;padding:6px 10px;border-radius:999px;color:#ddd;background:rgba(0,0,0,.62);font-size:10px}.gallery-luxury-empty{grid-column:1/-1;padding:70px 20px;text-align:center;color:#888;border:1px solid rgba(255,255,255,.06);border-radius:16px}
@media(max-width:900px){.gallery-editorial-grid .gallery-card,.gallery-editorial-grid .gallery-card.gallery-featured{grid-column:span 6;min-height:390px}}
@media(max-width:768px){.gallery-page{padding:105px 18px 52px !important}.gallery-editorial-grid{display:flex !important;gap:12px !important}.gallery-editorial-grid .gallery-card,.gallery-editorial-grid .gallery-card.gallery-featured{flex:0 0 100% !important;min-height:0 !important;aspect-ratio:4/5}.gallery-filter-tabs{overflow-x:auto;justify-content:flex-start;padding-bottom:4px}}


/* =====================================================
   BONDOK GALLERY — COMPACT PREMIUM SCALE
   Prevent oversized full-width media cards
===================================================== */

.gallery-page{
    width:min(1120px,100%) !important;
}

.gallery-editorial-grid{
    gap:14px !important;
}

.gallery-editorial-grid .gallery-card{
    min-height:310px !important;
    border-radius:14px !important;
}

.gallery-editorial-grid .gallery-card.gallery-featured{
    min-height:390px !important;
}

@media(max-width:900px) and (min-width:769px){

    .gallery-editorial-grid .gallery-card,
    .gallery-editorial-grid .gallery-card.gallery-featured{
        min-height:330px !important;
    }

}

@media(max-width:768px){

    .gallery-page{
        padding-left:16px !important;
        padding-right:16px !important;
    }

    .gallery-editorial-grid{
        width:100% !important;
        display:flex !important;
        gap:12px !important;
        padding:0 8% 4px !important;
        box-sizing:border-box !important;
        overflow-x:auto !important;
        scroll-padding-left:8% !important;
    }

    .gallery-editorial-grid .gallery-card,
    .gallery-editorial-grid .gallery-card.gallery-featured{
        flex:0 0 84% !important;
        width:84% !important;
        min-width:84% !important;
        max-width:84% !important;
        min-height:0 !important;
        aspect-ratio:4 / 5 !important;
        border-radius:15px !important;
    }

    .gallery-editorial-grid .gallery-media{
        object-fit:cover !important;
    }

}

@media(max-width:430px){

    .gallery-editorial-grid{
        padding-left:6% !important;
        padding-right:6% !important;
        scroll-padding-left:6% !important;
    }

    .gallery-editorial-grid .gallery-card,
    .gallery-editorial-grid .gallery-card.gallery-featured{
        flex-basis:88% !important;
        width:88% !important;
        min-width:88% !important;
        max-width:88% !important;
    }

}


/* =====================================================
   BONDOK GALLERY — FULL PAGE BACKGROUND + LUXURY GRID
===================================================== */

/* Keep the gallery section/background full width like the rest of the site */
.gallery-page{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:118px 24px 72px !important;
    box-sizing:border-box !important;
}

/* Constrain ONLY the content, not the page background */
.gallery-editorial-intro,
.gallery-editorial-grid{
    width:min(1180px,100%) !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

/* Elegant intro */
.gallery-editorial-intro{
    max-width:720px !important;
    margin-bottom:32px !important;
    text-align:center !important;
}

.gallery-editorial-intro h1{
    font-size:clamp(30px,4vw,46px) !important;
}

.gallery-editorial-intro p{
    margin-top:12px !important;
    font-size:13px !important;
}

.gallery-filter-tabs{
    margin-top:20px !important;
}

/* Balanced desktop grid */
.gallery-editorial-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
    padding:0 !important;
    overflow:visible !important;
}

/* Every image/video has the same premium card size */
.gallery-editorial-grid .gallery-card,
.gallery-editorial-grid .gallery-card.gallery-featured{
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:0 !important;
    aspect-ratio:4 / 5 !important;
    border-radius:14px !important;
    overflow:hidden !important;
    border:1px solid rgba(224,184,79,.16) !important;
    background:#0a0a0a !important;
    box-shadow:0 16px 36px rgba(0,0,0,.24) !important;
}

.gallery-editorial-grid .gallery-media{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
}

.gallery-editorial-grid .gallery-card:hover{
    border-color:rgba(224,184,79,.42) !important;
    transform:translateY(-3px) !important;
}

.gallery-editorial-grid .gallery-card:hover .gallery-media{
    transform:scale(1.025) !important;
    filter:brightness(.9) !important;
}

.gallery-card-index{
    left:12px !important;
    bottom:10px !important;
    padding:4px 7px !important;
    border-radius:999px !important;
    background:rgba(0,0,0,.48) !important;
    backdrop-filter:blur(6px) !important;
}

.gallery-play-badge{
    width:48px !important;
    height:48px !important;
}

/* If there are only 1 or 2 files, never stretch them across the screen */
.gallery-editorial-grid:has(.gallery-card:only-child){
    grid-template-columns:minmax(260px,360px) !important;
    justify-content:center !important;
}

.gallery-editorial-grid:has(.gallery-card:nth-child(2):last-child){
    grid-template-columns:repeat(2,minmax(260px,360px)) !important;
    justify-content:center !important;
}

@media(max-width:900px){
    .gallery-editorial-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:14px !important;
    }
}

@media(max-width:768px){

    .gallery-page{
        width:100% !important;
        padding:102px 16px 54px !important;
    }

    .gallery-editorial-intro{
        width:min(100%,620px) !important;
        margin-bottom:24px !important;
    }

    .gallery-filter-tabs{
        justify-content:center !important;
        overflow:visible !important;
        flex-wrap:wrap !important;
    }

    .gallery-editorial-grid,
    .gallery-editorial-grid:has(.gallery-card:only-child),
    .gallery-editorial-grid:has(.gallery-card:nth-child(2):last-child){
        width:min(100%,430px) !important;
        display:grid !important;
        grid-template-columns:1fr !important;
        justify-content:stretch !important;
        gap:14px !important;
        padding:0 !important;
        overflow:visible !important;
    }

    .gallery-editorial-grid .gallery-card,
    .gallery-editorial-grid .gallery-card.gallery-featured{
        width:100% !important;
        max-width:430px !important;
        min-width:0 !important;
        margin:0 auto !important;
        aspect-ratio:4 / 5 !important;
        flex:none !important;
    }
}


/* =====================================================
   BONDOK V4 — CINEMATIC LUXURY LIGHTBOX
   Overrides legacy popup rules intentionally.
===================================================== */
body.gallery-lightbox-open{overflow:hidden!important}
.image-popup.gallery-editorial-popup{
    position:fixed!important;inset:0!important;z-index:2147482000!important;
    display:grid!important;place-items:center!important;padding:28px!important;
    background:
      radial-gradient(circle at 50% 44%,rgba(224,184,79,.055),transparent 35%),
      rgba(2,2,2,.94)!important;
    backdrop-filter:blur(18px) saturate(.78)!important;
    -webkit-backdrop-filter:blur(18px) saturate(.78)!important;
    animation:bondokLightboxIn .34s ease both;
}
.gallery-editorial-popup .popup-box.gallery-luxury-lightbox{
    position:relative!important;width:min(94vw,1180px)!important;height:min(90vh,820px)!important;
    max-width:none!important;max-height:none!important;margin:0!important;
    display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;
    padding:16px 18px 14px!important;overflow:hidden!important;
    border:1px solid rgba(224,184,79,.40)!important;border-radius:24px!important;
    background:linear-gradient(145deg,rgba(15,15,15,.96),rgba(4,4,4,.985))!important;
    box-shadow:0 32px 90px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.025) inset!important;
}
.gallery-luxury-lightbox::before{
    content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
    background:linear-gradient(115deg,transparent 18%,rgba(255,229,154,.045) 42%,transparent 62%);
}
.gallery-lightbox-head{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:2px 2px 14px;border-bottom:1px solid rgba(255,255,255,.055)}
.gallery-lightbox-brand{display:flex;align-items:baseline;gap:10px;min-width:0}
.gallery-lightbox-kicker{font-family:'Cinzel',serif;font-size:14px;letter-spacing:.34em;color:#E0B84F}
.gallery-lightbox-title{font-family:'Poppins',sans-serif;font-size:9px;letter-spacing:.28em;color:rgba(255,255,255,.42)}
.gallery-lightbox-meta{display:flex;align-items:center;gap:14px}
.gallery-editorial-popup .gallery-popup-count{position:static!important;padding:0!important;border-radius:0!important;background:none!important;color:rgba(255,255,255,.72)!important;font:500 10px/1 'Poppins',sans-serif!important;letter-spacing:.16em!important}
.gallery-popup-count em{font-style:normal;color:rgba(224,184,79,.65);padding:0 3px}
.gallery-editorial-popup .close-popup{
    position:static!important;display:grid!important;place-items:center!important;width:38px!important;height:38px!important;padding:0!important;
    border:1px solid rgba(224,184,79,.34)!important;border-radius:50%!important;background:rgba(255,255,255,.025)!important;
    color:#E0B84F!important;font:300 24px/1 Arial,sans-serif!important;cursor:pointer!important;
    transition:transform .35s ease,border-color .35s ease,background .35s ease!important;
}
.gallery-editorial-popup .close-popup:hover{transform:rotate(90deg)!important;border-color:rgba(224,184,79,.72)!important;background:rgba(224,184,79,.08)!important}
.gallery-lightbox-body{position:relative;z-index:2;min-height:0;display:grid;grid-template-columns:54px minmax(0,1fr) 54px;align-items:center;gap:14px;padding:14px 0}
.gallery-editorial-popup .gallery-popup-stage{position:relative!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;display:grid!important;place-items:center!important;min-height:0!important}
.gallery-popup-frame{position:relative;display:grid;place-items:center;width:100%;height:100%;min-height:0;border-radius:16px;overflow:hidden;background:#050505;box-shadow:0 18px 54px rgba(0,0,0,.42)}
.gallery-popup-frame::after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid rgba(255,255,255,.055);border-radius:inherit;box-shadow:0 0 0 1px rgba(224,184,79,.055) inset}
.gallery-editorial-popup .popup-media,
.gallery-editorial-popup .popup-box img{
    display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:calc(90vh - 145px)!important;
    object-fit:contain!important;border:0!important;border-radius:0!important;box-shadow:none!important;
    animation:bondokMediaIn .42s cubic-bezier(.16,1,.3,1) both;
}
.gallery-editorial-popup .gallery-prev,.gallery-editorial-popup .gallery-next{
    position:static!important;transform:none!important;width:44px!important;height:64px!important;justify-self:center!important;
    display:grid!important;place-items:center!important;border:1px solid rgba(224,184,79,.28)!important;border-radius:999px!important;
    background:rgba(255,255,255,.022)!important;color:#E0B84F!important;box-shadow:none!important;
    font-size:0!important;cursor:pointer!important;transition:background .3s ease,border-color .3s ease,transform .3s ease!important;
}
.gallery-editorial-popup .gallery-prev span,.gallery-editorial-popup .gallery-next span{font:300 30px/1 Arial,sans-serif;transform:translateY(-1px)}
.gallery-editorial-popup .gallery-prev:hover,.gallery-editorial-popup .gallery-next:hover{background:rgba(224,184,79,.09)!important;border-color:rgba(224,184,79,.62)!important;transform:scale(1.04)!important}
.gallery-lightbox-foot{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:13px;padding:10px 3px 0;border-top:1px solid rgba(255,255,255,.045)}
.gallery-lightbox-line{height:1px;background:linear-gradient(90deg,transparent,rgba(224,184,79,.32))}.gallery-lightbox-line:last-child{background:linear-gradient(90deg,rgba(224,184,79,.32),transparent)}
.gallery-lightbox-copy{color:rgba(224,184,79,.58);font:500 8px/1 'Poppins',sans-serif;letter-spacing:.32em;white-space:nowrap}
@keyframes bondokLightboxIn{from{opacity:0}to{opacity:1}}
@keyframes bondokMediaIn{from{opacity:0;transform:scale(.975)}to{opacity:1;transform:none}}
@media(max-width:768px){
  .image-popup.gallery-editorial-popup{padding:10px!important}
  .gallery-editorial-popup .popup-box.gallery-luxury-lightbox{width:100%!important;height:min(88vh,760px)!important;padding:12px 11px 10px!important;border-radius:19px!important}
  .gallery-lightbox-title{display:none}.gallery-lightbox-kicker{font-size:12px;letter-spacing:.27em}
  .gallery-lightbox-body{grid-template-columns:1fr!important;gap:8px!important;padding:10px 0!important}
  .gallery-editorial-popup .gallery-prev,.gallery-editorial-popup .gallery-next{position:absolute!important;top:50%!important;z-index:8!important;width:42px!important;height:42px!important;border-radius:50%!important;background:rgba(4,4,4,.72)!important;backdrop-filter:blur(8px)!important}
  .gallery-editorial-popup .gallery-prev{left:8px!important}.gallery-editorial-popup .gallery-next{right:8px!important}
  .gallery-editorial-popup .popup-media,.gallery-editorial-popup .popup-box img{max-height:calc(88vh - 135px)!important}
  .gallery-lightbox-copy{font-size:7px;letter-spacing:.22em}.gallery-lightbox-foot{gap:8px}
}
