.sitio-web-design {
  display: inline-flex;
  height: 8022px;
  align-items: flex-start;
  justify-content: center;
  gap: 10px;
  position: relative;
  background-color: #ffffff;
  border: 1px solid;
  border-color: transparent;
  width: 100%;
  min-width: 1440px;
}

.sitio-web-design .pagina {
  display: flex;
  flex-direction: column;
  width: 1440px;
  height: 8022px;
  align-items: center;
  position: relative;
}

.sitio-web-design .encabezado {
  display: flex;
  width: 1440px;
  align-items: center;
  justify-content: center;
  gap: 59px;
  padding: 26px 20px;
  position: relative;
  flex: 0 0 auto;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
}

.sitio-web-design .rectangle {
  position: relative;
  width: 110px;
  height: 71.16px;
}

.sitio-web-design .text-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #2c2c2c;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0;
  line-height: 16px;
  white-space: nowrap;
}

.sitio-web-design .boton {
  display: flex;
  width: 193px;
  height: 47px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 36px;
  position: relative;
  background-color: #2c2c2c;
  border-radius: 18px;
}

.sitio-web-design .div {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-top: -0.50px;
  font-family: "Poppins", Helvetica;
  font-weight: 600;
  color: #ffffff;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0;
  line-height: 16px;
  white-space: nowrap;
}

.sitio-web-design .primera-seccion {
  position: relative;
  width: 1440px;
  height: 637px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
}

.sitio-web-design .p {
  position: absolute;
  top: 121px;
  left: 39px;
  width: 825px;
  height: 154px;
  display: flex;
  align-items: center;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 64px;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-2 {
  position: absolute;
  top: 288px;
  left: 39px;
  width: 694px;
  height: 152px;
  display: flex;
  align-items: center;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  font-style: italic;
  color: #ffffff;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .div-wrapper {
  display: flex;
  width: 561px;
  height: 119px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 33px 78px;
  position: absolute;
  top: 461px;
  left: 120px;
  background-color: #2c2c2c;
  border-radius: 45px;
}

.sitio-web-design .text-wrapper-3 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  font-family: "Poppins", Helvetica;
  font-weight: 700;
  color: #ffffff;
  font-size: 40px;
  text-align: center;
  letter-spacing: -1.20px;
  line-height: 48.0px;
  white-space: nowrap;
}

.sitio-web-design .img {
  position: absolute;
  top: 141px;
  left: 880px;
  width: 490px;
  height: 299px;
}

