.tile-list {
    background-color: #F7F7F7;
    padding-top: 50px;
    padding-bottom: 50px;
}

@media (min-width: 992px) {
    .tile-list {
        padding-top: 60px;
        padding-bottom: 70px;
    }
}

.tile-list--blue {
    background-color: #007DB9;
}

.tile-list--blue .tile-list__heading,
.tile-list--blue .tile-list__heading *,
.tile-list--blue .tile-list__top h1,
.tile-list--blue .tile-list__top h2,
.tile-list--blue .tile-list__top h3,
.tile-list--blue .tile-list__top h4,
.tile-list--blue .tile-list__top h5 {
    color: #F8B60D;
}

.tile-list--blue .tile-list__subheading,
.tile-list--blue .tile-list__subheading * {
    color: #FFFFFF !important;
}

.tile-list__top {
    width: 100%;
}

/* 1) Hide when the row has no element children (more robust than :empty) */
.tile-list__top:not(:has(> .row > *)) {
    display: none;
}

/* 2) When there IS content but NO headings anywhere inside the row */
.tile-list__top:has(> .row > *):not(:has(.row :is(h1, h2, h3, h4, h5))) {
    margin-bottom: 40px;
}

/* 3) When there IS a heading anywhere inside the row */
.tile-list__top:has(.row :is(h1, h2, h3, h4, h5)) {
    margin-top: -20px;
    margin-bottom: 20px;
}

.tile-list__items {
    display: flex;
    flex-wrap: wrap;
    gap: 34px;
    justify-content: center;
}

.tile-list__item {
    flex: 1 1 390px;
    max-width: 390px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    align-items: center;
    text-align: center;
}

.tile-list__image {
    width: 100%;
    height: 150px;
    object-fit: cover;
    display: block;
    margin-bottom: 44px;
}

.tile-list__items>.tile-list__item:only-child {
    margin-left: auto;
    margin-right: auto;
}

.tile-list__heading {
    font-size: 28px;
    font-weight: 500;
    line-height: 100%;
    color: #007DB9;
    margin-bottom: 20px;
}

.tile-list__subheading a {
    text-decoration: underline;
}

.tile-list__button {
    margin-top: 33px;
}