/*
 * Site Base
 * Globale Basis- und Seitenstyles.
 * Der bisherige Inhalt aus hautarztzentrum-seo.css kann hier bei Bedarf zusammengefuehrt werden.
 */

@media (min-width: 1025px) {
	.elementor-hidden-desktop {
		display: none !important;
	}
}

@media (max-width: 1024px) and (min-width: 768px) {
	.elementor-hidden-tablet {
		display: none !important;
	}
}

@media (max-width: 767px) {
	.elementor-hidden-mobile {
		display: none !important;
	}
}

.hz-breadcrumbs {
	color: #718078;
	font-size: 15px;
	line-height: 1.5;
	margin: 0 0 24px;
}

.hz-breadcrumbs a {
	color: #6fae9e;
	text-decoration: none;
}

.hz-breadcrumbs a:hover,
.hz-breadcrumbs a:focus {
	color: #2d3c37;
	text-decoration: underline;
}

.hz-breadcrumbs__separator {
	color: #d79a38;
	margin: 0 8px;
}

.hz-services {
	margin: 32px 0;
}

.hz-services__headline,
.hz-service-links__headline,
.hz-related-services__headline {
	color: #17211d;
	font-size: clamp(24px, 2.4vw, 34px);
	font-weight: 500;
	line-height: 1.2;
	margin: 0 0 22px;
}

.hz-services__grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hz-service-card {
	background: #ffffff;
	border: 1px solid #dbe8e4;
	border-radius: 8px;
	color: #17211d;
	display: block;
	min-height: 84px;
	padding: 20px 22px;
	text-decoration: none;
	transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.hz-service-card:hover,
.hz-service-card:focus {
	border-color: #83baad;
	box-shadow: 0 10px 26px rgba(28, 58, 49, 0.11);
	color: #17211d;
	transform: translateY(-2px);
}

.hz-service-card__title {
	display: block;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.3;
}

.hz-service-card__excerpt {
	color: #596a63;
	display: block;
	font-size: 15px;
	line-height: 1.5;
	margin-top: 10px;
}

.hz-services__empty {
	color: #596a63;
	margin: 0;
}

.hz-service-links {
	margin: 0 0 32px;
}

.hz-service-links__nav {
	color: #6fae9e;
	font-size: clamp(14px, 1vw, 16px);
	line-height: 1.65;
}

.hz-service-links__link {
	border-bottom: 0 !important;
	box-shadow: none !important;
	color: #17211d;
	text-decoration: none !important;
	transition: color 160ms ease, text-decoration-color 160ms ease;
}

.hz-service-links__link:hover,
.hz-service-links__link:focus,
.hz-service-links__link:active {
	color: #6fae9e;
	text-decoration: underline !important;
	text-decoration-color: currentColor !important;
	text-decoration-thickness: 1px !important;
	text-underline-offset: 5px !important;
}

.hz-service-links__separator {
	color: #d79a38;
	display: inline-block;
	margin: 0 6px;
}

.hz-service-links__empty {
	color: #596a63;
	margin: 0;
}

.hz-related-services {
	background: #e4f2ee;
	border-radius: 8px;
	margin: 40px 0 0;
	padding: 28px;
}

.hz-related-services__list {
	display: grid;
	gap: 10px 22px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.hz-related-services__list a {
	color: #17211d;
	text-decoration-color: #d79a38;
	text-underline-offset: 4px;
}

@media (max-width: 900px) {
	.hz-services__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.hz-services__grid,
	.hz-related-services__list {
		grid-template-columns: 1fr;
	}

	.hz-service-card {
		min-height: 0;
		padding: 18px;
	}

	.hz-related-services {
		padding: 22px;
	}

	.hz-service-links__nav {
		font-size: 14px;
		line-height: 1.65;
	}

	.hz-service-links__separator {
		margin: 0 5px;
	}
}
