.technology-rail {
    --rail-number-width: 94px;
    --rail-axis-x: 106px;
    position: relative;
    left: -20px;
    padding: 8px 0
}

.technology-rail .rail-line {
    left:14%;
    top: 39px;
    bottom: 39px
}

.technology-rail article {
    display: grid;
    grid-template-columns: var(--rail-number-width) 14px minmax(0, 1fr);
    column-gap: 36px;
    align-items: center;
    padding: 30px 0;
    border-bottom: 1px solid #dbe2eb
}

.technology-rail article:before {
    left: calc(var(--rail-axis-x) - 7px);
    top: calc(50% - 7px);
    z-index: 1
}

.technology-rail .rail-mark {
    grid-column: 1;
    grid-row: 1 / span 3;
    margin: 0;
    color: #17243a;
    font-size: 36px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1.8px;
    text-align: left
}

.technology-rail h3 {
    grid-column: 3;
    margin: 0;
    font-size: 28px;
    line-height: 1.2
}

.technology-rail p {
    grid-column: 3;
    margin: 7px 0 0;
    font-size: 15px
}

.technology-rail small {
    grid-column: 3;
    margin-top: 7px
}

@media(max-width:999px) {
    .technology-rail {
        --rail-number-width: 56px;
        --rail-axis-x: 73px;
        left: 0;
        padding: 4px 0
    }

    .technology-rail .rail-line {
        left: 20.3%;
        top: 34px;
        bottom: 34px
    }

    .technology-rail article {
        grid-template-columns: var(--rail-number-width) 14px minmax(0, 1fr);
        column-gap: 16px;
        padding: 23px 0
    }

    .technology-rail article:before {
        left: calc(var(--rail-axis-x) - 7px)
    }

    .technology-rail .rail-mark {
        font-size: 27px
    }

    .technology-rail h3 {
        font-size: 22px
    }

    .technology-rail p {
        font-size: 14px
    }

    .technology-rail small {
        font-size: 11px
    }
}