/* ===========================
   HEADER
=========================== */

.header{
    width:100%;
    background:#fff;
    position:sticky;
    top:0;
    left:0;
    z-index:9999;
    box-shadow:0 4px 20px rgba(0,0,0,.08);
}

.container{
    width:95%;
    max-width:1400px;
    margin:auto;
}

.header .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    height:95px;
}

.logo{
    display:flex;
    align-items:center;
}

.logo img{
    width:300px;
    height:auto;
}

.menu ul{
    display:flex;
    align-items:center;
    gap:45px;
    list-style:none;
}

.menu a{
    color:#111;
    font-size:17px;
    font-weight:600;
    transition:.3s;
    position:relative;
}

.menu a:hover,
.menu a.activo{
    color:#0d4fb5;
}

.menu a.activo::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-12px;
    width:100%;
    height:3px;
    background:#0d4fb5;
    border-radius:30px;
}

.header-contacto{
    display:flex;
    align-items:center;
    gap:25px;
}

.telefono{
    display:flex;
    align-items:center;
    gap:10px;
    color:#0A234A;
    font-weight:700;
    font-size:18px;
}

.telefono i{
    width:42px;
    height:42px;
    border-radius:50%;
    background:#0d4fb5;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
}

.btn-presupuesto{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    background:linear-gradient(90deg,#0d4fb5,#0A234A);
    color:#fff;
    padding:18px 28px;
    border-radius:14px;
    font-weight:700;
    transition:.3s;
}

.btn-presupuesto:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 25px rgba(13,79,181,.35);
}

@media (max-width:1100px){

    .logo img{
        width:240px;
    }

    .header .container{
        height:90px;
    }

    .menu{
        position:fixed;
        top:90px;
        left:-100%;
        width:100%;
        height:calc(100vh - 90px);
        background:#fff;
        display:flex;
        justify-content:flex-start;
        align-items:flex-start;
        padding-top:50px;
        transition:left .35s ease;
        z-index:9999;
    }

    .menu.active{
        left:0;
    }

    .menu ul{
        width:100%;
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:35px;
    }

    .menu a{
        font-size:22px;
    }

    .header-contacto{
        display:none;
    }

    .menu-toggle{
        display:flex;
    }
}

/*==================================
        MENU HAMBURGUESA
==================================*/

.menu-toggle{

    display:none;

    width:45px;
    height:45px;

    border:none;
    background:transparent;

    cursor:pointer;

    padding:0;

    position:relative;

    z-index:10001;

    flex-direction:column;
    justify-content:center;
    align-items:center;

    gap:6px;

}

.menu-toggle span{

    display:block;

    width:28px;
    height:3px;

    background:#0D4FB5;

    border-radius:10px;

    transition:.35s ease;

}

.menu-toggle.active span:nth-child(1){

    transform:translateY(9px) rotate(45deg);

}

.menu-toggle.active span:nth-child(2){

    opacity:0;

}

.menu-toggle.active span:nth-child(3){

    transform:translateY(-9px) rotate(-45deg);

}

@media (max-width:1100px){

    .menu-toggle{

        display:flex;

    }

}