/*------------------------------------*\
    $MODIFICACIONES MENÚ FIJO
\*------------------------------------*/

/* Hacer el header fijo en la parte superior */
#as_cabecera {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    background-color: #002EA1 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
    transition: all 0.3s ease !important;
}

/* Asegurar que el header tenga el fondo correcto */
#header {
    /*background-color: #002EA1 !important;*/
    margin: 0 !important;
    padding: 0 !important;
}

/* Ajustar el body para compensar el header fijo */
body {
    padding-top: 80px !important;
    /* Ajusta según la altura real de tu header */
}

/* Para dispositivos móviles, ajustar el padding */
@media (max-width: 767px) {
    body {
        padding-top: 70px !important;
    }
}

/* Asegurar que el navbar mantenga su estilo */
.navbar {
    margin-bottom: 0 !important;
    border: none !important;
    background-color: transparent !important;
}

/* Mantener el dropdown menu por encima de otros elementos */
.dropdown-menu {
    z-index: 10000 !important;
}

/* Ajustar el wrapper para que no se superponga */
#wrapper {
    margin-top: 0 !important;
    position: relative !important;
}

/* Opcional: Efecto de transparencia al hacer scroll */
.header-scrolled {
    background-color: rgba(0, 46, 161, 0.95) !important;
    backdrop-filter: blur(10px) !important;
}

/*------------------------------------*\
    $RESTO DE ESTILOS ORIGINALES
\*------------------------------------*/

.astitulo1 {
    color: #FFFFFF;
    font-family: Arial !important;
    font-size: 48px;
    line-height: 1.2;
    font-weight: bold;
}

.astitulo2 {
    color: #FFFFFF !important;
    font-family: Arial !important;
    font-size: 21px;
    text-decoration: none !important;
    line-height: 25px;
    padding-bottom: 20px;
}

.astitulo3 {
    font-family: Arial;
    font-size: 36px;
    color: #FFFFFF;
    padding-top: 30px;
    margin-bottom: 25px;
}

.as-titulo-menu {
    color: #FFFFFF !important;
    font-family: Arial !important;
    font-size: 16px;
    text-decoration: none !important;
    line-height: 25px;
    padding-bottom: 20px;
}

.astitulof {
    color: #FFFFFF;
    font-family: Arial !important;
    font-size: 18px !important;
}

.asestilo {
    margin-top: 10px;
}

.imgplaneta {
    width: 100%;
}

.asbox {
    padding-bottom: 30px;
}

.asalinear {
    text-align: right;
}

.asimgmedida {
    width: 100%;
}

.aslinea {
    border: 2px solid #009DF2;
}

.as-espacio {
    border: 15px solid transparent;
}

.as-imagen1 {
    width: 80%;
}

.as-linea {
    border-width: 2px;
    width: 1300px;
    border-color: #009DF2
}

.as-linea2 {
    margin-top: 0px;
    margin-bottom: 0px;
}

.as-bloque-main {
    padding-bottom: 30px;
}

@media(max-width: 1369px) {
    .as-linea {
        width: 1150px;
    }
}

@media(max-width: 1199px) {
    .as-linea {
        width: 960px;
    }
}

@media(max-width: 991px) {
    .as-linea {
        width: 730px;
    }

    .cuadrado-borde {
        padding: 10px !important;
        margin: 10px !important;
    }
}

@media(max-width: 767px) {
    .assubtitle {
        position: relative;
        left: 5% !important;
    }

    .as-linea {
        width: 90%;
    }

    .as-imagen1 {
        width: 100%;
    }

    .astitulo2 {
        font-size: 18px;
    }

    .as-bloque-main {
        text-align: center;
    }

    .astitulo1 {
        font-size: 35px !important;
    }

    .astitulo3 {
        font-size: 30px !important;
    }

    #wrapper {
        background-position-x: 40%;
        background-size: 300%;
    }

    .cuadrado-borde {
        padding: 20px !important;
        margin: 20px !important;
    }

    .as-li-beneficio {
        text-align: center;
    }

    .as-titulo-beneficio {
        padding-top: 30px;
        text-align: center;
    }

    .as-texto-beneficio {
        text-align: center;
    }

    .as-menu-beneficio {
        text-align: center;
    }
}

