li {
    list-style-type: none;
}

.draggable {
    width: auto;
    height: auto;
    top: 0;
    left: 20.64%;
}

.draggable--2 {
    top: 11.53%;
    left: 80.72%;
}

.draggable--3 {
    top: auto;
    bottom: -9%;
    left: 10.80%;
}

.draggable--4 {
    top: auto;
    bottom: -3.84%;
    left: 75.8%;
}

.fade-down {
    transition: all ease 0.5s 0.5s;
    opacity: 0;
    position: relative;
    transform: translateY(-100px);
}

.fade-up {
    transition: all ease 0.5s 1s;
    opacity: 0;
    position: relative;
    transform: translateY(100px);
}

.fade-up--2 {
    transition-delay: 1.3s;
}

.fade-up.is-active, .fade-down.is-active {
    transform: translateY(0);
    opacity: 1;
}


.feedback-carousel .owl-nav button {
    width: 30px;
    height: 30px;
    position: absolute;
    top: -44px;
    right: 0;
    left: auto;
    display: block;
    opacity: 0.75;
    border-radius: 50%;
}

.feedback-carousel .owl-nav button span {
    display: none;
}

.feedback-carousel .owl-nav button:hover {
    opacity: 1;
}

.feedback-carousel .owl-nav button.owl-next {
    background: url("/assets/img/home/arrow-right-circle-fill.svg") center no-repeat,
    linear-gradient(white, white);
    background-size: contain;
}

.feedback-carousel .owl-nav button.owl-prev {
    right: 50px;
    background: url("/assets/img/home/arrow-left-circle-fill.svg") center no-repeat,
    linear-gradient(white, white);
    background-size: contain;
}

.feedback-carousel .item::marker {
    display: none;
}

.home-mv {
    padding: 53px 20px 25px;
    position: relative;
}

@media (min-width: 992px) {
    .home-mv {
        padding: 60px 80px 162px;
    }
}

.home-mv__static {
    font-size: 20px;
    margin-bottom: 1px;
}

@media (min-width: 767px) {
    .home-mv {
        padding: 60px 80px 162px;
    }
}

.home-owner {
    position: relative;
    background: radial-gradient(170% 120% at 50% 50%, rgba(0, 0, 0, 0.5), rgba(144, 198, 63, 1));
    border-radius: 19px;
    width: fit-content;
    margin: 0 auto;
    padding: 8px 17px;
    margin-bottom: 2rem;
    border: 0.9px solid;
    border-color: rgba(80, 182, 72, 1);
}

@media (min-width: 992px) {
    .home-owner {
        background: radial-gradient(170% 120% at 50% 50%, rgba(0, 0, 0, 0.5), rgba(144, 198, 63, 1));
        border-radius: 29px;
        padding: 12px 26px;
    }
}

.home-owner::before {
    content: "";
    /* Frame 5 */
    position: absolute;
    width: 59.8px;
    height: 2.39px;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    background: #ffffff;
    border-radius: 60px 60px 0px 0px;
}

@media (min-width: 992px) {
    .home-owner::before {
        position: absolute;
        width: 90px;
        background: #ffffff;
        border-radius: 90px 90px 0px 0px;
    }
}

.home-owner__logo {
    width: 24px;
    height: auto;
}

@media (min-width: 768px) {
    .home-owner__logo {
        width: auto;
    }
}

.home-owner__text {
    font-size: 12px;
}

@media (min-width: 992px) {
    .home-owner__text {
        font-size: 14px;
    }
}

@media (min-width: 768px) {
    .home-owner__text {
        font-size: 16px;
    }
}

.home-mv__heading {
    font-size: 28px;
    line-height: 1.48;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .home-mv__heading {
        font-size: 40px;
    }
}

@media (min-width: 992px) {
    .home-mv__heading {
        font-size: 60px;
        margin-bottom: 32px;
    }
}

.home-mv__desc {
    font-size: 16px;
    margin-bottom: 28px;
    line-height: 32px;
}

@media (min-width: 768px) {
    .home-mv__desc {
        font-size: 16px;
        margin-bottom: 30px;
    }
}

@media (min-width: 992px) {
    .home-mv__desc {
        font-size: 20px;
        margin-bottom: 42px;
    }
}

