@media screen and (min-width: 321px) {
    /* Accueil */
    .accueil {
        img {
            height: 900px;
        }

        .cta-accueil {
            top: 40%;
            left: 30%;

            div {
                flex-direction: row;
            }
        }
    }

    /* Menus */

    .menu-accueil {
        .background-image {
            height: 50vw;
        }

        h2 {
            padding: 3rem 0 4rem 0;
        }

        .menu-article {
            display: flex;
            gap: 1rem;
            justify-content: center;

            article {
                a {
                    img {
                        width: 300px;
                        height: 300px;
                    }
                }
            }
        }

        margin-bottom: 3rem;
    }

    /* Infolettre/commentaire */
    .contact {
        flex-direction: row;
        width: 100%;

        .infolettre,
        .commentaire {
            width: 50%;
            margin: 0 0.5rem;
            border-bottom: 3px solid $bouton;
        }

        .infolettre {
            padding-right: 1rem;

            form {
                input {
                    width: 50%;
                    position: relative;
                    margin: 0 auto;
                }
            }
        }

        .separateur {
            margin-top: 2rem;
            display: flex;
        }

        .commentaire {
            justify-content: space-between;

            h3 {
                font-family: "amatic-sc";
                font-size: 5rem;
                padding-top: 2rem;
            }

            .message {
                justify-content: space-around;
                /* margin: 2rem 2rem 0; */
                p {
                    font-size: 1.5rem;

                    strong {
                        font-size: 2.5rem;
                    }
                }
            }

            .conteneur-commentaire {
                margin-bottom: 3rem;
            }
        }
    }
}
