/**
 * Kinderpark Bildtext CTA v1.1.8
 * Bootstrap-5-Ergänzungen ohne Tailwind.
 * Bewusst unminifiziert, damit Anpassungen im Projekt einfach möglich bleiben.
 */
.mm-kpbtc {
	--color-white: #ffffff;
	--color-sky-50: #e2edf4;
	--color-sky-100: #c5d8e6;
	--color-sky-200: #a6c1d5;
	--color-sky-300: #86a9c3;
	--color-sky-400: #5f86a4;
	--color-sky-500: #2f516a;
	--color-sky-600: #29475d;
	--color-sky-700: #233d50;
	--color-sky-800: #1c3343;
	--color-sky-900: #162936;
	--color-emerald-50: #e8f3e2;
	--color-emerald-100: #d2e7c7;
	--color-emerald-200: #bbdba9;
	--color-emerald-500: #79b255;
	--color-emerald-600: #6ca04c;
	--color-emerald-700: #5f8e43;
	--mm-kpbtc-accent: var(--color-emerald-500);
	--mm-kpbtc-accent-strong: var(--color-emerald-700);
	--mm-kpbtc-accent-soft: var(--color-emerald-100);
	--mm-kpbtc-second: var(--color-sky-500);
	--mm-kpbtc-second-strong: var(--color-sky-700);
	--mm-kpbtc-second-soft: var(--color-sky-100);
	position: relative;
	overflow: hidden;
}
.mm-kpbtc--theme-sky {
	--mm-kpbtc-accent: var(--color-sky-500);
	--mm-kpbtc-accent-strong: var(--color-sky-700);
	--mm-kpbtc-accent-soft: var(--color-sky-100);
	--mm-kpbtc-second: var(--color-sky-600);
	--mm-kpbtc-second-strong: var(--color-sky-800);
	--mm-kpbtc-second-soft: var(--color-sky-50);
	--text-color: #4b5563;
	--headline-color: #111827;
}
.mm-kpbtc--theme-emerald-sky {
	--mm-kpbtc-accent: var(--color-emerald-500);
	--mm-kpbtc-accent-strong: var(--color-emerald-700);
	--mm-kpbtc-accent-soft: var(--color-emerald-100);
	--mm-kpbtc-second: var(--color-emerald-600);
	--mm-kpbtc-second-strong: var(--color-emerald-700);
	--mm-kpbtc-second-soft: var(--color-emerald-50);
	--text-color: #fff;
	--headline-color: #fff;
	--infobox-bg: color-mix(in oklab, var(--color-white) 10%, transparent);
}
.mm-kpbtc--theme-emerald {
	--mm-kpbtc-accent: var(--color-emerald-500);
	--mm-kpbtc-accent-strong: var(--color-emerald-700);
	--mm-kpbtc-accent-soft: var(--color-emerald-100);
	--mm-kpbtc-second: var(--color-emerald-600);
	--mm-kpbtc-second-strong: var(--color-emerald-700);
	--mm-kpbtc-second-soft: var(--color-emerald-50);
	--text-color: #fff;
	--headline-color: #fff;
	--infobox-bg: color-mix(in oklab, var(--color-white) 10%, transparent);
}
.mm-kpbtc--theme-neutral {
	--mm-kpbtc-accent: #6b7280;
	--mm-kpbtc-accent-strong: #374151;
	--mm-kpbtc-accent-soft: #f3f4f6;
	--mm-kpbtc-second: #111827;
	--mm-kpbtc-second-strong: #030712;
	--mm-kpbtc-second-soft: #f9fafb;
	--text-color: #4b5563;
	--headline-color: #111827;
}

.mm-kpbtc--bg-emerald.mm-kpbtc--theme-emerald {
	--text-color: #4b5563;
	--headline-color: #111827;
}


