@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
@font-face {
	font-family: 'Versos';
	src: url('font/versos-variable.woff2') format('woff2-variations');
	/*
             * RANGOS OBTENIDOS DEL INSPECTOR (fondue/imagen)
             *
             * 1. Eje de Peso (wght): va de 100 a 900.
             *    - Se controla con la propiedad est�ndar 'font-weight'.
            */
	font-weight: 100 900;
	/*
             * 2. Eje It�lico (ital): va de 0 (Regular) a 1 (It�lico).
             *    - Se controla con la propiedad est�ndar 'font-style'.
            */
	font-style: italic 0deg 1deg; /* 0 y 1 se mapean a 0deg y 1deg */
}
:root {
	--bs-primary: #3A38F4;
	--bs-secondary: #ED7066;
	--bs-warning: #F5D659;
	--bs-primary-rgb: 58, 56, 244;
	--bs-secondary-rgb: 237, 112, 102;
	--bs-warning-rgb: 245, 214, 89;
	--bs-dark-blue: #0A2666;
	--bs-dark-blue-rgb: 10, 38, 102;
	--bs-light-gray: #EDF0F0;
	--bs-light-gray-rgb: 237, 240, 240;
}
* {
	box-sizing: border-box
}
body {
	margin: 0;
	padding: 0;
	background-color: #f3f7ff;
	font-family: Versos, Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-kerning: normal;
	padding-top: 112px;
}
body.modal-open {
  overflow: auto !important; /* Mantiene el scroll visible */
  padding-right: 0 !important; /* Fuerza a que no haya padding */
}
header,
main,
footer,
.banner {
	max-width: 1280px;
	margin: 0 auto
}
header,
main {
	background-color: #ffffff;
}
header {
    position: fixed;
    z-index: 100;
    top: 0;
    left: 0;
    width: 100%;
    right: 0;
}
h1,h2,h3,h4,h5,h6{
	font-weight: 700;
}
h1{
	color: var(--bs-dark-blue);
	font-size: 4.5rem;
	line-height: 100%;
	letter-spacing: -2px;
}
h2 {
	font-size: 3rem;
	color: var(--bs-dark-blue);
}
h2 span {
	color: var(--bs-primary);
}
section{
	scroll-margin-top: 112px;
}
.rubik{
	font-family: Rubik, Arial, Helvetica, sans-serif;
}
.wrapper980 {
	max-width: 1060px;
	margin: 0 auto;
	padding-left:40px;
	padding-right: 40px;
}
.wrapper1152 {
	max-width: 1232px;
	margin: 0 auto;
	padding-left:40px;
	padding-right: 40px;
}
@media (max-width:590px) {
.wrapper980 {
	padding-left:20px;
	padding-right: 20px;
}
.wrapper1152 {
	padding-left:20px;
	padding-right: 20px;
}
}
.grilla {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.grilla3Col {
	gap: 40px
}
.grilla3Col .grillaItem {
	width: calc((100% - 80px) / 3);
}
.grilla4Col {
	gap: 25px
}
.grilla4Col .grillaItem {
	width: calc((100% - 75px) / 4);
}
.grilla3Col.grilla15gap {
	gap: 15px
}
.grilla3Col.grilla15gap .grillaItem {
	width: calc((100% - 30px) / 3)
}
.wrapper680 {
	width: 680px;
	max-width: 100%;
	margin: 0 auto;
}
/*HEADER*/
/* --- ESTILOS PARA NAVBAR PERSONALIZADO --- */

/* Estilo del boton hamburguesa */
header{
	/*position: relative;*/
	
}
header::after {
    position: absolute;
    top: 100%;
    content: "";
    height: 10px;
    width: 100%;
    background-image: linear-gradient(180deg, rgba(0,0,0,0.2), rgba(0,0,0,0));
}
.custom-toggler {
  border: none;
  width: 48px;
  height: 48px;
  border-radius: 50%; /* Lo hace circular */
  background-color: var(--bs-dark-blue); /* Usa tu variable de color */
  padding: 0;
}

.custom-toggler:focus {
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-dark-blue-rgb), 0.5); /* Sombra al hacer clic */
}