.sitio-web-design .vision-general {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 19px;
  padding: 20px 80px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sitio-web-design .text-wrapper-4 {
  position: relative;
  display: flex;
  align-items: center;
  width: 961px;
  height: 125px;
  margin-top: -1.00px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #000000;
  font-size: 64px;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-5 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1215px;
  height: 81px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #828282;
  font-size: 25px;
  text-align: center;
  letter-spacing: -0.75px;
  line-height: 30.0px;
}

.sitio-web-design .contenido {
  display: inline-flex;
  align-items: center;
  gap: 72px;
  padding: 1px 22px;
  position: relative;
  flex: 0 0 auto;
  border-radius: 29px;
  border: 1px solid;
  border-color: #2c2c2c;
}

.sitio-web-design .capturas {
  position: relative;
  width: 496px;
  height: 554px;
}

.sitio-web-design .captura {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 476px;
  height: 544px;
}

.sitio-web-design .captura-2 {
  position: absolute;
  top: 47px;
  left: 157px;
  width: 330px;
  height: 460px;
}

.sitio-web-design .glyphs-mouse-pointer {
  position: absolute;
  top: 202px;
  left: 220px;
  width: 306px;
  height: 305px;
  display: flex;
  transform: rotate(-42.48deg);
}

.sitio-web-design .vector {
  margin-top: 62.5px;
  width: 181.67px;
  height: 192.4px;
  margin-left: 63.0px;
  transform: rotate(42.48deg);
}

.sitio-web-design .como-funciona {
  display: flex;
  flex-direction: column;
  width: 642px;
  align-items: flex-start;
  gap: 23px;
  position: relative;
}

.sitio-web-design .tareas {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sitio-web-design .icon-park-outline {
  position: relative;
  width: 56px;
  height: 56px;
  aspect-ratio: 1;
}

.sitio-web-design .text-wrapper-6 {
  position: relative;
  display: flex;
  align-items: center;
  width: 387px;
  height: 38px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
  white-space: nowrap;
}

.sitio-web-design .validacin {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  position: relative;
  flex: 0 0 auto;
}

.sitio-web-design .text-wrapper-7 {
  position: relative;
  display: flex;
  align-items: center;
  width: 289px;
  height: 38px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
  white-space: nowrap;
}

.sitio-web-design .flujos {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0px 2px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.sitio-web-design .text-wrapper-8 {
  position: relative;
  display: flex;
  align-items: center;
  width: 570px;
  height: 38px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
  white-space: nowrap;
}

.sitio-web-design .consultacion {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 0px 2px;
  position: relative;
  flex: 0 0 auto;
}

.sitio-web-design .text-wrapper-9 {
  position: relative;
  display: flex;
  align-items: center;
  width: 538px;
  height: 38px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
  white-space: nowrap;
}

.sitio-web-design .metricas {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  position: relative;
  flex: 0 0 auto;
}

.sitio-web-design .text-wrapper-10 {
  position: relative;
  display: flex;
  align-items: center;
  width: 491px;
  height: 38px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
  white-space: nowrap;
}

.sitio-web-design .aprendizaje {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 0px 1px;
  position: relative;
  flex: 0 0 auto;
}

.sitio-web-design .aprende-y-mejora {
  position: relative;
  display: flex;
  align-items: center;
  width: 523px;
  height: 38px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
  white-space: nowrap;
}

.sitio-web-design .componentes {
  position: relative;
  width: 1440px;
  height: 866px;
  overflow: hidden;
}

.sitio-web-design .text-wrapper-11 {
  position: absolute;
  top: 38px;
  left: 240px;
  width: 1004px;
  height: 117px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #000000;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .slider {
  display: flex;
  width: 4368px;
  align-items: flex-start;
  position: absolute;
  top: 244px;
  left: -1444px;
}

.sitio-web-design .div-2 {
  position: relative;
  flex: 1;
  flex-grow: 1;
  height: 441px;
}

.sitio-web-design .rectangle-2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 683px;
  height: 441px;
  background-color: #f3cd36;
  border-radius: 15px;
}

.sitio-web-design .rectangle-3 {
  left: 0;
  position: absolute;
  top: 0;
  width: 302px;
  height: 440px;
}

.sitio-web-design .text-wrapper-12 {
  position: absolute;
  top: 49px;
  left: 362px;
  width: 280px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 40px;
  text-align: center;
  letter-spacing: -1.20px;
  line-height: 48.0px;
}

.sitio-web-design .text-wrapper-13 {
  position: absolute;
  top: 169px;
  left: 362px;
  width: 280px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #fffafa;
  font-size: 24px;
  letter-spacing: -0.72px;
  line-height: 28.8px;
}

.sitio-web-design .rectangle-4 {
  background-color: #f7a81d;
  position: absolute;
  top: 0;
  left: 0;
  width: 683px;
  height: 441px;
  border-radius: 15px;
}

.sitio-web-design .rectangle-5 {
  left: 0;
  position: absolute;
  top: 0;
  width: 302px;
  height: 440px;
}

.sitio-web-design .rectangle-6 {
  background-color: #f88943;
  position: absolute;
  top: 0;
  left: 0;
  width: 683px;
  height: 441px;
  border-radius: 15px;
}

.sitio-web-design .rectangle-7 {
  position: absolute;
  top: 0;
  left: 0;
  width: 302px;
  height: 440px;
}

.sitio-web-design .text-wrapper-14 {
  position: absolute;
  top: 49px;
  left: 362px;
  width: 293px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 40px;
  text-align: center;
  letter-spacing: -1.20px;
  line-height: 48.0px;
}

.sitio-web-design .rectangle-8 {
  left: 0;
  position: absolute;
  top: 0;
  width: 302px;
  height: 440px;
}

.sitio-web-design .text-wrapper-15 {
  position: absolute;
  top: 49px;
  left: 350px;
  width: 303px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 40px;
  text-align: center;
  letter-spacing: -1.20px;
  line-height: 48.0px;
}

.sitio-web-design .rectangle-9 {
  left: 0;
  position: absolute;
  top: 0;
  width: 302px;
  height: 440px;
}

.sitio-web-design .text-wrapper-16 {
  position: absolute;
  top: 49px;
  left: 362px;
  width: 289px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 40px;
  text-align: center;
  letter-spacing: -1.20px;
  line-height: 48.0px;
}

.sitio-web-design .ei-arrow-left {
  position: absolute;
  top: 769px;
  left: 642px;
  width: 97px;
  height: 97px;
  aspect-ratio: 1;
}

.sitio-web-design .ei-arrow-left-2 {
  position: absolute;
  top: 769px;
  left: 741px;
  width: 97px;
  height: 97px;
  aspect-ratio: 1;
}

.sitio-web-design .implementacin {
  position: relative;
  width: 1440px;
  height: 1293px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
}

.sitio-web-design .no-solo {
  position: absolute;
  top: 32px;
  left: 155px;
  width: 1169px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-17 {
  position: absolute;
  top: 272px;
  left: 158px;
  width: 1164px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .cuadros {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, fit-content(100%));
  width: 872px;
  height: 829px;
  gap: 35px 50px;
  position: absolute;
  top: 377px;
  left: 274px;
}

.sitio-web-design .element {
  position: relative;
  grid-row: 1 / 2;
  grid-column: 1 / 2;
  width: 426px;
  height: 397px;
  background-color: #ffffff;
  border-radius: 30px;
}

.sitio-web-design .tdesign-numbers {
  position: absolute;
  top: 7px;
  left: 11px;
  width: 86px;
  height: 86px;
  aspect-ratio: 1;
}

.sitio-web-design .text-wrapper-18 {
  position: absolute;
  top: 93px;
  left: 54px;
  width: 318px;
  font-family: "Poppins", Helvetica;
  font-weight: 600;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .element-2 {
  position: relative;
  grid-row: 1 / 2;
  grid-column: 2 / 3;
  width: 426px;
  height: 397px;
  background-color: #ffffff;
  border-radius: 30px;
}

.sitio-web-design .tdesign-numbers-2 {
  position: absolute;
  top: 7px;
  left: 12px;
  width: 86px;
  height: 86px;
  aspect-ratio: 1;
}

.sitio-web-design .element-3 {
  position: relative;
  grid-row: 2 / 3;
  grid-column: 1 / 2;
  width: 426px;
  height: 397px;
  background-color: #ffffff;
  border-radius: 30px;
}

.sitio-web-design .text-wrapper-19 {
  position: absolute;
  top: 93px;
  left: 39px;
  width: 347px;
  font-family: "Poppins", Helvetica;
  font-weight: 600;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .element-4 {
  position: relative;
  grid-row: 2 / 3;
  grid-column: 2 / 3;
  width: 426px;
  height: 397px;
  background-color: #ffffff;
  border-radius: 30px;
}

.sitio-web-design .diferenciador {
  position: relative;
  width: 1440px;
  height: 761px;
  background-color: #ffffff;
  overflow: hidden;
}

.sitio-web-design .text-wrapper-20 {
  position: absolute;
  top: 84px;
  left: 155px;
  width: 1169px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #2c2c2c;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-21 {
  position: absolute;
  top: 171px;
  left: 158px;
  width: 1164px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #828282;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .cuadros-de {
  display: inline-flex;
  align-items: center;
  gap: 33px;
  position: absolute;
  top: 279px;
  left: 112px;
}

.sitio-web-design .div-3 {
  position: relative;
  width: 279px;
  height: 668px;
}

.sitio-web-design .rectangle-10 {
  position: absolute;
  top: 0;
  left: 0;
  width: 279px;
  height: 427px;
  background-color: #ffda43;
  border-radius: 25px;
}

.sitio-web-design .text-wrapper-22 {
  position: absolute;
  top: 204px;
  left: 40px;
  width: 200px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 26px;
  text-align: center;
  letter-spacing: -0.78px;
  line-height: 31.2px;
}

.sitio-web-design .text-wrapper-23 {
  position: absolute;
  top: 113px;
  left: 39px;
  width: 201px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .ph-prohibit-bold {
  position: absolute;
  top: 31px;
  left: 99px;
  width: 82px;
  height: 82px;
  aspect-ratio: 1;
}

.sitio-web-design .rectangle-11 {
  background-color: #ffbd59;
  position: absolute;
  top: 0;
  left: 0;
  width: 279px;
  height: 427px;
  border-radius: 25px;
}

.sitio-web-design .text-wrapper-24 {
  position: absolute;
  top: 195px;
  left: 40px;
  width: 200px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 26px;
  text-align: center;
  letter-spacing: -0.78px;
  line-height: 31.2px;
}

.sitio-web-design .text-wrapper-25 {
  position: absolute;
  top: 113px;
  left: 10px;
  width: 260px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .bolt-fill {
  position: absolute;
  top: 37px;
  left: 101px;
  width: 77px;
  height: 77px;
  aspect-ratio: 1;
}

.sitio-web-design .rectangle-12 {
  background-color: #ff914d;
  position: absolute;
  top: 0;
  left: 0;
  width: 279px;
  height: 427px;
  border-radius: 25px;
}

.sitio-web-design .text-wrapper-26 {
  position: absolute;
  top: 195px;
  left: 31px;
  width: 218px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #ffffff;
  font-size: 26px;
  text-align: center;
  letter-spacing: -0.78px;
  line-height: 31.2px;
}

.sitio-web-design .text-wrapper-27 {
  position: absolute;
  top: 113px;
  left: 27px;
  width: 226px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .fluent-people {
  position: absolute;
  top: 37px;
  left: 102px;
  width: 76px;
  height: 76px;
  aspect-ratio: 1;
}

.sitio-web-design .rectangle-13 {
  background-color: #ff751f;
  position: absolute;
  top: 0;
  left: 0;
  width: 279px;
  height: 427px;
  border-radius: 25px;
}

.sitio-web-design .text-wrapper-28 {
  position: absolute;
  top: 113px;
  left: 2px;
  width: 275px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .ri-target-fill {
  position: absolute;
  top: 28px;
  left: 97px;
  width: 85px;
  height: 85px;
  aspect-ratio: 1;
}

.sitio-web-design .beneficios {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 65px 116px;
  position: relative;
  flex: 0 0 auto;
  background-color: #ffffff;
}

.sitio-web-design .text-wrapper-29 {
  position: relative;
  width: 1169px;
  height: 117px;
  margin-top: -1.00px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #2c2c2c;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-30 {
  position: relative;
  width: 1164px;
  height: 79px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #828282;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .cuadros-comparativos {
  display: inline-flex;
  align-items: center;
  gap: 62px;
  position: relative;
  flex: 0 0 auto;
}

.sitio-web-design .operativos {
  display: flex;
  flex-direction: column;
  width: 519px;
  align-items: center;
  gap: 21px;
  padding: 15px 35px;
  position: relative;
  background-color: #ffffff;
  border-radius: 30px;
  border: none;
}

.sitio-web-design .operativos::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 4px;
  border-radius: 30px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.sitio-web-design .operativos-2 {
  position: relative;
  align-self: stretch;
  height: 83px;
  margin-top: -4.00px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: transparent;
  font-size: 50px;
  text-align: center;
  letter-spacing: -1.50px;
  line-height: 60.0px;
}

.sitio-web-design .span {
  font-weight: 500;
  color: #2c2c2c;
  letter-spacing: -0.75px;
}

.sitio-web-design .text-wrapper-31 {
  color: #000000;
  font-size: 32px;
  letter-spacing: -0.31px;
  line-height: 38.4px;
}

.sitio-web-design .text-wrapper-32 {
  position: relative;
  align-self: stretch;
  height: 482px;
  font-family: "Poppins", Helvetica;
  font-weight: 600;
  color: #632f1b;
  font-size: 24px;
  letter-spacing: -0.72px;
  line-height: 28.8px;
}

.sitio-web-design .estrategicos {
  display: flex;
  flex-direction: column;
  width: 519px;
  align-items: center;
  gap: 23px;
  padding: 13px 35px;
  position: relative;
  background-color: #ffffff;
  border-radius: 30px;
  border: none;
}

.sitio-web-design .estrategicos::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 4px;
  border-radius: 30px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.sitio-web-design .text-wrapper-33 {
  position: relative;
  align-self: stretch;
  height: 83px;
  margin-top: -4.00px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #2c2c2c;
  font-size: 50px;
  text-align: center;
  letter-spacing: -1.50px;
  line-height: 60.0px;
}

.sitio-web-design .casos-de-usos {
  position: relative;
  width: 1440px;
  height: 1183px;
  background-color: #ffffff;
}

.sitio-web-design .frame {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, fit-content(100%));
  width: 1373px;
  height: 842px;
  gap: 24px 11px;
  position: absolute;
  top: 307px;
  left: 33px;
}

.sitio-web-design .ejemplo {
  grid-row: 1 / 2;
  grid-column: 1 / 2;
  background-color: #fff9a6;
  position: relative;
  width: 681px;
  height: 409px;
  border-radius: 36px;
  overflow: hidden;
}

.sitio-web-design .text-wrapper-34 {
  position: absolute;
  top: 26px;
  left: 32px;
  width: 616px;
  font-family: "Poppins", Helvetica;
  font-weight: 700;
  color: #3f1809;
  font-size: 40px;
  text-align: center;
  letter-spacing: -1.20px;
  line-height: 48.0px;
}

.sitio-web-design .text-wrapper-35 {
  position: absolute;
  top: 64px;
  left: 32px;
  width: 616px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #3f1809;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .text-wrapper-36 {
  position: absolute;
  top: 123px;
  left: 56px;
  width: 616px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #3f1809;
  font-size: 30px;
  letter-spacing: -0.90px;
  line-height: 36.0px;
}

.sitio-web-design .resultados {
  position: absolute;
  top: 290px;
  left: 13px;
  width: 317px;
  height: 79px;
  background-color: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  border: none;
}

.sitio-web-design .resultados::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px;
  border-radius: 20px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.sitio-web-design .text-wrapper-37 {
  position: absolute;
  top: 13px;
  left: 67px;
  width: 269px;
  height: 53px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .tabler-clock {
  position: absolute;
  top: 10px;
  left: 24px;
  width: 60px;
  height: 60px;
  aspect-ratio: 1;
}

.sitio-web-design .resultados-2 {
  position: absolute;
  top: 290px;
  left: 349px;
  width: 317px;
  height: 79px;
  display: flex;
  background-color: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  border: none;
}

.sitio-web-design .resultados-2::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px;
  border-radius: 20px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.sitio-web-design .hugeicons-sale-tag {
  margin-top: 13px;
  width: 51px;
  height: 51px;
  margin-left: 12px;
  aspect-ratio: 1;
}

.sitio-web-design .text-wrapper-38 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 13px;
  width: 245px;
  height: 53px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .ejemplo-2 {
  grid-row: 1 / 2;
  grid-column: 2 / 3;
  background-color: #ffd699;
  position: relative;
  width: 681px;
  height: 409px;
  border-radius: 36px;
  overflow: hidden;
}

.sitio-web-design .text-wrapper-39 {
  position: absolute;
  top: 13px;
  left: 60px;
  width: 269px;
  height: 53px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .si-pin-line {
  position: absolute;
  top: 8px;
  left: 14px;
  width: 58px;
  height: 58px;
  aspect-ratio: 1;
}

.sitio-web-design .resultados-3 {
  position: absolute;
  top: 290px;
  left: 349px;
  width: 317px;
  height: 79px;
  background-color: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  border: none;
}

.sitio-web-design .resultados-3::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px;
  border-radius: 20px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.sitio-web-design .text-wrapper-40 {
  position: absolute;
  top: 13px;
  left: 48px;
  width: 269px;
  height: 53px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .proicons-bolt {
  position: absolute;
  top: 5px;
  left: 6px;
  width: 61px;
  height: 61px;
  aspect-ratio: 1;
}

.sitio-web-design .ejemplo-3 {
  grid-row: 2 / 3;
  grid-column: 1 / 2;
  background-color: #ffbc93;
  position: relative;
  width: 681px;
  height: 409px;
  border-radius: 36px;
  overflow: hidden;
}

.sitio-web-design .fluent-target {
  position: absolute;
  top: 17px;
  left: 31px;
  width: 46px;
  height: 46px;
  aspect-ratio: 1;
}

.sitio-web-design .resultados-4 {
  gap: 27px;
  position: absolute;
  top: 290px;
  left: 349px;
  width: 317px;
  height: 79px;
  display: flex;
  background-color: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  border: none;
}

.sitio-web-design .resultados-4::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px;
  border-radius: 20px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.sitio-web-design .ph-calendar-light {
  margin-top: 13px;
  width: 59px;
  height: 59px;
  margin-left: 8px;
  aspect-ratio: 1;
}

.sitio-web-design .text-wrapper-41 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 13px;
  width: 207px;
  height: 53px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .ejemplo-4 {
  grid-row: 2 / 3;
  grid-column: 2 / 3;
  background-color: #ff9f64;
  position: relative;
  width: 681px;
  height: 409px;
  border-radius: 36px;
  overflow: hidden;
}

.sitio-web-design .resultados-5 {
  position: absolute;
  top: 290px;
  left: 13px;
  width: 317px;
  height: 79px;
  display: flex;
  gap: 95px;
  background-color: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  border: none;
}

.sitio-web-design .resultados-5::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 3px;
  border-radius: 20px;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: 1;
  pointer-events: none;
}

.sitio-web-design .fluent-document {
  margin-top: 11px;
  width: 57px;
  height: 57px;
  margin-left: 15px;
  aspect-ratio: 1;
}

.sitio-web-design .text-wrapper-42 {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 13px;
  width: 139px;
  height: 53px;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .text-wrapper-43 {
  position: absolute;
  top: 13px;
  left: 65px;
  width: 269px;
  height: 53px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .prime-check-square {
  position: absolute;
  top: 11px;
  left: 13px;
  width: 58px;
  height: 58px;
  aspect-ratio: 1;
}

.sitio-web-design .resultados-6 {
  position: relative;
  width: 1440px;
  height: 886px;
  background-color: #ffffff;
}

.sitio-web-design .text-wrapper-44 {
  position: absolute;
  top: 95px;
  left: 50px;
  width: 1339px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #2c2c2c;
  font-size: 48px;
  text-align: center;
  letter-spacing: -1.44px;
  line-height: 57.6px;
}

.sitio-web-design .text-wrapper-45 {
  position: absolute;
  top: 404px;
  left: 7px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-background-clip: text !important;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: transparent;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-46 {
  left: 373px;
  position: absolute;
  top: 404px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-background-clip: text !important;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: transparent;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-47 {
  left: 739px;
  position: absolute;
  top: 404px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-background-clip: text !important;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: transparent;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-48 {
  position: absolute;
  top: 404px;
  left: 1105px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(
    90deg,
    rgba(255, 216, 88, 1) 0%,
    rgba(255, 146, 77, 1) 100%
  );
  -webkit-background-clip: text !important;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: transparent;
  font-size: 64px;
  text-align: center;
  letter-spacing: -1.92px;
  line-height: 76.8px;
}

.sitio-web-design .text-wrapper-49 {
  position: absolute;
  top: 512px;
  left: 7px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #632f1b;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .text-wrapper-50 {
  position: absolute;
  top: 512px;
  left: 373px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #632f1b;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .text-wrapper-51 {
  position: absolute;
  top: 512px;
  left: 739px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #632f1b;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .text-wrapper-52 {
  position: absolute;
  top: 512px;
  left: 1105px;
  width: 335px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #632f1b;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .frame-final {
  position: relative;
  width: 1440px;
  height: 445px;
  background-color: #2b0e02;
}

.sitio-web-design .text-wrapper-53 {
  position: absolute;
  top: 59px;
  left: 123px;
  width: 234px;
  font-family: "Poppins", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 48px;
  letter-spacing: -1.44px;
  line-height: 57.6px;
  white-space: nowrap;
}

.sitio-web-design .text-wrapper-54 {
  position: absolute;
  top: 211px;
  left: 114px;
  width: 416px;
  font-family: "Poppins", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 32px;
  letter-spacing: -0.96px;
  line-height: 38.4px;
}

.sitio-web-design .formulario {
  position: absolute;
  top: 29px;
  left: 800px;
  width: 599px;
  height: 400px;
  display: flex;
  flex-direction: column;
}

    .sitio-web-design .iframeee {
        position: absolute;
        top: 29px;
        left: 800px;
        width: 47%;
        height: auto;
        display: flex;
        flex-direction: column;
    }

.sitio-web-design .rectangle-14 {
  width: 595px;
  height: 42px;
  background-color: #ffffff;
  border-radius: 20px;
}

.sitio-web-design .rectangle-15 {
  width: 595px;
  height: 42px;
  margin-top: 14px;
  background-color: #ffffff;
  border-radius: 20px;
}

.sitio-web-design .rectangle-16 {
  width: 595px;
  height: 113px;
  margin-top: 14px;
  background-color: #ffffff;
  border-radius: 20px;
}

.sitio-web-design .boton-2 {
  margin-left: 180px;
  width: 239px;
  height: 46px;
  margin-top: 20px;
  display: flex;
  background-color: #ffffff;
  border-radius: 26px;
  overflow: hidden;
}

.sitio-web-design .text-wrapper-55 {
  margin-top: 7px;
  width: 201px;
  height: 32px;
  margin-left: 20px;
  font-family: "Poppins", Helvetica;
  font-weight: 600;
  color: #2c2c2c;
  font-size: 32px;
  text-align: center;
  letter-spacing: -0.96px;
  line-height: 38.4px;
  white-space: nowrap;
}

.sitio-web-design .ic-baseline-facebook {
  position: absolute;
  top: 127px;
  left: 114px;
  width: 52px;
  height: 52px;
  aspect-ratio: 1;
}

.sitio-web-design .mdi-instagram {
  position: absolute;
  top: 132px;
  left: 174px;
  width: 44px;
  height: 44px;
  aspect-ratio: 1;
}

.sitio-web-design .mdi-linkedin {
  position: absolute;
  top: 131px;
  left: 226px;
  width: 44px;
  height: 44px;
  aspect-ratio: 1;
}

.sitio-web-design .mdi-youtube {
  position: absolute;
  top: 127px;
  left: 278px;
  width: 53px;
  height: 53px;
  aspect-ratio: 1;
}
/* Original CSS code should be injected here from the existing style.css file */

/* Additional styles for refactored semantic HTML elements */

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.encabezado nav {
  display: flex;
  align-items: center;
  gap: 59px;
}

.encabezado a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.encabezado a:hover,
.encabezado a:focus {
  opacity: 0.8;
}

.encabezado button,
.div-wrapper,
.boton-2,
.ei-arrow-left,
.ei-arrow-left-2 {
  cursor: pointer;
  border: none;
  background: transparent;
  padding: 0;
}

.encabezado button:hover,
.encabezado button:focus,
.div-wrapper:hover,
.div-wrapper:focus,
.boton-2:hover,
.boton-2:focus,
.ei-arrow-left:hover,
.ei-arrow-left:focus,
.ei-arrow-left-2:hover,
.ei-arrow-left-2:focus {
  opacity: 0.9;
  transform: scale(1.02);
  transition: all 0.2s ease;
}

.boton,
.div-wrapper,
.boton-2 {
  transition: all 0.2s ease;
}

.formulario input,
.formulario textarea {
  border: none;
  padding: 12px 20px;
  font-family: "Poppins", Helvetica;
  font-size: 16px;
  color: #2c2c2c;
  outline: none;
}

.formulario input:focus,
.formulario textarea:focus {
  box-shadow: 0 0 0 3px rgba(255, 146, 77, 0.3);
}

.formulario input::placeholder,
.formulario textarea::placeholder {
  color: #828282;
  opacity: 0.7;
}

.formulario textarea {
  resize: vertical;
  min-height: 113px;
  font-family: "Poppins", Helvetica;
}

.frame-final nav {
  display: flex;
  gap: 8px;
  position: absolute;
  top: 127px;
  left: 114px;
}

.frame-final nav a {
  display: inline-block;
  transition: transform 0.2s ease;
}

.frame-final nav a:hover,
.frame-final nav a:focus {
  transform: scale(1.1);
}

.como-funciona {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ei-arrow-left img,
.ei-arrow-left-2 img {
  width: 100%;
  height: 100%;
}

button[type="submit"] {
  cursor: pointer;
}

a[href^="mailto:"] {
  color: inherit;
  text-decoration: none;
}

a[href^="mailto:"]:hover,
a[href^="mailto:"]:focus {
  text-decoration: underline;
}