/* Reset */
* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
}

body {
   font-family: 'Arial', sans-serif;
   padding-top: 0;
   /* Diubah dari 76px karena navbar fixed dengan height 100vh */
   background-color: #f8f9fa;
   color: #333;
}

/* Navbar Transparan */
.navbar {
   background-color: transparent !important;
   transition: background-color 0.3s ease;
   padding: 15px 0;
   position: absolute;
   width: 100%;
   z-index: 1000;
}

.navbar.scrolled {
   background-color: rgba(255, 255, 255, 0.95) !important;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
   position: fixed;
}

.navbar-brand {
   height: 80px;
}

.navbar-nav .nav-item {
   margin: 0 10px;
}

.navbar-nav .nav-link {
   color: white !important;
   font-weight: 500;
   transition: color 0.3s;
}

.navbar.scrolled .nav-item .nav-link {
   color: #333 !important;
}

.navbar-nav .nav-link:hover {
   color: #2a5d9f !important;
}

.navbar.scrolled .nav-item .nav-link:hover {
   color: #2a5d9f !important;
}

.dropdown-menu {
   border: none;
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   border-radius: 8px;
}

.dropdown-item {
   padding: 8px 15px;
   transition: background-color 0.3s;
}

.dropdown-item:hover {
   background-color: #f8f9fa;
   color: #2a5d9f;
}

/* Carousel Full Height */
.carousel {
   height: 80vh;
   margin-top: 0;
   position: relative;
}

.carousel-inner,
.carousel-item {
   height: 100%;
}

.carousel-item img {
   object-fit: cover;
   height: 100%;
   width: 100%;
}

.carousel-caption {
   bottom: 50%;
   transform: translateY(50%);
   text-align: center;
}

/* Kategori dengan Carousel - Tombol di Tengah */
.category-carousel {
   position: relative;
   padding: 40px 0;
   overflow: hidden;
}

.category-carousel .carousel {
   height: auto;
}

.category-carousel .carousel-inner {
   padding: 20px 0;
}

.carousel-control-prev,
.carousel-control-next {
   width: 50px;
   height: 50px;
   background: rgba(42, 93, 159, 0.8);
   border-radius: 50%;
   top: 50%;
   transform: translateY(-50%);
   opacity: 0.8;
   display: flex;
   align-items: center;
   justify-content: center;
}

.carousel-control-prev {
   left: 15px;
}

.carousel-control-next {
   right: 15px;
}

.carousel-control-prev:hover,
.carousel-control-next:hover {
   opacity: 1;
   background: rgba(42, 93, 159, 1);
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
   width: 20px;
   height: 20px;
}

/* About Section */
.about {
   background-color: #fff;
   padding: 60px 0;
   margin-bottom: 40px;
   border-radius: 10px;
   box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);
}

.about h1.display-4 {
   color: #2a5d9f;
   font-weight: 700;
   margin-bottom: 20px;
}

.about p.lead {
   color: #666;
   font-size: 1.2rem;
}

/* Category Sections */
.category-section {
   padding: 60px 0;
   background-color: #fff;
   margin-bottom: 40px;
   border-radius: 10px;
   box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);
}

.section-title {
   color: #2a5d9f;
   font-weight: 700;
   margin-bottom: 40px;
   position: relative;
   padding-bottom: 15px;
   text-align: center;
}

.section-title::after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
   width: 80px;
   height: 3px;
   background-color: #2a5d9f;
}

/* Wisata Cards */
.wisata-card {
   border: none;
   border-radius: 12px;
   overflow: hidden;
   box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s, box-shadow 0.3s;
   height: 100%;
   margin: 10px;
}

.wisata-card:hover {
   transform: translateY(-5px);
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}

.wisata-card .card-img-top {
   height: 220px;
   object-fit: cover;
}

.wisata-card .card-body {
   padding: 20px;
}

.wisata-card .card-title {
   color: #2a5d9f;
   font-weight: 600;
   margin-bottom: 15px;
}

.rating {
   color: #FFD700;
   margin-bottom: 15px;
}

.rating i {
   margin-right: 3px;
}

.btn-vote {
   background: #2a5d9f;
   color: white;
   border: none;
   padding: 10px 20px;
   border-radius: 6px;
   font-weight: 500;
   transition: all 0.3s;
   width: 100%;
}

.btn-vote:hover {
   background: #1a4475;
   transform: translateY(-2px);
}

/* Footer */
.footer {
   background-color: #2a5d9f;
   color: white;
   padding: 20px 0;
   margin-top: 40px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
   body {
      padding-top: 0;
   }

   .navbar {
      padding: 10px 0;
      background-color: rgba(255, 255, 255, 0.95) !important;
   }

   .navbar-nav .nav-link {
      color: #333 !important;
   }

   .carousel {
      height: 60vh;
   }

   .carousel-control-prev {
      left: 5px;
   }

   .carousel-control-next {
      right: 5px;
   }

   .carousel-control-prev,
   .carousel-control-next {
      width: 40px;
      height: 40px;
   }

   .about h1.display-4 {
      font-size: 2rem;
   }

   .about p.lead {
      font-size: 1rem;
   }

   .section-title {
      font-size: 1.8rem;
   }

   .wisata-card {
      margin: 5px;
   }
}

/* Memastikan konten setelah carousel tidak tertutup navbar */
.main-content {
   position: relative;
   z-index: 1;
}