/* ---------- layar kecil ---------- */
.wa-short{display:none}

/* Target sentuh: tautan footer landing tadinya cuma 15px tinggi (WCAG 2.2 minta 24px).
   Diberlakukan di semua lebar — di desktop pun tidak merugikan. */
.kch-footer a{display:inline-flex;align-items:center;min-height:26px}
.kch-footer [style*="gap:11px"],.kch-footer [style*="gap: 11px"]{gap:4px !important}
footer a,.crumb a{display:inline-block;padding:5px 0;min-height:24px}

/* Tautan nav dibungkus <span class="nv-links"> supaya bisa digeser di layar kecil.
   Bungkusnya HARUS flex+gap di semua lebar — kalau tidak, di desktop ia jadi
   display:block dan tautannya menempel: "LiterasiDemo langsungHarga". */
.nv-links{display:flex;align-items:center;gap:18px}

@media (max-width:760px){
  /* nav halaman artikel & hub: tautan jadi strip yang bisa digeser,
     logo dan tombol WhatsApp tetap di tempat */
  .nv{padding:8px 14px;gap:10px}
  .nv .sp{display:none}
  .nv-links{gap:16px;flex:1 1 auto;min-width:0;
            overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nv-links::-webkit-scrollbar{display:none}
  /* tepi kanan memudar: menandakan masih ada tautan kalau digeser,
     supaya potongan teks tidak terbaca sebagai layout rusak */
  .nv-links{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 22px),transparent);
            mask-image:linear-gradient(to right,#000 calc(100% - 22px),transparent)}
  .nv-links a{white-space:nowrap;padding:11px 0;display:inline-flex;align-items:center}
  .nv .logo{flex:0 0 auto}
  .wa{flex:0 0 auto;padding:10px 14px;font-size:13px}

  /* nav landing */
  .kch-navlinks{flex:1 1 auto !important;min-width:0 !important;
                overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .kch-navlinks::-webkit-scrollbar{display:none}
  .kch-navlinks{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 22px),transparent);
                mask-image:linear-gradient(to right,#000 calc(100% - 22px),transparent)}
  .kch-navlinks a{padding:11px 0;display:inline-flex;align-items:center}

  /* Label WhatsApp dipendekkan HANYA di dalam nav, supaya bar-nya muat.
     Tombol CTA di hero/harga/penutup tetap "Konsultasi via WhatsApp" —
     ruangnya cukup dan itu copy konversi utama. */
  nav .wa-long{display:none}
  nav .wa-short{display:inline}

  /* teks jangan lebih kecil dari 12px */

  body{-webkit-text-size-adjust:100%}
}

/* tabel perbandingan: geser di dalam kotaknya sendiri, jangan menyeret halaman */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 20px}
.tbl-scroll>table{margin-bottom:0;min-width:min(560px,100%)}

@media (max-width:420px){
  .nv-links{gap:14px}
  .wa{padding:9px 12px;font-size:12.5px}
}
