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

html { scroll-behavior: smooth; }

@layer utilities {
    .bg-agri-primary { background-color: #2D6A4F; } /* Deep Green */
    .bg-agri-secondary { background-color: #40916C; } /* Leaf Green */
    .bg-agri-accent { background-color: #D8F3DC; } /* Light Mint */
    .bg-agri-earth { background-color: #9C6644; } /* Soil/Earth */
    .bg-agri-light { background-color: #F8F9FA; }
    
    .text-agri-primary { color: #1B4332; }
    .text-agri-secondary { color: #2D6A4F; }
    .text-agri-earth { color: #7F4F24; }
    .text-agri-muted { color: #6C757D; }
    
    .font-playfair { font-family: 'Playfair Display', serif; }
    .font-inter { font-family: 'Inter', sans-serif; }
}

.leaf-pattern {
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M54.627 0l.83.83-29.41 29.41c-2.316 2.316-5.83 2.656-8.5.94L.497 14.13c1.717-2.67 2.057-6.184-.26-8.5L30.627 0h24zM29.585 30.415l-1.414 1.414L2.834 6.49l1.414-1.414 25.337 25.337zm10.829 10.83l-1.414 1.414-25.337-25.337 1.414-1.414 25.337 25.337zM46.828 47.657l-1.414 1.414L20.077 23.734l1.414-1.414 25.337 25.337z' fill='%232D6A4F' fill-opacity='0.03' fill-rule='evenodd'/%3E%3C/svg%3E");
}

.agri-btn {
    @apply inline-flex items-center justify-center px-8 py-3 bg-[#2D6A4F] text-white font-inter font-medium rounded-full shadow-lg shadow-[#2D6A4F]/30 hover:-translate-y-1 hover:shadow-xl hover:bg-[#1B4332] transition-all duration-300;
}

.agri-card {
    @apply bg-white p-8 rounded-[2rem] border border-[#D8F3DC] shadow-sm hover:shadow-xl hover:border-[#40916C] transition-all duration-300 group;
}

.agri-card-icon {
    @apply w-16 h-16 rounded-full bg-[#D8F3DC] text-[#2D6A4F] flex items-center justify-center text-2xl mb-6 group-hover:scale-110 group-hover:bg-[#2D6A4F] group-hover:text-white transition-all duration-500;
}

/* Organic curved blob for imagery */
.organic-blob {
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
    animation: morph 8s ease-in-out infinite;
}

@keyframes morph {
    0%, 100% { border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%; }
    34% { border-radius: 70% 30% 50% 50% / 30% 30% 70% 70%; }
    67% { border-radius: 100% 60% 60% 100% / 100% 100% 60% 60%; }
}