@media(max-width: 767px) {
    .as-img {
        display: none;
    }

    .as-espacio {
        display: none;
    }

    .asfescritorio {
        display: none;
    }

    .asbrandmv {
        margin-top: 5% !important;
    }

    .asmedidaimg {
        width: 20% !important;
    }

    .asimgcenter {
        text-align: center;
    }

    .asboton {
        margin-left: 35%;
        margin-right: 35%;
    }

    .asespacio {
        padding-top: 10px;
    }
}

/*collapse medida*/
@media(max-width:363px) {
    .asfcollapse {
        position: relative;
        left: 30% !important;
    }
}

@media(max-width:767px) {
    .asbox {
        text-align: center !important;
    }

    .associo {
        display: none;
    }

    .asicon {
        height: 30px;
        width: 30px;
        margin-right: 4px;
    }

    .asptexto {
        display: none;
    }
}

@media(min-width:992px) {
    .aspimg1 {
        display: none;
    }

    .aspimg5 {
        display: none;
    }
}

@media(min-width:768px) and (max-width:991px) {
    .aspadding {
        padding-bottom: 8% !important;
    }

    .aspdn {
        padding-bottom: 13%;
    }

    .aspadding1 {
        padding-bottom: 2%;
    }

    .aspimg4 {
        display: none;
    }

    .aspimg {
        display: none;
    }
}

@media(min-width:1200px) {
    .aspimg3 {
        display: none;
    }

    .asptexto {
        display: none;
    }
}

@media(min-width:768px) and (max-width:1199px) {
    .aspimg2 {
        display: none !important;
    }

    .asptexto1 {
        display: none;
    }
}

@media(min-width:420px) and (max-width:767px) {
    .aspimg3 {
        display: none !important;
    }
}

@media(max-width:419px) {
    .aspimg2 {
        display: none;
    }
}

@media(min-width:768px) {
    .asimgr {
        text-align: right;
    }

    .associo1 {
        display: none;
    }

    .as-collapse-mostrado {
        display: block !important;
        transition: none !important;
    }

    .as-icon-hide {
        display: none !important;
    }

    .as-collapse-hide-espacio {
        display: none;
    }

    .as-icono-rigth {
        text-align: right;
    }
}

@media(max-width:393px) {
    .aspimg {
        display: none;
    }

    .aspimg4 {
        display: none;
    }
}

@media(min-width:394px) and (max-width:767px) {
    .aspimg1 {
        display: none;
    }
}

@media(min-width:394px) and (max-width:767px) {
    .aspimg5 {
        display: none;
    }
}

/*Escritorio*/
@media(min-width: 768px) {
    .asboximg {
        margin-right: 21%;
    }

    .asboximg1 {
        margin-left: 21%;
    }

    .asbrandmv {
        display: none;
    }

    .asfmovil {
        display: none;
    }

    .asmedidaimg {
        width: 100%;
    }

    .asficonos {
        height: 23px;
        width: 23px;
        margin-right: 5px;
    }

    .asficonos1 {
        height: 23px;
        width: 23px;
    }

    .asboton {
        margin-left: 35%;
        margin-right: 35%;
    }

    /*As imagen left - right*/
    .aslrimg {
        padding-left: 15%;
        padding-right: 15%;
    }
}

@media(min-width:639px) and (max-width:767px) {
    .aslrimg {
        padding-left: 10%;
        padding-right: 10%;
    }
}

@media(max-width:371px) {
    .asboton {
        margin-left: 30%;
        margin-right: 30%;
    }
}

@media(max-width:767px) {
    .asplaneta {
        display: none !important;
    }

    .asplanetimg {
        border: none !important;
        background-repeat: no-repeat;
        background-image: url("../../../Web2/img/contacto_ll.png");
        background-size: cover;
        background-position-x: 70%;
    }

    .as-collapse-center {
        text-align: center !important;
    }
}

.asbordercontac {
    border-bottom: solid white !important;
}

@media(min-width:768px) {
    .asplaneta1 {
        display: none !important;
    }

    #asinfor {
        display: none !important;
    }
}

.asbtncontacto {
    border-radius: 0% !important;
    background-color: #ff7e00 !important;
}

.astextofrm {
    border-radius: 0% !important;
    border: 2px solid #009DF2 !important;
    background-color: transparent !important;
}

/*Boton*/
.as-boton-footer {
    font-size: 14px !important;
}

