:root {
  --color4: #0a0a0a;
  --m: 1rem;
  --color1: #253b7a;
  --color2: #954034;
  --xl: 2.5rem;
  --xs: .8rem;
  --color3: #828487;
  --l: 1.5rem;
  --xxl: 3rem;
  --s: .9rem;
}

p {
  color: var(--color4);
  font-size: var(--m);
  margin-bottom: 10px;
}

.main {
  width: 100%;
  height: auto;
}

.seccion {
  flex-flow: wrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 50vh;
  display: flex;
}

.seccion.hero {
  opacity: 1;
  background-color: #fff;
  min-height: 100svh;
  position: relative;
  overflow: hidden;
}

.seccion.var {
  background-color: var(--color1);
  flex-flow: wrap;
}

.seccion.franja {
  background-color: #fafafa;
  align-items: stretch;
  min-height: 0;
}

.seccion.contacto {
  background-color: var(--color1);
  background-image: linear-gradient(180deg, transparent, var(--color4));
}

.seccion.footer {
  background-color: var(--color4);
  min-height: 0;
  padding-bottom: 2rem;
}

.seccion.hero2 {
  background-color: var(--color1);
  opacity: 1;
  background-image: none;
  background-repeat: repeat;
  background-size: auto;
  justify-content: center;
  align-items: flex-end;
  min-height: 0;
  position: relative;
}

.contenedor {
  flex-flow: wrap;
  justify-content: space-between;
  align-items: center;
  width: 90%;
  max-width: 1420px;
  margin-top: 4rem;
  margin-bottom: 4rem;
  display: flex;
  position: relative;
}

.contenedor.hero {
  z-index: 998;
  justify-content: center;
  width: 90%;
  max-width: none;
}

.contenedor.nav {
  justify-content: space-between;
  width: 100%;
  max-width: none;
  margin: 0 0;
  padding: 0;
}

.contenedor.clientes {
  border-radius: 20px;
  flex-flow: wrap;
  justify-content: space-between;
  align-items: stretch;
  overflow: visible;
}

.contenedor.productos {
  width: 90%;
  max-width: 1420px;
  margin-top: 2rem;
}

.contenedor.titulo {
  text-align: center;
  width: 50%;
  margin-top: 8rem;
  margin-left: auto;
  margin-right: auto;
}

.contenedor.sm {
  margin-top: 0;
  margin-bottom: 0;
}

.btn {
  color: #fff;
  background-color: #0000;
  border: 1px solid #fff;
  border-radius: 500px;
  justify-content: center;
  align-items: center;
  width: auto;
  height: auto;
  padding: 10px 20px;
  text-decoration: none;
  transition: all .42s;
  display: flex;
}

.btn:hover {
  background-color: var(--color2);
}

.btn.hero {
  background-color: var(--color2);
  color: #fff;
  margin-left: 0;
  margin-right: auto;
}

.btn.hero:hover {
  background-color: var(--color1);
}

.btn.catalog {
  background-color: var(--color2);
  color: #fff;
  margin-top: .5rem;
  margin-left: auto;
  margin-right: auto;
}

.btn.catalog:hover {
  background-color: var(--color1);
}

.h1 {
  color: #fff;
  width: 100%;
  font-family: Poppins, sans-serif;
  font-size: var(--xl);
  text-align: left;
  margin-top: 0;
  margin-bottom: 2rem;
  font-weight: 700;
  line-height: 1.2em;
}

.h1._2 {
  text-align: center;
  margin-bottom: 1rem;
}

.body {
  font-family: Montserrat, sans-serif;
  font-size: var(--m);
  line-height: 1.4em;
}

.image {
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 10px;
}

.navbar {
  background-color: var(--color1);
  background-image: none;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  flex-flow: wrap;
  place-content: center space-between;
  align-items: center;
  width: 95%;
  max-width: none;
  height: auto;
  margin-left: 2.5%;
  margin-right: 2.5%;
  padding-left: 0;
  padding-right: 1rem;
  display: flex;
  position: fixed;
  inset: 0% auto auto;
}

.brand {
  justify-content: center;
  align-items: center;
  width: auto;
  height: 6rem;
  margin: 0;
  padding: 1rem;
  display: flex;
}

.brand.w--current {
  height: 6rem;
  padding: 1rem;
}

.nav-link {
  color: #fff;
  font-size: var(--xs);
  text-transform: uppercase;
  margin-left: 5px;
  margin-right: 5px;
  padding-top: 10px;
  padding-bottom: 10px;
  transition: all .35s;
}

.nav-link:hover {
  color: var(--color1);
  background-color: #fff;
  border-radius: 500px;
}

.nav-link.w--current {
  color: var(--color3);
}

.nav-link.mid.w--current {
  color: #828487;
}

.nav-link.top.w--current {
  color: #fff;
}

.nav-link.top.w--current:hover {
  color: var(--color1);
}

.cont-titulo {
  color: #fff;
  border-bottom: .5px solid #ffffff80;
  width: 90%;
  max-width: 1420px;
  margin-top: 3rem;
  margin-bottom: 0;
  padding: 1rem;
  display: flex;
}

.cont-titulo.var {
  border-bottom-color: var(--color2);
}

.cont-titulo.var2 {
  border-bottom-color: var(--color2);
  align-items: center;
}

.col50 {
  flex-flow: wrap;
  justify-content: center;
  align-items: center;
  width: 50%;
  min-height: 50vh;
  display: flex;
  position: relative;
}

.col50.margin {
  padding: 2rem;
  position: relative;
}

