/* Blok „Tekst z kartami" */

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

/*
 * Desktop: trzy kolumny — tekst z CTA, karta wyróżniona, stos jasnych kart.
 * CTA siedzi pod tekstem w pierwszej kolumnie, dlatego siatka ma nazwane obszary.
 */
.rb-textcards__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.85fr) minmax(0, 1fr);
	grid-template-areas:
		"intro highlight stack"
		"cta   highlight stack";
	align-content: start;
	gap: clamp(1.5rem, 3vw, 2.5rem);
}

.rb-textcards__intro { grid-area: intro; }
.rb-textcards__cta   { grid-area: cta; align-self: end; }

.rb-textcards__heading {
	font-size: clamp(1.375rem, 0.95rem + 1.4vw, 2rem);
	line-height: 1.3;
	margin-bottom: var(--rb-space-6);
}

.rb-textcards__text {
	font-size: var(--rb-fs-body-m);
	line-height: 1.7;
	color: var(--rb-gray-600);
}
.rb-textcards__text p:last-child { margin-bottom: 0; }

.rb-textcards__cta-lead {
	font-weight: 700;
	color: var(--rb-color-heading);
	margin-bottom: var(--rb-space-4);
}

/* ------------------------------ karta wyróżniona ------------------------------ */

.rb-textcards__highlight {
	grid-area: highlight;
	/* Karta wypełnia całą kolumnę, a nie tylko wysokość swojej treści. */
	align-self: stretch;
	background: var(--rb-navy-900);
	color: rgb(255 255 255 / 0.85);
	border-radius: var(--rb-radius-2xl);
	padding: clamp(1.5rem, 2.4vw, 2.25rem);
}

.rb-textcards__highlight-icon { display: block; margin-bottom: var(--rb-space-8); }
.rb-textcards__highlight-icon img { width: 48px; height: auto; }

.rb-textcards__highlight-heading {
	color: #fff;
	font-size: clamp(1.125rem, 0.9rem + 0.7vw, 1.5rem);
	line-height: 1.3;
	font-weight: 700;
	margin-bottom: var(--rb-space-5);
}

.rb-textcards__highlight-text {
	font-size: var(--rb-fs-body-s);
	line-height: 1.65;
}
.rb-textcards__highlight-text p:last-child { margin-bottom: 0; }

/* --------------------------------- karty jasne -------------------------------- */

.rb-textcards__stack {
	grid-area: stack;
	display: grid;
	align-content: start;
	gap: clamp(1rem, 2vw, 1.5rem);
}

/* Przy dwóch kartach stos wypełnia kolumnę równomiernie — bez luki na dole. */
.rb-textcards__stack:has(> :nth-child(2):last-child) { align-content: stretch; }

.rb-textcards__card {
	background: var(--rb-color-bg-alt);
	border-radius: var(--rb-radius-xl);
	padding: clamp(1.25rem, 2vw, 1.75rem);
}

.rb-textcards__card-title {
	font-size: var(--rb-fs-h5);
	font-weight: 700;
	margin-bottom: var(--rb-space-3);
}

.rb-textcards__card-text {
	font-size: var(--rb-fs-body-s);
	line-height: 1.6;
	color: var(--rb-gray-600);
}
.rb-textcards__card-text p:last-child { margin-bottom: 0; }

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

@media (max-width: 1023px) {
	/*
	 * Mobile z projektu: tekst, karta wyróżniona, karty jasne, a CTA na końcu
	 * i wyśrodkowane — inaczej niż na desktopie, gdzie siedzi pod tekstem.
	 */
	.rb-textcards { padding-block: var(--rb-space-10); }
	.rb-textcards__grid {
		grid-template-columns: 1fr;
		grid-template-areas:
			"intro"
			"highlight"
			"stack"
			"cta";
		gap: var(--rb-space-6);
	}
	.rb-textcards__cta {
		align-self: auto;
		text-align: center;
		margin-top: var(--rb-space-4);
	}
	.rb-textcards__cta-lead {
		font-family: var(--rb-font-serif);
		font-size: 1.25rem;
		font-weight: 600;
	}
	.rb-textcards__highlight-icon { margin-bottom: var(--rb-space-4); }
}