.k20-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--k20-s-5);
}

.k20-work-packages {
	margin: 0;
	padding: 0;
	list-style: none;
}

.k20-work-packages > li {
	display: grid;
	grid-template-columns: 4.5rem minmax(0, 1fr);
	column-gap: var(--k20-s-4);
	align-items: baseline;
	margin: 0;
	padding: var(--k20-s-5) 0;
	border-top: 1px solid var(--k20-linie);
}

.k20-work-packages > li:last-child {
	border-bottom: 1px solid var(--k20-linie);
}

.k20-work-packages > li:hover {
	background: var(--k20-fundal);
	box-shadow: calc(-1 * var(--k20-s-4)) 0 0 var(--k20-fundal), var(--k20-s-4) 0 0 var(--k20-fundal);
}

.k20-work-packages > li > strong:first-child {
	color: var(--k20-turcoaz-text);
	font-size: var(--k20-fs-h3);
	font-weight: var(--k20-fw-bold);
	font-variant-numeric: tabular-nums;
	line-height: var(--k20-lh-tight);
}

@media (min-width: 48em) {
	.k20-work-packages > li {
		grid-template-columns: 6rem minmax(0, 1fr);
		column-gap: var(--k20-s-5);
	}
}

@media (min-width: 64em) {
	.k20-split {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: var(--k20-s-5);
		align-items: start;
	}

	.k20-split > h2 {
		grid-column: 1 / span 4;
		position: sticky;
		top: calc(var(--k20-adminbar-h) + var(--k20-s-5));
	}

	.k20-split > :not(h2) {
		grid-column: 5 / span 8;
	}
}
