.landing-page {
    background-color: #fcfcfc;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 0 40px;
}

.landing-page .div {
    background-color: #fcfcfc;
    width: 1440px;
    height: 3620px;
}

.landing-page .frame {
    display: flex;
    flex-direction: column;
    width: 1440px;
    align-items: center;
    gap: 70px;
    position: relative;
}

.landing-page .frame-2 {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 673px;
}

.landing-page .frame-wrapper {
    display: flex;
    flex-direction: column;
    width: 1200px;
    height: 65px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px;
    position: absolute;
    top: 38px;
    left: 120px;
    background-color: #ffffff;
    border-radius: 30px;
    border: 1px solid;
    border-color: var(--grey-100);
    backdrop-filter: blur(50px) brightness(100%);
    -webkit-backdrop-filter: blur(50px) brightness(100%);
}

.landing-page .frame-3 {
    display: flex;
    width: 1104px;
    align-items: center;
    justify-content: space-between;
    position: relative;
    flex: 0 0 auto;
}

.landing-page .image {
    position: relative;
    width: 82px;
    height: 27px;
}

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

.landing-page .text-wrapper {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;

    font-weight: 400;
    color: var(--grey-600);
    font-size: 16px;
    text-align: center;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .frame-5 {
    display: flex;
    width: 1200px;
    align-items: center;
    justify-content: center;
    gap: 231px;
    position: absolute;
    top: 165px;
    left: 121px;
}

.landing-page .frame-6 {
    display: flex;
    flex-direction: column;
    width: 531px;
    align-items: flex-start;
    gap: 24px;
    position: relative;
}

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

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

.landing-page .frame-9 {
    display: flex;
    width: 171px;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px 20px;
    position: relative;
    flex: 0 0 auto;
    background-color: #ffffff;
    border-radius: 40px;
    box-shadow: 0px 4px 20px #00000012;
}

.landing-page .frame-10 {
    display: inline-flex;
    align-items: center;
    position: relative;
    flex: 0 0 auto;
    margin-left: -6.00px;
}

.landing-page .text-wrapper-2 {
    position: relative;
    width: fit-content;
    margin-right: -6.00px;

    font-weight: 500;
    color: #202025;
    font-size: 13px;
    text-align: center;
    letter-spacing: -0.26px;
    line-height: normal;
}

.landing-page .evaluate-the-top {
    position: relative;
    align-self: stretch;
    font-weight: 400;
    color: transparent;
    font-size: 4.375rem;
    letter-spacing: -0.70px;
    line-height: 75px;
}

.landing-page .span {
    color: #000000;
    letter-spacing: -0.49px;
}

.landing-page .text-wrapper-3 {
    color: #171717;
    letter-spacing: -0.49px;
}

.landing-page .p {
    position: relative;
    width: 531px;

    font-weight: 400;
    color: var(--grey-600);
    font-size: 18px;
    letter-spacing: -0.18px;
    line-height: 26px;
}

.landing-page .div-wrapper {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 1px;
    position: relative;
    flex: 0 0 auto;
    background-color: #323131;
    border-radius: 8px;
}

.landing-page .frame-11 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 22px;
    position: relative;
    flex: 0 0 auto;
    border-radius: 8px;
    border-top-width: 1px;
    border-top-style: solid;
    border-right-width: 1px;
    border-right-style: solid;
    border-left-width: 1px;
    border-left-style: solid;
    border-color: #626262;
    box-shadow: inset 0px 0px 20px #a3a3a340;
    background: linear-gradient(
            360deg,
            rgba(33, 33, 33, 1) 0%,
            rgba(56, 56, 56, 1) 100%
    );
}

.landing-page .text-wrapper-4 {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;

    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: 26px;
    white-space: nowrap;
}

.landing-page .frame-12 {
    position: relative;
    width: 437px;
    height: 449px;
    background-color: var(--grey-50);
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--grey-100);
    box-shadow: 0px 0px 0px 4px #a9a9a912;
}

.landing-page .frame-13 {
    width: 406px;
    gap: 10px;
    position: absolute;
    top: 376px;
    left: 15px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1px;
    background-color: #323131;
    border-radius: 8px;
}

.landing-page .frame-14 {
    gap: 10px;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    position: relative;
    border-radius: 8px;
    border-top-width: 1px;
    border-top-style: solid;
    border-right-width: 1px;
    border-right-style: solid;
    border-left-width: 1px;
    border-left-style: solid;
    border-color: #626262;
    box-shadow: inset 0px 0px 20px #a3a3a340;
    background: linear-gradient(
            360deg,
            rgba(33, 33, 33, 1) 0%,
            rgba(56, 56, 56, 1) 100%
    );
}

.landing-page .frame-15 {
    display: flex;
    flex-direction: column;
    width: 406px;
    align-items: flex-start;
    gap: 13px;
    position: absolute;
    top: 24px;
    left: 15px;
}

.landing-page .group {
    position: relative;
    width: 406px;
    height: 150px;
}

.landing-page .overlap-group {
    position: relative;
    height: 150px;
}

.landing-page .frame-16 {
    position: absolute;
    width: 406px;
    height: 69px;
    top: 0;
    left: 0;
    background-color: #ffffff;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--grey-200);
}

.landing-page .text-wrapper-5 {
    position: absolute;
    top: 7px;
    left: 19px;

    font-weight: 400;
    color: #737373;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: normal;
}

.landing-page .frame-17 {
    top: 34px;
    left: 19px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    position: absolute;
}

.landing-page .img {
    position: relative;
    width: 20px;
    height: 20px;
}

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

.landing-page .text-wrapper-6 {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;

    font-weight: 500;
    color: #000000;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: normal;
}

.landing-page .text-wrapper-7 {
    position: relative;
    width: fit-content;

    font-weight: 400;
    color: #737373;
    font-size: 12px;
    letter-spacing: -0.24px;
    line-height: normal;
}

.landing-page .arrow-down {
    position: absolute;
    width: 16px;
    height: 16px;
    top: 27px;
    left: 377px;
}

.landing-page .frame-19 {
    position: absolute;
    width: 406px;
    height: 69px;
    top: 81px;
    left: 0;
    background-color: #ffffff;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--grey-200);
}

.landing-page .text-wrapper-8 {
    position: absolute;
    top: 9px;
    left: 16px;

    font-weight: 400;
    color: #737373;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: normal;
}

.landing-page .frame-20 {
    top: 36px;
    left: 16px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    position: absolute;
}

