/* =========================================================
   Blok: CTA-band — gecentreerde call-to-action met gouden knop
   Zelfstandig (home.css/layout.css worden niet overal ingeladen).
   ========================================================= */
.brini-block--cta {
	padding: 72px 0;
	text-align: center;
	overflow: hidden;
}

/* Standaard (zonder afbeelding) volgt de bg-keuze uit _base.css:
   wit / grijs / groen. Bij 'groen' zorgt _base.css voor witte tekst. */

.brini-block--cta__inner {
	position: relative;
	z-index: 2;
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.brini-block--cta__title {
	font-family: var(--sellabees-font-heading);
	font-size: 36px;
	font-weight: 600;
	line-height: 1.12;
	color: var(--sellabees-green, #2d572c);
	margin: 0 0 16px;
}

.brini-block--cta__text {
	font-family: var(--sellabees-font-body);
	font-weight: 300;
	font-size: 17px;
	line-height: 1.7;
	color: var(--sellabees-ink, #2b2b2b);
	margin: 0 0 28px;
	max-width: 56ch;
}
.brini-block--cta__text > :first-child { margin-top: 0; }
.brini-block--cta__text > :last-child { margin-bottom: 0; }

/* Gouden knop — Brini-accent */
.brini-block--cta__btn {
	display: inline-block;
	font-family: var(--sellabees-font-ui);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--sellabees-ink, #2b2b2b);
	background: var(--sellabees-gold, #fcc72d);
	padding: 14px 34px;
	border-radius: 4px;
	border: 0;
	cursor: pointer;
	transition: opacity .15s ease, transform .15s ease;
}
.brini-block--cta__btn:hover,
.brini-block--cta__btn:focus {
	opacity: .9;
	transform: translateY(-1px);
	color: var(--sellabees-ink, #2b2b2b);
}

/* --- Groene achtergrond: titel + tekst wit (vult _base.css aan voor cta-specifieke classes) --- */
.brini-block--cta.brini-block--bg-groen .brini-block--cta__title,
.brini-block--cta.brini-block--bg-groen .brini-block--cta__text {
	color: #fff;
}

/* --- Variant met achtergrond-afbeelding --- */
.brini-block--cta.brini-block--cta-image {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.brini-block--cta.brini-block--cta-image .brini-block--cta__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(31, 61, 30, .62); /* groen-getint donker, leesbaarheid */
}
.brini-block--cta.brini-block--cta-image .brini-block--cta__title,
.brini-block--cta.brini-block--cta-image .brini-block--cta__text {
	color: #fff;
}
.brini-block--cta.brini-block--cta-image {
	padding-top: 96px;
	padding-bottom: 96px;
}

@media (max-width: 768px) {
	.brini-block--cta { padding: 48px 0; }
	.brini-block--cta.brini-block--cta-image { padding: 64px 0; }
	.brini-block--cta__title { font-size: 28px; }
	.brini-block--cta__text { font-size: 16px; }
	.brini-block--cta__btn { padding: 12px 28px; }
}
