.footer {
    padding-top: 224px;

    .footer__logo {
        width: 100%;
        height: auto;

        img {
            width: 100%;
        }
    }

    .footer__content {
        width: 100%;
        margin-top: -8vw !important;

        .footer__content__about {
            gap: 64px;
            margin-top: -7vw;

            & > div {
                padding-top: 24px;

                p.has-p-xs-font-size {
                    letter-spacing: 3px;
                }

                p.has-h-1-font-size {
                    letter-spacing: -1px;
                }
            }

        }

        .footer__content__about__social {
            a {
                text-decoration: none;
                border-bottom: 1px solid transparent;
                transition: all .4s ease-in-out;
                letter-spacing: -0.5px;

                &:hover {
                    border-color: var(--wp--preset--color--light-grey);
                }
            }
        }
        
        .has-h-1-font-size {
            margin-top: 16px;
            margin-bottom: 32px;
        }
    }

    .scrolledHorizontal {
        width: 100%;
    }

    .wp__form {
        width: 100%;
    }

    .footer__form {
        display: flex;
        max-width: 100%;

        input[type="email"] {
            width: 100%;
            padding: 64px;
            font-size: 120px;
            background-color: var(--wp--preset--color--primary);
            color: var(--wp--preset--color--dark-green);
            font-weight: 700;
            border: none;

            &::placeholder {
                color: var(--wp--preset--color--black-text);
                opacity: 10%;
            }

        }

            input:-webkit-autofill,
            input:-webkit-autofill:hover,
            input:-webkit-autofill:focus,
            input:-webkit-autofill:active {
                box-shadow: 0 0 0 1000px var(--wp--preset--color--primary) inset;
                -webkit-text-fill-color: var(--wp--preset--color--dark-green); /* zmień na ciemny, jeśli masz jasne tło */
                transition: background-color 9999s ease-in-out 0s;
            }
        
        input[type="submit"] {
            color: transparent;
            background-image: url("../../images/blackArrow.png");
            background-size: 105px;
            background-repeat: no-repeat;
            background-position: center;
            width: 266px;
            height: 266px;
            aspect-ratio: 1/1;
            border: none;
            background-color: rgba(182, 204, 0, 1);
            cursor: pointer;
        }
    }
}

/* :where(.footer .is-layout-flex) {
    gap: 0 !important;
} */

@media only screen and (max-width: 1200px) {
    .footer {

       .footer__form {
            input[type="email"]{
                padding: 48px;
                font-size: 64px;
            }

            input[type="submit"] {
                width: 170px;
                height: 170px;
                background-size: 60px;
            }
        }
    }    
}

@media only screen and (max-width: 900px) {

   .footer {

        .footer__content {

            .footer__content__about {
                padding-left: 32px;
                padding-right: 32px;
                margin-top: 0;
                gap: 32px;

                p {
                    br {
                        display: none;
                    }
                }
            }
        }

        .footer__form {
            input[type="email"]{
                padding: 32px;
                font-size: 48px;
            }

            input[type="submit"] {
                width: 138px;
                height: 138px;
                background-size: 40px;
            }
        }

    }

 

}

@media only screen and (max-width: 576px) {
    .footer {
        padding-top: 164px;

        .footer__content {

            .footer__content__about {
                flex-direction: column;
                align-items: flex-start;
                gap: 0;

                & > figure {
                    margin-top: -40px;
                    img {
                        width: 140px;
                    }
                }
            }
        }

        .scrolledHorizontal {
            padding-top: 96px;
        }

        .footer__content__about__social {
            gap: 12px;
        }
        
        
        .footer__form {
            input[type="email"]{
                font-size: 30px;
                padding-right: 8px;
            }

            input[type="submit"] {
                width: 102px;
                height: 102px;
                background-size: 28px;
            }
        }
    }
}