@font-face {
  font-family: 'Piedra';
  src: url('../fonts/piedra-v21-latin-regular.woff') format('woff2');
  font-display: swap;
}
.et_pb_row_2_tb_header {
  min-height: 0px !important;
}
.contact-top ul {
	display: flex;
	align-items: center;
	gap: 15px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.contact-top a {
	display: flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
}

.custom-icon {
	font-family: 'ETmodules';
	font-style: normal;
	font-weight: normal;
	speak: none;
	display: inline-block;
}

/* Divi Icons */
.custom-icon.cart:before { content: "\e07a"; }
.custom-icon.phone:before { content: "\e090"; }
.custom-icon.mail:before { content: "\e076"; }
.custom-icon.faq:before { content: "\e10c"; }
.custom-icon.download:before { content: "\e092"; }

/* Social SVG */
.social-icon {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

/* Responsive */
.hide-sm {
	display: inline;
}

@media (max-width: 768px) {
	.hide-sm {
		display: none;
	}
}
.custom-icon.phone:before {
  content: "\e090" !important;
  font-family: 'ETmodules' !important;
}

/* Mobiles Menü: Vollbild-Overlay mit Akkordeon statt Divis flacher Liste
   (Divis Menu-Modul zeigt mobil sonst alle Ebenen gleichzeitig aufgeklappt) */
@media (max-width: 980px) {
	.et_pb_menu .et_mobile_menu,
	.et_pb_fullwidth_menu .et_mobile_menu {
		position: fixed;
		top: 0 !important;
		left: 0;
		width: 100%;
		height: 100vh;
		margin: 0;
		padding: 90px 6% 40px;
		background: #f4f8fb;
		border-top: 3px solid #2ea3f2;
		box-shadow: none;
		z-index: 9999;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	body.ratgeber-mobile-menu-open {
		overflow: hidden;
	}

	/* Untermenüs standardmäßig eingeklappt, öffnen per Klick auf die Rubrik.
	   display bleibt immer "block" (überschreibt nur Divis erzwungenes
	   display:block!important, ohne selbst dagegen anzukämpfen) - das
	   Ein-/Ausklappen läuft rein über eine max-height-Transition, sonst
	   kollidiert Divis !important mit einer JS-Slide-Animation und es ruckelt. */
	#main-header .et_mobile_menu li ul,
	.et_pb_fullwidth_menu .et_mobile_menu li ul,
	.et_pb_menu .et_mobile_menu li ul {
		display: block !important;
		visibility: visible;
		padding: 0;
		margin: 0;
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.25s ease;
	}
	.et_pb_menu .et_mobile_menu li.mobile-submenu-open > ul,
	.et_pb_fullwidth_menu .et_mobile_menu li.mobile-submenu-open > ul {
		max-height: 2000px;
	}

	.et_pb_menu .et_mobile_menu li,
	.et_pb_fullwidth_menu .et_mobile_menu li {
		position: relative;
	}
	.et_pb_menu .et_mobile_menu li a,
	.et_pb_fullwidth_menu .et_mobile_menu li a {
		padding: 14px 48px 14px 0;
		border-bottom: 1px solid rgba(0, 0, 0, 0.08);
		color: #333;
	}
	.et_pb_menu .et_mobile_menu li li a,
	.et_pb_fullwidth_menu .et_mobile_menu li li a {
		padding-left: 6%;
		font-size: 0.95em;
	}
	.et_pb_menu .et_mobile_menu li li li a,
	.et_pb_fullwidth_menu .et_mobile_menu li li li a {
		padding-left: 12%;
	}
	.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
	.et_pb_fullwidth_menu .et_mobile_menu .menu-item-has-children > a {
		background: transparent;
		font-weight: 700;
	}

	/* Pfeil-Indikator (rein dekorativ, die ganze Zeile ist klickbar) */
	.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
	.et_pb_fullwidth_menu .et_mobile_menu .menu-item-has-children > a {
		position: relative;
	}
	.et_pb_menu .et_mobile_menu .menu-item-has-children > a:after,
	.et_pb_fullwidth_menu .et_mobile_menu .menu-item-has-children > a:after {
		content: "";
		position: absolute;
		right: 4px;
		top: 50%;
		width: 8px;
		height: 8px;
		border-right: 2px solid #2ea3f2;
		border-bottom: 2px solid #2ea3f2;
		transform: translate(0, -60%) rotate(45deg);
		transition: transform 0.2s ease;
	}
	.et_pb_menu .et_mobile_menu li.mobile-submenu-open > a:after,
	.et_pb_fullwidth_menu .et_mobile_menu li.mobile-submenu-open > a:after {
		transform: translate(0, -40%) rotate(-135deg);
	}

	/* Hamburger-Icon größer */
	.et_pb_menu .mobile_menu_bar:before,
	.et_pb_fullwidth_menu .mobile_menu_bar:before {
		font-size: 44px;
	}
}

/* Abstand zwischen Hero-Bereich und H1 in allen Beiträgen (mobil) */
@media (max-width: 980px) {
	article.et_pb_post .entry-content h1 {
		margin-top: 20px;
	}
}