/* Custom styles supplementing Tailwind - all key styles are in index.html for single-file simplicity */
/* This file is intentionally minimal as the design uses inline styles and Tailwind */

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #050A18;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #3CC4A8, #D4A843);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #5ED8C0, #E8C560);
}

/* Selection color */
::selection {
    background: rgba(60, 196, 168, 0.3);
    color: #FFFFFF;
}

/* Focus styles */
*:focus-visible {
    outline: 2px solid #5ED8C0;
    outline-offset: 2px;
}

/* Smooth transitions for all interactive elements */
a, button {
    transition: all 0.3s ease;
}

/* Ensure images don't cause layout shift */
img {
    max-width: 100%;
    height: auto;
}

/* Print styles */
@media print {
    .navbar, .mobile-menu, .hamburger {
        display: none !important;
    }

    body {
        background: white;
        color: black;
    }

    .hero {
        min-height: auto;
        padding: 2rem 0;
    }
}