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

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Poppins', sans-serif;
}

.section-title {
    @apply text-3xl md:text-4xl font-bold text-brand-blue tracking-tight mb-4;
}

.section-subtitle {
    @apply text-lg text-brand-text-light max-w-3xl mx-auto;
}

.nav-link {
    @apply text-brand-text-light font-medium relative py-2 transition-colors duration-300 hover:text-brand-blue;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #10B981; /* brand-green */
    transition: width 0.3s ease-in-out;
}

.nav-link:hover::after {
    width: 100%;
}

.mobile-nav-link {
    @apply block px-4 py-2 rounded-md text-base font-medium text-brand-text-light hover:text-brand-blue hover:bg-brand-light transition-colors duration-200;
}

.btn {
    @apply inline-flex items-center justify-center px-5 py-3 border border-transparent font-semibold rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 transition-all duration-300;
}

.btn-primary {
    @apply bg-brand-green text-white hover:bg-brand-green-dark focus:ring-brand-green;
}

.btn-secondary {
    @apply bg-brand-blue text-white hover:bg-brand-blue-dark focus:ring-brand-blue;
}

.btn-lg {
    @apply px-8 py-4 text-lg;
}

.form-label {
    @apply block text-sm font-medium text-brand-text-light mb-1;
}

.form-input {
    @apply block w-full px-4 py-2 bg-brand-light border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-brand-blue focus:border-brand-blue sm:text-sm transition-shadow;
}


/* Animation */
.animated-section {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.animated-section.is-visible {
    opacity: 1;
    transform: translateY(0);
}