/* ========================================
   NAVBAR - Border Radius + Smooth Hover + Fade-in + Font + Transparent on Scroll
   ======================================== */

/* Navbar dengan gradient putih kehitaman */
.menu .navbar {
  background: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  transition: background 0.3s ease, backdrop-filter 0.3s ease;
}

.menu .navbar.scrolled {
  background: linear-gradient(135deg, rgba(248, 250, 252, 0.85) 0%, rgba(203, 213, 225, 0.85) 100%) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* FIX: Offcanvas sidebar harus di atas navbar & tampil penuh */
.offcanvas.offcanvas-end {
  z-index: 9999 !important;
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  height: 100vh !important;
  width: 500px !important;
  max-width: 90vw !important;
  background: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  transform: translateX(100%);
  transition: transform 0.3s ease;
}

.offcanvas.offcanvas-end.show {
  transform: translateX(0) !important;
}

/* Rapikan typography offcanvas */
.offcanvas-body {
  padding: 1.5rem 1.8rem !important;
}

/* Header offcanvas dengan close button */
.offcanvas-header {
  padding: 1rem 1.8rem !important;
  border-bottom: 1px solid #eee !important;
}

/* Judul sidebar - kompak & rapi */
.offcanvas-body h3,
.offcanvas-body .mbr-section-subtitle {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  margin-bottom: 1rem !important;
  margin-top: 0 !important;
  text-align: left !important;
  line-height: 1.3 !important;
  color: #000 !important;
}

/* Paragraf deskripsi - rata kiri-kanan kompak dengan spacing lebih baik */
.offcanvas-body p,
.offcanvas-body .offcanvas_contact p,
.offcanvas-body .mbr-text {
  font-size: 0.9rem !important;            
  line-height: 1.75 !important;            
  text-align: justify !important;
  margin-bottom: 1rem !important;          
  color: #444 !important;
  word-spacing: normal !important;         /* 0.05em -> normal (karena sidebar lebih lebar) */
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
  -moz-hyphens: auto !important;
  text-justify: inter-word !important;
}

/* Icon sosmed - spacing */
.offcanvas-body .icons-menu {
  margin: 1.5rem 0 !important;
  display: flex !important;
  gap: 0.8rem !important;
}

/* Button Hubungi Kami */
.offcanvas-body .mbr-section-btn {
  margin-top: 1.5rem !important;
}

.offcanvas-body .mbr-section-btn .btn {
  font-size: 0.9rem !important;
  padding: 0.6rem 1.5rem !important;
}

/* Backdrop offcanvas juga harus di atas navbar */
.offcanvas-backdrop {
  z-index: 9998 !important;
}

.offcanvas-backdrop.show {
  opacity: 0.5 !important;
}

/* Dropdown Menu - Border Radius Modern + Smooth Fade-in + Gradient */
.menu .dropdown-menu {
  border-radius: 12px !important;
  overflow: visible !important;
  animation: dropdownFadeIn 0.25s ease;
  transform-origin: top;
  background: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.1) !important;
}

@keyframes dropdownFadeIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Dropdown Submenu - Border Radius Modern + Smooth Fade-in + Gradient */
.menu .dropdown-submenu {
  border-radius: 12px !important;
  overflow: visible !important;
  animation: dropdownFadeIn 0.25s ease;
  background: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.1) !important;
}

/* Font Size & Weight - Lebih Besar & Extra Bold */
.menu .nav-link {
  font-size: 15.5px !important;          /* 14px -> 15.5px (lebih besar) */
  font-weight: 900 !important;           /* 800 -> 900 (maksimal bold) */
  letter-spacing: -0.2px !important;     /* -0.3px -> -0.2px (sedikit lebih longgar) */
  padding-left: 0.45rem !important;      
  padding-right: 0.45rem !important;     
}

.menu .dropdown-item {
  font-size: 13px !important;
  font-weight: 600 !important;           /* Tetap 600 (lebih ringan dari navbar) */
}

/* Smooth Transitions */
.menu .nav-link,
.menu .dropdown-item {
  transition: all 0.3s ease;
}

/* Nav Link Smooth Hover */
.menu .nav-link:hover {
  transform: translateY(-2px);
}

/* Dropdown Item Smooth Hover */
.menu .dropdown-item {
  border-radius: 6px;
  margin: 2px 6px;
}

.menu .dropdown-item:hover {
  background: rgba(52, 152, 219, 0.08) !important;
  transform: translateX(3px);
}

/* Button Smooth Hover */
.menu .btn {
  transition: all 0.3s ease;
}

.menu .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Social Icons Smooth Hover */
.menu .iconfont-wrapper {
  transition: all 0.3s ease;
}

.menu .iconfont-wrapper:hover {
  transform: translateY(-2px) scale(1.05);
}

/* Logo Smooth Hover */
.menu .navbar-logo {
  transition: transform 0.3s ease;
}

.menu .navbar-logo:hover {
  transform: scale(1.02);
}

/* ========================================
   HIDE CAROUSEL NAVIGATION ARROWS
   ======================================== */

/* Sembunyikan tombol prev/next carousel di slider utama */
.carousel-control-prev,
.carousel-control-next {
  display: none !important;
}

/* ========================================
   QUICK ACCESS MENU - Blue Gradient with Icon
   ======================================== */

/* Sembunyikan icon */
.bkc-qic-media {
  display: none !important;
}

/* Content wrapper - hanya text, tanpa icon */
.bkc-qa-item-content {
  display: block !important;
  width: 100% !important;
  color: #1e293b !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  line-height: 1.3 !important;
}

/* Quick access item - gradient putih kehitaman */
.bkc-qa-item {
  background: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  border-radius: 0 !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 15px rgba(100, 116, 139, 0.2) !important;
  color: #1e293b !important;
  text-decoration: none !important;
  padding: 1rem 0.6rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 70px !important;
}

/* Item PERTAMA - radius kiri saja */
.bkc-qa-item:first-child {
  border-radius: 12px 0 0 12px !important;
}

/* Item TERAKHIR - radius kanan saja */
.bkc-qa-item:last-child {
  border-radius: 0 12px 12px 0 !important;
}

/* Hover effect - lift & shadow dengan gradient putih lebih terang */
.bkc-qa-item:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 8px 25px rgba(100, 116, 139, 0.3) !important;
  background: linear-gradient(135deg, #ffffff 0%, #e2e8f0 100%) !important;
  color: #1e293b !important;
}

/* ========================================
   DROPDOWN MENU - FORCE GRADIENT (Override Bootstrap/Mobirise)
   ======================================== */

/* Main dropdown menu - MAXIMUM SPECIFICITY */
section.menu .navbar .dropdown-menu,
.menu .navbar .dropdown-menu,
.navbar .dropdown-menu,
.dropdown-menu.show,
.dropdown-menu {
  background: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  background-color: #f8fafc !important;
  background-image: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  border: 1px solid #cbd5e1 !important;
}

/* Submenu dropdown - MAXIMUM SPECIFICITY */
section.menu .navbar .dropdown-submenu,
.menu .navbar .dropdown-submenu,
.navbar .dropdown-submenu,
.dropdown-submenu.show,
.dropdown-submenu,
.dropdown-menu .dropdown-submenu {
  background: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  background-color: #f8fafc !important;
  background-image: linear-gradient(135deg, #f8fafc 0%, #cbd5e1 100%) !important;
  border: 1px solid #cbd5e1 !important;
}

/* Dropdown item background ketika hover - agar tidak putih */
.dropdown-menu .dropdown-item:hover,
.dropdown-submenu .dropdown-item:hover {
  background-color: rgba(203, 213, 225, 0.5) !important;
}