/* ============================================================
   NABA Tours — Splash Screen
   Pasang: <link rel="stylesheet" href="assets/naba-splash/splash.css">
   Semua gerak murni CSS. JS hanya untuk "tampil sekali per sesi".
   ============================================================ */

.naba-splash {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 3vh, 40px);
  padding: 6vh 5vw;
  box-sizing: border-box;
  background: #f6f7f4;
  animation: naba-splash-keluar 0.6s ease 2.9s forwards;
}

/* Varian latar gelap: <div class="naba-splash naba-splash--gelap"> */
.naba-splash--gelap { background: #0b201a; }

.naba-splash__baris {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(12px, 2.4vw, 34px);
  flex-wrap: nowrap;
}

.naba-splash__ikon {
  width: clamp(92px, 13vw, 210px);
  height: auto;
  display: block;
  filter: drop-shadow(0 14px 26px rgba(15, 42, 34, 0.24));
  animation: naba-guling 1.1s cubic-bezier(0.22, 1, 0.36, 1) 1.15s both;
}
.naba-splash--gelap .naba-splash__ikon {
  filter: drop-shadow(0 14px 26px rgba(0, 0, 0, 0.5));
}

.naba-splash__teks {
  width: clamp(180px, 27vw, 430px);
  height: auto;
  display: block;
  animation: naba-masuk 1.1s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.naba-splash--gelap .naba-splash__teks { filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.45)); }

.naba-splash__tagline {
  width: clamp(150px, 22vw, 350px);
  height: auto;
  display: block;
  animation: naba-masuk 0.9s cubic-bezier(0.22, 1, 0.36, 1) 2.15s both;
}
.naba-splash--gelap .naba-splash__tagline { filter: brightness(0) invert(1) opacity(0.85); }

/* --- keyframes --- */
@keyframes naba-masuk {
  0%   { opacity: 0; transform: translateX(-9vw); }
  100% { opacity: 1; transform: translateX(0); }
}
@keyframes naba-guling {
  0%   { opacity: 0; transform: translateX(-38vw) rotate(-540deg); }
  18%  { opacity: 1; }
  100% { opacity: 1; transform: translateX(0) rotate(0deg); }
}
@keyframes naba-splash-keluar {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}

/* Hormati preferensi pengguna yang mematikan animasi */
@media (prefers-reduced-motion: reduce) {
  .naba-splash { animation: naba-splash-keluar 0.4s ease 1.2s forwards; }
  .naba-splash__ikon,
  .naba-splash__teks,
  .naba-splash__tagline { animation: none; }
}