/* Projects timeline */
.projects-timeline { position: relative; display: grid; gap: 1.1rem; padding-left: 56px; }
.projects-timeline::before { content: ""; position: absolute; left: 22px; top: 0; bottom: 0; width: 2px; background: var(--border); border-radius: 999px; }

/* Project card */
.proj-card { position: relative; border: 1px solid var(--border); border-radius: 16px; padding: 1rem; background: var(--card);
  box-shadow: inset 4px 0 0 var(--proj-accent, var(--accent)), inset 0 0 0 1.5px color-mix(in srgb, var(--proj-accent, var(--accent)) 22%, transparent);
}
.proj-card:hover { transform: translateY(-2px); transition: transform 160ms ease, box-shadow 160ms ease; box-shadow:
  inset 4px 0 0 color-mix(in srgb, var(--proj-accent, var(--accent)) 60%, transparent),
  inset 0 0 0 2px color-mix(in srgb, var(--proj-accent, var(--accent)) 38%, transparent), 0 10px 24px rgba(0,0,0,0.08); }

.proj-dot { position: absolute; left: -35px; top: 22px; width: 12px; height: 12px; border-radius: 50%; background: var(--proj-accent, var(--accent)); border: 2px solid #fff; box-shadow: 0 0 0 2px var(--border); }
.proj-head { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; color: var(--muted); margin-bottom: 0.25rem; }
.proj-title { margin: 0.15rem 0; }
.proj-meta { color: var(--muted); font-size: 0.95rem; }
.proj-summary { color: var(--muted); margin-top: 0.35rem; }

/* Links in projects should appear as regular text color (not red) */
.proj-card a { color: var(--text); text-decoration: none; }
.proj-card a:hover { text-decoration: underline; }

.badge { display: inline-block; font-size: 0.75rem; padding: 0.15rem 0.5rem; border-radius: 999px; border: 1px solid var(--border); background: var(--border); color: var(--muted); }
.badge.role { background: #f5f3ff; border-color: #ddd6fe; color: #5b21b6; }
.badge.status.ongoing { background: #ecfeff; border-color: #a5f3fc; color: #155e75; }
.badge.status.completed { background: #f1f5f9; border-color: #cbd5e1; color: #334155; }
.badge.dura { background: #f8fafc; border-color: #e2e8f0; color: #334155; }

/* Roles (accent suggestions)
   .pi   -> default accent (red)
   .cop  -> purple/green etc if needed via inline --proj-accent
*/