.container {
	width: min(calc(100% - 1.5rem), var(--scently-container));
	margin-inline: auto;
}

.site-main {
	padding: 0 0 4rem;
}

.content-grid {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat(1, minmax(0, 1fr));
}

.button-row {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

@media (min-width: 768px) {
	.site-main {
		padding: 0 0 5rem;
	}

	.content-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.container {
		width: min(calc(100% - 2rem), 980px);
	}

	.site-main {
		padding: 0 0 4.5rem;
	}
}

@media (min-width: 1024px) and (max-width: 1365px) {
	.container {
		width: min(calc(100% - 3rem), 1240px);
	}
}
