/* FAQs accordion — Figma 2020-1810 */

.faqs {
	background: #f5f5f5;
	padding-top:    var( --faq-pt, 4.5rem );
	padding-bottom: var( --faq-pb, 4.5rem );
	margin-top:     var( --faq-mt, 0rem );
	margin-bottom:  var( --faq-mb, 0rem );
}

.faqs__inner {
	max-width: 53rem;
	margin: 0 auto;
	padding: 0 1.5rem;
}

.faqs__head {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.75rem;
	margin-bottom: 3.5rem;
}
.faqs__eyebrow {
	font-family: 'Jost', system-ui, sans-serif;
	font-size: 1rem; font-weight: 500; letter-spacing: 0.25rem;
	text-transform: uppercase; line-height: 1.35; color: rgba( 0, 13, 38, 0.7 ); margin: 0;
}
.faqs__heading {
	font-family: 'Quincy', Georgia, serif;
	font-size: clamp( 2.5rem, 5vw, 3.5rem );
	font-weight: 400; line-height: clamp( 2.875rem, 5.75vw, 4.025rem ); color: #000d26; margin: 0;
}

/* List */
.faqs__item { border-bottom: 1px solid rgba( 0, 13, 38, 0.12 ); }
.faqs__item:first-child { border-top: 1px solid rgba( 0, 13, 38, 0.12 ); }

.faqs__q {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	padding: 1.375rem 0;     /* 22px */
	background: none;
	border: 0;
	cursor: pointer;
	text-align: left;
}
.faqs__q-text {
	font-family: 'Quincy', Georgia, serif;
	font-size: 1.5rem;       /* 24px */
	font-weight: 400;
	line-height: 1.25;
	color: #000d26;
}

/* Plus / minus icon */
.faqs__icon {
	position: relative;
	flex-shrink: 0;
	width: 2.25rem;          /* 36px */
	height: 2.25rem;
	border-radius: 50%;
	background: #0b5cff;
	opacity: 0.85;
	transition: opacity 0.15s;
}
.faqs__q:hover .faqs__icon { opacity: 1; }
.faqs__icon::before,
.faqs__icon::after {
	content: '';
	position: absolute;
	top: 50%; left: 50%;
	background: #fff;
	border-radius: 1px;
	transition: transform 0.25s ease, opacity 0.2s ease;
}
.faqs__icon::before { width: 0.875rem; height: 0.125rem; transform: translate( -50%, -50% ); }       /* horizontal */
.faqs__icon::after  { width: 0.125rem; height: 0.875rem; transform: translate( -50%, -50% ); }       /* vertical   */
.faqs__item.is-open .faqs__icon::after { transform: translate( -50%, -50% ) scaleY( 0 ); opacity: 0; }

/* Answer panel */
.faqs__a {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.3s ease;
}
.faqs__item.is-open .faqs__a { grid-template-rows: 1fr; }
.faqs__a-inner { overflow: hidden; }
.faqs__a-inner p {
	font-family: 'Source Sans 3', system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.55;
	color: #000d26;
	margin: 0;
	padding: 0 0 1.375rem;
	max-width: 43.75rem;     /* 700px */
}

@media (max-width: 600px) {
	.faqs {
		padding-top:    var( --faq-pt-m, var( --faq-pt, 3rem ) );
		padding-bottom: var( --faq-pb-m, var( --faq-pb, 3rem ) );
		margin-top:     var( --faq-mt-m, var( --faq-mt, 0rem ) );
		margin-bottom:  var( --faq-mb-m, var( --faq-mb, 0rem ) );
	}
	.faqs__inner { padding: 0 1rem; }
	.faqs__head { margin-bottom: 2.5rem; }
	.faqs__q-text { font-size: 1.25rem; }
}
