.footer {
    background: hsl(226, 48%, 11%);
    padding: 7rem 5rem;
    margin-top: 10rem;

    .footer-heading {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 4rem;
        margin-bottom: 6.4rem;
        border-bottom: 0.7px solid #FFFFFF33;


        h1 {
            font-size: 50px;
            max-width: 43.4rem;
            line-height: 70px;
            font-weight: bold;
        }

        .btns {
            display: flex;
            width: fit-content;
            gap: 1.6rem;
        }
    }

    .footer-body {
        display: flex;
        align-items: start;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 4rem;

        p,
        a {
            font-size: 1.8rem;
            line-height: 3rem;
        }

        .logo-area {
            display: flex;
            gap: 2.4rem;
            flex-direction: column;

            a {
                margin-right: 2.4rem;
            }

            p {
                color: #FFFFFFB2;
                max-width: 232px;
            }
        }

        /* .quick-links { */
        ul {
            display: flex;
            flex-direction: column;
            gap: 2rem;
            color: #FFFFFFB2;
            margin-top: 4rem;

            svg {
                color: #FFFFFF;
                margin-right: .8rem;
            }
        }

        /* } */
    }

    .copyright {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 4rem;
        margin-top: 3rem;
        border-top: 0.7px solid #FFFFFF33;
        color: #FFFFFFB2 !important;

        a {
            text-decoration: underline;
            color: #FFFFFF !important;
        }
    }
}

@media (max-width: 768px) {
    .footer {
        padding: 5rem 2rem;
        margin-top: 6.4rem;

        .footer-heading {
            flex-direction: column;
            align-items: start;
            gap: 2rem;

            h1 {
                line-height: normal;
                font-size: 2.8rem;
            }
        }



        .footer-body {
            gap: 3rem;

            ul {
                margin-top: 2rem;
            }

            p,
            a {
                font-size: 1.6rem;
                line-height: normal;
            }
        }

        .copyright {
            flex-direction: column;
            align-items: center;
            gap: 2rem;
            text-align: center;
        }
    }
}

@media (min-width: 768px) and (max-width: 992px) {
    .footer {
        padding: 5rem 4rem;

        .footer-heading {

            h1 {
                font-size: 3.6rem;
                line-height: normal;
            }
        }
    }
}