/* ==========================================================================
   Experience Java Tour - tema Earthy Editorial
   Palet brief: Warm Ivory, Deep Java Brown, Muted Terracotta, Sage, Charcoal.
   Dibangun di atas Bootstrap 5 (CDN). Hanya berisi lapisan kustom.

   Catatan aksesibilitas: terracotta murni (#A65D43) hanya 4.32:1 di atas ivory,
   jadi warna itu dipakai untuk BIDANG (tombol, badge) sementara teks memakai
   varian gelap --tk-orange-dark (6.04:1). Sage sama: bidang, bukan teks.
   ========================================================================== */

:root {
  /* Warna utama - Deep Java Brown */
  --tk-green: #3B2A21;
  --tk-green-dark: #2A1D17;
  --tk-green-light: #EAE3D8;
  /* Aksen utama / CTA - Muted Terracotta */
  --tk-orange: #A65D43;
  --tk-orange-dark: #8A4832;
  --tk-orange-light: #F0E3DC;
  /* Aksen kedua - Sage */
  --tk-olive: #78816B;
  --tk-olive-dark: #5A6250;
  --tk-olive-light: #E7E9E1;
  /* Netral - Warm Ivory & Charcoal */
  --tk-cream: #F4F0E6;
  --tk-sand: #EDE8DB;
  --tk-ink: #292624;
  --tk-muted: #6E6861;
  --tk-line: #DED6C6;
  /* Tinggi area hero. Ubah satu nilai ini untuk membuat hero lebih tinggi/pendek. */
  --tk-hero-height: clamp(460px, 68vh, 760px);
  /* Sudut nyaris lurus: brief meminta menghindari tampilan penuh rounded card. */
  --tk-radius: 4px;
  --tk-radius-sm: 3px;
  --tk-shadow: 0 8px 26px rgba(41, 38, 36, .07);
  --tk-shadow-lg: 0 18px 44px rgba(41, 38, 36, .12);
  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --tk-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
}

body {
  font-family: var(--bs-body-font-family);
  color: var(--tk-ink);
  background: var(--tk-cream);
  overflow-x: hidden;
}

/* Serif editorial hanya untuk judul; nav, tombol, dan body tetap sans-serif. */
h1, h2, h3, h4, h5, .display-1, .display-2, .display-3, .tk-display {
  font-family: var(--tk-font-display);
  font-weight: 600;
  letter-spacing: -.015em;
  font-variation-settings: 'SOFT' 20, 'WONK' 0;
}
h1, .display-1, .display-2 { letter-spacing: -.025em; }
a { text-decoration: none; }
.text-muted-2 { color: var(--tk-muted) !important; }

