/* MDIX Hotel Elegan — perbaikan audit template */

/* Mega menu "Beranda" berisi tangkapan layar demo tema bermerek ALMARIS: sembunyikan gambarnya
   (mega menu itu sendiri dilepas dari menu pada audit design-QA 2026-10-12, aturan ini tinggal jaga-jaga) */
.sb-menu img[src^="images/demo/"] {
  display: none !important;
}

/* Foto berbingkai lengkung (.shape-mask-1/2) memakai jarallax. backdrop-filter pada bingkai membuat
   gambar "fixed" milik jarallax dihitung dari bingkai, bukan layar, sehingga foto bergeser keluar /
   hilang. Foto dibuat statis di dalam bingkai (efek parallax kecil ini dihilangkan). */
.shape-mask-1.jarallax .jarallax-img,
.shape-mask-2.jarallax .jarallax-img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin-top: 0 !important;
  transform: none !important;
}

/* Kontras AA (D-20): emas tema #ab8965 hanya 3,2:1 dengan putih (tombol) dan 3,0–3,2:1 sebagai teks
   di latar terang. Warna merek dipergelap sedikit menjadi #85663f (5,3:1 dengan putih). */
:root {
  --primary-color: #85663f;
  --primary-color-rgb: 133, 102, 63;
}

/* Bagian testimoni memakai foto jarallax; beri warna dasar gelap agar teks putih tetap terbaca
   bila foto belum/tidak termuat */
section.jarallax.section-dark,
section.jarallax.text-light {
  background-color: #1b1b1b;
}

/* Harga Rupiah di kotak harga detail kamar/promo terlalu lebar untuk 48px: kecilkan */
.mt-70 .de_count h2 {
  font-size: clamp(28px, 3vw, 40px);
  white-space: nowrap;
}

/* Berita hanya satu halaman: sembunyikan paginasi contoh yang tidak mengarah ke mana pun */
.pagination {
  display: none;
}

/* Judul sambutan di beranda ada di kolom sempit (col-lg-4): kecilkan agar tidak 6–8 baris */
@media (min-width: 992px) {
  .lines-deco .col-lg-4.text-center h2 {
    font-size: 36px;
    line-height: 1.25;
  }
}

/* Kartu kamar: harga & "Lihat Detail" hanya muncul saat hover — di layar sentuh tampilkan selalu */
@media (hover: none) {
  .hover > .abs.hover-op-1.abs-centered {
    opacity: 1;
    margin-top: 0;
    top: 40%;
  }
  .hover > .abs.hover-op-1.abs-centered h3 {
    font-size: 26px;
    margin-bottom: 12px !important;
    white-space: nowrap;
  }
  .hover > .abs.bg-color.hover-op-1 {
    opacity: 0.45;
  }
}

/* Header HP: tombol menu 44px, menu tertutup benar-benar tersembunyi, menu panjang bisa digulir */
@media (max-width: 991px) {
  #menu-btn {
    width: 44px;
    height: 44px;
    padding: 0;
    line-height: 44px;
    text-align: center;
    margin-left: 8px;
  }
  header.header-mobile:not(.menu-open) #mainmenu {
    display: none;
  }
  header.header-mobile.menu-open {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* Target sentuh: logo, ikon sosial, titik slider */
#logo a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.social-icons a,
.topbar-widget a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
}
.owl-dots button.owl-dot {
  width: 24px;
  height: 24px;
  padding: 8px;
  margin: 0 1px;
  box-sizing: border-box;
  background-clip: content-box;
}

/* Breadcrumb di banner halaman dalam: area sentuh minimal 24px */
.crumb a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}

/* Footer bertumpuk di HP/tablet: beri jarak antar blok */
@media (max-width: 991px) {
  footer .d-lg-flex > div + div {
    margin-top: 28px;
  }
}

/* Teks aksen emas di panel gelap (bar reservasi, kotak pemesanan): pakai emas terang agar terbaca */
.bg-dark .id-color,
.section-dark .id-color,
.bg-dark-1 .id-color {
  color: #c4a07a;
}

/* Tautan "Balas" di komentar berita: area sentuh minimal 24px */
.c_reply a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
  padding: 0 4px;
}

/* Kotak pemesanan di detail kamar: harga Rupiah lebih panjang dari $ — izinkan baris turun & beri jarak */
.bg-dark.text-light.p-5 .d-flex.justify-content-between {
  flex-wrap: wrap;
  column-gap: 16px;
  align-items: baseline;
}
@media (max-width: 575px) {
  .bg-dark.text-light.p-5 {
    padding: 28px 20px !important;
  }
}
.bg-dark.text-light.p-5 > .d-flex.justify-content-between:first-child {
  margin-bottom: 12px;
}
@media (max-width: 991px) {
  footer .social-icons.mb-sm-30 {
    margin-bottom: 0;
  }
}