.vector {
margin-top: 30px;
}

.equipo {
  margin-top: 50px;
  text-align: center;
}

.equipo h1.azul {
  text-align: center;
  margin: 0 20px 15px;
  max-width: max(70%, 550px);
  display: inline-block;
}

.miembro {
  margin: 20px 0;
  border: 2px solid #f0f0f0;
  padding: 20px;
}

.equipo picture img, .servicios picture img {
  width: 150px;
  border-radius: 50%;
}

.descripcion p,.servicio p {
  font: var(--small);
  max-width: 220px;
}

p.fh7 {
  font: var(--h3);
  color: var(--azul2);
  margin-bottom: 10px;
  text-align: center;
}

p.fh8 {
color: var(--gris);
text-align: center;
margin-bottom: 5px;
}

p.fh9 {
  color: var(--naranjo);
  text-align: center;
  margin-bottom: 15px;
  margin-top: 0;
}

/* SOBRE NOSOTROS */


.sobre {
  margin: 0;
  padding: 0 50px;
  color: white;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 100,0 100,60 80,80 0,80' fill='%23F36E42'/%3E%3C/svg%3E");
  background-color: var(--azul);
  min-height: 100vh; 
}

.sobre .fh2 {
  font-weight: 500;
  margin: 20px 0;
  max-width: 80%;
}


.sobre img {
  max-width: 100%; 
  height: auto ;
  margin-top: 50px;
}

.sobre .foto {
  margin-bottom: 70px;
}



/* MISION Y VISIÓN */

.misionvision {
  padding: 50px 20px;
  margin-top: 50px;
  text-align: center;
  color: white;
}

.misionvision .antetitulo {
  color: white;
}

.misionvision .servicio .fh2 {
  font: var(--h2);
}
.misionvision .line {
  background-color: white;
}

.misionvision .servicio {
  background-color: white;
  padding: 40px 20px;
}

.misionvision .servicio p {
  font: var(--small);
  margin-top: 15px;
}


.misionvision .prev, .misionvision .next {
  border: none;
  background-color: unset;
  color: white;
  font-size: 70px;
  box-shadow: none;
}



/* NUESTROS PRINCIPIOS*/

.principios {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 0,60 40,100' fill='%23F36E42'/%3E%3C/svg%3E");
    padding: 50px 0;
}

.principios .fh1 {
  color: var(--azul2);
  margin: 20px 30px 50px;
  text-align: center;
}

.principios .porque {
  display: flex;
  flex-direction: column;
  align-items: center;
}


.principios .numero {
  font: var(--h1);
  font-size: 64px;
  color: var(--azul2);
  margin: 0 20px;
}

.razon {
  display: flex;
  flex-direction: row;
  margin: 10px 20px;
  border-bottom: 2px solid var(--gris2);
}

.razon:last-of-type {
  border-bottom: none;
}


.elegirnos p:first-of-type {
  font: var(--h3);
  color: var(--naranjo);
  margin: 0;
}

.elegirnos p:last-of-type {
  font: var(--smaller);
  color: var(--azul);
  max-width: 175px;
  margin: 10px 0 30px;
}


.principios picture, .principios img {
  height: auto;
  margin: 0 auto;
  max-width: 85%;
  text-align: center;
  display: block;
}


@media screen and (min-width: 1024px) {

.hero .vector {
  display: none;
}


  .miembro {
    margin: 30px 50px;
    width: 340px;
    text-align: center;
  }

.miembro .descripcion {
  justify-items: center;
}

.descripcion p {
  max-width: 300px;
}

.descripcion p:last-of-type {
  max-width: 215px;
  font-size: 12px;
}


.sobre {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='40,0 100,0 100,50 90,100 20,100' fill='%23F36E42'/%3E%3C/svg%3E");
  min-height: unset;
  padding: 50px 0;
}

.sobre p {
  max-width:80% ;
}
.sobre .fh3 {
  max-width: 80%;
}

.sobre .imagen {
  flex-shrink: 0; /* Prevents the container from shrinking smaller than its content */
  flex-basis: 40%; 
  padding: 20px;
  max-width: 500px;
  margin: 0 40px;
}

.sobre .comillas {
  margin-top: 0;
}


.sobre .imagen img {
  max-width: 100%; 
  height: auto;
  display: block;
}

  .carousel-container {
    max-width: 1200px; 
    overflow: visible;
  }

  .carousel-track {
    flex-wrap: wrap;
    justify-content: center; 
    gap: 20px;
    transform: none !important; 
  }

  .servicio {
    flex: 1 1 30%;
    max-width: 300px; 
    border: 1px solid #eee; 
    background-color: white;
  }

  .carousel-buttons {
    display: none;
  }


.principios {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 15,0 45,100 0,100' fill='%23F36E42'/%3E%3C/svg%3E");
}

.flex {
  display: flex;
  flex-direction: row-reverse;
  justify-self: center;
}

.flex .porque {
  flex: 1;
}

.flex img {
  flex-shrink: 0; /* Prevents the container from shrinking smaller than its content */
  flex-basis: 40%; 
  padding: 20px;
  max-width: 500px;
  margin: 0 40px;
  flex: 1;
}

.elegirnos p:last-of-type {
  max-width: 200px;
}

}