.hero {
    padding-top: 1rem;
    background: linear-gradient(
            110deg,
            rgba(0, 2, 44, 0.8) 0.31%,
            rgba(17, 61, 97, 0.8) 99.08%
        ),
        url("/themes/default/assets/bg.png") no-repeat;
    background-position: start;
    background-size: cover;
    height: 100vh;
    position: relative;
    nav {
        figure {
            .logo {
                width: 100%;
            }
        }
        .right-side {
            /* margin-right: 2rem; */
            .right-img1,
            .right-img2 {
                width: 50%;
                display: block;
                margin-left: 1rem;
                /* border: 1px solid red; */
            }
            .right-img1 {
                width: 60%;
            }
            .right-img2 {
                /* margin-top: 0.3rem; */
                width: 40%;
            }
            .blog-links {
            }
        }
        .become-parnter {
            display: block !important;
            background: linear-gradient(92deg, #9399ff 0%, #28a3e0 122.47%);
            padding: 1rem 0.8rem;
            text-wrap: noWrap;
            text-align: center;
            border-radius: 0.5rem;
            color: white;
            text-transform: uppercase;
            width: fit-content !important;
            font-size: 1rem;
        }
    }

    .heading-content {
        width: 50%;
        margin: auto;
        margin-top: 0rem;
        text-align: center;
        color: white;
        .heading {
            font-size: 120px;
            text-align: center;
            font-weight: 800;
            color: #00db93;
            line-height: 1.3;
            text-transform: capitalize;
            span {
                color: white;
            }
        }

        .sub-heading {
            font-size: 1.5rem;
            margin-top: 0.5rem;
        }
        .description {
            width: 78%;
            margin: auto;
            margin-top: 0.5rem;
            font-weight: 300;
            line-height: 1.3;
            margin-top: 1rem;
            font-size: 1rem;
        }
        .hero-vector1 {
            position: absolute;
            width: 10rem;
            right: 8rem;
            bottom: 15rem;
        }
    }

    .bottom-global-search {
        background: url(/themes/default/assets/bottom-src-bg.png) no-repeat;
        background-position: top;
        background-size: cover;
        margin-top: -3rem;
        width: 100%;
        position: absolute;
        display: flex;
        justify-content: end;
        align-items: center;
        min-height: 18rem;
        #First {
            position: relative;
            width: 50%;
            display: flex;
            justify-content: end;
            align-items: end;
            height: 100%;
            margin-right: 10rem;
            form {
                height: fit-content;
                width: 100%;
                label {
                    font-size: 1.7rem;
                    font-weight: 700;
                    color: white;
                    margin-left: 0.6rem;
                }
                .input-sec {
                    border-radius: 2rem;
                    margin-top: 0.5rem;
                    background-color: white;
                }
                input {
                    border: none;
                    background: none;
                    outline: none;
                    width: 73%;
                    padding: 1.2rem 0.7rem;
                    font-family: "Poppins";
                    font-size: 1rem;
                }
                input::placeholder {
                    font-size: 1rem;
                    color: rgba(128, 128, 128, 0.534);
                }
                .checknow-btn {
                    border: none;
                    background: none;
                    background-color: #021228;
                    color: white;
                    border-radius: 2rem;
                    padding: 1rem 0.4rem;
                    width: 30%;
                    font-weight: 600;
                    font-size: 1rem;
                    font-family: "Poppins";
                    cursor: pointer;
                    span,
                    img {
                        display: block;
                    }
                    img {
                        width: 1.5rem;
                        margin-left: 1rem;
                    }
                }
            }
        }
    }
}
.description1 {
    display: none;
}

