.site-logo img { 
    max-height: 70px !important; 
    margin-top: 0px; 
    margin-left: 40px;
  }
  @media (max-width: 768px) {
    /* Reset margin-left pada gambar agar menempel penuh di kiri */
    .site-logo img {
      max-width: 100%;
      height: auto;
      display: block;
      margin-left: 0 !important; /* Menghapus margin 40px khusus di HP */
    }
    /* Kontainer utama flexbox */
    .site-navbar {
      display: flex !important;
      justify-content: space-between !important;
      align-items: center !important;
      position: relative;
    }
    /* Pengaturan kontainer logo */
    .site-logo {
      display: flex;
      justify-content: flex-start;
      max-width: 60%;
      margin: 0 !important;
    }
    /* Sembunyikan informasi header di HP */
    .header-right {
      display: none; 
    }
    /* Menyesuaikan posisi tombol menu agar sejajar */
    .slicknav_btn, 
    .site-nav-menu,
    .site-navbar > button,
    .site-navbar > div:not(.site-logo) {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
      align-self: center !important;
    }
  }
  
  .page-top-section {
    position: relative;
    background-size: cover;
    background-position: center;
}

/* Layer gradien biru tua tipis/transparan dari kiri ke transparan total */
.page-top-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Nilai 0.60 & 0.40 membuat warna kiri lebih tipis/transparan */
    background: linear-gradient(to right, 
        rgba(2, 44, 67, 0.80) 0%, 
        rgba(2, 44, 67, 0.60) 50%, 
        rgba(2, 44, 67, 0.10) 80%, 
        transparent 100%
    );
    z-index: 1;
}

/* Memastikan teks tetap berada di atas lapisan gradien */
.page-top-section .container {
    position: relative;
    z-index: 2;
}


.img-zoom-wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 8px;
}

.img-zoom-wrapper img {
    transition: transform 0.3s ease;
    display: block;
    width: 100%;
}

.img-zoom-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent; /* Diubah: Latar gambar tetap terang & bersih */
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    transition: all 0.3s ease;
}

.img-zoom-overlay i {
    color: #ffffff;
    font-size: 20px;
    background: rgba(0, 0, 0, 0.4); /* Diubah: Lingkaran ikon dibuat transparan tipis */
    padding: 10px;
    border-radius: 50%;
    opacity: 0.7; /* Nilai transparansi ikon (0.1 - 1.0) */
    transition: all 0.3s ease;
}

/* Efek saat kursor diarahkan (Hover) */
.img-zoom-wrapper:hover .img-zoom-overlay i {
    opacity: 1; /* Ikon jadi makin jelas saat di-hover */
    background: rgba(0, 0, 0, 0.7);
    transform: scale(1.1);
}

.img-zoom-wrapper:hover img {
    transform: scale(1.05);
}