.wpb-footer { background-color: #fff; padding-top: 3.2rem;

    .wpb-footer__main { padding-bottom: 3.2rem;
        .container { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3.2rem; }

        .wpb-footer__company-info {
            .footer-logo { width: 18rem; height: auto; }
            .wpb-cta-content { margin-top: 3.2rem; align-items: start; }
            .wpb-footer__text { margin-top: 3.2rem;
                strong { display: block; font-size: 1.8rem; margin-bottom: 1rem; font-weight: 600; }
                ul { list-style: none; opacity: .8;
                    li a:hover { text-decoration: underline; }
                    + ul { margin-top: 1em; }
                }
            }
        }

        .wpb-footer__links { display: grid; grid-template-columns: repeat(var(--gc, 1), minmax(0, 1fr)); gap: 3.2rem;
            .wpb-footer__menu { 
                .footer-menu__title { display: block; font-size: 1.8rem; font-weight: 600; margin-bottom: 1rem; }
                ul { list-style: none; 
                    li {
                        a { display: block; opacity: .8;
                            &:hover { text-decoration: underline; }
                        }

                        + li { margin-top: 1em; }
                    }
                }
            }
        }

        .wpb-footer__socials { margin-top: auto;
            strong { display: block; font-size: 1.8rem; margin-bottom: 1rem; font-weight: 600; }
            .wpb-social-media { gap: .6rem;
                a { --size: 4rem; border: 1px solid var(--clr-border); color: var(--clr-text);
                    &:hover { background-color: var(--clr-red); color: #fff; border-color: var(--clr-red); }
                }
            }
        }

        .wpb-footer__newsletter { 
            h3 { display: block; font-size: 1.8rem; margin-bottom: 1rem; font-weight: 600; }
            p { opacity: .8; }
            .newsletter { margin-top: 1em;
                .form-group { display: grid; grid-template-columns: 1fr auto; align-items: center; padding-right: .5rem; background-color: var(--clr-light); border-radius: .6rem; }
                [type="email"] { background-color: var(--clr-light); padding-right: 1.6rem!important;
                    &::placeholder { color: var(--clr-text-grey); }
                }
                button { position: static; border-radius: .6rem; background-color: var(--clr-red); width: auto; padding: 0 2rem; color: #fff; font-weight: 600; color: #fff; }
            }
        }
    }

    .wpb-footer__bottom { font-size: 1.3rem; opacity: .8; border-top: 1px solid var(--clr-border); padding: 3.2rem 0;  
        .container { display: flex; flex-direction: column; align-items: center; gap: 2rem; }
        .copyright {}

        ul { list-style: none; display: flex; flex-wrap: wrap; gap: 1.6rem; justify-content: center;
            a:hover { text-decoration: underline; }
        } 

        .by-wux { display: inline-flex; align-items: center; column-gap: .2em;
            .by-wux__text { display: inline-block; }
            .by-wux__image { display: inline-block; width: 4.4rem; height: 1.3rem; }
        }
    } 

    @media (min-width: 768px) {
        .wpb-footer__main { 
            .wpb-footer__links { --gc: 2; }   
        }

        .wpb-footer__bottom { 
            .container { flex-direction: row; justify-content: start; }
            .by-wux { margin-left: auto; }
        }
    }

    @media (min-width: 992px) {
        padding-top: 4.8rem;

        .wpb-footer__main { padding-bottom: 4.8rem;
            .container { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); row-gap: 1rem; }
        }

        .wpb-footer__bottom { 
            .container, ul { column-gap: 3.2rem; }
        }
    }

    @media (min-width: 1200px) {
        padding-top: 6.4rem;

        .wpb-footer__main { padding-bottom: 6.4rem; 
            .container { column-gap: 6.4rem; }
            .wpb-footer__links { --gc: 3; } 
        }
    }

    @media (min-width: 1400px) {
        padding-top: 10rem;

        .wpb-footer__main { padding-bottom: 8rem; 
            .container { column-gap: 8rem; grid-template-columns: minmax(0, 44rem) minmax(0, 1fr); }
        }
    }
}