/* ===========================================================================
   PAGE-INTRO-FAQ — centered eyebrow + H1 + lead paragraph on white
   Sibling of page-intro (no-lead variant). Used by Hospice Care FAQ.
   Typography inherits from theme.json elements.h1 + is-style-eyebrow.
   Source: docs/figma/hospice-care-faq/_slices/03-page-intro-faq.png (1440 × 523)
   =========================================================================== */

.wp-block-group.hodc-page-intro-faq {
	background: var(--wp--preset--color--white);
	padding: 56px 24px 25px;
	box-sizing: border-box;
}

/* Eyebrow inherits is-style-eyebrow tokens from style.css. Margin only. */
.hodc-page-intro-faq__eyebrow {
	margin: 0 auto;
}

/* H1: pinned size + width to force 3-line wrap matching Figma.
 * theme.json elements.h1 uses fluid h-xl clamp(2.25rem..3.5rem) which scales
 * DOWN at 1440 viewport. Override to fixed 56/66 weight 400 -1% letter to
 * match Figma's measured XL/desktop ramp exactly. Max-width 700 px forces
 * the wrap points "We know you have many" / "questions. Let's find the" /
 * "answers together." */
.hodc-page-intro-faq__title {
	max-width: 700px;
	margin: 33px auto 0;
	font-family: "source-serif-pro", Georgia, serif;
	font-size: 56px;
	line-height: 66px;
	font-weight: 400;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--primary);
}

/* Lead body: Mr Eaves XL Modern 24/36 weight 400, primary teal, centered.
 * Bumped 18/28 → 24/36 per principal-review feedback (BC #9889822267) —
 * the lead reads as body copy and needs to be larger than the standard
 * p-large ramp on this page-intro variant. */
.hodc-page-intro-faq__lead {
	max-width: 780px;
	margin: 63px auto 0;
	font-family: "mreavesxlmodotheavy", system-ui, sans-serif;
	font-size: 24px;
	line-height: 36px;
	font-weight: 400;
	color: var(--wp--preset--color--primary);
}

/* Mobile — NOT IN FIGMA. Reduce padding + let H1 fluid-clamp via h-xl preset. */
@media (max-width: 768px) {
	.wp-block-group.hodc-page-intro-faq {
		padding: 28px 20px 48px;
	}
	.hodc-page-intro-faq__title {
		max-width: 100%;
		margin-top: 24px;
	}
	.hodc-page-intro-faq__lead {
		margin-top: 36px;
	}
}