/* ############################################################
	202 - NAVIGATION: ICON/TEXT
############################################################ */

/* Reset */
.mdl202-modul-box a {
	text-decoration: none;
}


/* Liste */
.mdl202-modul-box {
	position: relative;
	width: 100%;
	--list-abstand-x: var(--gap);
	--list-abstand-y: 24px;
}
	.mdl202-modul-box ul.link-list {
		position: relative;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--list-abstand-y) var(--list-abstand-x);
		list-style: none;
		padding: 0;
		margin: 0;
		width: 100%;
		min-width: 0;
	}
	.mdl202-modul-box ul.link-list > * {
		position: relative;
		min-width: 0;
	}
@media (min-width: 768px) {
	.mdl202-modul-box ul.link-list {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (min-width: 1024px) {
	.mdl202-modul-box {
		--list-abstand-y: 57px;
	}
}
@media (min-width: 1600px) {
	.mdl202-modul-box ul.link-list {
		grid-template-columns: repeat(4, 1fr);
	}
}


/* Icon */
.mdl202-modul-box .icon-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	aspect-ratio: 1 / 0.82;
	background-color: var(--main-color-3);
	overflow: hidden;
}
	.mdl202-modul-box .icon-wrapper > span {
		display: block;
		width: 46%;
		aspect-ratio: 1 / 1;
		background-color: var(--main-color-1);
		border-radius: 50%;
		overflow: hidden;
	}
@media (min-width: 1024px) {
	.mdl202-modul-box .icon-wrapper, .mdl202-modul-box .icon-wrapper > span {
		transition: background-color 300ms var(--cubic-bezier);
	}
	.mdl202-modul-box a:hover .icon-wrapper {
		background-color: var(--main-color-1);
	}
		.mdl202-modul-box a:hover .icon-wrapper > span {
			background-color: var(--main-color-3);
		}
}


/* Titel */
.mdl202-modul-box h3 {
	font-size: 1rem; /* 16px */
	line-height: 1.5;
}
.mdl202-modul-box .icon-wrapper + h3 {
	margin-top: 5px;
}
@media (min-width: 1280px) {
	.mdl202-modul-box h3 {
		font-size: 1.5625rem; /* 25px */
	}
	.mdl202-modul-box .icon-wrapper + h3 {
		margin-top: 13px;
	}
}