/* ==========================================================================
   Biography Studio — page-faq.css
   FAQ — clean accordion, cream hero, white list section.
   ========================================================================== */


/* ==========================================================================
   HERO
   ========================================================================== */
.bsfaq-hero {
	background-color: var(--bs-cream);
	background-image:
		radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,254,250,0.8) 0%, transparent 60%);
	padding:    80px 0 88px;
	text-align: center;
}
.bsfaq-hero__inner {
	display:        flex;
	flex-direction: column;
	align-items:    center;
}
.bsfaq-hero__label {
	font-family:    var(--bs-ui-font);
	font-size:      0.875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color:          var(--bs-pink-dark);
	margin-bottom:  20px;
}
.bsfaq-hero__heading {
	font-family:    var(--bs-heading-font);
	font-size:      clamp(2rem, 4vw, 3.75rem);
	font-weight:    400;
	font-style:     italic;
	line-height:    1.12;
	letter-spacing: -0.015em;
	color:          var(--bs-navy);
}


/* ==========================================================================
   FAQ LIST SECTION
   ========================================================================== */
.bsfaq-list-section {
	background:  var(--bs-white);
	padding:     80px 0 96px;
	border-top:  1px solid var(--bs-border-light);
}
.bsfaq-list {
	max-width: 760px;
}
.bsfaq-empty {
	font-family: var(--bs-body-font);
	font-style:  italic;
	color:       var(--bs-text-muted);
}


/* ==========================================================================
   ACCORDION ITEM
   ========================================================================== */
.bsfaq-item {
	border-bottom: 1px solid var(--bs-border-light);
}
.bsfaq-item:first-child {
	border-top: 1px solid var(--bs-border-light);
}

/* Trigger button */
.bsfaq-item__trigger {
	display:         flex;
	align-items:     center;
	justify-content: space-between;
	gap:             24px;
	width:           100%;
	padding:         24px 0;
	background:      none;
	border:          none;
	cursor:          pointer;
	text-align:      left;
}
.bsfaq-item__trigger:hover .bsfaq-item__q {
	color: var(--bs-navy);
}

/* Question text */
.bsfaq-item__q {
	font-family:    var(--bs-ui-font);
	font-size:      1rem;
	font-weight:    600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color:          var(--bs-text);
	line-height:    1.4;
	transition:     color 0.2s ease;
}
.bsfaq-item--open .bsfaq-item__q {
	color: var(--bs-navy);
}

/* +/− icon */
.bsfaq-item__icon {
	flex-shrink: 0;
	width:       20px;
	height:      20px;
	position:    relative;
}
.bsfaq-item__icon::before,
.bsfaq-item__icon::after {
	content:    '';
	position:   absolute;
	background: var(--bs-pink);
	border-radius: 1px;
	transition: transform 0.25s ease, opacity 0.25s ease;
}
/* Horizontal bar */
.bsfaq-item__icon::before {
	width:  100%;
	height: 2px;
	top:    50%;
	left:   0;
	transform: translateY(-50%);
}
/* Vertical bar (hidden when open) */
.bsfaq-item__icon::after {
	width:  2px;
	height: 100%;
	top:    0;
	left:   50%;
	transform: translateX(-50%);
}
.bsfaq-item--open .bsfaq-item__icon::after {
	transform: translateX(-50%) rotate(90deg);
	opacity:   0;
}

/* Answer panel */
.bsfaq-item__body {
	max-height:  0;
	overflow:    hidden;
	transition:  max-height 0.35s ease;
}
.bsfaq-item--open .bsfaq-item__body {
	max-height: 2000px; /* generous ceiling */
}

.bsfaq-item__answer {
	padding-bottom: 28px;
	font-family:    var(--bs-body-font);
	font-size:      1.0625rem;
	line-height:    1.85;
	color:          var(--bs-text);
}
.bsfaq-item__answer p            { margin-bottom: 1.4em; }
.bsfaq-item__answer p:last-child { margin-bottom: 0; }
.bsfaq-item__answer a {
	color:                 var(--bs-navy);
	text-decoration:       underline;
	text-underline-offset: 3px;
}
.bsfaq-item__answer a:hover { color: var(--bs-pink-dark); }


/* ==========================================================================
   CLOSING CTA
   ========================================================================== */
.bsfaq-close {
	background:  var(--bs-cream);
	padding:     64px 0;
	border-top:  1px solid var(--bs-border-light);
	text-align:  center;
}
.bsfaq-close__inner {
	display:         flex;
	flex-direction:  column;
	align-items:     center;
	gap:             20px;
}
.bsfaq-close__text {
	font-family: var(--bs-body-font);
	font-size:   1.0625rem;
	font-style:  italic;
	color:       var(--bs-text-muted);
}


/* ==========================================================================
   RESPONSIVE — below 768px
   ========================================================================== */
@media ( max-width: 768px ) {

	.bsfaq-hero { padding: 56px 0 64px; }

	.bsfaq-list-section { padding: 56px 0 72px; }

	.bsfaq-item__q { font-size: 0.9375rem; }

	.bsfaq-close { padding: 48px 0; }

}