/* ============================================================
   custom.css — Lumbung AIPKI RevealJS
   Penyesuaian halus yang tidak praktis diatur lewat variabel SCSS:
   animasi fragment, kartu gambar, responsivitas kolom, dan
   aksen warna pada elemen background-color eksplisit.
   ============================================================ */

/* ---------- Animasi fragment yang lebih halus ---------- */
.reveal .fragment {
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.reveal .fragment.fade-up {
  transform: translateY(18px);
  opacity: 0;
}
.reveal .fragment.fade-up.visible {
  transform: translateY(0);
  opacity: 1;
}

/* ---------- Bingkai lembut untuk gambar ilustrasi ---------- */
.reveal section img {
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(43, 27, 61, 0.15);
}

/* ---------- Kartu untuk daftar incremental (opsional aksen kiri) ---------- */
.reveal .incremental li.current-fragment {
  color: #8e44ad;
  font-weight: 600;
}

/* ---------- Slide dengan background gelap (mis. slide klimaks) ---------- */
.reveal section[data-background-color="#2b1b3d"] blockquote,
.reveal section[data-background-color="#1a1a1a"] blockquote {
  background: rgba(255, 255, 255, 0.06);
  border-left-color: #f5c518;
  color: #f7f5fa;
  box-shadow: none;
}

.reveal section[data-background-color="#2b1b3d"] a,
.reveal section[data-background-color="#1a1a1a"] a {
  color: #f5c518;
}

/* ---------- .r-fit-text: pastikan tetap center & rapi di slide gelap ---------- */
.reveal .r-fit-text {
  display: block;
  width: 100%;
}

/* ---------- Responsivitas kolom pada layar sempit ---------- */
@media (max-width: 900px) {
  .reveal .columns {
    flex-direction: column;
    gap: 1em;
  }
}

/* ---------- Tombol / badge ajakan bertindak (slide penutup) ---------- */
.reveal section a[style*="color:#f5c518"] {
  display: inline-block;
  padding: 0.35em 0.9em;
  border: 2px solid #f5c518;
  border-radius: 999px;
  text-decoration: none;
  transition: background 0.3s ease, color 0.3s ease;
}
.reveal section a[style*="color:#f5c518"]:hover {
  background: #f5c518;
  color: #2b1b3d !important;
}

/* ---------- Progress bar aksen gold ---------- */
.reveal .progress span {
  background: #f5c518;
}

/* ---------- Kutipan besar bergaya "pull quote" pada slide judul/klimaks ---------- */
.reveal .r-fit-text + .fragment {
  font-weight: 700;
}