.steps-block {
    list-style: none;
    margin: 0 !important;
    padding: 0 !important;
    counter-reset: step;


    .steps-block__item {
        display: flex;
        align-items: center;
        padding: 1.5rem;
        margin-bottom: 1.5rem;
        position: relative;
        counter-increment: step;
    }

    .steps-block__icon-wrapper {
        margin-right: 2rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        flex-shrink: 0;
    }

    .steps-block__icon {
        background: var(--global-palette7);
        width: 80px;
        height: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        font-size: 24px;
        z-index: 1;
        position: relative;
    }

    i::before {
        color: var(--global-palette3);
        font-size: 3rem;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }

    .steps-block__line {
        position: absolute;
        top: 50%;
        left: 62px;
        width: 5px;
        height: calc(100% + 1.5rem);
        background: var(--global-palette7);
        z-index: 0;
    }

    .steps-block__item:last-child .steps-block__line {
        display: none;
    }

    .steps-block__content {
        flex: 1;
    }

    .steps-block__title {
        font-weight: 600;
        font-size: 1.3rem;
        margin: 0 0 1rem;
        color: var(--global-palette3);
        display: inline;
        align-items: baseline;
    }

    .steps-block__title::before {
        content: counter(step) ".";
        font-weight: 700;
        color: var(--global-palette3);
        margin-right: 4px;
        text-wrap: nowrap;
    }

    .steps-block__desc {
        margin: 0;
        color: var(--global-palette5);
        font-size: 1.1rem;
    }

    a {
        text-decoration: underline;
        color: var(--global-palette4) !important;
    }

    a:hover {
        color: var(--global-palette-highlight) !important;
    }

    .steps-block__icon--highlight {
        background: var(--global-palette-highlight);
    }

    .steps-block__line--highlight {
        background: var(--global-palette-highlight);
    }

    @media (max-width: 600px) {
        .steps-block__item {
            padding: 0;
        }

        .steps-block__line {
            left: 38px;
        }

        .steps-block__icon-wrapper {
            margin-right: 1.5rem;
        }

        .steps-block__line {
            left: 26px;
            height: calc(100% + 1.5rem);
        }

        .steps-block__icon {
            width: 56px;
            height: 56px;
        }

        i::before {
            font-size: 2.5rem;
        }
    }
}