/* FAQ module — accessible accordion */
.faq__head { max-width: 720px; margin: 0 auto 32px; text-align: center; }
.faq__heading { margin-top: 10px; }
.faq__intro { margin-top: 12px; }

.faq__list {
	max-width: 880px;
	margin: 0 auto;
	display: grid;
	gap: 10px;
}

.faq__item {
	background: #fff;
	box-shadow: 0 0 0 1px var(--line) inset;
	transition: box-shadow .2s;
}
.faq__item[open] {
	box-shadow: 0 0 0 1px rgba(77, 186, 174, 0.45) inset, 0 4px 18px -10px rgba(17, 32, 43, 0.18);
}

.faq__q {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 18px 22px;
	cursor: pointer;
	font-weight: 600;
	font-size: 1rem;
	color: var(--ink);
	list-style: none; /* hide default marker */
}
.faq__q::-webkit-details-marker { display: none; }
.faq__q:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }

.faq__icon {
	flex-shrink: 0;
	width: 14px; height: 14px;
	position: relative;
}
.faq__icon::before, .faq__icon::after {
	content: ""; position: absolute;
	background: var(--teal);
	transition: transform .25s ease;
}
.faq__icon::before { top: 6px; left: 0; width: 14px; height: 2px; }
.faq__icon::after  { left: 6px; top: 0; width: 2px; height: 14px; }
.faq__item[open] .faq__icon::after { transform: rotate(90deg); }

.faq__a {
	padding: 0 22px 22px;
	color: var(--muted);
	font-size: 1rem;
	line-height: 1.6;
}
.faq__a p { margin: 0; }
.faq__a p + p { margin-top: 10px; }