.col50.contacto {
  flex-flow: wrap;
  align-content: center;
  padding: 2rem;
  display: flex;
  position: relative;
}

.col50.imagen {
  width: 50%;
  position: relative;
}

.col50.column {
  border: 1px solid var(--color1);
  background-color: #fff;
  border-radius: 20px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  width: 48%;
  min-height: 0;
  padding: 3rem;
}

.h2 {
  color: #fff;
  font-family: Poppins, sans-serif;
  font-size: var(--xl);
  margin-top: auto;
  margin-bottom: 2rem;
  font-weight: 300;
  line-height: 1.2em;
}

.h2._80 {
  width: 80%;
  color: var(--color1);
  text-align: left;
  margin: 0 auto 2rem 0%;
  font-size: 2rem;
}

.h2.var {
  width: 80%;
  color: var(--color1);
  text-align: center;
  margin: 0 auto 3rem;
  font-size: 2rem;
}

.h2.hero {
  font-size: var(--l);
  margin-top: 0;
  margin-bottom: 2rem;
  margin-right: auto;
}

.parrafo-ngo {
  width: 100%;
  color: var(--color4);
  margin-bottom: 1rem;
}

.parrafo-ngo.centrado {
  text-align: center;
}

.cont-stats {
  flex-flow: wrap;
  width: auto;
  display: flex;
}

.stats {
  color: #fff;
  flex-flow: column;
  justify-content: space-around;
  align-items: center;
  width: auto;
  max-width: 50%;
  margin-bottom: 2rem;
  display: flex;
}

.stat-1 {
  color: #fff;
  width: auto;
  min-width: 50%;
  height: auto;
  font-family: Poppins, sans-serif;
  font-size: var(--xxl);
  margin-right: 40px;
  font-weight: 800;
  line-height: 1.8em;
}

.stat-2 {
  background-color: var(--color2);
  text-align: left;
  border-radius: 10px;
  width: auto;
  height: auto;
  padding: 10px;
}

.rojo {
  width: auto;
  color: var(--color2);
}

.imagen-1 {
  object-fit: contain;
  width: 100%;
  height: 140%;
  margin-left: auto;
  position: absolute;
  inset: auto 0% 0%;
}