/* Cambia el color de las 3 lineas del icono a blanco */
.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Ajustes de espaciado y fuente para los links */
.navbar-nav .nav-link {
    font-weight: 600;
    color: var(--bs-dark-blue);
    margin: 0 0.5rem; /* Espacio entre links */
}

.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active {
    color: var(--bs-primary); /* Color al pasar el mouse */
}
.logoHeader{
	height: 38px;
	width: auto;
	display: block
}
.dropdown-toggle::after {
	display: none;
}
.dropdown-menu.show {
    display: block;
    display: none;
}
@media (max-width:590px) {
.banner{
	background-size: 50% !important;
}
.banner > div {
    padding-right: 200px !important;
}
}
@media (max-width:460px) {
.banner{
	background-image: none !important;
}
.banner > div {
    padding-right: 0px !important;
}
}
/*HEADER*/

/*BANNER*/
.banner{
	background-image: url(../images/bg_banner.png);
	background-size: auto min(100%, 544px);
	background-position: right bottom;
	background-repeat: no-repeat;
}
.banner > div{
	padding-right: 340px;
}
.banner > div p{
	font-size:1.5em ;
	line-height: 120%;
}
.banner > div .info {
	width: 160px;
	border-radius: 10px;
	text-align: center; 
}
@media (max-width: 930px) {
	h1{
    font-size: 3rem !important;
}
.banner > div p{
	font-size:1.8em ;
}
}
@media (max-width: 800px) {
h1{
    font-size: 2.5rem !important;
}
.banner > div p{
	font-size:1.2em ;
}
}
/*BANNER*/

/*Slider*/
.carousel-logos .carousel-item img {
	max-width: 180px; /* Ancho maximo del logo */
	height: 60px; /* Altura fija para alinear todos */
	object-fit: contain; /* Asegura que el logo no se deforme */
	margin: 0 1rem; /* Espacio entre logos */
	filter: grayscale(100%); /* Efecto profesional en blanco y negro */
	opacity: 0.7;
	transition: all 0.3s ease;
}
.carousel-logos .carousel-item img:hover {
	filter: grayscale(0%);
	opacity: 1;
}
.carousel-control-next {
	left: 100%;
	right: unset;
}
.carousel-control-prev {
	right: 100%;
	left: unset;
}
/*Slider*/


/*secciones*/
.textUnoSeccion {
	color: #FFFFFF;
	font-size: 20px
}
.card-body img{
	height: 50px;
}
@media (max-width: 768px) {
#homeDescripcion .grilla3Col .grillaItem{
    width: 100%;
}
#homeDescripcion .grilla3Col{
	gap: 10px;
}
}
/*Calugas blancas texto azul*/
.card {
	border: 0 none
}
.calugasCard i,
.calugasCard p {
	color: var(--bs-primary) !important;
	font-size: 22px;
	font-weight: 700;
	line-height: 30px;
}
.calugasCard i {
	font-size: 40px;
}
@media (max-width: 768px) {
#homeConceptos .grilla3Col .grillaItem {
    width: 40%;
}
}
@media (max-width: 580px) {
#homeConceptos .grilla3Col .grillaItem {
    width: 100%;
}
}
/*PLANES*/
/* Estilo general para las tarjetas de precios */
.pricing-card {
	border: 1px solid #e0e0e0;
	border-radius: 20px; /* Bordes bien redondeados */
	box-shadow: 7px 6px 10px 0px rgba(66, 68, 90, 0.1);
	transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	overflow: hidden
}
.pricing-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}
/* Estilo para los titulos de los planes */
.pricing-title {
	font-size: 1.2rem;
	font-weight: bold;
	color: var(--bs-dark-blue);
	margin-bottom: 1rem;
	padding-top: 1.5rem;
	text-align: center;
}
/* Estilo para el texto descriptivo */
.pricing-text {
	color: var(--bs-dark-blue); /* Gris azulado */
	font-size: 16px;
	line-height: 18px;
	min-height: 120px; /* Altura minima para alinear botones en la mayoria de los casos */
}
/* Estilo para el boton */
.pricing-button {
	background-color: var(--bs-primary); /* Azul/morado del boton */
	color: #ffffff;
	border: none;
	border-radius: 50px; /* Para que sea un pildora */
	padding: 0.25rem;
	transition: background-color 0.2s ease;
	font-size: 14px
}
.pricing-button:hover {
	background-color: #1A14F3; /* Un poco mas oscuro al pasar el cursor */
	color: #ffffff;
}
/* Etiqueta "NUEVO" */
.plan-badge {
	position: absolute;
	top: 10px;
	right: 0px;
	background-color: var(--bs-secondary);
	color: white;
	padding: 2px 8px 2px 16px;
	font-size: 0.8rem;
	font-weight: bold;
}
/* Triangulo para la etiqueta "NUEVO" */
.plan-badge::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 73%;
	margin-top: -10px;
	border-width: 10px;
	border-style: solid;
	border-color: transparent transparent transparent white;
}
/* --- RESPONSIVIDAD --- */
/* Para tablets (2 columnas) */
@media (max-width: 992px) {
	.grilla4Col .grillaItem {
		width: calc((100% - 25px) / 2);
	}
	.pricing-text {
		min-height: auto; /* Quitamos la altura minima en tablets y moviles */
	}
}
/* Para moviles (1 columna) */
@media (max-width: 768px) {
#homePlane	.grilla4Col {
		gap: 20px;
	}