.home-mv__seemore {
    font-size: 16px;
    padding: 11px 24px;
}

@media (min-width: 992px) {
    .home-mv__seemore {
        font-size: 18px;
        padding: 14px 23px;
    }
}

.home-mv__videoFooter {
    background: rgba(80, 170, 77, 0.24);
    backdrop-filter: blur(8px);
    padding: 21px 0 24px;
    /*border-radius: 0 0 24px 24px;*/
}

.home-video {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

@media (min-width: 767px) {
    .home-mv__videoFooter {
        padding: 64px 0 47px;
    }
}

.home-util {
    margin-top: 120px;
}

.home-util__heading {
    margin-bottom: 22px;
}

@media (min-width: 767px) {
    .home-util__heading {
        margin-bottom: 60px;
    }
}

.home-util__footer {
    padding: 83px 20px 64px 20px;
    gap: 50px;
    background: #11150c;
}

@media (min-width: 1200px) {
    .home-util__footer {
        padding: 113px 77px 94px 90px;
        gap: 77px;
    }
}

.section.home-about {
    margin-bottom: 0px;
    padding-top: 40px;
}

@media (min-width: 768px) {
    .section.home-about {
        padding-top: 162px;
        margin-bottom: 118px;
    }
}

.section.question-section {
    padding-top: 17px;
    padding-bottom: 21px;
}

@media (min-width: 768px) {
    .section.question-section {
        padding-top: 79px;
        padding-bottom: 40px;
    }
}

.section.home-tool {
    scroll-margin-top: 50px;
    width: 100%;
    overflow: hidden;
}

@media (min-width: 768px) {
    .section.home-tool {
        scroll-margin-top: 170px;
    }
}

.home-tool__heading {
    margin-bottom: 8px;
    margin-top: -6px;
}

@media (min-width: 768px) {
    .home-tool__heading {
        margin-bottom: 48px;
        margin-top: 0;
    }
}

.home-tool__desc {
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 2.28;
}

@media (min-width: 768px) {
    .home-tool__desc {
        font-size: 32px;
        margin-bottom: 40px;
        line-height: 1.5;
    }
}

@media (min-width: 1200px) {
    .home-tool__desc {
        font-size: 32px;
        margin-bottom: 50px;
        line-height: 1.5;
    }
}

.home-tool__item {
    display: flex;
    align-items: center;
    gap: 27px;
    margin: 0 -20px;
    width: calc(100% + 40px);
    padding: 50px 20px 44px;
}

@media (min-width: 768px) {
    .home-tool__item {
        gap: 30px;
        margin: 0;
        width: 100%;
    }
}

@media (min-width: 1200px) {
    .home-tool__item {
        gap: 94px;
        margin: 0;
        width: 100%;
    }
}

.home-tool__item:nth-child(2n + 1) {
    background-color: #041900;
}

@media (min-width: 768px) {
    .home-tool__item:nth-child(2n + 1) {
        background-color: transparent;
    }
}

.home-tool__item:nth-child(2n) .home-tool__itemContent {
    order: -1;
}

.home-tool__item .home-tool__itemContent {
    order: -1;
}

@media (min-width: 768px) {
    .home-tool__item .home-tool__itemContent {
        order: unset;
    }
}

.home-tool__itemImg {
    flex: 0 0 100%;
}

@media (min-width: 768px) {
    .home-tool__itemImg {
        flex: 0 0 calc(50% - 40px / 2);
    }
}

@media (min-width: 1200px) {
    .home-tool__itemImg {
        flex: 0 0 calc(50% - 94px / 2);
    }
}

.home-tool__itemContent {
    flex: 0 0 100%;
}

@media (min-width: 768px) {
    .home-tool__itemContent {
        flex: 0 0 calc(50% - 40px / 2);
    }
}

@media (min-width: 1200px) {
    .home-tool__itemContent {
        flex: 0 0 calc(50% - 94px / 2);
    }
}

.home-tool__itemContent h3 {
    margin-bottom: 9px;
}

.home-tool__itemDesc {
    font-size: 14px;
    line-height: 1.71;
    color: rgba(173, 178, 177, 1);;
}

@media (min-width: 768px) {
    .home-tool__itemDesc {
        font-size: 16px;
        line-height: 1.5;
    }
}

.home-about__slides {
    background: linear-gradient(
        180deg,
        rgba(80, 182, 72, 0.2) 0%,
        rgba(144, 198, 63, 0.2) 50%,
        rgba(178, 236, 15, 0.2) 100%
    );
    border: 2px solid #90c63f;
    border-radius: 24px;
    text-align: center;
    padding: 18px 14px;
}

.home-about__slidesTitle {
    font-size: 20px;
}

.home-about__slidesDesc {
    color: #adb2b1;
    font-size: 16px;
}

.home-card-carousel {
    padding: 0;
}

.home-about-pagination {
    position: static;
    margin-top: -3px;
}

.home-about-pagination .swiper-pagination-bullet {
    width: 32px;
    height: 4px;
    background-color: #bfbfbf;
    border-radius: 1.25px;
    margin: 0 4px;
}

.home-about-pagination
.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #ffffff;
}

