/* ══ Blok Galeri — item grid ══
   overflow/aspect-ratio/border-radius sengaja ditaruh di file CSS eksternal
   ini (bukan inline style="...") — HtmlSanitizer (HTMLPurifier) memakai
   whitelist CSS default yang tidak mengizinkan properti seperti border-radius,
   overflow, atau aspect-ratio pada atribut style inline, jadi kalau ditulis
   inline akan senyap terpangkas saat konten disimpan.

   Struktur: <figure class="bk-gallery-item"> adalah target klik (area zoom +
   caption), sedangkan crop rasio 4:3 + overflow:hidden + radius HANYA di
   <div class="bk-gallery-media"> yang membungkus <img>. Kalau overflow:hidden
   ditaruh di <figure> yang juga membungkus <figcaption>, teks caption akan
   ikut terpotong karena melewati tinggi box rasio 4:3 itu. */
.bk-gallery-item {
    display: block;
    margin: 0;
    cursor: zoom-in;
}
.bk-gallery-media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4 / 3;
}
.bk-gallery-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform .25s ease, opacity .2s ease;
}
.bk-gallery-item:hover .bk-gallery-media img {
    transform: scale(1.03);
    opacity: .92;
}

.bk-gallery-media.bk-gallery-radius-none { border-radius: 0; }
.bk-gallery-media.bk-gallery-radius-sm { border-radius: 6px; }
.bk-gallery-media.bk-gallery-radius-md { border-radius: 12px; }
.bk-gallery-media.bk-gallery-radius-lg { border-radius: 24px; }
.bk-gallery-media.bk-gallery-radius-circle { border-radius: 50%; }