.highlighted-columned-content {
    padding: var(--size-6) 0;
}

@media screen and (max-width: 767px) {
    .highlighted-columned-content {
        padding: var(--size-9) 0 var(--size-2);
    }
}

.highlighted-columned-content .container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.highlighted-columned-content .highlights {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-direction: column;
}

@media screen and (max-width: 767px) {
    .highlighted-columned-content .highlights {
        gap: var(--size-5);
        background-color: var(--color-white);
        border-radius: var(--size-4);
        padding: var(--size-9) var(--size-4) var(--size-4);
    }
}

@media screen and (min-width: 768px) {
    .highlighted-columned-content .highlights {
        flex-direction: row;
        gap: var(--size-7);
    }
}

.highlighted-columned-content .highlight {
    position: relative;
    display: flex;
    justify-content: stretch;
    align-items: stretch;
}

@media screen and (max-width: 767px) {
    .highlighted-columned-content .highlight {
        justify-content: center;
        align-items: center;
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .highlighted-columned-content .highlight {
        margin-top: calc((var(--size-11) + var(--size-4)) / 2);
    }
}

@media screen and (min-width: 1024px) {
    .highlighted-columned-content .highlight {
        margin-left: calc((var(--size-11) + var(--size-4)) / 2);
        width: 100%;
    }
}

.highlighted-columned-content .highlight-content {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    z-index: 0;
}

.highlighted-columned-content .highlight-content h5.highlight-title {
    margin-bottom: var(--size-0);
    text-align: center;
}

.highlighted-columned-content .highlight-content .highlight-body p {
    font-size: var(--size-3);
    margin-bottom: var(--size-0);
}

.highlighted-columned-content .highlight-content a {
    text-decoration: underline;
}

@media screen and (max-width: 767px) {
    .highlighted-columned-content .highlight-content {
        align-items: center;
        text-align: center;
    }
}

@media screen and (min-width: 768px) {
    .highlighted-columned-content .highlight-content {
        background-color: var(--color-white);
        border-radius: var(--size-4);
        gap: var(--size-1);
        box-shadow: var(--box-shadow);
        padding: var(--size-10) var(--size-4) var(--size-4) var(--size-4);
        width: 100%;
        align-items: center;
        text-align: center;
    }
}

@media screen and (min-width: 1024px) {
    .highlighted-columned-content .highlight-content {
        padding: var(--size-2) var(--size-4) var(--size-2) var(--size-9);
        width: 100%;
        text-align: left;
        align-items: flex-start;
    }
}

.highlighted-columned-content .tick-mobile {
    position: absolute;
    display: block;
    filter: drop-shadow(var(--box-shadow));
    min-width: calc(var(--size-11) + var(--size-4));
    z-index: 10;
    left: 50%;
    top: 0;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    
    /* Fallback for aspect-ratio */
    width: calc(var(--size-11) + var(--size-4));
    height: calc(var(--size-11) + var(--size-4));
}

/* aspect-ratio supported browsers */
@supports (aspect-ratio: 1) {
    .highlighted-columned-content .tick-mobile {
        aspect-ratio: 1 / 1;
        width: auto;
        height: auto;
    }
}

@media screen and (min-width: 768px) {
    .highlighted-columned-content .tick-mobile {
        display: none;
    }
}

.highlighted-columned-content .tick {
    position: absolute;
    display: none;
    filter: drop-shadow(var(--box-shadow));
    min-width: calc(var(--size-11) + var(--size-4));
    z-index: 10;
    left: 0;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    
    /* Fallback for aspect-ratio */
    width: calc(var(--size-11) + var(--size-4));
    height: calc(var(--size-11) + var(--size-4));
}

/* aspect-ratio supported browsers */
@supports (aspect-ratio: 1) {
    .highlighted-columned-content .tick {
        aspect-ratio: 1 / 1;
        width: auto;
        height: auto;
    }
}

@media screen and (min-width: 768px) {
    .highlighted-columned-content .tick {
        display: block;
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .highlighted-columned-content .tick {
        left: 50%;
        top: 0;
    }
}
@media screen and (min-width: 1024px) {
    .highlighted-columned-content .highlight-content h5.highlight-title {
        text-align: left;
    }
}