/* Header */
.header {
 display: flex;
 padding: 0px 50px;
 background: #333;
 align-items: center;
 justify-content: space-between;
}
/* Logo */
.logo-index {
 width: 100%;
 height: auto;
 max-width: 200px;
 margin: 25px 0px 30px 0px;
}
/* Navbar Desktop */
.navbar ul {
 gap: 20px;
 display: flex;
 list-style: none;
}
.navbar a {
 color: #fff;
 font-weight: 400;
 text-decoration: none;
}
.navbar a.active {
 color: orange;
}
.navbar a:hover {
 color: red;
}
/* Main */
.main-section-background, .main-section-background-740px {
 width: 100%;
 overflow: hidden;
 max-height: 666px;
 position: relative;
 aspect-ratio: 2050 / 666;
}
.fade-slider {
 width: 100%;
 height: 100%;
 position: relative;
}
/* Imágenes Del Slider */
.fade-slider .slide {
 inset: 0;
 opacity:0;
 width: 100%;
 height: 100%;
 display: block;
 object-fit: cover;
 position: absolute;
 will-change: opacity;
 animation: fade 16s infinite;
 animation-fill-mode: both;
}
.fade-slider .slide.active {
 opacity:1;
}
/* Tiempo total = 16s, 4 imágenes → 4s cada una */
.fade-slider .slide:nth-child(1) { animation-delay: 0s; }
.fade-slider .slide:nth-child(2) { animation-delay: 4s; }
.fade-slider .slide:nth-child(3) { animation-delay: 8s; }
.fade-slider .slide:nth-child(4) { animation-delay: 12s; }
@keyframes fade {
 0%   { opacity: 0; }
 5%   { opacity: 1; }
 25%  { opacity: 1; }
 30%  { opacity: 0; }
 100% { opacity: 0; }
}
.main-section-background-article-figure {
 top: 50%;
 left: 50%;
 z-index: 10;
 width: auto;
 display: flex;
 max-width: 100%;
 position: absolute;
 align-items: center;
 pointer-events: none;
 justify-content: center;
 transform: translate(-50%, -50%);
}
.main-section-background-article-img-logo {
 height: auto;
 display: block;
 max-width: 550px;
}
/* Main Index */
.main-section-empresa {
 width: 100%;
 margin: 3px auto;
 background-color: white;
}
.main-section-article-empresa {
 display: grid;
 background-color: #e9e9e9;
 grid-template-columns: 1fr 1fr;
}
.main-section-article-empresa-div {
 gap: 12px;
 height: 100%;
 display: flex;
 position: relative;
 flex-direction: column;
 align-items: flex-start;
 justify-content: center;
}
.main-section-article-empresa-div-figure {
 width: 100%;
 display: flex;
 justify-content: flex-end;
}
.main-section-article-img-logo-legitima {
 top: 10px;
 right: 10px;
 width: 100px;
 height: auto;
 position: absolute;
}
.main-section-article-p {
 padding: 50px;
 font-size: 22px;
 margin: 0px auto;
}
.cursiva {
 font-weight: 1;
 font-size: 70px;
 font-style: oblique;
}
.main-section-article-img {
 width: 100%;
 height: auto;
 display: block;
 object-fit: cover;
}
/* Sección Beneficios */
.main-section-beneficios {
 padding: 75px 0px;
 background-color: rgb(189, 189, 189);
}
.main-section-beneficios-h1, .main-section-beneficios-h1-515px {
 font-size: 40px;
 text-align: center;
 margin: 0px 0px 50px 0px;
}
.main-section-article-beneficios {
 width: 80%;
 display: grid;
 margin: 0px auto;
 grid-template-columns: 1fr 1fr;
}
.main-section-article-beneficios-li {
 font-size: 18px;
}
/* Sección Nuestro Producto */
.main-producto, .main-obras, .main-representantes, .main-contacto, .main-caracteristicas-generales, .main-detalles-constructivos, .main-detalles-de-terminacion, .main-paso-a-paso {
 background-color: #e9e9e9;
}
.producto-h1, .caracteristicas-generales-h1, .detalles-constructivos-h1, .detalles-de-terminacion-h1, .paso-a-paso-h1, .obras-h1, .representantes-h1, .contacto-h1 {
 padding: 20px;
 color: white;
 font-size: 22px;
 font-weight: 400;
 line-height: 22px;
 text-align: center;
 background-color: #ee7f01;
}
.main-producto-section {
 gap: 50px;
 width: 50%;
 display: grid;
 margin: 0px auto;
 padding: 50px 0px;
 justify-items: center;
 grid-template-columns: 1fr 1fr;
}
.main-producto-section-a {
 color: inherit;
 display: block;
}
.main-producto-section-article {
 width: 100%;
 cursor: pointer;
 overflow: hidden;
 position: relative;
 aspect-ratio: 1 / 1;
}
.main-producto-section-article-img {
 width: 100%;
 height: 100%;
 display: block;
 object-fit: cover;
}
.main-producto-section-article-div {
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 opacity: 0;
 width: 100%;
 height: 100%;
 display: flex;
 color: white;
 position: absolute;
 align-items: center;
 flex-direction: column;
 justify-content: center;
 transition: opacity 0.3s ease;
 background: rgba(0, 0, 0, 0.5);
}
.main-producto-section-article:hover .main-producto-section-article-div {
 opacity: 1;
}
.main-producto-section-article-div-h2 {
 font-size: 24px;
 text-align: center;
 margin-bottom: 10px;
}
.main-producto-section-h2 {
 display: none;
 font-size: 24px;
 margin-top: 10px;
 padding: 5px 0px;
 text-align: center;
}
/* Pdfs */
.main-pdfs {
 display: flex;
 padding: 100px 0px;
 align-items: center;
 background: #f9f9f9;
 justify-content: center;
}
.download-pdfs {
 gap: 50px;
 display: flex;
}
.download-pdfs-boton {
 color: white;
 font-size: 16px;
 font-weight: bold;
 border-radius: 8px;
 padding: 12px 24px;
 display: inline-block;
 text-decoration: none;
 background-color: red;
 transition: background-color 0.3s ease;
}
.download-pdfs-boton:hover {
 background-color: darkred;
}
/* Sección Características Generales */
.main-caracteristicas-generales-section {
 width: 60%;
 margin: 0px auto;
 padding: 50px 0px;
}
.caracteristicas-generales-img {
 width: 50%;
 height: auto;
 display: block;
 margin: 0px auto;
 max-width: 640px;
}
.main-caracteristicas-generales-section-article-hr {
 margin: 25px 0px;
}
.main-caracteristicas-generales-section-article-hr-2 {
 margin: 25px 0px 0px;
}
.main-caracteristicas-generales-section-article-p {
 font-size: 18px;
}
/* Sección Detalles Constructivos */
.main-detalles-constructivos-section {
 width: 60%;
 margin: 0px auto;
 padding: 50px 0px;
}
.main-detalles-constructivos-section-article-1, .main-detalles-constructivos-section-article-1 p {
 margin-bottom: 40px;
}
.main-detalles-constructivos-section-article {
 gap: 40px;
 display: grid;
 margin-bottom: 50px;
 grid-template-columns: 1fr 1fr;
}
.main-detalles-constructivos-section-img {
 height: auto;
 display: block;
 max-width: 100%;
 margin: 0px auto 15px auto;
}
.main-detalles-constructivos-section-article-p {
 text-align: left;
 line-height: 1.6;
}
/* Sección Detalles De Terminación */
.main-detalles-de-terminacion-section {
 width: 60%;
 margin: 0px auto;
 padding: 50px 0px;
}
.main-detalles-de-terminacion-section-article {
 margin-bottom: 50px;
}
.main-detalles-de-terminacion-section-article-p {
 font-size: 16px;
 margin-bottom: 30px;
}
.main-detalles-de-terminacion-section-article-img {
 width: 50%;
 height: auto;
 display: block;
 margin: 0px auto;
 max-width: 640px;
}
.main-detalles-de-terminacion-section-article-h3 {
 margin-bottom: 15px;
}
/* Sección Paso a Paso */
.main-paso-a-paso-section {
 width: 35%;
 margin: 0px auto;
 padding: 50px 0px;
}
.main-paso-a-paso-section-article {
 margin-bottom: 50px;
}
.main-paso-a-paso-section-article-div {
 gap: 10px;
 display: flex;
}
.main-paso-a-paso-section-article-numero {
 color: white;
 padding: 10px 15px;
 display: inline-block;
 background-color: #ee7f01;
}
.main-paso-a-paso-section-article-texto {
 display: grid;
 font-size: 30px;
 align-items: center;
}
.main-paso-a-paso-section-article-texto-2 {
 font-size: 16px;
 margin: 15px auto;
}
.main-paso-a-paso-section-article-section {
 gap: 20px;
 display: flex;
 margin-bottom: 50px;
 align-items: flex-start;
 justify-content: space-between;
}
.main-paso-a-paso-section-article-section-article {
 flex: 1;
 padding: 20px;
 border-radius: 10px;
 background: white;
 box-shadow: 0 0 8px rgba(0,0,0,0.1);
}
.main-paso-a-paso-section-article-section-article-h3 {
 color: #222;
 margin: 15px 0px;
}
.main-paso-a-paso-section-article-section-article-p {
 font-size: 16px;
 margin: 15px 0px;
 line-height: 1.5;
}
.main-paso-a-paso-section-article-section-article-imagen {
 flex: 0 0 240px;
}
.main-paso-a-paso-section-article-section-article-imagen-img {
 width: 100%;
 border-radius: 8px;
 border: 1px solid #ddd;
}
.formula {
 padding: 4px 6px;
 border-radius: 4px;
}
.sqrt {
 display: inline-flex;
 align-items: flex-start;
}
.sqrt::before {
 content: "√";
 font-size: 1.2em;
 margin-right: 2px;
}
.radicand {
 border-top: 1px solid #000;
 padding: 0 4px;
 margin-top: -4px;
}
.main-paso-a-paso-section-article-img {
 width: 100%;
 height: auto;
 display: block;
 margin: 0px auto;
}
.main-paso-a-paso-section-article-hr {
 margin: 25px 0px;
}
.main-paso-a-paso-section-article-hr-2 {
 margin: 25px 0px 0px;
}
.main-paso-a-paso-section-article-p {
 font-size: 18px;
}
/* Sección Obras Realizadas */
/* Trabajos */
.main-obras-section {
 width: 60%;
 margin: 0px auto;
 text-align: center;
 padding: 50px 20px;
}
.main-obras-section-div {
 gap: 50px;
 display: grid;
 grid-template-columns: repeat(3, 1fr);
}
.main-obras-section-div-article {
 width: 100%;
 display: block;
 overflow: visible;
 position: relative;
}
.main-obras-section-div-article-img {
 width: 100%;
 height: auto;
 display: block;
 object-fit: cover;
 aspect-ratio: 1 / 1;
}
.main-obras-section-div-article-div {
 top: 0px;
 left: 0px;
 opacity: 0;
 width: 100%;
 height: 100%;
 display: flex;
 color: white;
 position: absolute;
 align-items: center;
 flex-direction: column;
 justify-content: center;
 transition: opacity 0.3s ease;
 background: rgba(0, 0, 0, 0.7);
}
.main-obras-section-div-article:hover .main-obras-section-div-article-div {
 opacity: 1;
}
.main-obras-section-div-article-div-h2 {
 font-size: 24px;
 margin-bottom: 10px;
}
.main-obras-section-div-article-picture {
 display: none;
}
.main-obras-section-div-article-h2 {
 display: none;
 font-size: 20px;
 margin-top: 20px;
 text-align: center;
}
/* Lightbox */
.lightbox {
 top: 0%;
 left: 0%;
 width: 100%;
 height: 100%;
 display: none;
 z-index: 1000;
 position: fixed;
 align-items: center;
 justify-content: center;
 background: rgba(0, 0, 0, 0.8);
}
.close-btn {
 top: 25px;
 right: 50px;
 color: white;
 cursor: pointer;
 font-size: 50px;
 position: absolute;
}
.close-btn:hover {
 color: rgba(255, 255, 255, 0.5);
}
.lightbox-img {
 margin: auto;
 display: block;
 max-width: 80%;
 max-height: 80%;
 border-radius: 10px;
 border: 15px solid white;
 box-shadow: 0px 15px 25px rgb(0, 0, 0, 0.5)
}
.prev-btn, .next-btn {
 top: 50%;
 border: none;
 cursor: pointer;
 font-size: 35px;
 position: absolute;
 padding: 10px 20px;
 transform: translateY(-50%);
 background: rgba(255, 255, 255, 0.6);
}
.prev-btn { left: 25px; } .next-btn { right: 25px; }
.prev-btn:hover, .next-btn:hover {
 background: rgba(255, 255, 255, 1);
}
/* Sección Representantes */
.representantes-item {
 margin: 0px auto;
 overflow: hidden;
 width: fit-content;
 position: relative;
}
.representantes-item-img {
 width: 100%;
 height: 300px;
 display: block;
 object-fit: cover;
}
.representantes-overlay {
 top: 0%;
 left: 0%;
 opacity: 0;
 width: 100%;
 height: 100%;
 display: flex;
 color: white;
 position: absolute;
 align-items: center;
 flex-direction: column;
 justify-content: center;
 transition: opacity 0.3s ease;
 background: rgba(0, 0, 0, 0.7);
}
.representantes-item:hover .representantes-overlay {
 opacity: 1;
}
.representantes-overlay-p {
 font-size: 24px;
 margin-bottom: 10px;
}
.representantes-img {
 width: 566px;
 display: block;
 margin: 0px auto;
}
/* Sección Contacto */
/* Mapa */
.main-contacto-section-mapa{
 flex: 1;
 width: 75%;
 height: 600px;
 display: flex;
 margin: 0px auto;
 align-self: center;
 justify-content: center;
}
.mapa {
 width: 100%;
 height: 100%;
 border: none;
}
/* Contacto */
.background-color-contacto {
 background-color: #f5f5f5;
}
.contacto {
 gap: 50px;
 width: 75%;
 display: flex;
 flex-wrap: wrap;
 margin: 0px auto;
 padding: 40px 50px;
 justify-content: space-between;
}
.contacto-form {
 flex: 1;
 display: flex;
 min-width: 300px;
 flex-direction: column;
}
.contacto-form-h2 {
 margin-bottom: 15px;
}
.fieldset {
 border: none;
}
.input {
 display: block;
}
.formulario-input, .formulario-input-textarea {
 width: 100%;
 padding: 12px;
 border-radius: 4px;
 margin-bottom: 15px;
 box-sizing: border-box;
 border: 1px solid #ccc;
}
.btn-enviar {
 border: none;
 padding: 12px;
 color: #fff;
 cursor: pointer;
 font-weight: bold;
 background: orange;
}
.formulario_mensaje_correcto {
 height: 40px;
 padding: 0px;
 display: none;
 color: white;
 line-height: 40px;
 font-weight: bold;
 text-align: center;
 border-radius: 5px;
 margin: 50px 0px 0px 0px;
 background-color: #119200;
}
.formulario_mensaje {
 height: 40px;
 padding: 0px;
 display: none;
 color: white;
 line-height: 40px;
 font-weight: bold;
 text-align: center;
 border-radius: 5px;
 margin: 50px 0px 0px 0px;
 background-color: #BB2929;
}
.formulario_mensaje_correcto_activo {
 display: block;
}
.formulario_mensaje_error_activo {
 display: block;
}
/* Contacto Info */
.contacto-info {
 flex: 1;
 min-width: 250px;
}
.contacto-info h3 {
 margin-bottom: 15px;
}
.contacto-info p {
 margin-bottom: 10px;
}
.contacto-info i {
 color: orange;
 margin-right: 8px;
}
/* Botones What's App */
.btn-whatsapp {
 right: 2%;
 top: 78.5%;
 padding: 10px;
 display: block;
 position: fixed;
 list-style: none;
 align-items: center;
 text-decoration: none;
 justify-content: flex-end;
}
.btn-whatsapp-a {
 display: block;
 text-decoration: none;
 grid-template-columns: auto;
}
.btn-whatsapp-a-i {
 display: grid;
 color: green;
 font-size: 50px;
}
/* Botones Flecha Arriba */
.flecha-arriba {
 right: 2%;
 top: 85.6%;
 padding: 10px;
 display: block;
 position: fixed;
 list-style: none;
 align-items: center;
 border-radius: 50px;
 text-decoration: none;
 justify-content: flex-end;
}
.flecha-arriba-a {
 display: block;
 text-decoration: none;
 grid-template-columns: auto;
}
.flecha-arriba-a-i {
 display: grid;
 padding: 10px;
 opacity: 0.75;
 color: white;
 font-size: 30px;
 border-radius: 5px;
 border: 2px solid black;
 background-color: #292929;
}
.flecha-arriba-a-i:hover {
 opacity: 0.5;
}
/* Footer */
.footer-main {
 background-color: #1b1b1b;
}
.footer-section {
 gap: 20px;
 width: 70%;
 margin: auto;
 color: #fff;
 display: flex;
 flex-wrap: wrap;
 padding: 30px 50px;
 align-items: flex-start;
 justify-content: space-between;
}
.footer-h3 {
 font-size: 20px;
 margin-bottom: 10px;
}
.footer-p {
 font-size: 15px;
 margin-bottom: 10px;
}
.footer-socials-icons-a {
 color: white;
 font-size: 18px;
 margin-right: 16px;
}
.footer-article-right-p {
 font-size: 15px;
 margin-bottom: 10px;
}
/* Copyright */
.copyright {
 gap: 15px;
 color: grey;
 display: flex;
 font-size: 20px;
 flex-wrap: wrap;
 font-weight: 400;
 padding: 20px 0px;
 text-align: center;
 background: black;
 justify-content: center;
}
.copyright-texto {
 cursor: default;
 font-weight: 400;
}
.desarrollador-web-link {
 color: orange;
 cursor: pointer;
 font-size: 20px;
 font-weight: 400;
}
.copyright, .copyright-texto, .desarrollador-web-link {
 margin: 0px;
}
/* Displays */
.menu-btn, .main-section-beneficios-h1-515px, .main-section-background-740px {
 display: none;
}

