.produtos {
    padding: 80px 10px;
}

.produtos-grid {
    display: grid;
    gap: 50px;

    .btn {
        margin: 0 auto;
    }
}

.produtos-title {
    display: grid;
    gap: 15px;
    max-width: 530px;

    h2 {
        @include font(36, 400, 1.2em);
    }

    span {
        display: block;
        width: 150px;
        height: 3px;
        background-color: var(--dark);
    }

    p {
        font-size: rem(20);
    }

    @media only screen and (max-width: 400px) {
        h2 {
            @include font(26, 400, 1.2em);
        }

        p {
            font-size: rem(16);
        }
    }
}

.produtos-content {
    @include flex(15px 40px);
    flex-wrap: wrap;
    max-width: 550px;
    margin: 0 auto;
    font-size: rem(20);

    a {
        img {
            transition: .3s;
        }

        &:hover {
            img {
                box-shadow: 0 0 5px 1px var(--dark);
            }
        }
    }


}