.home-card-carousel .owl-stage-outer {
    padding: 30px 0;
}

.home-card-carousel .owl-item {
    padding: 0 24px;
}

.home-carousel .owl-item .overview-box {
    width: calc(100% - 2px);
}

.home-card-carousel .owl-nav button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    transition: 0.3s ease-out;
    background-color: white !important;
}

.home-card-carousel .owl-prev {
    left: -16px;
}

.home-card-carousel .owl-next {
    right: -16px;
}

.home-card-carousel .owl-nav button:hover {
    background: #fafafa !important;
}

.home-card {
    background: hsla(0, 0%, 100%, 0.5);
    box-shadow: 0px -4px 20px rgb(0 0 0 / 12%),
    0px 14px 20px -4px rgb(24 39 75 / 12%);
    border-radius: 4px;
    padding: 25px 15px;
    text-align: center;
    overflow-y: hidden;
    height: 450px;
}

.home-card .description {
    font-weight: 400;
    min-height: 140px;
    font-size: 18px;
    margin-bottom: 12px;
}

.home-card img {
    width: 100%;
}

.feedback {
    background: #ff6666;
    padding: 108px 0 0;
    position: relative;
    margin-top: 50px;
}

.feedback .container {
    display: block;
    position: relative;
}

.feedback-pic {
    position: relative;
    height: 100%;
}

.feedback-pic img {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 145%;
    height: auto;
    z-index: 9;
}

.feedback .feedback-item {
    background: #ffffff;
    border-radius: 30px;
    display: block;
    min-height: 230px;
    padding: 40px;
    margin-right: 32px;
}

.feedback .feedback-item .ava {
    display: inline-block;
    width: 100%;
    position: relative;
    margin-bottom: 31px;
    font-weight: 400;
    font-size: 18px;
    line-height: 140%;
}

.feedback .feedback-item .ava b {
    display: block;
    font-size: 20px;
}

.feedback .feedback-item .ava::after {
    width: 122px;
    height: 20px;
    display: block;
    content: " ";
    position: absolute;
    left: 75px;
    top: 50px;
    background: url("/assets/img/home/user/5-sao.svg") center no-repeat;
    background-size: contain;
}

.feedback .feedback-item .ava img {
    display: block;
    float: left;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    margin-right: 20px;
}

.blur-bg {
    background-color: #f5f5f5;
}

.main-bg {
    background-color: var(--main-color) !important;
}

.auth-form-wrapper {
    max-width: 488px;
    padding: 48px 44px;
    border-radius: 20px;
}

.auth-form-wrapper.wrapper-modal {
    padding: 32px 28px
}

.auth-form-divider::after {
    content: "";
    position: absolute;
    background: #e0e0e0;
    width: 100%;
    height: 1px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: 1;
}

.auth-form-divider > * {
    z-index: 2;
    position: relative;
    color: #4b4b4b;
    font-weight: 500;
}

.auth-title {
    position: relative;
    color: rgba(51, 51, 51, 1);
    padding: 20px 0;
    font-size: 28px;
    font-weight: 700;
    line-height: 42px;
    text-align: center;
}

@media (max-width: 768px) {
    .auth-title {
        font-size: 24px;
        font-weight: 700;
        line-height: 36px;
        text-align: center;
    }
}

.form-group label {
    display: block;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
}

.auth-form-wrapper .form-group label {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
}

