@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;700&display=swap");
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

body {
  background-color: #111212;
  font-family: "DM Sans", sans-serif; }

ul li {
  list-style: none; }

/*   
    @include d-flex(row, center, center);   
    Mixin de display flex
*/
/*   
    @include font(thin, sm);   
    Mixin de tipografia
*/
/* ---------- Style del Menu ---------- */
nav {
  height: 100px;
  background-image: linear-gradient(#111212, #111212, rgba(17, 18, 18, 0.808), transparent);
  color: white; }
  nav img {
    width: 7rem; }
  nav span {
    display: block;
    background-color: white;
    border-radius: 15px; }

.navbar__boton {
  width: 1.6rem;
  height: 2rem;
  margin-right: 7px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly; }
  .navbar__boton > span {
    background-color: #01c38e;
    height: 11%; }
  .navbar__boton .navbar__barra--1 {
    margin-right: 40%;
    width: 60%; }
  .navbar__boton .navbar__barra--2 {
    width: 100%; }
  .navbar__boton .navbar__barra--3 {
    width: 60%;
    margin-left: 40%; }

.navbar__close {
  color: #01c38e;
  font-size: 2.3rem;
  cursor: pointer; }

.offcanvas, .offcanvas-body {
  background-color: rgba(17, 18, 18, 0.808); }

.offcanvas-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around; }

.offcanvas-header {
  padding: 7% 6%;
  background-color: rgba(17, 18, 18, 0.808);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between; }

.container-fluid {
  padding: 0 5%; }

.nav-item {
  text-align: center; }
  .nav-item a {
    color: white;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: -2.24px;
    line-height: 40.42px; }
    .nav-item a:hover {
      color: #01c38e;
      transition: all 1.4s ease; }

.navbar__legales {
  margin: 0;
  padding: 0;
  flex-wrap: wrap; }
  .navbar__legales li {
    margin: 5px 30px;
    text-align: center; }
    .navbar__legales li a {
      color: white;
      font-size: 0.75rem;
      font-weight: 400;
      letter-spacing: normal;
      line-height: 20px; }

.navbar__redes {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  list-style: none;
  margin-bottom: 20px; }
  .navbar__redes a {
    color: #01c38e;
    margin: 0 7px; }
    .navbar__redes a i {
      font-size: 1.7rem; }

