.cards {
	display: grid;
	grid-template: auto / 1fr;
	margin-bottom: var(--spacing-20);
	grid-gap: var(--spacing-10);

	.blog &,
	.archive & {
		margin-block: var(--spacing-20);

		@media (width > 1000px) {
			margin-block-end: var(--spacing-120);
		}
	}

	@media (width > 768px) {
		grid-template: auto / 1fr 1fr 1fr;
		grid-gap: var(--spacing-20);
	}

	@media (width > 1000px) {
		margin-block: var(--spacing-40);
		gap: var(--spacing-50);
	}
}