@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap');
*{
    font-family: "Source Sans 3", sans-serif;
}
body {
  overflow-x: hidden;
}


/* Navbar */
.navbar-nav .nav-item {
  margin-right: 40px;
}

.underline-effect {
  position: relative;
  text-decoration: none;
  color: black;
}

.underline-effect::after {
  content: '';
  position: absolute;
  width: 0;
  height: 2px;
  bottom: 1px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #67C9F0;
  transition: width 0.3s ease-in-out;
}

.underline-effect:hover::after {
  width: 90%;
}

.dropdown-menu {
  display: block;
  visibility: hidden;
  opacity: 0;
  transform: translateY(15px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  position: absolute;
  top: 100%;
  min-width: 250px;
  padding: 15px 20px;
  border-radius: 10px;
  background-color: #ffffff;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.nav-item.dropdown:hover .dropdown-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.dropdown-item {
  font-size: 1.2rem;
  padding: 10px 15px;
}

.dropdown-item:hover {
  background-color: #89cdec;
  border-radius: 8px;
}
.nav-item .text-black{
  color:#1e73b4 !important;
}

/* Home  */

.heroimg{
  height: 200%;
}
.her img{
  display: block;
  width: 150% !important;
  max-width: 150% !important;
  height: auto;
  object-fit: cover;
  left: -50px;
  transform: translateX(-10%);

}
.heroimg img {
  display: none;
  width: 150% !important;
  max-width: 150% !important;
  height: auto;
  object-fit: cover;
  left: -50px; /* Ajusta el desplazamiento horizontal hacia la izquierda */
  transform: translateX(-10%);
}

.heroimg img.active {
  display: block;
  animation: fadeIn 1s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}


.btn-info-custom {
    background-color: #1A6199;
    color: #fff;
    border-radius: 50px;
    padding: 10px 20px;
    margin-top: 20px;
    font-weight: bold;
    border-color: #67C9F0;
    max-width: 150px;
    border-width: 3px;
}
.herotxt .cyan{
    color: #67C9F0;
    padding: 2px;
}

.herotxt h1 {
    font-size: 3rem;
    font-weight: bold;
}

.herotxt .blue{
    font-weight: bold;
    color: #1A6199;
    padding: 2px;
}
.btn-info-custom:hover {
    background-color: #1A6199;
    color: #fff;
}
.herotxt p{
    font-size: 1.3rem ;
    color: #7A7A7A;
    padding: 2px;
}
.txthero{
  text-align: center;
  width: 100%;
  margin: 0 auto;
}
/* Home  */

/* Servicios  */
.bg-lightblue {
    background-color: #85c9e9; 
  }
  
  .service-card {
    border: none;
    border-radius: 50px;
  }
  
  .card-title {
    font-size: 1.2rem;
    font-weight: bold;
    color: white;
  }
  
  .card-body {
    background-color: rgba(0, 0, 0, 0.5); 
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
  }
  .card-title{
    height: 40px;
  }
  .card-img-top {
    position: relative;
    height: 450px;
    object-fit: cover;
  }
  .servicios h2{
    font-size: 3rem;
    font-weight: bold;
    color: white;
  }
  .servicios p{
    font-size: 1.3rem ;
    color: #7A7A7A;
    padding: 2px;
  }
/* Servicios  */

/* Seccion features */
.bg-lightblue {
  background-color: #85c9e9;
}

.feature-icon i {
  font-size: 3rem;
  color: #ffffff; 
}

.icon-large {
  padding: 10px 20px;
  background-color: #1A6199; 
  border-radius: 35%;
}

.feature-title {
  padding-top: 15px;
  font-size: 2rem;
  font-weight: bold;
  margin-top: 15px;
  color: #ffffff;
}

.feature-description {
  font-size: 1rem;
  color: #6c757d;
}
/* Seccion features */

/* Seccion certificacion */
.policy-section {
  padding: 50px 0;
}
.policy-section h2{
  font-size: 3rem;
  font-weight: bold;
  color:#67C9F0
}
.policy-section h2 .blue{
  color: #0082CB;
}
.policy-section h3 {
  font-size: 3rem;
  font-weight: bold;
  color: #1A6199;
}

.policy-text {
  font-size: 1.3rem ;
    color: #7A7A7A;
    padding: 2px;
}

.certificates img {
  width: 65%;
}

.certificates {
  text-align: right;
}
.fim{
  font-size: 2.7rem;
  color: #67C9F0;
}
.fim:hover{
  color: #1A6199;
  font-size: 2.9rem;
}

.service-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.service-card:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}

.service-card a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0);
  transition: background-color 0.3s ease;
  z-index: 1;
}

.service-card:hover a::before {
  background-color: rgba(0, 0, 0, 0.4);
}

.service-card .card-img-top {
  position: relative;
  z-index: 0;
}

.underline-oscuro {
  width: 200px;
  height: 3px;
  background-color: #1A6199;
  margin: 0 auto;
}
.underline-claro {
  width: 200px;
  height: 3px;
  background-color: #00aaff;
  margin: 0 auto;
 
}
.custom-navbar{
  background-color: #85c9e9;
}

/*Mision y Vision*/
#mision-vision {
  background-color: #85c9e9;
}

/* Estilo para los textos */
.content-box h2 {
  font-size: 3rem;
  font-weight: bold;
  color:#1A6199;
  padding-right: 10px;
  text-align: center;
}
.content-box p span{
  color:#1A6199;
}
.content-box p {
    font-size: 1.2rem;
    font-weight: bold;
    color: white;
}