.home-owners {
    padding: 1.8rem 0;
    /* height: 20rem; */
    /* margin-top: -2.5rem; */
    position: relative;
    background: linear-gradient(110deg, #113d61 0.32%, #00022c 133.62%);
    .left-sec {
        h2 {
            font-size: 2rem;
            font-weight: 400;
            color: white;
            line-height: 1.3;
            span {
                font-weight: 700;
                color: #00db93;
            }
        }
    }

    .right-sec {
        color: white;
        height: 10rem;
        position: relative;
        .content-figure {
            img {
                width: 4rem;
            }
            .person2 {
                position: relative;
                z-index: 1;
                margin-left: -1rem;
            }
            .person3 {
                position: relative;
                z-index: 1;
                margin-left: -1rem;
            }
        }
        .content {
            /* margin-left: -2rem; */
            line-height: 1.3;
            font-weight: 300;
            font-size: 0.8rem;

            /* border: 1px solid red; */
            span {
                font-weight: 600;
            }
        }
        .stars {
            width: 5rem;
            /* margin-left: 0.5rem; */
            position: absolute;
            right: 11rem;
            bottom: 2rem;
        }

        .nav-ind {
            /* border: 1px solid red; */
            margin-left: 1rem;
            img {
                cursor: pointer;
                width: 2rem;
                display: block;
                margin-bottom: 0.5rem;
            }
        }
    }
}

.icons-sec {
    margin-top: 2rem;
    margin-bottom: 1.5rem;
    .inside-icons-sec {
        width: 40%;
        margin: auto;
        .line {
            width: 10rem;
            margin-top: -3rem;
            img {
                width: 100%;
            }
        }
        .each-icon {
            figure {
                width: 2rem;
                height: 2rem;
                padding: 1.5rem;
                border-radius: 50%;
                background-color: #f4f4f4;
                margin: auto;
                display: flex;
                position: relative;
                justify-content: center;
                align-items: center;
                img {
                    width: 100%;
                    height: 100%;
                }

                .small-circle {
                    position: absolute;
                    width: 0.6rem;
                    height: 0.6rem;
                    background-color: #00b67a;
                    right: -0.3rem;
                    top: -1rem;
                    border-radius: 50%;
                }
            }
            p {
                text-align: center;
                margin-top: 1rem;
                line-height: 1.3;
                font-size: 0.7rem;
                font-weight: 400;
                color: white;
            }
        }
    }
}

.about-details {
    margin: 7rem 0;
    .inside-about {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 4rem;
        width: 88%;
        margin: auto;
        .each-box {
            /* border: 1px solid gray; */
        }
        .left-article {
            position: relative;
            h3 {
                font-size: 2.5rem;
                font-weight: 600;
                color: #0e3055;
            }
            h6 {
                font-weight: 600;
                margin: 0.5rem 0;
                color: #0e3055;
                font-size: 1rem;
            }
            p {
                margin: 1rem 0;
                line-height: 1.3;
                font-weight: 300;
                font-size: 0.9rem;
            }
            img {
                width: 100%;
            }
            .vector {
                width: 5rem;
                top: -1rem;
                position: absolute;
                right: 0;
            }
        }

        .list-of-details {
            height: 100%;
            article {
                border-bottom: 1px solid rgba(128, 128, 128, 0.272);
                padding-bottom: 2rem;
                padding: 1rem 0;
                &:nth-child(3) {
                    border: none;
                }
                img {
                    width: 2rem;
                }
                h5 {
                    font-weight: 600;
                    margin-left: 0.6rem;
                    font-size: 1.1rem;
                }
                p {
                    margin-top: 0.5rem;
                    font-weight: 300;
                    line-height: 1.3;
                    font-size: 0.9rem;
                }
            }
        }
    }
}

.window-install {
    background: linear-gradient(#00b679e1),
        url("/themes/default/assets/bg2.png") no-repeat;
    background-position: center;
    background-size: cover;
    height: 6rem;
    margin-top: -1rem !important;
    padding-top: 8rem;
    padding-bottom: 1rem;
    .content {
        height: fit-content;
        text-align: center;
        color: white;
        /* margin-top: 2rem; */
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        h4 {
            font-size: 3.5rem;
            font-weight: 600;
            margin-bottom: 1rem;
            margin-top: -4rem !important;
        }
        p {
            font-size: 1.5rem;
            font-weight: 600;
        }
    }

    form {
        width: 80%;
        height: fit-content;
        margin-bottom: 3rem;
        margin: auto;
        position: relative;
        bottom: -1rem !important;
        label {
            font-size: 1.3rem;
            font-weight: 600;
            color: white;
            text-align: center;
            margin: auto;
            display: block;
            margin-bottom: 1.5rem;
        }
        .input-sec {
            border: 5px solid white;
            border-radius: 2.8rem;
            margin-top: 1.7rem;
            background-color: white;
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        }
        input {
            border: none;
            background: none;
            outline: none;
            width: 73%;
            padding: 1.4rem 0.7rem;
            font-family: "Poppins";
            color: rgba(128, 128, 128, 0.417);
            font-size: 1rem;
        }
        input::placeholder {
            font-size: 1rem;
            color: rgba(128, 128, 128, 0.693);
            /* letter-spacing: 0.1rem; */
        }
        .checknow-btn {
            border: none;
            background: none;
            background-color: #021228;
            color: white;
            border-radius: 2.8rem;
            padding: 1rem 0.4rem;
            width: 30%;
            font-size: 1rem;
            font-weight: 600;
            font-family: "Poppins";
            cursor: "pointer";
            span,
            img {
                display: block;
            }
            img {
                width: 1.5rem;
                margin-left: 1rem;
            }
        }
    }

    .below-search-bar {
        width: 50%;
        margin: auto;
        position: relative;
        margin-top: 2rem;
        .below-form-img-1 {
            display: none;
        }
        img {
            width: 20rem;
            display: block;
            margin: auto;
        }
    }
}

.how-its-work {
    .inside-how-its-work {
        width: 85%;
        margin: 0rem auto;
        display: grid;
        margin-top: 8rem;
        grid-template-columns: repeat(2, 1fr);
        /* grid-gap: 3rem; */
        padding: 1.5rem 0;
        .article1 {
            background: url(/themes/default/assets/img6.png) no-repeat;
            background-position: center;
            background-size: cover;
            /* height: 30rem; */
        }
        .article2 {
            padding: 4rem 4rem;
            color: white;
            position: relative;
            background: linear-gradient(110deg, #113d61 0.32%, #00022c 133.62%);
            h4 {
                font-size: 2rem;
                font-weight: 600;
            }
            .each-questionaire {
                margin-top: 2rem;
                width: 98%;
                h6 {
                    font-size: 3rem;
                    width: 4rem;
                    height: 2rem;
                    border-radius: 50%;
                    background-color: #072136;
                }
                p {
                    font-size: 1.1rem;
                    line-height: 1.5;
                    font-weight: 600;
                    margin-bottom: 0.3rem;
                }
                span {
                    line-height: 1.5;
                    font-weight: 300;
                    font-size: 0.9rem;
                }
            }
            .vector {
                position: absolute;
                top: -3rem;
                right: -1.5rem;
                width: 6rem;
            }
        }
        .article3 {
            margin-top: 2rem;
            height: 25rem;
            h5 {
                font-size: 1.4rem;
                color: #00022c;
                font-weight: 600;
            }
            p {
                font-weight: 600;
                width: 80%;
                font-size: 0.9rem !important;
                margin-top: 2rem !important;
            }
            span {
                font-weight: 300;
                line-height: 1.3;
                display: block;
                margin-top: 0.3rem;
            }
        }
        .article4 {
            background: url(/themes/default/assets/img7.png) no-repeat;
            background-position: center;
            background-size: contain;
            margin-top: 2rem;
        }
    }
}

.bottom-form-sec {
    background-color: #00b67a;
    padding: 2rem;
    padding-bottom: 1rem;
    .container {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        form {
            width: 60%;
            height: fit-content;
            margin-bottom: 2rem;
            label {
                font-size: 1.6rem;
                font-weight: 600;
                color: white;
                text-align: center;
                margin: auto;
                display: block;
                margin-bottom: 1.5rem;
            }
            .input-sec {
                border-radius: 2.2rem;
                margin-top: 0.5rem;
                background-color: white;
            }
            input {
                border: none;
                background: none;
                outline: none;
                width: 73%;
                padding: 1.5rem 0.7rem;
                font-family: "Poppins";
                font-size: 1rem;
            }
            input::placeholder {
                font-size: 1rem;
                color: rgba(128, 128, 128, 0.376);
            }
            .checknow-btn {
                border: none;
                background: none;
                background-color: #021228;
                color: white;
                border-radius: 2.2rem;
                padding: 1rem 0.4rem;
                width: 30%;
                font-family: "Poppins";
                cursor: "pointer";
                font-weight: 600;
                font-size: 1rem;
                span,
                img {
                    display: block;
                }
                img {
                    width: 1.5rem;
                    margin-left: 1rem;
                }
            }
        }
    }
}

.footer {
    .above-footer {
        margin: 2rem 0;
        a {
            display: block;
            width: fit-content;
            margin: auto;
            padding: 0.9rem 1.7rem;
            border-radius: 0.5rem;
            color: white;
            background: linear-gradient(92deg, #9399ff 0%, #28a3e0 122.47%);
        }
        span {
            width: 50%;
            margin: auto;
            display: block;
            font-size: 0.8rem;
            text-align: center;
            margin-top: 1rem;
            line-height: 1.4;
            small {
                color: #00b67a;
            }
        }
    }

    .bottom-footer {
        background-color: #d4ebed;
        padding: 1rem 0;
        ul {
            width: 30%;
            margin: auto;
            li {
                a {
                    font-size: 0.7rem;
                }
            }
        }
    }
}

.our-blog {
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    text-wrap: noWrap;
}

.our-blog:hover {
    color: #00db93;
}

@media screen and (max-width: 2180px) {
    html {
        /* font-size: 18px; */
    }
    .bottom-global-search {
        min-height: 25rem !important;
    }
    form {
        bottom: 1rem !important;
    }
}
@media screen and (max-width: 1930px) {
    html {
        /* font-size: 18px; */
    }
    .bottom-global-search {
        min-height: 20rem !important;
        form {
            bottom: -1rem !important;
        }
    }
}

@media screen and (max-width: 1850px) {
    .bottom-global-search {
        min-height: 20rem !important;
        form {
            bottom: -1rem !important;
        }
    }
}
@media screen and (max-width: 1600px) {
    .bottom-global-search {
        min-height: 20rem !important;
        form {
            bottom: 0rem !important;
        }
    }
}

@media screen and (max-width: 1480px) {
    .bottom-global-search {
        min-height: 20rem !important;
        form {
            bottom: 0.3rem !important;
        }
    }
}

.fade {
    animation: fadeEffect 0.6s ease;
}

@keyframes fadeEffect {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
