/* Propagate the stretched height of a flex/grid row (e.g. core/columns,
   which stretches its columns to match the tallest one by default) down
   through ACF's block wrapper so several Image Box blocks placed side by
   side end up the same height as each other — without forcing a fixed
   min-height when the block is used on its own. */
.wp-block-acf-bild-block {
	height: 100%;
}

.kg-image-box {
	height: 100%;
}

.image-box-container {	
	margin-top: 3rem!important;
}

.kg-image-box-link {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	height: 100%;
	border-radius: 0.5rem;
	/* Light, on-brand fallback for when no image is set. */
	background-color: #e8eedc;
	background-size: cover;
	background-position: center;
	color: #004876;
	text-decoration: none;
	overflow: hidden;
}

.kg-image-box-overlay {
	position: absolute;
	inset: 0;
	/* Flat, uniform light wash — no fade/gradient — so any photo behind the
	   text reads brighter and more washed-out instead of dark or graduated. */
	background-color: rgba(255, 255, 255, 0.6);
}

.kg-image-box-text {
	position: relative;
	display: block;
	padding: 1.5rem;
	font-weight: 600;
}

.kg-image-box-cta {
	position: relative;
	align-self: flex-end; /* bottom-right, since the link is a column flexbox */
	margin: auto 1rem 1rem 0; /* margin-top: auto pushes it down to the bottom */
	/* Same background as the box itself, so it blends in instead of sitting
	   on top as a separate white pill. */
	color: #004876;
}