/* Fuentes */
@import url('https://fonts.googleapis.com/css2?family=Poppins: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&display=swap');

/* Iconos Bootstrap */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

:root{
    --verde: #00A685;
    --verde-oscuro: #0d8970;
    --verde-claro: #EFF9F8;
    --naranjo: #FF613F;
    --naranjo-claro: #FFF6F3;
    --gris: #a6a6a6;
    --celeste: #39C2D2;
    --celeste-claro: #F3FBFC;
    --morado: #8535EB;
    --morado-claro: #F6F3FC;
    --azul: #348AEF;
    --azul-claro: #F3F5FC;
}

body{
    font-family: "Poppins", sans-serif;
    color: #2c2c2c;
}
h1,h2,h3,h4,h5,h6,b,strong{
    font-weight: 700;
    color: #444;
}
p,li{
    font-weight: 300;
}

#navbar{
    transition: all .3s ease-in-out;
}
#navbar.navbar-shrink{
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}

.btn{
    border-radius: 15px;
}

#navbar .links-accesos .btn-ingresar{
    padding: .6em .8em;
    box-shadow: 0 0 8px rgba(0, 0, 0, .1);
}
#navbar .links-accesos .btn-universidad{
    padding: .6em .8em; 
    box-shadow: 0 0 8px rgba(0, 0, 0, .1);
}

#clientes.owl-carousel .owl-item img{
	aspect-ratio: 1.7;
	object-fit: contain;
	opacity: .8;
	filter: grayscale(100%);
	transition: all .2s ease-in-out;
} 
#clientes.owl-carousel .owl-item:hover img{
	opacity: 1;
	filter: none;
} 
#clientes .owl-stage{
	transition-timing-function: linear !important;
}

footer{
    background-color: #222;

}
.btn-apps{
    background-color: rgba(255, 255, 255, 0.3);
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: .9rem 1rem;
    border-radius: 15px;
    color: #fff;
    text-align: left;
}
.btn-apps i{
    font-size: 27px;
    line-height: 27px;
}
.btn-apps span{
    font-size: 18px;
    line-height: 18px;
    font-weight: 600;
}
.btn-apps span small{
    font-size: 11px;
    line-height: 11px;
    display: block;
    margin-bottom: .2rem;
    font-weight: 400;
}
.btn-apps:is(:hover,:focus,:active){
    border-color: #fff;
    background-color: transparent;
    color: #fff;
}


.btn-color{
    background-color: #EF7F37;
    color: #fff;
    border-radius: 15px;
    padding: .9rem 1.2rem;
    box-shadow: 0 3px 16px rgba(0, 0, 0, .1);
}
.btn-color:is(:hover,:focus,:active){
    background-color: var(--verde-oscuro);
    color: #fff;
}
.btn-outline-color{
    color: var(--verde);
    border-color: var(--verde);
    border-radius: 15px;
    padding: .7rem 1.2rem;
}
.btn-outline-color:is(:hover,:focus,:active){
    background-color: var(--verde);
    color: #fff;
}

.btn-outline-gris{
    border-color: var(--gris);
    color: var(--gris);
    border-radius: 15px;
    padding: .9rem 1.2rem;
}
.btn-outline-gris:is(:hover,:focus,:active){
    background-color: var(--gris);
    color: #fff;
}

.btn-blanco{
    background-color: #EF7F37;
    color: white;
    border-radius: 15px;
    padding: .9rem 1.2rem;
    box-shadow: 0 3px 16px rgba(0, 0, 0, .1);
}
.btn-blanco:is(:hover,:focus,:active){
    background-color: transparent;
    border: 1px solid #fff;
    color: #fff;
}
.titulo{
    color: #444;
}
.top-titulo{
    font-size: .9rem;
    color: var(--verde);
    letter-spacing: 1px;
    font-weight: 400;
    text-transform: uppercase;
}
.linea-color{
    height: 3px;
    width: 86px;
    background-color: var(--verde);
    border-radius: 5px;
}
.text-color{
    color: var(--verde);
}
.text-14{
    font-size: 14px;
}
.bg-claro{
    background-color: #f6f6f6;
}
.bg-verde-claro{
    background-color: var(--verde-claro);
}
.bg-celeste-claro{
    background-color: var(--celeste-claro);
}