#homePlane	.grilla4Col .grillaItem {
		width: 40%;
	}
}
@media (max-width: 580px) {
#homePlanes .grilla4Col .grillaItem {
    width: 100%;
}
}
/*Calugas colores*/
.calugaColor {
	color: #ffffff;
	text-align: center;
	font-size: 1.5em;
	border-radius: 10px;
	line-height: 1.2em
}
@media (max-width: 768px) {
#homeRazones .grilla3Col .grillaItem {
    width: 40%;
}
}
@media (max-width: 580px) {
#homeRazones .grilla3Col .grillaItem {
    width: 100%;
}
}

/*secciones*/
/*TESTIMONIOS*/
/* Estilo para la tarjeta de testimonio (version 2) */
.testimonial-card-v2 {
	background-color: #ffffff;
	border: 1px solid #e9ecef; /* Borde muy sutil */
	border-radius: 25px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
	padding: 2rem 1.5rem;
	text-align: center;
}
/* Imagen de perfil (version 2) */
.testimonial-img-v2 {
	width: 110px;
	height: 110px;
	border-radius: 50%;
	/* Centrado y con margen inferior */
	margin: 0 auto 1rem auto;
}
/* Texto del testimonio */
.testimonial-text {
	font-size: 1em;
	color: var(--bs-dark-blue); /* Gris mas suave */
	margin-bottom: 1rem;
	text-align: left;
	line-height: 1.2em
}
/* Contenedor para estrellas y link "leer mas" */
.testimonial-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1rem; /* Mas espacio antes del nombre */
	padding: 5px;
}
.testimonial-stars {
	color: #ffc107; /* Amarillo de Bootstrap */
}
.testimonial-readmore {
	font-size: 0.8rem;
	font-weight: bold;
	color: var(--bs-dark-blue);
	text-decoration: none;
	background-color: var(--bs-light-gray);
	padding: 5px
}
.testimonial-readmore:hover {
	color: #212529;
}
/* Info del autor del testimonio */
.testimonial-author {
	margin-top: 1rem;
	min-height: 80px;
}
.testimonial-name {
	font-weight: bold;
	color: var(--bs-dark-blue); 
	margin-bottom: 0.25rem;
	text-align: left
}
.testimonial-role {
	font-size: 0.85rem;
	color: var(--bs-dark-blue);
	margin-bottom: 0;
	text-align: left;
	line-height: 100%;
}
.testimonial-empresa{
	font-size: .7rem;
	color: var(--bs-dark-blue);
	text-align: left;
	font-weight: bold;
	margin-top: 5px;
}
#carouselTestimonios.owl-carousel .owl-item img {
    display: block;
    width: 110px;
}
.textCliente{
	 width: 100%;
   display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 7;
  overflow: hidden;
  /* Opcional: añade una transición suave */
  transition: all 1s ease-in-out;
}
#homeClientes .item {
	margin-bottom: 15px;
}
.contCarrousel{
	position: relative;
}
#carouselTestimonios.owl-carousel .owl-nav button.owl-next,
#carouselTestimonios.owl-carousel .owl-nav button.owl-prev{
    position: absolute;
    top: 50%;
    font-size: 50px;
}
#carouselTestimonios.owl-carousel .owl-nav button.owl-next{ right:-5%;}
#carouselTestimonios.owl-carousel .owl-nav button.owl-prev{ left:-5%;}