/*AS IMG MD*/
@media(min-width:992px) {
    .asmd {
        left: 10%;
    }

    /*MD img*/
    .asimgwidth {
        width: 20% !important;
    }

    /*ODO*/
    .as-img-odo {
        width: 40% !important;
    }

    /*MW*/
    .as-img-meadewillis {
        width: 25% !important;
    }
}

/*AS IMG MEADE WILLIS*/
.asmwimg {
    width: 25% !important;
}

.asmwtex {
    margin: 3% !important;
}

/*IMG FABRICA*/
.aslado {
    text-align: left;
}

.asadaptation {
    width: 100%;
}

.asadaptation2 {
    width: 70%;
}

.asadaptation1 {
    text-align: right;
}

.asubposition {
    position: relative;
    left: 10%;
}

.asparrafo {
    padding-left: 15% !important;
}

.aslistar {
    display: inline-block !important;
}

@media(min-width:768px) {
    .asbtnhide {
        display: none;
    }

    /*SAFE*/
    .assafehide2 {
        display: none;
    }

    .asmdtexto {
        text-align: center !important;
    }
}

@media(min-width:768px) and (max-width:991px) {
    .asparrafo {
        padding-left: 8% !important;
    }

    .asadaptation {
        margin-top: 40% !important;
    }

    .aslist {
        margin-top: 10%;
    }

    .asimgwidth {
        width: 25%;
    }

    .as-img-odo {
        width: 40% !important;
    }

    .as-img-meadewillis {
        width: 30% !important;
    }

    .asmove {
        padding-top: 30%;
    }

    .asadaptation2 {
        width: 90%;
    }
}

@media(min-width:992px) and (max-width:1199px) {
    .asadaptation {
        margin-top: 20% !important;
    }

    .asparrafo {
        padding-left: 10% !important;
    }

    .asmove {
        padding-top: 5%;
    }

    .asadaptation2 {
        width: 80%;
    }

    .asmargintab {
        margin-top: 5%;
    }
}

@media(min-width:768px) and (max-width:991px) {
    .asmargintab {
        margin-top: 10%;
    }
}

@media(max-width:767px) {
    .asadaptation {
        padding-left: 12%;
        padding-right: 12%;
        width: 90%;
    }

    .asparrafo {
        padding-left: 5% !important;
    }

    .asfmp {
        margin: 5%;
        padding: 5%;
    }

    .asimgwidth {
        width: 30%;
    }

    .as-img-odo {
        width: 55% !important;
    }

    .as-img-meadewillis {
        width: 35% !important;
    }

    .assafehide {
        display: none;
    }

    .ashide {
        display: none !important;
    }
}

/*Borde Fabrica*/
.cuadrado-borde {
    border-radius: 25px;
    border-top: 2px solid #2596be;
    border-left: 2px solid #2596be;
    border-bottom: 2px solid #2596be;
    border-right: 2px solid #2596be;
    padding: 60px;
    margin: 60px;
}

.asrowm {
    margin: 2% !important;
}

/*Contactenos*/
.asdivbtn {
    background-color: #FF7E00;
    margin-top: 22% !important;
}

.asspanbtn {
    color: #FFF;
    padding: 10px;
}

.ascontatotext {
    text-decoration: none !important;
}

@media(max-width: 767px) {
    .aslineahide {
        display: none;
    }

    .separartext {
        word-wrap: break-word !important;
    }

    .as-footer-center {
        text-align: center !important;
        position: relative;
    }

    .as-footer-move {
        position: absolute;
        bottom: 0%;
        left: 0%;
        right: 0%;
        justify-content: center !important;
    }

    /*Color del menu al desplegarse*/
    .as-sin-fondo {
        background-color: #000000 !important;
    }

    .as-menu-index {
        background-color: #002EA1 !important;
    }
}

.as-copyright-center {
    align-items: center;
    display: flex;
    height: 50px;
    justify-content: left;
}

/*Escritorio*/
@media(min-width: 768px) {
    .cuadrado-borde-padding {
        padding-left: 5% !important;
        padding-right: 2% !important;
    }

    .as-icono-instagram {
        height: 29px;
    }

    .as-texto-footer-center {
        align-items: center;
        display: flex;
        height: 50px;
        justify-content: left;
    }
}

.as-icono-social {
    height: 29px;
    margin: 10px;
}

.as-sin-fondo {
    background-color: none !important;
}

.ascollapse {
    margin-left: -15px !important;
    margin-right: -15px;
}

