/* Remove articleMargin from next article with background color */
.at-multiColumns.g-container--fullwidth + .at-multiColumns.g-container--fullwidth {
    margin-top: 0;
}

.at-multiColumns.g-container--fullwidth {
    padding-block: var(--marginLarge);
}

.at-multiColumns--lightblue {
    background-color: var(--primaryColor200);
}

.at-multiColumns--orange {
    background-color: var(--secondaryColor500);
}
at-multiColumns__item
.at-multiColumns__title {
    margin-bottom: 2.4rem;
}

.at-multiColumns__items {
    display: grid;
    grid-gap: var(--gutterLarge);
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    line-height: 1.8;
}

.at-multiColumns--blueTitles .at-multiColumns__itemTitle {
    color: var(--primaryColor500);
}

.at-multiColumns--orange .at-multiColumns__title,
.at-multiColumns--orange .at-multiColumns__item > * {
    color: var(--baseLight100);
}

.at-multiColumns__itemTitle {
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    overflow-wrap: break-word;
}

.at-multiColumns__image {
    display: block;
    width: 100%;
    max-width: 300px;
    margin-bottom: var(--marginSmall);
    order: -1;
    box-shadow: var(--dropShadowHeavy);
    background-color: var(--baseLight500);
}

/**
 * When column has an image, make the layout more mobile friendly
 */

@media (min-width: 375px) and (max-width: 645px) {
    .at-multiColumns__item.--hasImage {
        display: grid;
        grid-template-columns: 1fr 2fr;
        grid-template-rows: auto 1fr;
        gap: 0 var(--gutter);
    }

    .at-multiColumns__item.--hasImage .at-multiColumns__image {
        grid-column: 1/2;
        grid-row: 1/-1;
    }

    .at-multiColumns__item.--hasImage .at-multiColumns__itemTitle {
        grid-column: 2/-1;
        grid-row: 1/2;
    }

    .at-multiColumns__item.--hasImage .at-multiColumns__itemContent {
        grid-column: 2/-1;
        grid-row: 2/-1;
    }
}

/* at-multiColumns with background-color inside at-articlePicker */
.at-articlePicker .at-multiColumns.g-container--fullwidth {
    padding: var(--marginSmall);
    margin-inline: 0;
}