/*
 * Generic Page — Used by page.html for any unassigned page.
 *
 * Layout: constrained title → optional wide hero image → 42.5rem reading col.
 * Buyer creates content in the editor; this CSS ensures editorial consistency.
 *
 * Tokens read:
 *   semantic.color.text.primary   — title, headings
 *   semantic.color.text.muted     — body paragraphs
 *   semantic.color.border.base    — hr, blockquote border
 *   semantic.typography.display   — title, H2 (Cormorant)
 *   semantic.typography.body      — body text (Jost)
 *   space.7 – 11
 */

/* ── Wrapper ───────────────────────────────────────────────────────── */

.wpdl-page.wp-block-group {
	padding-block: var(--wp--custom--space--9) var(--wp--custom--space--11);
}

/* ── Title ─────────────────────────────────────────────────────────── */

.wpdl-page__title.wp-block-post-title {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.75rem, 1.1rem + 2.68vw, 3rem);
	font-weight: 500;
	line-height: 1.1;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0 var(--wp--custom--space--8);
	padding-block-end: var(--wp--custom--space--7);
	border-block-end: 0.0625rem solid var(--wp--custom--semantic--color--border--base);
}

/* ── Hero image ────────────────────────────────────────────────────── */

.wpdl-page__hero-img.wp-block-post-featured-image {
	margin-block: 0 var(--wp--custom--space--9);
	overflow: hidden;
}

.wpdl-page__hero-img.wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ── Content reading column ────────────────────────────────────────── */

.wpdl-page__content.wp-block-group {
	margin-block: 0;
}

.wpdl-page__content .wp-block-post-content p,
.wpdl-page__content .wp-block-post-content .wp-block-paragraph {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.875rem;
	font-weight: 300;
	line-height: 1.85;
	color: var(--wp--custom--semantic--color--text--muted);
	margin-block: 0 var(--wp--custom--space--6);
}

.wpdl-page__content .wp-block-post-content h2.wp-block-heading {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-size: clamp(1.0625rem, 0.85rem + 0.89vw, 1.375rem);
	font-weight: 500;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: var(--wp--custom--space--9) var(--wp--custom--space--5);
	line-height: 1.2;
}

.wpdl-page__content .wp-block-post-content h3.wp-block-heading {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: var(--wp--custom--space--7) var(--wp--custom--space--4);
}

.wpdl-page__content .wp-block-post-content ul,
.wpdl-page__content .wp-block-post-content ol {
	font-family: var(--wp--custom--semantic--typography--body--font-family);
	font-size: 0.875rem;
	font-weight: 300;
	line-height: 1.85;
	color: var(--wp--custom--semantic--color--text--muted);
	padding-inline-start: var(--wp--custom--space--7);
	margin-block: 0 var(--wp--custom--space--6);
}

.wpdl-page__content .wp-block-post-content ul li::marker {
	color: var(--wp--custom--semantic--color--accent--primary);
}

.wpdl-page__content .wp-block-post-content blockquote.wp-block-quote {
	border-inline-start: 0.1875rem solid var(--wp--custom--semantic--color--accent--primary);
	padding-inline-start: var(--wp--custom--space--6);
	margin-inline: 0;
	margin-block: var(--wp--custom--space--7);
}

.wpdl-page__content .wp-block-post-content blockquote p {
	font-family: var(--wp--custom--semantic--typography--display--font-family);
	font-style: italic;
	font-size: clamp(0.9375rem, 0.75rem + 0.8vw, 1.1875rem);
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block: 0;
}

.wpdl-page__content .wp-block-post-content hr.wp-block-separator {
	border: none;
	border-block-end: 0.0625rem solid var(--wp--custom--semantic--color--border--base);
	margin-block: var(--wp--custom--space--8);
	opacity: 1;
}

/* ── Mobile ────────────────────────────────────────────────────────── */

@media (width < 40em) {
	.wpdl-page.wp-block-group {
		padding-block: var(--wp--custom--space--7) var(--wp--custom--space--9);
	}
}