/**
 * ==============================================================================
 * STYLESHEET KHUSUS - JAGUNG PULUT GORENG
 * Konsep: Modern Traditional Premium
 * ==============================================================================
 */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&family=Playfair+Display:ital,wght@0,600;0,700;0,800;0,900;1,600&display=swap');

:root {
  --color-corn-gold: #F59E0B;
  --color-corn-light: #FCD34D;
  --color-brown-deep: #381504;
  --color-brown-rich: #451A03;
  --color-cream-bg: #FAF5EB;
  --color-cream-card: #FFFDF8;
}

html {
  scroll-behavior: smooth;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: #FAF5EB;
  color: #291507;
}

/* Serif Accent for Titles with Traditional Luxury Feel */
.font-serif-title {
  font-family: 'Playfair Display', Georgia, Cambria, 'Times New Roman', serif;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #270F03;
}

::-webkit-scrollbar-thumb {
  background: #B45309;
  border-radius: 5px;
  border: 2px solid #270F03;
}

::-webkit-scrollbar-thumb:hover {
  background: #F59E0B;
}

/* Subtle Traditional Grain / Batik Dots Pattern */
.bg-traditional-pattern {
  background-color: #FAF5EB;
  background-image: radial-gradient(#D97706 0.75px, transparent 0.75px), radial-gradient(#78350F 0.75px, #FAF5EB 0.75px);
  background-size: 30px 30px;
  background-position: 0 0, 15px 15px;
  background-opacity: 0.04;
}

.bg-dark-traditional {
  background-color: #240C02;
  background-image: radial-gradient(#F59E0B 0.6px, transparent 0.6px), radial-gradient(#D97706 0.6px, #240C02 0.6px);
  background-size: 28px 28px;
  background-position: 0 0, 14px 14px;
}

/* Gold Gradient Shimmer Text */
.text-gold-gradient {
  background: linear-gradient(135deg, #FDE68A 0%, #F59E0B 50%, #D97706 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Floating WhatsApp Pulse Animation */
@keyframes wa-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(34, 197, 94, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
  }
}

.animate-wa-pulse {
  animation: wa-pulse 2s infinite;
}

/* Subtle Floating Bob Animation for Hero Product */
@keyframes hero-float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}

.animate-hero-float {
  animation: hero-float 6s ease-in-out infinite;
}

/* Lightbox Modal Fade Animation */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.lightbox-animate-fade {
  animation: fadeIn 0.25s ease-out forwards;
}

/* Gold Ornamental Border Divider */
.ornament-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 12px 0;
}

.ornament-divider::before,
.ornament-divider::after {
  content: "";
  height: 1px;
  background: linear-gradient(90deg, transparent, #D97706, transparent);
  flex: 1;
  max-width: 120px;
}