.work-card-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.work-card-grid .grid-item {
	--card-group: 0;
	--row-offset: calc(var(--card-group) * 5);
}

.work-card-grid .grid-item:nth-child(10n + 1) {
	grid-column: span 2 / span 2;
	grid-row-start: calc(1 + var(--row-offset));
}

.work-card-grid .grid-item:nth-child(10n + 2) {
	--overhang: 8rem;
	grid-row: calc(1 + var(--row-offset)) / span 2;
	grid-column-start: 3;
	display: grid;
	grid-template-rows: subgrid;
}

.work-card-grid .grid-item:nth-child(10n + 2) > .wp-block-acf-work-card {
	align-self: end;
	margin-bottom: calc(var(--overhang) * -1);
}

.work-card-grid .grid-item:nth-child(10n + 2)::after {
	content: '';
	height: calc(var(--overhang) + 1.5rem);
}

.work-card-grid .grid-item:nth-child(10n + 3) {
	grid-column-start: 2;
	grid-row-start: calc(2 + var(--row-offset));
	margin-top: 3rem;
}

.work-card-grid .grid-item:nth-child(10n + 4) {
	grid-column-start: 1;
	grid-row-start: calc(2 + var(--row-offset));
	margin-top: 12rem;
}

.work-card-grid .grid-item:nth-child(10n + 5) {
	grid-column: span 2 / span 2;
	grid-column-start: 2;
	grid-row-start: calc(3 + var(--row-offset));
}

.work-card-grid .grid-item:nth-child(10n + 6) {
	grid-column-start: 1;
	grid-row-start: calc(3 + var(--row-offset));
	margin-top: 15rem;
}

.work-card-grid .grid-item:nth-child(10n + 7) {
	grid-column-start: 3;
	grid-row-start: calc(4 + var(--row-offset));
	margin-top: 3rem;
}

.work-card-grid .grid-item:nth-child(10n + 8) {
	grid-column: span 2 / span 2;
	grid-column-start: 1;
	grid-row-start: calc(4 + var(--row-offset));
	margin-top: 9rem;
}

.work-card-grid .grid-item:nth-child(10n + 9) {
	grid-column-start: 3;
	grid-row-start: calc(5 + var(--row-offset));
}

.work-card-grid .grid-item:nth-child(10n + 10) {
	grid-column: span 2 / span 2;
	grid-column-start: 1;
	grid-row-start: calc(5 + var(--row-offset));
	margin-top: 12rem;
	margin-bottom: 4.5rem;
}

@media (max-width: 768px) {
	.work-card-grid {
		grid-template-columns: 1fr;
		grid-template-rows: none;
	}

	.work-card-grid .grid-item.grid-item {
		grid-column: 1 / -1;
		grid-row: auto;
		margin-top: 0;
		margin-bottom: 1.5rem;
	}

	.work-card-grid .grid-item:nth-child(10n + 2) {
		display: block;
	}

	.work-card-grid .grid-item:nth-child(10n + 2) > .wp-block-acf-work-card {
		margin-bottom: 0;
	}

	.work-card-grid .grid-item:nth-child(10n + 2)::after {
		content: none;
	}
}
