/* ============================================================
   POLISH.CSS — Sentuhan mikro seluruh situs (Juli 2026)
   Ditautkan terakhir setelah css lain di setiap halaman.
   Semua gerakan dimatikan bila pengguna memilih reduced motion.
   ============================================================ */

/* ===== 1. Identitas kecil: seleksi teks & scrollbar ===== */
::selection { background:rgba(0,166,156,.28); }
html { scrollbar-width:thin; scrollbar-color:var(--tosca) transparent; }
::-webkit-scrollbar { width:9px; height:9px; }
::-webkit-scrollbar-thumb { background:var(--tosca); border-radius:99px; }
::-webkit-scrollbar-thumb:hover { background:var(--tosca-dk); }
::-webkit-scrollbar-track { background:transparent; }

/* ===== 2. Micro-feedback tombol ===== */
button, .btn, .btn-hero-orange, .btn-hero-outline, .btn-tosca-solid,
.btn-orange-solid, .btn-tosca-pill {
  transition:background-color .15s ease, color .15s ease,
             border-color .15s ease, box-shadow .15s ease,
             transform .12s ease, opacity .15s ease;
}
button:active, .btn:active { transform:translateY(1px); }
.btn-hero-orange:hover, .btn-orange-solid:hover, .dn2-patron-btn:hover { filter:brightness(1.06); }
.btn-hero-orange:active, .btn-orange-solid:active { filter:brightness(.97); }

/* ===== 3. Underline animasi menu navbar (desktop) ===== */
@media (min-width:1024px) {
  .nav-menu a { position:relative; padding-bottom:4px; }
  .nav-menu a::after {
    content:''; position:absolute; left:0; right:0; bottom:0;
    height:2px; background:var(--orange);
    transform:scaleX(0); transform-origin:left;
    transition:transform .22s ease;
  }
  .nav-menu a:hover::after, .nav-menu a.active::after { transform:scaleX(1); }
}

/* ===== 4. Zoom lembut thumbnail di dalam kartu ===== */
.kl-card-cover, .ko-item-thumb, .art-feat-cover, .art-row-cover,
.dn2-bts-img, .dn2-story-img, .vol-cover { overflow:hidden; }
.kl-card-cover img, .ko-item-thumb img, .art-feat-cover img,
.art-row-cover img, .dn2-bts-img img, .dn2-story-img img, .vol-cover img {
  transition:transform .45s ease;
}
.kl-card:hover .kl-card-cover img,
.ko-item:hover .ko-item-thumb img,
.art-feat:hover .art-feat-cover img,
.art-row:hover .art-row-cover img,
.dn2-bts-row:hover .dn2-bts-img img,
.vol-card:hover .vol-cover img { transform:scale(1.045); }

/* ===== 5. Hover baris tabel transparansi dana ===== */
.dn2-table tbody tr:not(.dn2-total) td { transition:background-color .15s ease; }
.dn2-table tbody tr:not(.dn2-total):hover td { background:#e6f6f4 !important; }

/* ===== 6. Animasi buka jawaban FAQ ===== */
@keyframes prFaqIn {
  from { opacity:0; transform:translateY(-6px); }
  to   { opacity:1; transform:none; }
}
.kl-faq details[open] .kl-faq-a { animation:prFaqIn .32s ease both; }

/* ===== 7. Scroll-reveal (kelas diberikan oleh polish.js) ===== */
.pr-reveal { opacity:0; transform:translateY(18px); }
.pr-in {
  opacity:1; transform:none;
  transition:opacity .6s ease, transform .6s ease;
}

/* ===== 8. Toast kecil ===== */
.pr-toast {
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(12px);
  background:var(--tosca-dk); color:var(--white);
  font-size:.85rem; font-weight:700; font-family:Arial,sans-serif;
  padding:.65rem 1.4rem; border-radius:999px;
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  opacity:0; pointer-events:none; z-index:999;
  transition:opacity .25s ease, transform .25s ease;
}
.pr-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ===== 9. Hormati preferensi reduced motion ===== */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .pr-reveal { opacity:1; transform:none; }
}