/* Import Google Fonts */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;700&display=swap");

/* Navbar */
.navbar {
  background-color: #151515; /* Warna background */
  transition: background-color 0.3s ease-in-out;
  padding: 10px 0;
}

.navbar-brand {
  margin-right: auto;
}

.navbar-nav {
  margin-right: 0;
}

.navbar .nav-link {
  color: white;
  font-size: 17px;
  position: relative;
  padding-bottom: 1px;
  transition: color 0.3s ease;
}

.navbar .nav-link::after {
  content: "";
  position: absolute;
  width: 0; /* Tidak ada garis saat tidak aktif */
  height: 3px;
  background-color: rgb(213, 177, 17); /* Warna kuning */
  bottom: -8px;
  left: 0;
  border-radius: 10px; /* Menambahkan radius untuk garis bawah */
  transition: width 0.3s ease-in-out;
}

.navbar .nav-link.active::after {
  width: 100%; /* Garis kuning penuh hanya pada link yang aktif */
}

.navbar .nav-link:hover {
  color: rgb(213, 177, 17); /* Hanya teks berubah warna saat hover */
}

.navbar .nav-link.active {
  color: rgb(213, 177, 17); /* Teks juga tetap kuning pada link aktif */
}

/* Responsiveness */
@media (max-width: 991px) {
  .navbar .nav-link {
    font-size: 16px;
    padding-bottom: 8px;
  }

  .navbar {
    padding: 10px 15px;
  }
}

@media (max-width: 767px) {
  .navbar .nav-link {
    font-size: 15px;
    padding-bottom: 10px;
  }

  .navbar {
    padding: 15px 10px;
  }
}
.carousel-inner img {
  max-height: 45vh; /* Mengurangi tinggi gambar menjadi 40% dari tinggi layar */
  width: 100%; /* Memastikan lebar gambar   menutupi area */
  height: auto; /* Tinggi disesuaikan dengan proporsi gambar */
  object-fit: contain; /* Memastikan gambar tidak terpotong dan tetap terlihat utuh */
  margin-top: 10px;
  margin-bottom: 3px;
}

.carousel-indicators {
  text-align: center;
  margin-top: 5px; /* Jarak atas dari gambar */
}

.carousel-indicators button {
  width: 10px; /* Mengubah lebar bulatan lebih kecil */
  height: 10px; /* Mengubah tinggi bulatan lebih kecil */
  border-radius: 50%;
  border: none;
  background-color: #ccc;
  margin: 0 3px; /* Jarak antar bulatan */
  margin-bottom: 20px;
}

.carousel-indicators .active {
  background-color: #323232; /* Warna untuk bulatan aktif */
}

.card {
  border: 5px solid #ddd;
  border-radius: 20px;
  max-width: 100%; /* Mengatur lebar maksimal card agar lebih kecil */
  margin: 10px auto; /* Mengatur margin agar card terpusat */
  padding: 5px; /* Menambahkan padding agar isi card tidak terlalu rapat */
  background-color: gold;
  border-color: #323232;
}

/* Footer */
.footer {
  background-color: #000; /* Warna latar belakang footer */
  color: #fff; /* Warna teks footer */
  text-align: center;
  padding: 20px 0;
}

/* Footer */
.footer {
  background-color: #323232; /* Warna latar belakang footer */
  color: #ffffff; /* Warna teks */
  padding: 40px 0; /* Ruang vertikal pada footer */
  margin-top: 80px;
}

.footer-logo {
  height: 60px; /* Tinggi logo */
  color: white;
}

.footer-description {
  font-size: 1.2rem; /* Ukuran font untuk deskripsi */
  max-width: 600px; /* Lebar maksimum untuk deskripsi */
  margin: 0 auto; /* Memusatkan deskripsi */
  color: #ffffff; /* Pastikan deskripsi berwarna putih */
}

.social-icons {
  display: flex; /* Mengatur sosial media dalam baris */
  justify-content: center; /* Memusatkan ikon sosial media */
  gap: 20px; /* Jarak antar ikon */
}

.social-icon {
  color: #ffffff; /* Warna ikon sosial media */
  font-size: 1.5rem; /* Ukuran ikon sosial media */
  transition: color 0.3s; /* Transisi untuk efek hover */
}

.social-icon:hover {
  color: #17a2b8; /* Warna saat hover */
}

.copyright {
  font-size: 0.9rem; /* Ukuran font untuk hak cipta */
  margin-top: 20px; /* Ruang di atas hak cipta */
  color: #ffffff; /* Warna teks untuk hak cipta */
}

/* Menyembunyikan dropdown secara default */
.dropdown-menu {
  display: none; /* Dropdown tidak terlihat secara default */
}

/* Menampilkan dropdown saat hover */
.nav-item:hover .dropdown-menu {
  display: block; /* Menampilkan dropdown saat hover */
  border-radius: 10px;
}

/* Mengatur tampilan item dropdown saat di-hover */
.dropdown-menu .dropdown-item {
  border-radius: 5px; /* Menambahkan border radius */
}

/* Mengatur efek hover pada item dropdown */
.dropdown-menu .dropdown-item:hover {
  background-color: #ffeb3b; /* Warna kuning */
  color: #000; /* Warna teks hitam */
}