/* Media Querys */
@media screen and (max-width: 1851px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 40%;
 }
}
@media screen and (max-width: 1750px) {
 /* Sección Beneficios */
 .main-section-article-beneficios {
  width: 90%;
 }
}
@media screen and (max-width: 1725px) {
 /* Footer */
 .footer-section {
  width: 80%;
 }
}
@media screen and (max-width: 1720px) {
 /* Main */
 .main-section-background-article-img-logo {
  max-width: 500px;
 }
 /* Sección Características Generales */
 .main-caracteristicas-generales-section {
  width: 65%;
 }
}
@media screen and (max-width: 1672px) {
 /* Sección Beneficios */
 .main-section-article-beneficios {
  width: 90%;
 }
}
@media screen and (max-width: 1619px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 45%;
 }
}
@media screen and (max-width: 1600px) {
 /* Sección Principal */
 .main-section-article-img-logo-legitima {
  width: 90px;
 }
 .main-section-article-p {
  padding: 25px;
  font-size: 20px;
 }
 .cursiva {
  font-size: 70px;
 }
 /* Sección Beneficios */
 .main-section-beneficios-h1 {
  font-size: 35px;
 }
 .main-section-article-beneficios-li {
  font-size: 16px;
 }
 /* Obras Realizadas */
 .main-obras-section {
  width: 65%;
 }
}
@media screen and (max-width: 1520px) {
 /* Sección Principal */
 .main-section-background-article-img-logo {
  max-width: 450px;
 }
 /* Sección Características Generales */
 .main-caracteristicas-generales-section {
  width: 70%;
 }
}
@media screen and (max-width: 1507px) {
 /* Footer */
 .footer-section {
  gap: 20px;
  width: 90%;
  padding: 30px 50px;
 }
}
@media screen and (max-width: 1500px) {
 /* Sección Principal */
 .main-section-article-img-logo-legitima {
  width: 80px;
 }
 .main-section-article-p {
  padding: 20px;
  font-size: 18px;
 }
 .cursiva {
  font-size: 50px;
 }
}
@media screen and (max-width: 1440px) {
 /* Sección Nuestro Producto */
 .main-producto-section {
  width: 60%;
 }
 /* Sección Contacto */
 /* Mapa */
 .main-contacto-section-mapa {
  width: 100%;
  height: 668px;
 }
}
@media screen and (max-width: 1439px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 50%;
 }
}
@media screen and (max-width: 1401px) {
 /* Sección Contacto */
 .contacto {
  padding: 40px 25px;
 }
}
@media screen and (max-width: 1400px) {
 /* Sección Beneficios */
 .main-section-beneficios-h1 {
  font-size: 30px;
 }
 .main-section-article-beneficios {
  gap: 10px;
 }
 /* Obras Realizadas */
 .main-obras-section {
  width: 70%;
 }
}
@media screen and (max-width: 1340px) {
 /* Footer */
 .footer-section {
  gap: 10px;
  padding: 30px 25px;
 }
 .footer-h3 {
  font-size: 18px;
 }
 .footer-p {
  font-size: 13px;
 }
 .footer-socials-icons-a {
  font-size: 18px;
 }
 .footer-article-right-p {
  font-size: 13px;
 }
}
@media screen and (max-width: 1334px) {
 /* Sección Contacto */
 .contacto {
  padding: 40px 0px;
 }
}
@media screen and (max-width: 1320px) {
 /* Sección Principal */
 .main-section-background-article-img-logo {
  max-width: 400px;
 }
 /* Sección Características Generales */
 .main-caracteristicas-generales-section {
  width: 75%;
 }
}
@media screen and (max-width: 1295px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 55%;
 }
}
@media screen and (max-width: 1280px) {
 /* Sección Beneficios */
 .main-section-article-beneficios-li {
  font-size: 14px;
 }
}
@media screen and (max-width: 1270px) {
 /* Sección Principal */
 .main-section-article-img-logo-legitima {
  width: 70px;
 }
 .main-section-article-p {
  padding: 15px;
  font-size: 16px;
 }
 .cursiva {
  font-size: 50px;
 }
}
@media screen and (max-width: 1268px) {
 /* Sección Contacto */
 .contacto {
  gap: 25px;
 }
}
@media screen and (max-width: 1234px) {
 /* Sección Contacto */
 .contacto {
  width: 85%;
 }
}
@media screen and (max-width: 1215px) {
 /* Sección Beneficios */
 .main-section-article-beneficios {
  width: 95%;
 }
}
@media screen and (max-width: 1200px) {
 /* Obras Realizadas */
 .main-obras-section {
  width: 75%;
 }
}
@media screen and (max-width: 1179px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 60%;
 }
}
@media screen and (max-width: 1154px) {
 /* Header */
 .header {
  padding: 0px 20px;
 }
 /* Logo */
 .logo-index {
  max-width: 200px;
 }
 /* Sección Beneficios */
 .main-section-article-beneficios-li {
  font-size: 13px;
 }
}
@media screen and (max-width: 1120px) {
 /* Sección Principal */
 .main-section-background-article-img-logo {
  max-width: 350px;
 }
 .main-section-article-img-logo-legitima {
  width: 60px;
 }
 .main-section-article-p {
  padding: 15px;
  font-size: 14px;
 }
 .cursiva {
  font-size: 40px;
 }
 /* Footer */
 .footer-section {
  gap: 10px;
  width: 95%;
  padding: 30px 10px;
 }
 .footer-h3 {
  font-size: 18px;
 }
 .footer-p {
  font-size: 13px;
 }
 .footer-socials-icons-a {
  font-size: 18px;
 }
 .footer-article-right-p {
  font-size: 13px;
 }
}
@media screen and (max-width: 1094px) {
 /* Logo */
 .logo-index {
  max-width: 180px;
 }
}
@media screen and (max-width: 1089px) {
 /* Sección Contacto */
 .contacto {
  width: 90%;
 }
}
@media screen and (max-width: 1079px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 65%;
 }
}
@media screen and (max-width: 1074px) {
 /* Logo */
 .logo-index {
  max-width: 160px;
 }
}
@media screen and (max-width: 1070px) {
 /* Sección Beneficios */
 .main-section-article-beneficios-li {
  font-size: 12px;
 }
}
@media screen and (max-width: 1054px) {
 /* Logo */
 .logo-index {
  max-width: 140px;
 }
}
@media screen and (max-width: 1034px) {
 /* Logo */
 .logo-index {
  max-width: 120px;
 }
}
@media screen and (max-width: 1089px) {
 /* Sección Contacto */
 .contacto {
  width: 92%;
 }
}
@media screen and (max-width: 1024px) {
 /* Header */
 .header-logo {
  display: none;
 }
 /* Navbar */
 .navbar {
  margin: auto;
  padding: 30px 0px;
 }
 /* Sección Principal */
 .main-section-article-empresa {
  grid-template-columns: 1fr;
 }
 .main-section-article-p {
  padding: 30px;
  font-size: 18px;
 }
 .main-section-background {
  height: auto;
  min-height: 240px;
  position: relative;
 }
 /* Fade Slider */
 .fade-slider {
  height: auto;
  position: relative;
 }
 .fade-slider .slide {
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: auto;
  animation: none;
  transform: none;
  position: relative;
 }
 .main-section-background-article-figure {
  top: 50%;
  left: 50%;
  z-index: 5;
  margin: 0px;
  width: fit-content;
  position: absolute;
  pointer-events: none;
  transform: translate(-50%, -50%);
 }
 .cursiva {
  font-size: 50px;
 }
 .main-section-article-img {
  width: 100%;
  height: auto;
 }
 .main-section-article-img-logo-legitima {
  top: auto;
  right: auto;
  width: 90px;
  margin: 10px;
  position: relative;
 }
 /* Sección Beneficios */
 .main-section-beneficios, .main-section-article-beneficios {
  text-align: left;
  grid-template-columns: 1fr;
 }
 .main-section-article-beneficios {
  gap: 0px;
  width: 90%;
  max-width: 800px;
  margin: 0px auto;
  padding: 0px 12px;
  box-sizing: border-box;
 }
 .main-section-article-beneficios ul {
  width: 100%;
  margin: 0px;
  padding: 0px;
  list-style: none;
  box-sizing: border-box;
 }
 .main-section-article-beneficios-li {
  font-size: 15px;
  padding: 6px 0px;
  white-space: normal;
  word-break: word-break;
  overflow-wrap: anywhere;
 }
 /* Boton What's App */
 .btn-whatsapp {
  top: 89%;
 }
 /* Boton Flecha Arriba */
 .flecha-arriba {
  display: none;
 }
 /* Sección Nuestro Producto */
 .main-producto-section {
  width: 70%;
 }
 /* Sección Características Generales */
 .caracteristicas-generales-img {
  width: 100%;
  height: auto;
  max-width: 100%;
 }
 .main-caracteristicas-generales-section {
  width: 90%;
 }
 .main-caracteristicas-generales-section-article-p {
  font-size: 16px;
 }
 /* Sección Detalles Constructivos */
 .main-detalles-constructivos-section {
  width: 90%;
 }
 .main-detalles-constructivos-section-article-p {
  font-size: 14px;
 }
 /* Sección Detalles de Terminación */
 .main-detalles-de-terminacion-section {
  width: 90%;
 }
 .main-detalles-de-terminacion-section-article-img {
  width: 100%;
  height: auto;
  max-width: 100%;
 }
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section {
  display: grid;
  grid-template-columns: 1fr;
 }
 .main-paso-a-paso-section-article-section-article-imagen {
  border-radius: 8px;
  background-color: white;
  box-shadow: 0 0 8px rgba(0,0,0,0.1);
 }
 .calculo-3 {
  background-color: rgb(235, 235, 235);
 }
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 40%;
  border: none;
  display: block;
  margin: 0px auto;
  border-radius: 8px;
 }
 .calculo-4, .calculo-5 {
  display: block;
  margin: 0px auto;
 }
 /* Sección Obras Realizadas */
 .main-obras-section-div {
  gap: 50px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
 }
 /* Sección Contacto */
 .main-contacto-section-mapa {
  height: 687px;
 }
 /* Formulario */
 .contacto {
  gap: 50px;
  width: 60%;
  display: grid;
  grid-template-columns: 1fr;
 }
 .contacto-info {
  display: none;
 }
 /* Footer */
 .footer-section {
  gap: 20px;
  width: 70%;
  margin: auto;
  color: #fff;
  display: flex;
  flex-wrap: wrap;
  padding: 30px 50px;
  align-items: flex-start;
  justify-content: space-between;
 }
 .footer-h3 {
  font-size: 20px;
  margin-bottom: 10px;
 }
 .footer-p {
  font-size: 15px;
  margin-bottom: 10px;
 }
 .footer-socials-icons-a {
  color: white;
  font-size: 18px;
  margin-right: 16px;
 }
 .footer-article-right-p {
  font-size: 15px;
  margin-bottom: 10px;
 }
 /* Copyright */
 .copyright {
  gap: 15px;
  color: grey;
  display: flex;
  font-size: 20px;
  flex-wrap: wrap;
  font-weight: 400;
  padding: 20px 0px;
  text-align: center;
  background: black;
  justify-content: center;
 }
 .copyright-texto {
  cursor: default;
  font-weight: 400;
 }
 .desarrollador-web-link {
  color: orange;
  cursor: pointer;
  font-size: 20px;
  font-weight: 400;
 }
 .copyright, .copyright-texto, .desarrollador-web-link {
  margin: 0px;
 }
}
@media screen and (max-width: 945px) {
 /* Footer */
 .footer-section {
  width: 80%;
  padding: 30px 50px;
 }
}
@media screen and (max-width: 925px) {
 /* Sección Beneficios */
 .main-section-beneficios-h1 {
  font-size: 25px;
 }
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 45%;
 }
}
@media screen and (max-width: 907px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 70%;
 }
}
@media screen and (max-width: 900px) {
 /* Sección Obras Realizadas */
 .main-obras-section {
  width: 80%;
  padding: 50px 0px;
 }
 .main-obras-section-div {
  gap: 50px;
 }
}
@media screen and (max-width: 894px) {
 /* Navbar */
 .navbar a {
  font-size: 15px;
 }
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 28px;
 }
}
@media screen and (max-width: 875px) {
 /* Lightbox */
 .prev-btn { left: 10px; } .next-btn { right: 10px; }
}
@media screen and (max-width: 845px) {
 /* Navbar */
 .navbar a {
  font-size: 14px;
 }
 /* Sección Nuestro Producto */
 .main-producto-section-article-div-h2 {
  font-size: 22px;
 }
}
@media screen and (max-width: 841px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 75%;
 }
}
@media screen and (max-width: 839px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 26px;
 }
}
@media screen and (max-width: 826px) {
 /* Footer */
 .footer-section {
  width: 90%;
  padding: 30px 50px;
 }
}
@media screen and (max-width: 824px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 50%;
 }
}
@media screen and (max-width: 797px) {
 /* Navbar */
 .navbar a {
  font-size: 13px;
 }
}
@media screen and (max-width: 785px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 80%;
 }
}
@media screen and (max-width: 784px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 24px;
 }
}
@media screen and (max-width: 770px) {¨
 /* Sección Beneficios */
 .main-section-beneficios-h1 {
  font-size: 22px;
 }
}
@media screen and (max-width: 768px) {
 /* Header */
 .header {
  height: 75px;
  padding: 0px;
  background-color: rgb(185, 185, 185);
 }
 /* Navbar Mobile */
 .menu-btn {
  top: 0%;
  left: 0%;
  width: 60px;
  z-index: 1001;
  display: block;
  cursor: pointer;
  position: fixed;
  background: transparent;
  padding: 0px 0px 0px 25px;
  transition: transform 0.9s ease-in-out;
 }
 .menu-btn span {
  left: 20px;
  right: 20px;
  height: 1px;
  width: 35px;
  padding: 1px;
  z-index: 1002;
  display: block;
  position: absolute;
  border-radius: 4px;
  background: black;
  transform-origin: center;
  transition: transform 0.28s ease, opacity 0.2s ease, background-color 0.2s ease, width 0.2s ease;
 }
 .top-bun {
  top: 22px;
 }
 .stuffing {
  top: 36px;
 }
 .bottom-bun {
  top: 50px;
 }
 .top-bun, .stuffing, .bottom-bun {
  opacity: 1;
  width: 100%;
  transform: none;
  border-radius: 50px;
  background-color: black;
 }
 .top-bun.active {
  width: 60%;
  background-color: white;
  transform: translateY(14px) rotate(45deg);
 }
 .stuffing.active {
  opacity: 0;
  transform: scale(0);
 }
 .bottom-bun.active {
  width: 60%;
  background-color: white;
  transform: translateY(-14px) rotate(-45deg);
 }
 .nav-bar ul.nav-bar-ul {
  top: 0px;
  left: 0px;
  opacity: 0;
  padding: 0px;
  width: 100vw;
  height: 100vh;
  z-index: 1001;
  display: flex;
  position: fixed;
  align-items: center;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  transform: translateY(-100%);
  background: rgba(0, 0, 0, 0.65);
  transition: transform 0.28s ease, opacity 0.28s ease;
 }
 .nav-bar ul.show {
  opacity: 1;
  padding: 0px;
  transform: translateY(0);
 }
 .nav-bar-ul {
  gap: 18px;
  width: 100%;
  margin: 0px;
  display: flex;
  list-style: none;
  align-items: center;
  flex-direction: column;
  justify-content: center;
 }
 .nav-bar-li {
  margin: 0px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
 }
 .nav-bar-a {
  width: auto;
  color: white;
  font-size: 20px;
  font-weight: 400;
  padding: 14px 26px;
  border-radius: 8px;
  text-decoration: none;
  background: rgba(255,255,255,0.04);
  transition: background 0.18s ease, transform 0.18s ease;
 }
 .nav-bar-a:hover {
  background: rgba(255,255,255,0.09);
  transform: translateY(-2px);
 }
 .navbar {
  display: none;
 }
 /* Sección Principal */
 .main-section-article-img-logo-legitima {
  width: 80px;
 }
 .main-section-article-p {
  padding: 20px;
  font-size: 16px;
 }
 .cursiva {
  font-size: 40px;
 }
 /* Sección Beneficios */
 .main-section-beneficios-h1 {
  font-size: 20px;
 }
 .main-section-article-beneficios-li {
  font-size: 13px;
 }
 /* Boton What's App */
 .btn-whatsapp-a-i {
  font-size: 45px;
 }
 /* Sección Nuestro Producto */
 .main-producto-section-article-div-h2 {
  font-size: 20px;
 }
 .main-producto-section-h2 {
  display: block;
  font-size: 13px;
 }
 /* Sección Características Generales */
 .main-caracteristicas-generales-section-article-p {
  font-size: 14px;
 }
 .main-detalles-constructivos-section-article {
  grid-template-columns: 1fr;
 }
 /* Sección Detalles Constructivos */
 .main-detalles-constructivos-section-article-p {
  font-size: 12px;
 }
 /* Sección Obras Realizadas */
 .main-obras-section {
  width: 75%;
  margin: 25px auto 0px;
 }
 .main-obras-section-div {
  gap: 50px;
  grid-template-columns: repeat(1, 1fr);
 }
 .main-obras-section-div-article-h2 {
  display: block;
  font-size: 28px;
 }
 /* Lightbox */
 .prev-btn, .next-btn {
  font-size: 35px;
  padding: 5px 10px;
 }
 /* Sección Representantes */
 .representantes-img {
  width: 100%;
  height: auto;
  max-width: 566px;
 }
 .representantes-overlay-p {
  font-size: 20px;
  margin-bottom: 8px;
 }
 /* Mapa */
 .main-contacto-section-mapa {
  height: 696px;
 }
 /* Contacto */
 .contacto {
  width: 75%;
 }
}
@media screen and (max-width: 764px) {
 .main-obras-section-div-article-h2 {
  font-size: 27px;
 }
}
@media screen and (max-width: 740px) {
 /* Sección Principal */
 .main-section-background {
  display: none;
 }
 .main-section-background-740px {
  width: 100%;
  display: block;
  overflow: hidden;
  min-height: 220px;
  padding-top: 32.5%;
  position: relative;
  background-image: url("./img/index/banner/banner1.webp");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
 }
 .main-section-background-740px .fade-slider {
  display: none;
 }
 .main-section-background-740px .main-section-background-article-figure {
  top: 50%;
  left: 50%;
  width: 100%;
  display: flex;
  position: absolute;
  align-items: center;
  pointer-events: none;
  justify-content: center;
  transform: translate(-50%, -50%);
 }
 .main-section-background-740px .main-section-background-article-img-logo {
  width: 60%;
  height: auto;
  display: block;
  max-width: 60%;
 }
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 12px;
 }
}
@media screen and (max-width: 737px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 85%;
 }
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 26px;
 }
}
@media screen and (max-width: 734px) {
 /* Footer */
 .footer-section {
  width: 90%;
  padding: 30px 25px;
 }
}
@media screen and (max-width: 710px) {
/* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 25px;
 }
}
@media screen and (max-width: 700px) {
 /* Sección Nuestro Producto */
 .main-producto-section {
  width: 80%;
 }
 .main-producto-section-article-div-h2 {
  font-size: 18px;
 }
}
@media screen and (max-width: 693px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section {
  width: 90%;
 }
}
@media screen and (max-width: 682px) {
/* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 24px;
 }
}
@media screen and (max-width: 678px) {
 /* Sección Principal */
 .main-section-article-img-logo-legitima {
  width: 70px;
 }
 /* Footer */
 .footer-section {
  width: 100%;
  padding: 30px 25px;
 }
}
@media screen and (max-width: 655px) {
 /* Sección Paso a Paso */
 .calculo-1, .calculo-4, .calculo-5 {
  max-width: 100%;
 }
 .main-paso-a-paso-section-article-section-article-h3 {
  font-size: 16px;
 }
 .main-paso-a-paso-section-article-texto-2 {
  font-size: 14px;
 }
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 23px;
 }
}
@media screen and (max-width: 627px) {
/* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 22px;
 }
}
@media screen and (max-width: 624px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 55%;
 }
}
@media screen and (max-width: 620px) {
 /* Sección Beneficios */
 .main-section-beneficios-h1 {
  font-size: 18px;
 }
}
@media screen and (max-width: 610px) {
 /* Footer */
 .footer-section {
  padding: 30px 10px;
 }
}
@media screen and (max-width: 603px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 11px;
 }
}
@media screen and (max-width: 601px) {
 /* Sección Contacto */
 .contacto-info-p {
  font-size: 15px;
 }
}
@media screen and (max-width: 600px) {
 /* Sección Nuestro Producto */
 .main-producto-section {
  width: 60%;
  grid-template-columns: 1fr;
 }
 .main-producto-section-h2 {
  font-size: 20px;
 }
 /* Pdfs */
 .download-pdfs {
  gap: 50px;
  display: grid;
 }
 .download-pdfs-boton {
  text-align: center;
 }
 /* Sección Características Generales */
 .main-caracteristicas-generales-section {
  width: 100%;
  padding: 30px 20px;
 }
 .main-caracteristicas-generales-section-article-p {
  font-size: 12px;
 }
 /* Sección Detalles de Terminación */
 .main-detalles-de-terminacion-section {
  width: 100%;
  padding: 50px 20px;
 }
 .main-detalles-de-terminacion-section-article-p {
  font-size: 14px;
 }
 /* Sección Obras Realizadas */
 .main-obras-section {
  margin: 0px auto;
 }
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 21px;
 }
}
@media screen and (max-width: 596px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 19px;
 }
}
@media screen and (max-width: 580px) {
 /* Sección Principal */
 .main-section-article-p {
  font-size: 15px;
 }
 .cursiva {
  font-size: 35px;
 }
 /* Sección Beneficios */
 .main-section-article-beneficios-li {
  font-size: 12px;
 }
 /* Footer */
 .footer-h3 {
  font-size: 18px;
 }
 .footer-p {
  font-size: 13px;
 }
 .footer-socials-icons-a {
  font-size: 15px;
 }
 .footer-article-right-p {
  font-size: 13px;
 }
 /* Copyright */
 .copyright {
  gap: 13px;
  font-size: 18px;
  padding: 12px 0px;
 }
 .desarrollador-web-link {
  font-size: 18px;
 }
}
@media screen and (max-width: 575px) {
 /* Lightbox */
 .prev-btn, .next-btn {
  font-size: 25px;
 }
}
@media screen and (max-width: 574px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-h3 {
  font-size: 15px;
 }
 .main-paso-a-paso-section-article-section-article-p {
  font-size: 14px;
 }
}
@media screen and (max-width: 573px) {
/* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 20px;
 }
}
@media screen and (max-width: 567px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 18px;
 }
}
@media screen and (max-width: 564px) {
 /* Sección Nuestro Producto */
 .contacto-info-p {
  font-size: 14px;
 }
}
@media screen and (max-width: 546px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 19px;
 }
}
@media screen and (max-width: 537px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 17px;
 }
}
@media screen and (max-width: 527px) {
 /* Sección Contacto */
 .contacto {
  width: 95%;
 }
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 22px;
 }
}
@media screen and (max-width: 525px) {
 /* Lightbox */
 .prev-btn, .next-btn {
  font-size: 20px;
 }
 .prev-btn { left: 5px; } .next-btn { right: 5px; }
}
@media screen and (max-width: 524px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 60%;
 }
}
@media screen and (max-width: 518px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 18px;
 }
}
@media screen and (max-width: 515px) {
 /* Sección Principal */
 .main-section-article-p {
  font-size: 14px;
 }
 .cursiva {
  font-size: 30px;
 }
 /* Sección Beneficios */
 .main-section-beneficios-h1-515px {
  display: block;
  font-size: 18px;
 }
 .main-section-beneficios-h1 {
  display: none;
 }
}
@media screen and (max-width: 511px) {
 /* Copyright */
 .copyright {
  gap: 10px;
  font-size: 16px;
 }
 .desarrollador-web-link {
  font-size: 16px;
 }
}
@media screen and (max-width: 509px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 16px;
 }
}
@media screen and (max-width: 506px) {
 /* Footer */
 .footer-h3 {
  font-size: 16px;
 }
 .footer-p {
  font-size: 12px;
 }
 .footer-socials-icons-a {
  font-size: 14px;
 }
 .footer-article-right-p {
  font-size: 12px;
 }
}
@media screen and (max-width: 500px) {
 /* Sección Nuestro Producto */
 .main-producto-section {
  width: 70%;
 }
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto-2 {
  font-size: 13px;
 }
}
@media screen and (max-width: 491px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 17px;
 }
}
@media screen and (max-width: 488px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 20px;
 }
}
@media screen and (max-width: 480px) {
 /* Sección Representantes */
 .representantes-overlay-p {
  font-size: 16px;
  margin-bottom: 6px;
 }
}
@media screen and (max-width: 468px) {
 /* Footer */
 .footer-h3 {
  font-size: 14px;
 }
 .footer-p {
  font-size: 11px;
 }
 .footer-socials-icons-a {
  font-size: 12px;
 }
 .footer-article-right-p {
  font-size: 11px;
 }
}
@media screen and (max-width: 464px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 16px;
 }
}
@media screen and (max-width: 454px) {
 /* Copyright */
 .copyright {
  gap: 8px;
  font-size: 14px;
 }
 .desarrollador-web-link {
  font-size: 14px;
 }
}
@media screen and (max-width: 448px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 18px;
 }
}
@media screen and (max-width: 436px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 15px;
 }
}
@media screen and (max-width: 432px) {
 /* Footer */
 .footer-h3 {
  font-size: 14px;
 }
 .footer-p {
  font-size: 10px;
 }
 .footer-socials-icons-a {
  font-size: 12px;
 }
 .footer-article-right-p {
  font-size: 10px;
 }
}
@media screen and (max-width: 424px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 65%;
 }
}
@media screen and (max-width: 420px) {
 /* logo */
 .logo-index {
  max-width: 160px;
  margin: 16px 0 20px 0;
 }
 /* Sección Principal */
 .main-section-article-p {
  padding: 16px;
  font-size: 14px;
 }
 .cursiva {
  font-size: 30px;
 }
 /* Sección Beneficios */
 .main-section-beneficios-h1 {
  font-size: 20px;
  margin-bottom: 20px;
 }
 .main-section-article-beneficios {
  width: 90%;
 }
 .main-section-article-beneficios-li {
  white-space: normal;
  text-overflow: clip;
 }
 /* Copyright */
 .copyright {
  font-size: 12px;
 }
 .desarrollador-web-link {
  font-size: 12px;
 }
}
@media screen and (max-width: 416px) {
 /* Sección Contacto */
 .contacto-info-p {
  font-size: 13px;
 }
}
@media screen and (max-width: 410px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 15px;
 }
}
@media screen and (max-width: 409px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 14px;
 }
}
@media screen and (max-width: 409px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 16px;
 }
}
@media screen and (max-width: 400px) {
 /* Lightbox */
 .prev-btn, .next-btn {
  font-size: 15px;
 }
 .prev-btn { left: 2px; } .next-btn { right: 2px; }
}
@media screen and (max-width: 386px) {
 /* Sección Principal */
 .main-section-article-p {
  padding: 16px;
  font-size: 13px;
 }
 .cursiva {
  font-size: 30px;
 }
 /* Sección Contacto */
 .contacto-info-p {
  font-size: 12px;
 }
}
@media screen and (max-width: 385px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 14px;
 }
}
@media screen and (max-width: 382px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 13px;
 }
}
@media screen and (max-width: 374px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 80%;
 }
}
@media screen and (max-width: 370px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 14px;
 }
}
@media screen and (max-width: 360px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 13px;
 }
}
@media screen and (max-width: 358px) {
 /* Sección Contacto */
 .contacto-form-h2 {
  font-size: 20px;
  text-align: center;
 }
}
@media screen and (max-width: 357px) {
 /* Sección Contacto */
 .contacto-info-p {
  font-size: 11px;
 }
}
@media screen and (max-width: 354px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 12px;
 }
}
@media screen and (max-width: 352px) {
 /* Copyright */
 .copyright {
  font-size: 11px;
 }
 .desarrollador-web-link {
  font-size: 11px;
 }
}
@media screen and (max-width: 344px) {
 /* Sección Representantes */
 .representantes-img {
  height: 346px;
 }
}
@media screen and (max-width: 334px) {
 /* Sección Nuestro Producto */
 .main-producto-section-h2 {
  font-size: 12px;
 }
}
@media screen and (max-width: 331px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-texto {
  font-size: 13px;
 }
}
@media screen and (max-width: 328px) {
 /* Sección Contacto */
 .contacto-info-p {
  font-size: 10px;
 }
}
@media screen and (max-width: 327px) {
 /* Sección Obras Realizadas */
 .main-obras-section-div-article-h2 {
  font-size: 11px;
 }
}
@media screen and (max-width: 324px) {
 /* Sección Paso a Paso */
 .main-paso-a-paso-section-article-section-article-imagen-img {
  width: 100%;
 }
}
@media screen and (max-width: 320px) {
 /* Sección Representantes */
 .representantes-img {
  width: 100%;
  min-width: 280px;
 }
 /* Copyright */
 .copyright {
  gap: 6px;
 }
}