.auth-form-wrapper .form-group .form-control {
    padding: 9px 12px;
    border: 1px solid rgba(222, 226, 230, 1);
    border-radius: 4px;
}

.auth-form-wrapper .form-group .form-control::placeholder {
    color: rgba(226, 228, 229, 1);
}

.auth-bg {
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: left;
    padding-top: 40px;
    padding-bottom: 40px;
}

.btn-auth-social {
    color: rgba(0, 0, 0, 0.54);
    font-size: 20px;
    font-weight: 500;
    padding: 12px;
    line-height: 20px;
    min-width: 190px;
    width: 100%;
}

.guide-message p {
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    text-align: left;
    color: rgba(51, 51, 51, 1);
    margin-bottom: 7px;
    margin-top: 8px;
}

.guide-message ul {
    padding-left: 20px;
}

.guide-message li {
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    text-align: left;
    color: rgba(140, 140, 140, 1);
    padding: unset;
}

.guide-message li:before {
    content: "·";
    font-size: 20px;
    vertical-align: sub;
    line-height: 27px;
    padding-right: 6px;
}

.otp-container .otp-input {
    display: flex;
    justify-content: center;
    align-items: center;
    caret-color: transparent;
    box-shadow: unset;
    font-size: 23px;
    font-weight: 400;
    line-height: 32px;
    color: rgba(127, 202, 39, 1);
    border-radius: 12px;
    width: 40px;
    height: 52px;
    padding-bottom: 11px;
}

.otp-container .otp-input.inputted {
    border: 1px solid rgba(127, 202, 39, 1);
}

.otp-container .otp-input:focus {
    border: 1px solid rgba(127, 202, 39, 1);
}

.home-card .icon {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    border: solid 2px #fff;
    top: -120px;
    margin: 0 auto;
    right: 0;
    left: 0;
    position: absolute;
}

.home-card .img-group {
    top: 120px;
    position: relative;
}

.home-card:hover .img-group {
    top: 80px;
}

.home-card:hover {
    box-shadow: 0 -4px 20px rgb(0 0 0 / 49%),
    0 14px 20px -4px rgb(24 39 75 / 87%);
}

.owl-prev span,
.owl-next span {
    top: -5px;
    position: absolute;
    left: 12px;
    font-size: 28px;
}

.owl-next span {
    left: 12px !important;
}

.circle-blur,
.circle-blur-2 {
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    background-color: #b5ffad;
    fill: #b5ffad;
    filter: blur(250px);
}

.circle-blur {
    width: 243px;
    height: 243px;
    right: -133px;
    top: 90px;
}

.circle-blur-2 {
    width: 169px;
    height: 169px;
    top: -98px;
    left: -77px;
}

.small-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 25px;
}

.normal-text {
    font-weight: 500;
    font-size: 20px;
    line-height: 32px;
}

.large-text {
    font-weight: 700;
    font-size: 48px;
    line-height: 1.16;
}

.overview-group-icons {
    gap: 20px;
}

.overview-box {
    transform: translate3d(0, 0, 0);
    overflow: hidden;
    background: linear-gradient(
        112.54deg,
        rgba(102, 187, 69, 0.37) 10.29%,
        rgba(102, 187, 69, 0) 100.35%
    );
    backdrop-filter: blur(37.5px);
    /* Note: backdrop-filter has minimal browser support */
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 20px;
}

@media (min-width: 768px) {
    .overview-box {
        border-radius: 32px;
        border: 2px solid rgba(255, 255, 255, 0.55);
    }
}

.overview-box .icon-item {
    width: 60px;
    height: 60px;
    background-color: var(--primary-bg-light);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 0.67px solid #66bb45;
}

.overview-box .icon-item.small {
    width: 44px;
    height: 44px;
}

.overview-box .icon-item img {
    width: 30px;
    height: 30px;
}

.section-title {
    font-size: 32px;
    line-height: 42px;
    font-weight: 700;
}

.menu-title {
    font-size: 14px;
    line-height: 24px;
    transition: color ease 0.3s;
    letter-spacing: 0;
}

@media (min-width: 768px) {
    .menu-title {
        letter-spacing: 0.51px;
        font-size: 20px;
        line-height: 32px;
    }
}