.her img {
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}
.her {
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.row.align-items-center {
  gap: 0; /* Elimina cualquier espacio entre columnas si está causando problemas */
}


/*Mision y Vision*/


/*Valores*/
.title-valores{
  font-size: 3rem;
  font-weight: bold;
  color:#1A6199;
  padding-right: 10px;
  text-align: center;
}
.valores .container-fluid {
  padding: 0; /* Elimina padding para usar todo el ancho */
}

.valores .carousel-inner {
  overflow: hidden;
  width: 100%;
  position: relative;
}

.carousel-track {
  display: flex;
  gap: 10px; /* Espacio entre tarjetas */
}

.valores-card {
  width: 300px; 
  height: 220px;
  margin: 0 10px;
  background-color: #1e73b4;
  color: white;
  border-radius: 15px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.card-icon {
  font-size: 3rem;
  color: #67C9F0;
}
.custom-file-upload {
  align-items: center;
  gap: 10px;
  font-family: Arial, sans-serif;
}

/* Botón personalizado */

.file-upload-btn {
  padding: 10px 20px;
  background-color: #1A6199;
  color: white;
  border: 2px solid #66C8EF;
  border-radius: 20px;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.file-upload-btn:hover {
  background-color: #0056b3;
  border-color: #1A6199;
}

/* Texto de nombre del archivo */
.file-name-text {
  color: #6c757d;
  font-size: 14px;
}

/* Input de archivo oculto */
.file-input {
  display: none;
}
.custom-file-upload {
  font-size: 15px;
}

/* Label superior */
.custom-file-label {
  display: block;
  margin-bottom: 8px;
  color: #000000;
}

/* Contenedor del botón y texto */
.file-upload-container {
  display: flex;
  align-items: center;
  gap: 10px;
}
.file-name-box {
  color: #6c757d;
  font-size: 14px;
  padding: 5px 10px;
  border: 2px solid #1A6199;
  border-radius: 5px;
  background-color: white;
  min-width: auto; 
  height: 40px;
  text-align: left;
}

.info-section {
  background-color: #66c8ef;
  position: relative;
  z-index: 2;
}

.info-card {
  background-color: white;
  border: 2px solid #e3e3e3;
  border-radius: 10px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  margin-top: -70px;
  z-index: 2;
  position: relative;
  flex-direction: column;
  justify-content: center;
  height: 150%;
}
@media (max-width: 768px) {
  .info-card {
    margin-top: 0px;
    height: auto;
  }
}


.info-title {
  margin-bottom: 15px;
  color: #67C9F0;
  font-weight: bold !important;
}
.info-title span {
  color: #1e73b4;
}

.info-text {
  font-size: 16px;
  line-height: 1.5;
}
.nav-color{
  color: #7A7A7A !important;
}

@keyframes infinite-scroll {
  from {
    transform: translateX(0); /* Comienza en posición inicial */
  }
  to {
    transform: translateX(-500%); /* Se mueve el ancho total del contenido */
  }
}
/*Trabaja con nosotros*/
/*Titulo*/
.work-title h1{
  font-size: 3rem;
  font-weight: bold;
  color:#67C9F0;
  padding-right: 10px;
  text-align: center;
}
.work-title .blue{
  color:#1e73b4;
}
.sub-title{
  color: #7A7A7A;
  padding: 2px;
}
/*Form*/
textarea {
  resize: none;
}

 input[type="file"],
 input[type="file"]:focus,
 input[type="file"]:hover,
 input[type="file"]::before
 {
  border: 0px;
  border-color: white;
 }

 input[type="text"],
 input[type="email"],
 input[type="tel"],
 .txtc
 {
  border: 2px solid #1A6199;
 }
 
input[type=file]::file-selector-button {
  background-color: #1A6199;
  color: #fff;
  border-radius: 50px;
  padding: 10px 20px;
  margin-top: 20px;
  font-weight: bold;
  border-color: #67C9F0;
  max-width: 200px;
}

input[type=file]::file-selector-button::hover{
    background-color: #1A6199;
    color: #fff;
}
/*Trabaja con nosotros*/
/*Responsivo*/
@media (max-width: 768px) {
  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  html, body {
    max-width: 100%;
    overflow-x: hidden;
  }

  footer .navbar-brand img,
  .heroimg img,
  .certificates img {
    width: 100%;
    height: auto;
  }

  .herotxt {
    text-align: center;
    padding: 1rem;
    width: 100%;
    box-sizing: border-box;
  }

  .herotxt h1 {
    font-size: 2rem;
    line-height: 1.2;
    margin: 0;
  }

  .herotxt p {
    font-size: 1.2rem;
    line-height: 1.4;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
  }

  .btn-info-custom {
    font-size: 1rem;
    padding: 0.5rem 1rem;
  }

  .hero {
    margin: 0;
    padding: 0;
    width: 100% !important;
  }

  .service-card h5 {
    font-size: 1rem;
  }

  .fim {
    font-size: 1.5rem;
  }

  .policy-section {
    text-align: center;
  }

  .caracteristicas,
  .servicios {
    padding: 1rem;
  }

  .servicios .row .col-md-3 {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 1rem;
  }

  footer .row {
    text-align: center;
    flex-direction: column;
  }

  footer .navbar-nav {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
  }

  footer .nav-item {
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
  }

  footer .col-md-4 {
    margin-bottom: 20px;
  }
  .fim{
    font-size: 2.5rem;
  }
  .rs{
    font-size: 18px;
  }
  .dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    transform: translateY(0);
    z-index: 1050;
  }
  .work-title h1{
    font-size: 2.2rem !important;
  }
  .sbt{
    font-size: 1rem !important;
    width: 80%;
    align-items: center !important;
    text-align: center !important;
  }
  .nav-item{
    text-align: center;
  }
  .underline-effect:hover::after {
    width: 50%;
  }
}