/**
 * key-principles Block Styles
 */


/* Reset counter voor dit block */
.key-principles {
    counter-reset: principle-step;
}

/* Basis item styling */
.key-principles__item {
    position: relative;
    padding-top: 5rem;
}

/* Nummer-circle */
.key-principles__item::before {
    counter-increment: principle-step;
    content: counter(principle-step);

    position: absolute;
    top: 0;
    left: 0;
    margin-inline: auto;

    width: 50px;
    height: 50px;
    border-radius: 50%;

    background: var(--primary);
    color: white;

    display: flex;
    align-items: center;
    justify-content: center;

    font-family: "Gotham", serif;
    font-size: 2.5rem;
    font-variant-numeric: lining-nums tabular-nums;
}

.key-principles__title em {
    font-style: normal;
    color: var(--primary);
}