.element {
    background-color: transparent;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
  }
  
  .element .div {
    width: 1920px;
    height: 7164px;
    position: relative;
  }
  
  .element .overlap {
    position: absolute;
    width: 1920px;
    height: 932px;
    top: 6232px;
    left: 0;
    background-color: #0e0e0e;
  }
  
  .element .text-wrapper {
    position: absolute;
    top: 139px;
    left: 70px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 80px;
    letter-spacing: -4.00px;
    line-height: 80px;
    white-space: nowrap;
  }
  
  .element .text-wrapper-2 {
    position: absolute;
    width: 880px;
    top: 139px;
    left: 970px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 80px;
    letter-spacing: -4.00px;
    line-height: 80px;
  }
  
  .element .text-wrapper-3 {
    position: absolute;
    top: 493px;
    left: 70px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #9a9a9a;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
  }
  
  .element .text-wrapper-4 {
    position: absolute;
    top: 309px;
    left: 70px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #9a9a9a;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
  }
  
  .element .p {
    width: 521px;
    top: 349px;
    left: 970px;
    color: #9a9a9a;
    font-size: 34px;
    letter-spacing: -1.02px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-5 {
    position: absolute;
    top: 371px;
    left: 70px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 34px;
    letter-spacing: -1.02px;
    line-height: normal;
  }
  
  .element .view {
    position: absolute;
    width: 290px;
    height: 50px;
    top: 556px;
    left: 70px;
  }
  
  .element .group {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0;
    left: 180px;
    background-color: #ffffff;
    border-radius: 25px;
  }
  
  .element .vector {
    position: absolute;
    width: 34px;
    height: 20px;
    top: 16px;
    left: 8px;
  }
  
  .element .vector-wrapper {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0;
    left: 120px;
    background-color: #ffffff;
    border-radius: 25px;
  }
  
  .element .img {
    position: absolute;
    width: 29px;
    height: 28px;
    top: 11px;
    left: 11px;
  }
  
  .element .group-wrapper {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0;
    left: 0;
    background-color: #ffffff;
    border-radius: 25px;
  }
  
  .element .group-2 {
    position: absolute;
    width: 36px;
    height: 36px;
    top: 7px;
    left: 6px;
  }
  
  .element .img-wrapper {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0;
    left: 60px;
    background-color: #ffffff;
    border-radius: 25px;
  }
  
  .element .group-3 {
    position: absolute;
    width: 29px;
    height: 29px;
    top: 11px;
    left: 10px;
  }
  
  .element .group-4 {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0;
    left: 240px;
    background-color: #ffffff;
    border-radius: 25px;
  }
  
  .element .vector-2 {
    position: absolute;
    width: 30px;
    height: 24px;
    top: 13px;
    left: 10px;
  }
  
    .element .button {
      all: unset;
      box-sizing: border-box;
      position: absolute;
      width: 880px;
      height: 100px;
      top: 506px;
      left: 970px;
      background-color: #ccff4a;
      border-radius: 20px;
    }
  
  .element .text-wrapper-6 {
    top: 37px;
    left: 348px;
    color: #0e0e0e;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    white-space: nowrap;
  }
  
  .element .vector-3 {
    position: absolute;
    width: 1780px;
    height: 1px;
    top: 686px;
    left: 70px;
    object-fit: cover;
  }
  
  .element .text-wrapper-7 {
    position: absolute;
    top: 849px;
    left: 605px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
  }
  
  .element .text-wrapper-8 {
    top: 807px;
    left: 605px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .webvibe-studio {
    position: absolute;
    top: 765px;
    left: 605px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #9a9a9a;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
  }
  
  .element .text-wrapper-9 {
    top: 849px;
    left: 827px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-10 {
    top: 849px;
    left: 986px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-11 {
    top: 849px;
    left: 1209px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-12 {
    top: 807px;
    left: 827px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-13 {
    top: 807px;
    left: 986px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-14 {
    top: 807px;
    left: 1209px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-15 {
    top: 765px;
    left: 827px;
    color: #9a9a9a;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .element-webvibe-studio {
    position: absolute;
    top: 854px;
    left: 1705px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 14px;
    text-align: right;
    letter-spacing: -0.42px;
    line-height: normal;
  }
  
  .element .logo {
    position: absolute;
    width: 283px;
    height: 106px;
    top: 766px;
    left: 70px;
  }
  
  .element .by-shevchenko {
    position: absolute;
    top: 89px;
    left: 187px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 14px;
    letter-spacing: -0.42px;
    line-height: normal;
  }
  
  .element .span {
    letter-spacing: -0.06px;
  }
  
  .element .group-5 {
    position: absolute;
    width: 167px;
    height: 106px;
    top: 0;
    left: 0;
  }
  
  .element .text-wrapper-16 {
    position: absolute;
    top: 5149px;
    left: 1782px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 26px;
    white-space: nowrap;
  }
  
  .element .text-wrapper-17 {
    top: 5149px;
    left: 70px;
    color: #0e0e0e;
    font-size: 80px;
    letter-spacing: -4.00px;
    line-height: 80px;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-18 {
    width: 653px;
    top: 5369px;
    left: 70px;
    color: #9a9a9a;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 5334px;
    left: 970px;
    background-color: #ffffff;
    border-radius: 20px;
    border: 1px solid;
    border-color: #0e0e0e;
  }
  
  .element .text-wrapper-19 {
    top: 36px;
    left: 39px;
    color: #0e0e0e;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .group-6 {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 29px;
    left: 809px;
    background-color: #0e0e0e;
    border-radius: 10px;
  }
  
  .element .vector-4 {
    position: absolute;
    width: 22px;
    height: 13px;
    top: 13px;
    left: 9px;
  }
  
  .element .frame-2 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 5752px;
    left: 970px;
    background-color: #ffffff;
    border-radius: 20px;
    border: 1px solid;
    border-color: #0e0e0e;
  }
  
  .element .frame-3 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 5872px;
    left: 970px;
    background-color: #ffffff;
    border-radius: 20px;
    border: 1px solid;
    border-color: #0e0e0e;
  }
  
  .element .frame-4 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 5992px;
    left: 970px;
    background-color: #ffffff;
    border-radius: 20px;
    border: 1px solid;
    border-color: #0e0e0e;
  }
  
  .element .open {
    position: absolute;
    width: 880px;
    height: 278px;
    top: 5454px;
    left: 970px;
  }
  
  .element .frame-5 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 0;
    left: 0;
    background-color: #ffffff;
    border-radius: 20px;
    border: 1px solid;
    border-color: #0e0e0e;
  }
  
  .element .overlap-group {
    position: absolute;
    width: 880px;
    height: 168px;
    top: 110px;
    left: 0;
    background-color: #0e0e0e;
    border-radius: 20px;
  }
  
  .element .text-wrapper-20 {
    width: 800px;
    top: 29px;
    left: 40px;
    color: #ffffff;
    font-size: 22px;
    letter-spacing: -0.66px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-21 {
    top: 3943px;
    left: 1758px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 26px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-22 {
    top: 3943px;
    left: 70px;
    color: #0e0e0e;
    font-size: 80px;
    letter-spacing: -4.00px;
    line-height: 80px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .div-wrapper {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    width: 1780px;
    height: 100px;
    top: 4910px;
    left: 70px;
    background-color: #0e0e0e;
    border-radius: 20px;
  }
  
  .element .text-wrapper-23 {
    top: 37px;
    left: 817px;
    color: #ffffff;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .overlap-2 {
    position: absolute;
    width: 1180px;
    height: 756px;
    top: 4104px;
    left: 70px;
    background-image: url(https://c.animaapp.com/qdc4yKmC/img/2.png);
    background-size: cover;
    background-position: 50% 50%;
  }
  
  .element .button-2 {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    width: 168px;
    height: 50px;
    top: 20px;
    left: 992px;
    background-color: #ffffff;
    border-radius: 100px;
  }
  
  .element .text-wrapper-24 {
    top: 16px;
    left: 41px;
    color: #0e0e0e;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: 17.1px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .button-3 {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    width: 180px;
    height: 50px;
    top: 20px;
    left: 802px;
    background-color: #ffffff;
    border-radius: 100px;
  }
  
  .element .text-wrapper-25 {
    top: 16px;
    left: 14px;
    color: #0e0e0e;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: 17.1px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-26 {
    position: absolute;
    top: 665px;
    left: 40px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 50px;
    letter-spacing: -2.50px;
    line-height: 50px;
    white-space: nowrap;
  }
  
  .element .overlap-3 {
    position: absolute;
    width: 580px;
    height: 368px;
    top: 4492px;
    left: 1270px;
    background-image: url(https://c.animaapp.com/qdc4yKmC/img/3.png);
    background-size: cover;
    background-position: 50% 50%;
  }
  
  .element .button-4 {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    width: 168px;
    height: 50px;
    top: 20px;
    left: 392px;
    background-color: #ffffff;
    border-radius: 100px;
  }
  
  .element .button-5 {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    width: 180px;
    height: 50px;
    top: 20px;
    left: 202px;
    background-color: #ffffff;
    border-radius: 100px;
  }
  
  .element .overlap-4 {
    position: absolute;
    width: 580px;
    height: 368px;
    top: 4104px;
    left: 1270px;
    background-image: url(https://c.animaapp.com/qdc4yKmC/img/1.png);
    background-size: cover;
    background-position: 50% 50%;
  }
  
  .element .overlap-5 {
    position: absolute;
    width: 1920px;
    height: 1056px;
    top: 2748px;
    left: 0;
    background-color: #0e0e0e;
  }
  
  .element .text-wrapper-27 {
    width: 1150px;
    top: 139px;
    left: 70px;
    color: #ffffff;
    font-size: 80px;
    letter-spacing: -4.00px;
    line-height: 80px;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-28 {
    width: 653px;
    top: 379px;
    left: 70px;
    color: #ffffff;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .SEO {
    position: absolute;
    width: 653px;
    top: 379px;
    left: 970px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #9a9a9a;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
  }
  
  .element .text-wrapper-29 {
    top: 139px;
    left: 1755px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 26px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-6 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 576px;
    left: 70px;
    background-color: #ffffff;
    border-radius: 20px;
  }
  
  .element .text-wrapper-30 {
    top: 37px;
    left: 40px;
    color: #0e0e0e;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-31 {
    top: 37px;
    left: 657px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .group-7 {
    background-color: #0e0e0e;
    position: absolute;
    width: 40px;
    height: 40px;
    top: 30px;
    left: 810px;
    border-radius: 10px;
  }
  
  .element .vector-5 {
    position: absolute;
    width: 13px;
    height: 22px;
    top: 9px;
    left: 15px;
  }
  
  .element .frame-7 {
    width: 880px;
    top: 696px;
    background-color: #ffffff;
    position: absolute;
    height: 100px;
    left: 70px;
    border-radius: 20px;
  }
  
  .element .text-wrapper-32 {
    top: 37px;
    left: 658px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-8 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 816px;
    left: 70px;
    background-color: #ffffff;
    border-radius: 20px;
  }
  
  .element .text-wrapper-33 {
    top: 37px;
    left: 653px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-9 {
    top: 576px;
    position: absolute;
    width: 880px;
    height: 100px;
    left: 970px;
    background-color: #ffffff;
    border-radius: 20px;
  }
  
  .element .text-wrapper-34 {
    top: 37px;
    left: 651px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-10 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 696px;
    left: 970px;
    background-color: #ffffff;
    border-radius: 20px;
  }
  
  .element .text-wrapper-35 {
    top: 37px;
    left: 652px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-36 {
    top: 865px;
    left: 1420px;
    color: #ffffff;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .button-6 {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    width: 168px;
    height: 50px;
    top: 866px;
    left: 1682px;
    background-color: #ccff4a;
    border-radius: 100px;
  }
  
  .element .text-wrapper-37 {
    top: 16px;
    left: 15px;
    color: #0e0e0e;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: 17.1px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-38 {
    width: 1150px;
    top: 1797px;
    left: 70px;
    color: #0e0e0e;
    font-size: 80px;
    letter-spacing: -4.00px;
    line-height: 80px;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-11 {
    width: 1780px;
    top: 2508px;
    background-color: #ccff4a;
    position: absolute;
    height: 100px;
    left: 70px;
    border-radius: 20px;
  }
  
  .element .text-wrapper-39 {
    top: 37px;
    left: 791px;
    color: #0e0e0e;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-40 {
    top: 2175px;
    left: 70px;
    color: #0e0e0e;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-41 {
    top: 2175px;
    left: 1514px;
    color: #0e0e0e;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-42 {
    top: 1797px;
    left: 1655px;
    color: #9a9a9a;
    font-size: 26px;
    text-align: right;
    letter-spacing: -1.30px;
    line-height: 26px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-43 {
    width: 866px;
    top: 2267px;
    left: 70px;
    color: #9a9a9a;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-44 {
    width: 880px;
    top: 2267px;
    left: 970px;
    color: #9a9a9a;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-45 {
    top: 2175px;
    left: 777px;
    color: #0e0e0e;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-46 {
    top: 2117px;
    left: 777px;
    color: #9a9a9a;
    font-size: 40px;
    letter-spacing: -2.80px;
    line-height: 38.0px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-47 {
    top: 2117px;
    left: 1514px;
    color: #9a9a9a;
    font-size: 40px;
    letter-spacing: -2.80px;
    line-height: 38.0px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-48 {
    top: 2117px;
    left: 70px;
    color: #9a9a9a;
    font-size: 40px;
    letter-spacing: -2.80px;
    line-height: 38.0px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-12 {
    top: 1438px;
    border: 1px solid;
    border-color: #0e0e0e;
    position: absolute;
    width: 880px;
    height: 100px;
    left: 970px;
    background-color: #ffffff;
    border-radius: 20px;
  }
  
  .element .webvibe-studio-2 {
    top: 1129px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    color: #0e0e0e;
    font-size: 80px;
    letter-spacing: -4.00px;
    line-height: 80px;
    position: absolute;
    left: 70px;
    font-weight: 400;
  }
  
  .element .frame-13 {
    position: absolute;
    width: 880px;
    height: 100px;
    top: 1558px;
    left: 970px;
    background-color: #0e0e0e;
    border-radius: 20px;
  }
  
  .element .text-wrapper-49 {
    top: 37px;
    left: 40px;
    color: #ffffff;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 24.7px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .group-8 {
    background-color: #ffffff;
    position: absolute;
    width: 40px;
    height: 40px;
    top: 30px;
    left: 810px;
    border-radius: 10px;
  }
  
  .element .webvibe-studio-3 {
    width: 730px;
    top: 1369px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    color: transparent;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    left: 70px;
    font-weight: 400;
  }
  
  .element .text-wrapper-50 {
    color: #0e0e0e;
    letter-spacing: -0.20px;
  }
  
  .element .text-wrapper-51 {
    color: #9c9c9c;
    letter-spacing: -0.20px;
  }
  
  .element .text-wrapper-52 {
    top: 1129px;
    left: 1767px;
    color: #9c9c9c;
    font-size: 26px;
    letter-spacing: -1.30px;
    line-height: 26px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .NEXBOT-robot {
    position: absolute;
    width: 1920px;
    height: 990px;
    top: 0;
    left: 0;
  }
  
  .element .bg {
    position: absolute;
    width: 1920px;
    height: 990px;
    top: 0;
    left: 0;
    background-color: #0e0e0e;
    transform: rotate(180deg);
  }
  
  .element .group-9 {
    position: absolute;
    width: 970px;
    height: 676px;
    top: 208px;
    left: 750px;
  }
  
  .element .div-2 {
    top: 289px;
    left: 70px;
    color: transparent;
    font-size: 100px;
    letter-spacing: -7.00px;
    line-height: 95.0px;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-53 {
    color: #ffffff;
  }
  
  .element .text-wrapper-54 {
    color: #ccff4a;
  }
  
  .element .webvibe-studio-4 {
    width: 908px;
    top: 634px;
    font-family: "Neue Haas Grotesk Text Pro-Bold", Helvetica;
    color: #ffffff;
    font-size: 26px;
    letter-spacing: -0.78px;
    line-height: normal;
    position: absolute;
    left: 70px;
    font-weight: 400;
  }
  
  .element .text-wrapper-55 {
    font-weight: 700;
    letter-spacing: -0.20px;
  }
  
  .element .text-wrapper-56 {
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    letter-spacing: -0.20px;
  }
  
  .element .frame-14 {
    position: absolute;
    width: 280px;
    height: 80px;
    top: 750px;
    left: 970px;
    background-color: #ffffff24;
    border-radius: 10px;
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
  }
  
  .element .text-wrapper-57 {
    top: 27px;
    left: 149px;
    color: #ffffff;
    font-size: 20px;
    text-align: right;
    letter-spacing: -0.60px;
    line-height: normal;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .overlap-6 {
    position: absolute;
    width: 80px;
    height: 80px;
    top: 0;
    left: 0;
    background-color: #ffffff;
    border-radius: 10px;
    backdrop-filter: blur(20px) brightness(100%);
    -webkit-backdrop-filter: blur(20px) brightness(100%);
  }
  
  .element .text-wrapper-58 {
    top: 20px;
    left: 9px;
    color: #9a9a9a;
    font-size: 40px;
    text-align: center;
    letter-spacing: -2.80px;
    line-height: 38.0px;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    white-space: nowrap;
  }
  
  .element .frame-15 {
    position: absolute;
    width: 280px;
    height: 80px;
    top: 470px;
    left: 1420px;
    background-color: #ffffff24;
    border-radius: 10px;
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
  }
  
  .element .text-wrapper-59 {
    top: 27px;
    left: 120px;
    color: #ffffff;
    font-size: 20px;
    text-align: right;
    letter-spacing: -0.60px;
    line-height: normal;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-16 {
    position: absolute;
    width: 280px;
    height: 80px;
    top: 270px;
    left: 1270px;
    background-color: #ffffff24;
    border-radius: 10px;
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
  }
  
  .element .text-wrapper-60 {
    top: 27px;
    left: 102px;
    color: #ffffff;
    font-size: 20px;
    text-align: right;
    letter-spacing: -0.60px;
    line-height: normal;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .frame-17 {
    position: absolute;
    width: 280px;
    height: 80px;
    top: 170px;
    left: 470px;
    background-color: #ffffff24;
    border-radius: 10px;
    backdrop-filter: blur(10px) brightness(100%);
    -webkit-backdrop-filter: blur(10px) brightness(100%);
  }
  
  .element .text-wrapper-61 {
    top: 20px;
    left: 13px;
    color: #9a9a9a;
    font-size: 40px;
    text-align: center;
    letter-spacing: -2.80px;
    line-height: 38.0px;
    white-space: nowrap;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .by-shevchenko-2 {
    position: absolute;
    top: 54px;
    left: 159px;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 12px;
    letter-spacing: -0.36px;
    line-height: normal;
  }
  
  .element .text-wrapper-62 {
    letter-spacing: -0.04px;
  }
  
  .element .group-10 {
    position: absolute;
    width: 417px;
    height: 22px;
    top: 34px;
    left: 755px;
  }
  
  .element .text-wrapper-63 {
    top: 0;
    left: 231px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-64 {
    top: 0;
    left: 0;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .text-wrapper-65 {
    top: 0;
    left: 333px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: -0.90px;
    line-height: normal;
    position: absolute;
    font-family: "Neue Haas Grotesk Text Pro-Regular", Helvetica;
    font-weight: 400;
  }
  
  .element .group-11 {
    position: absolute;
    width: 76px;
    height: 22px;
    top: 0;
    left: 107px;
  }
  
  .element .vector-6 {
    position: absolute;
    width: 13px;
    height: 6px;
    top: 10px;
    left: 62px;
  }
  
  .element .group-12 {
    position: absolute;
    width: 79px;
    height: 50px;
    top: 20px;
    left: 70px;
  }
  
  .element .button-7 {
    all: unset;
    box-sizing: border-box;
    position: absolute;
    width: 168px;
    height: 50px;
    top: 20px;
    left: 1682px;
    background-color: #ccff4a;
    border-radius: 100px;
  }

  spline-viewer {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
  width: 100%;
  height: 100vh;
 
    
  }


  /* Ваш оригинальный код здесь */

/* Адаптивные стили */
@media (max-width: 1200px) {
  .element .text-wrapper-43, .element .text-wrapper-44, .element .text-wrapper-45, 
  .element .text-wrapper-46, .element .text-wrapper-47, .element .text-wrapper-48,
  .element .webvibe-studio-2, .element .text-wrapper-52 {
    font-size: 22px; /* Уменьшаем размер шрифта */
  }
  
  .element .frame-12, .element .frame-13, .element .frame-14, .element .frame-15,
  .element .frame-16, .element .frame-17 {
    width: 80%; /* Уменьшаем ширину фреймов */
    left: 10%;
  }
  
  .element .text-wrapper-57, .element .text-wrapper-59, .element .text-wrapper-60 {
    font-size: 18px; /* Уменьшаем размер шрифта в текстах внутри фреймов */
  }
  
  .element .text-wrapper-43 {
    width: 100%; /* Ширина текста растягивается на всю ширину контейнера */
    left: 0;
  }

  .element .group-8, .element .group-9, .element .group-10, .element .group-11, .element .group-12 {
    width: 100%; /* Группы становятся на всю ширину экрана */
    left: 0;
  }

  .element .text-wrapper-63, .element .text-wrapper-64, .element .text-wrapper-65 {
    font-size: 16px; /* Уменьшаем размер шрифта */
  }

  .element .button-7 {
    width: 140px; /* Уменьшаем размер кнопки */
    left: 80%;
  }
}

@media (max-width: 768px) {
  /* Для мобильных устройств */
  .element .text-wrapper-43, .element .text-wrapper-44, .element .text-wrapper-45, 
  .element .text-wrapper-46, .element .text-wrapper-47, .element .text-wrapper-48 {
    font-size: 18px;
    width: 100%;
    left: 0;
  }

  .element .webvibe-studio-2 {
    font-size: 50px;
    letter-spacing: -2px;
  }

  .element .frame-12, .element .frame-13, .element .frame-14, .element .frame-15,
  .element .frame-16, .element .frame-17 {
    width: 90%; /* Уменьшаем ширину фреймов */
    left: 5%;
  }

  .element .text-wrapper-57, .element .text-wrapper-59, .element .text-wrapper-60 {
    font-size: 16px;
  }

  .element .group-8, .element .group-9, .element .group-10, .element .group-11, .element .group-12 {
    width: 100%;
    left: 0;
  }

  .element .button-7 {
    width: 120px; /* Уменьшаем размер кнопки */
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (max-width: 480px) {
  /* Для очень маленьких экранов */
  .element .text-wrapper-43, .element .text-wrapper-44, .element .text-wrapper-45, 
  .element .text-wrapper-46, .element .text-wrapper-47, .element .text-wrapper-48 {
    font-size: 16px; /* Сильно уменьшаем шрифт */
    width: 100%;
    left: 0;
  }

  .element .webvibe-studio-2 {
    font-size: 40px; /* Уменьшаем размер шрифта */
  }

  .element .frame-12, .element .frame-13, .element .frame-14, .element .frame-15,
  .element .frame-16, .element .frame-17 {
    width: 100%;
    left: 0;
  }

  .element .text-wrapper-57, .element .text-wrapper-59, .element .text-wrapper-60 {
    font-size: 14px; /* Уменьшаем размер шрифта */
  }

  .element .button-7 {
    width: 100px; /* Сильно уменьшаем размер кнопки */
    left: 50%;
    transform: translateX(-50%);
  }

  .element .group-8, .element .group-9, .element .group-10, .element .group-11, .element .group-12 {
    width: 100%;
    left: 0;
  }

  .element .text-wrapper-63, .element .text-wrapper-64, .element .text-wrapper-65 {
    font-size: 14px; /* Снижаем размер шрифта */
  }
}
html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow-x: hidden; /* Убираем горизонтальную прокрутку */
}

body {
  transform: scale(0.78); /* Уменьшаем масштаб */
  transform-origin: top left; /* Масштабирование от верхнего левого угла */
  width: 128.2%; /* Увеличиваем ширину для компенсации масштаба */
  height: auto; /* Автоматическая высота */
  overflow-y: scroll; /* Разрешаем вертикальную прокрутку */
}

* {
  box-sizing: border-box; /* Все элементы с учетом границ и отступов */
}