footer.site-footer {
    background-color: var(--wp--preset--color--dark-green);

    * {
        font-family: var(--wp--preset--font-family--bnpp-sans);
        color: var(--wp--preset--color--white);
        font-weight: 300;
    }

    .bnp-collaps-disclaimer {

        .bnp-section {
            max-width: var(--wp--style--global--wide-size);
            width: 80%;
            margin: 0 auto;
            position: relative;
            padding: var(--wp--preset--spacing--70) 0;
            /* padding-left: 108px; */

            figure {
                display: none;
                position: absolute;
                top: var(--wp--preset--spacing--70);
                left: 0;
            }

            p:first-of-type {
                margin-top: 0;
            }

        }
    }

    .footer-top {

        padding: var(--wp--preset--spacing--60) 0;
        border-top: solid 2px #3D5252;

        .bnpp-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
            gap: var(--wp--preset--spacing--40);
        }

        .footer-col {

            display: grid;

            &.multiple-menus {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
                gap: var(--wp--preset--spacing--40);
            }
    
            .logo-and-tagline {
    
                img {
                    margin-bottom: var(--wp--preset--spacing--40);
                    max-width: 200px;
                }
                
            }
    
            h3 {
                font-family: var(--wp--preset--font-family--bnpp-sans);
                font-style: italic;
                font-size: var(--wp--preset--font-size--medium);
            }
        
            ul.footer-menu {
                list-style: none;
                padding: 0;
        
                li {
                    margin-bottom: var(--wp--preset--spacing--30);
                    &:last-child {
                        margin-bottom: 0;
                    }
       
                    a {
                        font-style: normal;
                        font-weight: 300;
                        text-decoration: none;
                  
        
                        &:hover {
                            color: #7DCBBA;
                            text-decoration-line: underline;
                            text-decoration-style: solid;
                            text-decoration-skip-ink: none;
                            text-decoration-color: #7DCBBA;

                            text-decoration-thickness: auto;
                            text-underline-offset: auto;
                            text-underline-position: from-font;
                        }
                    }
                }
            }

            ul.social-icons {
                display: flex;
                padding: 0;
                margin: 0;
                list-style: none;
                gap: var(--wp--preset--spacing--40);
                align-items: center;
                align-self: end;
                justify-self: end;
                
                path {
                    fill: #fff;
                    transition: 300ms;
                }

                li:hover {
                    path {
                        fill: var(--wp--preset--color--bnpp-green);
                    }
                    
                }
            }
    
        }

    }

    .footer-bottom {

        padding: var(--wp--preset--spacing--60) 0;
        border-top: solid 2px #3D5252;

        .bnpp-container {
            display: flex;
            gap: var(--wp--preset--spacing--40);
            align-items: center;
            justify-content: space-between;
        }

        p {
            margin: 0;
        }

        ul.footer-menu {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-wrap: wrap;
            gap: var(--wp--preset--spacing--40);
            align-items: center;
    
            li {
    
                a {
                    font-style: normal;
                    font-weight: 300;
                    text-decoration: none;
    
                    &:hover {
                        color: #7DCBBA;
                        text-decoration-line: underline;
                        text-decoration-style: solid;
                        text-decoration-skip-ink: none;
                        text-decoration-color: #7DCBBA;

                        text-decoration-thickness: auto;
                        text-underline-offset: auto;
                        text-underline-position: from-font;
                    }
                }
            }
        }

    }


}

body[data-language*="jp"],
body[data-language*="zh"] {

    footer.site-footer {

        .footer-top {
    
            .bnpp-container {
                grid-template-columns: 1fr 1fr;
            }

            .footer-col:not(.multiple-menus) {

                display: block;
                
                .social-icons {
                    justify-self: start;
                }
            }
        
        }

    }
}