section {
    background: var(--background);
}

.cards-container {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.cards-container article {
    box-shadow: var(--medium-shadow);
    border-radius: var(--medium-radius);
    overflow: hidden;
    background: var(--white);
    display: flex;
    flex-direction: column;
}

.cards-container article img {
    height: 200px;
}

.cards-container article div {
    padding: 20px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.cards-container article p {
    margin: 10px 0 20px 0;
}

.cards-container article a {
    width: 100%;
    margin-top: auto;
}


    /* Pad Version */
    @media screen and (min-width: 768px) {
        h1,
        .intro {
            text-align: center;
        }

        .cards-container {
            flex-direction: row;
            flex-wrap: wrap;
            gap: 20px;
            justify-content: center;
        }

        .cards-container article {
            width: calc(50% - 10px);
        }

        .cards-container article img {
            height: 225px;
        }

        .cards-container article p {
            margin: 10px 0 25px 0;
        }
    }


        /* Desktop Version */
        @media screen and (min-width: 992px) {
            .intro {
                max-width: 1000px;
                margin-left: auto;
                margin-right: auto;
            }

            .cards-container {
                max-width: 1000px;
                margin: 0 auto;
            }

            .cards-container article {
                width: calc(50% - 10px);
            }

            .cards-container article img {
                height: 250px;
            }

            .cards-container article p {
                margin: 10px 0 30px 0;
            }
        }