/**
 * /it-dienstleistungen-ulm/
 * Aufbau und Design wie /it-loesungen-fuer-unternehmen/ (Body-Klasse page-it-loesungen → page-it-loesungen-hero.css, page-it-loesungen.css, kb-baustein.css).
 * Hier nur Ergänzungen: Icons der Unternehmensgrößen-Karten (weiße SVGs als Maske in Petrol eingefärbt).
 */

body.page-it-dienstleistungen-ulm #ueber-uns .itl-solution {
	margin-top: 72px;
}

body.page-it-dienstleistungen-ulm .itl-problem__icon {
	border-radius: 5px;
	background: linear-gradient(135deg, #08a1c7 0%, #0088a2 100%);
	box-shadow: 0 8px 18px rgba(0, 136, 162, 0.2);
	color: #fff;
}

@media (max-width: 992px) {
	body.page-it-dienstleistungen-ulm #ueber-uns .itl-solution {
		margin-top: 48px;
	}
}

.itl-cloud-card__icon--startup,
.itl-cloud-card__icon--smallbusiness,
.itl-cloud-card__icon--mittelstand {
	position: relative;
}

.itl-cloud-card__icon--startup::before,
.itl-cloud-card__icon--smallbusiness::before,
.itl-cloud-card__icon--mittelstand::before {
	content: "";
	position: absolute;
	inset: 14px;
	background: #0088a2;
	-webkit-mask: var(--segment-icon) center / contain no-repeat;
	mask: var(--segment-icon) center / contain no-repeat;
}

.itl-cloud-card__icon--startup {
	--segment-icon: url("/img/icons/startup-white.svg");
}

.itl-cloud-card__icon--smallbusiness {
	--segment-icon: url("/img/icons/smallbusiness1-white.svg");
}

.itl-cloud-card__icon--mittelstand {
	--segment-icon: url("/img/icons/mittelstand-white.svg");
}
