.fs-faq-page {
	background: var(--fs-color-page);
	color: var(--fs-color-text);
	font-family: var(--fs-font-family);
	padding-block: var(--fs-faq-padding-block);
}

.fs-faq-page__inner {
	margin-inline: auto;
	width: min(calc(100% - (var(--fs-space-4) * 2)), var(--fs-faq-container-width));
}

.fs-faq-page__breadcrumbs {
	align-items: center;
	color: var(--fs-breadcrumb-current-color);
	display: flex;
	flex-wrap: wrap;
	font-size: var(--fs-text-small-size);
	font-weight: var(--fs-font-weight-regular);
	gap: var(--fs-breadcrumb-gap);
	line-height: var(--fs-line-height-sm);
	margin-block-end: var(--fs-space-3);
}

.fs-faq-page__breadcrumbs a {
	color: var(--fs-breadcrumb-color);
	text-decoration: none;
	transition: color var(--fs-duration-fast) var(--fs-ease-standard);
}

.fs-faq-page__breadcrumbs a:hover,
.fs-faq-page__breadcrumbs a:focus-visible {
	color: var(--fs-color-primary);
}

.fs-faq-page__header {
	margin-block-end: var(--fs-faq-heading-gap);
}

.fs-faq-page__title {
	color: var(--fs-color-text-strong);
	font-family: var(--fs-font-family);
	font-size: var(--fs-heading-2-size);
	font-weight: var(--fs-font-weight-regular);
	letter-spacing: var(--fs-heading-2-letter-spacing);
	line-height: var(--fs-line-height-display);
	margin: 0;
}

.fs-faq-page__list {
	display: flex;
	flex-direction: column;
	gap: var(--fs-faq-list-gap);
}

.fs-faq-item {
	border-block-end: var(--fs-border-width-sm) solid var(--fs-color-border);
	color: var(--fs-color-text);
}

.fs-faq-item:first-child {
	border-block-start: var(--fs-border-width-sm) solid var(--fs-color-border);
}

.fs-faq-item__summary {
	align-items: center;
	cursor: pointer;
	display: flex;
	gap: var(--fs-space-4);
	justify-content: space-between;
	list-style: none;
	min-height: var(--fs-faq-item-min-height);
	padding-block: var(--fs-faq-item-padding-block);
	padding-inline: var(--fs-faq-item-padding-inline);
}

.fs-faq-item__summary::-webkit-details-marker {
	display: none;
}

.fs-faq-item__summary:focus-visible {
	outline: var(--fs-border-width-md) solid var(--fs-color-focus);
	outline-offset: var(--fs-space-1);
}

.fs-faq-item__question {
	color: var(--fs-color-text-strong);
	font-size: var(--fs-text-big-size);
	font-weight: var(--fs-font-weight-medium);
	line-height: var(--fs-line-height-lg);
}

.fs-faq-item__icon {
	color: var(--fs-color-primary);
	flex: 0 0 auto;
	height: var(--fs-faq-icon-size);
	position: relative;
	width: var(--fs-faq-icon-size);
}

.fs-faq-item__icon::before,
.fs-faq-item__icon::after {
	background: currentColor;
	content: "";
	inset-block-start: 50%;
	inset-inline-start: 0;
	position: absolute;
	transform: translateY(-50%);
}

.fs-faq-item__icon::before {
	height: var(--fs-border-width-md);
	width: 100%;
}

.fs-faq-item__icon::after {
	height: 100%;
	inset-inline-start: calc(50% - (var(--fs-border-width-md) / 2));
	width: var(--fs-border-width-md);
}

.fs-faq-item[open] .fs-faq-item__icon::after {
	opacity: 0;
}

.fs-faq-item__answer {
	color: var(--fs-color-text-muted);
	font-size: var(--fs-text-body-size);
	font-weight: var(--fs-font-weight-regular);
	line-height: var(--fs-line-height-md);
	padding-block: var(--fs-faq-answer-padding-block);
	padding-inline: var(--fs-faq-answer-padding-inline);
}

.fs-faq-item__answer > * {
	margin-block: 0 var(--fs-space-4);
}

.fs-faq-item__answer > :last-child {
	margin-block-end: 0;
}

.fs-faq-page__empty {
	color: var(--fs-color-text-muted);
	font-size: var(--fs-text-body-size);
	line-height: var(--fs-line-height-md);
	margin: 0;
}

@media (max-width: 48rem) {
	.fs-faq-page__inner {
		width: min(calc(100% - (var(--fs-space-3) * 2)), var(--fs-faq-container-width));
	}

	.fs-faq-page__title {
		font-size: var(--fs-heading-5-size);
		line-height: var(--fs-line-height-md);
	}
}