#carouselTestimonios.owl-carousel .owl-nav span,
#carouselTestimonios.owl-carousel .owl-nav span{
	font-size: 0;
}
#carouselTestimonios.owl-carousel .owl-nav button.owl-prev {
	width: 48px;
    height: 48px;
    left: unset;
    right: 100%;
    top: 50%;
	transform: translateY(-50%);
	background-image: url(../images/fle_iz.svg);
	background-repeat: no-repeat;
	background-size: contain;
	filter: invert(28%) sepia(98%) saturate(3333%) hue-rotate(238deg) brightness(98%) contrast(96%);
}
#carouselTestimonios.owl-carousel .owl-nav button.owl-next {
	width: 48px;
    height: 48px;
    right: unset;
    left: 100%;
    top:50%;
	transform: translateY(-50%);
	background-image: url(../images/fle_der.svg);
	background-repeat: no-repeat;
	background-size: contain;
	filter: invert(28%) sepia(98%) saturate(3333%) hue-rotate(238deg) brightness(98%) contrast(96%);
}
#carouselTestimonios.owl-carousel .owl-nav button.owl-prev:hover,
#carouselTestimonios.owl-carousel .owl-nav button.owl-next:hover { 
	filter: invert(61%) sepia(21%) saturate(1313%) hue-rotate(317deg) brightness(96%) contrast(91%); 
	background-color: transparent;
}
/*TESTIMONIOS*/

/*CLIENTES*/
#carruselLogos.no-js .owl-carousel, .owl-carousel.owl-loaded {
	position: relative;
}
/*#carruselLogos.owl-carousel .owl-item img {
    display: block;
    width: 100%;
}*/
#carruselLogos.owl-carousel .owl-nav button.owl-next,
#carruselLogos.owl-carousel .owl-nav button.owl-prev{
    position: absolute;
    top: 50%;
    font-size:26px;
}
#carruselLogos.owl-carousel .owl-nav button.owl-next{ right:-5%;}
#carruselLogos.owl-carousel .owl-nav button.owl-prev{ left:-5%;}

#carruselLogos.owl-carousel .owl-nav span,
#carruselLogos.owl-carousel .owl-nav span{
	font-size: 0;
}
#carruselLogos.owl-carousel .owl-nav button.owl-prev {
	width: 48px;
    height: 48px;
    left: unset;
    right: 100%;
    top: 50%;
	transform: translateY(-50%);
	background-image: url(../images/fle_iz.svg);
	background-repeat: no-repeat;
	background-size: contain;
	filter: invert(28%) sepia(98%) saturate(3333%) hue-rotate(238deg) brightness(98%) contrast(96%);
}
#carruselLogos.owl-carousel .owl-nav button.owl-next {
	width: 48px;
    height: 48px;
    right: unset;
    left: 100%;
    top:50%;
	transform: translateY(-50%);
	background-image: url(../images/fle_der.svg);
	background-repeat: no-repeat;
	background-size: contain;
	filter: invert(28%) sepia(98%) saturate(3333%) hue-rotate(238deg) brightness(98%) contrast(96%);
}
#carruselLogos.owl-carousel .owl-nav button.owl-prev:hover,
#carruselLogos.owl-carousel .owl-nav button.owl-next:hover { 
	filter: invert(61%) sepia(21%) saturate(1313%) hue-rotate(317deg) brightness(96%) contrast(91%); 
	background-color: transparent;
}
#carruselLogos .item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100px;
}
/*CLIENTES*/


