/* Mobile fixes and improved nav/button behavior */
:root {
    --nav-height: 68px;
}

/* Reset any problematic global min-width for hero buttons */
.hero-primary-btn, .hero-secondary-btn {
    min-width: 0 !important;
}

/* Make burger visible and ensure nav works consistently */
.burger-menu {
    display: none; /* default desktop, mobile override below */
}

@media (max-width: 768px) {
    .burger-menu {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Hide desktop inline links and prepare off-canvas menu */
    
    .nav-links {
        display: flex !important;
        flex-direction: column;
        position: fixed;
        top: var(--nav-height);
        right: 0;
        width: 280px;
        height: calc(100vh - var(--nav-height));
        padding: 18px 20px;
        gap: 14px;
        background: linear-gradient(180deg, rgba(6,6,6,0.98), rgba(10,10,10,0.98));
        transform: translateX(100%);
        transition: transform 260ms cubic-bezier(.16,1,.3,1);
        box-shadow: -16px 0 40px rgba(0,0,0,0.6);
        z-index: 1500;
        visibility: hidden;
        opacity: 0;
    }

    .nav-links.active {
        transform: translateX(0);
        visibility: visible;
        opacity: 1;
    }

    /* When menu is open prevent body scroll */
    body.nav-open {
        overflow: hidden;
        touch-action: none;
    }

    /* Make link feel tappable */
    .nav-links a {
        display: block;
        width: 100%;
        padding: 12px 10px;
        font-size: 16px;
        border-radius: 10px;
    }

    /* Hero buttons stacked and full width */
    .hero-actions {
        flex-direction: column !important;
        gap: 18px;
        width: 100%;
        max-width: 540px;
        margin: 20px auto 0;
        padding: 0 12px;
    }

    .hero-primary-btn, .hero-secondary-btn {
        width: 100% !important;
        display: block !important;
        padding: 14px 18px !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    /* Add a small separation when stacked to avoid visual crowding */
    .hero-secondary-btn { margin-top: 6px; }

    /* Improve spacing for hero text on small screens */
    .hero-text {
        font-size: 1rem;
        padding: 0 18px;
    }

    /* Slightly reduce hero title letter-spacing on small screens */
    .hero h1 { letter-spacing: -2px; }
}

/* Small polish for link hover color to match brand */
.nav-links a:hover { color: #fff !important; }

/* If anything else forces nav-links visible on desktop, keep it normal */