    .search-overlay {
      max-width: 800px;
      z-index: 10;
      position: absolute;
      bottom: -40px;
      left: 50%;
      transform: translateX(-50%);
    }

    /* Mobile: ubah posisi agar tidak menutupi banner */
    @media (max-width: 768px) {
      .search-overlay {
        position: static !important;
        bottom: auto !important;
        left: auto !important;
        transform: none !important;
        margin-top: 1rem !important;
        padding: 0 1rem !important;
      }
    }


    /* Umum */
    .bg-cover {
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
    }

    .logo-slider {
      overflow: hidden;
      position: relative;
      width: 100%;
    }

    .logo-track {
      display: flex;
      width: max-content;
      animation: scroll-left 250s linear infinite ;
    }


    .logo-group {
      display: flex;
    }

    .logo-item {
      flex: 0 0 auto;
      width: 120px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 10px;
      box-sizing: border-box;
    }

    .logo-item img {
      width: 100%;
      max-height: 80px;
      object-fit: contain;
    }

    /* Pause animation on hover (desktop) */
    .logo-slider:hover .logo-track {
      animation-play-state: paused;
    }

    /* Animasi jalan tanpa putus */
    @keyframes scroll-left {
        from {
          transform: translateX(0);
      }
      to {
          transform: translateX(-50%);
      }
    }

    /*  Tambahan untuk mobile (<= 768px) */
    @media (max-width: 768px) {
      .logo-item {
        width: 100px;
        /* lebih kecil agar muat lebih banyak logo di layar kecil */
        padding: 5px;
      }

      .logo-item img {
        max-height: 60px;
        /* kurangi tinggi logo untuk ukuran layar kecil */
      }

      .logo-track {
        animation-duration: 100;
        /* percepat animasi agar tidak terlalu lama di layar kecil */
      }

      .logo-slider:active .logo-track {
        animation-play-state: paused;
      }
    }
   
    /* --- CSS LENGKAP UNTUK POLIKLINIK GRID SCROLL --- */

    /* Wrapper untuk scrolling */
    .horizontal-scroll-wrapper {
      overflow-x: auto;
      /* Wajib untuk scroll horizontal */
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      /* iOS */

      /* Sembunyikan scrollbar untuk Firefox */
      scrollbar-width: none;

      /* Sembunyikan scrollbar untuk IE/Edge Legacy */
      -ms-overflow-style: none;
    }

    /* Sembunyikan scrollbar untuk Chrome, Safari, Edge (Webkit) */
    .horizontal-scroll-wrapper::-webkit-scrollbar {
      display: none;
    }

    /* Container Grid di dalam wrapper */
    .poliklinik-grid-scroll {
      display: grid;
      grid-auto-flow: column;
      /* Membuat grid mengalir ke samping */
      grid-template-rows: repeat(2, auto);
      /* Membuat 2 baris */
      grid-auto-columns: 200px;
      /* Lebar tetap untuk setiap kolom ikon (SESUAIKAN JIKA PERLU) */
      gap: 1.5rem;
      /* Jarak antar ikon */
      width: max-content;
      /* Membuat container melebar sesuai isi */
      padding-bottom: 5px;
      /* Beri sedikit ruang di bawah jika diperlukan */
      padding-left: 2px;
      /* Beri sedikit ruang di kiri jika mepet */
      padding-right: 2px;
      /* Beri sedikit ruang di kanan jika mepet */
    }

    /* Styling untuk setiap item poliklinik */
    .poliklinik-item {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      /* border: 1px solid lightgray;  */
    }

    /* Style untuk Ikon */
    .poliklinik-item .icon-wrapper {
      position: relative;
      width: 56px;
      height: 56px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 0.75rem;
    }

    .poliklinik-item .icon-wrapper svg {
      position: relative;
      z-index: 1;
      width: 24px;
      height: 24px;
    }
    .icon-wrapper img {
          position: relative;
          z-index: 2;
      }

    .poliklinik-item .icon-bg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--bs-secondary-bg, #e9ecef);
      border-radius: 50%;
      transition: transform 0.2s ease-in-out;
      z-index: 0;
    }

    .poliklinik-item .icon-wrapper.hover-effect-scale:hover .icon-bg {
      transform: scale(1.1);
    }

    /* Style untuk Teks */
    .poliklinik-item h3 {
      font-size: 0.875rem;
      margin-bottom: 0;
      font-weight: normal;
    }

    .poliklinik-item h3 a {
      color: inherit;
      text-decoration: none;
    }

    .poliklinik-item h3 a:hover {
      text-decoration: underline;
    }

    .poliklinik-item h3 a.stretched-link::after {
      position: static;
      /* Nonaktifkan efek stretched-link */
    }

    .berita-swiper-wrap { position: relative; }
    .berita-card { display: flex; flex-direction: column; height: 100%; }
    .thumb-wrap {
      position: relative;
      width: 100%;
      aspect-ratio: 4 / 5;      /* ubah kalau perlu; 1/1 untuk kotak */
      overflow: hidden;
      border-radius: 10px;
      background: #f3f4f6;
    }
    .thumb-wrap img { width: 100%; height: 100%; object-fit: contain !important; display: block; }
    .berita-title { line-height: 1.4; }
    .berita-title a{
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      min-height: calc(1.4em * 2);
    }
    .nav-arrow{
      position: absolute;
      top: calc(var(--thumb-h, 0px) / 2);  /* diisi via JS */
      transform: translateY(-50%);
      z-index: 5;
      width: 44px; height: 44px;
      border-radius: 999px;
      display: grid; place-items: center;
      border: 1px solid rgba(0,0,0,.15);
      background: rgba(255,255,255,.95);
      box-shadow: 0 6px 16px rgba(0,0,0,.12);
      cursor: pointer;
    }
    .nav-arrow-prev { left: -12px; }   /* ganti 8px kalau mau di dalam */
    .nav-arrow-next { right: -12px; }

    @media (max-width: 640px){
      .nav-arrow-prev { left: 6px; }
      .nav-arrow-next { right: 6px; }
    }

    .btn-custom-blue {
        background-color: #0375B4;
        border-color: #0375B4;
        color: #fff;
    }

    .btn-custom-blue:hover {
        background-color: #025a88;
        border-color: #025a88;
    }

    .btn-outline-blue {
      --fn-btn-color: #0375B4;
      --fn-btn-border-color: #0375B4;
      --fn-btn-hover-color: #fff;
      --fn-btn-hover-bg: #0375B4;
      --fn-btn-hover-border-color: #0375B4;
      --fn-btn-focus-shadow-rgb: 216, 81, 81;
      --fn-btn-active-color: #fff;
      --fn-btn-active-bg: #0375B4;
      --fn-btn-active-border-color: #0375B4;
      --fn-btn-active-shadow: none;
      --fn-btn-disabled-color: #0375B4;
      --fn-btn-disabled-bg: transparent;
      --fn-btn-disabled-border-color: #0375B4;
      --fn-gradient: none;
    }

    .img-dokter {
        width: 100%;
        height: 100%;
        object-fit: contain; /* atau cover */
        object-position: center;
        background-color: #fff; /* biar rapi kalau contain */
    }
    
    .bg-info-blue {
      background: none !important;   /* hapus warna/gambar */
      position: relative;
    }

     .btn-custom-yellow {
          background-color:#f4f27e !important;
          color:#333 !important;
          border:none !important;
    }
   
    .card-img-top {
      object-fit: cover;
      height: 100%;
    }

    .poliklinik-swiper .swiper-wrapper { display: flex !important; }

    .poliklinik-swiper .swiper-slide {
      text-align: center;
      width: 160px; /* bisa atur 150–200px sesuai kebutuhan */
    }

    /* Lebar tiap kartu; auto biar responsive (bisa diganti fixed px) */
    .poliklinik-swiper .swiper-slide { width: 160px; } /* coba 150–200px sesuai selera */

   .poliklinik-item .icon-wrapper{
      width: 75px !important;
      height: 75px !important;
      margin-bottom: .5rem;
    }

    .poliklinik-item {
      margin-bottom: 50px;
    }
    .poliklinik-item .icon-wrapper img{
      width: 100% !important;
      height: 100% !important;
      object-fit: contain; /* atau cover sesuai mau */
    }

   .hero-wrap{ 
      position:relative; 
      background:none !important; 
      min-height:420px; 
    }

    .hero-bg{
      position:absolute; 
      inset:0; 
      z-index:0;
      background-size:cover; 
      background-position:center; 
      background-repeat:no-repeat;
      transition:opacity .35s ease;
    }
    .hero-bg.is-fading{ opacity:0; }
    .hero-overlay{
      position:absolute; 
      inset:0; z-index:1; 
      pointer-events:none;
      /* overlay jangan terlalu gelap */
      background: linear-gradient(90deg, rgba(0,102,170,.30) 0%, rgba(0,102,170,.70) 100%);
    }

    .hero-content{ position:relative; z-index:2; } /* teks di atas overlay */

    .hero-textbox{
      /* lebar teks seperti contoh 1 */
      width: 520px;               /* sesuaikan 480–560px */
      max-width: 100%;
      /* tinggi tetap agar judul+desc+button selalu posisi sama */
      min-height: 210px;          /* tweak 190–240px sesuai kebutuhan */
      display: flex;
      flex-direction: column;
      justify-content: center;    /* center vertikal isi kotak */
      align-items: flex-start;    /* rata kiri di desktop */
      gap: 14px;                  /* jarak antar elemen (judul/teks/button) */
      text-align: left;           /* teks rata kiri */
    }

    @media (max-width: 991.98px){
      .hero-textbox{
        width: 100%;
        min-height: auto;         /* biar fleksibel di mobile */
        align-items: center;
        text-align: center;
      }
    }

    .bg-light-blue {
      background-color: #EEF7FF;
      border-radius: 15px; 
    }

    .bg-what-they {
      background-color: #EEF7FF ;
    }

    .top-bar{ 
      background:#0375B4; 
      /* z-index:1031;  */
    }
    .navbar-below-topbar{ 
      position: sticky; 
      top: var(--topbar-h, 40px); 
      z-index:1030; 
    }

    @media (min-width: 992px) {
      .top-cta .btn {
        padding: .75rem 1.5rem;
        font-size: 1rem;
      }
    } 





      