/**
 * faq: loaded only on pages that show it.
 *
 * Split out of the shared stylesheets by bin/split-css.py; loaded by
 * inc/feature-styles.php when something on the page has the class.
 */

/* ---------- From blocks.css ---------- */
/* ---------- FAQ ---------------------------------------------------------- */

.cong-faq {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	border-top: 1px solid var(--wp--preset--color--sky-mid);
}

.cong-faq__item {
	border-bottom: 1px solid var(--wp--preset--color--sky-mid);
}

.cong-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--20);
	padding: var(--wp--preset--spacing--30) 0;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 600;
	list-style: none;
}

.cong-faq__q::-webkit-details-marker {
	display: none;
}

.cong-faq__q::after {
	content: "";
	flex: 0 0 auto;
	width: 0.6em;
	height: 0.6em;
	border-right: 2px solid var(--wp--preset--color--leaf);
	border-bottom: 2px solid var(--wp--preset--color--leaf);
	transform: rotate(45deg) translate(-0.1em, -0.1em);
	transition: transform var(--wp--custom--transition--base);
}

.cong-faq__item[open] .cong-faq__q::after {
	transform: rotate(225deg) translate(-0.15em, -0.15em);
}

.cong-faq__a {
	padding-bottom: var(--wp--preset--spacing--30);
	max-width: var(--wp--custom--measure--prose);
	color: var(--wp--preset--color--ink-muted);
}