/*OTRAS SOLUCIONES*/
.contPlataformas {
	border-radius: 10px;
	font-size: 1.125em;
	line-height: 1.2em;
	font-weight: 400
}
.platform-title {
	font-size: 2.5rem;
	font-weight: bold;
	line-height: 1.2;
}
.calugasPlataforma {
	background-color: var(--bs-dark-blue); 
	color: white; 
	border-radius: 10px;
	padding: 0.75rem 1.5rem;
	display: inline-flex;
	cursor: pointer;
	transition: opacity 0.2s ease;
}
.calugasPlataforma:hover {
	opacity: 0.9;
}
.calugasPlataforma .d-flex {
	margin-bottom: 0 !important;
}
.calugasPlataforma .feature-icon {
	width: 40px;
	height: 40px;
}
.calugasPlataforma p {
	margin-bottom: 0;
	font-weight: 700;
	font-size: 1.1rem;
	line-height: 1;
	margin-left: 1rem;
}
.btn-warning-custom {
	background-color: var(--bs-warning);
	color: #0d204d;
	border: none;
	border-radius: 8px;
	padding: 0.3rem 1.5rem;
	font-weight: bold;
	transition: transform 0.2s ease;
}
.btn-warning-custom:hover {
	background-color: #F1C40E;
	color: #0d204d;
	transform: scale(1.05); 
}
.feature-icon {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	flex-shrink: 0;
}
.highlight-text {
	color: var(--bs-warning);
	font-weight: 700;
}
/* --- RESPONSIVIDAD --- */
@media (max-width: 991px) {
	.platform-title {
		font-size: 2rem;
	}
	.bg-azulOscuro {
		padding-left: 1.5rem !important;
		padding-right: 1.5rem !important;
	}
}
@media (max-width: 768px) {
#homeSoluciones .grilla3Col{
	gap: 10px;
    justify-content: space-between;
}	
#homeSoluciones .grilla3Col .grillaItem {
    width: 49%;
}
}
@media (max-width: 580px) {
#homeSoluciones .grilla3Col .grillaItem {
    width: 100%;
}
#homeSoluciones .d-flex {
    flex-direction: column;
}
#homeSoluciones .d-flex img{
	margin: 0 auto 0.5em auto;
	}
.calugasPlataforma{
	justify-content: center;
	text-align: center;
}	
}
/*OTRAS SOLUCIONES*/
/*ESTADISTICAS*/
.wrapperEstadisticas {
	max-width: 980px;
	margin: 0 auto;
}
.grupoEstadisticas {
	display: flex;
	flex-wrap: nowrap;
	width: 100%;
    justify-content: center;
    align-items: flex-start;
}
.grupoEstadisticas > .itemEstadisticas {
	width: 50%;
	padding: 2em;
	font-weight: bold;
	line-height: 180%;
	letter-spacing: -1px;
    text-align: center;
}
.grupoEstadisticas > .itemEstadisticas:nth-child(1) {
	border-right: solid 1px #C9DEF5;
	/*border-bottom: solid 1px #C9DEF5;*/
}
.grupoEstadisticas > .itemEstadisticas:nth-child(2) {
	border-right: solid 1px #C9DEF5;
}
/*.grupoEstadisticas > .itemEstadisticas:nth-child(3) {
	border-right: solid 1px #C9DEF5;
}*/
.grupoEstadisticas > .itemEstadisticas:nth-child(4) {}
.grupoEstadisticas .itemTexto0 {
	font-size: 2.75em;
	line-height: 100%;
	display: inline-block;
    position: relative;
}
.grupoEstadisticas .itemTexto0.conMas {
	position: relative;
}
.grupoEstadisticas .itemTexto0.conMas::before {
	content: "+";
	font-size: 0.6em;
	position: absolute;
	top: 0;
	right: 105%;
	font-weight: normal;
}
.grupoEstadisticas .itemTexto1 {
	font-size: 2.5em
}
.grupoEstadisticas .itemTexto2 {
	font-size: 1.5em
}
.counter {
  font-size: 60px;
  margin-top: 10px;
  min-width: 5ch;
}
@media (max-width:768px) {

.grupoEstadisticas > .itemEstadisticas {
	width: 75%;
}	
.grupoEstadisticas {
	margin: 0 auto;
	flex-direction: column;
	align-content: center;
	align-items: center;
}
.grupoEstadisticas > .itemEstadisticas:nth-child(1) {
	border-right: 0 none;
	border-bottom: solid 1px #C9DEF5;
}
.grupoEstadisticas > .itemEstadisticas:nth-child(2) {
	border-right: 0 none;
	border-bottom: solid 1px #C9DEF5;
}
.grupoEstadisticas > .itemEstadisticas:nth-child(3) {
	border-right: 0 none;
}
.grupoEstadisticas > .itemEstadisticas {
    padding: 1em;
}
.grupoEstadisticas .itemTexto1 {
    font-size: 2em;
}
.grupoEstadisticas .text-warning .itemTexto1 {
    font-size: 1.4em !important;
}
    }









