.teaser-grid-images {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

@media(min-width: 36em) {
	.teaser-grid-images--2,
	.teaser-grid-images--3 {
		grid-template-columns: 1fr 1fr;
	}
}

@media(min-width: 62.5em) {
	.teaser-grid-images--3 {
		grid-template-columns: 1fr 1fr 1fr;
	}

	.teaser-grid-images--4 {
		grid-template-columns: 1fr 1fr;
	}

	.teaser-grid-images--5,
	.teaser-grid-images--6 {
		grid-template-columns: 1fr 1fr 1fr;
	}
}

.teaser-grid-images--5 .teaser-subgrid,
.teaser-grid-images--6 .teaser-subgrid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}

@media(min-width: 36em) {
	.teaser-grid-images--4 .teaser-subgrid,
	.teaser-grid-images--5 .teaser-subgrid,
	.teaser-grid-images--6 .teaser-subgrid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 1rem;
	}
}

@media(max-width: 62.4999em) {
	.teaser-grid-images--5 .teaser-subgrid:nth-child(2) {
		order: 1;
	}
}

@media(min-width: 62.5em) {
	.teaser-grid-images--4 .teaser-subgrid {
		grid-template-columns: 1fr;
	}

	.teaser-grid-images--5 .teaser-subgrid,
	.teaser-grid-images--6 .teaser-subgrid {
		grid-template-columns: 1fr;
	}
}

.teaser-grid-images + div:has(.button--primary) {
	margin-top: 1rem;
	text-align: right;
}