html {
        scroll-behavior: smooth;
    }

    .equal-height-images .item img {
        height: 250px;
        /* Sesuaikan tinggi yang diinginkan */
        object-fit: cover;
        /* Memastikan gambar tetap proporsional dan penuh */
        width: 100%;
        /* Agar gambar mengisi figure */
    }

    .wrapper.white-wrapper {
        opacity: 1;
        visibility: visible;
        transition: opacity 0.3s ease;
    }

    #tentangKami {
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
    }

    /* Loader Styles */
    .loader {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #ffffff;
        /* Sesuaikan dengan warna background Anda */
        z-index: 9999;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: opacity 0.5s ease;
    }

    .spinner {
        border: 8px solid #f3f3f3;
        border-top: 8px solid #6a0dad;
        /* Warna ungu dari tema Anda */
        border-radius: 50%;
        width: 80px;
        height: 80px;
        animation: spin 1s linear infinite;
    }

    @keyframes spin {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    /* Aturan Default (Saat UNSTICK) */
    .navbar #logo-unstick {
        display: block;
        /* Tampilkan Logo Unstick */
    }

    .navbar #logo-stick {
        display: none;
        /* Sembunyikan Logo Stick */
    }

    /* Aturan Saat STICK (Setelah Scroll ke Bawah) */
    /* Kelas .banner--stick biasanya ditambahkan oleh library seperti RevSlider atau custom JS */
    .navbar.banner--stick #logo-unstick {
        display: none;
        /* Sembunyikan Logo Unstick */
    }

    .navbar.banner--stick #logo-stick {
        display: block;
        /* Tampilkan Logo Stick */
    }

    /* Opsional: Terapkan juga untuk banner--clone agar konsisten di semua skenario */
    .navbar.banner--clone.banner--stick #logo-unstick {
        display: none;
        /* Sembunyikan Logo Unstick */
    }

    .navbar.banner--clone.banner--stick #logo-stick {
        display: block;
        /* Tampilkan Logo Stick */
    }

    .grid-view .item-detailed figure.overlay {
        /* Atur tinggi container agar selalu sama (misalnya, rasio 4:3 atau 16:9) */
        /* Contoh: 300px untuk tinggi gambar. Anda bisa menyesuaikan nilai ini. */
        height: 300px;

        /* Penting untuk memastikan gambar di dalamnya diposisikan relatif terhadap container ini */
        position: relative;

        /* Sembunyikan overflow (memotong gambar yang melebihi batas) */
        overflow: hidden;
    }

    .grid-view .item-detailed figure.overlay img {
        /* Gambar harus mengisi 100% lebar dan tinggi dari container figure */
        width: 100%;
        height: 100%;

        /* Kunci utama: memastikan gambar menutupi area container */
        /* 'cover' akan menjaga rasio aspek gambar, tetapi akan memotong bagian yang tidak muat */
        object-fit: cover;

        /* Memastikan gambar tidak terdistorsi (opsional, tapi bagus untuk memastikan) */
        object-position: center;
    }


    /* 1. Atur TINGGI TETAP pada container gambar (<figure>) di Galeri */
    #galery .item-detailed figure.overlay {
        /* Sesuaikan tinggi ini. Misalnya, 250px atau 300px agar seragam. */
        /* Saat ini, lebar figure sudah ditentukan oleh Bootstrap grid (col-lg-4) */
        height: 250px;

        position: relative;
        overflow: hidden;
        /* Penting: memotong gambar yang berlebih */
    }

    /* 2. Paksa Gambar (<img>) memenuhi 100% container dengan object-fit: cover */
    #galery .item-detailed figure.overlay img {
        width: 100%;
        height: 100%;

        /* Kunci utama: Memastikan gambar mengisi seluruh area bingkai tanpa distorsi */
        object-fit: cover;
        object-position: center;
    }