/* ============================================================
   SEO Content — editorial text + FAQ accordion.
   Layout only — buyer writes all copy in the Site Editor.
   Typography / color / font-size all editable per-block.
   ============================================================ */

/* ── Section reset ──────────────────────────────────────────── */

/* Reading measure comes from the group's contentSize (46rem) wired in PHP —
   WP constrains + centres the column natively, no CSS specificity fight. */
.wpdl-seo-content {
	margin-block: 0 !important;
}

/* ── Eyebrow label ──────────────────────────────────────────── */
.wpdl-seo-content__eyebrow {
	font-family: var(--wp--custom--font--family--body);
	font-size: var(--wp--custom--font--size--xs);
	font-weight: var(--wp--custom--font--weight--medium);
	letter-spacing: 0.1em;
	text-transform: uppercase;

	/* Brand accent — ties the eyebrow to the Showcase / Social sections. */
	color: var(--wp--custom--semantic--color--brand--primary);
	margin-block: 0 var(--wp--custom--space--4);
}

/* ── H2 — keyword heading ───────────────────────────────────── */
.wpdl-seo-content__heading.wp-block-heading {
	font-family: var(--wp--custom--font--family--display);
	font-size: var(--wp--custom--font--size--2xl);
	font-weight: var(--wp--custom--font--weight--medium);
	line-height: 1.25;
	color: var(--wp--custom--semantic--color--text--primary);
}

/* ── Lead paragraph ─────────────────────────────────────────── */
.wpdl-seo-content__lead {
	font-size: var(--wp--custom--font--size--lg);
	font-weight: 300;
	line-height: 1.65;
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block-end: var(--wp--custom--space--5);
}

/* ── Separator ──────────────────────────────────────────────── */

/* A short centred hairline reads as a deliberate editorial break between the
   copy and the FAQ. Generous breathing room above/below sets it apart. */
.wpdl-seo-content .wpdl-seo-content__divider {
	margin-block: var(--wp--custom--space--8) var(--wp--custom--space--7);
	border-color: var(--wp--custom--semantic--color--border--subtle);
	opacity: 1;
}

/* ── FAQ section heading ────────────────────────────────────── */
.wpdl-seo-content__faq-title.wp-block-heading {
	font-family: var(--wp--custom--font--family--display);
	font-size: var(--wp--custom--font--size--xl);
	font-weight: var(--wp--custom--font--weight--medium);
	color: var(--wp--custom--semantic--color--text--primary);
	margin-block-end: var(--wp--custom--space--5);
}

/* ── FAQ accordion (wp:details = native HTML5 <details>) ────── */

/* No JS needed. Accessible. Eligible for Google FAQ rich results. */
.wpdl-seo-content .wp-block-details {
	border-bottom: 0.0625rem solid var(--wp--custom--semantic--color--border--subtle);
	padding-block: var(--wp--custom--space--4);
	margin-block: 0;
}

.wpdl-seo-content .wp-block-details:first-of-type {
	border-top: 0.0625rem solid var(--wp--custom--semantic--color--border--subtle);
}

/* Summary row: question text + +/- toggle */
.wpdl-seo-content .wp-block-details > summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--wp--custom--space--5);
	font-family: var(--wp--custom--font--family--body);
	font-size: var(--wp--custom--font--size--base);
	font-weight: var(--wp--custom--font--weight--medium);
	color: var(--wp--custom--semantic--color--text--primary);
	transition: color var(--wp--custom--duration--fast) var(--wp--custom--easing--default);
}

/* Hover / open: question shifts to brand — a quiet, premium affordance. */
.wpdl-seo-content .wp-block-details > summary:hover,
.wpdl-seo-content .wp-block-details[open] > summary {
	color: var(--wp--custom--semantic--color--brand--primary);
}

/* Hide default browser triangle */
.wpdl-seo-content .wp-block-details > summary::-webkit-details-marker {
	display: none;
}

.wpdl-seo-content .wp-block-details > summary::marker {
	display: none;
}

/* +/- indicator */
.wpdl-seo-content .wp-block-details > summary::after {
	content: '+';
	flex-shrink: 0;
	font-size: var(--wp--custom--font--size--xl);
	font-weight: 300;
	line-height: 1;
	color: var(--wp--custom--semantic--color--text--muted);
	transition: color var(--wp--custom--duration--fast) var(--wp--custom--easing--default);
}

.wpdl-seo-content .wp-block-details > summary:hover::after,
.wpdl-seo-content .wp-block-details[open] > summary::after {
	color: var(--wp--custom--semantic--color--brand--primary);
}

.wpdl-seo-content .wp-block-details[open] > summary::after {
	content: '\2212';
}

/* Answer paragraph */
.wpdl-seo-content .wp-block-details .wp-block-paragraph {
	font-size: var(--wp--custom--font--size--sm);
	font-weight: 300;
	line-height: 1.7;
	color: var(--wp--custom--semantic--color--text--secondary);
	padding-block-start: var(--wp--custom--space--3);
	margin-block: 0;
}