/* Ergänzungen der statischen Seite zur alten Gestaltung (theme/css/*.css bleiben unverändert). */

/* /de/anfahrt: Karte nach Klick (Mike 04.11.2026, Weg B). Die Fläche hat genau das Maß des alten iframe (100 % × 600 px);
   inline-block + overflow:hidden setzt die Grundlinie an den unteren Rand — die Zeile ist so hoch wie mit dem iframe, auch nach
   dem Klick (der iframe ersetzt die Fläche, inline wie früher). Darin das Vorschaubild derselben Karte und mittig ein Kärtchen:
   ein Satz Hinweis, ein Knopf in der Knopf-Gestalt der Seite (.button-link aus content.css). */
.mce-content-body .karte-klick {
	display: inline-block;
	vertical-align: baseline;
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 600px;
	background-color: #fff;
	cursor: pointer;
}
/* Vorschau blass: sie ist ein Bild, keine Karte — Googles Knöpfe darin sollen nicht wie bedienbar wirken. Die Markierung der
   Praxis (Bildmitte) bleibt frei, das Kärtchen sitzt darunter. */
.mce-content-body .karte-klick img {
	opacity: 0.55;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}
.mce-content-body .karte-hinweis {
	position: absolute;
	left: 50%;
	top: 66%;
	transform: translate(-50%, 0);
	width: calc(100% - 30px);
	max-width: 420px;
	padding: 20px 20px 22px;
	background-color: rgba(255, 255, 255, 0.94);
	box-shadow: 0 1px 15px rgba(0, 0, 0, 0.25);
	text-align: center;
}
.mce-content-body .karte-hinweis p { margin: 0 0 1.5rem 0; }
.mce-content-body .karte-hinweis p:last-child { margin: 0; }
.mce-content-body .karte-hinweis a.button-link { background-color: #fff; }
.mce-content-body .karte-hinweis a.button-link:hover,
.mce-content-body .karte-hinweis a.button-link:focus { background-color: #8D191D; color: #fff; }