.featured-numbers .element {
    -webkit-grid-column: span 4;
    grid-column: span 4;
    padding-bottom: 100%;
    position: relative;
    border-radius: var(--border-radius);
    overflow: hidden;
}

.featured-numbers .element img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
}

.featured-numbers .element .number {
    position: absolute;
    top: var(--padding-general);
    left: var(--padding-general);
    font-size: 7.5rem;
    line-height: 6.5rem;
    z-index: 1;
}

.featured-numbers .element .text {
    z-index: 1;
    position: absolute;
    left: var(--padding-general);
    bottom: var(--padding-general);
}

/* RESPONSIVE */
@media only screen and (max-width: 740px) {
    .featured-numbers {
        padding-right: calc(100vw * 21 / var(--page-width));
        padding-left: calc(100vw * 21 / var(--page-width));
    }

    .featured-numbers .grid12 {
        -webkit-grid-gap: calc(100vw * 24 / var(--page-width));
        grid-gap: calc(100vw * 24 / var(--page-width));
    }

    .featured-numbers .element {
        -webkit-grid-column: span 12;
        grid-column: span 12;
    }
}