.conteudo {
    & .interface {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 1rem;

        & h2 {
            font-size: 3rem;
            text-align: center;

            & span {
                color: var(--azul);
            }
        }

        & p {
            font-size: 1.5rem;
            text-align: center;
        }

        & .container-jogos {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 1rem;
            flex-wrap: wrap;

            & a {
                display: flex;
                flex-direction: column;
                border-radius: .5rem;
                border: 2px solid var(--cinza-borda);
                width: 18rem;
                height: 16rem;
                text-decoration: none;
                color: #000;
                overflow: hidden;
                transition: .2s ease all;

                & img {
                    height: 9rem;
                    object-fit: cover;
                    object-position: center;
                }

                & .txt-jogo {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: space-between;
                    gap: .3rem;
                    padding: 1rem;
                    height: 8rem;

                    & h2 {
                        font-size: 1.5rem;
                    }

                    & button {
                        width: 100%;
                        padding: .3rem;
                        font-size: 1rem;
                        border: none;
                        border-radius: .5rem;
                        background: var(--azul-degrade);
                        color: #fff;
                        cursor: pointer;
                    }
                }

                &:hover {
                    transform: scale(1.05);
                    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
                }
            }
        }
    }
}

/* Para celulares (abaixo de 600px ) */
@media screen and (max-width: 600px) {
    .conteudo {
        & .interface {
            & h2 {
                font-size: 2.5rem;
            }

            & p {
                font-size: 1.3rem;
            }

            .container-jogos {
                & a {
                    width: 100%;
                }
            }
        }
    }
}