/* ========== Tablet & smaller desktop ========== */
@media (max-width: 1040px) {
    .hero-grid,
    .section-header,
    .country-layout,
    .audit-layout,
    .about-layout {
        grid-template-columns: 1fr;
    }
    .services-grid { grid-template-columns: repeat(2,1fr); }
    .work-grid { grid-template-columns: repeat(2,1fr); }
    .case-grid { grid-template-columns: 1fr; }
    .audit-info { order: -1; }
}

/* ========== Mobile Navigation ========== */
@media (max-width: 760px) {
    :root { --header-height: 60px; }
    body { padding-bottom: 56px; }

    .container {
        width: min(100% - 26px, var(--max-width));
    }

    /* Make brand logo smaller on mobile */
    .brand-logo { 
        width: 148px; 
        height: auto;
    }

    /* === HAMBURGER MENU - FIXED === */
    .main-nav {
        position: relative;
        overflow: visible; /* Critical: allows dropdown to be visible */
    }

    /* Make header allow dropdown overflow */
    .site-header {
        overflow: visible;
    }

    .site-header .container {
        overflow: visible;
    }

    /* Hide the normal nav links by default on mobile */
    .nav-links {
        display: none;
        position: fixed; /* Changed from absolute to fixed to avoid clipping */
        top: var(--header-height);
        right: 0;
        width: 280px;
        max-height: calc(100vh - var(--header-height) - 10px); /* Prevents going off screen */
        overflow-y: auto; /* Scroll if menu is too long */
        background: rgba(5, 5, 5, 0.95);
        backdrop-filter: blur(20px);
        border: 1px solid var(--color-line);
        border-top: none;
        flex-direction: column;
        padding: 1.5rem;
        gap: 0;
        z-index: 9999; /* Higher z-index to ensure it's on top */
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6); /* Added depth */
        border-radius: 0 0 8px 8px; /* Optional: rounded bottom corners */
    }

    /* Show nav links when menu is open */
    .nav-links.show {
        display: flex;
    }

    .nav-links li {
        width: 100%;
        border-bottom: 1px solid var(--color-line);
    }

    .nav-links li:last-child {
        border-bottom: none;
    }

    .nav-links a {
        display: block;
        padding: 1rem 0;
        font-size: 0.875rem;
        letter-spacing: 0.1em;
        color: var(--color-white);
    }

    /* Remove the underline animation on mobile (optional) */
    .nav-links a::after {
        display: none;
    }

    /* === SHOW HAMBURGER BUTTON === */
    .hamburger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 6px;
        width: 44px;
        height: 44px;
        padding: 0;
        background: none;
        border: 1px solid rgba(244, 244, 242, 0.3);
        cursor: pointer;
        z-index: 60;
        position: relative;
    }

    .hamburger .line {
        display: block;
        width: 22px;
        height: 2px;
        background: var(--color-white);
        transition: transform 0.3s ease, opacity 0.3s ease;
    }

    /* === HAMBURGER ANIMATION (OPEN STATE) === */
    .hamburger.open .line:nth-child(1) {
        transform: rotate(45deg) translate(5px, 6px);
    }
    .hamburger.open .line:nth-child(2) {
        opacity: 0;
    }
    .hamburger.open .line:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -6px);
    }

    /* === HERO SECTION === */
    .hero {
        padding: calc(var(--header-height) + 30px) 0 34px;
        min-height: auto;
        align-items: start;
    }
    .hero-grid { gap: 1.75rem; }
    .hero-visual { min-height: 360px; }
    .side-index { width: 3rem; }
    .ring { width: min(76vw, 300px); }
    .panel-copy {
        width: calc(100% - 3rem);
        padding: 1.125rem;
        font-size: 0.75rem;
    }

    /* === TYPOGRAPHY === */
    h1 { font-size: clamp(2.75rem, 15vw, 4.25rem); }
    h2 { font-size: clamp(2.125rem, 10.5vw, 3rem); }

    .eyebrow {
        font-size: 0.625rem;
        letter-spacing: 0.13em;
        margin-bottom: 1rem;
    }

    /* === TRUST BAR === */
    .trust-track { gap: 2.125rem; font-size: 0.625rem; }
    .trust-track span { gap: 2.125rem; }

    /* === SERVICES, WORK, FORM GRIDS === */
    .services-grid,
    .work-grid,
    .form-grid { grid-template-columns: 1fr; }

    /* === SECTIONS === */
    .section { padding: 4.125rem 0; }
    .section-header { gap: 1.125rem; margin-bottom: 2.375rem; }

    /* === MAP === */
    .map-wrap, .world-map { min-height: 300px; }
    .country-list span { padding: 0.5rem 0.5625rem; font-size: 0.625rem; }

    /* === AUDIT FORM === */
    .audit-form { padding: 1.375rem; }
    .full-width { grid-column: auto; }
    .form-actions { flex-direction: column; }

    /* === ABOUT === */
    .difference-item { grid-template-columns: 1fr; gap: 0.625rem; }

    /* === FLOATING WHATSAPP & MOBILE BAR === */
    .floating-whatsapp { display: none; }
    .mobile-bar { display: grid; }

    /* === FOOTER === */
    .footer-grid { flex-direction: column; align-items: flex-start; }
    .footer-logo { width: 160px; }

    /* === PAGE CONTENT === */
    .page-content { padding-top: calc(var(--header-height) + 1.5rem); }
    .info-grid, .who-grid, .service-chooser { grid-template-columns: 1fr; }

    /* === INFORMATION PAGE === */
    .info-page h1 {
        font-size: 1.75rem;
        margin-bottom: 1rem;
    }
    .info-page h2 {
        font-size: 1.375rem;
        margin-bottom: 0.75rem;
    }
    .info-page .section-header {
        margin-bottom: 1.5rem;
    }
    .info-page .lead {
        margin-bottom: 1.5rem;
    }
}

/* ========== Small Mobile ========== */
@media (max-width: 430px) {
    .container { width: min(100% - 22px, var(--max-width)); }
    .brand-logo { width: 136px; }

    /* Full width mobile menu - FIXED */
    .nav-links {
        width: 100vw;
        left: 0;
        right: 0;
        border-radius: 0;
        border-left: none;
        border-right: none;
        top: var(--header-height);
    }

    .hero-visual { min-height: 320px; }
    .side-index { display: none; }
    .panel-copy { width: 100%; border-left: 0; }
    .map-wrap, .world-map { min-height: 260px; }
    .map-label { display: none; }
    .section { padding: 3.625rem 0; }
    .mobile-bar a { min-height: 3.375rem; font-size: 0.6875rem; }

    /* === INFORMATION PAGE === */
    .info-page h1 {
        font-size: 1.5rem;
    }
    .info-page h2 {
        font-size: 1.25rem;
    }
}