/**
 * Content, section and editorial-grid primitives.
 */

.am-container {
	width: min(100% - (2 * var(--am-gutter)), var(--am-wide-width));
	margin-inline: auto;
}

.am-container--content {
	max-width: var(--am-content-width);
}

.am-section {
	padding-block: var(--am-space-section-md);
}

.am-section--compact {
	padding-block: var(--am-space-section-sm);
}

.am-section--spacious {
	padding-block: var(--am-space-section-lg);
}

.am-editorial-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--am-grid-gap);
}

.am-stack {
	display: flex;
	flex-direction: column;
	gap: var(--am-space-5);
}

.am-stack--tight {
	gap: var(--am-space-3);
}

.am-cluster {
	display: flex;
	flex-wrap: wrap;
	gap: var(--am-space-3);
	align-items: center;
}

.am-safe-area {
	padding-right: max(var(--am-gutter), env(safe-area-inset-right));
	padding-bottom: max(var(--am-space-4), env(safe-area-inset-bottom));
	padding-left: max(var(--am-gutter), env(safe-area-inset-left));
}

@media (min-width: 48rem) {
	.am-editorial-grid {
		grid-template-columns: repeat(12, minmax(0, 1fr));
	}

	.am-editorial-grid > * {
		grid-column: span 6;
	}

	.am-editorial-grid > .am-grid-wide {
		grid-column: span 8;
	}

	.am-editorial-grid > .am-grid-narrow {
		grid-column: span 4;
	}
}