/* ==========================================================
   MAMGOC Website V2
   99-responsive.css
   Unified responsive system
========================================================== */

/* ----------------------------------------------------------
   Tablet
---------------------------------------------------------- */

@media (max-width:1100px){

    .navigation{
        gap:18px;
    }

    .main-nav{
        gap:18px;
    }

    .industry-grid,
    .compliance-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .stats-strip-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .footer-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


/* ----------------------------------------------------------
   Mobile navigation and general layout
---------------------------------------------------------- */

@media (max-width:1100px){

    .navigation{
        position:relative;
        display:flex;
        align-items:center;
        flex-wrap:nowrap;
        min-height:76px;
        padding:12px 0;
        gap:12px;
    }

    .logo{
        position:relative;
        z-index:2;
        min-width:0;
        margin-right:auto;
    }

    .logo img{
        display:block;
        width:auto;
        height:42px;
        max-width:190px;
    }

    /*
     * Keep the checkbox accessible to the label while removing
     * it from the visible page layout.
     */
    .nav-toggle{
        position:absolute;
        width:1px;
        height:1px;
        margin:-1px;
        padding:0;
        overflow:hidden;
        clip:rect(0 0 0 0);
        white-space:nowrap;
        border:0;
    }

    .nav-toggle-label{
        position:relative;
        z-index:1002;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        flex-direction:column;
        flex:0 0 44px;
        order:3;
        width:44px;
        height:44px;
        margin:0;
        padding:0;
        gap:5px;
        border:1px solid var(--gray-200);
        border-radius:12px;
        background:#fff;
        cursor:pointer;
    }

    .nav-toggle-label span{
        display:block;
        width:20px;
        height:2px;
        margin:0;
        border-radius:999px;
        background:var(--primary);
        transition:
            transform .2s ease,
            opacity .2s ease;
    }

    .main-nav{
        position:absolute;
        z-index:1001;
        top:calc(100% + 8px);
        left:0;
        right:0;
        display:none;
        width:100%;
        max-height:calc(100vh - 110px);
        margin:0;
        padding:12px;
        overflow-y:auto;
        flex-direction:column;
        align-items:stretch;
        justify-content:flex-start;
        gap:0;
        border:1px solid var(--gray-200);
        border-radius:18px;
        background:#fff;
        box-shadow:var(--shadow-lg);
    }

    .main-nav a{
        display:block;
        width:100%;
        padding:14px 12px;
        color:var(--gray-700);
        border-bottom:1px solid var(--gray-100);
    }

    .main-nav a:last-child{
        border-bottom:0;
    }

    .main-nav a::after{
        display:none;
    }

    .nav-toggle:checked ~ .main-nav{
        display:flex;
    }

    .nav-toggle:checked + .nav-toggle-label span:nth-child(1){
        transform:translateY(7px) rotate(45deg);
    }

    .nav-toggle:checked + .nav-toggle-label span:nth-child(2){
        opacity:0;
    }

    .nav-toggle:checked + .nav-toggle-label span:nth-child(3){
        transform:translateY(-7px) rotate(-45deg);
    }

    .actions{
        display:flex;
        align-items:center;
        flex-direction:row;
        flex:0 0 auto;
        order:2;
        margin:0;
        gap:8px;
    }

    .phone{
        display:none;
    }

    .quote-link{
        min-height:40px;
        padding:10px 14px;
        font-size:.82rem;
    }

    .portal{
        min-height:40px;
        padding:10px 13px;
        font-size:.82rem;
    }

    .wos-grid,
    .cta-box{
        grid-template-columns:minmax(0,1fr);
    }

    .journey-cards,
    .trust-grid{
        grid-template-columns:minmax(0,1fr);
    }

    .hero-v2{
        min-height:680px;
    }
}


/* ----------------------------------------------------------
   Small mobile
---------------------------------------------------------- */

@media (max-width:640px){

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

    h1{
        font-size:2.45rem;
    }

    h2{
        font-size:2rem;
    }

    .navigation{
        min-height:70px;
        gap:8px;
    }

    .logo img{
        height:38px;
        max-width:155px;
    }

    .actions{
        flex-direction:row;
        align-items:center;
        gap:6px;
    }

    .quote-link{
        display:none;
    }

    .portal{
        width:42px;
        min-width:42px;
        height:42px;
        min-height:42px;
        padding:0;
        font-size:0;
        border-radius:12px;
    }

    .portal .action-icon{
        width:18px;
        height:18px;
        margin:0;
    }

    .nav-toggle-label{
        flex-basis:42px;
        width:42px;
        height:42px;
    }

    .main-nav{
        top:calc(100% + 6px);
        border-radius:14px;
    }

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

    .hero-buttons,
    .hero-badges,
    .cta-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .industry-grid,
    .compliance-grid,
    .stats-strip-grid,
    .footer-grid{
        grid-template-columns:minmax(0,1fr);
    }

    .stats-strip-item{
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.12);
    }

    .footer-bottom{
        flex-direction:column;
    }
}

/* mobile-menu-cache-refresh-20260824 */
