.timeline{max-width:720px;position:relative;padding-left:40px}
.timeline::before{content:'';position:absolute;left:7px;top:0;bottom:0;width:1px;background:var(--border)}
.timeline-dot{position:absolute;left:0;top:6px;width:15px;height:15px;border-radius:50%;background:var(--accent);border:3px solid var(--bg-alt);box-shadow:0 0 0 2px var(--accent),0 2px 8px rgba(16,185,129,.3)}
.timeline-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;transition:all .3s}
.timeline-card:hover{border-color:var(--accent);box-shadow:var(--shadow-lg)}
.timeline-card h3{font-size:1.05rem;font-weight:700;margin-bottom:10px}
.timeline-meta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:14px;font-size:.8rem;color:var(--text-muted)}
.timeline-meta span{display:inline-flex;align-items:center;gap:5px}
.timeline-card ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.timeline-card li{font-size:.88rem;color:var(--text-secondary);display:flex;align-items:flex-start;gap:10px;line-height:1.55}
.timeline-card li::before{content:'';min-width:6px;min-height:6px;border-radius:50%;background:var(--accent);margin-top:7px}
@media(max-width:600px){
  .timeline{padding-left:30px}
  .timeline-card{padding:18px}
  .timeline-card h3{font-size:.95rem}
  .timeline-meta{gap:8px;font-size:.75rem}
  .timeline-card li{font-size:.82rem}
}