.at-articleContainer.--light .articleTitle,
.at-articleContainer.--light .at-articleContainer__article:not(:has(form)),
.at-articleContainer.--light a[class*='more'] /** This selector is guessing that a link with the word 'more' in the classname is a 'read more' link and should be made white. */ {
    color: var(--baseLight100);
}

.at-articleContainer__article > :where(.Article, .Form) {
    margin-block: 0;
}

.at-articleContainer__article > :where(.Article, .Form):not(.--hasBackground) {
    padding-inline: 0;
}

.at-articleContainer__article.--equalHeight > :where(.Article, .Form) {
    height: 100%;
}

.--block .at-articleContainer__articles {
    display: flex;
    flex-direction: column;
    gap: var(--marginLarge);
}

.showColumnsAsCards .at-articleContainer__article {
    padding-block: clamp(1.25rem, 6vw, 5rem);
    padding-inline: clamp(1.25rem, 6vw, 6.75rem);
    box-shadow: var(--boxShadowWithBorder);
    border-radius: var(--borderRadiusExtraSmall);
}

@container (min-width: calc(256px * 2 + 2rem)) {
    .at-articleContainer__articles.--wideSmall {
        grid-template-columns: 1fr .5fr;
    }

    .at-articleContainer__articles.--smallWide {
        grid-template-columns: .5fr 1fr;
    }
}