.block-styled-list .grid{grid-template-columns: 4fr 5fr; grid-gap: 12rem;}

.block-styled-list .grid h1, .block-styled-list .grid h2, .block-styled-list .grid h3, .block-styled-list .grid h4, .block-styled-list .grid h5, .block-styled-list .grid h6{color: var(--accent-color);}

.block-styled-list .col.list{display: grid; grid-gap: 1.5rem;}

.block-styled-list .col.list .item{display: grid; grid-template-columns: 30px 1fr; grid-gap: 4rem; row-gap: 2rem;}

.block-styled-list .col.list .line-wrapper{display: flex; flex-direction: column; align-items: center; grid-gap: 1.5rem; padding-top: 0.5rem;}

.block-styled-list .col.list .line-wrapper .dot, .block-styled-list .col.list .line-wrapper .last-dot{width: 2.5rem; height: 2.5rem; display: block; border-radius: 100%; background-color: var(--accent-color); flex: none;}

.block-styled-list .col.list .line-wrapper .line{width: 5px; height: 100%;}
.block-styled-list .col.list .line-wrapper .line .line-fill{width: 100%; height: 0%; background-color: var(--accent-color); opacity: 0.6;}

.block-styled-list .col.list .item:last-child .line-wrapper{max-height: 75%;}
.block-styled-list .col.list .item:last-child .line-wrapper .line, .block-styled-list .col.list .item .line-wrapper .last-dot{display: none;}

.block-styled-list .col.list .item:first-child:last-child .line-wrapper .line, .block-styled-list .col.list .item:first-child:last-child .line-wrapper .last-dot{display: block;}

.block-styled-list .col.list .content{padding-bottom: 2rem;}

@media(max-width: 768px){
    .block-styled-list .grid{grid-gap: 4rem;}
}