/**
 * Layout: page shell and section rhythm.
 *
 * Section-level spacing and colour live inline in the template parts so the
 * approved V4 composition is reproduced verbatim; this file holds only the
 * structural shell the templates sit inside.
 */

/* The page wrapper must NOT create a positioning or clipping context: the
   sticky header resolves against its nearest such ancestor, and scoping it to
   this wrapper is what made the header paint over the content instead of
   scrolling with it. Horizontal clipping moves to the body. */
.nk-page-wrap {
	position: static;
	overflow-x: clip;
}

.nk-shell {
	max-width: var(--nk-shell);
	margin: 0 auto;
	padding-left: var(--nk-gutter);
	padding-right: var(--nk-gutter);
}

/* Anchors clear the sticky header. */
.nk-page section[id] {
	scroll-margin-top: var(--nk-header-h);
}

/* Interior pages (page.php, single.php, archive.php, search.php, 404.php). */
.nk-main--interior {
	padding: 88px 0 120px;
}

.nk-article {
	max-width: 72ch;
	margin: 0 auto;
}

.nk-article > * + * {
	margin-top: 1.1em;
}

.nk-entry-header {
	margin-bottom: 40px;
}

.nk-entry-title {
	margin: 0;
	font-size: clamp(30px, 3.2vw, 46px);
	line-height: 1.08;
	font-weight: 800;
	color: var(--nk-ink);
}

.nk-entry-meta {
	margin: 12px 0 0;
	font-family: var(--nk-font-mono);
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--nk-ink-quiet);
}

.nk-entry-thumb {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--nk-r-lg);
	margin-bottom: 40px;
	box-shadow: var(--nk-shadow-frame);
}

.nk-archive-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: 24px;
}

.nk-card {
	background: var(--nk-surface);
	border: 1px solid var(--nk-line);
	border-radius: var(--nk-r-lg);
	padding: 28px;
	box-shadow: var(--nk-shadow-card);
	transition: transform 0.28s var(--nk-ease), box-shadow 0.34s ease, border-color 0.25s ease;
}

.nk-card:hover {
	transform: translateY(-5px);
	border-color: #CFCFD1;
	box-shadow: var(--nk-shadow-lift);
}

.nk-pagination {
	margin-top: 56px;
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	justify-content: center;
}

.nk-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--nk-line);
	border-radius: var(--nk-r-md);
	font-weight: 600;
	background: var(--nk-surface);
}

.nk-pagination .page-numbers.current {
	background: var(--nk-charcoal);
	border-color: var(--nk-charcoal);
	color: #fff;
}

/* Widget areas. */
.nk-sidebar {
	display: grid;
	gap: 32px;
}

.nk-widget-title {
	margin: 0 0 16px;
	font-family: var(--nk-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--nk-ink-quiet);
}

.nk-with-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 320px);
	gap: 56px;
	align-items: start;
}

/* Comments. */
.nk-comments {
	margin-top: 72px;
	padding-top: 48px;
	border-top: 1px solid var(--nk-line);
}

.nk-comments .comment-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 28px;
}

.nk-comments .children {
	list-style: none;
	margin: 28px 0 0 28px;
	padding: 0;
	display: grid;
	gap: 28px;
}

/* The logged-in admin bar is fixed to the top of the viewport, so the sticky
   header must start below it or the two overlap. WordPress switches the bar to
   46px and makes it non-fixed under 600px. */
body.admin-bar header[data-nk-header] {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar header[data-nk-header] {
		top: 46px;
	}
}

@media screen and (max-width: 600px) {
	body.admin-bar header[data-nk-header] {
		top: 0;
	}
}

/* Anchor targets clear the sticky header plus the admin bar. */
body.admin-bar .nk-page-wrap section[id] {
	scroll-margin-top: calc(var(--nk-header-h) + 32px);
}