/* ---------- Style de los encabezados ---------- */
.encabezado {
  height: 90vh;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  margin-top: 50px; }
  .encabezado span {
    color: #01c38e; }
  .encabezado--servicios, .seccion__laboral--fondo, .seccion__nosotros--fondo, .seccion__garantia--fondo, .seccion__ayuda--fondo, .seccion__referido--fondo, .encabezado--nosotros, .encabezado--empleo, .encabezado--contacto, .encabezado--legales, .encabezado--home {
    width: 100%;
    height: 75vh;
    position: absolute;
    filter: grayscale(0.7);
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: 50%;
    z-index: 0;
    opacity: 0.4; }
  .encabezado--home {
    object-fit: cover;
    object-position: 24% 5%;
    transform: rotateY(3.142rad);
    transform: rotateX(180); }
  .encabezado--nosotros {
    background-image: url("../assets/portadas/quienes-somos-header.webp"); }
  .encabezado--servicios, .seccion__laboral--fondo, .seccion__nosotros--fondo, .seccion__garantia--fondo, .seccion__ayuda--fondo, .seccion__referido--fondo {
    background-image: url("../assets/portadas/servicios-header.webp"); }
  .encabezado--empleo {
    background-image: url("../assets/portadas/equipo.webp"); }
  .encabezado--contacto {
    background-image: url("../assets/portadas/sedes-header.webp"); }
  .encabezado--legales {
    background-image: url("../assets/portadas/legales.webp"); }
  .encabezado__degradado {
    width: 100%;
    height: 76vh;
    position: absolute;
    z-index: 1;
    background: linear-gradient(#111212, rgba(17, 18, 18, 0.808), transparent, transparent, rgba(17, 18, 18, 0.808), #111212);
    opacity: 1; }
  .encabezado__articulo {
    text-align: left;
    width: 95%;
    position: absolute;
    padding-left: 9%;
    z-index: 2;
    animation-duration: 2s;
    animation-name: desplazamiento;
    animation-iteration-count: 1; }
  .encabezado__leyenda {
    color: rgba(1, 195, 143, 0.612);
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px; }
    .encabezado__leyenda span {
      font-size: 0.75rem;
      font-weight: 400;
      letter-spacing: normal;
      line-height: 20px; }
  .encabezado__titulo {
    color: white;
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: -2.24px;
    line-height: 40.42px;
    margin-bottom: 30px; }
  .encabezado__texto {
    color: white;
    width: 85%;
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px;
    margin-bottom: 50px; }
  .encabezado__boton, .seccion__boton {
    width: 30%;
    font-size: 1.05rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px;
    color: white;
    text-decoration: none;
    padding: 15px 30px;
    border: 1px solid white;
    border-radius: 25px; }
    .encabezado__boton:hover, .seccion__boton:hover {
      color: black;
      background-color: #01c38e;
      border-color: #01c38e;
      transition: all 1s ease; }
  .encabezado--error {
    margin-top: 70px;
    height: 90vh; }
    .encabezado--error img {
      width: 90%;
      margin: 0 auto; }
    .encabezado--error article {
      text-align: center; }
      .encabezado--error article > * {
        margin: 1rem auto; }

@keyframes desplazamiento {
  0% {
    left: -100vw; }
  10% {
    left: -60vw; }
  15% {
    left: -30vw; }
  100% {
    left: 0; } }

/* ---------- Style Secciones ---------- */
.seccion {
  padding: 7%;
  text-align: center;
  /* ---------- Style Seccion Newsletter ----------*/ }
  .seccion--padding {
    padding-bottom: 0; }
  .seccion__titulo, .contacto__titulo {
    margin: 20px 0 30px 0;
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: -2.24px;
    line-height: 40.42px;
    color: white; }
  .seccion--laboral, .seccion--nosotros, .seccion--garantia, .seccion--ayuda, .seccion--referido {
    margin: 60px 0;
    height: 75vh;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center; }
  .seccion__laboral--fondo, .seccion__nosotros--fondo, .seccion__garantia--fondo, .seccion__ayuda--fondo, .seccion__referido--fondo {
    background-position-y: 70%;
    z-index: -1;
    opacity: 0.15; }
  .seccion__lista {
    margin: 50px auto; }
  .seccion__item {
    max-width: 16rem;
    margin: 2.5%; }
    .seccion__item article {
      padding: 8%;
      border-radius: 26px;
      background: #111212; }
      .seccion__item article:hover {
        box-shadow: 19px 19px 40px #0c0d0d, -19px -19px 40px #161717;
        transition: all 2s ease; }
  .seccion__subtitulo {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: -2.24px;
    line-height: 40.42px;
    margin-bottom: 20px;
    color: #01c38e; }
  .seccion__boton {
    display: block;
    width: 13rem;
    margin: auto; }
  .seccion__datos textarea {
    height: 10rem; }
  .seccion__confirmar {
    padding: 20px;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap; }
  .seccion__area {
    background-color: #111212;
    color: rgba(255, 255, 255, 0.83);
    border-color: rgba(1, 195, 143, 0.612);
    border-radius: 10px;
    width: 100%;
    height: 14rem;
    padding: 5%;
    margin: 20px 0; }
  .seccion__area:focus {
    outline: 1px solid #01c38e; }
    .seccion__area:focus::placeholder {
      color: #111212; }
  .seccion__archivo {
    width: 75%;
    margin: 30px auto; }
    .seccion__archivo input {
      background-color: #111212;
      color: #01c38e; }
  .seccion__sublista {
    list-style: none;
    margin-bottom: 30px;
    color: white; }
  .seccion__numero {
    text-decoration: none;
    color: #111212; }
  .seccion__mapa {
    border: 0;
    width: 95%;
    margin-top: 30px; }
  .seccion__texto {
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px;
    color: white; }
  .seccion__texto--label {
    margin-top: 30px;
    color: #01c38e; }
  .seccion__entrada {
    width: 90%;
    padding: 10px 25px;
    border-radius: 25px;
    border: 1px solid rgba(255, 255, 255, 0.83);
    background-color: transparent;
    margin: 25px auto 0 auto;
    display: block;
    color: white;
    text-align: center; }
    .seccion__entrada:focus {
      color: #01c38e;
      outline: 1px solid #01c38e; }
      .seccion__entrada:focus::placeholder {
        color: #111212; }
  .seccion__boton--input {
    min-width: 10rem;
    padding: 15px 30px;
    margin: 10px 0;
    background-color: transparent;
    border: 2px solid rgba(1, 195, 143, 0.612);
    border-radius: 25px;
    color: white; }
    .seccion__boton--input:hover {
      color: black;
      background-color: #01c38e;
      border-color: #01c38e;
      transition: all 1s ease; }

/* ----------- Style Pagina Principal(home) ---------- */
.seccion__procesos {
  width: 95%;
  margin: 5vw auto; }

.seccion__etapa {
  margin: 30% 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center; }

.seccion__orden {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center; }
  .seccion__orden img {
    height: 3rem;
    filter: invert(66%) sepia(90%) saturate(4775%) hue-rotate(133deg) brightness(104%) contrast(99%); }

.seccion__descripcion {
  width: 100%;
  padding-left: 3%; }
  .seccion__descripcion h3, .seccion__descripcion p {
    text-align: left; }

.seccion__ilustracion {
  position: absolute;
  z-index: -1; }
  .seccion__ilustracion img {
    max-height: 30vh;
    max-width: 80%;
    opacity: 0.1;
    filter: blur(1px); }

.seccion__procesos:nth-child(odd) .seccion__etapa {
  flex-direction: row-reverse;
  text-align: right; }
  .seccion__procesos:nth-child(odd) .seccion__etapa .seccion__descripcion {
    padding-right: 3%; }
    .seccion__procesos:nth-child(odd) .seccion__etapa .seccion__descripcion h3, .seccion__procesos:nth-child(odd) .seccion__etapa .seccion__descripcion p {
      text-align: right; }

.seccion__portfolio {
  margin: 0 0 30px 0; }
  .seccion__portfolio .seccion__mockup {
    display: block;
    width: 100%; }
    .seccion__portfolio .seccion__mockup img {
      width: 90%;
      opacity: 0.7; }
  .seccion__portfolio article {
    padding: 0 6%; }
    .seccion__portfolio article h2, .seccion__portfolio article p {
      text-align: center; }

.seccion__icono {
  width: 50%;
  margin-bottom: 25px; }

.seccion__laboral--fondo {
  background-image: url("../assets/portadas/empleo.webp"); }

.seccion__nosotros--fondo {
  background-image: url("../assets/portadas/quienes-somos.webp"); }

.seccion__degradado {
  width: 100%;
  height: 78vh;
  position: absolute;
  z-index: 0;
  background: linear-gradient(#111212, rgba(17, 18, 18, 0.808), transparent, transparent, rgba(17, 18, 18, 0.808), #111212);
  opacity: 1; }

.seccion__articulo {
  position: absolute;
  padding: 0 5%;
  left: 50;
  top: 50;
  z-index: 1; }
  .seccion__articulo--derecha {
    text-align: right; }

.seccion__clientes--wrap {
  margin-top: 5rem; }
  .seccion__clientes--wrap .col-auto {
    margin: 1rem 0.5rem; }
    .seccion__clientes--wrap .col-auto img {
      width: 6rem;
      opacity: 0.5; }
      .seccion__clientes--wrap .col-auto img:hover {
        opacity: 1;
        transform: scale(1.1);
        transition: all 1s; }

.seccion__item--ancho {
  width: 19%; }

.seccion__galeria {
  display: grid;
  height: auto;
  width: 100%;
  grid-template-areas: "primero" "segundo" "tercero" "cuarto" "quinto" "sexto" "septimo" "octavo" "noveno";
  grid-template-columns: 1fr;
  grid-template-rows: repeat(9, 9rem);
  grid-row-gap: 10px;
  margin-top: 50px; }

.seccion__fotografia {
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 7px;
  opacity: 100%; }
  .seccion__fotografia article {
    width: 100%;
    height: 100%;
    padding-left: 5%;
    border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.6);
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: flex-end; }
    .seccion__fotografia article h3 {
      font-size: 1.05rem;
      font-weight: 700;
      letter-spacing: -2.24px;
      line-height: 40.42px; }
    .seccion__fotografia article p {
      font-size: 0.9rem;
      font-weight: 400;
      letter-spacing: normal;
      line-height: 20px;
      color: white; }
    .seccion__fotografia article > * {
      display: none; }
    .seccion__fotografia article:hover {
      background-color: rgba(0, 0, 0, 0.9);
      transition: all 1.5s ease; }
      .seccion__fotografia article:hover > * {
        display: block; }
  .seccion__fotografia--primero {
    grid-area: primero;
    background-image: url("../assets/galeria/oficina--caba--1.webp"); }
  .seccion__fotografia--segundo {
    grid-area: segundo;
    background-image: url("../assets/galeria/oficina--caba--2.webp");
    background-position-y: 50%; }
  .seccion__fotografia--tercero {
    grid-area: tercero;
    background-image: url("../assets/galeria/oficina--caba--3.webp"); }
  .seccion__fotografia--cuarto {
    grid-area: cuarto;
    background-image: url("../assets/galeria/oficina--mendoza--1.webp");
    background-position-y: 50%; }
  .seccion__fotografia--quinto {
    grid-area: quinto;
    background-image: url("../assets/galeria/oficina--mendoza--2.webp"); }
  .seccion__fotografia--sexto {
    grid-area: sexto;
    background-image: url("../assets/galeria/oficina--mendoza--3.webp");
    background-position-y: 30%; }
  .seccion__fotografia--septimo {
    grid-area: septimo;
    background-image: url("../assets/galeria/oficina--usuahia--1.webp");
    background-position-y: 30%; }
  .seccion__fotografia--octavo {
    grid-area: octavo;
    background-image: url("../assets/galeria/oficina--usuahia--2.webp");
    background-position-y: 30%; }
  .seccion__fotografia--noveno {
    grid-area: noveno;
    background-image: url("../assets/galeria/oficina--usuahia--3.webp"); }

/* ----------- Style Servicios ---------- */
.seccion__garantia--fondo {
  background-image: url("../assets/portadas/garantia.webp"); }

.seccion__ayuda--fondo {
  background-image: url("../assets/portadas/mesa-de-ayuda.webp"); }

/* ---------- Style Empleos(oportunidades) ----------- */
.seccion__referido--fondo {
  background-image: url("../assets/portadas/entrevista-header.webp"); }

.seccion__datos--margin {
  margin-bottom: 30px;
  padding: 3%; }

.seccion__formulario .col-lg-6 {
  margin: 50px 0; }

.seccion__fieldset {
  border: 1px solid rgba(1, 195, 143, 0.612);
  border-radius: 10px;
  padding: 10px 0 50px 0;
  width: 100%;
  margin: 0 auto; }
  .seccion__fieldset legend {
    background-color: #111212;
    position: relative;
    color: #01c38e;
    top: -30px;
    left: 15%;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -2.24px;
    line-height: 40.42px;
    width: 70%; }
  .seccion__fieldset label {
    color: white;
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px;
    display: block;
    width: auto;
    margin: 40px 0 10px 0; }
  .seccion__fieldset input {
    border-radius: 25px;
    border-color: rgba(1, 195, 143, 0.612);
    width: 80%;
    padding: 20px;
    height: 2.3rem;
    text-align: center; }
    .seccion__fieldset input:focus {
      outline: 1px solid #01c38e; }
      .seccion__fieldset input:focus::placeholder {
        color: #111212; }

/* ---------- Style Contacto ---------- */
.seccion__texto--margen {
  margin-bottom: 30px; }

.seccion__ubicaciones {
  width: 100%;
  padding: 1%;
  margin: 100px auto -100px auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-evenly;
  flex-wrap: wrap; }

.seccion__sede {
  width: 25rem;
  padding: 0 10px;
  margin-bottom: -50px; }
  .seccion__sede article {
    background-color: #111212;
    width: 70%;
    height: 150px;
    padding: 4%;
    border: 2px solid white;
    border-radius: 10px;
    position: relative;
    top: -325px;
    left: 15%;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap; }
  .seccion__sede iframe {
    width: 100%;
    height: 250px;
    border-radius: 10px;
    opacity: 65%; }
  .seccion__sede h3 {
    color: #01c38e;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -2.24px;
    line-height: 40.42px; }
  .seccion__sede p {
    color: white;
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px; }
  .seccion__sede a {
    text-decoration: none;
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px;
    color: #111212;
    padding: 4px 14px;
    border-radius: 10px;
    background-color: #01c38e;
    border: 1px solid #01c38e; }
    .seccion__sede a:hover {
      background-color: transparent;
      color: #01c38e;
      transition: all 1.4s ease; }

/* ---------- Style quienes-somos(nuestra esencia) ----------*/
/* ---------- Style Linea de Tiempo ---------- */
.seccion__tiempo {
  list-style-type: none;
  height: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 0; }
  .seccion__tiempo li {
    height: 250px;
    margin-bottom: 30px; }
    .seccion__tiempo li p {
      margin-top: 10px;
      text-decoration: none;
      color: white; }

.seccion__fecha {
  padding: 9% 0; }
  .seccion__fecha article {
    width: 100%;
    padding: 0 15%;
    height: auto; }
  .seccion__fecha:not(:last-child)::after {
    content: "";
    position: absolute;
    margin: 0 auto;
    margin-top: 20px;
    height: 100px;
    width: 5px;
    background-color: #01c38e;
    border-radius: 10px; }
  .seccion__fecha:not(:first-child)::before {
    content: "";
    position: absolute;
    background-color: #01c38e; }

/* ---------- Fin Style Linea de Tiempo ---------- */
.seccion__empleados {
  margin-top: 3rem; }

.seccion__personal {
  padding: 10px 0;
  width: 16rem;
  height: 22rem; }

.seccion__presentacion {
  width: 90%;
  height: auto;
  margin: 30px auto 30px auto; }

.seccion__perfil {
  position: relative;
  width: 50%;
  margin: 0 auto 0 auto;
  filter: grayscale(0.5);
  border-radius: 50%;
  z-index: -1; }

.seccion__foto--gradient {
  content: " ";
  position: relative;
  width: 8rem;
  height: 8rem;
  top: -7.5rem;
  left: 3rem;
  border: 50%;
  background: radial-gradient(circle, transparent 0%, rgba(17, 18, 18, 0.808) 40%, #111212 70%, #111212 100%);
  z-index: 0;
  margin-bottom: -8rem; }

.seccion__cuerpo h3 {
  margin-bottom: 7px; }

.seccion__stack {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin: 10px auto; }
  .seccion__stack i {
    font-size: 30px;
    margin: 0 10px;
    opacity: 0.6;
    color: #01c38e; }

/* ---------- Style Footer ---------- */
.contacto {
  padding: 0 5%;
  height: auto;
  text-align: center; }
  .contacto__secciones {
    margin: 5vw 0;
    width: 100%; }
  .contacto img {
    width: 10rem; }
  .contacto__lista {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    width: auto;
    padding: 0;
    margin: 15px 0; }
  .contacto__item {
    margin: 10px;
    width: auto;
    height: auto;
    list-style: none;
    text-align: center; }
    .contacto__item a {
      text-decoration: none;
      color: #01c38e;
      margin: 50px 0;
      font-size: 0.9rem;
      font-weight: 400;
      letter-spacing: normal;
      line-height: 20px; }
      .contacto__item a i {
        font-size: 1.7rem; }
      .contacto__item a:hover {
        color: white;
        transition: all 1s ease; }
  .contacto__provincias {
    margin-top: 40px; }
    .contacto__provincias .col-2 {
      margin: 10px 0; }
  .contacto__subtitulo {
    margin-bottom: 10px;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -2.24px;
    line-height: 40.42px;
    color: #01c38e; }
  .contacto__direccion, .contacto__telefono {
    margin: 10px 0; }
  .contacto i {
    color: #01c38e; }
  .contacto__enlaces {
    text-decoration: none;
    color: white;
    margin: 50px 0;
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px; }
    .contacto__enlaces:hover {
      color: #01c38e;
      transition: all 1s ease; }

.legales {
  padding: 0% 4% 1% 4%;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-evenly;
  flex-wrap: wrap; }
  .legales__lista {
    width: 40rem;
    display: block;
    padding: 0; }
  .legales__item {
    width: 10rem;
    margin: 0 auto;
    justify-content: space-between;
    text-align: center;
    list-style: none; }
  .legales__enlaces {
    text-decoration: none;
    color: #01c38e;
    width: auto;
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px; }
    .legales__enlaces:hover {
      color: white;
      transition: all 1s ease; }
  .legales__derechos {
    text-align: center;
    color: #01c38e;
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 20px; }

/*Diseño responsive(Media Query mayor a 480px)*/
@media screen and (min-width: 480px) {
  /*Style Home*/
  .encabezado--error img {
    width: 80%; }
  .seccion__orden img {
    height: 4rem; }
  .seccion__ilustracion img {
    filter: blur(2px);
    opacity: 0.2; } }

/*Diseño responsive(Media Query mayor a 600px)*/
@media screen and (min-width: 600px) {
  .seccion {
    padding: 6%; }
    .seccion__articulo {
      padding: 10%; }
    .seccion__portfolio {
      margin: -100px 0 50px 0; }
      .seccion__portfolio .seccion__mockup img {
        width: 75%; }
      .seccion__portfolio article {
        padding: 0 4%; }
    .seccion__galeria {
      grid-template-areas: "primero segundo segundo tercero" "cuarto  cuarto  quinto  sexto" "septimo octavo  noveno  noveno";
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: repeat(3, 8rem);
      grid-row-gap: 10px;
      grid-column-gap: 10px; }
    .seccion__orden img {
      height: 5rem; }
    .seccion__descripcion {
      width: 80%; }
  .legales__lista {
    width: 40rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap; } }

/*Diseño responsive(Media Query mayor a 768px)*/
@media screen and (min-width: 768px) {
  .encabezado__articulo {
    width: 80%; }
  .encabezado__titulo {
    font-size: 3rem;
    line-height: 52px; }
  .encabezado__texto {
    font-size: 1.05rem; }
  .encabezado__boton, .seccion__boton {
    font-size: 1.25rem; }
  .encabezado--error {
    height: 100vh; }
    .encabezado--error img {
      width: 55%; }
  .seccion {
    padding: 5%;
    text-align: center; }
    .seccion__articulo {
      padding: 15%; }
    .seccion__titulo, .contacto__titulo {
      font-size: 2.4rem; }
    .seccion__subtitulo {
      font-size: 1.4rem; }
    .seccion__sede h3 {
      font-size: 1.4rem; }
    .seccion__sede p {
      font-size: 0.9rem; }
    .seccion__sede a {
      font-size: 0.75rem; }
    .seccion__texto {
      font-size: 0.9rem; }
    .seccion__descripcion {
      width: 70%; }
    .seccion__orden img {
      font-size: 6rem; }
    .seccion__entrada {
      width: 60%; }
    .seccion__fieldset label {
      font-size: 1.05rem; }
    .seccion__galeria {
      grid-template-rows: repeat(3, 8rem); }
      .seccion__galeria h3 {
        font-size: 1.05rem; }
      .seccion__galeria p {
        font-size: 0.9rem; }
    .seccion__legales {
      width: 75%; }
  .contacto__subtitulo {
    font-size: 1.4rem; }
  .contacto__enlaces {
    font-size: 0.9rem; }
  .legales__enlaces, .legales__derechos {
    font-size: 0.9rem; } }

@media screen and (min-width: 992px) {
  .offcanvas, .offcanvas-body, .offcanvas-header {
    background-color: rgba(0, 0, 0, 0); }
  .navbar__boton {
    display: none; }
  .navbar-nav {
    justify-content: end;
    flex-grow: 1; }
  .offcanvas-body {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between; }
  .nav-item {
    margin: 0 0 0 10px; }
    .nav-item a {
      font-size: 1.05rem;
      font-weight: 400;
      letter-spacing: normal;
      line-height: 20px; }
  .dropdown-menu .dropdown-item {
    text-align: left; }
  .navbar__redes, .navbar__legales {
    display: none; }
  .encabezado--error img {
    width: 40%; }
  .seccion__clientes--wrap {
    width: 80%;
    margin: 40px auto 0; }
  .seccion__etapa {
    margin: 10% auto;
    width: 80%; }
  .seccion__area {
    width: 80%;
    height: 19rem; }
  .seccion__portfolio {
    margin: -80px 0 0 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center; }
    .seccion__portfolio .seccion__mockup {
      display: inline;
      width: 40%; }
      .seccion__portfolio .seccion__mockup img {
        width: 100%; }
    .seccion__portfolio article {
      width: 40%; }
      .seccion__portfolio article h2, .seccion__portfolio article p {
        text-align: left; }
  .seccion__ilustracion {
    position: static;
    z-index: 0; }
    .seccion__ilustracion img {
      max-height: 50vh;
      max-width: 80%;
      opacity: 0.3;
      filter: blur(3px); }
  .seccion__ilustracion img {
    filter: blur(0px);
    opacity: 1; } }

/*Diseño responsive(Media Query mayor a 1024px)*/
@media screen and (min-width: 1024px) {
  .encabezado__articulo {
    width: 62%;
    padding-left: 7%; }
  .encabezado__titulo {
    font-size: 3.6rem;
    line-height: 64px; }
  .encabezado__boton, .seccion__boton {
    font-size: 1.05rem;
    letter-spacing: normal; }
  .seccion {
    padding: 4%; }
    .seccion__articulo {
      padding: 17%; }
    .seccion__titulo, .contacto__titulo {
      font-size: 3rem; }
    .seccion__subtitulo {
      font-size: 1.8rem; }
    .seccion__entrada {
      width: 50%; }
    .seccion__datos {
      width: 50%; }
      .seccion__datos .seccion__entrada {
        width: 80%; }
    .seccion__confirmar {
      width: 50%;
      margin: 0 auto; }
    .seccion__galeria {
      grid-template-areas: "primero primero segundo segundo segundo segundo tercero tercero" "primero primero segundo segundo segundo segundo tercero tercero" "cuarto  cuarto  cuarto  cuarto  quinto  quinto  tercero tercero" "cuarto  cuarto  cuarto  cuarto  quinto  quinto  noveno  noveno" "sexto   sexto   septimo septimo octavo  octavo  noveno  noveno" "sexto   sexto   septimo septimo octavo  octavo  noveno  noveno";
      grid-template-columns: repeat(8, 1fr);
      grid-template-rows: repeat(6, 5rem);
      grid-row-gap: 10px;
      grid-column-gap: 10px; }
    .seccion__tiempo {
      list-style-type: none;
      max-width: 100%;
      padding: 0;
      margin: 0 auto; }
      .seccion__tiempo li p {
        margin-top: 20px; }
    .seccion__fecha {
      float: left;
      position: relative;
      text-align: center;
      width: 25%;
      margin-bottom: 10px;
      padding: 3% 1.5%; }
      .seccion__fecha:not(:last-child)::after {
        top: 59%;
        right: 0;
        margin-top: 0;
        width: 15%;
        height: 5px;
        border-radius: 10px 0 0 10px; }
      .seccion__fecha:not(:first-child)::before {
        top: 59%;
        left: 0;
        width: 15%;
        height: 5px;
        border-radius: 0 10px 10px 0; }
      .seccion__fecha article {
        width: 100%;
        margin-top: 30px; }
    .seccion__contenedor {
      margin-bottom: 50px; }
  .contacto__subtitulo {
    font-size: 1.25rem; }
  .legales__enlaces, .legales__derechos {
    font-size: 0.9rem; } }

/*Diseño responsive(Media Query mayor a 1200px)*/
@media screen and (min-width: 1200px) {
  .seccion__articulo {
    padding: 20%; }
  .seccion__etapa {
    width: 70%; } }