:root {
    --primary-color: #2D5A4C;
}
body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    background-color: theme('colors.soft-bg');
    color: theme('colors.text-main');
}
.gradient-mesh {
    background-image:
        radial-gradient(at 0% 0%, rgba(139, 168, 142, 0.08) 0px, transparent 50%),
        radial-gradient(at 100% 0%, rgba(212, 163, 115, 0.05) 0px, transparent 50%);
}
.fade-in {
    animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}
.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #E5EBE5;
    border-radius: 10px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #8BA88E;
}
.option-card:hover {
    transform: translateY(-2px);
    transition: all 0.3s ease;
}
@keyframes bounceSlow {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}
.animate-bounce-slow {
    animation: bounceSlow 3s ease-in-out infinite;
}
/* Staggered fade-in for grid children */
.fade-in > section {
    animation: fadeIn 0.6s ease-out both;
}
.fade-in > section:nth-child(2) { animation-delay: 0.1s; }
.fade-in > section:nth-child(3) { animation-delay: 0.15s; }
.fade-in > section:nth-child(4) { animation-delay: 0.2s; }
