@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Poppins:wght@500;600;700;800&display=swap");
/*paleta de colores*/
/*extend*/
.serv, .serv1, .serv2, .serv3, .serv4, .serv5, .serv6 {
  margin: 10px;
  letter-spacing: 1px;
  padding: 10px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  border: 1px solid rgba(28, 28, 122, 0.08);
}
.serv p, .serv1 p, .serv2 p, .serv3 p, .serv4 p, .serv5 p, .serv6 p {
  font-size: 1rem;
  line-height: 1.5;
  color: #555;
  text-align: center;
}
.serv h3, .serv1 h3, .serv2 h3, .serv3 h3, .serv4 h3, .serv5 h3, .serv6 h3 {
  text-align: center;
  font-size: 1.8rem;
  font-weight: 600;
  letter-spacing: 0.5px;
  margin: 12px;
  letter-spacing: 1px;
}
.serv h4, .serv1 h4, .serv2 h4, .serv3 h4, .serv4 h4, .serv5 h4, .serv6 h4 {
  text-align: center;
}
.serv ul, .serv1 ul, .serv2 ul, .serv3 ul, .serv4 ul, .serv5 ul, .serv6 ul {
  list-style: none;
  text-align: center;
  margin-top: auto;
  padding-left: 0;
}
.serv li, .serv1 li, .serv2 li, .serv3 li, .serv4 li, .serv5 li, .serv6 li {
  color: rgb(28, 28, 122);
  font-size: 1rem;
  margin-bottom: 6px;
}

/*  font-family: "Sour Gummy", sans-serif; */
/*reset*/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

body {
  font-family: "Inter", system-ui, sans-serif;
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
}

main {
  flex: 1 0 auto;
}

p {
  color: rgb(28, 28, 122);
  font-size: 1.5rem;
}

h1 {
  color: rgb(28, 28, 122);
  text-shadow: 4px 2px 8px rgba(29, 65, 157, 0.6);
  font-size: 3rem;
  font-family: "Poppins", sans-serif;
  font-weight: bold;
  text-align: center;
  margin-top: 30px;
}

h2 {
  color: rgb(230, 93, 152);
  text-shadow: 4px 2px 0px rgba(230, 93, 152, 0.6);
  font-family: "Poppins", sans-serif;
  font-size: 2.3rem;
  text-align: center;
}

h3 {
  color: rgb(29, 65, 157);
  font-family: "Poppins", sans-serif;
  text-shadow: 4px 2px 8px rgba(29, 65, 157, 0.6);
  font-size: 1.8rem;
  text-align: center;
}

h4 {
  color: rgb(230, 93, 152);
  opacity: 0.85;
  font-size: 1.2rem;
  text-align: center;
  text-justify: inter-word;
  font-family: "Poppins", sans-serif;
  text-transform: uppercase;
}

span {
  color: rgb(28, 28, 122);
  font-size: 1.1rem;
}

/*header*/
header {
  display: flex;
  justify-content: space-between;
  position: sticky;
  z-index: 1000;
  top: 0;
  background-color: rgb(230, 93, 152);
}
header .logo {
  width: 130px;
  height: auto;
  margin: 10px;
}
header nav {
  font-size: 1rem;
}
header nav ul {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  height: 100%;
  margin-right: 10px;
}
header nav ul li {
  color: rgb(28, 28, 122);
}
header nav ul li a {
  text-decoration: none;
  font-size: large;
  color: rgb(28, 28, 122);
}

/*main index*/
.contenedor-grid {
  display: grid;
  grid-template-areas: "titulo-grid titulo-grid titulo-grid" "subtitulo-grid subtitulo-grid subtitulo-grid" "titulo-serv titulo-serv titulo-serv" "serv1 serv2 serv3" "serv4 serv5 serv6";
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-content: stretch;
  justify-items: stretch;
  align-items: stretch;
  text-align: justify;
  margin-bottom: 64px;
  padding-inline: 24px;
  gap: 30px;
  row-gap: 32px;
}
.contenedor-grid .titulo-grid {
  grid-area: titulo-grid;
  text-align: center;
}
.contenedor-grid .subtitulo-grid {
  grid-area: subtitulo-grid;
  text-align: center;
}
.contenedor-grid .titulo-serv {
  grid-area: titulo-serv;
  background-color: #f7e8e8;
}