.menu-desc {
    font-size: 14px;
    line-height: 24px;
}

@media (min-width: 768px) {
    .menu-desc {
        font-size: 18px;
        line-height: 32px;
    }
}

.large-menu-icon {
    width: 60px;
    height: 60px;
    background-color: #eaf6e9;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 8px;
}

.large-menu-icon img {
    width: 30px;
    height: 30px;
}

.left-center {
    visibility: hidden;
    opacity: 0;
}

.left-center.animate__animated {
    opacity: 1;
    visibility: visible;
}

.collapsing {
    transition: height 0.3s ease-in-out;
}

.default-transition {
    transition: all 0.3s ease;
}

.right-center {
    visibility: hidden;
    opacity: 0;
}

.right-center.animate__animated {
    opacity: 1;
    visibility: visible;
}

.question-collapse-item,
.lg-question-collapse-item {
    cursor: pointer;
}

.lg-question-collapse-item {
    gap: 40px;
}

.small-menu-icon {
    width: 40px;
    height: 40px;
    background-color: #fff;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.small-menu-icon img {
    width: 20px;
    height: 20px;
}

/* .question-collapse-icon {
  font-size: 54px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--main-green);
  line-height: 67px;
} */

@media (max-width: 767px) {
    .section.home-bottom-section {
        padding: 72px 16px 73px;
    }
}

.question-collapse-icon {
    position: relative;
    height: 32px;
    width: 32px;
}

.question-collapse-icon::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    height: 2.5px;
    width: 24px;
    background: linear-gradient(90deg, #9cda71 0%, #69ca26 100%);
    border-radius: 5px;
    transition: all ease 0.3s;
}

.question-collapse-icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 2.5px;
    height: 24px;
    background: linear-gradient(90deg, #9cda71 0%, #69ca26 100%);
    border-radius: 5px;
    transition: all ease 0.3s;
}

.question-collapse-icon.is-open.question-collapse-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.question-section-content {
    transition: all ease 0.3s;
    padding-right: 0;
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    .question-section-content {
        padding-right: 26px;
        margin-bottom: 33px;
    }
}

.question-section-content:has(.question-collapse-item[aria-expanded="true"]) {
    border: none;
    border-radius: 0;
    padding: 0;
}

@media (min-width: 768px) {
    .question-section-content:has(
            .question-collapse-item[aria-expanded="true"]
        ) {
        border: 1px solid #5bb946;
        border-radius: 6px;
        padding: 20px 26px 11px 20px;
    }
}

.question-collapse-item[aria-expanded="true"] .menu-title {
    color: #66bb45;
}

.home-question__heading {
    margin-bottom: 28px;
}

@media (min-width: 768px) {
    .home-question__heading {
        margin-bottom: 56px;
    }
}

.collapse-box {
    width: 90%;
    margin-top: 10px;
    margin-bottom: 10px;
}

.img-bottom {
    position: absolute;
    bottom: -50px;
    right: 50px;
    width: 40%;
    max-width: 574px;
}

.home-carousel .owl-dots {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 12px;
    gap: 8px;
}

.home-carousel .owl-dots .owl-dot {
    width: 12px;
    height: 12px;
    background-color: #66bb4529;
    border-radius: 50%;
}

.top-section-content p {
    margin: 0;
}

.section {
    padding: 47px 16px 33px;
    margin: 0 auto;
}

@media (min-width: 767px) {
    .section {
        padding: 24px 20px;
    }
}

.about-me-cover {
    width: 100%;
}

.about-me-avatar {
    width: 44px;
    height: 44px;
}

.about-me-info {
    margin-bottom: 20px;
}

.question-section-top {
    margin-bottom: 40px;
    gap: 16px;
}

.utility-introduction-section {
}

.mobile-slide-section {
    padding: 0 20px 40px;
}

.utility-section {
    padding: 0;
    gap: 0;
    display: flex;
    flex-direction: column;
}

@media (min-width: 1200px) {
    .utility-section {
        padding: 0px 0 80px;
        gap: 158px;
    }
}

.utility-section .menu-title {
    margin-bottom: 12px;
}

.utility-section .normal-text {
    margin-bottom: 32px;
}

.overview {
    margin-top: -95px;
    padding-top: 95px;
    overflow: hidden;
}

