:root{ --radius:1rem }
html{ scroll-behavior:smooth }
.hero .hero-avatar{ max-height:320px; object-fit:cover }
.prose p{ margin-bottom:1rem }
.timeline{ position:relative; margin-left:1rem }
.timeline:before{ content:""; position:absolute; left:10px; top:0; bottom:0; width:2px; background:var(--bs-border-color); }
.timeline-item{ position:relative; margin-left:2rem; margin-bottom:1.5rem }
.timeline-dot{ position:absolute; left:-6px; top:12px; width:14px; height:14px; background:var(--bs-primary); border-radius:50%; box-shadow:0 0 0 4px color-mix(in srgb, var(--bs-primary) 20%, transparent) }
.card{ border-radius:var(--radius) }
img.rounded-4{ border-radius:calc(var(--radius) + .5rem)!important }
.object-fit-cover{ object-fit:cover }
.project{ transition:transform .2s ease, box-shadow .2s ease }
.project:hover{ transform:translateY(-4px); box-shadow:0 .75rem 1.5rem rgba(0,0,0,.15) }
#categoryFilter .active{ color:var(--bs-body-bg); background:var(--bs-body-color); border-color:var(--bs-body-color); }
.filter-tag{ cursor:pointer }