/**
 * Page meta line: author and update date printed under a page title.
 *
 * Own selectors only. The visual treatment mirrors the meta line of single posts
 * (small type, bold author name, uppercase date) while the colour is inherited from
 * the surrounding content, so the line stays readable on any page background.
 *
 * Layout is a wrapping flex row: the date never breaks inside itself, and a very long
 * author name wraps instead of pushing the line out of its container.
 */

.npc-page-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	margin: 12px 0 26px;
	font-size: 14px;
	line-height: 1.3;
}

.npc-page-meta__author {
	display: inline-flex;
	align-items: baseline;
	margin-right: 14px;
}

.npc-page-meta__by {
	margin-right: 4px;
}

.npc-page-meta__author-name {
	font-weight: 700;
}

.npc-page-meta__date {
	text-transform: uppercase;
	white-space: nowrap;
}

/* Tablet and below: tighten the vertical rhythm to match the smaller type scale. */
@media (max-width: 767px) {

	.npc-page-meta {
		margin: 10px 0 20px;
	}
}

/*
 * Narrow phones: at 14px the author and the date no longer share one line inside the
 * ~272px of content a 320px viewport leaves, so the type steps down and the gap between
 * the two parts narrows. Both parts then fit on a single line again.
 */
@media (max-width: 480px) {

	.npc-page-meta {
		font-size: 13px;
	}

	.npc-page-meta__author {
		margin-right: 10px;
	}
}