.custom-css-row-offers-line {
    position: relative;
    padding-left: 50px;
    /* min-height: 500px; */
}

.custom-css-row-offers-line::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 0;
    width: 4px;
    
    /* Updated start height */
    height: var(--scroll-height, 5%); 
    
    background-color: #3498db;
    /*border-radius: 2px;*/
    transform-origin: top;
    transform: scaleY(1);
    
    /* Keep it linear so it matches the scroll speed perfectly */
    transition: transform 0.4s ease, height 0.1s linear;
    pointer-events: none;
}

.custom-css-row-offers-line.is-visible::before {
    transform: scaleY(1);
}

/********************************************************************** 9 STEPS */
/********************************************************************** 9 STEPS */
/********************************************************************** 9 STEPS */
/********************************************************************** 9 STEPS */
.custom-css-row-offers-line-2 {
    position: relative;
    padding-left: 50px;
    /* min-height: 500px; */
}

.custom-css-row-offers-line-2::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 0;
    width: 4px;
    
    /* Updated start height */
    height: var(--scroll-height, 5%); 
    
    background-color: #3498db;
    /*border-radius: 2px;*/
    transform-origin: top;
    transform: scaleY(1);
    
    /* Keep it linear so it matches the scroll speed perfectly */
    transition: transform 0.4s ease, height 0.1s linear;
    pointer-events: none;
}

.custom-css-row-offers-line-2.is-visible::before {
    transform: scaleY(1);
}