@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

body {
    font-family: 'Open Sans', sans-serif;
    background-color: #fafafa !important;
}

body::-webkit-scrollbar {
    width: 7px;
    /* width of the entire scrollbar */
}

body::-webkit-scrollbar-track {
    background: transparent;
    /* color of the tracking area */
}

body::-webkit-scrollbar-thumb {
    background-color: #D1D1D1;
    /* color of the scroll thumb */
    border-radius: 12px;
    /* roundness of the scroll thumb */
    border: 1px solid #D1D1D1;
    /* creates padding around scroll thumb */
}

.bg-footer {
    background-image: url('../img/footer/TEXTURA.jpg');
    background-position: center;
}

.bg-azul {
    background-color: #142C45 !important;
}

.bg-azul-opacity {
    background-color: rgba(20, 44, 69, 0.7) !important;
}

.bg-gray {
    background-color: #fafafa !important;
}

.btn-azul {
    background-color: #142C45 !important;
    color: white !important;
}

.border-azul {
    border-color: #142C45 !important;
}

.transparente {
    background-color: rgba(0, 0, 0, 0) !important;
}

.border-azul-div {
    border-color: #142C45 !important;
    border-width: 5px;
}

.text-azul {
    color: #142C45 !important;
}

.modulo-menu:hover {
    color: #142C45 !important;
}

.hover-busqueda:hover {
    transition: .3s ease-in-out;
    background-color: #142C45 !important;
    color: white !important;
}

.text-justify {
    text-align: justify !important;
}

.text-pequeno-x1 {
    font-size: 14px !important;
}

.text-pequeno-x2 {
    font-size: 11px;
}

.cursor:hover {
    cursor: pointer;
}

.cursor-link:hover {
    transition: all .2s;
    color: #007bff !important;
    cursor: pointer;
}

.circulo {
    border-radius: 48%;
}

.input-contacto {
    background-color: transparent !important;
    border: none;
    border-bottom: solid 1px;
    border-radius: 0%;
}

.catalogo, .producto {
    transition: ease .3s;
}

.catalogo:hover {
    /* transition: ease .3s; */
    transform: scale(1.02, 1.02);
    /* -webkit-box-shadow: 0px 0px 24px 5px rgba(0, 0, 0, 0.52);
    box-shadow: 0px 0px 24px 5px rgba(0, 0, 0, 0.52);
    z-index: 1; */
}

.producto:hover {
    /* transition: ease .3s; */
    transform: scale(1.02, 1.02);
    -webkit-box-shadow: 0px 0px 24px 5px rgba(0, 0, 0, 0.52);
    box-shadow: 0px 0px 24px 5px rgba(0, 0, 0, 0.52);
    z-index: 1;
}

.hover-menu {
    transition: background-color .3s;
}

.hover-menu:hover {
    background-color: #dadada;
}

.item_active {
    background-color: #dadada;
}


.w-40 {
    width: 40% !important;
}

.w-60 {
    width: 60% !important;
}

.w-88 {
    width: 88% !important;
}

.w-95 {
    width: 95% !important;
}

.min-vh-80 {
    min-height: 80vh !important;
}

