/* ==========================================================================
   faq.css — "Frequently asked questions" accordion (Figma-matched)
   ========================================================================== */

.ada-faq {
	background: var(--ada-bg);
	padding: clamp( 48px, 8vw, 96px ) clamp( 16px, 10vw, 120px );
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
}

.ada-faq__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	text-align: center;
	max-width: 734px;
}

.ada-faq__title {
	margin: 0;
	font-family: var(--ada-font-display);
	font-weight: 550;
	font-size: clamp( 30px, 4.4vw, 48px );
	line-height: 1.17;
	letter-spacing: -0.01em;
	color: var(--ada-hero-title);
	text-wrap: balance;
}

.ada-faq__sub {
	margin: 0;
	max-width: 460px;
	font-family: var(--ada-font);
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: -0.011em;
	color: var(--ada-footer-ink);
}

/* ---- List --------------------------------------------------------------- */
.ada-faq__list {
	width: 100%;
	max-width: 652px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.ada-faq__eyebrow {
	margin: 0 0 -2px;
	font-family: var(--ada-font);
	font-weight: 500;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ada-ink-muted);
}
.ada-faq__eyebrow + .ada-faq__eyebrow { margin-top: 12px; }

.ada-faq__item {
	background: var(--ada-card-bg);
	border-radius: 16px;
}

.ada-faq__q {
	display: flex;
	align-items: center;
	gap: 20px;
	width: 100%;
	padding: 20px;
	border: 0;
	background: transparent;
	text-align: left;
	font: inherit;
	color: inherit;
	cursor: pointer;
}

.ada-faq__num {
	flex: none;
	width: 24px;
	font-family: var(--ada-font);
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	color: var(--ada-ink-muted);
	font-variant-numeric: tabular-nums;
}

.ada-faq__label {
	flex: 1 1 auto;
	font-family: var(--ada-font);
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: -0.011em;
	color: var(--ada-footer-ink);
	transition: color 0.2s ease;
}

.ada-faq__icon {
	position: relative;
	flex: none;
	width: 24px;
	height: 24px;
	color: var(--ada-ink-muted);
	transition: color 0.25s ease;
}
/* Stack plus + cross so they can cross-fade/rotate between states. */
.ada-faq__plus,
.ada-faq__cross {
	position: absolute;
	inset: 0;
	display: block;
	width: 24px;
	height: 24px;
	transition: opacity 0.25s ease, transform 0.25s ease;
}
.ada-faq__plus  { opacity: 1; transform: rotate( 0deg ); }
.ada-faq__cross { opacity: 0; transform: rotate( -90deg ); }

/* ---- Open state --------------------------------------------------------- */
.ada-faq__item {
	transition: background-color 0.25s ease;
}
.ada-faq__item.is-open { background: var(--ada-card-bg); }
.ada-faq__item.is-open .ada-faq__label { color: var(--ada-hero-title); }
.ada-faq__item.is-open .ada-faq__icon  { color: var(--ada-hero-title); }
.ada-faq__item.is-open .ada-faq__plus  { opacity: 0; transform: rotate( 90deg ); }
.ada-faq__item.is-open .ada-faq__cross { opacity: 1; transform: rotate( 0deg ); }

.ada-faq__a {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: max-height 0.32s ease, opacity 0.28s ease;
}
.ada-faq__item.is-open .ada-faq__a { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
	.ada-faq__plus,
	.ada-faq__cross,
	.ada-faq__a,
	.ada-faq__item { transition: none; }
}

.ada-faq__a-inner {
	padding: 0 20px 20px 64px;
	font-family: var(--ada-font);
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: -0.006em;
	color: var(--ada-footer-ink);
}

@media (max-width: 560px) {
	.ada-faq__q { gap: 12px; padding: 16px; }
	.ada-faq__a-inner { padding-left: 48px; }
}
