.sg-archive,
.sg-reading,
.sg-single {
	margin-inline: auto;
	max-width: var(--sg-wide);
	padding: var(--sg-space-xl) var(--sg-page-gutter) var(--sg-space-2xl);
}

.sg-archive-header {
	margin-bottom: var(--sg-space-xl);
	max-width: 820px;
}

.sg-archive-header h1 {
	margin-bottom: var(--sg-space-sm);
}

.sg-filter-bar a {
	background: #ffffff;
	border: 1px solid var(--sg-border);
	border-radius: 999px;
	color: var(--sg-ink);
	font-weight: 720;
	padding: 0.55rem 0.82rem;
	text-decoration: none;
}

.sg-filter-bar a[aria-current="page"] {
	background: var(--sg-accent);
	border-color: var(--sg-accent);
	color: #fff;
}

.sg-filter-bar a:hover {
	border-color: var(--sg-accent);
	color: var(--sg-accent);
}

.sg-breadcrumbs {
	color: var(--sg-muted);
	display: flex;
	flex-wrap: wrap;
	font-size: var(--sg-text-sm);
	gap: 0.5rem;
	margin: var(--sg-space-md) auto 0;
	max-width: var(--sg-wide);
	padding-inline: var(--sg-page-gutter);
}

.sg-breadcrumbs a {
	color: inherit;
	text-decoration: none;
}

.sg-empty-state {
	background: #ffffff;
	border: 1px dashed var(--sg-border);
	border-radius: var(--sg-radius-md);
	color: var(--sg-muted);
	padding: var(--sg-space-lg);
}

.sg-empty-state h3 {
	margin-top: 0;
}