$c-faq-inset: space(2);


.c-faq {
	list-style: none;
	margin-left: 0;
}


.c-faq__item {
	border-bottom: 2px solid palette(border, 200);

	&:first-child {
		border-top: 2px solid palette(border, 200);
	}
}


.c-faq__question {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	padding: space(1) $c-faq-inset;
	cursor: pointer;

	&:hover {
		color: palette(action);
	}
}


.c-faq__header {
	@include font-size(m);
	@include font-weight('bold');
	line-height: 1.77778;
	margin: 0 space(2) 0 0;
	transition: color 150ms linear;
	color: currentColor;
}


.c-faq__arrow {
	flex: 0 0 auto;
	transform: rotate(90deg);
	transition: transform 350ms ease-out;

	.c-faq__item.is-active & {
		transform: rotate(-90deg) translateY(-2px);
	}
}


/* Hidden by default*/
.c-faq__answer {
	@include owl-children;
	@include font-size(m);
	line-height: 1.77778;
	opacity: 0;
	max-height: 0;
	overflow: hidden;
	padding-left: $c-faq-inset;
	padding-right: space(5);
	transition: all 250ms ease-out; // close

	.c-faq__item.is-active & {
		opacity: 1;
		max-height: 400px;
		padding-top: space(1);
		padding-bottom: space(4);
	}
}