@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,800&family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
  body {
    @apply bg-arang text-kapur font-teks antialiased;
    /* tekstur halus supaya latar gelap tak rata mati */
    background-image: radial-gradient(circle at 20% -10%, rgba(192,138,46,.10), transparent 55%);
  }
  h1, h2, h3 { @apply font-tajuk leading-[1.08] tracking-[-0.01em]; }
  :focus-visible { @apply outline-2 outline-offset-2 outline-kunyit; }
}

@layer components {
  .kandungan { @apply mx-auto w-full max-w-5xl px-5; }
  .butang-utama {
    @apply inline-flex items-center justify-center gap-2 rounded-full
           bg-bara px-7 py-4 text-base font-extrabold text-kapur
           shadow-[0_6px_0_#4A0F0A] transition-transform
           active:translate-y-[3px] active:shadow-[0_3px_0_#4A0F0A];
  }
  .kad { @apply rounded-2xl border border-emas/25 bg-arang2/80 p-6; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* scroll-snap untuk feed TikTok */
.feed-tiktok { scroll-snap-type: y mandatory; -webkit-overflow-scrolling: touch; }
.feed-tiktok > * { scroll-snap-align: start; scroll-snap-stop: always; }
.sembunyi-scroll::-webkit-scrollbar { display: none; }
.sembunyi-scroll { -ms-overflow-style: none; scrollbar-width: none; }