/* ============================================================
   BFP — standalone content page  (templates/bfp-page.php)
   Same editorial language as the "People of the day" feature:
   deep-blue hero header band · Fraunces display title ·
   contained, readable prose. Scoped to .bfp-page-main so
   nothing leaks into the surrounding theme.
   ============================================================ */

.bfp-page-main {
	/* Palette — shared with bfp-today.css */
	--bfp-bg:        #faf8f5;   /* warm cream */
	--bfp-surface:   #ffffff;
	--bfp-surface-2: #f4f0ea;
	--bfp-text:      #2a2f38;
	--bfp-heading:   #141821;
	--bfp-muted:     #5f6775;
	--bfp-border:    rgba(20, 28, 46, 0.12);
	--bfp-shadow:    0 1px 2px rgba(20,28,46,.04), 0 18px 44px -20px rgba(20,28,46,.22);

	--bfp-accent:      #1e3a5f;            /* deep editorial blue */
	--bfp-accent-2:    #3a6ea8;            /* lighter blue */
	--bfp-accent-soft: rgba(30, 58, 95, 0.08);

	--bfp-font-display: "Fraunces", Georgia, "Times New Roman", serif;
	--bfp-font-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--bfp-wrap: 820px;                     /* comfortable reading measure */
	--bfp-radius: 20px;
	--bfp-radius-sm: 14px;
	--bfp-pad: clamp(1.25rem, 4vw, 3.5rem);

	/* Break out of the theme container -> full-width band */
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	padding: 0;

	background: var(--bfp-bg);
	color: var(--bfp-text);
	font-family: var(--bfp-font-body);
	font-size: 1.5rem;
	line-height: 1.78;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}

.bfp-page-main *,
.bfp-page-main *::before,
.bfp-page-main *::after { box-sizing: border-box; }

.bfp-page-main img { max-width: 100%; }

.bfp-page { margin: 0; }

/* ----------------------------------------------------------
   HERO header — deep blue band, Fraunces title
   ---------------------------------------------------------- */
.bfp-page-header {
	position: relative;
	color: #fff;
	padding: clamp(2.75rem, 7vw, 5.5rem) var(--bfp-pad);
	background:
		radial-gradient(120% 150% at 88% -10%, rgba(58,110,168,.55), transparent 58%),
		linear-gradient(158deg, #1e3a5f 0%, #16293f 100%);
}

.bfp-page-title {
	max-width: var(--bfp-wrap);
	margin: 0 auto;
	font-family: var(--bfp-font-display);
	font-weight: 600;
	font-size: clamp(2.6rem, 1.7rem + 4.4vw, 4.75rem);
	line-height: 1.04;
	letter-spacing: -0.02em;
	color: #fff;
	text-wrap: balance;
	text-align: center;
}

/* A short rule under the title echoes the hero accents */
.bfp-page-title::after {
	content: "";
	display: block;
	width: 64px;
	height: 4px;
	margin: clamp(1rem, 2.5vw, 1.5rem) auto 0;
	border-radius: 999px;
	background: linear-gradient(90deg, #fff, var(--bfp-accent-2));
	opacity: .9;
}

/* ----------------------------------------------------------
   Featured image
   ---------------------------------------------------------- */
.bfp-page-thumbnail {
	max-width: var(--bfp-wrap);
	margin: clamp(2rem, 5vw, 3.5rem) auto 0;
	padding-inline: var(--bfp-pad);
}
.bfp-page-thumbnail img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: var(--bfp-radius);
	border: 1px solid var(--bfp-border);
	box-shadow: var(--bfp-shadow);
	background: var(--bfp-surface);
}

/* ----------------------------------------------------------
   Body prose
   ---------------------------------------------------------- */
.bfp-page-content {
	max-width: var(--bfp-wrap);
	margin-inline: auto;
	padding: clamp(2.5rem, 6vw, 4rem) var(--bfp-pad) clamp(3.5rem, 8vw, 6rem);
	color: var(--bfp-text);
	font-size: 1.5rem;
	line-height: 1.78;
}

.bfp-page-content > :first-child { margin-top: 0; }
.bfp-page-content > :last-child { margin-bottom: 0; }

.bfp-page-content p,
.bfp-page-content li { font-size: 1.5rem; }
.bfp-page-content p { margin: 0 0 1.4em; }

.bfp-page-content h2,
.bfp-page-content h3,
.bfp-page-content h4 {
	font-family: var(--bfp-font-display);
	font-weight: 600;
	color: var(--bfp-heading);
	line-height: 1.2;
	letter-spacing: -0.01em;
	margin: 2.2em 0 .6em;
	text-wrap: balance;
}
.bfp-page-content h2 { font-size: clamp(2rem, 1.4rem + 1.6vw, 2.75rem); }
.bfp-page-content h3 { font-size: clamp(1.75rem, 1.3rem + 1vw, 2.1rem); }
.bfp-page-content h4 { font-size: 1.6rem; }

.bfp-page-content a {
	color: var(--bfp-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	word-break: break-word;
}
.bfp-page-content a:hover { color: var(--bfp-accent-2); }

.bfp-page-content strong { color: var(--bfp-heading); font-weight: 700; }
.bfp-page-content em,
.bfp-page-content i { font-style: italic; }

.bfp-page-content ul,
.bfp-page-content ol { margin: 0 0 1.4em; }
.bfp-page-content li { margin: .35em 0; }

.bfp-page-content blockquote {
	margin: 1.8em 0;
	padding: 1.2em 1.4em 1.2em 1.6em;
	background: var(--bfp-accent-soft);
	border-left: 5px solid var(--bfp-accent);
	border-radius: var(--bfp-radius-sm);
	color: var(--bfp-heading);
	font-style: italic;
}
.bfp-page-content blockquote p:last-child { margin-bottom: 0; }

.bfp-page-content img {
	height: auto;
	border-radius: var(--bfp-radius-sm);
}

.bfp-page-content figure { margin: 1.8em 0; }
.bfp-page-content figcaption {
	margin-top: .7rem;
	text-align: center;
	font-size: 1.5rem;
	color: var(--bfp-muted);
}

/* ----------------------------------------------------------
   Small screens
   ---------------------------------------------------------- */
@media (max-width: 600px) {
	.bfp-page-title::after { margin-top: 1rem; }
}