/* Animaciones */
@keyframes cargar {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (min-width: 300px) {

    .bg-footer {
        background-position: center;
        background-size: cover;
    }
}

/* Tooltips */

.tooltip-container {
    position: relative;
    /*relative: los elementos se posicionan de forma relativa a su posición normal.*/
    display: inline-block;
}

.tooltip-text {
    visibility: hidden;
    min-width: 120px;
    background-color: rgba(0, 0, 0, .7);
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    top: 125%;
    /* Posiciona el tooltip bajo del elemento */
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
}

.tooltip-container:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* ESTILOS BENEFICIOS */
.text-primary-beneficios {
    color: #0257b1 !important;
}

.bg-primary-beneficios {
    background-color: #0257b1 !important;
}

.border-primary-beneficios {
    border-width: 1px;
    border-color: #0257b1 !important;
}

.check-lg {
    width: 25px;
    height: 25px;
}

.p-1_5 {
    padding: 0.38rem !important;
}


/*
    *********************************
    Estilos necesarios para las gradientes y border en las secciones
    de beneficios, se pueden reutilizar en otros sitios
    *********************************
 */

.border_req_Black {
    /* border-color: rgb(176, 118, 21) !important; */
    border-color: rgb(0, 0, 0) !important;
}

.border_req_Gold {
    border-color: rgb(255, 194, 0) !important;
    /* border-color: rgb(176, 118, 21) !important; */
}

.border_req_Silver {
    border-color: rgb(184, 184, 184) !important;
    /* border-color: rgb(176, 118, 21) !important; */
}

.border_req_Blue {
    border-color: rgb(0, 149, 255) !important;
    /* border-color: rgb(176, 118, 21) !important; */
}

.gradiente_req_Black {
    /* background: rgb(176, 118, 21);
    background: linear-gradient(90deg, rgba(176, 118, 21, 1) 10%, rgba(255, 255, 255, 1) 25%, rgba(176, 118, 21, 1) 50%, rgba(255, 255, 255, 1) 75%, rgba(176, 118, 21, 1) 90%); */
    background: rgb(0, 0, 0);
    background: linear-gradient(90deg, rgba(0, 0, 0, 1) 10%, rgba(255, 255, 255, 1) 25%, rgba(0, 0, 0, 1) 50%, rgba(255, 255, 255, 1) 75%, rgba(0, 0, 0, 1) 90%);
}

.gradiente_req_Gold {
    /* background: rgb(176, 118, 21);
    background: linear-gradient(90deg, rgba(176, 118, 21, 1) 10%, rgba(255, 255, 255, 1) 25%, rgba(176, 118, 21, 1) 50%, rgba(255, 255, 255, 1) 75%, rgba(176, 118, 21, 1) 90%); */
    background: rgb(255, 194, 0);
    background: linear-gradient(90deg, rgba(255, 194, 0, 1) 10%, rgba(255, 255, 255, 1) 25%, rgba(255, 194, 0, 1) 50%, rgba(255, 255, 255, 1) 75%, rgba(255, 194, 0, 1) 90%);
}

.gradiente_req_Silver {
    background: rgb(184, 184, 184);
    background: linear-gradient(90deg, rgba(184, 184, 184, 1) 10%, rgba(255, 255, 255, 1) 25%, rgba(184, 184, 184, 1) 50%, rgba(255, 255, 255, 1) 75%, rgba(184, 184, 184, 1) 90%);
}

.gradiente_req_Blue {
    background: rgb(0, 149, 255);
    background: linear-gradient(90deg, rgba(0, 149, 255, 1) 10%, rgba(255, 255, 255, 1) 25%, rgba(0, 149, 255, 1) 50%, rgba(255, 255, 255, 1) 75%, rgba(0, 149, 255, 1) 90%);
}

.border-dashed {
    /* border-color: white!important; */
    border-width: 4px;
    border-style: dashed !important;
}

/* Aplica separadores solo a los elementos que no sean el último */
.item:not(:last-child) {
    border-right: 3px solid;
    /* Línea separadora */
    padding-right: 15px;
    /* Espaciado a la derecha */
}

/* Espaciado adicional para evitar que las líneas queden pegadas */
.item:not(:first-child) {
    padding-left: 15px;
}


.bg-grad-Black {
    background: rgb(40, 40, 40);
    background: linear-gradient(180deg, rgba(40, 40, 40, 1) 0%, rgba(62, 62, 62, 1) 29%, rgba(84, 84, 84, 1) 75%, rgba(128, 128, 128, 1) 100%);
}

.bg-grad-Gold {
    background: rgb(255, 211, 0);
    background: linear-gradient(180deg, rgba(255, 211, 0, 1) 0%, rgba(255, 211, 0, 1) 29%, rgba(255, 211, 0, 1) 70%, rgba(45, 45, 45, 1) 100%);
}

.bg-grad-Silver {
    background: rgb(138, 138, 138);
    background: linear-gradient(180deg, rgba(138, 138, 138, 1) 0%, rgba(152, 152, 152, 1) 29%, rgba(159, 159, 159, 1) 70%, rgba(255, 194, 0, 1) 100%);
}

.bg-grad-Blue {
    background: rgb(91, 174, 216);
    background: linear-gradient(180deg, rgba(91, 174, 216, 1) 0%, rgba(91, 174, 216, 1) 29%, rgba(91, 174, 216, 1) 70%, rgba(184, 184, 184, 0.7) 100%);
}