body {
    & > .articles-list {
        display:grid;
        grid-auto-rows:max-content;
        grid-gap:0.625rem;

        & > * {
            display:grid;
            grid-auto-rows:max-content;
            padding:0.5rem;
            border-radius:0.25rem;
            background-color:hsl(226, 26%, 14%);

            & > a {
                justify-self:center;

                & > img {
                    border:2px solid hsl(226, 18%, 40%);
                }
            }

            & > :last-child {
                padding:0.375em;
                justify-self:end;
            }
        }
    }
}

@media all and (min-width: 736px) {
    body > .articles-list > * {
        grid-column-gap:1rem;
        grid-auto-rows:initial;
        grid-template-columns:max-content 1fr;
        grid-template-rows:max-content 1fr max-content;

        & > :first-child {
            grid-row:1/-1;
            align-self:start;
        }
    }
}