.elementor-2889 .elementor-element.elementor-element-bd00f33{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-2889 .elementor-element.elementor-element-bd00f33:not(.elementor-motion-effects-element-type-background), .elementor-2889 .elementor-element.elementor-element-bd00f33 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#AAAAAA00;}.elementor-2889 .elementor-element.elementor-element-6a614f0{--display:flex;--flex-wrap:nowrap;--border-radius:15px 15px 15px 15px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2889 .elementor-element.elementor-element-6a614f0.e-con{--align-self:center;}.elementor-2889 .elementor-element.elementor-element-cc99563{text-align:center;}.elementor-2889 .elementor-element.elementor-element-cc99563 img{width:100%;transition-duration:1.2s;}.elementor-2889 .elementor-element.elementor-element-3eb5740{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-2889 .elementor-element.elementor-element-3eb5740.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-2889 .elementor-element.elementor-element-bcf36ee{--display:flex;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--flex-wrap:nowrap;--border-radius:15px 15px 15px 15px;--padding-top:20px;--padding-bottom:20px;--padding-left:30px;--padding-right:30px;}.elementor-2889 .elementor-element.elementor-element-bcf36ee:not(.elementor-motion-effects-element-type-background), .elementor-2889 .elementor-element.elementor-element-bcf36ee > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF00;}.elementor-2889 .elementor-element.elementor-element-bcf36ee.e-con{--align-self:center;}.elementor-2889 .elementor-element.elementor-element-fb934cf{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:center;}.elementor-2889 .elementor-element.elementor-element-fb934cf.elementor-element{--align-self:center;}.elementor-2889 .elementor-element.elementor-element-fb934cf .elementor-heading-title{font-family:"Exo", Sans-serif;font-size:18px;font-weight:300;color:#474747;}@media(max-width:767px){.elementor-2889 .elementor-element.elementor-element-bd00f33{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-2889 .elementor-element.elementor-element-cc99563 img{width:90%;}.elementor-2889 .elementor-element.elementor-element-bcf36ee{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(min-width:768px){.elementor-2889 .elementor-element.elementor-element-bd00f33{--content-width:1600px;}.elementor-2889 .elementor-element.elementor-element-3eb5740{--width:100%;}}/* Start custom CSS for image, class: .elementor-element-cc99563 */@media (max-width: 767px) {
    /* 1. Mengatur Container Utama */
    .product-slider-mobile {
        /* Memastikan container bisa di-scroll secara horizontal */
        overflow-x: auto; 
        /* Menyembunyikan scrollbar agar terlihat lebih rapi seperti slider */
        scrollbar-width: none; /* Untuk Firefox */
        -ms-overflow-style: none; /* Untuk IE dan Edge */
        padding-bottom: 20px; /* Tambahkan ruang di bawah jika scrollbar tidak tersembunyi */
    }

    /* Menyembunyikan scrollbar untuk Chrome/Safari/Opera */
    .product-slider-mobile::-webkit-scrollbar {
        display: none;
    }

    /* 2. Mengatur Container Item */
    .product-slider-mobile .jet-listing-grid__items {
        /* Mengatur semua item berada dalam satu baris */
        display: flex;
        /* Penting: Mencegah item turun ke baris baru */
        flex-wrap: nowrap; 
    }

    /* 3. Mengatur Ukuran Setiap Item */
    .product-slider-mobile .jet-listing-grid__item {
        /* Mengatur lebar item, misalnya 45% dari viewport width (2 item terlihat) */
        flex: 0 0 45vw; /* flex-grow: 0, flex-shrink: 0, lebar: 45% dari viewport */
        margin-right: 15px; /* Memberi jarak antar item */
        
        /* Opsional: Efek "Snap" */
        scroll-snap-align: start; 
        /* Memastikan item pertama terlihat penuh saat scroll */
    }
    
    /* Tambahkan margin di awal dan akhir untuk centering yang lebih baik (opsional) */
    .product-slider-mobile .jet-listing-grid__item:first-child {
        margin-left: 15px;
    }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-fb934cf *//* Pastikan container items bertindak sebagai Row */
.jet-listing-grid__items {
    /* Menggunakan Flexbox sebagai base container (default JetListing biasanya sudah ini) */
    display: flex;
    /* Memungkinkan item pindah ke baris baru */
    flex-wrap: wrap; 
    /* Mengatur jarak (gap) antar item */
    gap: 15px; 
    margin: 0 !important;
    padding: 0 !important;
}

/* Pastikan setiap item bertindak sebagai Col di desktop (5 kolom) */
.jet-listing-grid__item {
    /* Menentukan lebar untuk 5 kolom (100% / 5 = 20%) dikurangi jarak */
    width: calc(20% - 12px); /* 12px adalah contoh untuk jarak */
    /* Mengatur flex untuk 5 kolom */
    flex: 0 0 calc(20% - 12px); 
    margin: 0 !important; /* Hilangkan margin bawaan yang mungkin mengganggu */
}

/* --- Perubahan untuk Mobile (2 Kolom) --- */
@media (max-width: 767px) {
    /* Override agar Row (jet-listing-grid__items) sekarang mengatur tata letak 2 kolom */
    .jet-listing-grid__items {
        /* Kembali ke CSS Grid agar lebih mudah mengatur kolom */
        display: grid; 
        /* Membuat 2 kolom dengan lebar fraksi yang sama */
        grid-template-columns: repeat(2, 1fr) !important;
        /* Tambah jarak antar kolom dan baris */
        gap: 10px !important;
    }

    /* Pastikan setiap item (Col) mengambil lebar penuh dari kolom yang baru */
    .jet-listing-grid__item {
        width: 100% !important; 
        flex: unset !important; /* Batalkan pengaturan 5 kolom Flex */
        max-width: unset !important;
    }
}/* End custom CSS */