/* Fix for hamburger menu and hero image on mobile */
/* Only show hamburger menu on mobile devices */
@media (max-width: 768px) {
    #header nav .nav-toggle,
    .nav-toggle,
    header .nav-toggle,
    #navToggle {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 30px;
        height: 21px;
        cursor: pointer;
        z-index: 9999;
        position: relative;
    }

    #header nav .nav-toggle span,
    .nav-toggle span,
    header .nav-toggle span,
    #navToggle span {
        background-color: #000000;
        height: 3px;
        border-radius: 3px;
        display: block;
        opacity: 1;
        margin: 0;
    }
    
    /* Mobile menu animation */
    .nav-toggle.active span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }
    
    .nav-toggle.active span:nth-child(2) {
        opacity: 0;
    }
    
    .nav-toggle.active span:nth-child(3) {
        transform: rotate(-45deg) translate(7px, -6px);
    }
    
    /* Optionally hide hero image on very small screens */
    .hero-image {
        display: none;
    }
}

/* Hide hamburger menu on larger screens */
@media (min-width: 769px) {
    #header nav .nav-toggle,
    .nav-toggle,
    header .nav-toggle,
    #navToggle {
        display: none;
    }
    
    /* Ensure hero image is visible on larger screens */
    .hero-image {
        display: block;
    }
}

/* Increase contrast and visibility */
#header {
    background-color: rgba(255, 255, 255, 0.95);
}