.faq {
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: 24px;
}

.faq-item {
	font-size: 14px;
	line-height: 21px;
}

.faq-question {
	cursor: pointer;
	font-weight: 600;
	margin-bottom: 8px;
	color: #333;
	display: flex;
	align-items: center;
	gap: 8px;
	transition: .4s;
}

.faq-question:hover, .faq-item.active .faq-question {
	color: #f89728;
	transition: .4s;
}

.faq-answer {
	display: none;
	color: #777777;
	padding-left: 32px;
}

.faq-item.active .faq-answer {
	display: block;
}

.faq-item img.icon-close {
	display: none;
}

.faq-item.active img.icon-close {
	display: block;
}
.faq-item.active img.icon-open {
	display: none;
}

.faq-icon {
	width: 18px;
	height: 18px;
	background-color: #300bac;
	border-radius: 50%;
	transition: .4s;
	position: relative;
}

.faq-icon:after, .faq-icon:before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: #fff;
}

.faq-icon:before {
	height: 2px;
	width: 8px;
	margin-top: -1px;
	margin-left: -4px;
}

.faq-icon:after {
	height: 8px;
	width: 2px;
	margin-top: -4px;
	margin-left: -1px;
}

.faq-item.active .faq-icon:after {
	opacity: 0;
}

.faq-item.active .faq-icon, .faq-question:hover .faq-icon {
	background-color: #f89728;
	transition: .4s;
}