/*ESTADISTICAS*/
/*CONTACTO*/
#homeContacto input,
#homeContacto textarea {
	border-color: var(--bs-dark-blue)
}
.tituloContac{
	padding-right: 36px;
}
@media (max-width: 680px) {
#homeContacto .row{
	flex-direction:column;
	--bs-gutter-x: 0;
}	
#homeContacto .contInput {
 padding-left: 0;
 padding-right: 0;
 margin-top: 10px;
}
.tituloContac{
	padding-right: 0px;
}
}
/*CONTACTO*/
/*FAQ*/
#homeFaq .accordion-item{
	margin-bottom: 10px;
}
#homeFaq .accordion-button::after {
	display:none
}
#homeFaq .accordion-flush>.accordion-item{
	border-radius: 10px !important
}
#homeFaq .accordion-button{
	border-radius: 10px !important
}
.verMas{
	width: 65px;
    text-align: center;
    border-radius: 10px;
}
.verMas a{
	text-decoration: none; color: white
}
.verMasMovil{
	display: none;
}
@media (max-width: 580px) {
.verMas{
	display: none;
}	
.verMasMovil{
 display: block;
 margin: 0 auto;
}
}
/*FAQ*/
/*OTRAS SOLUCIONES*/
/*Footer*/
.contLogoRedes {
	display: flex
}
.footText {
	width: 180px
}
/* --- FOOTER RESPONSIVO (CORREGIDO CON 3 BREAKPOINTS) --- */
/* Estilo base del footer y color de texto */
footer.bg-primary {
    padding: 3rem 1.5rem;
    color: white;
    font-size: 15px;
}
 /*  1. VISTA MÓVIL (Por defecto, < 768px)
  - Todo apilado verticalmente.*/
footer .grilla {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2.5rem;
	justify-content: space-between;
}
.contLogoRedes {
    display: flex;
    flex-direction: column; /* Logo encima de las redes */
    align-items: flex-start;
    gap: 1.5rem;
}
.footSociales {
    display: flex;
    gap: 5px;
}
.footSociales img{
	width: 25px;
	height: 25px;
}
.footText {
    width: 100%;
    line-height: 1.8;
}
footer a {
    color: white;
    text-decoration: none;
}
footer a:hover {
    text-decoration: underline;
}
/* 2. VISTA TABLET (Desde 768px hasta 991px)
  - Layout de 3 columnas, pero logo y redes siguen apilados.*/
@media (min-width: 768px) {
    footer .grilla {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        gap: 12%;
    }
    .contLogoRedes {
        flex: 1 1 30%;
        min-width: 210px;
        /* Aquí NO cambiamos la flex-direction, se mantiene 'column' */
    }
    .footText {
        width: 180px;
    }
}
/* 3. --- NOVEDAD PARA ESCRITORIO --- (Desde 992px en adelante)
  - Mantenemos las 3 columnas, pero ahora el logo y las redes van en horizontal.*/
@media (min-width: 992px) {
   .contLogoRedes {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
}
/*Footer*/


/*formulario*/
.form-check-input {
  border-color: var(--bs-primary);
}

.form-check-input:checked {
  background-color:  var(--bs-primary);
  border-color: var(--bs-primary);
}

.btn-enviar {
  background-color:  var(--bs-warning);
  color:  var(--bs-dark-blue);
  border: none;
  padding: 0.5rem 1.5rem;
  transition: background-color 0.3s ease;
}

.btn-enviar:hover {
  background-color: var(--bs-primary); 
  color: #fff;
}

.form-control[type="textarea"],
textarea.form-control {
  resize: vertical;
}
#solicitud .imagenCompu {
  width: 100px !important; 
  height: auto !important;  
}