.mm-kpbtc--bg-emerald-sky { background: linear-gradient(to right bottom, rgb(121, 178, 85) 0%, rgb(108, 160, 76) 50%, oklch(0.6 0.118 184.704) 100%); }
.mm-kpbtc--bg-sky { background: linear-gradient(to right bottom in oklab, rgb(226, 237, 244) 0%, rgb(226, 237, 244) 50%, rgb(197, 216, 230) 100%); }
.mm-kpbtc--bg-emerald { background: linear-gradient(135deg, var(--color-emerald-50), #ffffff 55%, var(--color-emerald-100)); }
.mm-kpbtc--bg-white { background-image: linear-gradient(to right bottom in oklab, rgb(226, 237, 244) 0%, rgb(226, 237, 244) 50%, rgb(255, 255, 255) 100%); }
.mm-kpbtc--bg-transparent { background: transparent; }
.mm-kpbtc--space-compact { padding-block: 3.5rem; }
.mm-kpbtc--space-default { padding-block: 5rem; }
.mm-kpbtc--space-large { padding-block: 6.5rem; }
.mm-kpbtc__container { position: relative; z-index: 1; padding-inline: 1rem; }
.mm-kpbtc__container--wide { max-width: 80rem; margin-inline: auto; }
.mm-kpbtc__container--fluid { padding-inline: clamp(1rem, 4vw, 3rem); }
.mm-kpbtc__lights { position: absolute; inset: 0; pointer-events: none; opacity: 0.22; }
.mm-kpbtc__light { position: absolute; display: block; border-radius: 999rem; filter: blur(4rem); animation: mm-kpbtc-pulse 6s ease-in-out infinite; }
.mm-kpbtc__light--one { top: 10%; left: 4%; width: 20rem; height: 20rem; background: var(--color-emerald-200); }
.mm-kpbtc__light--two { right: 4%; bottom: 10%; width: 24rem; height: 24rem; background: var(--color-sky-200); animation-delay: 1.2s; }
@keyframes mm-kpbtc-pulse { 0%, 100% { opacity: 0.65; transform: scale(1); } 50% { opacity: 1; transform: scale(1.045); } }
.mm-kpbtc__row { position: relative; }
@media (min-width: 992px) {
	.mm-kpbtc--image-left .mm-kpbtc__image-col { order: 1; }
	.mm-kpbtc--image-left .mm-kpbtc__text-col { order: 2; }
	.mm-kpbtc--image-right .mm-kpbtc__text-col { order: 1; }
	.mm-kpbtc--image-right .mm-kpbtc__image-col { order: 2; }
}
.mm-kpbtc__content { max-width: 42rem; }
.mm-kpbtc__badge { display: inline-flex; align-items: center; gap: 0.35rem; margin-bottom: 1.5rem; padding: 0.5rem 1rem; border-radius: 999rem; color: var(--mm-kpbtc-accent-strong); background: color-mix(in srgb, var(--mm-kpbtc-accent-soft) 100%, #ffffff); font-size: 0.875rem; font-weight: 700; line-height: 1.4; }
.mm-kpbtc__badge strong, .mm-kpbtc__badge b { font-weight: 800; }
.mm-kpbtc__badge em { font-style: italic; }
.mm-kpbtc__headline { margin: 0 0 1.5rem; color: var(--headline-color); font-size: clamp(2rem, 5vw, 3.125rem); font-weight: 800; line-height: 1.14; letter-spacing: -0.035em; }
.mm-kpbtc__text { color: var(--text-color); font-size: 1.1225rem; line-height: 1.75; }
.mm-kpbtc__text > *:last-child { margin-bottom: 0; }
.mm-kpbtc__info-list { display: grid; gap: 0.75rem; margin-top: 2rem; margin-bottom: 2rem; }
.mm-kpbtc-info { display: flex; align-items: center; gap: 0.75rem; padding: 1rem; border: 0.0625rem solid color-mix(in srgb, var(--mm-kpbtc-accent-soft) 78%, #ffffff); border-radius: 1rem; background: rgba(255, 255, 255, 1); backdrop-filter: blur(0.35rem); -webkit-backdrop-filter: blur(0.35rem); }
.mm-kpbtc-info__icon { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 0.75rem; color: #ffffff; background: var(--mm-kpbtc-accent); font-size: 1rem; line-height: 1; }
.mm-kpbtc-info__body { flex: 1 1 auto; min-width: 0; }
.mm-kpbtc-info__title { margin: 0 0 0.18rem; color: #111827; font-size: 0.9375rem; font-weight: 800; line-height: 1.35; }
.mm-kpbtc-info__text { margin: 0; color: #4b5563; font-size: 0.875rem; line-height: 1.65; }
.mm-kpbtc__buttons { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.75rem; }
.mm-kpbtc__button { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.9rem 1.35rem; border-radius: 999rem; font-size: 0.9375rem; font-weight: 800; line-height: 1.2; text-align: center; text-decoration: none; transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease; }
.mm-kpbtc__button:hover, .mm-kpbtc__button:focus-visible { text-decoration: none; transform: translateY(-0.08rem); }
.mm-kpbtc__button--primary { color: #ffffff !important; background: var(--mm-kpbtc-accent); }
.mm-kpbtc__button--primary:hover, .mm-kpbtc__button--primary:focus-visible { color: #ffffff; background: var(--mm-kpbtc-accent-strong); box-shadow: 0 0.85rem 1.4rem rgba(15, 23, 42, 0.14); }
.mm-kpbtc__button--secondary { color: #ffffff !important; background: var(--mm-kpbtc-second); }
.mm-kpbtc__button--secondary:hover, .mm-kpbtc__button--secondary:focus-visible { color: #ffffff; background: var(--mm-kpbtc-second-strong); box-shadow: 0 0.85rem 1.4rem rgba(15, 23, 42, 0.14); }
.mm-kpbtc__button--light { color: var(--mm-kpbtc-second-strong); background: #ffffff; }
.mm-kpbtc__button--light:hover, .mm-kpbtc__button--light:focus-visible { color: var(--mm-kpbtc-second-strong); box-shadow: 0 0.85rem 1.4rem rgba(15, 23, 42, 0.12); }
.mm-kpbtc__button--outline { color: var(--mm-kpbtc-second-strong); border: 0.125rem solid var(--mm-kpbtc-second); background: transparent; }
.mm-kpbtc__button--outline:hover, .mm-kpbtc__button--outline:focus-visible { color: #ffffff; background: var(--mm-kpbtc-second); }
.mm-kpbtc__image-wrap { position: relative; overflow: visible; border-radius: 1.5rem; }
.mm-kpbtc__image { display: block; width: 100%; border-radius: 1.5rem; object-fit: cover; box-shadow: 0 1.2rem 2.4rem rgba(15, 23, 42, 0.16); }
.mm-kpbtc--ratio-portrait .mm-kpbtc__image { aspect-ratio: 4 / 5; }
.mm-kpbtc--ratio-wide .mm-kpbtc__image { aspect-ratio: 16 / 10; }
.mm-kpbtc--ratio-square .mm-kpbtc__image { aspect-ratio: 1 / 1; }
.mm-kpbtc--ratio-auto .mm-kpbtc__image { aspect-ratio: auto; }
.mm-kpbtc__image-badge { position: absolute; right: -1rem; bottom: -1rem; max-width: min(16rem, 78%); padding: 0.9rem 1.1rem; border-radius: 1rem; color: #ffffff; background: var(--mm-kpbtc-second); box-shadow: 0 0.85rem 1.4rem rgba(15, 23, 42, 0.16); font-size: 0.9rem; font-weight: 800; line-height: 1.3; text-align: center; }
.mm-kpbtc--animate .mm-kpbtc__text-col, .mm-kpbtc--animate .mm-kpbtc__image-col { opacity: 0; transform: translateY(1rem); transition: opacity 0.55s ease, transform 0.55s ease; }
.mm-kpbtc--animate.is-visible .mm-kpbtc__text-col, .mm-kpbtc--animate.is-visible .mm-kpbtc__image-col { opacity: 1; transform: translateY(0); }
.mm-kpbtc--animate.is-visible .mm-kpbtc__image-col { transition-delay: 0.12s; }
@media (max-width: 575.98px) {
	.mm-kpbtc--space-default { padding-block: 4rem; }
	.mm-kpbtc--space-large { padding-block: 5rem; }
	.mm-kpbtc__buttons { flex-direction: column; }
	.mm-kpbtc__button { width: 100%; }
	.mm-kpbtc__image-badge { right: 0.75rem; bottom: 0.75rem; }
}
@media (prefers-reduced-motion: reduce) {
	.mm-kpbtc__light, .mm-kpbtc__button, .mm-kpbtc--animate .mm-kpbtc__text-col, .mm-kpbtc--animate .mm-kpbtc__image-col { animation: none; opacity: 1; transform: none; transition: none; }
}


/* v1.1.3: wiederhergestellte Bild-Dimensionen und Bild-Badge-Positionen */
.mm-kpbtc__image-wrap {
	max-width: var(--mm-kpbtc-image-max-width, none);
}

.mm-kpbtc__image {
	object-position: var(--mm-kpbtc-image-object-position, center center);
}

.mm-kpbtc--image-size-compact .mm-kpbtc__image {
	height: 320px;
	aspect-ratio: auto;
}

.mm-kpbtc--image-size-default .mm-kpbtc__image {
	height: 420px;
	aspect-ratio: auto;
}

.mm-kpbtc--image-size-large .mm-kpbtc__image {
	height: 540px;
	aspect-ratio: auto;
}

.mm-kpbtc--image-size-custom .mm-kpbtc__image {
	height: var(--mm-kpbtc-image-height-mobile, 320px);
	aspect-ratio: auto;
}

@media (min-width: 992px) {
	.mm-kpbtc--image-size-custom .mm-kpbtc__image {
		height: var(--mm-kpbtc-image-height-desktop, 420px);
	}
}

.mm-kpbtc--badge-bottom-right .mm-kpbtc__image-badge {
	right: -1rem;
	bottom: -1rem;
	left: auto;
	top: auto;
}

.mm-kpbtc--badge-bottom-left .mm-kpbtc__image-badge {
	left: -1rem;
	bottom: -1rem;
	right: auto;
	top: auto;
}

.mm-kpbtc--badge-top-right .mm-kpbtc__image-badge {
	right: -1rem;
	top: -1rem;
	left: auto;
	bottom: auto;
}

.mm-kpbtc--badge-top-left .mm-kpbtc__image-badge {
	left: -1rem;
	top: -1rem;
	right: auto;
	bottom: auto;
}

.mm-kpbtc--badge-outside-bottom-right .mm-kpbtc__image-badge {
	right: -1rem;
	bottom: -1rem;
	left: auto;
	top: auto;
}

.mm-kpbtc--badge-outside-bottom-left .mm-kpbtc__image-badge {
	left: -1rem;
	bottom: -1rem;
	right: auto;
	top: auto;
}

.mm-kpbtc--image-badge-sky .mm-kpbtc__image-badge {
	color: #ffffff;
	background: var(--color-sky-500);
}

.mm-kpbtc--image-badge-emerald .mm-kpbtc__image-badge {
	color: #ffffff;
	background: var(--color-emerald-500);
}

.mm-kpbtc--image-badge-white .mm-kpbtc__image-badge {
	color: var(--color-sky-800);
	background: #ffffff;
}

.mm-kpbtc--image-badge-dark .mm-kpbtc__image-badge {
	color: #ffffff;
	background: var(--color-sky-900);
}

.mm-kpbtc--theme-emerald-sky .mm-kpbtc__image-badge {
	color: #fff;
	background: oklch(82.8% 0.189 84.429);
}

/* v1.1.4: Infobox-Icon ohne Hintergrund */
.mm-kpbtc-info__icon--plain {
	width: auto;
	height: auto;
	border-radius: 0;
	color: inherit;
	background: transparent;
	font-size: 1.45rem;
}

.mm-kpbtc-info__icon--plain + .mm-kpbtc-info__body {
	padding-top: 0.05rem;
}


/* v1.1.5: Icon-Hintergrund pro Infobox optional ausblendbar */
.mm-kpbtc-info--icon-no-bg .mm-kpbtc-info__icon {
	width: auto;
	height: auto;
	min-width: 0;
	border-radius: 0;
	background: transparent;
	color: inherit;
	font-size: 1.5rem;
}

.mm-kpbtc-info--icon-no-bg .mm-kpbtc-info__icon:empty {
	display: none;
}


/* v1.1.6: Layoutoptionen für Infoboxen und Buttons */
@media (min-width: 992px) {
	.mm-kpbtc--info-desktop-1 .mm-kpbtc__info-list {
		grid-template-columns: 1fr;
	}

	.mm-kpbtc--info-desktop-2 .mm-kpbtc__info-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.mm-kpbtc--info-desktop-3 .mm-kpbtc__info-list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.mm-kpbtc--buttons-desktop-row .mm-kpbtc__buttons {
		flex-direction: row;
		align-items: center;
	}

	.mm-kpbtc--buttons-desktop-column .mm-kpbtc__buttons {
		flex-direction: column;
		align-items: stretch;
	}

	.mm-kpbtc--buttons-desktop-grid-2 .mm-kpbtc__buttons {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.mm-kpbtc--buttons-desktop-grid-3 .mm-kpbtc__buttons {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.mm-kpbtc--buttons-desktop-full .mm-kpbtc__button {
		width: 100%;
	}
}

.mm-kpbtc--theme-emerald-sky .mm-kpbtc-info {
	background: color-mix(in oklab, #fff 10%, transparent);
	border-color: color-mix(in oklab, #fff 10%, transparent);
	color: #fff;
}

.mm-kpbtc--theme-emerald-sky .mm-kpbtc-info__title,
.mm-kpbtc--theme-emerald-sky .mm-kpbtc-info__text {
	color: #fff;
}

/* v1.1.8: explizite Abdeckung für Standard-Ratio-Bildmodus */
.mm-kpbtc--image-size-ratio .mm-kpbtc__image {
	/* Bildformat wird über .mm-kpbtc--ratio-* gesteuert. */
}


.mm-kpbtc--theme-neutral .mm-kpbtc-info {    
    padding: 0.5rem 0.7em;
    border: 0.0625rem solid color-mix(in srgb, var(--mm-kpbtc-accent-soft) 78%, #ffffff);  
    background: var(--color-sky-50);   
}

.mm-kpbtc--theme-neutral .mm-kpbtc-info__icon {
	font-size: 1.0rem;
}

.mm-kpbtc--theme-neutral .mm-kpbtc__badge {
    color: var(--color-emerald-700);
	background-color: var(--color-emerald-100);
}

.mm-kpbtc--theme-neutral.mm-kpbtc--image-badge-emerald .mm-kpbtc__image-badge {
    color: #ffffff;
    background: linear-gradient(to right in oklab, rgb(121, 178, 85) 0%, rgb(47, 81, 106) 100%);
	font-weight: 400;
	text-align: left;
}

.mm-kpbtc--theme-neutral em {
	font-size: 12px;
	padding-top: 10px;
    display: block;
}

.mm-kpbtc--theme-neutral .mm-kpbtc-info__text {   
    font-weight: 500;
}

.mm-kpbtc--theme-neutral .mm-kpbtc__headline {
	font-size: clamp(2rem, 5vw, 2.425rem);
}