.landing-page .arrow-data-transfer-wrapper {
    position: absolute;
    width: 35px;
    height: 35px;
    top: 54px;
    left: 186px;
    background-color: #f7f7f7;
    border-radius: 50px;
    overflow: hidden;
}

.landing-page .arrow-data-transfer {
    position: absolute;
    width: 20px;
    height: 20px;
    top: 8px;
    left: 8px;
}

.landing-page .frame-21 {
    position: relative;
    width: 406px;
    height: 69px;
    background-color: #ffffff;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--grey-200);
}

.landing-page .text-wrapper-9 {
    position: absolute;
    top: 10px;
    left: 17px;

    font-weight: 400;
    color: #737373;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: normal;
}

.landing-page .text-wrapper-10 {
    position: absolute;
    top: 38px;
    left: 19px;

    font-weight: 400;
    color: #404040;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: normal;
}

.landing-page .text-wrapper-11 {
    position: absolute;
    top: 35px;
    left: 17px;

    font-weight: 400;
    color: #404040;
    font-size: 14px;
    letter-spacing: -0.28px;
    line-height: normal;
}

.landing-page .frame-22 {
    display: flex;
    flex-direction: column;
    width: 1200px;
    align-items: flex-start;
    gap: 41px;
    position: relative;
    flex: 0 0 auto;
}

.landing-page .frame-23 {
    display: flex;
    flex-direction: column;
    width: 344px;
    align-items: flex-start;
    gap: 6px;
    position: relative;
    flex: 0 0 auto;
}

.landing-page .text-wrapper-12 {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;

    font-weight: 600;
    color: var(--grey-950);
    font-size: 36px;
    letter-spacing: -1.44px;
    line-height: normal;
}