.serv1 {
  grid-area: serv1;
}

.serv2 {
  grid-area: serv2;
}

.serv3 {
  grid-area: serv3;
}

.serv4 {
  grid-area: serv4;
}

.serv5 {
  grid-area: serv5;
}

.serv6 {
  grid-area: serv6;
}

/*main proyectos*/
.contenedor-grid2 {
  display: grid;
  grid-template-columns: 50% 50%;
  padding: 0 40px;
  margin-bottom: 64px;
  grid-template-areas: "titulo-proy titulo-proy" "texto-proyectos carrousel";
}
.contenedor-grid2 .titulo-proy {
  grid-area: titulo-proy;
  text-align: center;
}
.contenedor-grid2 .texto-proyectos {
  grid-area: texto-proyectos;
  text-align: center;
  padding: 120px;
}
.contenedor-grid2 .carrouselproyectos {
  grid-area: carrousel;
  margin-left: 0;
}

/*contacto*/
.mb-2 {
  width: 50%;
  margin: auto;
  background: #fff;
  padding: 32px;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}
.mb-2 button.btn-primary {
  background-color: rgb(230, 93, 152);
  border: none;
  font-weight: 600;
}
.mb-2 button.btn-primary:hover {
  background-color: rgb(190, 65, 120);
}

.iconos-contacto {
  display: flex;
  align-items: center;
  gap: 25px;
  justify-content: space-evenly;
  padding: 5px;
  text-align: center;
}

.icono {
  width: 50px;
}

/* footer*/
footer {
  background-color: rgb(230, 93, 152);
  text-align: center;
  padding: 7px 0;
  letter-spacing: 2px;
  margin-top: auto;
}
footer span {
  margin: 0;
}

/* media queries*/
/* celulares/mobile */
@media (max-width: 480px) {
  header {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  header nav {
    width: 90%;
  }
  header ul {
    margin-right: 0px;
  }
  footer .iconos-contacto span {
    display: none;
  }
  h1 {
    font-size: 1.7rem;
    text-align: center;
    margin-bottom: 24px;
  }
  /*home*/
  .contenedor-grid {
    grid-template-areas: "titulo-grid" "subtitulo-grid" "titulo-serv" "serv1 " "serv2" "serv3" "serv4" "serv5" "serv6";
    grid-template-columns: 100%;
    margin: 22px;
  }
  .contenedor-grid h2 {
    display: none;
  }
  /*proyectos reales*/
  .contenedor-grid2 {
    grid-template-areas: "titulo-proy" "texto-proyectos" "carrousel";
    grid-template-columns: 100%;
    padding: 0;
  }
  .contenedor-grid2 .texto-proyectos {
    padding: 24px 16px;
  }
  .contenedor-grid2 .texto-proyectos p {
    text-align: center;
    line-height: 1.6;
    max-width: 100%;
  }
  .contenedor-grid2 .carrousel {
    margin-bottom: 40px;
  }
  /*contacto*/
  .mb-2 {
    width: 100%;
    margin-top: 45px;
    margin-bottom: 0px;
    padding: 20px;
  }
}
/*tablet*/
@media (min-width: 481px) and (max-width: 770px) {
  header {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  header nav {
    width: 90%;
  }
  header ul {
    margin-right: 0px;
  }
  footer .iconos-contacto span {
    display: none;
  }
  /*home*/
  .contenedor-grid {
    grid-template-areas: "titulo-grid" "subtitulo-grid" "titulo-serv" "serv1 " "serv2" "serv3" "serv4" "serv5" "serv6";
    grid-template-columns: 100%;
    margin: 22px;
  }
  .contenedor-grid h2 {
    display: none;
  }
  /*proyectos reales*/
  .contenedor-grid2 {
    grid-template-areas: "titulo-proy" "texto-proyectos" "carrousel";
    grid-template-columns: 100%;
    padding: 0;
  }
  .contenedor-grid2 .texto-proyectos {
    padding: 24px 16px;
  }
  .contenedor-grid2 .texto-proyectos p {
    text-align: center;
    line-height: 1.6;
    max-width: 100%;
  }
  .contenedor-grid2 .carrousel {
    margin-bottom: 40px;
  }
}

/*# sourceMappingURL=estilos.css.map */
