@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap");

:root {
  --primary-green: #10b981;
  --secondary-green: #059669;
  --text-dark: #1f2937;
}
body {
  font-family: "Poppins", sans-serif;
  scroll-behavior: smooth;
}

.bg-pattern {
  background-image: linear-gradient(
      rgba(255, 255, 255, 0.8),
      rgba(255, 255, 255, 0.8)
    ),
    url('data:image/svg+xml,%3Csvg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M11 18C7.68629 18 5 20.6863 5 24V76C5 79.3137 7.68629 82 11 82H89C92.3137 82 95 79.3137 95 76V24C95 20.6863 92.3137 18 89 18H11Z" fill="%2310B981" fill-opacity="0.05"/%3E%3C/svg%3E');
}
.hero-gradient {
  background: linear-gradient(135deg, var(--primary-green), #6ee7b7);
}

.carousel-slide {
  transition: opacity 0.7s ease-in-out;
}

.text-shadow-lg {
  text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
}

.nav-button {
  transition: all 0.3s ease;
}

.nav-button:hover {
  background-color: rgba(0, 0, 0, 0.7);
  transform: scale(1.1);
}

.indicator {
  transition: all 0.3s ease;
}

/* Animation for buttons */
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}

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