/* Custom styles beyond Tailwind */

:root {
    --forest-50: #f2f7f2;
    --forest-100: #e3ecd3;
    --forest-200: #c5d9a8;
    --forest-300: #9bbf76;
    --forest-400: #74a04f;
    --forest-500: #527d37;
    --forest-600: #3d6029;
    --forest-700: #2f4a21;
    --forest-800: #263b1c;
    --forest-900: #1f3117;
    --forest-950: #0f1a0b;
}

/* Custom color tokens for Tailwind */
.bg-off-white { background-color: #faf9f6; }
.text-off-white { color: #faf9f6; }
.border-off-white { border-color: #faf9f6; }

/* Float animations */
@keyframes float {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-12px) rotate(1deg); }
}

@keyframes float-delayed {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-8px) rotate(-1deg); }
}

.animate-float {
    animation: float 4s ease-in-out infinite;
}

.animate-float-delayed {
    animation: float-delayed 5s ease-in-out infinite;
    animation-delay: 1s;
}

/* Smooth scroll offset for fixed nav */
section[id] {
    scroll-margin-top: 80px;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #faf9f6;
}
::-webkit-scrollbar-thumb {
    background: #c5d9a8;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #9bbf76;
}

/* Focus styles for accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid #74a04f;
    outline-offset: 2px;
    border-radius: 4px;
}

/* Selection color */
::selection {
    background-color: #c5d9a8;
    color: #1f3117;
}