.footer {
    // overflow: hidden;
    background-color: $white;
    position: relative;
    &-container {
        .footer-top {
            display: grid;
            grid-template-columns: 0.5fr 1fr 0.5fr;
            align-items: center;
            grid-gap: 24px;
            @media (max-width: 992px) {
                grid-template-columns: 1fr;
            }
            .footer-left {
                position: relative;
                z-index: 0;
                @media (max-width: 992px) {
                    text-align: center;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }
                img {
                    width: 100%;
                    height: auto;
                    display: block;
                    margin-bottom: -70px;
                    margin-top: -50px;
                    @media (max-width: 992px) {
                        margin-top: 0;
                        max-width: 200px;
                    }
                }
                @media (max-width: 992px) {
                    order: 2;
                }
            }
            .footer-center {
                display: flex;
                flex-direction: column;
                align-items: center;
                text-align: center;
                @media (max-width:992px){
                    padding-top: 20px;
                }
                .footer-brand {
                    img {
                        width: 100%;
                        height: auto;
                        max-width: 180px;
                    }
                }
                .footer-description {
                    margin-top: 24px;
                    color: rgba(145, 149, 158, 0.6);
                }
            }
        }
    }
    .footer-bottom {
        background-color: $primary;
        padding-top: 16px;
        padding-bottom: 16px;
        position: relative;
        z-index: 1;
        margin-top: 20px;
        .container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            @media (max-width: 768px) {
                flex-direction: column;
                text-align: center;
                align-items: center;
            }
            .footer-left {
                p {
                    color: $white;
                }
            }
            .footer-right {
                display: flex;
                align-items: center;
                @media (max-width: 768px) {
                    margin-top: 16px;
                }
                a {
                    color: $white;
                    margin-left: 8px;
                }
            }
        }
    }
}