@media (max-width:500px) {
#solicitud .wrapper980 {
padding-left: 10px;
padding-right: 10px;
}
}
/*formulario*/


/*colores*/
.bg-azulOscuro {
	background-color: var(--bs-dark-blue)
}
.text-azulOscuro {
	color: var(--bs-dark-blue)
}
.bg-grisClaro {
	background-color: var(--bs-light-gray)
}
.text_grisClaro {
	color: var(--bs-light-gray)
}


/*botones*/
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: rgba(var(--bs-primary-rgb), 0.9);
    --bs-btn-hover-border-color: #0a58ca;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #0a58ca;
    --bs-btn-active-border-color: #0a53be;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #0d6efd;
    --bs-btn-disabled-border-color: #0d6efd;
}
.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #6c757d;
    --bs-btn-border-color: #6c757d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #5c636a;
    --bs-btn-hover-border-color: #565e64;
    --bs-btn-focus-shadow-rgb: 130,138,145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #565e64;
    --bs-btn-active-border-color: #51585e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #6c757d;
    --bs-btn-disabled-border-color: #6c757d;
}
.btn-warning {
    --bs-btn-color: #000;
    --bs-btn-bg: #ffc107;
    --bs-btn-border-color: #ffc107;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #ffca2c;
    --bs-btn-hover-border-color: #ffc720;
    --bs-btn-focus-shadow-rgb: 217,164,6;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #ffcd39;
    --bs-btn-active-border-color: #ffc720;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #ffc107;
    --bs-btn-disabled-border-color: #ffc107;
}
.btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg: #dc3545;
    --bs-btn-border-color: #dc3545;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #bb2d3b;
    --bs-btn-hover-border-color: #b02a37;
    --bs-btn-focus-shadow-rgb: 225,83,97;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #b02a37;
    --bs-btn-active-border-color: #a52834;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #dc3545;
    --bs-btn-disabled-border-color: #dc3545;
}
.btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg: #198754;
    --bs-btn-border-color: #198754;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #157347;
    --bs-btn-hover-border-color: #146c43;
    --bs-btn-focus-shadow-rgb: 60,153,110;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #146c43;
    --bs-btn-active-border-color: #13653f;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #198754;
    --bs-btn-disabled-border-color: #198754;
}
/*colores*/



/* Chatbot*/
       #chatbot-button {
      position: fixed;
      bottom: 20px; right: 20px;
      width: 60px; height: 60px; border-radius: 50%;
      background-color: #4F46E5;
      color: white;
      border: none;
      cursor: pointer;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      z-index: 9998;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      transition: opacity 0.3s;
      overflow: hidden;
    }
    #chatbot-button:hover {
      opacity: 0.9;
    }
    #chatbot-modal {
      display: none;
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 80%;
      height: 80%;
      background: white;
      border-radius: 12px;
      box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
      z-index: 9999;
      overflow: hidden;
    }
    #chatbot-modal.active {
      display: flex;
      flex-direction: column;
    }
    #chatbot-modal-header {
      display: flex;
      justify-content: flex-end;
      padding: 8px;
      background: #f9fafb;
      border-bottom: 1px solid #e5e7eb;
    }
    #chatbot-close-button {
      background: transparent;
      border: none;
      font-size: 24px;
      cursor: pointer;
      color: #6b7280;
      padding: 4px 8px;
      line-height: 1;
      transition: color 0.2s;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    #chatbot-close-button:hover {
      color: #1f2937;
    }
    #chatbot-overlay {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 9998;
    }
    #chatbot-overlay.active {
      display: block;
    }
    #chatbot-modal iframe {
      flex: 1;
      width: 100%;
      border: none;
    }
	/* Chatbot*/
/* captcha fix*/
.grecaptcha-badge {
	bottom: 90px !important;
}