/** @format */

@media (min-width: 992px) {
  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }
}
@media (max-width: 576px) {
  h1 {
    font-size: 25px;
  }

  p {
    font-size: 12px;
  }

  h3 {
    font-size: 18px;
  }

  h4 {
    font-size: 15px;
  }

  h5 {
    font-size: 10px;
  }

  .pengenalan-img {
    display: none;
  }

  .pengenalan {
    margin-top: 0; /* Hilangkan margin atas */
    padding-top: 20px; /* Beri sedikit padding untuk jarak yang cukup */
  }

  
  .hero-tag {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 20px;
    position: relative;
    z-index: 0;
  }

  .hero-section .container {
    z-index: 0;
    position: relative;
    background-color: none; /* Tetap menggunakan efek transparansi */
    padding: 20px 40px; /* Sesuaikan padding */
    border-radius: 12px; /* Tambahkan sudut membulat untuk estetika */
    max-width: 800px; /* Batas lebar maksimal agar tidak terlalu lebar */
    margin: 0 auto; /* Pusatkan container */
    height: auto; /* Pastikan tinggi mengikuti isi */
  }

  .hero-tag h1 {
    font-size: 10px; /* Kurangi ukuran font */
  }

  .hero-tag h2 {
    font-size: 5px; /* Kurangi ukuran font */
  }

  .hero-tag button {
    display: none; /* Sembunyikan tombol saat di layar ponsel */
  }

  /* Berita */
  .carousel-item {
    height: 300px !important; /* Ubah tinggi di layar kecil */
  }

  .berita-item {
    height: 100% !important;
    background-size: cover !important;
    background-position: center !important;
  }

  .caption {
    padding: 10px !important; /* Kurangi padding agar teks tidak terlalu besar */
    font-size: 14px !important; /* Perkecil ukuran teks */
  }

  .caption h5 {
    font-size: 16px !important; /* Perkecil ukuran judul */
  }

  .service-box {
    max-width: 50%;
    height: auto;
    text-align: center;
    transition: 0.3s;
    border-radius: 5px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .service .row {
    justify-content: center;
  }

  .layanan-img {
    max-width: 50%;
  }

  .hero-tag h1 {
    line-height: 52px;
  }
  .hero-tag .button {
    font-size: 15px;
    width: 75%;
    height: 75%;
  }

  .kontak-img {
    width: 22px;
  }

  .watermark {
    font-size: 10px;
  }

  .list-group-item {
    font-size: 12px;
  }
}

/* @media (min-width: 768px) {
    .col-md-6 {
         flex: 0 0 auto;
    width: 50%;
  
    }
} */