/* Rise With Teagan — FAQ accordion
   ------------------------------------------------------------------
   Figma 1437-4516. Rows sit 70px apart: the question row plus an 18px gap to
   its hairline, then 16px to the next question.

   The panel is animated by script rather than CSS, because a closed <details>
   hides its children outright — there is no height for a transition to run
   between. The script sets --rwt-faq-h and this file does the rest, so with
   JavaScript off the accordion still opens and closes, just without the slide. */

.rwt-faq {
	width: 100%;
}

.rwt-faq__item {
	border-bottom: 2px solid var( --e-global-color-ec00e88, #F0D5CF );
	padding-bottom: 18px;
	margin-bottom: 16px;
}

.rwt-faq__item:last-child {
	margin-bottom: 0;
}

/* ------------------------------------------------------------- question */

.rwt-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	cursor: pointer;
	list-style: none;          /* Firefox */

	font-family: var( --e-global-typography-2b41e17-font-family, "Fraunces" ), serif;
	font-size: var( --e-global-typography-2b41e17-font-size, 22px );
	font-weight: var( --e-global-typography-2b41e17-font-weight, 400 );
	line-height: var( --e-global-typography-2b41e17-line-height, 1.32em );
	color: var( --rwt-faq-q, var( --e-global-color-primary, #BC5F50 ) );
	text-align: left;
}

/* The default disclosure triangle, in every engine that draws one. */
.rwt-faq__q::-webkit-details-marker,
.rwt-faq__q::marker {
	display: none;
	content: "";
}

.rwt-faq__q:focus-visible {
	outline: 2px solid var( --e-global-color-primary, #BC5F50 );
	outline-offset: 4px;
}

/* ---------------------------------------------------------------- mark */

.rwt-faq__mark {
	flex: 0 0 30px;
	width: 30px;
	height: 30px;
}

.rwt-faq__ring {
	stroke: var( --e-global-color-ec00e88, #F0D5CF );
	fill: none;
}

.rwt-faq__chev {
	stroke: var( --rwt-faq-q, var( --e-global-color-primary, #BC5F50 ) );
	transform-origin: 16px 16px;
	transition: transform 0.28s ease;
}

.rwt-faq__item[open] .rwt-faq__chev {
	transform: rotate( 180deg );
}

/* --------------------------------------------------------------- answer */

.rwt-faq__panel {
	overflow: hidden;
}

.rwt-faq__a {
	padding-top: 14px;

	font-family: var( --e-global-typography-primary-font-family, "DM Sans" ), sans-serif;
	font-size: var( --e-global-typography-primary-font-size, 16px );
	font-weight: var( --e-global-typography-primary-font-weight, 400 );
	line-height: var( --e-global-typography-text-line-height, 1.5em );
	color: var( --rwt-faq-a, var( --e-global-color-text, #3D322B ) );
}

.rwt-faq__a p {
	margin: 0 0 12px;
}

.rwt-faq__a p:last-child {
	margin-bottom: 0;
}

.rwt-faq__a a {
	color: var( --e-global-color-primary, #BC5F50 );
	text-decoration: underline;
}

@media ( prefers-reduced-motion: reduce ) {

	.rwt-faq__chev {
		transition: none;
	}
}
