.elementor-145352 .elementor-element.elementor-element-4f6b776d{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-39b3857 *//* UPDATED: The Timeline Item with Animation States */
.changelog-item {
    display: flex;
    gap: 30px;
    margin-bottom: 60px;
    position: relative;
    border-left: 3px solid #e0e0e0;
    padding-left: 30px;
    
    /* Animation Initial State (Hidden & Lower) */
    opacity: 0;
    transform: translateY(50px); /* Starts 50px lower */
    transition: opacity 0.8s ease-out, transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: opacity, transform; /* Optimization for smoother rendering */
}

/* The class JavaScript will add when the item is on screen */
.changelog-item.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Keep the rest of your CSS the same as before... *//* End custom CSS */