html , body {
    background-color: #000000;
    color: #ffffff;

  }

  .landing-page , .main {
    color: #ffffff;
    width: 99%;
    text-align: left;
  }

  .cards{
    margin-left: 20%;
  }


  .landing-page .vector , .landing_page_vector {
    position: absolute;
    width: 100%;
    height: 710px;
    left: 0;
  }
  .nav_button{
    border: 1px solid #b3aaaa;
    padding: 5px;
    border-radius: 45px;
    padding-right: 7px;
    padding-left: 11px;
}

  .landing-page .rectangle,.landing_page_rectangle {
        position: absolute;
        width: 151px;
        height: 10%;
        top: -50px;
        left: 50%;
        transform: rotate(25.32deg);
        filter: blur(80px);
        background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.24) 0%, rgba(43, 255, 255, 0) 100%);
    }


    .landing-page .rectangle-2 , .landing_page_rectangle-2 {
    position: absolute;
    width: 50px;
    height: 10%;
    top: 0px;
    left: 30%;
    transform: rotate(25.32deg);
    filter: blur(40px);
    background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.28) 0%, rgba(43, 255, 255, 0) 100%);
  }

  .landing-page .rectangle-3 ,.landing_page_rectangle-3{
    position: absolute;
    width: 130px;
    height: 10%;
    top: 0px;
    left: 50%;
    transform: rotate(25.32deg);
    filter: blur(80px);
    background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.24) 0%, rgba(43, 255, 255, 0) 100%);
  }

  .landing-page .rectangle-4  ,.landing_page_rectangle-4{
    position: absolute;
    width: 5%;
    height: 10%;
    top: 280px;
    left: 30%;
    transform: rotate(25.32deg);
    filter: blur(120px);
    background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.14) 0%, rgba(43, 255, 255, 0) 100%);
  }

  .landing-page .rectangle-5 ,.landing_page_rectangle-5 {
    position: absolute;
    width: 167px;
    height: 10%;
    top: 0px;
    left: 30%;
    transform: rotate(25.32deg);
    filter: blur(100px);
    background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.26) 0%, rgba(43, 255, 255, 0) 100%);
  }

  .landing-page .rectangle-6 ,.landing_page_rectangle-6 {
    position: absolute;
    height: 10%;
    top: 0px;
    left: 443px;
    transform: rotate(25.32deg);
    filter: blur(80px);
    background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.2) 0%, rgba(43, 255, 255, 0) 100%);
  }

  .landing-page .rectangle-7 ,.landing_page_rectangle-7 {
    position: absolute;
    width: 85px;
    height: 10%;
    top: 0px;
    left: 176px;
    transform: rotate(25.32deg);
    filter: blur(80px);
    background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.2) 0%, rgba(43, 255, 255, 0) 100%);
  }

  .landing-page .rectangle-8 ,.landing_page_rectangle-8 {
    position: absolute;
    width: 85px;
    height: 10%;
    top: 0px;
    left: 310px;
    transform: rotate(25.32deg);
    filter: blur(80px);
    background: linear-gradient(180deg, rgba(43.17, 255, 255, 0.18) 0%, rgba(43, 255, 255, 0) 75%);
  }




  .landing-page .frame {
    display: flex;
    width: 100%;
    max-width: 1400px;
    align-items: center;
    justify-content: space-between;
    padding: 0px 78px;
    position: absolute;
    left: 5px;
    background-color: #ffffff05;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: transparent;
    backdrop-filter: blur(100px) brightness(100%);
    -webkit-backdrop-filter: blur(100px) brightness(100%);
    border-image: linear-gradient(to bottom, rgb(0, 0, 0), rgb(255, 255, 255) 50%, rgb(0, 0, 0) 100%) 1;
  }


  .landing-page .ellipse {
    position: relative;
    width: 28px;
    height: 28px;
  }

  .landing-page .text-wrapper , .landing_page_text-wrapper {
    font-family: "Switzer-Medium", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 23px;
    text-align: center;
    letter-spacing: 0;
    line-height: 28px;
    white-space: nowrap;
  }

  .landing-page .navbar {
    display: inline-flex;
    align-items: flex-start;
    gap: 40px;
    position: relative;
    flex: 0 0 auto;
  }

  .card_line{
    border: 2px solid #3e3d3d;
    /* border-left: none;/ */
    padding: 30px;
    border-radius: 23px;
  }

  .landing-page .text-wrapper-2 ,.landing_page_text-wrapper-2 {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #fffffff2;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0;
    line-height: 20px;
    white-space: nowrap;
  }

  .footer_link {
    position: relative;
    margin-top: -1px;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #fffffff2;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0;
    line-height: 20px;
    white-space: nowrap;
  }


  .landing-page .text-wrapper-222 ,.landing_page_text-wrapper-222 {
    position: relative;
    width: fit-content;
    margin-top: 4px;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #fffffff2;
    /* font-size: 18px; */
    text-align: center;
    letter-spacing: 0;
    line-height: 20px;
    white-space: nowrap;
  }
  .navbar-dark .navbar-nav .nav-link{
    color: rgb(255 255 255 / 94%);
    margin-left: 30px;
  }

  .landing-page .button-download ,.landing_page_button-download {
    /* width: auto; */
    padding: 6px;
    /* gap: 16px; */
    border-radius: 32px;
    border: 1px solid;
    border-color: var(--visualswhite);
  }

  .landing-page .download-app ,.landing_page_download-app {
    font-family: "Space Grotesk", Helvetica;
    position: relative;
    width: fit-content;
    font-weight: 500;
    color: var(--textwhite);
    font-size: 15px;
    text-align: center;
    letter-spacing: 0;
    line-height: 25.2px;
    white-space: nowrap;
  }

  .landing-page .icon-arrow ,.landing_page_icon-arrow{
    position: relative;
    width: 35px;
    height: 35px;
    background-color: var(--visualswhite);
    border-radius: 50%;
  }

  .landing-page .arrow ,.landing_page_arrow {
    position: absolute;
    width: 13px;
    height: 13px;
    top: 11px;
    left: 9px;
  }

  .landing-page .frame-3 {
    gap: 44px;
    margin-top: 50px;
    /* margin-left: 80px; */
  }

  .landing-page .frame-4 {
    gap: 18px;
    flex: 0 0 auto;
  }

  .landing-page .div-wrapper {
    margin-left: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 12px;
    position: relative;
    flex: 0 0 auto;
    background-color: #ffffff0f;
    border-radius: 100px;
    /* border: 1px solid; */
    border-color: #2bffff1a;
    backdrop-filter: blur(24px) brightness(100%);
    -webkit-backdrop-filter: blur(24px) brightness(100%);
    border-image: linear-gradient(to bottom, rgba(43, 255, 255, 0), rgba(43, 255, 255, 0.24)) 1;
  }

  .landing-page .p {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    background: linear-gradient(180deg, rgb(255, 255, 255) 15%, rgba(255, 255, 255, 0.64) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 12px;
    text-align: center;
    letter-spacing: 0.24px;
    line-height: 16px;
    white-space: nowrap;
  }

  .landing-page .text-wrapper-3 {
    text-align: left;
    background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(153, 153, 153) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 45px;
    letter-spacing: -2.56px;
    line-height: 72px;
  }

  .landing-page .text-wrapper-4 {
    text-align: left;
    position: relative;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffffe0;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 24px;
  }

  .landing-page .frame-5 {
    display: flex;
    width: 185px;
    gap: 17px;
    padding: 0px 6px;
    height: 40px;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    border-radius: 32px;
    border: 1px solid;
    border-color: #019aa4;
  }

  .landing-page .text-wrapper-5 {
    position: relative;
    width: fit-content;
    font-family: var(--text-medium-font-family);
    font-weight: var(--text-medium-font-weight);
    color: var(--textwhite);
    font-size: var(--text-medium-font-size);
    text-align: center;
    letter-spacing: var(--text-medium-letter-spacing);
    line-height: var(--text-medium-line-height);
    white-space: nowrap;
    font-style: var(--text-medium-font-style);
  }

  .landing-page .arrow-wrapper {
    position: relative;
    background-color: var(--visualsturquoise);
    width: 30px;
    height: 30px;
    border-radius: 50%;
  }

  .landing-page .line {
    top: -20px;
    left: -15px;
    position: absolute;
    width: 181px;
    height: 10px;
  }

  .landing-page .img {
    position: absolute;
    width: 430px;
    height: 591px;
    top: 472px;
    left: 425px;
  }

  .landing-page .iphone-pro {
    width: 75%;
    height: 75%;
    top: 0px;
  }



  .landing-page .overlap-2 {
    position: relative;
    width: 1915px;
    height: 738px;
    top: -8px;
    left: 2px;
  }

  .landing-page .tame-the-password {
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffff8c;
    font-size: 11px;
    letter-spacing: 0;
    line-height: 24px;
    padding: 14px;
  }

  .landing-page .overlap-3 {
    position: absolute;
    width: 1915px;
    height: 738px;
    top: 0;
    left: 0;
  }

  .landing-page .frame-6 {
    gap: 44px;
    top: 0;
    left: 107px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    position: absolute;

  }



  .landing-page .easily-share {
    text-align: left;
    margin-top: -1px;
    background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(153, 153, 153) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 40px;
    letter-spacing: -2.56px;
    line-height: 60.8px;
  }

  .landing-page .frame-7 {
    gap: 12px;
    padding: 7px;
    align-items: center;
    margin-bottom: 20px;
    position: relative;
    border-radius: 32px;
    border: 1px solid;
    border-color: #019aa4;
    /* left: 15px; */
    height: 50px;
    width: 200px;
  }

  .landing-page .line-2 {
    top: 270px;
    left: 19px;
    position: absolute;
    width: 181px;
    height: 10px;
  }

  .landing-page .iphone-pro-2 {
    width: 330px;
    height: 300px;
  }
  .landing-page .rectangle-9 {
    /* position: absolute; */
    /* width: 1915px; */
    margin-top: -65px;
    height: 202px;
    /* top: 536px; */
    /* left: 0; */
    backdrop-filter: blur(3px) brightness(100%);
    -webkit-backdrop-filter: blur(3px) brightness(100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%);
  }


  /* .landing-page .rectangle-9 {
    backdrop-filter: blur(3px) brightness(100%);
    -webkit-backdrop-filter: blur(3px) brightness(100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 100%);
  } */

  .landing-page .overlap-wrapper {
    position: absolute;
    width: 1917px;
    height: 550px;
    top: 1538px;
    left: 90px;
    overflow: hidden;
  }

  .landing-page .overlap-4 {
    height: 476px;
    top: -1px;
  }

  .landing-page .frame-8 {
    display: inline-flex;
    align-items: flex-end;
    gap: 246px;
    position: absolute;
    top: 127px;
    left: 0;
  }

  .landing-page .frame-9 {
    padding: 12px;
    gap: 24px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .frame-10 {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    position: relative;
    flex: 0 0 auto;
    background-color: #000000;
  }

  .landing-page .simplify-your {
    position: relative;
    width: 529px;
    margin-top: -1px;
    background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(153, 153, 153) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 32px;
    letter-spacing: -1.28px;
    line-height: 48px;
  }

  .landing-page .frame-11 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }

  .landing-page .frame-12 {
    display: inline-flex;
    align-items: flex-start;
    gap: 432px;
    padding: 24px 0px;
    position: relative;
    flex: 0 0 auto;
    margin-top: -1px;
    margin-left: -1px;
    margin-right: -1px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: #ffffff33;
  }

  .landing-page .text-wrapper-6 {
    position: relative;
    width: fit-content;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffff8c;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: #dbd7d717;
    padding: 18px 0px    ;
  }

  .landing-page .frame-13 {
    display: flex;
    width: 785px;
    align-items: flex-start;
    gap: 432px;
    padding: 24px 0px;
    position: relative;
    flex: 0 0 auto;
    margin-left: -1px;
    margin-right: -1px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: #ffffff33;
  }

  .landing-page .frame-14 {
    display: flex;
    align-items: flex-start;
    gap: 432px;
    padding: 24px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    margin-bottom: -1px;
    margin-left: -1px;
    margin-right: -1px;
  }

  .landing-page .frame-15 {
    width: 125px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .frame-wrapper {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    /* padding: 32px; */
    position: relative;
    flex: 0 0 auto;
    border-radius: 32px;
    /* border: 1px solid; */
    border-color: transparent;
    backdrop-filter: blur(84px) brightness(100%);
    -webkit-backdrop-filter: blur(84px) brightness(100%);
    border-image: linear-gradient(
        to bottom,
        rgba(43.17, 255, 255, 0.32),
        rgba(43.09, 255, 255, 0.1) 50%,
        rgba(43, 255, 255, 0.16) 100%
      )
      1;
    background: linear-gradient(
      180deg,
      rgba(43, 255, 255, 0.12) 0%,
      rgba(43, 255, 255, 0.04) 50%,
      rgba(43, 255, 255, 0.07) 100%
    );
    opacity: 0.4;
  }

  .landing-page .frame-16 {
    padding: 15px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px;
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .fluent-document-copy {
    position: relative;
    width: 40px;
    height: 40px;
  }

  .landing-page .frame-17 {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .text-wrapper-7 {
    position: relative;
    width: fit-content;
    /* margin-top: -1px; */
    font-family: "Space Grotesk", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 13px;
    letter-spacing: 0;
    line-height: 28px;
    white-space: nowrap;
  }

  .landing-page .frame-18 {
    /* height: 150px; */
    /* gap: 10px; */
    /* padding: 32px; */
    /* margin-left: 10px; */
    border-radius: 32px;
    /* border: 1px solid; */

    border-color: transparent;
    backdrop-filter: blur(84px) brightness(100%);
    -webkit-backdrop-filter: blur(84px) brightness(100%);
    border-image: linear-gradient(
        to bottom,
        rgba(43.17, 255, 255, 0.32),
        rgba(43.09, 255, 255, 0.1) 50%,
        rgba(43, 255, 255, 0.16) 100%
      )
      1;
    background: linear-gradient(
      180deg,
      rgba(43, 255, 255, 0.12) 0%,
      rgba(43, 255, 255, 0.04) 50%,
      rgba(43, 255, 255, 0.07) 100%
    );
    /* display: inline-flex; */
    /* flex-direction: column;
    align-items: flex-start;
    position: relative;
    flex: 0 0 auto; */
  }

  .landing-page .frame-19 {
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .mage-file {
    position: relative;
    width: 32px;
    height: 32px;
  }

  .landing-page .text-wrapper-8 {
    position: relative;
    width: 179px;
    margin-top: -1px;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 28px;
  }

  .landing-page .more-variants-of ,.simplify_your {
    top: 0;
    background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(153, 153, 153) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 45px;
    letter-spacing: -2.56px;
    line-height: 76.8px;
  }

  .simplify_your{
    font-size: 35px;
    letter-spacing: -2.56px;
    line-height: 45px;
  }
  .landing-page .frame-20 {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 56px;
    position: absolute;
    top: 2195px;
    padding: 10px;
    margin: 10px;
    width: 95%;
    left: 50px;

  }

  .landing-page .div-mt {
    position: relative;
    width: 1616px;
    height: 480px;
  }

  .landing-page .card {
    /* margin-bottom: 5px; */
    /* height: 98%; */
    margin-left: 5px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    top: 0;
    background-color: #18181b80;
    border-radius: 16px;
    overflow: hidden;
    /* padding: 20px; */
    box-shadow: 0px 0px 0px #ffffff, 0px 0px 0px 1px #f4f4f51a, 0px 0px 0px transparent;
    margin-top: 40px;
  }

  .landing-page .image {
    width: 100%;
  }

  .hand-img{
    width: 80%;
    height: 93%;
    float: right;
    /* position: relative; */
    right: -50px;
  }

  .landing-page .div-mt-auto {
    display: flex;
    flex-direction: column;
    width: 384px;
    height: 138px;
    align-items: flex-start;
    gap: 16.5px;
    padding: 0px 32px 2498.86px;
    position: relative;
    margin-bottom: -2122.86px;
  }

  .landing-page .text-wrapper-9 {
    width: fit-content;

    font-family: "Space Grotesk", Helvetica;
    font-weight: 500;
    color: #e4e4e7;
    font-size: 24px;
    letter-spacing: 0;

  }

  .landing-page .text-wrapper-10 {

    font-weight: 400;
    color: #a1a1aacc;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 24px;
  }

  .landing-page .card-2 {

    /* height: 98%; */
    margin-left: 5px;
    align-items: center;
    gap: 16px;
    background-color: #18181b80;
    border-radius: 16px;
    box-shadow: 0px 0px 0px #ffffff, 0px 0px 0px 1px #f4f4f51a, 0px 0px 0px transparent;
    margin-top: 40px;

  }

  .landing-page .div-relative-mask {
    /* margin-top: 40px; */
    width: 100%;
  }

  .landing-page .div-mt-auto-2 {
    width: 508px;
    display: flex;
    flex-direction: column;
    height: 138px;
    align-items: flex-start;
    gap: 16.5px;
    padding: 0px 32px 2498.86px;
    position: relative;
    margin-bottom: -2122.86px;
  }

  .landing-page .text-wrapper-11 {
    /* width: 90%; */
    font-weight: 500;
    color: #e4e4e7;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 18px;
    text-align: left;
    font-family: "Space Grotesk", Helvetica;


  }

  .landing-page .text-wrapper-12 {
    /* width: 90%; */
    text-align: left;
    font-family: "Inter", Helvetica;
    font-weight: 400;
    color: #a1a1aacc;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 24px;
    /* padding: 10px; */

  }

  .landing-page .card-3 {
    /* margin-bottom: 5px; */
    height: 89%;
    margin-left: 5px;
    left: 0;
    gap: 16px;
    top: 0;
    background-color: #18181b80;
    border-radius: 16px;
    box-shadow: 0px 0px 0px #ffffff, 0px 0px 0px 1px #f4f4f51a, 0px 0px 0px transparent;
    margin-top: 40px;

  }

  .landing-page .share {
    margin-top: 20px;
    position: relative;
    width: 100%;
  }

  .landing-page .div-mt-auto-3 {
    width: 510px;
    display: flex;
    flex-direction: column;
    height: 138px;
    align-items: flex-start;
    gap: 16.5px;
    padding: 0px 32px 2498.86px;
    position: relative;
    margin-bottom: -2122.86px;
  }

  .landing-page .paragraph-max-w-sm {
    padding: 0px 37.38px 2580.86px 0px;
    display: flex;
    flex-direction: column;
    width: 320px;
    height: 72px;
    align-items: flex-start;
    position: relative;
    margin-bottom: -2467.36px;
  }

  .landing-page .text-wrapper-13 {
    position: relative;
    width: 320px;
    margin-bottom: -2556.86px;
    margin-right: -37.38px;
    font-family: "Inter", Helvetica;
    font-weight: 400;
    color: #a1a1aacc;
    font-size: 13.9px;
    letter-spacing: 0;
    line-height: 24px;
  }

  .landing-page .overlap-5 {
    position: absolute;
    width: 1920px;
    height: 1319px;
    top: 2940px;
    left: 0;
  }

  .landing-page .vector-2 {
    position: absolute;
    width: 95%;
    height: auto;
  }

  .landing-page .shadow {
    position: absolute;
    width: 1920px;
    height: 173px;
    top: 0;
    left: 0;
  }

  .landing-page .overlap-6 {
    position: relative;
    height: 110px;
  }

  .landing-page .ellipse-2 {
    position: absolute;
    width: 80%;
    height: 2%;
    top: 0;
    left: 95px;
    background-color: #000000;
    border-radius: 852.5px/83px;
    box-shadow: 3px 56px 123px #21c4c41a, 12px 223px 223px #21c4c417, 26px 501px 301px #21c4c40d,
      46px 892px 357px #21c4c403, 72px 1393px 391px transparent;
  }

  .landing-page .rectangle-11 {
    background-color: #000000;
  }

  .landing-page .frame-21 {
    display: inline-flex;
    flex-direction: column;
    gap: 56px;
    position: absolute;
    top: 288px;
    left: 93px;
  }

  .landing-page .frame-22 {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .text-wrapper-14 {
    text-align: center;
    position: relative;
    margin-top: -1px;
    background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(153, 153, 153) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 50px;
    letter-spacing: -2.56px;
    line-height: 76.8px;
  }

  .landing-page .text-wrapper-15 {
    margin-bottom: 30px;
    position: relative;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffffe0;
    font-size: 13px;
    letter-spacing: 0;
    line-height: 24px;
  }

  .landing-page .group {
    width: 100%;
  }

  .landing-page .overlap-7 {
    position: relative;
    height: 786px;
  }

  .landing-page .rectangle-12 {
    background-color: #000000;
    border-radius: 16px;
    border: 1px solid;
    border-color: #ffffff33;
  }

  .landing-page .rectangle-13 {
    background-color: #000000;
    border-radius: 16px;
    border: 1px solid;
    border-color: #ffffff33;
  }

  .landing-page .rectangle-14 {
    left: 0;
    background-color: #000000;
    border-radius: 16px;
    border: 1px solid;
    border-color: #ffffff33;
  }

  .landing-page .frame-23 {
    padding: 20px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid;
    border-color: #ffffff0a;
    backdrop-filter: blur(84px) brightness(100%);
    -webkit-backdrop-filter: blur(84px) brightness(100%);
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.12) 0%,
      rgba(255, 255, 255, 0.04) 50%,
      rgba(255, 255, 255, 0.07) 100%
    );
    position: relative; /* Required for the pseudo-element positioning */
}



.card_line {
    border: 2px solid #3e3d3d;
    /* padding: 15px; */
    border-radius: 23px;
}


  .landing-page .frame-24 {
    display: inline-flex;
    align-items: center;
    gap: 88px;
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .frame-25 {
    margin-top: 60px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 48px;
    position: relative;
    flex: 0 0 auto;
  }

  .landing-page .text-wrapper-16 {
    /* padding-left: 25px; */
    position: relative;
    margin-top: -1px;
    background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(153, 153, 153) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 40px;
    letter-spacing: -1.92px;
    line-height: 57.6px;
  }

  .landing-page .in-today-s-digital {
    position: relative;
    margin-top: -1px;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffff8c;
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
  }

  .landing-page .text-wrapper-17 {

    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffff8c;
    font-size: 14px;
    letter-spacing: 0;
    line-height: normal;
  }

  .landing-page .overlap-group-wrapper {
    position: relative;
    width: 220px;
    height: 55px;
  }

  .landing-page .overlap-group-2 {
    position: relative;
    height: 60px;
    top: -6px;
  }

  .landing-page .frame-26 {
    display: inline-flex;
    height: 50px;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding:20px;
    /* position: absolute; */
    /* top: 50px;
    left: 0; */
    border-radius: 32px;
    border: 1px solid;
    border-color: #019aa4;
  }

  .landing-page .line-3 {
    position: absolute;
    width: 181px;
    height: 10px;
    top: -55px;
    left: 19px;
  }

  .landing-page .line-33 {
    position: absolute;
    width: 181px;
    height: 10px;
    top: -55px;
    left: 0px;
  }

  .landing-page .image-2 {
    position: relative;
    width: 88%;
    height: 82%;
  }

  .landing-page .frame-27 {
    background-size: cover;
    background-position: 50% 50%;
  }

  .landing-page .overlap-8 {
    position: absolute;
    width: 972px;
    height: 906px;
    top: 0;
    left: 948px;
  }

  .landing-page .image-3 {
    object-fit: cover;
    position: relative;
    /* bottom: 460px; */
    width: 100%;
  }


  .landing-page .frame-28 {
    gap: 56px;
    margin-left: px;
  }

  .landing-page .ready-to-level-up {
    position: relative;
    width: 100%;
    margin-top: -1px;
    background: linear-gradient(180deg, rgb(255, 255, 255) 30%, rgb(153, 153, 153) 100%);
    -webkit-background-clip: text !important;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: transparent;
    font-size: 46px;
    letter-spacing: -2.56px;
    line-height: 76.8px;
  }

  .landing-page .text-wrapper-18 {
    position: relative;
    /* width: 421px; */
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffff96;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 24px;
  }

  .landing-page .group-2 {
    position: absolute;
    width: 100%;
    height: 378px;
    top: 5735px;
    left: 10px;
  }

  .landing-page .overlap-9 ,.landing_page_overlap-9 {
    position: relative;
    /* margin-top: -300px; */
  }

  .landing-page .div-full-width-line {
    position: absolute;
    width: 1668px;
    height: 1px;
    top: 312px;
    left: 52px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: #1f1f1f;
  }

  .landing-page .div-hidden {
    position: absolute;
    width: 1668px;
    height: 1px;
    top: 377px;
    left: 52px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: #1f1f1f;
  }

  .landing-page .div-hidden-2 ,.landing_page_div-hidden-2 {
    position: absolute;
    width: 99%;
  }

  .landing-page .frame-29 {
    position: absolute;
    width: 269px;
    height: 80px;
    top: 36px;
    left: 70px;
  }

  .landing-page .div-flex {
    display: flex;
    width: 757px;
    height: 233px;
    align-items: flex-start;
    gap: 125px;
    padding: 0px 545.25px 68px 0px;
    position: absolute;
    top: 79px;
    left: 974px;
  }

  .landing-page .div-2 {
    display: flex;
    flex-direction: column;
    width: 66.52px;
    height: 165px;
    align-items: flex-start;
    padding: 0px 0px 4611.08px;
    position: relative;
  }

  .landing-page .pb {
    opacity: 0.6;
  }

  .landing-page .text-wrapper-19 {
    position: absolute;
    height: 16px;
    top: 0;
    left: 0;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 13px;
    letter-spacing: 0.65px;
    line-height: 16px;
    white-space: nowrap;
  }

  .landing-page .list {
    display: flex;
    flex-direction: column;
    width: 66.52px;
    height: 112px;
    align-items: flex-start;
    gap: 16px;
    padding: 0px 0px 4747.08px;
    position: relative;
    margin-bottom: -4598.08px;
  }

  .landing-page .text-wrapper-20 {
    position: relative;
    width: fit-content;
    margin-right: -0.48px;
    font-family: "Inter", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
  }

  .landing-page .text-wrapper-21 {
    position: relative;
    width: fit-content;
    margin-bottom: -4683.08px;
    font-family: "Inter", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
  }

  .landing-page .text-wrapper-22 {
    position: relative;
    width: fit-content;
    margin-bottom: -4715.08px;
    font-family: "Inter", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
  }

  .landing-page .text-wrapper-23 {
    position: relative;
    width: fit-content;
    margin-bottom: -4747.08px;
    font-family: "Inter", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
  }

  .landing-page .div-3 {
    display: flex;
    flex-direction: column;
    width: 90.36px;
    height: 165px;
    align-items: flex-start;
    padding: 0px 0px 4611.08px;
    position: relative;
    margin-right: -70.36px;
  }

  .landing-page .h-pb ,.landing_page_h-pb {
    opacity: 0.6;
  }

  .landing-page .list-2 {
    width: 90.36px;
    height: 112px;
    padding: 0px 2.5e-5px 4747.08px 0px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    position: relative;
    margin-bottom: -4598.08px;
  }

  .landing-page .text-wrapper-24 {
    position: relative;
    width: 72px;
    margin-bottom: -4651.08px;
    font-family: "Inter", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
  }

  .landing-page .text-wrapper-25 {
    position: relative;
    width: 90px;
    margin-bottom: -4683.08px;
    font-family: "Inter", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
  }

  .landing-page .div-4 {
    display: flex;
    flex-direction: column;
    width: 129.07px;
    height: 165px;
    align-items: flex-start;
    padding: 0px 0px 4675.08px;
    position: relative;
    margin-right: -324.43px;
  }

  .landing-page .legal-wrapper {
    opacity: 0.6;
  }

  .landing-page .list-3 {
    width: 129.07px;
    height: 48px;
    padding: 0px 0px 4747.08px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    position: relative;
    margin-bottom: -4598.08px;
  }

  .landing-page .text-wrapper-26 {
    position: relative;
    width: fit-content;
    margin-bottom: -4715.08px;
    margin-right: -0.93px;
    font-family: "Inter", Helvetica;
    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 16px;
    white-space: nowrap;
  }

  .landing-page .div-flex-2 {
    display: flex;
    width: 1678px;
    height: 64px;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0px 46.75px 0px 0px;
    position: absolute;
    top: 313px;
    left: 52px;
  }

  .landing-page .paragraph-text-base ,.landing_page_paragraph-text-base {
    position: relative;
    width: 95%;
    height: 64px;
    opacity: 0.6;
  }

  .landing-page .text-wrapper-27 ,.landing_page_text-wrapper-27 {
    position: absolute;
    height: 24px;
    top: 20px;
    left: 0;
    font-family: "Space Grotesk", Helvetica;
    font-weight: 400;
    color: #ffffff;
    font-size: 15px;
    letter-spacing: 0;
    line-height: 24px;
    white-space: nowrap;
  }

  .landing-page .div-flex-3 {
    position: relative;
    width: 168px;
    height: 64px;
  }

  .landing-page .group-3 ,.landing_page_group-3 {
    width: 337px;
    height: 143px;
  }


  .nav_image ,.landing_page_nav_image{
    /* margin-top: 15px; */
    /* width: 18px; */
  }

  .container {
    position: relative;
    text-align: center;
    color: white;
  }

  .row-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }


  .bullet {
    position: relative;
    padding-left: 25px; /* Adjust this value based on the size of the bullet */
}

.bullet::before {
    content: '';
    position: absolute;
    left: 0;
    top:20px;
    transform: translateY(-50%);
    width: 5px; /* Width of the bullet */
    height: 5px; /* Height of the bullet */
    background-color: #6e6868; /* Color of the bullet */
    border-radius: 50%; /* Makes the shape circular */
}



@media only screen and (max-width: 767px) {
    .navbar{
        margin-right: 32px;
    }

    .cards{
        margin: 0px;
        text-align: center;
    }

    .navbar-dark .navbar-nav .nav-link
    {
        margin-left: 0px;
    }

    .hand-img{
        width: 310px;
        /* width: 80%; */
        height: 93%;
        float: right;
        right: -50px;
    }

    .nav_button{
        border: 1px solid #b3aaaa;
        padding: 1px;
    }

    .copy_right_conatiner,.vector-2,.landing_page_div-hidden-2,.copy_right_row{
        width: 95%;
    }

    .landing-page .text-wrapper-3 {
        font-size: 30px;
        line-height: 45px;
    }

    .landing-page .iphone-pro {
        width: 55%;
    }

    .landing-page .easily-share {
        font-size: 28px;
        line-height: 43px;
    }

    .landing-page .rectangle-9 {
        height: 100px;
    }

    .simplify_your {
        font-size: 30px;
    }

    .landing-page .text-wrapper-6{
        padding: 11px 0px;
    }

    .landing-page .more-variants-of{
        text-align: left;
    }

    .landing-page .text-wrapper-14 {
        font-size: 35px;
        line-height: 55px;

    }
    .landing-page .text-wrapper-16 {
        font-size: 35px;
        line-height: 49px;
    }
    .landing-page .ready-to-level-up{
        font-size: 40px;
        line-height: 60px;
    }
}


@media (max-width: 992px) {
    .landing-page .rectangle,
    .landing_page_rectangle {
        left: 0; /* Adjusting left position for mobile screens */
    }

    .landing-page .rectangle-2,
    .landing_page_rectangle-2 {
        left: 0; /* Adjusting left position for mobile screens */
    }

    .landing-page .rectangle-3,
    .landing_page_rectangle-3 {
        left: 0; /* Adjusting left position for mobile screens */
    }

    .landing-page .rectangle-4,
    .landing_page_rectangle-4 {
        left: 0; /* Adjusting left position for mobile screens */
    }

    .landing-page .rectangle-5,
    .landing_page_rectangle-5 {
        left: 0; /* Adjusting left position for mobile screens */
    }

    .landing-page .rectangle-6,
    .landing_page_rectangle-6 {
        left: 0; /* Adjusting left position for mobile screens */
    }

    .landing-page .rectangle-7,
    .landing_page_rectangle-7 {
        left: 0; /* Adjusting left position for mobile screens */
    }

    .landing-page .rectangle-8,
    .landing_page_rectangle-8 {
        left: 0; /* Adjusting left position for mobile screens */
    }
}