/**
 * FAQ component.
 */

.rc-faq__intro {
	display: grid;
	gap: var(--rc-space-m);
	margin-block-end: var(--rc-space-xl);
	overflow-wrap: anywhere;
}

.rc-faq__intro > * {
	margin-block: 0;
}

.rc-faq__eyebrow {
	color: var(--rc-color-muted);
	font-size: var(--rc-font-size-small);
}

.rc-faq__body > :last-child,
.rc-faq__answer > :last-child {
	margin-block-end: 0;
}

.rc-faq__items {
	display: grid;
	gap: 0;
}

.rc-faq__item {
	background: transparent;
	border-block-start: 1px solid var(--line, var(--rc-border-color));
	color: var(--rc-card-text);
	overflow-wrap: anywhere;
}

.rc-faq__item:last-child {
	border-block-end: 1px solid var(--line, var(--rc-border-color));
}

.rc-faq__question {
	align-items: center;
	cursor: pointer;
	display: flex;
	font-size: clamp(1rem, 1.5vw, 1.12rem);
	font-weight: 700;
	gap: 1rem;
	justify-content: space-between;
	min-block-size: var(--rc-button-min-height);
	padding: 1.35rem 0;
}

.rc-faq__question::after {
	align-items: center;
	border: 1px solid var(--line, var(--rc-border-color));
	border-radius: 50%;
	content: "+";
	display: inline-flex;
	flex: 0 0 auto;
	font-size: 1.2rem;
	font-weight: 400;
	block-size: 2rem;
	inline-size: 2rem;
	justify-content: center;
}

.rc-faq__item[open] .rc-faq__question::after {
	content: "−";
}

.rc-faq__question:focus-visible {
	outline: 3px solid var(--rc-button-focus-color);
	outline-offset: 3px;
}

.rc-faq__answer {
	color: var(--rc-color-muted);
	padding: 0 3rem 1.5rem 0;
}

.rc-faq__action {
	margin-block: var(--rc-space-xl) 0;
}