.as-main-content-home {
    background: linear-gradient(#002EA0, #000000);
}

.as-main-content-subm {
    background: linear-gradient(#000000, #002EA0);
}

.as-titulo-beneficio {
    color: #FFFFFF;
    font-family: Arial !important;
    font-size: 21px;
    font-weight: bold;
}

.as-texto-beneficio {
    color: #FFFFFF;
    font-family: Arial !important;
    font-size: 21px;
}

.as-li {
    list-style: none !important;
}

.as-li-beneficio {
    text-decoration: none !important;
    font-family: Arial !important;
    font-size: 21px;
    text-align: left;
    font-weight: bold;
    color: #009DF2;
    cursor: pointer !important;
}

a.as-li-beneficio:hover {
    color: #FF7E00;
}

.aslista2 {
    font-family: Arial !important;
    font-size: 21px;
    font-weight: bold;
    text-align: center !important;
}

.aslista3 {
    color: #009DF2 !important;
    font-family: Arial !important;
    font-size: 21px;
    text-align: center;
    font-weight: bold;
}

.aslista {
    color: #009DF2 !important;
    font-family: Arial !important;
    font-size: 21px;
    text-align: left;
    font-weight: bold;
    text-decoration: none !important;
}

.astitulof {
    color: #FFFFFF;
    font-family: Arial !important;
    font-size: 16px;
}

.as-texto-footer {
    font-size: 16px;
}

.as-footer-main-subm {
    background-color: none !important;
}

/*Cambia el color el boton al click*/
#header .navbar-default.navbar-collapsed-sm .as-navbar-color:hover,
#header .navbar-default.navbar-collapsed-sm .as-navbar-color:focus {
    background-color: #000000 !important;
}

.as-icono-red-social {
    padding: 10px 10px 10px 10px;
}

#header .navbar-default.navbar-collapsed-sm .navbar-nav>li .dropdown-menu {
    margin-top: 0px;
    background-color: #002EA1;
    border: none;
    width: 216px;
    right: 50%;
    margin-right: -108px;
    border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;

    /* Sombra mejorada para mejor separación visual */
    box-shadow:
        0 12px 32px rgba(0, 0, 0, 0.6),
        0 8px 16px rgba(0, 0, 0, 0.4),
        0 4px 8px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(0, 142, 242, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-box-shadow:
        0 12px 32px rgba(0, 0, 0, 0.6),
        0 8px 16px rgba(0, 0, 0, 0.4),
        0 4px 8px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(0, 142, 242, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -moz-box-shadow:
        0 12px 32px rgba(0, 0, 0, 0.6),
        0 8px 16px rgba(0, 0, 0, 0.4),
        0 4px 8px rgba(0, 0, 0, 0.3),
        0 0 0 1px rgba(0, 142, 242, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);

    /* Animación de desplazamiento desde arriba */
    transform: translateY(-20px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 10001;

    /* Backdrop blur para mejor separación */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Cuando el dropdown está activo */
#header .navbar-default.navbar-collapsed-sm .navbar-nav>li:hover .dropdown-menu,
#header .navbar-default.navbar-collapsed-sm .navbar-nav>li .dropdown-menu.show {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}

/* Animación adicional para los elementos internos del menú */
#header .navbar-default.navbar-collapsed-sm .navbar-nav>li .dropdown-menu .dropdown-item {
    opacity: 1;
    transform: none;
    transition: none;
}

#header .navbar-default.navbar-collapsed-sm .navbar-nav>li:hover .dropdown-menu .dropdown-item,
#header .navbar-default.navbar-collapsed-sm .navbar-nav>li .dropdown-menu.show .dropdown-item {
    opacity: 1;
    transform: translateY(0);
}

/* Efecto de hover mejorado para los items del menú */
#header .navbar-default.navbar-collapsed-sm .navbar-nav>li .dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateX(5px);
    transition: all 0.2s ease;
}

/* Ajustar la animación para que venga desde arriba */
#header .navbar-default.navbar-collapsed-sm .navbar-nav>li .dropdown-menu {
    transform: translateY(-20px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-out;
}

.dropdown-menu .dropdown-item {
    display: block;
    width: 100%;
    padding: 10px 20px;
    text-align: center;
    color: white;
    white-space: nowrap;
    transition: background-color 0.2s ease;
}

.dropdown-menu .dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.1);
}