.overview-content {
    padding-left: 20px;
    padding-right: 20px;
}

.utility-introduction-section .d-flex {
    gap: 20px;
}

.about-me-content .section-title {
    margin-bottom: 24px;
}

.home-bottom-content .section-title {
    margin-bottom: 8px;
}

.home-bottom-content .normal-text {
    margin-bottom: 28px;
}

.about-me-content .normal-text.fst-italic {
    margin-bottom: 20px;
}

.section-btn {
    padding: 12px 20px;
    text-align: center;
    font-weight: 700;
    font-size: 14px;
    line-height: normal;
}

.top-section-content .first-text {
    margin-bottom: 12px;
}

.top-section-content .second-text {
    margin-bottom: 24px;
}

.top-section-content .third-text {
    margin-bottom: 44px;
}

.top-section-content .overview-btn {
    margin-top: 24px;
}

.section-btn.about-me-btn {
    padding: 12px 16px;
    gap: 8px;
}

.section-btn.about-me-btn > img {
    width: 16px;
    height: 16px;
}

.statistic-section {
    padding-top: 40px;
    padding-bottom: 40px;
}

.about-me-cover {
    margin-bottom: 20px;

    .collapse-box p {
    }

    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.overview-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 444px;
    z-index: -1;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.63) 59.65%,
        #e7fde3 100%
    );

    color: #1ca04f;
    margin-bottom: 12px;
}

.lg-question-collapse-item:first-child {
    margin-top: 0;
}

.lg-question-collapse-item:last-child {
    margin-bottom: 0;
}