/* Label kecil bergaya editorial: huruf kapital berspasi lebar. */
.tk-kicker {
  font-family: var(--bs-body-font-family);
  font-size: .74rem; font-weight: 600; letter-spacing: .16em;
  text-transform: uppercase; color: var(--tk-orange-dark);
}
.bg-green .tk-kicker, .tk-pagehead .tk-kicker, .tk-dark .tk-kicker { color: #C9A18C; }

/* --- Warna utilitas ------------------------------------------------- */
.text-green { color: var(--tk-green) !important; }
/* Sengaja memakai varian gelap: terracotta murni gagal AA sebagai teks. */
.text-orange { color: var(--tk-orange-dark) !important; }
.bg-green { background: var(--tk-green) !important; }
.bg-green-soft { background: var(--tk-green-light) !important; }
.bg-orange { background: var(--tk-orange) !important; }
.bg-orange-soft { background: var(--tk-orange-light) !important; }
/* Body sudah ivory, jadi .bg-cream dipakai sebagai pita pasir yang sedikit
   lebih dalam. Pergantian nada dibuat halus, bukan blok warna berbeda-beda. */
.bg-cream { background: var(--tk-sand) !important; }
.bg-ivory { background: var(--tk-cream) !important; }
.bg-paper { background: #fff !important; }

.btn-green { background: var(--tk-green); border-color: var(--tk-green); color: #fff; }
.btn-green:hover, .btn-green:focus { background: var(--tk-green-dark); border-color: var(--tk-green-dark); color: #fff; }
.btn-orange { background: var(--tk-orange); border-color: var(--tk-orange); color: #fff; }
.btn-orange:hover, .btn-orange:focus { background: var(--tk-orange-dark); border-color: var(--tk-orange-dark); color: #fff; }
.btn-outline-green { border-color: var(--tk-green); color: var(--tk-green); }
.btn-outline-green:hover { background: var(--tk-green); color: #fff; }
/* Tombol persegi, bukan pil: menjauh dari tampilan template AI. */
.btn {
  border-radius: 2px; font-weight: 600; padding: .72rem 1.5rem;
  letter-spacing: .01em; transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn-lg { padding: .95rem 2.1rem; font-size: 1rem; }
.btn-sm { padding: .45rem 1.05rem; font-size: .85rem; }
/* Tautan teks dengan garis bawah tipis, gaya editorial. */
.tk-link {
  color: var(--tk-orange-dark); font-weight: 600;
  border-bottom: 1px solid currentColor; padding-bottom: 2px;
}
.tk-link:hover { color: var(--tk-green); }

.badge-soft-green { background: var(--tk-green-light); color: var(--tk-green-dark); }
.badge-soft-orange { background: var(--tk-orange-light); color: var(--tk-orange-dark); }
.badge {
  border-radius: 2px; font-weight: 600; padding: .42em .8em;
  letter-spacing: .05em; text-transform: uppercase; font-size: .68rem;
}

/* --- Navbar --------------------------------------------------------- */
.tk-topbar { background: var(--tk-green-dark); color: #D8CFC0; font-size: .82rem; letter-spacing: .01em; }
.tk-topbar a { color: #D8CFC0; }
.tk-topbar a:hover { color: #fff; }

.navbar-tk {
  background: rgba(244, 240, 230, .97);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--tk-line);
  transition: padding .25s ease;
}
.navbar-tk .navbar-brand {
  font-family: var(--tk-font-display); font-weight: 600;
  font-size: 1.32rem; color: var(--tk-green-dark); letter-spacing: -.02em;
}
.navbar-tk .navbar-brand span { color: var(--tk-orange-dark); }
/* Nav memakai sans-serif, garis bawah tipis alih-alih pil berwarna. */
.navbar-tk .nav-link {
  font-weight: 500; font-size: .95rem; color: var(--tk-ink);
  padding: .5rem .2rem !important; margin: 0 .7rem;
  border-bottom: 1.5px solid transparent;
}
.navbar-tk .nav-link:hover { color: var(--tk-orange-dark); }
.navbar-tk .nav-link.active { color: var(--tk-green-dark); border-bottom-color: var(--tk-orange); }
.navbar-tk .dropdown-menu { border: 1px solid var(--tk-line); border-radius: var(--tk-radius); background: #fff; }
.navbar-tk .dropdown-item { font-size: .93rem; padding: .55rem 1.1rem; }
.navbar-tk .dropdown-item:hover { background: var(--tk-cream); color: var(--tk-orange-dark); }
.lang-switch a { font-weight: 600; font-size: .78rem; color: var(--tk-muted); padding: .2rem .45rem; border-radius: 2px; }
.lang-switch a.active { background: var(--tk-orange); color: #fff; }

/* --- Hero ----------------------------------------------------------- */
/* Catatan: .tk-hero TIDAK boleh display:flex. Carousel akan menjadi flex item
   tanpa lebar eksplisit, lalu menyusut mengikuti lebar .container di dalamnya
   sehingga gambar hanya menutupi sebagian layar. Biarkan block agar carousel
   otomatis selebar 100%. */
.tk-hero { position: relative; overflow: hidden; }

.tk-hero .carousel,
.tk-hero .carousel-inner { width: 100%; }

/* min-height, bukan height: bila teks judul panjang di layar sempit,
   hero ikut memanjang alih-alih memotong isinya. */
.tk-hero .carousel-item {
  width: 100%;
  min-height: var(--tk-hero-height);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
/* Hero tanpa slider: dipakai bila belum ada slider yang aktif. */
.tk-hero-static {
  position: relative; width: 100%;
  min-height: var(--tk-hero-height);
  background-size: cover; background-position: center center; background-repeat: no-repeat;
}
/* Scrim gelap netral. Tanpa rona warna supaya foto tetap jujur dan
   teks di atasnya lolos kontras. */
.tk-hero-static::after,
.tk-hero .carousel-item::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(to top, rgba(29, 20, 16, .82) 0%, rgba(29, 20, 16, .34) 48%, rgba(29, 20, 16, .18) 100%);
}

/* Isi hero ditengahkan vertikal tanpa mengubah display carousel-item,
   supaya mekanisme show/hide bawaan Bootstrap tetap utuh. */
.tk-hero-body {
  position: relative; z-index: 3; color: #fff;
  min-height: var(--tk-hero-height);
  display: flex; flex-direction: column; justify-content: center;
  /* Padding kiri/kanan memakai gutter Bootstrap. Nilai 0 yang dipakai
     sebelumnya membuat judul hero menempel ke tepi layar di ponsel. */
  padding: 2.5rem calc(var(--bs-gutter-x, 1.5rem) * .5);
}
/* Hero berlabuh di bawah, bukan di tengah: lebih editorial, dan teks
   duduk di bagian tergelap dari scrim. */
.tk-hero-body { justify-content: flex-end; padding-bottom: 3.5rem; }
.tk-hero-body h1 {
  font-size: clamp(2.4rem, 5.6vw, 4.4rem); line-height: 1.04;
  font-weight: 600; letter-spacing: -.03em;
  text-shadow: 0 2px 30px rgba(0, 0, 0, .35);
}
.tk-hero-body p.lead {
  font-family: var(--bs-body-font-family);
  font-size: clamp(1rem, 1.7vw, 1.18rem); line-height: 1.6;
  max-width: 640px; color: #EFE9DC;
  text-shadow: 0 1px 16px rgba(0, 0, 0, .35);
}
/* Eyebrow tanpa kapsul: garis tipis + huruf kapital berspasi. */
.tk-eyebrow {
  display: inline-flex; align-items: center; gap: .55rem;
  color: #fff; padding: 0 0 .5rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .45);
  font-size: .76rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
}
.tk-hero .carousel-control-prev, .tk-hero .carousel-control-next { width: 8%; opacity: .55; }
.tk-hero .carousel-control-prev:hover, .tk-hero .carousel-control-next:hover { opacity: 1; }

/* --- Kartu ---------------------------------------------------------- */
/* Kartu rata, tanpa bayangan mengambang. Foto yang bekerja, bukan kotaknya. */
.tk-card {
  border: 1px solid var(--tk-line); border-radius: var(--tk-radius);
  background: #fff; overflow: hidden; height: 100%;
  transition: border-color .25s ease, box-shadow .25s ease;
}
.tk-card:hover { box-shadow: var(--tk-shadow); border-color: var(--tk-orange); }
.tk-card .tk-thumb { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--tk-green-light); }
.tk-card .tk-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.tk-card:hover .tk-thumb img { transform: scale(1.05); }
.tk-thumb-badge { position: absolute; top: .8rem; left: .8rem; z-index: 2; }
.tk-card-title {
  font-family: var(--tk-font-display);
  font-size: 1.16rem; font-weight: 600; line-height: 1.3;
  letter-spacing: -.015em; color: var(--tk-ink);
}
.tk-card a.stretched-link:hover .tk-card-title { color: var(--tk-orange-dark); }

.tk-meta { font-size: .85rem; color: var(--tk-muted); }
.tk-meta i { color: var(--tk-olive-dark); }

/* --- Kartu destinasi (overlay) -------------------------------------- */
.tk-dest {
  position: relative; border-radius: var(--tk-radius); overflow: hidden;
  aspect-ratio: 3 / 4; display: block;
}
.tk-dest img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.tk-dest:hover img { transform: scale(1.09); }
.tk-dest::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(29, 20, 16, .88) 6%, rgba(29, 20, 16, .06) 62%);
}
.tk-dest-body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 1.3rem; color: #fff; }
.tk-dest-body h5 {
  margin: 0; font-family: var(--tk-font-display);
  font-size: 1.22rem; font-weight: 600; letter-spacing: -.015em;
}
.tk-dest-body small { color: #D8CFC0; font-size: .8rem; letter-spacing: .05em; text-transform: uppercase; }

/* --- Bagian & judul ------------------------------------------------- */
/* Ruang napas lebih lega — whitespace adalah bagian dari brief. */
.tk-section { padding: 6rem 0; }
.tk-section-sm { padding: 4rem 0; }
.tk-section-title {
  font-size: clamp(1.9rem, 3.6vw, 2.9rem); font-weight: 600;
  line-height: 1.12; letter-spacing: -.025em;
}
/* Garis rambut, bukan pil tebal berwarna. */
.tk-title-line { width: 48px; height: 1.5px; border-radius: 0; background: var(--tk-orange); }

/* Bagian gelap untuk storytelling. Dipakai sebagai selingan, bukan di
   setiap section — brief meminta warna yang tertahan. */
.tk-dark { background: var(--tk-green-dark); color: #E6DED1; }
.tk-dark h1, .tk-dark h2, .tk-dark h3, .tk-dark h4, .tk-dark h5 { color: #fff; }
.tk-dark .text-muted-2 { color: #BCB1A2 !important; }
.tk-dark .tk-title-line { background: #C9A18C; }

/* Susunan editorial: foto besar berdampingan dengan blok teks. */
.tk-split-media { aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--tk-radius); background: var(--tk-green-light); }
.tk-split-media img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 767.98px) { .tk-split-media { aspect-ratio: 4 / 3; } }

/* --- Halaman header ------------------------------------------------- */
.tk-pagehead { position: relative; padding: 5.5rem 0 4rem; background: var(--tk-green-dark); color: #fff; overflow: hidden; }
.tk-pagehead::before {
  content: ''; position: absolute; inset: 0; opacity: .34;
  background-size: cover; background-position: center; background-image: var(--tk-head-img, none);
}
/* Lingkaran dekoratif dihapus; diganti garis rambut yang tenang. */
.tk-pagehead::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0;
  height: 1px; background: rgba(255, 255, 255, .16);
}
.tk-pagehead > .container { position: relative; z-index: 2; }
.tk-pagehead h1 { font-size: clamp(2.1rem, 4.2vw, 3.2rem); letter-spacing: -.03em; }
.tk-pagehead .breadcrumb-item, .tk-pagehead .breadcrumb-item a { color: #D8CFC0; font-size: .87rem; }
.tk-pagehead .breadcrumb-item.active { color: #fff; }

/* --- Statistik ------------------------------------------------------ */
.tk-stat { text-align: center; }
.tk-stat .n {
  font-family: var(--tk-font-display);
  font-size: 2.6rem; font-weight: 600; color: var(--tk-green); line-height: 1; letter-spacing: -.03em;
}
.tk-stat .l {
  font-size: .78rem; color: var(--tk-muted);
  letter-spacing: .12em; text-transform: uppercase; margin-top: .4rem;
}

/* --- Fitur / kenapa kami -------------------------------------------- */
/* Ikon tanpa kotak berwarna: garis atas tipis, ikon telanjang. */
.tk-feature { border-top: 1px solid var(--tk-line); padding-top: 1.5rem; }
.tk-dark .tk-feature { border-top-color: rgba(255, 255, 255, .18); }
.tk-feature-icon {
  width: auto; height: auto; border-radius: 0; display: block;
  font-size: 1.7rem; background: none; color: var(--tk-orange);
}
.tk-feature:nth-child(even) .tk-feature-icon { background: none; color: var(--tk-olive-dark); }

/* --- Detail paket --------------------------------------------------- */
.tk-gallery-main { border-radius: var(--tk-radius); overflow: hidden; aspect-ratio: 16 / 9; background: var(--tk-green-light); }
.tk-gallery-main img { width: 100%; height: 100%; object-fit: cover; }
.tk-gallery-thumbs img {
  width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--tk-radius-sm);
  cursor: pointer; border: 3px solid transparent; transition: border-color .2s;
}
.tk-gallery-thumbs img:hover, .tk-gallery-thumbs img.active { border-color: var(--tk-orange); }

.tk-day { position: relative; padding-left: 3.4rem; padding-bottom: 1.8rem; }
.tk-day:last-child { padding-bottom: 0; }
.tk-day::before {
  content: attr(data-day); position: absolute; left: 0; top: 0;
  width: 2.4rem; height: 2.4rem; border-radius: 50%;
  background: var(--tk-green); color: #fff; display: grid; place-items: center;
  font-weight: 800; font-size: .85rem;
}
.tk-day::after {
  content: ''; position: absolute; left: 1.18rem; top: 2.6rem; bottom: 0;
  width: 2px; background: var(--tk-line);
}
.tk-day:last-child::after { display: none; }

.tk-fac { list-style: none; padding: 0; margin: 0; }
.tk-fac li { padding: .45rem 0 .45rem 1.9rem; position: relative; border-bottom: 1px dashed var(--tk-line); }
.tk-fac li:last-child { border-bottom: 0; }
.tk-fac.inc li::before { content: '\f26e'; font-family: 'bootstrap-icons'; position: absolute; left: 0; color: var(--tk-green); }
.tk-fac.exc li::before { content: '\f62a'; font-family: 'bootstrap-icons'; position: absolute; left: 0; color: #c94b3f; }

.tk-sticky { position: sticky; top: 100px; }
.tk-price-note {
  border-radius: var(--tk-radius); border: 1px solid var(--tk-line);
  border-left: 3px solid var(--tk-orange);
  background: var(--tk-orange-light); padding: 1.4rem;
}

/* --- Rating --------------------------------------------------------- */
.tk-stars { color: #f6a723; letter-spacing: 1px; }
.tk-rate-input { display: inline-flex; flex-direction: row-reverse; gap: .25rem; }
.tk-rate-input input { position: absolute; opacity: 0; width: 0; height: 0; }
.tk-rate-input label { font-size: 1.7rem; color: #DDD3C4; cursor: pointer; line-height: 1; }
.tk-rate-input input:checked ~ label,
.tk-rate-input label:hover, .tk-rate-input label:hover ~ label { color: #f6a723; }
.tk-rate-input input:focus-visible + label { outline: 2px solid var(--tk-green); border-radius: 4px; }

/* --- Testimoni ------------------------------------------------------ */
.tk-quote {
  background: #fff; border: 1px solid var(--tk-line); border-radius: var(--tk-radius);
  padding: 1.9rem; height: 100%; position: relative;
}
.tk-quote::before {
  content: '\201C'; position: absolute; top: .4rem; right: 1.3rem;
  font-size: 4.5rem; color: var(--tk-cream); font-family: var(--tk-font-display); line-height: 1;
}
/* Kutipan dibaca sebagai suara orang, jadi diset serif. */
.tk-quote p {
  font-family: var(--tk-font-display); font-weight: 400;
  font-size: 1.02rem !important; line-height: 1.65 !important; color: var(--tk-ink);
}
.tk-avatar {
  width: 46px; height: 46px; border-radius: 50%; object-fit: cover;
  background: var(--tk-olive); color: #fff; display: grid; place-items: center; font-weight: 700;
  flex: 0 0 46px;
}
/* Sumber ulasan (Google, Tripadvisor, GetYourGuide). */
.tk-review-src {
  font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--tk-muted); border: 1px solid var(--tk-line);
  padding: .18rem .5rem; border-radius: 2px; display: inline-block;
}

/* --- Formulir ------------------------------------------------------- */
.form-control, .form-select {
  border-radius: var(--tk-radius-sm); border-color: var(--tk-line);
  padding: .7rem .95rem; font-size: .95rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--tk-orange); box-shadow: 0 0 0 .2rem rgba(166, 93, 67, .16);
}
.form-label { font-weight: 600; font-size: .9rem; margin-bottom: .35rem; }
.tk-captcha-img { border-radius: var(--tk-radius-sm); border: 1px solid var(--tk-line); height: 52px; }
.tk-honey { position: absolute !important; left: -9999px !important; opacity: 0 !important; height: 0 !important; }

.tk-form-card {
  background: #fff; border-radius: var(--tk-radius);
  box-shadow: var(--tk-shadow); padding: 1.8rem; border: 1px solid var(--tk-line);
}

/* --- Pita CTA ------------------------------------------------------- */
/* Bidang cokelat pekat, tanpa gradien dan tanpa lingkaran dekoratif. */
.tk-cta-band {
  background: var(--tk-green-dark);
  color: #fff; border-radius: var(--tk-radius); padding: 4rem 2.5rem;
  position: relative; overflow: hidden;
}
.tk-cta-band h2 { font-size: clamp(1.8rem, 3.2vw, 2.5rem); letter-spacing: -.025em; }
.tk-cta-band::after {
  content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 2px;
  background: var(--tk-orange);
}

/* --- Footer --------------------------------------------------------- */
.tk-footer { background: var(--tk-green-dark); color: #C6BBAB; padding-top: 5rem; }
.tk-footer h6 {
  color: #fff; font-family: var(--bs-body-font-family); font-weight: 600;
  font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 1.2rem;
}
.tk-footer a { color: #C6BBAB; }
.tk-footer a:hover { color: #E8A78E; }
.tk-footer .tk-social a {
  width: 40px; height: 40px; border-radius: 2px; display: grid; place-items: center;
  background: rgba(255, 255, 255, .07); color: #fff;
}
.tk-footer .tk-social a:hover { background: var(--tk-orange); color: #fff; }
.tk-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 3rem; padding: 1.2rem 0; font-size: .87rem; }

/* --- Tombol WhatsApp mengambang ------------------------------------- */
/* "Chat with a Local" — tombol berlabel, bukan stiker hijau. Warnanya ikut
   palet supaya tidak bertabrakan dengan nuansa bumi. */
.tk-wa {
  position: fixed; right: 20px; bottom: 20px; z-index: 1040;
  min-height: 52px; border-radius: 2px;
  background: var(--tk-green-dark); color: #fff;
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .85rem 1.25rem; font-size: .92rem; font-weight: 600;
  box-shadow: 0 10px 28px rgba(41, 38, 36, .28);
  transition: background-color .2s ease;
}
.tk-wa i { font-size: 1.25rem; color: #6ee79b; }
.tk-wa:hover { background: var(--tk-orange); color: #fff; }
.tk-wa:hover i { color: #fff; }

@media (max-width: 575.98px) {
  /* Di ponsel ruang terbatas: sisakan ikon saja, tetap 52px agar mudah disentuh. */
  .tk-wa { padding: 0; width: 52px; height: 52px; justify-content: center; gap: 0; }
  .tk-wa-label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .tk-card, .tk-card .tk-thumb img, .tk-dest img { transition: none; }
}

/* --- Isi artikel ---------------------------------------------------- */
/* Kolom artikel dibuat nyaman dibaca: ukuran naik, panjang baris ditahan. */
.tk-prose { font-size: 1.09rem; line-height: 1.8; color: var(--tk-ink); max-width: 68ch; }
.tk-prose h2, .tk-prose h3 { margin-top: 2.4rem; margin-bottom: .9rem; }
.tk-prose h2 { font-size: 1.75rem; }
.tk-prose h3 { font-size: 1.32rem; }
.tk-prose > p:first-of-type { font-size: 1.22rem; line-height: 1.66; color: #43403C; }
.tk-prose img { max-width: 100%; height: auto; border-radius: var(--tk-radius-sm); margin: 1.2rem 0; }
.tk-prose blockquote {
  border-left: 4px solid var(--tk-orange); background: var(--tk-orange-light);
  padding: 1rem 1.2rem; border-radius: 0 var(--tk-radius-sm) var(--tk-radius-sm) 0; margin: 1.4rem 0;
}
.tk-prose ul, .tk-prose ol { padding-left: 1.3rem; }
.tk-prose li { margin-bottom: .45rem; }
.tk-prose table { width: 100%; border-collapse: collapse; margin: 1.2rem 0; }
.tk-prose th, .tk-prose td { border: 1px solid var(--tk-line); padding: .6rem .8rem; }

/* --- Accordion ------------------------------------------------------ */
/* Akordeon sebagai daftar bergaris, bukan tumpukan kartu. */
.accordion-item { border: 0; border-bottom: 1px solid var(--tk-line); border-radius: 0 !important; margin-bottom: 0; background: transparent; }
.accordion-button {
  font-family: var(--tk-font-display); font-weight: 600; font-size: 1.08rem;
  background: transparent; padding: 1.25rem .25rem;
}
.accordion-button:not(.collapsed) { background: transparent; color: var(--tk-orange-dark); box-shadow: none; }
.accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(166, 93, 67, .16); }
.accordion-body { padding: 0 .25rem 1.4rem; color: #43403C; }

/* --- Paginasi ------------------------------------------------------- */
.pagination .page-link { border: 1px solid var(--tk-line); color: var(--tk-ink); border-radius: 2px; margin: 0 3px; font-weight: 600; background: transparent; }
.pagination .page-item.active .page-link { background: var(--tk-green); color: #fff; border-color: var(--tk-green); }
.pagination .page-link:hover { background: var(--tk-green-light); color: var(--tk-green-dark); }

/* --- Rasio peta ----------------------------------------------------- */
.tk-map { border-radius: var(--tk-radius); overflow: hidden; }
.tk-map iframe { width: 100%; height: 360px; border: 0; display: block; }
.tk-video { border-radius: var(--tk-radius); overflow: hidden; aspect-ratio: 16 / 9; }
.tk-video iframe { width: 100%; height: 100%; border: 0; }

/* --- Aksesibilitas -------------------------------------------------- */
.skip-link {
  position: absolute; left: -999px; top: 0; z-index: 2000;
  background: var(--tk-green); color: #fff; padding: .7rem 1.2rem; border-radius: 0 0 3px 0;
}
.skip-link:focus { left: 0; color: #fff; }
:focus-visible { outline: 3px solid rgba(166, 93, 67, .6); outline-offset: 2px; }

@media (max-width: 991.98px) {
  .tk-section { padding: 3.6rem 0; }
  .tk-section-sm { padding: 2.6rem 0; }
  .tk-hero { --tk-hero-height: clamp(420px, 66vh, 580px); }
  .tk-hero-body { padding-bottom: 2.5rem; }
  .tk-sticky { position: static; }
  .navbar-tk .nav-link { margin: 0; padding: .6rem 0 !important; border-bottom: 0; }
  .navbar-tk .nav-link.active { background: transparent; color: var(--tk-orange-dark); }
  .tk-cta-band { padding: 2.5rem 1.5rem; }
}

/* Target sentuh minimal 44px di layar kecil — booking flow dipakai di ponsel. */
.navbar-tk .navbar-toggler {
  min-width: 44px; min-height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
}
@media (max-width: 575.98px) {
  .btn { padding: .8rem 1.4rem; }
  .btn-lg { padding: .95rem 1.6rem; width: 100%; }
  .tk-hero-body .d-flex.flex-wrap.gap-2 { flex-direction: column; align-items: stretch; }
}


/* --- Aksen olive green ---------------------------------------------- */
.text-olive { color: var(--tk-olive-dark) !important; }
.bg-olive { background: var(--tk-olive) !important; }
.bg-olive-soft { background: var(--tk-olive-light) !important; }
.badge-soft-olive { background: var(--tk-olive-light); color: var(--tk-olive-dark); }
.btn-olive { background: var(--tk-olive); border-color: var(--tk-olive); color: #fff; }
.btn-olive:hover, .btn-olive:focus { background: var(--tk-olive-dark); border-color: var(--tk-olive-dark); color: #fff; }
.tk-feature:nth-child(3n) .tk-feature-icon { background: none; color: var(--tk-olive-dark); }

/* --- Harga ----------------------------------------------------------- */
.tk-price-tag { display: flex; align-items: baseline; gap: .35rem; flex-wrap: wrap; }
.tk-price-tag .from { font-size: .72rem; color: var(--tk-muted); letter-spacing: .08em; text-transform: uppercase; }
.tk-price-tag .amount {
  font-family: var(--tk-font-display);
  font-size: 1.45rem; font-weight: 600; color: var(--tk-orange-dark); line-height: 1; letter-spacing: -.02em;
}
.tk-price-tag .unit { font-size: .8rem; color: var(--tk-muted); }

.tk-calc {
  border-radius: var(--tk-radius); border: 1px solid var(--tk-line);
  background: #fff; padding: 1.5rem;
}
.tk-calc-total {
  background: #fff; border-radius: var(--tk-radius-sm);
  padding: 1rem; margin-top: 1rem; border: 1px solid var(--tk-line);
  border-top: 2px solid var(--tk-orange);
}
.tk-calc-total .big {
  font-family: var(--tk-font-display);
  font-size: 2.1rem; font-weight: 600; color: var(--tk-orange-dark); line-height: 1.1; letter-spacing: -.025em;
}
.tk-pax-control { display: flex; align-items: center; gap: .5rem; }
.tk-pax-control button {
  width: 46px; height: 46px; border-radius: 2px; border: 1px solid var(--tk-line);
  background: #fff; font-size: 1.15rem; font-weight: 700; color: var(--tk-green-dark);
  display: grid; place-items: center; flex: 0 0 46px;
}
.tk-pax-control button:hover:not(:disabled) { background: var(--tk-green); color: #fff; border-color: var(--tk-green); }
.tk-pax-control button:disabled { opacity: .4; cursor: not-allowed; }
.tk-pax-control input {
  text-align: center; font-weight: 700; font-size: 1.05rem;
  border-radius: 2px; border: 1px solid var(--tk-line); height: 46px; width: 100%;
}

.tk-tier { width: 100%; border-collapse: collapse; font-size: .9rem; }
.tk-tier th, .tk-tier td { padding: .6rem .5rem; border-bottom: 1px solid var(--tk-line); }
.tk-tier th { text-align: left; font-weight: 600; color: var(--tk-muted); font-size: .82rem; }
.tk-tier td:last-child { text-align: right; font-weight: 700; color: var(--tk-green-dark); }
.tk-tier tr.active td { background: var(--tk-orange-light); }
.tk-tier tr:last-child th, .tk-tier tr:last-child td { border-bottom: 0; }

/* --- Alur pemesanan --------------------------------------------------- */
.tk-flow { counter-reset: step; }
.tk-flow .s { position: relative; padding-left: 3.2rem; padding-bottom: 1.6rem; }
.tk-flow .s:last-child { padding-bottom: 0; }
.tk-flow .s::before {
  counter-increment: step; content: counter(step);
  position: absolute; left: 0; top: 0; width: 2.2rem; height: 2.2rem; border-radius: 50%;
  background: var(--tk-olive); color: #fff; display: grid; place-items: center; font-weight: 800; font-size: .85rem;
}
.tk-flow .s::after {
  content: ''; position: absolute; left: 1.07rem; top: 2.4rem; bottom: 0; width: 2px; background: var(--tk-line);
}
.tk-flow .s:last-child::after { display: none; }