/* Custom Font Imports */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Oswald:wght@400;500;600;700&display=swap');

/* Tailwind Custom Theme Configuration */
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    body {
        font-family: 'Inter', sans-serif;
    }
    h1, h2, h3, h4, h5, h6, .font-oswald {
        font-family: 'Oswald', sans-serif;
    }
}

/* Custom Colors defined via Tailwind config in script tag would be better, 
   but adding specific overrides here for the Plum/Amber theme */

.plum-950 { background-color: #1a0d14; }
.plum-900 { background-color: #2d1221; }
.plum-800 { background-color: #441a31; }
.plum-700 { background-color: #5c2342; }
.plum-200 { background-color: #f3e5f5; }
.plum-100 { background-color: #fce4ec; }

.text-plum-900 { color: #2d1221; }
.text-plum-900 { color: #2d1221; }
.text-plum-700 { color: #5c2342; }
.text-plum-200 { color: #f3e5f5; }

/* Smooth Scrolling offset for fixed navbar */
html {
    scroll-padding-top: 80px;
}

/* Mobile Menu Transition */
#mobile-menu {
    animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Utility for text selection color */
::selection {
    background-color: #F59E0B; /* Amber-500 */
    color: #1e293b;
}