/* Blok „FAQ" */

.rb-faq {
	background: var(--rb-color-bg);
	padding-block: var(--rb-space-12) var(--rb-space-16);
}

/* Nadtytuł „FAQ" — duży, cienki, z kreską na pełną szerokość kontenera. */
.rb-faq__eyebrow {
	font-size: clamp(2.25rem, 1.4rem + 3vw, 3.75rem);
	line-height: 1;
	font-weight: 300;
	letter-spacing: 0.01em;
	color: var(--rb-color-heading);
	margin-bottom: var(--rb-space-5);
	padding-bottom: var(--rb-space-5);
	border-bottom: 1px solid var(--rb-gray-300);
}

.rb-faq__grid {
	display: grid;
	grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
	gap: clamp(2rem, 4vw, 4rem);
	align-items: start;
}

/* ---------------------------------- sygnet ------------------------------------- */

.rb-faq__aside {
	display: flex;
	align-items: flex-end;
	gap: var(--rb-space-5);
	padding-top: var(--rb-space-6);
}

.rb-faq__sygnet {
	width: clamp(140px, 18vw, 240px);
	height: auto;
}

.rb-faq__heading {
	font-size: clamp(1.125rem, 0.9rem + 0.7vw, 1.5rem);
	line-height: 1.3;
	font-weight: 600;
	margin-bottom: var(--rb-space-6);
}

/* --------------------------------- lista pytań --------------------------------- */

.rb-faq__list { display: grid; }

.rb-faq__item { border-bottom: 1px solid var(--rb-navy-200); }

.rb-faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rb-space-5);
	padding: var(--rb-space-5) 0;
	font-size: var(--rb-fs-body-l);
	line-height: 1.4;
	color: var(--rb-color-heading);
	cursor: pointer;
	list-style: none;
	transition: color var(--rb-transition-fast);
}
.rb-faq__question::-webkit-details-marker { display: none; }
.rb-faq__question:hover { color: var(--rb-color-accent); }
.rb-faq__question:focus-visible { outline: 3px solid var(--rb-orange-300); outline-offset: 4px; }

.rb-faq__chevron {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: var(--rb-radius-full);
	background: var(--rb-color-accent);
	color: #fff;
	transition: transform var(--rb-transition-fast);
}
/* Ikona to strzałka w prawo — obracamy w dół, żeby czytała się jako „rozwiń". */
.rb-faq__chevron .rb-icon { transform: rotate(90deg); }
.rb-faq__item[open] .rb-faq__chevron { transform: rotate(180deg); }

.rb-faq__answer {
	padding: 0 var(--rb-space-10) var(--rb-space-6) 0;
	font-size: var(--rb-fs-body-s);
	line-height: 1.65;
	color: var(--rb-gray-600);
}
.rb-faq__answer p { margin-bottom: var(--rb-space-4); }
.rb-faq__answer p:last-child { margin-bottom: 0; }
.rb-faq__answer strong { color: var(--rb-color-heading); }

/* ---------------------------------- responsywnie ------------------------------- */

@media (max-width: 900px) {
	.rb-faq { padding-block: var(--rb-space-8) var(--rb-space-10); }

	.rb-faq__grid {
		grid-template-columns: 1fr;
		gap: var(--rb-space-6);
	}

	/* Sygnet ląduje obok podpisu, po prawej — tak jak w projekcie mobilnym. */
	.rb-faq__aside {
		flex-direction: row-reverse;
		align-items: center;
		justify-content: flex-end;
		gap: var(--rb-space-4);
		padding-top: 0;
	}
	.rb-faq__sygnet { width: clamp(110px, 34vw, 170px); }
	.rb-faq__heading { margin-bottom: 0; }

	.rb-faq__question { font-size: var(--rb-fs-body-m); padding: var(--rb-space-4) 0; }
	.rb-faq__answer { padding-right: 0; }
}