.ficha {
  aspect-ratio: 1;
  opacity: 1;
  background-color: #0000;
  border: 1px solid #0000;
  border-radius: 10px;
  flex-flow: wrap;
  justify-content: center;
  align-items: center;
  width: 32.5%;
  height: auto;
  min-height: 0;
  margin: 0 auto 1rem;
  padding: 0;
  transition: all .4s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.ficha:hover {
  border: .5px solid var(--color2);
  background-color: #95403426;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}

.txt-ficha {
  z-index: 998;
  width: 80%;
  color: var(--color1);
  text-align: left;
  text-transform: capitalize;
  margin-top: auto;
  margin-bottom: auto;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.2em;
  position: absolute;
  top: 1.5rem;
  bottom: auto;
  left: 1rem;
}

.txt {
  color: #fff;
  text-align: left;
  flex-flow: row;
  width: auto;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Poppins, sans-serif;
  font-size: 1.6rem;
  font-weight: 300;
  line-height: 1.2em;
  display: flex;
}

.form-block {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.text-field {
  color: #fff;
  font-size: var(--s);
  background-color: #0000;
  border-radius: 20px;
}

.text-field::placeholder {
  color: #fff;
}

.text-field.var {
  border-radius: 20px;
  min-height: 100px;
}

.mapa {
  width: 100%;
  min-height: 300px;
  margin-top: 2rem;
  margin-bottom: 2rem;
  display: flex;
}

.logo {
  width: auto;
  height: 7rem;
  margin-left: 1rem;
}

.logo.var {
  height: 3.5rem;
  margin-top: 0;
}

.info-contacto {
  color: #fff;
  flex-flow: wrap;
  justify-content: space-between;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.logo-footer {
  width: 4rem;
  height: 4rem;
  margin-bottom: 0;
  margin-right: 0;
}

.col-footer {
  flex-flow: column;
  margin-left: 4rem;
  margin-right: 0;
  display: flex;
}

.col-footer.hide {
  display: none;
}

.link-footer {
  color: #fff;
  font-size: var(--s);
  margin-top: 0;
  margin-bottom: 0;
  text-decoration: none;
  transition: all .35s;
  display: inline-block;
}

.link-footer:hover {
  color: var(--color3);
}

.link-footer.hide {
  display: none;
}

.cont-col-footer {
  margin-right: auto;
  display: flex;
}

.cont-col-footer.var {
  flex-flow: column;
  margin-left: auto;
  margin-right: 0;
}

.cont-rrss {
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.icono-rrss {
  aspect-ratio: 1;
  filter: brightness(10000%);
  object-fit: contain;
  width: 2rem;
  height: auto;
  margin-left: 10px;
  transition: opacity .35s;
}

.icono-rrss:hover {
  opacity: .5;
  filter: brightness(200%);
}

.rrss {
  aspect-ratio: 1;
  width: auto;
  height: auto;
  padding: 0;
}

.copyright {
  color: #fff;
  font-size: var(--s);
  text-align: right;
}

.paragraph {
  color: #fff;
  margin-bottom: auto;
}

.field-wrapper {
  flex-flow: wrap;
  justify-content: space-between;
  width: 100%;
  height: auto;
  display: flex;
}

.input {
  color: #1a1a1a;
  background-color: #0000;
  border: 1px solid #000;
  border-radius: 25px;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  height: auto;
  margin-bottom: .5rem;
  margin-left: 0;
  margin-right: 0;
  padding: .5rem 1rem;
  font-size: 1rem;
  line-height: 1.2em;
  display: block;
}

.input::placeholder {
  color: #1a1a1a;
}

.input.var {
  background-color: #f8f8f8;
}

.input.var::placeholder {
  color: #929292;
}

.input.var.work-mail {
  background-color: #0000;
  border-color: #fff;
  display: none;
}

.input.var.work-mail::placeholder {
  color: #fff;
  font-size: .9rem;
  font-weight: 100;
}

.paragraph-2, .paragraph-3 {
  color: #fff;
  width: 45%;
}

.nav-menu {
  margin-left: auto;
  margin-right: 2rem;
}

.text-block {
  color: #fff;
}

.image-2 {
  width: 100%;
  height: 100%;
}

.whats-card-2 {
  z-index: 99999;
  -webkit-text-stroke-color: #000;
  background-color: #42ce4f;
  border: 2px #fff;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  width: auto;
  height: auto;
  margin-top: 5px;
  margin-bottom: .2rem;
  margin-left: 0;
  padding: .5rem 1rem;
  text-decoration: none;
  transition: background-color .2s;
  display: flex;
  position: fixed;
  bottom: 20px;
  left: auto;
  right: 20px;
}

.whats-card-2:hover {
  background-color: #000;
}

.cont_whats-2 {
  align-items: center;
  height: auto;
  padding-right: 10px;
  display: flex;
}

.img_whats-2 {
  height: 1.5rem;
  padding-right: 0;
}

.text_whaatsapp-2 {
  color: #fff;
  text-align: left;
  letter-spacing: .5px;
  text-transform: uppercase;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1em;
}

.simbolo {
  width: auto;
  height: 3rem;
  margin-left: auto;
}

.data-group {
  color: var(--color3);
  margin-bottom: 1rem;
}

.data-group._2 {
  margin-top: 1rem;
}

.filter-btn {
  width: 100%;
  color: var(--color1);
  background-color: #0000;
  border: 1px #0000;
  padding: 5px 0;
}

.filter-clear {
  background-color: var(--color2);
  color: #fff;
  border-radius: 500px;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  margin-top: 1rem;
  margin-bottom: 0;
  padding-left: 15px;
  padding-right: 15px;
  display: flex;
}

.filter-clear:hover {
  background-color: var(--color1);
  color: #fff;
}

.filtros {
  border: 1px solid var(--color3);
  background-color: #0000;
  border-radius: 10px;
  width: 18%;
  max-width: 18%;
  margin-top: 0;
  margin-bottom: auto;
  padding: 1rem;
  position: sticky;
}

.cont_filtros {
  width: auto;
  height: auto;
}

.col70 {
  flex-flow: wrap;
  place-content: flex-start center;
  align-items: center;
  width: 80%;
  height: auto;
  display: flex;
}

.producto {
  aspect-ratio: auto;
  background-color: #253b7a26;
  border: 1px solid #0000;
  border-radius: 10px;
  flex-flow: wrap;
  place-content: space-between center;
  align-items: center;
  width: 48%;
  height: auto;
  min-height: 250px;
  max-height: 250px;
  margin: 0 auto 1rem;
  padding: 0;
  transition: all .4s;
  display: flex;
  position: relative;
  bottom: auto;
  overflow: hidden;
}

.producto:hover {
  border-style: solid;
  border-color: var(--color2);
  background-color: #0000;
  border-radius: 10px;
}

.producto._1 {
  justify-content: center;
  align-items: stretch;
  width: 32%;
  min-height: 350px;
  max-height: 350px;
  margin-left: 0;
}

.producto._3 {
  background-color: #0000;
  border-style: none;
  place-content: center;
  align-items: center;
  width: 32%;
  min-height: 350px;
  max-height: 350px;
  margin-left: 0;
  display: flex;
  position: static;
}

.producto._3:hover {
  border-style: none;
  border-width: 0;
}

.txt-producto {
  z-index: 998;
  width: 100%;
  color: var(--color1);
  margin-bottom: .5rem;
  margin-right: auto;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.2em;
  position: static;
  top: 20px;
  left: 20px;
}

.cont-txt-producto {
  z-index: 998;
  background-color: #0000;
  border: 1px #d6d6d666;
  border-radius: 10px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  margin: 0 auto 0 0;
  padding: 1rem;
  display: flex;
  position: static;
  top: 0;
  bottom: auto;
  right: auto;
}

.codigo {
  width: auto;
  color: var(--color3);
  font-size: var(--s);
  text-transform: uppercase;
  margin-right: auto;
  font-style: italic;
  line-height: 1.2em;
}

.modelo {
  width: 100%;
  color: var(--color3);
  font-size: var(--s);
  margin-bottom: 0;
  margin-left: 0;
  margin-right: auto;
  font-weight: 400;
  line-height: 1.2em;
}

.cont-producto {
  flex-flow: wrap;
  place-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: auto;
  display: flex;
}

.text-span {
  color: var(--color1);
  font-weight: 700;
}

.quote {
  width: auto;
  color: var(--color1);
  text-align: left;
  flex-flow: column;
  margin: 0 auto 0 0;
  font-family: Poppins, sans-serif;
  font-size: 1.6rem;
  font-weight: 300;
  line-height: 1.2em;
  display: flex;
}

.img-producto {
  z-index: 998;
  aspect-ratio: 1;
  object-fit: contain;
  width: auto;
  max-width: none;
  height: 50%;
  margin-top: auto;
  margin-bottom: auto;
  position: relative;
  inset: auto;
  overflow: visible;
}

.img-producto.grayscale {
  opacity: 0;
  filter: grayscale();
  height: 70%;
  margin-bottom: 1rem;
  display: block;
  bottom: auto;
}

.img-producto.abs {
  height: 60%;
  margin-bottom: 2rem;
  padding-top: 0;
  padding-bottom: 0;
  position: absolute;
}

.background {
  background-image: linear-gradient(166deg, transparent 39%, var(--color1) 84%), url('../images/background.webp');
  background-position: 0 0, 50% 20%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-attachment: scroll, fixed;
  width: 100%;
  height: 100%;
  min-height: 100%;
  position: absolute;
}

.col {
  flex-flow: wrap;
  justify-content: center;
  align-items: center;
  width: 50%;
  min-height: 50vh;
  display: flex;
  position: relative;
}

.col.hero {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 40%;
  min-height: 0;
  margin-left: 5%;
  margin-right: auto;
}

.img-hero {
  z-index: 998;
  filter: none;
  object-fit: contain;
  width: auto;
  height: 300px;
  min-height: 220px;
  max-height: 40%;
  display: none;
  position: absolute;
  bottom: 8rem;
  right: 6rem;
}

.img-hero.var {
  padding: 0;
  display: block;
  bottom: auto;
}

.parrafo-bco {
  color: #fff;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.parrafo-bco.centro {
  text-align: center;
  width: 85%;
}

.col25 {
  z-index: 998;
  border: 1px none var(--color2);
  background-color: #fff;
  border-radius: 0;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 25%;
  height: auto;
  min-height: 300px;
  margin-left: auto;
  margin-right: auto;
  padding: 2rem;
  display: flex;
  position: static;
}

.col25.fill {
  background-color: var(--color2);
  justify-content: flex-start;
  align-items: center;
  width: 25%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  transition: all .4s;
  position: relative;
}

.col25.fill:hover {
  background-color: var(--color2);
}

.cont-columnas {
  border-radius: 10px;
  flex-flow: wrap;
  justify-content: center;
  align-items: stretch;
  height: auto;
  min-height: 200px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.subtitulo {
  color: #fff;
  font-size: var(--l);
  text-align: center;
  margin-bottom: 1rem;
  font-weight: 800;
}

.subtitulo.var {
  color: var(--color1);
  text-align: center;
}

.columna {
  background-color: var(--color2);
  border-radius: 10px;
  width: 49%;
  min-height: 350px;
  margin-bottom: 1rem;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  overflow: hidden;
}

.cont-img-producto {
  aspect-ratio: auto;
  background-color: #0000;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  margin-bottom: 0;
  padding-bottom: 0;
  transition: all .4s;
  display: flex;
  position: absolute;
}

.cont-img-producto:hover {
  filter: contrast(118%) grayscale();
  background-color: #fff;
  transform: scale(1.1);
}

.cont-img-producto.var {
  aspect-ratio: auto;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  height: auto;
  min-height: 220px;
  margin-bottom: 0;
  padding-bottom: 0;
  position: static;
}

.cont-img-producto.var:hover {
  transform: scale(1.1);
}

.cont-img-producto.var2 {
  aspect-ratio: auto;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  height: auto;
  min-height: 220px;
  margin-bottom: 0;
  padding-bottom: 0;
  position: static;
}

.cont-img-producto.var2:hover {
  transform: scale(1.1);
}

.filter {
  background-color: var(--color1);
  opacity: 0;
  mix-blend-mode: color;
  width: 100%;
  height: 100%;
  position: absolute;
}

.imagen {
  z-index: 998;
  aspect-ratio: auto;
  object-fit: contain;
  width: 100%;
  max-width: none;
  height: auto;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: -10rem;
  position: absolute;
  inset: auto auto 1rem;
  overflow: visible;
}

.imagen._2 {
  width: 75%;
  height: auto;
  margin-bottom: 4rem;
  margin-left: auto;
  margin-right: auto;
  position: static;
  bottom: 4rem;
}

.imagen._1 {
  object-fit: contain;
  width: auto;
  height: auto;
  max-height: 180px;
  margin-bottom: 2rem;
  margin-left: 0;
  position: static;
  left: auto;
  right: auto;
}

.imagen._4 {
  width: auto;
  height: 50%;
  max-height: 250px;
  margin-left: auto;
  margin-right: auto;
  position: static;
  bottom: auto;
}

.imagen._3 {
  width: 60%;
  margin-left: 0;
  bottom: auto;
}

.flag {
  background-image: url('../images/usa.webp');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: 500px;
  width: 2rem;
  height: 2rem;
  display: none;
}

.txt-ficha_parrafo {
  z-index: 998;
  width: 80%;
  color: var(--color1);
  text-align: left;
  text-transform: none;
  margin-top: auto;
  margin-bottom: auto;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.2em;
  position: absolute;
  top: 3.3rem;
  bottom: auto;
  left: 1rem;
}

.cont_div_ico {
  aspect-ratio: 1;
  background-color: #fff;
  border-radius: 500px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: auto;
  display: flex;
  position: absolute;
  bottom: 1rem;
  right: 1rem;
}

.ico_download {
  filter: brightness(2000%);
  width: 1.5rem;
  height: auto;
  margin-left: 1rem;
}

.circulo {
  z-index: 998;
  border: 2px none var(--color1);
  background-color: #fff;
  border-radius: 500px;
  justify-content: center;
  align-items: center;
  width: 8rem;
  height: 8rem;
  margin-bottom: 2rem;
  display: flex;
  position: static;
  overflow: hidden;
}

.circulo.var {
  background-color: var(--color2);
  border-style: none;
  width: 7rem;
  height: 7rem;
  margin-bottom: 2rem;
  position: static;
}

.icono {
  width: 50%;
  height: auto;
}

.card {
  border: 2px solid var(--color3);
  border-radius: 20px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 32%;
  min-height: 420px;
  padding: 2rem;
  transition: all .4s;
  display: flex;
}

.card:hover {
  border-color: var(--color2);
  background-color: #fff;
}

.txt-columna {
  flex-flow: column;
  width: 90%;
  display: flex;
}

.columna-filter {
  width: auto;
  height: auto;
}

.catalogo {
  background-color: var(--color2);
  color: #fff;
  font-size: var(--s);
  border-radius: 200px;
  margin-top: 5px;
  margin-right: auto;
  padding: 5px 20px;
  text-decoration: none;
  display: block;
}

.catalogo:hover {
  background-color: var(--color1);
}

@media screen and (max-width: 991px) {
  .seccion.hero {
    background-image: linear-gradient(90deg, #fff 16% 52%, #0000), url('../images/pexels-chris-perez-briones-1826806-6222952.webp');
    background-position: 0 0, 100%;
    background-repeat: repeat, no-repeat;
    background-size: auto, contain;
  }

  .contenedor {
    justify-content: space-between;
    align-items: flex-start;
    width: 90%;
    margin-top: 3rem;
    margin-bottom: 3rem;
  }

  .contenedor.hero {
    width: 90%;
  }

  .contenedor.nav {
    justify-content: space-between;
    align-items: center;
    margin-top: 0;
    margin-bottom: 0;
  }

  .contenedor.titulo {
    width: 85%;
  }

  .btn {
    width: 100%;
  }

  .btn.catalog {
    width: auto;
  }

  .h1 {
    font-size: 2rem;
  }

  .navbar {
    z-index: 999;
    width: 95%;
    margin-left: 2.5%;
    margin-right: 2.5%;
    padding: 0;
  }

  .brand {
    height: 5rem;
    margin: 0;
  }

  .brand.w--current {
    height: 5rem;
  }

  .nav-link {
    background-color: var(--color1);
    border-radius: 0;
  }

  .nav-link:hover {
    color: var(--color2);
  }

  .nav-link.mid {
    margin: 0;
  }

  .nav-link.mid:hover {
    background-color: var(--color2);
    color: #fff;
    border-radius: 0;
  }

  .nav-link.bottom {
    margin: 0;
  }

  .nav-link.bottom:hover {
    background-color: var(--color2);
    color: #fff;
    border-radius: 0;
    margin: 0;
  }

  .nav-link.top {
    margin-left: 0;
    margin-right: 0;
  }

  .nav-link.top:hover {
    background-color: var(--color2);
    color: #fff;
    border-radius: 0;
  }

  .col50.contacto {
    padding: 1rem;
  }

  .col50.column {
    width: 49%;
    padding: 1.5rem;
  }

  .h2 {
    font-size: 1.8rem;
  }

  .h2._80, .h2.var {
    width: 100%;
  }

  .stat-1 {
    margin-right: 20px;
  }

  .ficha {
    aspect-ratio: 1;
    width: 48%;
    height: auto;
  }

  .txt {
    font-size: 1.2rem;
  }

  .form-block {
    width: 80%;
  }

  .logo {
    height: 5rem;
    margin-left: auto;
    margin-right: auto;
  }

  .logo.var {
    height: 3rem;
  }

  .info-contacto {
    width: 100%;
    height: auto;
    margin-bottom: 1rem;
  }

  .link-footer {
    margin-top: 0;
  }

  .icon {
    color: #fff;
  }

  .paragraph-2, .paragraph-3 {
    width: 100%;
  }

  .menu-button {
    margin-left: auto;
    padding: 0;
    right: 1rem;
  }

  .menu-button.w--open {
    background-color: #0000;
  }

  .nav-menu {
    z-index: 0;
    background-color: #0000;
    margin-right: auto;
  }

  .whats-card-2 {
    margin-top: 0;
    margin-bottom: 0;
    padding: .75rem 1rem;
    left: auto;
    right: 5%;
  }

  .cont_whats-2 {
    height: auto;
    padding-right: 1vw;
  }

  .img_whats-2 {
    height: 1.5rem;
  }

  .text_whaatsapp-2 {
    font-size: .8rem;
  }

  .data-group {
    width: 100%;
    margin-bottom: .5rem;
  }

  .data-group._2 {
    margin-top: 0;
  }

  .filter-btn {
    padding: 0;
    font-size: .8rem;
  }

  .filter-clear {
    width: auto;
    font-size: var(--xs);
    margin-top: auto;
    margin-bottom: auto;
    margin-right: auto;
  }

  .filtros {
    border-radius: 20px;
    justify-content: space-between;
    align-items: stretch;
    width: 100%;
    max-width: none;
    margin-bottom: 1rem;
    padding: 1rem;
    display: flex;
  }

  .cont_filtros._1 {
    flex-flow: wrap;
    width: auto;
    max-width: 50%;
    display: flex;
  }

  .cont_filtros._2 {
    width: auto;
    max-width: 30%;
    margin-right: auto;
  }

  .col70 {
    width: 100%;
    padding-left: 10px;
  }

  .producto {
    aspect-ratio: 1;
    width: 49%;
    margin-bottom: .5rem;
  }

  .producto._1 {
    min-height: 250px;
    max-height: 250px;
  }

  .producto._3 {
    background-color: #0000;
  }

  .txt-producto {
    font-size: .9rem;
  }

  .codigo {
    font-size: var(--xs);
  }

  .quote {
    width: auto;
    font-size: 1.2rem;
  }

  .img-producto {
    height: 70%;
    bottom: 5%;
    right: 5%;
  }

  .img-producto.grayscale {
    height: 60%;
    position: absolute;
    bottom: auto;
    right: auto;
  }

  .img-producto.abs {
    height: 60%;
    bottom: auto;
    right: auto;
  }

  .col.hero {
    width: 55%;
    margin-left: 0%;
  }

  .img-hero {
    width: 50%;
    height: 30%;
    right: 1rem;
  }

  .img-hero.var {
    object-fit: cover;
    width: auto;
  }

  .parrafo-bco.centro {
    font-size: var(--s);
  }

  .col25.fill {
    width: 50%;
    padding: 1rem;
  }

  .columna {
    width: 100%;
  }

  .cont-img-producto.var {
    min-height: 150px;
  }

  .cont-img-producto.var2 {
    min-height: 100px;
    margin-bottom: 1rem;
  }

  .imagen {
    height: 70%;
    bottom: 5%;
    right: 5%;
  }

  .imagen._2 {
    margin-bottom: auto;
  }

  .imagen._1 {
    width: 80%;
    max-height: 100px;
    margin-bottom: auto;
  }

  .imagen._4 {
    width: 60%;
    height: auto;
  }

  .imagen._3 {
    width: 60%;
    height: auto;
    right: auto;
  }

  .flag {
    margin-right: 2rem;
  }

  .circulo {
    width: 6rem;
    height: 6rem;
  }

  .card {
    min-height: 470px;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .columna-filter {
    max-width: 48%;
  }
}

@media screen and (max-width: 767px) {
  .seccion.hero2 {
    min-height: 0;
    padding-top: 0;
  }

  .contenedor.hero {
    align-content: flex-start;
    margin-top: 8rem;
  }

  .contenedor.clientes {
    justify-content: space-between;
    align-items: center;
  }

  .contenedor.productos {
    width: 95%;
  }

  .contenedor.titulo {
    width: 80%;
    margin-top: 6rem;
  }

  .h1 {
    width: 70%;
    font-size: 2rem;
  }

  .h1._2 {
    margin-left: auto;
    margin-right: auto;
  }

  .navbar {
    width: 95%;
    margin-left: 2.5%;
    margin-right: 2.5%;
  }

  .col50 {
    width: 100%;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
  }

  .col50.margin {
    width: 100%;
    height: auto;
    min-height: 0;
    margin-top: 0;
  }

  .col50.contacto {
    width: 100%;
    padding: 1rem;
  }

  .col50.imagen {
    margin-top: 0;
    position: static;
  }

  .col50.formulario {
    width: 100%;
  }

  .col50.column {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    min-height: 250px;
  }

  .h2._80 {
    margin-top: 0;
    font-size: 1.8rem;
  }

  .h2.var {
    margin-top: 0;
  }

  .h2.hero {
    width: 70%;
  }

  .parrafo-ngo {
    margin-bottom: auto;
  }

  .parrafo-ngo.centrado {
    text-align: left;
  }

  .imagen-1 {
    height: 400px;
  }

  .txt {
    width: 100%;
  }

  .logo {
    height: 6rem;
    margin-top: auto;
    margin-bottom: auto;
  }

  .logo.var {
    margin-top: auto;
    margin-bottom: auto;
  }

  .info-contacto {
    width: 100%;
    height: auto;
    margin-bottom: 1rem;
  }

  .col-footer {
    margin-left: 2rem;
  }

  .link-footer, .copyright {
    font-size: var(--xs);
  }

  .input {
    background-color: #0000;
  }

  .input.var {
    font-size: 1rem;
  }

  .paragraph-2 {
    width: 45%;
    height: auto;
  }

  .paragraph-3 {
    width: 50%;
  }

  .whats-card-2 {
    padding-left: .75rem;
    padding-right: .75rem;
  }

  .cont_whats-2 {
    height: 4vw;
  }

  .img_whats-2 {
    height: 1.5rem;
    padding-left: .5vw;
  }

  .text_whaatsapp-2 {
    font-size: .8rem;
  }

  .data-group {
    text-align: center;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 1rem;
    margin-bottom: .5rem;
    display: flex;
  }

  .data-group._2 {
    width: 100%;
    margin-top: 0;
  }

  .filter-btn {
    width: 100%;
    font-size: var(--xs);
    justify-content: flex-start;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    display: flex;
  }

  .filter-btn.var {
    width: auto;
    margin-right: 10px;
  }

  .filter-clear {
    width: auto;
    margin: auto;
    padding-left: 20px;
    padding-right: 20px;
  }

  .filter-clear.var {
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 0;
  }

  .filtros {
    border-radius: 20px;
    flex-flow: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: none;
    margin-bottom: 1rem;
    margin-left: auto;
    margin-right: auto;
    padding: 1rem;
    display: flex;
  }

  .cont_filtros {
    width: 48%;
    margin-bottom: auto;
  }

  .cont_filtros._1 {
    flex-flow: wrap;
    width: auto;
    margin-left: 0;
    margin-right: auto;
    display: flex;
  }

  .cont_filtros._2 {
    width: auto;
    margin-left: 0;
    margin-right: auto;
  }

  .cont_filtros.pararrayos {
    flex-flow: wrap;
    align-items: flex-start;
    width: 60%;
    margin-top: auto;
    margin-left: 0;
    margin-right: auto;
    display: flex;
  }

  .col70 {
    width: 100%;
  }

  .producto._3 {
    display: block;
  }

  .cont-producto {
    padding-left: 10px;
  }

  .quote {
    text-align: center;
    width: 100%;
    margin-top: 0;
    margin-bottom: 1rem;
    margin-left: auto;
  }

  .quote.var {
    margin-top: 0;
  }

  .img-producto {
    height: 60%;
  }

  .background {
    background-position: 0 0, 15% 15%;
  }

  .col {
    width: 50%;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
  }

  .col.hero {
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
  }

  .img-hero.var {
    height: 180px;
    min-height: 0;
    max-height: none;
    margin-top: 5rem;
    margin-left: auto;
    margin-right: auto;
    position: static;
  }

  .parrafo-bco {
    font-size: var(--s);
  }

  .parrafo-bco.centro {
    text-align: left;
    width: 90%;
    margin-left: 0;
  }

  .col25.fill {
    flex-flow: row;
    width: 100%;
    min-height: 150px;
    padding: 2rem;
  }

  .subtitulo, .subtitulo.var {
    text-align: left;
    font-size: 1.2rem;
  }

  .imagen {
    height: 60%;
  }

  .circulo {
    margin-bottom: 0;
  }

  .circulo.var {
    width: 6rem;
    height: 6rem;
    margin-bottom: 0;
  }

  .card {
    flex-flow: row;
    width: 100%;
    min-height: 200px;
    margin-bottom: 1rem;
    padding: 2rem;
  }

  .txt-columna {
    width: 75%;
    margin-left: auto;
  }

  .columna-filter {
    width: 48%;
  }
}

@media screen and (max-width: 479px) {
  .seccion.hero {
    background-image: linear-gradient(90deg, #fff 16% 63%, #0000), url('../images/pexels-chris-perez-briones-1826806-6222952.webp');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    place-content: flex-start center;
    align-items: flex-start;
    min-height: 85svh;
  }

  .contenedor {
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 2rem;
    margin-bottom: 2rem;
  }

  .contenedor.hero {
    width: 85%;
    margin-top: 8rem;
    margin-bottom: 4rem;
  }

  .contenedor.nav {
    padding: .5rem 1rem;
  }

  .contenedor.clientes {
    margin-top: 2rem;
  }

  .contenedor.footer {
    flex-flow: row;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 0;
    padding-left: 1rem;
  }

  .contenedor.productos {
    width: 95%;
    margin-top: 1rem;
    margin-bottom: 1rem;
  }

  .contenedor.titulo {
    width: 90%;
    margin-top: 7rem;
  }

  .btn {
    width: 100%;
  }

  .btn.hero {
    width: auto;
    margin-left: 0;
  }

  .btn.catalog {
    width: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
  }

  .h1 {
    text-align: left;
    width: 85%;
    font-size: 1.6rem;
  }

  .navbar {
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
  }

  .brand {
    padding: .75rem;
  }

  .brand.w--current {
    height: 3.5rem;
    padding: 5px;
  }

  .nav-link {
    background-color: var(--color1);
  }

  .nav-link:hover {
    color: var(--color2);
  }

  .nav-link.mid {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
  }

  .nav-link.bottom {
    border-bottom: 1px solid #fff;
  }

  .nav-link.top {
    border: 1px #000;
  }

  .cont-titulo {
    margin-top: 0;
  }

  .cont-titulo.var2 {
    width: 95%;
    margin-top: 1rem;
    padding: .5rem;
  }

  .col50 {
    width: 100%;
    min-height: 0;
    margin-bottom: 0;
  }

  .col50.margin {
    padding: 1rem;
  }

  .col50.contacto {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .col50.imagen {
    width: 80%;
    height: auto;
  }

  .col50.column {
    flex-flow: row;
    width: 100%;
    min-height: 150px;
    margin-bottom: 1rem;
    padding: 1rem;
  }

  .h2._80 {
    font-size: 1.2rem;
  }

  .h2.var {
    width: 90%;
    margin-bottom: 2rem;
    font-size: 1.4rem;
  }

  .h2.hero {
    width: 75%;
    font-size: var(--m);
    text-align: left;
    margin-left: 0;
  }

  .parrafo-ngo.centrado {
    text-align: center;
  }

  .cont-stats {
    justify-content: center;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .stat-1 {
    font-size: var(--xl);
  }

  .rojo {
    font-size: var(--s);
  }

  .imagen-1 {
    object-fit: cover;
    width: auto;
    margin-right: auto;
    position: relative;
  }

  .ficha {
    width: 48%;
    min-height: 300px;
    margin-bottom: .5rem;
    margin-left: auto;
    margin-right: auto;
  }

  .txt-ficha {
    width: 90%;
    font-size: var(--m);
    left: auto;
  }

  .txt {
    margin-bottom: 2rem;
    font-size: 1rem;
  }

  .form-block {
    width: 90%;
  }

  .mapa {
    margin-top: 0;
  }

  .logo {
    align-self: center;
    width: auto;
    height: 6rem;
    margin-top: auto;
  }

  .logo.var {
    filter: none;
    width: auto;
    height: 3rem;
    margin-top: auto;
  }

  .info-contacto {
    margin-bottom: 0;
  }

  .logo-footer {
    width: 18%;
    max-width: 20%;
    height: auto;
    margin-left: 0;
    margin-right: auto;
  }

  .col-footer {
    justify-content: center;
    align-items: center;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
  }

  .link-footer {
    text-align: left;
    width: 100%;
  }

  .cont-col-footer {
    flex-flow: wrap;
    width: 75%;
    max-width: 75%;
    margin-top: 0;
    margin-bottom: auto;
    margin-left: auto;
  }

  .cont-col-footer.var {
    width: 100%;
    max-width: 100%;
    margin-top: 2rem;
  }

  .cont-rrss {
    justify-content: center;
    align-items: center;
  }

  .copyright {
    text-align: center;
    line-height: 1.3em;
  }

  .paragraph {
    margin-bottom: 1rem;
  }

  .input.var {
    font-size: 1rem;
    line-height: 1.5em;
  }

  .paragraph-2 {
    width: 100%;
    height: auto;
    font-size: var(--s);
  }

  .paragraph-3 {
    width: 80%;
    font-size: var(--s);
  }

  .menu-button {
    width: auto;
  }

  .menu-button.w--open {
    background-color: #0000;
    height: auto;
  }

  .nav-menu {
    filter: drop-shadow(2px 2px 1px #00000080);
    background-color: #0000;
    border: 1px #000;
    width: 100%;
    height: auto;
  }

  .whats-card-2 {
    border-radius: 500px;
    margin: 0;
    padding: .75rem;
    left: auto;
    right: 5%;
  }

  .cont_whats-2 {
    width: 2rem;
    height: 2rem;
    padding-left: 0;
    padding-right: 0;
  }

  .img_whats-2 {
    width: 100%;
    height: 100%;
    padding-left: 0;
    padding-right: 0;
    font-size: 1rem;
  }

  .text_whaatsapp-2 {
    font-size: .8rem;
    display: none;
  }

  .simbolo {
    height: 2rem;
  }

  .data-group {
    width: 100%;
  }

  .filter-btn {
    width: 100%;
    font-size: var(--xs);
    text-align: left;
    justify-content: flex-start;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
  }

  .filter-clear {
    width: auto;
    font-size: var(--xs);
    margin-top: 1rem;
  }

  .filtros {
    padding: 1rem;
  }

  .cont_filtros._1 {
    flex-flow: wrap;
    width: auto;
    max-width: 55%;
    display: flex;
  }

  .cont_filtros._2 {
    width: auto;
    max-width: 35%;
  }

  .cont_filtros.pararrayos {
    width: auto;
    max-width: 48%;
  }

  .producto {
    width: 48%;
  }

  .producto._1 {
    width: 48%;
    min-height: 280px;
    max-height: none;
    margin-left: auto;
  }

  .producto._3 {
    width: 48%;
    margin-left: auto;
    display: none;
  }

  .txt-producto {
    font-size: var(--s);
  }

  .codigo {
    font-size: var(--xs);
  }

  .modelo {
    font-size: var(--s);
  }

  .cont-producto {
    padding-left: 0;
  }

  .quote {
    text-align: left;
    width: auto;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 0;
    font-size: 1rem;
  }

  .quote.var {
    width: auto;
    margin-top: auto;
  }

  .img-producto {
    height: 50%;
    bottom: 10%;
    right: 10%;
  }

  .img-producto.grayscale {
    width: 100px;
    height: auto;
  }

  .img-producto.abs {
    width: 80%;
    height: auto;
    padding-top: 0;
  }

  .background {
    background-image: linear-gradient(180deg, transparent 40%, var(--color1) 97%), url('../images/background.webp');
    background-position: 0 0, 32% 0;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, fixed;
  }

  .col {
    width: 100%;
    min-height: 0;
    margin-bottom: 2rem;
  }

  .col.hero {
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 4rem;
  }

  .img-hero {
    bottom: 3rem;
  }

  .img-hero.var {
    width: auto;
    height: 150px;
    min-height: 0;
    max-height: none;
    margin-left: auto;
    position: static;
    bottom: 0;
  }

  .parrafo-bco {
    font-size: var(--xs);
  }

  .parrafo-bco.centro {
    text-align: center;
    width: 100%;
  }

  .col25.fill {
    flex-flow: wrap;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    min-height: 0;
    padding: 1rem;
  }

  .subtitulo {
    text-align: center;
    font-size: 1.2rem;
  }

  .subtitulo.var {
    text-align: center;
  }

  .columna {
    flex-flow: wrap;
  }

  .cont-img-producto {
    aspect-ratio: auto;
    height: auto;
    min-height: 100%;
    max-height: none;
  }

  .cont-img-producto.var, .cont-img-producto.var2 {
    min-height: 160px;
    max-height: 160px;
    margin-bottom: 0;
  }

  .imagen {
    width: 80%;
    height: 50%;
    bottom: 10%;
    right: 10%;
  }

  .imagen._1 {
    left: auto;
  }

  .imagen._3 {
    width: 70%;
  }

  .flag {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 0;
  }

  .txt-ficha_parrafo {
    width: 90%;
    font-size: var(--s);
    top: 3rem;
    left: auto;
  }

  .txt-ficha_parrafo.var {
    top: 4rem;
  }

  .cont_div_ico {
    z-index: 998;
  }

  .ico_download {
    width: 1rem;
    margin-left: .5rem;
  }

  .circulo {
    aspect-ratio: 1;
    width: 25%;
    height: auto;
    margin-bottom: 0;
  }

  .icono {
    height: 50%;
  }

  .card {
    flex-flow: column;
  }

  .txt-columna {
    width: 100%;
    margin-top: 1rem;
    margin-right: auto;
  }

  .columna-filter {
    width: auto;
  }

  .txt-btn {
    font-size: var(--s);
  }
}


