/* ==========================================================================
   Succes News — page.css
   Static pages: header (breadcrumbs + title), featured image, content column
   and the full-width variant. Prose typography itself comes from content.css
   (.sn-prose); tokens from main.css + #sn-vars. Loaded on pages only.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Shell
   -------------------------------------------------------------------------- */
.sn-page { padding-block: var(--sn-space-6) var(--sn-space-16); }
@media (min-width: 1024px) {
	.sn-page { padding-block: var(--sn-space-8) var(--sn-space-16); }
}

/* No-sidebar / full-width pages: header + media follow the prose measure
   (content.css narrows .sn-prose the same way). */
@media (min-width: 1024px) {
	.sn-page--no-sidebar .sn-page__header,
	.sn-page--full-width .sn-page__header,
	.sn-page--no-sidebar .sn-page__featured,
	.sn-page--full-width .sn-page__featured {
		max-width: var(--sn-content-width);
		margin-inline: auto;
	}
	.sn-layout--no-sidebar .sn-comments,
	.sn-layout--full-width .sn-comments {
		max-width: var(--sn-content-width);
		margin-inline: auto;
	}
}

/* --------------------------------------------------------------------------
   2. Header
   -------------------------------------------------------------------------- */
.sn-page__header { margin: 0 0 var(--sn-space-6); }
.sn-page__breadcrumbs { margin-bottom: var(--sn-space-4); }
.sn-page__title {
	margin: 0;
	font-size: calc(clamp(1.75rem, 1.3rem + 2vw, 2.6rem) * var(--sn-headline-scale));
	line-height: var(--sn-lh-tight);
	text-wrap: balance;
}
.sn-page--no-title .sn-page__header:has(> .sn-page__breadcrumbs:only-child) { margin-bottom: var(--sn-space-4); }

/* --------------------------------------------------------------------------
   3. Featured image
   -------------------------------------------------------------------------- */
.sn-page__featured { margin: 0 0 var(--sn-space-8); }
.sn-page__img {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: var(--sn-radius-lg);
	background: var(--sn-surface-2);
}
.sn-page__caption {
	margin: .65em 0 0;
	font-family: var(--sn-font-ui);
	font-size: var(--sn-fs-sm);
	line-height: 1.5;
	color: var(--sn-text-muted);
}
.sn-page__caption a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.sn-page__caption a:hover { color: var(--sn-primary); }

/* Full-width pages: edge-to-edge featured image, no rounding. */
.sn-container--full .sn-page--full-width .sn-page__featured { max-width: none; }
.sn-container--full .sn-page--full-width .sn-page__img { border-radius: 0; }

/* --------------------------------------------------------------------------
   4. Content column
   -------------------------------------------------------------------------- */
.sn-page__content { min-width: 0; }
.sn-page__content > :first-child { margin-top: 0; }

/* --------------------------------------------------------------------------
   5. Print
   -------------------------------------------------------------------------- */
@media print {
	.sn-page { padding-block: 0; }
	.sn-page__img { border-radius: 0; max-width: 80%; }
}