/**
 * Timeline animatie: de spine vult zich op tijdens het scrollen.
 * De JS zet --progress (0 tot 1) op .c-timeline__spine.
 *
 * Verwacht dat de spine zelf absoluut gepositioneerd is binnen
 * de timeline-wrapper (position: absolute via de pagina-/sitestijl).
 */

/* ======= Spine ======= */
.c-timeline__spine {
	/* top: 0; */
	bottom: 0;
	width: 4px;
	translate: -50% 0;
	background: rgb(0, 0, 0, 0.05); /* track */
	--progress: 0;
}

.c-timeline__spine::after {
	content: "";
	position: absolute;
	inset: 0;
	background: #000; /* fill */
	transform-origin: top center;
	transform: scaleY(var(--progress));
	will-change: transform;
}