.sfaq { width: 100%; box-sizing: border-box; }
.sfaq-title {
	margin: 0 0 22px;
	padding: 10px 14px;
	border-left: var(--sfaq-accent-width) solid var(--sfaq-accent);
	background: var(--sfaq-title-bg);
	color: var(--sfaq-title-color);
	font-size: var(--sfaq-title-size);
	font-weight: 800;
	line-height: 1.2;
}
.sfaq-list { display: grid; gap: 14px; }
.sfaq-item {
	margin: 0;
	border: var(--sfaq-border-width) solid var(--sfaq-border);
	border-radius: var(--sfaq-radius);
	background: var(--sfaq-item-bg);
	overflow: hidden;
}
.sfaq-question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 72px;
	box-sizing: border-box;
	padding: 16px;
	color: var(--sfaq-q-color);
	font-size: var(--sfaq-q-size);
	font-weight: 700;
	line-height: 1.35;
	cursor: pointer;
	list-style: none;
}
.sfaq-question::-webkit-details-marker { display: none; }
.sfaq-icon {
	position: relative;
	flex: 0 0 30px;
	width: 30px;
	height: 30px;
	border: 1.7px solid currentColor;
	border-radius: 50%;
}
.sfaq-icon::before,
.sfaq-icon::after {
	content: '';
	position: absolute;
	top: 50%; left: 50%;
	width: 13px; height: 1.7px;
	background: currentColor;
	transform: translate(-50%, -50%);
}
.sfaq-icon::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .2s ease; }
.sfaq-item[open] .sfaq-icon::after { transform: translate(-50%, -50%) rotate(0); }
.sfaq-answer {
	padding: 0 16px 18px;
	border-top: var(--sfaq-border-width) solid var(--sfaq-border);
	color: var(--sfaq-a-color);
	font-size: 17px;
	line-height: 1.7;
}
.sfaq-answer p { margin: 16px 0 0; }
.sfaq-question:focus-visible { outline: 3px solid color-mix(in srgb, var(--sfaq-accent) 45%, transparent); outline-offset: -3px; }
@media (max-width: 600px) {
	.sfaq-title { font-size: clamp(25px, 8vw, var(--sfaq-title-size)); }
	.sfaq-question { min-height: 62px; padding: 14px; font-size: min(var(--sfaq-q-size), 19px); }
	.sfaq-icon { flex-basis: 26px; width: 26px; height: 26px; }
}