/* Initial hidden state */
.timeline-item {
    opacity: 0;
    transition: 
        opacity 0.8s ease,
        transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Left items start slightly from left */
.timeline-item.left {
    transform: translateX(-40px);
}

/* Right items start slightly from right */
.timeline-item.right {
    transform: translateX(40px);
}

/* When visible */
.timeline-item.show {
    opacity: 1;
    transform: translateX(0);
}

/* Optional: smoother on mobile */
@media (max-width: 768px) {
    .timeline-item.left,
    .timeline-item.right {
        transform: translateY(40px);
    }

    .timeline-item.show {
        transform: translateY(0);
    }
}