.weitereleistungen{
	a{
		max-width: 400px;
		position: relative;
		display: block;
		text-decoration: none;

		h4{
			margin: 0;

			@media (max-width: 1199px){
				font-size: 32px;
			}

			@media (max-width: 767px){
				font-size: 26px;
			}
		}

		.inner{
			position: absolute;
			z-index: 1;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			padding: 40px;
			background: rgba(50,43,42,.2);
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
			color: #fff;
			transition: background-color .3s ease;
		}
		&:hover .inner{
			background-color: rgba(50,43,42,.5);
		}

		.icon{
			--icon: url(../../images/tree.svg);
			flex-shrink: 0;
			width: 38px;
			aspect-ratio: 1;
			-webkit-mask: var(--icon) no-repeat center/contain;
			mask: var(--icon) no-repeat center/contain;
			background: currentColor;
			
			position: absolute;
			z-index: 2;
			bottom: 50px;
			left: 50%;
			transform: translateX(-50%);
			transition: transform .5s cubic-bezier(.34,1.56,.64,1);

			@media (max-width: 1199px){
				width: 26px;
				bottom: 40px;
			}
		}
		&:hover .icon{
			transform: translateX(-50%) rotate(90deg);
		}
	}
}