/* Eco Nusantara v6.0 Custom Styles */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400&display=swap');

:root {
  --color-primary: #166534; /* green-800 */
  --color-accent: #22c55e;  /* green-500 */
  --color-secondary: #854d0e; /* yellow-800 */
  --color-bg-light: #f3f4f6; /* gray-100 */
  --color-text-dark: #111827; /* gray-900 */
}

body {
  font-family: 'Inter', sans-serif;
  color: var(--color-text-dark);
  background-color: var(--color-bg-light);
  overflow-x: hidden;
  padding-top: 3rem;
}

h1, h2, h3, h4, h5, h6, .font-serif {
  font-family: 'Merriweather', serif;
}

/* Glassmorphism utility */
.glass {
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.5);
}

.glass-dark {
  background: rgba(17, 24, 39, 0.7);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Smooth transitions */
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}

.hover-scale:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
}

/* Base custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
::-webkit-scrollbar-thumb {
  background: #22c55e; 
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #166534; 
}


/* Specific map sizing */
#map {
  min-height: 500px;
  border-radius: 0.75rem;
  z-index: 10;
}

/* Floating AI Chatbot Placeholder */
#chatbot-widget {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 50;
}

/* Hero gradient */
.hero-gradient {
  background: linear-gradient(to right, rgba(22, 101, 52, 0.8), rgba(34, 197, 94, 0.4));
}

/* Hero Slider Styles */
.hero-slide {
    transition: opacity 1s ease-in-out;
}
.hero-slide.active {
    opacity: 1;
    z-index: 1;
}
.hero-slide:not(.active) {
    opacity: 0;
    z-index: 0;
}

/* Tombol navigasi slider */
.slider-btn {
    background: rgba(255,255,255,0.2);
    backdrop-filter: blur(4px);
    transition: all 0.2s ease;
}
.slider-btn:hover {
    background: rgba(255,255,255,0.4);
    transform: scale(1.05);
}

/* Memastikan konten hero di atas slider */
.hero-content {
    z-index: 20;
}

@media (max-width: 1024px) {
  html {
    font-size: 13px;
  }

  #map {
    min-height: 250px;
  }

  #chatbot-widget {
    transform: scale(0.8);
    bottom: 16px;
    right: 16px;
  }
}

@media (max-width: 768px) {
  body {
    padding-top: 4rem;        /* 64px - untuk navbar h-16 di mobile */
  }
}