@import url("../icon-fonts/RemixIcons/fonts/remixicon.css");
@import url("../icon-fonts/feather/feather.css");
@import url("../icon-fonts/bootstrap-icons/icons/font/bootstrap-icons.css");
@import url("../icon-fonts/tabler-icons/iconfont/tabler-icons.css");
@import url("../icon-fonts/line-awesome/1.3.0/css/line-awesome.css");
@import url("../icon-fonts/boxicons/css/boxicons.css");
@import url("../icon-fonts/typicons/icons.css");

.img-vector {
    max-height: 175px;
}

.section-vector {
    position: relative;
}

/* Linha vertical central */
.section-vector::before {
    content: '';
    position: absolute;
    top: 79px;
    bottom: 0;
    left: 50%;
    width: 4px;
    background-color: rgb(85, 190, 197);
    transform: translateX(-50%);
    z-index: 1;
}

/* Pontos nas etapas */
.section-vector > .row > div:nth-child(2n+1) strong::before,
.section-vector > .row > div:nth-child(2n) strong::before {
    content: '';
    position: absolute;
    top: 10px; /* ajuste fino da altura */
    width: 16px;
    height: 16px;
    background-color: #00c6d3;
    border-radius: 50%;
    z-index: 2;
}

/* Posição dos pontos na esquerda */
.section-vector > .row > div.text-end strong {
    position: relative;
}
.section-vector > .row > div.text-end strong::before {
    right: -20px;
}

/* Posição dos pontos na direita */
.section-vector > .row > div.text-start strong {
    position: relative;
}
.section-vector > .row > div.text-start strong::before {
    left: -20px;
}