/*
 * starterCreative — FAQ accordion (sc-faq)
 * Child themes may keep .ki-faq* rules for branding; this file covers standalone parent use.
 */

.sc-faq {
	display: flex;
	flex-direction: column;
	gap: var(--sc-spacing-md);
}

.sc-faq__item {
	background: var(--sc-color-bg);
	border-radius: var(--sc-radius-lg);
	border: 1px solid var(--sc-color-border);
	box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.06 );
	overflow: hidden;
	transition: box-shadow 0.3s, border-color 0.3s;
}

.sc-faq__item:hover {
	box-shadow: 0 4px 12px rgba( 0, 0, 0, 0.08 );
	border-color: var(--sc-color-accent);
}

.sc-faq__question {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sc-spacing-md);
	padding: 1.25rem 1.5rem;
	background: none;
	border: none;
	cursor: pointer;
	text-align: left;
	font-family: var(--sc-font-primary);
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--sc-color-text-muted);
	transition: color 0.2s;
}

.sc-faq__question:hover {
	color: var(--sc-color-accent);
}

.sc-faq__question[aria-expanded="true"] {
	color: var(--sc-color-accent);
}

.sc-faq__chevron {
	flex-shrink: 0;
	transition: transform 0.3s ease;
	color: var(--sc-color-accent);
}

.sc-faq__question[aria-expanded="true"] .sc-faq__chevron {
	transform: rotate(180deg);
}

.sc-faq__answer {
	padding: 0 1.5rem 1.25rem;
	font-size: var(--sc-font-size-base);
	line-height: var(--sc-line-height);
	color: var(--sc-color-text-muted);
}

.sc-faq__answer[hidden] {
	display: none;
}