style.css

/* Shared styles */
body {
    font-family: 'Inter', sans-serif;
    line-height: 1.6;
}

.timeline-item {
    position: relative;
    padding-left: 60px;
}

.timeline-dot {
    position: absolute;
    left: -8px;
    top: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #7c3aed;
    z-index: 10;
}

.filter-btn.active {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.card-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

@media (max-width: 768px) {
    .timeline-line {
        left: 30px !important;
    }
    
    .timeline-item {
        padding-left: 50px;
    }
}