.landing-page .text-wrapper-13 {
    position: relative;
    align-self: stretch;

    font-weight: 400;
    color: var(--grey-600);
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .frame-24 {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 827.47px;
    background-color: #ffffff;
    border-radius: 22.58px;
    overflow: hidden;
    border: 1.13px solid;
    border-color: #f0f0f0;
}

.landing-page .group-wrapper {
    position: absolute;
    width: 1200px;
    height: 75px;
    top: 0;
    left: 0;
    background-color: #f2f2f2;
}

.landing-page .group-2 {
    position: relative;
    width: 1088px;
    height: 22px;
    top: 26px;
    left: 50px;
}

.landing-page .provider {
    position: absolute;
    width: 101px;
    top: 1px;
    left: 0;

    font-weight: 600;
    color: var(--grey-900);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .buy-rate {
    position: absolute;
    width: 102px;
    top: 0;
    left: 295px;
    font-weight: 600;
    color: var(--grey-900);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .sell-rate {
    position: absolute;
    width: 111px;
    top: 0;
    left: 517px;
    font-weight: 600;
    color: var(--grey-900);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .date {
    position: absolute;
    width: 55px;
    top: 0;
    left: 750px;

    font-weight: 600;
    color: var(--grey-900);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .actions {
    position: absolute;
    width: 95px;
    top: 0;
    left: 983px;

    font-weight: 600;
    color: var(--grey-900);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .group-3 {
    position: absolute;
    width: 1223px;
    height: 681px;
    top: 115px;
    left: -11px;
}

.landing-page .group-4 {
    position: absolute;
    width: 1084px;
    height: 30px;
    top: 0;
    left: 61px;
}

.landing-page .text-wrapper-14 {
    position: absolute;
    top: 5px;
    left: 295px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-15 {
    position: absolute;
    top: 5px;
    left: 517px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-16 {
    top: 5px;
    left: 750px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-17 {
    position: absolute;
    top: 5px;
    left: 984px;

    font-weight: 600;
    color: var(--grey-800);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
    text-decoration: underline;
}

.landing-page .img-2 {
    position: absolute;
    width: 98px;
    height: 30px;
    top: 0;
    left: 0;
}

.landing-page .group-5 {
    position: absolute;
    width: 1083px;
    height: 35px;
    top: 101px;
    left: 61px;
}

.landing-page .text-wrapper-18 {
    top: 7px;
    left: 294px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-19 {
    position: absolute;
    top: 6px;
    left: 517px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-20 {
    top: 6px;
    left: 750px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-21 {
    top: 4px;
    left: 983px;
    position: absolute;
    font-weight: 600;
    color: var(--grey-800);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
    text-decoration: underline;
}

.landing-page .LEMFI-LOGO-dark {
    position: absolute;
    width: 123px;
    height: 35px;
    top: 0;
    left: 0;
}

.landing-page .group-6 {
    position: absolute;
    width: 1084px;
    height: 25px;
    top: 206px;
    left: 61px;
}

.landing-page .text-wrapper-22 {
    top: 1px;
    left: 295px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-23 {
    position: absolute;
    top: 1px;
    left: 517px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-24 {
    top: 1px;
    left: 750px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-25 {
    top: 1px;
    left: 984px;
    position: absolute;

    font-weight: 600;
    color: var(--grey-800);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
    text-decoration: underline;
}

.landing-page .images {
    position: absolute;
    width: 106px;
    height: 25px;
    top: 0;
    left: 0;
    object-fit: cover;
}

.landing-page .vector {
    position: absolute;
    width: 1200px;
    height: 1px;
    top: 65px;
    left: 11px;
}

.landing-page .vector-2 {
    position: absolute;
    width: 1200px;
    height: 1px;
    top: 170px;
    left: 11px;
}

.landing-page .vector-3 {
    position: absolute;
    width: 1200px;
    height: 1px;
    top: 265px;
    left: 11px;
}

.landing-page .vector-4 {
    position: absolute;
    width: 1200px;
    height: 1px;
    top: 376px;
    left: 11px;
}

.landing-page .vector-5 {
    position: absolute;
    width: 1200px;
    height: 1px;
    top: 499px;
    left: 11px;
}

.landing-page .vector-6 {
    position: absolute;
    width: 1200px;
    height: 1px;
    top: 604px;
    left: 11px;
}

.landing-page .group-7 {
    position: absolute;
    width: 1084px;
    height: 41px;
    top: 301px;
    left: 61px;
}

.landing-page .text-wrapper-26 {
    top: 8px;
    left: 294px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-27 {
    position: absolute;
    top: 8px;
    left: 517px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-28 {
    position: absolute;
    top: 8px;
    left: 749px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-29 {
    top: 8px;
    left: 984px;
    position: absolute;

    font-weight: 600;
    color: var(--grey-800);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
    text-decoration: underline;
}

.landing-page .image-2 {
    position: absolute;
    width: 110px;
    height: 41px;
    top: 0;
    left: 0;
}

.landing-page .group-8 {
    position: absolute;
    width: 1084px;
    height: 53px;
    top: 412px;
    left: 61px;
}

.landing-page .text-wrapper-30 {
    top: 14px;
    left: 295px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-31 {
    position: absolute;
    top: 14px;
    left: 517px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-32 {
    top: 14px;
    left: 750px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-33 {
    top: 14px;
    left: 984px;
    position: absolute;

    font-weight: 600;
    color: var(--grey-800);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
    text-decoration: underline;
}

.landing-page .image-3 {
    position: absolute;
    width: 110px;
    height: 53px;
    top: 0;
    left: 0;
    object-fit: cover;
}

.landing-page .group-9 {
    position: absolute;
    width: 1083px;
    height: 35px;
    top: 535px;
    left: 61px;
}

.landing-page .text-wrapper-34 {
    top: 8px;
    left: 295px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-35 {
    top: 8px;
    left: 983px;
    position: absolute;

    font-weight: 600;
    color: var(--grey-800);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
    text-decoration: underline;
}

.landing-page .img-3 {
    position: absolute;
    width: 113px;
    height: 35px;
    top: 0;
    left: 0;
    object-fit: cover;
}

.landing-page .group-10 {
    position: absolute;
    width: 1083px;
    height: 42px;
    top: 640px;
    left: 61px;
}

.landing-page .text-wrapper-36 {
    top: 9px;
    left: 291px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-37 {
    position: absolute;
    top: 9px;
    left: 515px;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-38 {
    top: 9px;
    left: 749px;
    position: absolute;

    font-weight: 400;
    color: #404040;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-39 {
    top: 9px;
    left: 983px;
    position: absolute;

    font-weight: 600;
    color: var(--grey-800);
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
    text-decoration: underline;
}

.landing-page .moneygram-logo {
    position: absolute;
    width: 159px;
    height: 42px;
    top: 0;
    left: 0;
}

.landing-page .frame-25 {
    display: flex;
    flex-direction: column;
    width: 1200px;
    align-items: flex-start;
    gap: 35.01px;
    position: relative;
    flex: 0 0 auto;
}

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

.landing-page .text-wrapper-40 {
    position: relative;
    width: fit-content;
    margin-top: -0.95px;

    font-weight: 500;
    color: #000000;
    font-size: 26px;
    letter-spacing: -0.52px;
    line-height: normal;
}

.landing-page .frame-27 {
    position: relative;
    width: 410px;
    height: 57px;
    background-color: #f3f3f3;
    border-radius: 9.46px;
    overflow: hidden;
}

.landing-page .frame-28 {
    display: inline-flex;
    align-items: center;
    gap: 33.12px;
    position: relative;
    top: 8px;
    left: 7px;
}

.landing-page .frame-29 {
    display: flex;
    flex-direction: column;
    width: 67.19px;
    align-items: center;
    justify-content: center;
    gap: 9.46px;
    padding: 11.36px 9.46px;
    position: relative;
    background-color: #ffffff;
    border-radius: 5.68px;
}

.landing-page .text-wrapper-41 {
    position: relative;
    width: fit-content;
    margin-top: -0.95px;

    font-weight: 500;
    color: #282828;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

.landing-page .text-wrapper-42 {
    position: relative;
    width: fit-content;

    font-weight: 400;
    color: #737373;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: normal;
}

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

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

.landing-page .ellipse {
    position: relative;
    width: 15.14px;
    height: 15.14px;
    background-color: var(--blue-brand);
    border-radius: 7.57px;
}

.landing-page .text-wrapper-43 {
    position: relative;
    width: fit-content;
    margin-top: -0.95px;

    font-weight: 400;
    color: #525252;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .ellipse-2 {
    position: relative;
    width: 15.14px;
    height: 15.14px;
    background-color: #d1ca15;
    border-radius: 7.57px;
}

.landing-page .overlap-group-wrapper {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 734.35px;
}

.landing-page .overlap-group-2 {
    position: relative;
    width: 1200px;
    height: 680px;
    top: 13px;
}

.landing-page .group-11 {
    position: absolute;
    width: 1160px;
    height: 678px;
    top: 3px;
    left: 0;
}

.landing-page .text-wrapper-44 {
    position: absolute;
    top: 615px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-45 {
    position: absolute;
    top: 655px;
    left: 127px;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-46 {
    position: absolute;
    top: 650px;
    left: 472px;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-47 {
    position: absolute;
    top: 650px;
    left: 722px;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-48 {
    position: absolute;
    top: 650px;
    left: 1046px;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-49 {
    position: absolute;
    top: 554px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-50 {
    position: absolute;
    top: 492px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-51 {
    position: absolute;
    top: 431px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-52 {
    position: absolute;
    top: 369px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-53 {
    position: absolute;
    top: 308px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-54 {
    position: absolute;
    top: 246px;
    left: 0;
    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-55 {
    position: absolute;
    top: 185px;
    left: 0;
    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-56 {
    position: absolute;
    top: 123px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-57 {
    position: absolute;
    top: 62px;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .text-wrapper-58 {
    position: absolute;
    top: 0;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .group-12 {
    position: absolute;
    width: 1139px;
    height: 616px;
    top: 17px;
    left: 59px;
}

.landing-page .frame-32 {
    position: absolute;
    width: 155px;
    height: 65px;
    top: 84px;
    left: 520px;
    background-color: #ffffff;
    border-radius: 8.16px;
    overflow: hidden;
    box-shadow: 0px 4.08px 20.39px #00000012;
}

.landing-page .frame-33 {
    display: flex;
    flex-direction: column;
    width: 114px;
    align-items: flex-start;
    gap: 6.12px;
    position: relative;
    top: 12px;
    left: 13px;
}

.landing-page .text-wrapper-59 {
    align-self: stretch;
    margin-top: -1.02px;
    font-size: 16px;
    letter-spacing: 0;
    position: relative;
    font-weight: 500;
    color: #000000;
    line-height: normal;
}

.landing-page .text-wrapper-60 {
    position: relative;
    align-self: stretch;

    font-weight: 400;
    color: #737373;
    font-size: 13px;
    letter-spacing: 0;
    line-height: normal;
}

.landing-page .vector-7 {
    position: absolute;
    width: 1134px;
    height: 475px;
    top: 30px;
    left: 66px;
}

.landing-page .vector-8 {
    position: absolute;
    width: 1133px;
    height: 513px;
    top: 31px;
    left: 66px;
}

.landing-page .group-13 {
    position: absolute;
    width: 1127px;
    height: 401px;
    top: 218px;
    left: 72px;
}

.landing-page .vector-9 {
    position: absolute;
    width: 2px;
    height: 630px;
    top: 0;
    left: 511px;
}

.landing-page .frame-34 {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 369px;
    background-color: #f7f7f7;
}

.landing-page .frame-35 {
    display: flex;
    flex-direction: column;
    width: 565px;
    align-items: flex-start;
    gap: 22px;
    position: absolute;
    top: 56px;
    left: 120px;
}

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

.landing-page .text-wrapper-61 {
    position: relative;
    align-self: stretch;
    margin-top: -1.00px;

    font-weight: 400;
    color: #404040;
    font-size: 55px;
    letter-spacing: -1.10px;
    line-height: 60px;
}

.landing-page .text-wrapper-62 {
    position: relative;
    align-self: stretch;

    font-weight: 400;
    color: #737373;
    font-size: 20px;
    letter-spacing: -0.40px;
    line-height: 26px;
}

.landing-page .chatgpt-image-apr {
    position: absolute;
    width: 395px;
    height: 369px;
    top: 0;
    left: 887px;
    object-fit: cover;
}

.landing-page .footer {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 413px;
    background-color: transparent;
}

.landing-page .frame-37 {
    display: flex;
    width: 1200px;
    align-items: flex-start;
    gap: 136px;
    position: absolute;
    top: 75px;
    left: 120px;
}

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

.landing-page .frame-39 {
    display: flex;
    flex-direction: column;
    width: 288px;
    align-items: flex-start;
    gap: 8px;
    position: relative;
}

.landing-page .image-4 {
    position: relative;
    width: 141px;
    height: 47px;
}

.landing-page .text-wrapper-63 {
    position: relative;
    width: 251px;

    font-weight: 400;
    color: #737373;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: 22px;
}

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

.landing-page .frame-41 {
    display: flex;
    flex-direction: column;
    width: 80px;
    align-items: flex-start;
    gap: 19px;
    position: relative;
}

.landing-page .text-wrapper-64 {
    position: relative;
    align-self: stretch;
    margin-top: -1.00px;

    font-weight: 600;
    color: #000000;
    font-size: 18px;
    letter-spacing: -0.36px;
    line-height: normal;
}

.landing-page .frame-42 {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 20px;
    position: relative;
    flex: 0 0 auto;
}

.landing-page .text-wrapper-65 {

    font-weight: 400;
    color: #737373;
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: 26px;
    white-space: nowrap;
}

.landing-page .text-wrapper-66 {
    position: relative;
    width: fit-content;

    font-weight: 400;
    color: #737373;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: 26px;
    white-space: nowrap;
}

.landing-page .frame-43 {
    display: flex;
    flex-direction: column;
    width: 123px;
    align-items: flex-start;
    gap: 19px;
    position: relative;
}

.landing-page .frame-44 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 20px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
}

.landing-page .frame-45 {
    display: flex;
    flex-direction: column;
    width: 318px;
    align-items: flex-start;
    gap: 18px;
    position: relative;
}

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

.landing-page .group-14 {
    position: relative;
    width: 324px;
    height: 76px;
    margin-right: -6.00px;
}

.landing-page .overlap-group-3 {
    position: relative;
    width: 322px;
    height: 76px;
}

.landing-page .text-wrapper-67 {
    position: absolute;
    width: 322px;
    top: 0;
    left: 0;

    font-weight: 400;
    color: #404040;
    font-size: 30px;
    letter-spacing: -0.60px;
    line-height: 38px;
}

.landing-page .whatsapp {
    position: absolute;
    width: 28px;
    height: 27px;
    top: 44px;
    left: 143px;
}

.landing-page .text-wrapper-68 {
    position: relative;
    width: 257px;

    font-weight: 400;
    color: #737373;
    font-size: 14px;
    letter-spacing: -0.14px;
    line-height: normal;
}

.landing-page .frame-47 {
    width: 143px;
    height: 46px;
    gap: 6px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1px;
    background-color: #323131;
    border-radius: 8px;
}

.landing-page .frame-48 {
    width: 142px;
    height: 46px;
    gap: 6px;
    margin-bottom: -2.00px;
    margin-right: -1.00px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    position: relative;
    border-radius: 8px;
    border-top-width: 1px;
    border-top-style: solid;
    border-right-width: 1px;
    border-right-style: solid;
    border-left-width: 1px;
    border-left-style: solid;
    border-color: #626262;
    box-shadow: inset 0px 0px 20px #a3a3a340;
    background: linear-gradient(
            360deg,
            rgba(33, 33, 33, 1) 0%,
            rgba(56, 56, 56, 1) 100%
    );
}

.landing-page .text-wrapper-69 {
    position: relative;
    width: fit-content;
    margin-top: -1.00px;
    margin-left: -7.50px;

    font-weight: 500;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: -0.32px;
    line-height: 26px;
    white-space: nowrap;
}

.landing-page .arrow-up-right {
    position: relative;
    width: 18px;
    height: 18px;
    margin-right: -7.50px;
}

.landing-page .frame-49 {
    display: flex;
    flex-direction: column;
    width: 1200px;
    align-items: center;
    gap: 11px;
    position: absolute;
    top: 329px;
    left: 120px;
}

.landing-page .vector-10 {
    position: relative;
    width: 1200px;
    height: 1px;
    margin-top: -0.50px;
    object-fit: cover;
}

.landing-page .text-wrapper-70 {
    position: relative;
    align-self: stretch;
    font-weight: 400;
    color: #737373;
    font-size: 16px;
    text-align: center;
    letter-spacing: -0.32px;
    line-height: 26px;
}

/* Inject original CSS here */

/* Global Styles */
body {
    color: #404040;
    line-height: 1.6;
}

.landing-page {
    max-width: 1440px;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .landing-page {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.content {
    padding: 0 20px;
    width: 100%;
}

/* Header Styles */
.header {
    padding: 38px 0;
}

@media screen and (max-width: 768px) {
    .header {
        padding: 36px 0;
    }
}

.nav {
    display: flex;
    position: relative;
    justify-content: space-between;
    align-items: center;
    padding: 20px 40px;
    background-color: #ffffff;
    border-radius: 30px;
    border: 1px solid var(--grey-100);
    backdrop-filter: blur(50px);
    top: 0;
    z-index: 5;
}

.nav.fixed {
    position: fixed;
    top: 0;
    border-radius: 0;
    width: 100%;
    left: 0;
    z-index: 15;
    box-shadow: 0 3px 20px 10px rgba(0, 0, 0, 0.1);
}

.logo {
    width: auto;
    height: 56px;
    position: absolute;
    top: 6px;
}

.nav-links {
    display: flex;
    gap: 40px;
}

.nav-links li {
    display: inline;
}

.nav-links a {
    color: var(--grey-600);
    font-size: 16px;
    text-decoration: none;
}

.nav-menu {
    display: none;
}

.mobile-nav {
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    background: white;
    visibility: hidden;
    z-index: 20;
    box-shadow: 0 4px 20px 10px rgba(0, 0, 0, 0.1);
    transform: translateY(-200px);
    display: none;
}

.mobile-nav.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.mobile-nav-links {
    display: flex;
    flex-direction: column;
    text-align: center;
    padding: 50px 0;
}

.nav-close-menu {
    position: absolute;
    top: 0;
    right: 0;
    padding: 28px;
    cursor: pointer;
}

.mobile-nav-links li a {
    padding: 20px;
    width: 100%;
    display: block;
    font-size: 16px;
}

.nav-menu.active {
    transform: rotateZ(90deg);
}

@media screen and (max-width: 768px) {
    /* Tablet and below */
    .nav {
        padding: 10px 20px;
    }

    .mobile-nav {
        display: block;
    }

    .nav-menu {
        display: block;
        padding: 10px;
        visibility: visible;
    }

    .nav-links {
        display: none;
    }
}

/* Hero Section Styles */
.hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 30px;
}

.hero-content {
    max-width: 650px;
}

.currency-icons {
    display: inline-flex;
    position: relative;
    margin-right: 12px;
}

.currency-icon {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: -10px;
    border: 1px solid #ffffff;
    gap: -10px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.07);
}

.currency-icon.yen {
    background-color: #ff51f9;
}

.currency-icon.pound {
    background-color: #6b66ff;
}

.currency-icon.dollar {
    background-color: #60d66a;
}

.compare-rates {
    color: #212025;
    text-align: center;
    font-size: 13px;
    font-style: normal;
    font-weight: bold;
    line-height: 24px;
    letter-spacing: -0.26px;
}

.compare-rates-holder {
    position: relative;
    padding: 8px 20px;
    background-color: #ffffff;
    border-radius: 40px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.07);
    margin-bottom: 20px;
    width: max-content;
    display: flex;
    flex-direction: row;
}

.hero-title {
    font-size: 4.375rem;
    line-height: 75px;
    letter-spacing: -0.70px;
    margin-bottom: 20px;
    font-weight: 100;
}


.hero-title span {
    color: #171717;
}

.hero-description {
    font-size: 18px;
    color: var(--grey-600);
    margin-bottom: 24px;
}

@media screen and (max-width: 768px) {
    /* Tablet and below */
    .hero {
        flex-direction: column;
        margin-top: 6px;
    }

    .hero-title,
    .hero-title span {
        font-size: 42px;
        line-height: normal;
        font-weight: bold;
    }

    .hero-content {
        width: 100%;
    }
}

.cta-button {
    display: inline-block;
    padding: 10px 22px;
    background: linear-gradient(
            360deg,
            rgba(33, 33, 33, 1) 0%,
            rgba(56, 56, 56, 1) 100%
    );
    color: #ffffff;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 500;
    border: 1px solid #626262;
    box-shadow: inset 0px 0px 20px rgba(163, 163, 163, 0.25);
    cursor: pointer;
}

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

/* Rate Calculator Styles */
.rate-calculator {
    width: 437px;
    background-color: var(--grey-50);
    border-radius: 20px;
    padding: 24px 16px;
    border: 1px solid var(--grey-100);
    box-shadow: 0 0 0 4px rgba(170, 170, 170, 0.07);
}

@media screen and (max-width: 768px) {
    /* Tablet and below */
    .rate-calculator {
        width: 100%;
        padding: 10px;
    }
}

.calculator-title {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 20px;
}

.calculator-form {
    display: grid;
    gap: 13px;
    position: relative;
}

.currency-select {
    margin-top: 0 !important;
}

.currency-select,
.amount-input,
.provider-select {
    cursor: pointer;
}

.currency-select *,
.amount-input *,
.provider-select * {
    cursor: pointer;
}

.currency-select:hover,
.amount-input:hover,
.provider-select:hover {
    background-color: var(--grey-100);
}

.form-input label {
    display: block;
    font-size: 14px;
    color: #737373;
}

.select-wrapper {
    display: flex;
    position: relative;
    align-items: center;
}

.select-wrapper img {
    max-width: 50px;
    height: 20px;
    margin-right: 8px;
}

.select-wrapper button {
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    min-height: 24px;
}

.select-wrapper .down {
    position: absolute;
    right: 0;
    top: -10px;
    width: 16px;
}

select,
input {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 14px;
    color: #000000;
    appearance: none;
}

.swap-currencies {
    width: 35px;
    height: 35px;
    position: absolute;
    background-color: #f7f7f7;
    border-radius: 50%;
    display: flex;
    z-index: 5;
    left: 45%;
    top: 25%;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin: 10px auto;
    border: 1px solid var(--grey-700);
}

.modal-close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 28px;
    cursor: pointer;
}

.swap-currencies:hover {
    transform: rotateZ(90deg);
}

.swap-currencies.active {
    transform: rotateZ(180deg);
}

.swap-currencies:hover {
    background-color: var(--grey-300);
}

.form-input {
    border-radius: 10px;
    border: 1px solid var(--grey-200, #E5E5E5);
    background: #FFF;
    padding: 16px 16px;
}

/* Exchange Rates Section Styles */
.exchange-rates {
    margin-top: 70px;
}

@media screen and (max-width: 768px) {
    .exchange-rates {
        margin: 0;
    }
}

.current-rate {
    margin-bottom: 41px;
}

.rate-value {
    font-size: 36px;
    font-weight: 600;
    color: var(--grey-950);
    margin-bottom: 6px;
}

.rate-description {
    font-size: 18px;
    color: var(--grey-600);
}

@media screen and (max-width: 768px) {
    .rate-description {
        font-size: 14px;
    }

    .rate-value {
        font-size: 20px;
    }

    .current-rate {
        margin-bottom: 25px;
    }
}

.rate-table {
    background-color: #ffffff;
    border-radius: 22.58px;
    overflow: hidden;
    border: 1.13px solid #f0f0f0;
}

.table-header {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
    background-color: #f2f2f2;
    padding: 20px 50px;
}

.table-body .cell.best {
    font-weight: bold;
}

.table-row.best {
    box-shadow: 0 -3px 20px 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    padding: 20px 20px;
}

.table-row.best .cell:first-child {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.best-pill {
    border-radius: 10px;
    padding: 4px 14px;
    background: #00a600;
    font-size: 11px;
    color: white;
    font-weight: 800;
}

.table-row:first-child.best {
    margin-top: 10px;
}

.table-header.admin {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr
}

.header-cell {
    font-weight: 600;
    color: var(--grey-900);
    font-size: 16px;
}

.header-cell:first-child {
    padding-left: 20px;
}

.table-body {
    padding: 0 50px;
}

.table-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
    align-items: center;
    padding: 20px 20px;
    border-bottom: 1px solid #f0f0f0;
}

.table-row.admin {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}

.table-row:last-child {
    border-bottom: none;
}

.cell img {
    max-width: 100px;
    max-height: 40px;
}

.cell label {
    display: none;
}

.table-row.best:last-child {
    margin-bottom: 30px;
}

@media screen and (max-width: 768px) {
    .table-header {
        display: none;
    }

    .table-body {
        padding: 24px;
    }

    .table-row {
        padding: 30px 0;
        flex-direction: column;
        display: flex;
        gap: 10px;
        justify-content: start;
    }

    .table-body .table-row.best:first-child {
        padding: 20px;
        margin-top: 0;
    }

    .table-row .cell:first-child {
        padding-bottom: 10px;
    }

    .table-row .cell {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    .table-row .cell label {
        display: block;
        font-size: 15px;
        font-weight: 600;
    }

    .table-row.best {
        margin-left: -14px;
        margin-right: -14px;
        padding: 30px 14px;
    }

    .table-row.best:last-child {
        margin-bottom: 0;
    }
}

.view-history {
    color: var(--grey-800);
    text-decoration: underline;
    font-weight: 600;
}

/* Historical Rates Section Styles */
.historical-rates {
    margin-top: 70px;
}

.historical-rates .range {
    display: flex;
    flex-direction: column;
    align-items: start;
}

.historical-rates .range h2 {
    margin-bottom: 22px;
}

.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 35px;
}

.section-header h2 {
    font-size: 26px;
    font-weight: 500;
}

.time-range {
    display: flex;
    background-color: #f3f3f3;
    border-radius: 9.46px;
    overflow: hidden;
}

.time-range button {
    padding: 11.36px 9.46px;
    font-size: 16px;
    background: none;
    border: none;
    cursor: pointer;
}

.time-range button.active {
    background-color: #ffffff;
    font-weight: 500;
}

.chart-legend {
    display: flex;
    gap: 24.6px;
    margin-bottom: 20px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 9.46px;
}

.legend-color {
    width: 15.14px;
    height: 15.14px;
    border-radius: 50%;
}

.legend-color.buy {
    background-color: var(--blue-brand);
}

.legend-color.sell {
    background-color: #d1ca15;
}

.chart-container {
    position: relative;
}

.chart-image {
    width: 100%;
    height: auto;
}

.chart-tooltip {
    position: absolute;
    top: 84px;
    left: 520px;
    background-color: #ffffff;
    border-radius: 8.16px;
    padding: 12px;
    box-shadow: 0px 4.08px 20.39px rgba(0, 0, 0, 0.07);
}

.tooltip-rate {
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 6px;
}

.tooltip-date {
    font-size: 13px;
    color: #737373;
}

/* Subscribe Section Styles */
.subscribe-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
    max-width: 1440px;
    margin: 0 auto;
}

.subscribe-container {
    background-color: #f7f7f7;
    width: 100%;
}

.subscribe-content h2 {

    font-size: 55px;
    line-height: 60px;
    letter-spacing: -1.10px;
    margin-bottom: 15px;
    font-weight: bold;
}

.subscribe-content p {
    font-size: 20px;
    color: #737373;
    margin-bottom: 22px;
}

.subscribe-image {
    width: 430px;
    height: auto;
}

@media screen and (max-width: 768px) {
    /* Tablet and below */
    .subscribe-image {
        display: none;
    }

    .subscribe-section {
        padding-top: 45px;
        padding-bottom: 45px;
        text-align: center;
    }

    .subscribe-content h2 {
        text-align: center;
        font-size: 34px;
        line-height: normal;
        letter-spacing: -0.68px;
    }

    .subscribe-content p {
        text-align: center;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 22px;
    }
}

/* Footer Styles */
.footer {
    padding-top: 120px;
    background-color: #fff;
}

.footer-content {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    padding: 60px 20px 100px;
    max-width: 1440px;
}

.footer-brand {
    max-width: 288px;
}

.footer-logo {
    width: 140px;
    margin-bottom: 8px;
}

.footer-brand p {
    font-size: 16px;
    color: #737373;
}

.footer-links {
    display: flex;
    gap: 160px;
}

@media screen and (max-width: 768px) {
    .footer {
        padding-top: 68px;
    }

    /* Tablet and below */
    .footer-content {
        flex-direction: column;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .footer-brand {
        width: 100%;
        max-width: none;
        margin-bottom: 50px;
    }

    .footer-links {
        width: 100%;
        gap: 0;
        margin-bottom: 50px;
    }

    .footer-links .link-group {
        width: 50%;
    }

    .whatsapp-updates {
        width: 100%;
        max-width: none;
        margin-bottom: 50px;
    }

    .whatsapp-updates h3 {
        font-size: 28px;
    }
}

.subscription-modal-content {
    .subscribe {
        background-color: #ffffff;
        display: flex;
        flex-direction: row;
        justify-content: center;
        width: 100%;
    }

    .subscribe .div {
        background-color: #ffffff;
        width: 1149px;
        height: 592px;
        position: relative;
    }

    .subscribe .frame {
        display: flex;
        flex-direction: column;
        width: 1001px;
        align-items: center;
        gap: 70px;
        position: absolute;
        top: 68px;
        left: 74px;
    }

    .subscribe .frame-2 {
        display: flex;
        flex-direction: column;
        width: 553px;
        align-items: center;
        justify-content: center;
        gap: 5px;
        position: relative;
        flex: 0 0 auto;
    }

    .subscribe .text-wrapper {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-weight: 400;
        color: #000000;
        font-size: 36px;
        text-align: right;
        letter-spacing: 0;
        line-height: normal;
        white-space: nowrap;
    }

    .subscribe .p {
        position: relative;
        align-self: stretch;

        font-weight: 400;
        color: #737373;
        font-size: 16px;
        text-align: center;
        letter-spacing: -0.32px;
        line-height: normal;
    }

    .subscribe .frame-3 {
        display: flex;
        align-items: center;
        gap: 40px;
        position: relative;
        align-self: stretch;
        width: 100%;
        flex: 0 0 auto;
    }

    .subscribe .frame-4 {
        position: relative;
        width: 307px;
        height: 321px;
        background-color: #ffffff;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid;
        border-color: #4842e9;
        box-shadow: 0px 0px 0px 5px #6b66ff12;
    }

    .subscribe .vector {
        position: absolute;
        width: 266px;
        height: 1px;
        top: 141px;
        left: 19px;
        object-fit: cover;
    }

    .subscribe .frame-wrapper {
        display: flex;
        flex-direction: column;
        width: 269px;
        height: 44px;
        align-items: flex-start;
        gap: 10px;
        padding: 1px;
        position: absolute;
        top: 260px;
        left: 19px;
        background-color: #323131;
        border-radius: 8px;
    }

    .subscribe .div-wrapper {
        display: flex;
        height: 44px;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 10px 22px;
        position: relative;
        align-self: stretch;
        width: 100%;
        margin-bottom: -2.00px;
        border-radius: 8px;
        border-top-width: 1px;
        border-top-style: solid;
        border-right-width: 1px;
        border-right-style: solid;
        border-left-width: 1px;
        border-left-style: solid;
        border-color: #626262;
        box-shadow: inset 0px 0px 20px #a3a3a340;
        background: linear-gradient(
                360deg,
                rgba(33, 33, 33, 1) 0%,
                rgba(56, 56, 56, 1) 100%
        );
    }

    .subscribe .text-wrapper-2 {
        position: relative;
        width: fit-content;
        margin-top: -2.00px;
        font-weight: 500;
        color: #ffffff;
        font-size: 14px;
        letter-spacing: -0.28px;
        line-height: 26px;
        white-space: nowrap;
    }

    .subscribe .text-wrapper-3 {
        position: absolute;
        width: 273px;
        top: 157px;
        left: 12px;

        font-weight: 400;
        color: #525252;
        font-size: 13px;
        letter-spacing: -0.26px;
        line-height: 20px;
    }

    .subscribe .text-wrapper-4 {
        position: absolute;
        top: 25px;
        left: 20px;

        font-weight: 400;
        color: #737373;
        font-size: 16px;
        text-align: center;
        letter-spacing: -0.32px;
        line-height: normal;
    }

    .subscribe .frame-5 {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 4px;
        position: absolute;
        top: 57px;
        left: 19px;
    }

    .subscribe .text-wrapper-5 {
        position: relative;
        width: fit-content;
        margin-top: -1.00px;
        font-weight: 600;
        color: #000000;
        font-size: 28px;
        text-align: center;
        letter-spacing: 0;
        line-height: normal;
    }

    .subscribe .text-wrapper-6 {
        position: relative;
        width: fit-content;

        font-weight: 400;
        color: #a3a3a3;
        font-size: 13px;
        text-align: center;
        letter-spacing: -0.39px;
        line-height: normal;
    }

    .subscribe .frame-6 {
        position: relative;
        width: 307px;
        height: 321px;
        background-color: #ffffff;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid;
        border-color: #ff51f9;
        box-shadow: 0px 0 0px 5px #ff51f912;
    }

    .subscribe .text-wrapper-7 {
        position: absolute;
        top: 28px;
        left: 19px;

        font-weight: 400;
        color: #737373;
        font-size: 16px;
        text-align: center;
        letter-spacing: -0.32px;
        line-height: normal;
    }

    .subscribe .img {
        position: absolute;
        width: 266px;
        height: 1px;
        top: 137px;
        left: 19px;
        object-fit: cover;
    }

    .subscribe .frame-7 {
        display: flex;
        flex-direction: column;
        width: 269px;
        height: 44px;
        align-items: flex-start;
        gap: 10px;
        padding: 1px;
        position: absolute;
        top: 256px;
        left: 19px;
        background-color: #323131;
        border-radius: 8px;
    }

    .subscribe .frame-8 {
        display: inline-flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 4px;
        position: absolute;
        top: 60px;
        left: 19px;
    }

    .subscribe .frame-9 {
        display: flex;
        flex-direction: column;
        width: 273px;
        align-items: flex-start;
        gap: 10px;
        position: absolute;
        top: 158px;
        left: 11px;
    }

    .subscribe .text-wrapper-8 {
        position: relative;
        align-self: stretch;
        height: 40px;
        margin-top: -1.00px;

        font-weight: 400;
        color: #525252;
        font-size: 13px;
        letter-spacing: -0.26px;
        line-height: 20px;
    }

    .subscribe .text-wrapper-9 {
        position: relative;
        align-self: stretch;

        font-weight: 400;
        color: #525252;
        font-size: 13px;
        letter-spacing: -0.26px;
        line-height: 20px;
    }

    .subscribe .frame-10 {
        position: relative;
        width: 307px;
        height: 321px;
        background-color: #ffffff;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid;
        border-color: #25dc7a;
        box-shadow: 0px 0px 0px 5px #20b03812;
    }

    .subscribe .text-wrapper-10 {
        position: absolute;
        width: 273px;
        top: 157px;
        left: 19px;

        font-weight: 400;
        color: #525252;
        font-size: 13px;
        letter-spacing: -0.26px;
        line-height: 20px;
    }

    .subscribe .cancel {
        position: absolute;
        width: 24px;
        height: 24px;
        top: 32px;
        left: 1085px;
    }

    /* Original CSS code should be injected here */

    .subscribe {
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 100vh;
        background-color: #ffffff;
    }

    .subscription-container {
        position: relative;
        width: 100%;
        padding: 68px 20px;
        background-color: #ffffff;
    }

    .subscription-header {
        text-align: center;
        margin-bottom: 70px;
    }

    .subscription-title {
        font-size: 36px;
        color: #000000;
        margin-bottom: 5px;
    }

    .subscription-description {
        font-size: 16px;
        color: #737373;
        letter-spacing: -0.32px;
    }

    .subscription-plans {
        display: flex;
        justify-content: space-between;
        gap: 40px;
    }

    .plan-card {
        width: 307px;
        height: 321px;
        padding: 25px 20px;
        border-radius: 20px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .starter-plan {
        border: 1px solid #4842e9;
        box-shadow: 0px 0px 0px 5px rgba(107, 102, 255, 0.07);
    }

    .basic-plan {
        border: 1px solid #ff51f9;
        box-shadow: 0px 0px 0px 5px rgba(255, 81, 249, 0.07);
    }

    .standard-plan {
        border: 1px solid #25dc7a;
        box-shadow: 0px 0px 0px 5px rgba(32, 176, 56, 0.07);
    }

    .plan-title {
        font-family: Geist, sans-serif;
        font-size: 16px;
        font-weight: 400;
        color: #737373;
        margin-bottom: 10px;
    }

    .plan-price {
        display: flex;
        flex-direction: column;
    }

    .price-amount {
        font-size: 28px;
        font-weight: 600;
        color: #000000;
    }

    .price-period {
        font-size: 13px;
        color: #a3a3a3;
        letter-spacing: -0.39px;
    }

    .plan-divider {
        width: 100%;
        border: none;
        border-top: 1px solid #e5e5e5;
        margin: 20px 0;
    }

    .plan-description {
        font-size: 13px;
        color: #525252;
        letter-spacing: -0.26px;
        margin-bottom: 10px;
        flex-grow: 1;
    }

    .plan-note {
        font-size: 13px;
        color: #525252;
        letter-spacing: -0.26px;
        line-height: 20px;
    }

    .purchase-button {
        width: 100%;
        height: 44px;
        background: linear-gradient(360deg, #212121 0%, #383838 100%);
        border: 1px solid #626262;
        border-radius: 8px;
        color: #ffffff;
        font-size: 14px;
        font-weight: 500;
        letter-spacing: -0.28px;
        cursor: pointer;
        transition: background-color 0.3s ease;
    }

    .purchase-button:hover {
        background: linear-gradient(360deg, #383838 0%, #212121 100%);
    }

    .close-button {
        position: absolute;
        top: 32px;
        right: 64px;
        background: none;
        border: none;
        cursor: pointer;
    }

    @media (max-width: 1024px) {
        .subscription-container {
            padding: 40px 20px;
        }

        .subscription-plans {
            flex-direction: column;
            align-items: center;
        }

        .plan-card {
            width: 100%;
        }
    }

    @media screen and (max-width: 768px) {
        .subscription-title {
            font-size: 24px;
        }

        .subscription-header {
            margin-bottom: 40px;
        }
    }
}


.link-group h3 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 19px;
}

.link-group ul {
    list-style: none;
    padding: 0;
}

.link-group li {
    margin-bottom: 20px;
}

.link-group a {
    color: #737373;
    text-decoration: none;
}

.whatsapp-updates {
    max-width: 318px;
}

h3,
.whatsapp-updates h3 {

    font-size: 30px;
    line-height: 38px;
    font-weight: bold;
}

.whatsapp-updates h3 {
    margin-bottom: 6px;
}

.whatsapp-updates p {
    font-size: 14px;
    color: #737373;
    margin-bottom: 18px;
}

.whatsapp-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 22px;
    background: linear-gradient(
            360deg,
            rgba(33, 33, 33, 1) 0%,
            rgba(56, 56, 56, 1) 100%
    );
    color: #ffffff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 500;
}

.footer-bottom {
    border-top: 1px solid var(--grey-200);
    padding: 20px 0;
    text-align: center;
}

.footer-bottom p {
    color: #737373;
    font-size: 16px;
}

.popover {
    padding: 0;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05); /* Tailwind shadow-lg */
    font-size: 1rem; /* text-base */
    z-index: 60;
    width: 18rem; /* w-72 */
    float: left;
    padding-top: 0.25rem; /* py-1 */
    padding-bottom: 0.25rem;
    list-style: none;
    text-align: left;
    border: 1px solid #e5e7eb; /* default border color, override below for dark mode */
    border-radius: 0.75rem; /* rounded-xl */
    background-color: #ffffff; /* bg-white */
    color: #000000; /* default text color */

    overflow: hidden;
}

/* Small screen override for width */
@media (min-width: 640px) {
    .popover {
        width: 24rem; /* sm:w-96 */
    }
}

.popover .opt-cont {
    overflow: auto;
    max-height: 15rem;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
    .popover {
        background-color: #1f2937; /* dark:bg-dark (custom value) */
        border-color: #374151; /* dark:border-dark-1 */
        color: #ffffff; /* dark:text-white */
    }
}

.popover.tool-tip {
    filter: drop-shadow(0px 0px 10px #f5f3f3);
}

.popover.tool-tip:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-width: 15px;
    border-style: solid;
    top: -30px;
    left: 20px;
    border-color: transparent transparent #FFFFFF transparent;
}

.policy-header h1 {
    color: #000;
    font-size: 42px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.42px;
}

.policy-header {
    margin-bottom: 60px;
}

.policy-content details {
    border-bottom: 1px solid #E5E5E5;
    padding: 30px 0;
}

.policy-content summary {
    cursor: pointer;
    list-style: none;
}

.policy-content summary::-webkit-details-marker {
    display: none;
}

.policy-content summary h2 {
    font-size: 22px;
    color: var(--color-gray-800);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media screen and (max-width: 768px) {
    .policy-header h1 {
        font-size: 22px;
    }

    .policy-header {
        margin-bottom: 30px;
    }

    .policy-content summary h2 {
        font-size: 18px;
    }
}


.policy-content summary h2::after {
    content: "+";
    font-size: 24px;
}

.policy-content details[open] summary h2::after {
    content: "-";
}

.policy-details {
    padding-top: 20px;
}

.policy-details h3 {
    font-size: 18px;
    color: var(--color-gray-800);
    margin-bottom: 18px;
}

.policy-details p {
    font-size: 16px;
    text-align: justify;
    margin-bottom: 18px;
}
