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

:root {
    --color-dark: #0a0a0a;
    --color-dark-lighter: #141414;
    --color-neon-green: #39ff14;
    --color-white: #ffffff;
    --color-gray: #888888;
}

/* Custom Tailwind Config simulation */
.bg-dark { background-color: var(--color-dark); }
.bg-dark-lighter { background-color: var(--color-dark-lighter); }
.text-dark { color: var(--color-dark); }
.bg-neon-green { background-color: var(--color-neon-green); }
.text-neon-green { color: var(--color-neon-green); }
.border-neon-green { border-color: var(--color-neon-green); }

body {
    font-family: 'Montserrat', sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* Text Stroke Effect */
.text-stroke {
    -webkit-text-stroke: 2px var(--color-white);
    color: transparent;
}
.text-stroke-sm {
    -webkit-text-stroke: 1px var(--color-white);
    color: transparent;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--color-dark); 
}
::-webkit-scrollbar-thumb {
    background: #333; 
}
::-webkit-scrollbar-thumb:hover {
    background: var(--color-neon-green); 
}

/* Mobile Navigation Fix */
@media (max-width: 767px) {
    #navbar .container {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    #navbar img {
        height: 2.5rem !important;
    }
    #mobileMenuBtn {
        padding: 0.5rem;
        min-width: 2.5rem;
        min-height: 2.5rem;
        display: flex !important;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
}

/* Prevent horizontal overflow on mobile */
html, body {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
}
section, header, footer, nav {
    overflow-x: hidden;
    max-width: 100vw;
}

/* Smooth Scroll */
html {
    scroll-behavior: smooth;
}

/* Selection Color */
::selection {
    background: var(--color-neon-green);
    color: var(--color-dark);
}

/* Animations */
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
    100% { transform: translateY(0px); }
}

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