/* Inicio */
.carousel-inner{
    background-image: url('../images/blob.svg');
    /* background-position: bottom right; */
    background-repeat: no-repeat;
    /* background-size: contain; */
}
.blob-slide{
    position: absolute;
    top: 0;
    right: 0;
}
.carousel-item{
    min-height: 100;    
}
.carousel-item > div {
    display: flex!important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
}
.carousel-indicators button{
    background-color: #b0b0b0!important;
}
.carousel-indicators button.active{
    background-color: var(--verde)!important;
}
.titulo-slide{
    line-height: 1.3;
    font-weight: 700;
    color: #444;
}
.bg-gradient-claro{
    background: linear-gradient(to bottom, #fff 0%, #EFF9F8 60%, #fff 100%);
}

.nav-pills .nav-link{
    color: #999;
    padding-bottom:.7rem;
    border-radius: 0;
    padding-right: .5rem;
    padding-left: .5rem;
    margin: 0 .5rem;
    border-bottom: 3px solid transparent;
}
.nav-pills .nav-link.active{
    color: #666;
    background-color: transparent;
    border-bottom-color: var(--verde);
}
/* Se elimina este estilo */
/* .cont-img{
    border-radius: 20px;
    border:1px solid var(--verde);
    box-shadow: 0 0 10px rgba(0, 0, 0, .15);
    overflow: hidden;
} */
.list-beneficios .cont-icon{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.list-beneficios .cont-icon::after{
    content: '';
    display: block;
    margin-top: .5rem;
    height: 50%;
    width: 1px;
    background-color: var(--gris);
}
.list-beneficios .icono{
    width: 37px;
    height: 37px;
    border-radius: 50%;
    background-color: var(--verde);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.list-beneficios .icono i{
    color: #fff;
    font-size: 22px;
    line-height: 22px;
}

.fondo-verde{
    /* background-color: var(--verde); */
    background: 
        url('../images/fondo-demo.png') center no-repeat,
        linear-gradient(to bottom, #0EC1A1, #01A793);
    background-size: cover;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
/*	width: 80%;*/
	border-radius: 0 35px 35px 0;
    background-blend-mode: multiply;
}

.cont-video {
    background-color: #000;
    border-radius: 25px;
    overflow: hidden;
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
}

.cont-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 25px;
}

.blog-body-text {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.post-body-container {
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    word-wrap: break-word;
    padding: 1rem;
}

.post-body-container img {
    max-width: 100%;
    height: auto;
}

.post-body-container table {
    width: 100%; 
    border-collapse: collapse;
    overflow-x: auto;
}

/* Tarjeta con bordes redondeados y contenido dentro limitado */
.blog-card {
    border-radius: 20px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%; /* Asegura que la tarjeta ocupe toda la altura disponible */
}

/* Título de la tarjeta */
.blog-card .blog-card-title {
    font-size: 18px;
    margin-bottom: 1rem;
}

/* Párrafo dentro de la tarjeta */
.blog-card p {
    font-size: 14px;
    margin-bottom: 0;
    color: #666;
}

/* Estilo de la fecha de la tarjeta */
.blog-card .blog-date {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    line-height: 16px;
}

.blog-card .blog-date i {
    font-size: 29px;
    line-height: 29px;
    color: #A1A4AC;
}

.blog-card .blog-date p {
    color: #A1A4AC;
}

.blog-card .blog-date p small {
    font-size: 12px;
}

/* Estilo para las imágenes, asegurando que tengan el mismo tamaño */
.blog-card img {
    height: 200px; /* Ajusta la altura de las imágenes para que todas tengan el mismo tamaño */
    object-fit: cover; /* Asegura que la imagen no se deforme y ocupe todo el espacio */
}

/* Limitar el texto a 5 líneas, usando -webkit-line-clamp */
.blog-card-body {
    display: -webkit-box;
    -webkit-line-clamp: 5; /* Limita el contenido a 5 líneas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis; /* Añade los "..." al final del texto largo */
}

/* Asegura que el botón de "Leer más" esté al final de la tarjeta */
.card-footer .btn {
    display: block;
    text-align: right;
    margin-top: auto;
}


/* .blog-card{
    border-radius: 20px;
    overflow: hidden;
}
.blog-card .blog-card-title{
    font-size: 18px;
    margin-bottom: 1rem;
}
.blog-card p{
    font-size: 14px;
    margin-bottom: 0;
    color: #666;
}
.blog-card .blog-date{
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    line-height: 16px;
}
.blog-card .blog-date i{
    font-size: 29px;
    line-height: 29px;
    color: #A1A4AC;
}
.blog-card .blog-date p{
    color: #A1A4AC;
}
.blog-card .blog-date p small{
    font-size: 12px;
} */
.pagination{
    justify-content: center;
}
.pagination .page-item .page-link{
    border: none;
    border-radius: 8px;
    margin: 0 1px;
    color: var(--verde);
}
.pagination .page-item.active .page-link{
    background-color: var(--verde);
    color: #fff;
}

#testimonios.owl-carousel .owl-nav{
    text-align: center;
}
#testimonios.owl-carousel .owl-nav button{
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #E6E8E0;
    color: var(--verde);
    margin: .2rem;
}
#testimonios.owl-carousel .owl-nav button:is(:hover,:focus,:active){
    background-color: var(--verde);
    color: #fff;
}
.review{
    border-radius: 25px;
    box-shadow: 0 3px 16px rgba(0, 0, 0, .1);
}
.review p{
    font-size: 14px;
    margin-bottom: 0;
}
.review-header{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 1rem;
}
.review-header img{
    width: 73px!important;
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
}
.review-header .review-autor{
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: .2rem;
    color: #666;
}
.review-header .review-cargo{
    font-size: 13px;
    color: #888;
}

/* ESTILOS SELECT2 */
.form-floating .select2 .selection .select2-selection.select2-selection--single{
    height: calc(3.5rem + calc(1px * 2));
    min-height: calc(3.5rem + calc(1px * 2));
    line-height: 1.25;
    padding: 1.625rem 2.25rem .625rem .75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}
.form-floating .select2 .selection .select2-selection.select2-selection--single .select2-selection__rendered{
    padding: 0;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 100%;
    width: 35px;
}
.select2-container--default .select2-search--dropdown .select2-search__field{
    border: 1px solid #e6e1e1;
    padding: 4px;
    border-radius: 3px;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus{
    outline: none;
    box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}
.select2-container--open .select2-dropdown--below{
    border: 1px solid rgba(0, 0, 0, 0.175);
    border-radius: 4px;
}
.select2-search--dropdown{
    padding: 8px;
}
.select2-results__option{
    padding: 6px 1rem;
}
/* FIN ESTILOS SELECT2 */


/* Caracteristicas */
.banner-seccion{
    height: 410px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}
.banner-seccion.noticias{
    height: 615px;
    padding-bottom: 10rem!important;
}
.banner-seccion img{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.nav-caracteristicas{
    justify-content: space-evenly;
}
.nav-caracteristicas a{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #888888;
    text-decoration: none;
    transition: all .3s ease-in-out;
}
.nav-caracteristicas a.active,
.nav-caracteristicas a:is(:hover,:focus,:active){
    color: var(--verde);
}
.nav-caracteristicas a span{
    width: 90px;
    height: 90px;
    border-radius: 20px;
    background-color: #F6F9FE;
    color: #CDCED1;
    font-size: 2.5rem;
    margin-bottom: .5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all .3s ease-in-out;
}
.nav-caracteristicas a.active span,
.nav-caracteristicas a:is(:hover,:focus,:active) span{
    background-color: var(--verde);
    color: #fff;
}

.modulo{
    border-radius: 35px;
}
.modulo .nav-pills .nav-link{
    font-weight: 600;
    color: #666;
    margin: 0 1.5rem;
}
.modulo.verde{
    background-color: var(--verde-claro);
}

.modulo.celeste{
    background-color: var(--celeste-claro);
}
.modulo.celeste .top-titulo{
    color: var(--celeste);
}
.modulo.celeste .linea-color{
    background-color: var(--celeste);
}
.modulo.celeste .cont-img{
    border-color: var(--celeste);
}
.modulo.celeste .nav-pills .nav-link.active{
    border-bottom-color: var(--celeste)
}

.modulo.morado{
    background-color: var(--morado-claro);
}
.modulo.morado .top-titulo{
    color: var(--morado);
}
.modulo.morado .linea-color{
    background-color: var(--morado);
}
.modulo.morado .cont-img{
    border-color: var(--morado);
}
.modulo.morado .nav-pills .nav-link.active{
    border-bottom-color: var(--morado)
}

.modulo.naranjo{
    background-color: var(--naranjo-claro);
}
.modulo.naranjo .top-titulo{
    color: var(--naranjo);
}
.modulo.naranjo .linea-color{
    background-color: var(--naranjo);
}
.modulo.naranjo .cont-img{
    border-color: var(--naranjo);
}
.modulo.naranjo .nav-pills .nav-link.active{
    border-bottom-color: var(--naranjo)
}

.modulo.azul{
    background-color: var(--azul-claro);
}
.modulo.azul .top-titulo{
    color: var(--azul);
}
.modulo.azul .linea-color{
    background-color: var(--azul);
}
.modulo.azul .cont-img{
    border-color: var(--azul);
}
.modulo.azul .nav-pills .nav-link.active{
    border-bottom-color: var(--azul)
}

/* Soluciones */
.soluciones-icono{
    height: 130px;
    width: 130px;
    border-radius: 50%;
    background-color: #EFF9F8;
    margin:0 auto 1rem;
}
.soluciones-icono.azul{
    background-color: #E5F6F8;
}
.fondo-verde-claro{
    background-color: var(--verde-claro);
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	border-radius: 35px 0 0 35px;
}
.mas-soluciones{
    background: 
        url('../images/fondo-demo.png') center no-repeat,
        linear-gradient(to bottom, #04584A 10%, #00463D 100%);
    background-size: cover;
    border-radius: 35px;
}

/* Blog */
.buscador{
    background-color: #fff;
    border-radius: 25px;
    padding: 3px;
    overflow: hidden;
}
.buscador .form-control{
    border-radius: 20px 0 0 20px;
    border: none;
}
.buscador .btn-color{
    border-radius: 20px!important;
    padding: .5rem 1.2rem;
}
.blog-card.destacada{
    margin-top: -10rem;
}
.img-ppal-noticia{
    border-radius: 20px;
    margin-top: -15rem;
    margin-bottom: 2rem;
}

/* Contacto */
.cont-contacto{
    border-radius: 20px;
    background-color: #fff;
    margin-top: -17rem;
    overflow: hidden;
}
.cont-contacto .bg-color-contacto{
    background: url('../images/fondo-contacto.png') center no-repeat,
    linear-gradient(to bottom, #0EC1A1, #01A793);
    background-size: cover;
}
.info-contacto{
    display: inline-flex;
    flex-wrap: wrap;
    width: 100%;
}
.icono-contacto{
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background-color: rgba(237, 237, 237, 0.3);
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}
textarea[name="mensaje"]{
    min-height: 200px!important;
    max-height: 200px!important;
}

/* Acceso universidad */
.card-universidad{
    border-radius: 20px;
    box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1);
    position: relative;
}
.img-fluid-slide{
    width: 80% !important;
}

@media screen and (min-width: 0px){
    #navbar .navbar-brand img{
        width: 220px;
        transition: all .3s ease-in-out;
    }
    #navbar.navbar-shrink .navbar-brand img{
        width: 200px;
    }
    #navbar .nav-item .nav-link {
        padding: 8px 0;
    }
    #navbar .links-accesos .btn-ingresar,
    #navbar .links-accesos.inverse .btn-ingresar {
        background-color: var(--verde);
        color: #fff;
    }
    #navbar .links-accesos .btn-ingresar:is(:hover,:focus,:active),
    #navbar .links-accesos.inverse .btn-ingresar:is(:hover,:focus,:active){
        background-color: var(--verde-oscuro);
        color: #fff;
    }
    #navbar .links-accesos .btn-universidad,
    #navbar .links-accesos.inverse .btn-universidad {
        color: var(--verde);
        border: 1px solid var(--verde)
    }
    #navbar .links-accesos .btn-universidad:is(:hover,:focus,:active),
    #navbar .links-accesos.inverse .btn-universidad:is(:hover,:focus,:active){
        color: #fff;
        background-color: var(--verde-oscuro);
    }

    #navbar[data-bs-theme] .offcanvas{
        background-color: #fff;
    }
    #navbar[data-bs-theme] .offcanvas .btn-close{
        --bs-btn-close-white-filter: none;
    }
    #navbar[data-bs-theme] .offcanvas .nav-link{
        color: rgba(0, 0, 0, 0.65);
    }
    #navbar[data-bs-theme] .offcanvas .nav-link.active{
        color: #000;
    }

    .carousel-inner{
        /* background: none; */
        background-position: top right;
        background-size: 30%;
    }
    .titulo-slide{
        font-size: 2em;
    }
    .fondo-verde,
    .fondo-verde-claro{
        width: 100%;
        height: 75%;
    }
    .fondo-verde-claro{
        bottom:0;
        top: inherit
    }
    .titulo{
        font-size: 1.8rem;
    }
    .mas-soluciones{
        padding: 3.5rem 2rem;
    }
    .blog-card.destacada .blog-card-title{
        font-size: 1.5rem;
    }
}
@media screen and (min-width: 767.99px) and (max-width: 991.99px){
    .fondo-verde,
    .fondo-verde-claro{
        width: 98%;
        height: 75%;
    }
    .titulo{
        font-size: 2rem;
    }
    .mas-soluciones{
        padding: 4rem 3rem;
    }
    .blog-card.destacada .blog-card-title{
        font-size: 1.5rem;
    }
    .blog-card.destacada img{
        height: 100%;
        object-fit: cover;
    }
}
@media screen and (min-width: 992px){
    #navbar .navbar-brand img{
        width: 250px;
    }
    #navbar.navbar-shrink .navbar-brand img{
        width: 220px;
    }
    #navbar .nav-item .nav-link {
        padding: 8px 1rem;
    }
    .carousel-inner{
        background-position: bottom right;
        background-size: contain;
    }
    .titulo-slide{
        font-size: 2.75em;
    }
    .titulo{
        font-size: 2.3rem;
    }
    .fondo-verde,
    .fondo-verde-claro{
    	width: 65%;
        height: 100%;
    }
    .mas-soluciones{
        padding: 4.5rem 6rem;
    }
    .blog-card.destacada .blog-card-title{
        font-size: 1.9rem;
    }
}
@media screen and (min-width: 992.99px) and (max-width: 1199.99px) {
    
}
.alert.fixed-top {
    width: 100%;
    left: 0;
    right: 0;
    margin: 0;
    border: none;
    padding-left: 0;
    padding-right: 0;
}
@media screen and (min-width: 1200px) {
    #navbar .links-accesos .btn-ingresar{
        background-color: #fff;
        color: var(--verde);
    }
    #navbar .links-accesos .btn-ingresar:is(:hover,:focus,:active){
        background-color: transparent;
        color: #fff;
        border-color: #fff;
    }
    #navbar .links-accesos .btn-universidad{
        background-color: rgba(237, 237, 237, 0.3);
        color: #fff;
    }
    #navbar .links-accesos .btn-universidad:is(:hover,:focus,:active){
        background-color: var(--verde-oscuro);
        color: #fff;
    }
    
    #navbar.navbar-shrink .links-accesos .btn-ingresar{
        background-color: var(--verde);
        color: #fff;
    }
    #navbar.navbar-shrink .links-accesos .btn-ingresar:is(:hover,:focus,:active){
        background-color: var(--verde-oscuro);
        color: #fff;
    }
    #navbar.navbar-shrink .links-accesos .btn-universidad{
        color: var(--verde);
        border: 1px solid var(--verde)
    }
    #navbar.navbar-shrink .links-accesos .btn-universidad:is(:hover,:focus,:active){
        color: #fff;
    }

    #navbar[data-bs-theme] .offcanvas .nav-link{
        color: rgba(265, 265, 265, 0.65);
    }
    #navbar[data-bs-theme] .offcanvas .nav-link.active{
        color: #fff;
    }
    #navbar[data-bs-theme].navbar-shrink .offcanvas .nav-link{
        color: rgba(0, 0, 0, 0.65);
    }
    #navbar[data-bs-theme].navbar-shrink .offcanvas .nav-link.active{
        color: #000;
    }
}
