/* faq: original homepage design and editable color variables. */

:where(.wp-site-blocks, .editor-styles-wrapper) .faq .eyebrow {
	color: var(--purple);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq {
	display: grid;
	grid-template-columns: .8fr 1.2fr;
	gap: 70px;
	align-items: start;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq-intro {
	color: var(--muted);
	line-height: 1.5;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq-list {
	border-top: 1px solid var(--line);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq details {
	border-bottom: 1px solid var(--line);
	padding: 18px 0;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq summary {
	list-style: none;
	cursor: pointer;
	font-weight: 700;
	display: flex;
	justify-content: space-between;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq summary::-webkit-details-marker {
	display: none;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq summary span {
	color: var(--purple);
	font-size: 21px;
	line-height: .8;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .faq details p {
	color: var(--muted);
	font-size: 14px;
	line-height: 1.5;
	max-width: 500px;
	margin-bottom: 0;
}

@media(max-width:760px) {
	:where(.wp-site-blocks, .editor-styles-wrapper) .faq {
		grid-template-columns: 1fr;
		gap: 18px;
	}
	
}

.np-block.faq { display: block; background: var(--faq-bg, transparent); color: var(--faq-text, var(--ink)); }
.np-block.faq .faq-heading { margin-bottom: 25px; }
.np-block.faq .faq-answer { color: var(--muted); font-size: 14px; line-height: 1.5; max-width: 500px; }
.np-block.faq .faq-answer > :last-child { margin-bottom: 0; }
.np-block.faq .faq-answer a { color: var(--purple); }
.np-block.faq summary { gap: 20px; align-items: baseline; }
.np-block.faq .faq-indicator { flex-shrink: 0; }
.np-block.faq .faq-collapse { display: none; }
.np-block.faq details[open] .faq-expand { display: none; }
.np-block.faq details[open] .faq-collapse { display: inline; }
