/**
 * WPBakery Elemente: Kinderpark Downloads Grid + Download Standort
 * Ergänzende Bootstrap-5-Styles ohne Tailwind-Abhängigkeit.
 */

.mm-kpd-grid {
	--mm-kpd-bg-start: #e8f3e2;
	--mm-kpd-bg-end: oklch(98.4% 0.014 180.72);
	position: relative;
}

.mm-kpd-grid--bg-gradient,
.mm-kpd-grid--bg-custom {
	background-image: linear-gradient(135deg, var(--mm-kpd-bg-start), var(--mm-kpd-bg-end));
}

.mm-kpd-grid--bg-light {
	background-color: #f8f9fa;
}

.mm-kpd-grid--bg-white {
	background-color: #fff;
}

.mm-kpd-grid--space-compact {
	padding-block: 3.5rem;
}

.mm-kpd-grid--space-default {
	padding-block: 4rem;
}

.mm-kpd-grid--space-large {
	padding-block: 5rem;
}

.mm-kpd-grid__container {
	padding-inline: 1rem;
}

.mm-kpd-grid__container--wide {
	max-width: 80rem;
	margin-inline: auto;
}

.mm-kpd-grid__container--fluid {
	padding-inline: clamp(1rem, 4vw, 3rem);
}

.mm-kpd-grid__header {
	margin-bottom: 3rem;
}

.mm-kpd-grid--header-center .mm-kpd-grid__header {
	text-align: center;
}

.mm-kpd-grid__badge {
	display: inline-flex;
	padding: .5rem 1rem;
	margin-bottom: 1rem;
	border-radius: 50rem;
	color: #5f8e43;
	background-color: #d2e7c7;
	font-size: .875rem;
	font-weight: 500;
}

.mm-kpd-grid__title {
	margin: 0 0 1rem;
	color: #111827;	
	font-size: clamp(1.875rem, 4vw, 2.25rem);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -.025em;
}

.mm-kpd-grid__intro {
	max-width: 36rem;
	margin: 0;
	color: #4b5563;
	font-size: 1rem;
	line-height: 1.65;
}

.mm-kpd-grid--header-center .mm-kpd-grid__intro {
	margin-inline: auto;
}

.mm-kpd-grid__locations {
	margin-inline: auto;
}

.mm-kpd-grid--width-compact .mm-kpd-grid__locations,
.mm-kpd-grid--width-compact .mm-kpd-grid__note {
	max-width: 64rem;
}

.mm-kpd-location {
	display: flex;
	flex-direction: column;
}

.mm-kpd-location__header {
	margin-bottom: 1.375rem;
}

.mm-kpd-location__header-icon,
.mm-kpd-grid__note-icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: .75rem;
	color: #fff;
}

.mm-kpd-location__title {
	margin: 0;
	color: #111827;
	font-family: var(--mm-kpd-font-heading, inherit);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.35;
}

.mm-kpd-location__subtitle {
	margin: 0;
	color: #6b7280;
	font-size: .875rem;
	line-height: 1.4;
}

.mm-kpd-location__links {
	flex: 1 1 auto;
}

.mm-kpd-location--gap-compact .mm-kpd-location__links {
	gap: .625rem;
}

.mm-kpd-location--gap-default .mm-kpd-location__links {
	gap: 1rem;
}

.mm-kpd-location--gap-large .mm-kpd-location__links {
	gap: 1.25rem;
}

.mm-kpd-download {
	padding: 1.25rem;
	border-radius: 1rem;
	color: inherit;
	background: #fff;
	box-shadow: 0 .25rem .75rem rgba(15, 23, 42, .07), 0 .0625rem .1875rem rgba(15, 23, 42, .04);
	text-decoration: none;
	transition: transform .28s ease, box-shadow .28s ease;
}

.mm-kpd-location--hover .mm-kpd-download:hover,
.mm-kpd-location--hover .mm-kpd-download:focus-visible {
	transform: translateY(-.125rem) scale(1.015);
	box-shadow: 0 .75rem 1.5rem rgba(15, 23, 42, .12), 0 .25rem .5rem rgba(15, 23, 42, .05);
}

.mm-kpd-download:focus-visible {
	outline: .1875rem solid #059669;
	outline-offset: .1875rem;
}

.mm-kpd-download__icon {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border-radius: .75rem;
	transition: color .25s ease, background-color .25s ease;
}

.mm-kpd-download:hover .mm-kpd-download__icon,
.mm-kpd-download:focus-visible .mm-kpd-download__icon {
	color: #fff;
	background-color: var(--mm-kpd-theme-main);
}

.mm-kpd-download__content {
	display: block;
	flex: 1 1 auto;
	min-width: 0;
}

.mm-kpd-download__title {
	display: block;
	color: #111827;
	font-weight: 600;
	line-height: 1.45;
}

.mm-kpd-download__subtitle {
	display: block;
	color: #6b7280;
	font-size: .875rem;
	line-height: 1.45;
}

.mm-kpd-download__action {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	color: #9ca3af;
	transition: color .25s ease, transform .25s ease;
}

