/**
 * FAQ-accordion — structuur/gedrag overgenomen uit het ontwerpconcept
 * (mercedes-audio-upgrade-ontwerp_1.html). Geheel eigen `scs-faq-` naamruimte.
 *
 * --scs-faq-accent zet je op een omliggend element (bv. body of thema-wrapper) om de site-eigen
 * merkkleur te gebruiken i.p.v. de ontwerp-standaardkleur.
 */
.scs-faq-section {
	padding: 60px 0;
}
.scs-faq-wrap {
	max-width: 820px;
	margin: 0 auto;
	padding: 0 20px;
}
.scs-faq-head {
	text-align: center;
	margin-bottom: 40px;
}
.scs-faq-eyebrow {
	font-family: "Saira", system-ui, sans-serif;
	text-transform: uppercase;
	letter-spacing: .22em;
	font-size: 12px;
	font-weight: 600;
	color: var(--scs-faq-accent, #1C69D4);
}
.scs-faq-title {
	font-family: "Saira", system-ui, sans-serif;
	font-size: clamp(26px, 3.4vw, 38px);
	font-weight: 700;
	line-height: 1.15;
	margin: 12px 0 0;
}
.scs-faq {
	border-top: 1px solid #DCE0E3;
}
.scs-faq:last-child {
	border-bottom: 1px solid #DCE0E3;
}
.scs-faq-toggle {
	width: 100%;
	text-align: left;
	background: none;
	border: none;
	cursor: pointer;
	font-family: "Saira", system-ui, sans-serif;
	font-size: 18px;
	font-weight: 600;
	color: #11151A;
	padding: 20px 44px 20px 0;
	position: relative;
}
.scs-faq-toggle:hover {
	color: var(--scs-faq-accent, #1C69D4);
}
.scs-faq-plus {
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	display: grid;
	place-items: center;
}
.scs-faq-plus::before,
.scs-faq-plus::after {
	content: "";
	position: absolute;
	background: var(--scs-faq-accent, #1C69D4);
	border-radius: 2px;
}
.scs-faq-plus::before {
	width: 14px;
	height: 2px;
}
.scs-faq-plus::after {
	width: 2px;
	height: 14px;
	transition: .2s;
}
.scs-faq.open .scs-faq-plus::after {
	transform: rotate(90deg);
	opacity: 0;
}
.scs-faq-answer {
	max-height: 0;
	overflow: hidden;
	transition: max-height .3s ease;
}
.scs-faq-answer-inner {
	padding: 0 44px 22px 0;
	color: #5A636B;
	font-size: 15px;
	line-height: 1.6;
}
.scs-faq-answer-inner > *:last-child {
	margin-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
	.scs-faq-answer {
		transition: none;
	}
}