.postheader {
	display: flex;
	flex-direction: column;
	gap: var(--space-lg);
	margin-bottom: var(--space-xl);
}

.postheader__back {
	display: inline-flex;
	align-items: center;
	gap: var(--space-xs);
	align-self: flex-start;
	color: var(--color-text-muted);
}

.postheader__back:hover {
	color: var(--color-primary);
}

.postheader__arrow {
	display: inline-block;
	color: var(--color-primary);
	transition: transform var(--transition);
}

.postheader__back:hover .postheader__arrow {
	transform: translateX(-0.25rem);
}

.postheader__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-md);
	color: var(--color-text-muted);
}

.postheader__sep {
	color: var(--color-outline-variant);
}

.postheader__tag {
	padding: 0.125rem var(--space-sm);
	background-color: rgb(3 181 211 / 0.1);
	border-radius: var(--radius-pill);
	box-shadow: var(--shadow-neon);
	color: var(--color-secondary);
	text-transform: none;
}

.postheader__title {
	margin-top: var(--space-xs);
}

/* The big title on single posts (display size in the design). */
.postheader__title--display {
	font-size: 2.375rem;
	font-weight: 400;
	line-height: 1.17;
	letter-spacing: -0.015em;
}

@media (min-width: 48rem) {
	.postheader__title--display {
		font-size: 3.5rem;
		line-height: 1.15;
		letter-spacing: -0.02em;
	}
}