.mm-kpd-download:hover .mm-kpd-download__action,
.mm-kpd-download:focus-visible .mm-kpd-download__action {
	color: var(--mm-kpd-theme-main);
	transform: translateY(.1rem);
}

.mm-kpd-svg {
	width: 1.25rem;
	height: 1.25rem;
}

.mm-kpd-download__icon .mm-kpd-svg {
	width: 1.5rem;
	height: 1.5rem;
}

.mm-kpd-theme--violet {
	--mm-kpd-theme-main: #8b5cf6;
	color: #7c3aed;
	background-color: #ede9fe;
}

.mm-kpd-location__header-icon.mm-kpd-theme--violet {
	background-color: #8b5cf6;
	color: #fff;
}

.mm-kpd-theme--indigo {
	--mm-kpd-theme-main: #6366f1;
	color: #4f46e5;
	background-color: #e0e7ff;
}

.mm-kpd-location__header-icon.mm-kpd-theme--indigo {
	background-color: #6366f1;
	color: #fff;
}

.mm-kpd-theme--emerald {
	--mm-kpd-theme-main: #79b255;
	color: #6ca04c;
	background-color: #d2e7c7;
}

.mm-kpd-location__header-icon.mm-kpd-theme--emerald {
	background-color: #79b255;
	color: #fff;
}

.mm-kpd-theme--teal {
	--mm-kpd-theme-main: #14b8a6;
	color: #0d9488;
	background-color: #ccfbf1;
}

.mm-kpd-location__header-icon.mm-kpd-theme--teal {
	background-color: #14b8a6;
	color: #fff;
}

.mm-kpd-theme--amber {
	--mm-kpd-theme-main: #f59e0b;
	color: #d97706;
	background-color: #fef3c7;
}

.mm-kpd-location__header-icon.mm-kpd-theme--amber {
	background-color: #f59e0b;
	color: #fff;
}

.mm-kpd-theme--rose {
	--mm-kpd-theme-main: #f43f5e;
	color: #e11d48;
	background-color: #ffe4e6;
}

.mm-kpd-location__header-icon.mm-kpd-theme--rose {
	background-color: #f43f5e;
	color: #fff;
}

.mm-kpd-theme--sky {
	--mm-kpd-theme-main: #0ea5e9;
	color: #0284c7;
	background-color: #e0f2fe;
}

.mm-kpd-location__header-icon.mm-kpd-theme--sky {
	background-color: #0ea5e9;
	color: #fff;
}

.mm-kpd-grid__note {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem;
	margin: 2rem auto 0;
	border: .0625rem solid #d1fae5;
	border-radius: 1rem;
	background-color: #fff;
	box-shadow: 0 .0625rem .25rem rgba(15, 23, 42, .04);
}

.mm-kpd-grid__note-icon.mm-kpd-theme--amber {
	color: #d97706;
	background-color: #fef3c7;
}

.mm-kpd-grid__note-icon.mm-kpd-theme--emerald {
	color: #059669;
	background-color: #d1fae5;
}

.mm-kpd-grid__note-icon.mm-kpd-theme--teal {
	color: #0d9488;
	background-color: #ccfbf1;
}

.mm-kpd-grid__note-icon.mm-kpd-theme--violet {
	color: #7c3aed;
	background-color: #ede9fe;
}

.mm-kpd-grid__note-title {
	margin: 0 0 .25rem;
	color: #111827;
	font-size: .875rem;
	font-weight: 600;
	line-height: 1.45;
}

.mm-kpd-grid__note-text {
	margin: 0;
	color: #6b7280;
	font-size: .875rem;
	line-height: 1.65;
}

.mm-kpd-grid--animate .mm-kpd-grid__header,
.mm-kpd-grid--animate .mm-kpd-location,
.mm-kpd-grid--animate .mm-kpd-grid__note {
	opacity: 0;
	transform: translateY(1rem);
	transition: opacity .55s ease, transform .55s ease;
}

.mm-kpd-grid--animate.is-visible .mm-kpd-grid__header,
.mm-kpd-grid--animate.is-visible .mm-kpd-location,
.mm-kpd-grid--animate.is-visible .mm-kpd-grid__note {
	opacity: 1;
	transform: translateY(0);
}

.mm-kpd-grid--animate.is-visible .mm-kpd-location:nth-child(2) {
	transition-delay: .08s;
}

.mm-kpd-grid--animate.is-visible .mm-kpd-location:nth-child(3) {
	transition-delay: .16s;
}

.mm-kpd-grid--animate.is-visible .mm-kpd-grid__note {
	transition-delay: .18s;
}

@media (min-width: 576px) {
	.mm-kpd-grid--space-default {
		padding-block: 5rem;
	}

	.mm-kpd-grid--space-large {
		padding-block: 6rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mm-kpd-download,
	.mm-kpd-download__icon,
	.mm-kpd-download__action,
	.mm-kpd-grid--animate .mm-kpd-grid__header,
	.mm-kpd-grid--animate .mm-kpd-location,
	.mm-kpd-grid--animate .mm-kpd-grid__note {
		opacity: 1;
		transform: none;
		transition: none;
	}
}