/* ==========================================================
   FAQ — акордеон на <dl>/<dt>/<dd>, розкриття керується JS
   через aria-expanded + max-height на .faq-item__answer
   ========================================================== */

.faq {
	padding-block: var(--space-24);
}

.faq-list {
	max-width: 760px;
}

.faq-item {
	border-bottom: 1px solid var(--color-gray-200);
}

.faq-item__question {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	padding-block: var(--space-6);
	text-align: left;
	font-family: var(--font-heading);
	font-size: 1.05rem;
	font-weight: 500;
	color: var(--color-black);
}

/* Плюс/мінус індикатор через ::after, крутиться при розкритті */
.faq-item__question::after {
	content: '+';
	flex-shrink: 0;
	font-size: 1.5rem;
	color: var(--color-accent-dark);
	transition: transform var(--transition-base);
}
.faq-item__question[aria-expanded="true"]::after {
	transform: rotate(45deg);
}

.faq-item__answer {
	margin: 0;
	max-height: 0;
	overflow: hidden;
	transition: max-height 300ms ease, padding-bottom 300ms ease;
	color: var(--color-gray-500);
}
.faq-item__answer p {
	padding-bottom: var(--space-6);
}

/* Клас, що JS додає/прибирає для розкриття — max-height
   виставляється інлайново з JS через scrollHeight */
.faq-item.is-open .faq-item__answer {
	padding-bottom: 0;
}