@media (max-width: 992px) {
    .home-carousel .owl-dots .owl-dot {
        background-color: #fff;
        border: 1px solid #b7ec7f;
    }

    .question-section-content .menu-title {
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

.question-section-content .menu-title {
    padding-top: 0;
    padding-bottom: 0;
}

.home-carousel .owl-dots .owl-dot.active {
    background: linear-gradient(
        180deg,
        #50b648 0%,
        #90c63f 59.9%,
        #b2ec0f 99.48%
    ),
    linear-gradient(0deg, #90c63f, #90c63f);
    border: 1px solid #90c63f;
    box-shadow: 0px 8px 16px 0px #0000001a;
}

@media (min-width: 767px) {
    section {
        padding: 32px 28px;
    }

    .question-section-top {
        margin-bottom: 72px;
        gap: 24px;
    }

    .about-me-info {
        margin-bottom: 40px;
    }

    .about-me-avatar {
        width: 56px;
        height: 56px;
    }

    .home-bottom-content {
        max-width: 576px;
        width: 50%;
    }

    .home-bottom-content .section-title {
        margin-bottom: 20px;
    }

    .home-bottom-content .normal-text {
        margin-bottom: 24px;
    }

    .home-bottom-section {
        margin-top: 62px;
        margin-bottom: 50px;
        padding-top: 70px;
        padding-bottom: 70px;
        padding-left: 70px;
    }

    .section.utility-introduction-section {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .utility-introduction-section .d-flex {
        gap: 24px;
    }
}

@media (min-width: 992px) {
    .section {
        padding: 40px 100px;
        width: 100%;
    }

    .circle-blur {
        background-color: #12ba00;
        right: unset;
        left: -149px;
        top: 43px;

        .collapse-box {
        }

        margin-top: 20px;
        margin-bottom: 20px;
    }

    .question-section-content .menu-title {
        line-height: 27px;

        font-size: 18px;
        line-height: 32px;
    }

    .statistic-section {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .top-section-content {
        gap: 20px;
    }

    .top-section-content .overview-btn {
        margin-top: 12px;
    }

    .top-section-content .first-text {
        margin-bottom: 0px;
    }

    .top-section-content .second-text {
        margin-bottom: 0px;
    }

    .top-section-content .third-text {
        margin-bottom: 0px;
    }

    .overview {
        margin-top: 50px;
        padding-top: 0;
        overflow: unset;
    }

    .small-menu-icon {
        background-color: #eaf6e9;
    }

    .question-section-top {
        margin-bottom: 88px;
    }

    .about-me-section {
        padding: 80px 32px;
    }

    .about-me-cover {
        width: 480px;
        height: 400px;
    }

    .about-me-content {
        flex-grow: 1;
        max-width: 777px;
    }

    .about-me-content .normal-text.fst-italic {
        margin-bottom: 32px;
    }

    .about-me-content .section-title {
        margin-bottom: 26px;
    }

    .section-btn {
        width: 184px;
        padding: 12px 24px;
        text-align: center;
        font-weight: 700;
    }

    .section-btn.about-me-btn {
        padding: 12px 20px;
        width: 182px;
    }

    .home-bottom {
        margin-top: 60px;
    }

    .home-bottom-section {
        padding-top: 100px;
        padding-bottom: 100px;
        padding-left: 100px;
    }

    .overview-box > * {
    }
}

@media (min-width: 1200px) {
    .about-me-section {
        max-width: 1470px;
    }

    .about-me-content {
        margin-right: 20px;
    }
}

@media (min-width: 1600px) {
    .section {
        max-width: 1520px;
    }

    .about-me-content {
        margin-right: 90px;
    }

    .home-bottom-section {
        padding-left: 180px;
    }

    .img-bottom {
        right: 30px;
    }

    .overview-content {
        padding-left: 40px;
        padding-right: 40px;
    }
}

@media (max-width: 767px) {
    .home-bottom {
        background-color: #1c1c1c;
    }

    .home-bottom p {
        color: #fff;
    }

    .large-text {
        font-size: 36px;
        line-height: 48px;
    }

    .normal-text {
        font-size: 16px;
        line-height: 32px;
    }

    .small-text {
        font-size: 12px;
        line-height: 32px;
    }

    .section-title {
        font-size: 32px;
        line-height: 42px;
    }

    .question-collapse-icon {
        font-size: 36px;
        line-height: 1;
    }

    .auth-form-wrapper {
        min-width: auto;
        width: 100%;
        padding: 48px 30px;
        border-radius: 0;
    }

    .auth-form-wrapper.wrapper-modal {
        padding: 32px 0px
    }

    .auth-bg {
        padding-top: unset;
        padding-bottom: unset;
    }
}

input[type=password]::-ms-reveal,
input[type=password]::-ms-clear {
    display: none;
}

.loading-container {
    display: none;
}

.loading-container .lottie-container {
    height: 162px;
    width: 162px;
    transform: scale(3);
}

.loading-container .loading-message {
    margin-top: 28px;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    text-align: center;
    width: 325px
}


@media (max-width: 767px) {
    .loading-container .lottie-container {
        height: 60px;
        width: 60px;
    }

    .loading-container .loading-message {
        margin-top: 20px;
    }
}

.form-control.is-valid:not(.is-invalid) {
    background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M7.50016%209.58317L9.16683%2011.2498L12.9168%207.49981M16.6668%209.99984C16.6668%2014.0902%2012.2052%2017.0652%2010.5818%2018.0122C10.3973%2018.1198%2010.3051%2018.1737%2010.1749%2018.2016C10.0738%2018.2233%209.9265%2018.2233%209.82541%2018.2016C9.69525%2018.1737%209.603%2018.1198%209.4185%2018.0122C7.79513%2017.0652%203.3335%2014.0902%203.3335%209.99984V6.01448C3.3335%205.34822%203.3335%205.01509%203.44246%204.72873C3.53872%204.47576%203.69515%204.25005%203.89821%204.07109C4.12808%203.86851%204.44%203.75155%205.06383%203.5176L9.532%201.84204C9.70525%201.77707%209.79183%201.74459%209.881%201.73171C9.96%201.72029%2010.0403%201.72029%2010.1193%201.73171C10.2085%201.74459%2010.2951%201.77707%2010.4683%201.84204L14.9365%203.5176C15.5603%203.75155%2015.8722%203.86851%2016.1021%204.07109C16.3052%204.25005%2016.4616%204.47576%2016.5578%204.72873C16.6668%205.01509%2016.6668%205.34822%2016.6668%206.01448V9.99984Z%22%20stroke%3D%22%23176BFB%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E) !important;
}

.is-valid ~ .valid-feedback {
    display: flex;
    align-items: center;
    gap: 4px;
    color: rgba(127, 202, 39, 1);
}

.valid-feedback:before {
    content: var(--success-icon-img);
    margin-bottom: -3px;
}
