/* ============================================================
   PRZ Location Card
   Karte + Standort-Infos. Desktop 2 Spalten (Landkarte | Inhalt),
   mobil gestapelt. Blauer Akzent: links (Desktop) / oben (Mobile).
   Alle Icons + Landkarte sind austauschbare Image-Blocks.
   Tertiär-Link („Open in Google Maps") mit Pfeil als CSS-::after
   (folgt der Link-Farbe, öffnet im neuen Tab lt. Markup).
   Icon-Größen sind feste px (keine Größen-Tokens im System).
   ============================================================ */

.prz-location-card {
	background-color: var(--prz-color-white);
	border: var(--prz-border-width) solid var(--prz-color-border);
	/* Mobile: Akzent oben */
	border-top: var(--prz-border-width-accent) solid var(--prz-color-primary-500);
	/* Kein Karten-Padding — die Landkarte bleedet an die Ränder.
	   Innenabstand sitzt stattdessen auf .prz-location-card__content. */
	padding: 0;
}

@media (min-width: 992px) {
	.prz-location-card {
		/* Desktop: Akzent links statt oben */
		border-top: var(--prz-border-width) solid var(--prz-color-border);
		border-left: var(--prz-border-width-accent) solid var(--prz-color-primary-500);
	}
}

/* Spalten: Mobile gestapelt, ab Desktop Landkarte | Inhalt */
.prz-location-card__columns {
	display: flex;
	flex-direction: column;
	gap: 0;
}

@media (min-width: 992px) {
	.prz-location-card__columns {
		display: grid;
		grid-template-columns: 2fr 3fr;
		align-items: stretch;
		gap: 0;
	}
}

.prz-location-card__map {
	margin: 0;
}

/* Mobile: volle Breite, natürliche Höhe (bleedet oben/links/rechts). */
.prz-location-card__map img {
	display: block;
	width: 100%;
	height: auto;
}

/* Desktop: Landkarte füllt die volle Spaltenhöhe (bleedet oben/unten/links).
   absolute + inset vermeidet die Prozent-Höhe-Falle; object-fit cover
   croppt den Ausschnitt auf die Content-Höhe. */
@media (min-width: 992px) {
	.prz-location-card__map {
		position: relative;
	}

	.prz-location-card__map img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}

/* Inhalt */
.prz-location-card__content {
	display: flex;
	flex-direction: column;
	/* Mehr Abstand zwischen den Blöcken (Kopf ↔ Fakten ↔ Link). */
	gap: var(--prz-space-l);
	/* Innenabstand der Karte sitzt hier (Bild bleedet, Text bekommt Luft). */
	padding: var(--prz-space-l);
}

.prz-location-card__content > *,
.prz-location-card__heading-group > *,
.prz-location-card__facts > *,
.prz-location-card__fact > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* Kopf: Badge + Titel/Untertitel */
.prz-location-card__header {
	align-items: center;
	gap: var(--prz-space-s);
}

.prz-location-card__badge {
	margin: 0;
	flex: 0 0 auto;
	width: 48px;
}

.prz-location-card__badge img {
	display: block;
	width: 48px;
	height: 48px;
	object-fit: contain;
}

.prz-location-card__heading-group {
	gap: 0;
}

/* Fakten-Zeilen: Mobile gestapelt, ab Desktop nebeneinander (umbrechend) */
.prz-location-card__facts {
	display: flex;
	flex-direction: column;
	/* Mobile: Fakten eng als Gruppe (klarer Kontrast zum Content-Gap). */
	gap: var(--prz-space-2xs);
}

@media (min-width: 992px) {
	.prz-location-card__facts {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: var(--prz-space-m);
	}
}

.prz-location-card__fact {
	align-items: center;
	gap: var(--prz-space-2xs);
}

.prz-location-card__fact-icon {
	margin: 0;
	flex: 0 0 auto;
	width: 24px;
}

.prz-location-card__fact-icon img {
	display: block;
	width: 24px;
	height: 24px;
	object-fit: contain;
}

/* ============================================================
   Tertiär-Link (is-style-mehr-link) — blauer Text-Link + Pfeil.
   Pfeil als ::after via mask-image + currentColor: nimmt die
   Link-Farbe an (blau → hover). Eigenständig token-basiert,
   damit template-unabhängig (nicht auf build/main.css angewiesen).
   ============================================================ */

.prz-location-card .wp-block-buttons {
	margin: 0;
}

.prz-location-card .wp-block-button.is-style-mehr-link .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: var(--prz-space-2xs);
	padding: 0;
	background: transparent;
	color: var(--prz-color-link);
	border: 0;
	box-shadow: none;
	text-decoration: none;
}

.prz-location-card .wp-block-button.is-style-mehr-link .wp-block-button__link::after {
	content: "";
	width: 1.25em;
	height: 1.25em;
	background-color: currentColor;
	-webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PGxpbmUgeDE9IjQiIHkxPSIxMiIgeDI9IjIwIiB5Mj0iMTIiLz48cG9seWxpbmUgcG9pbnRzPSIxMyA1IDIwIDEyIDEzIDE5Ii8+PC9zdmc+");
	mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PGxpbmUgeDE9IjQiIHkxPSIxMiIgeDI9IjIwIiB5Mj0iMTIiLz48cG9seWxpbmUgcG9pbnRzPSIxMyA1IDIwIDEyIDEzIDE5Ii8+PC9zdmc+");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	transition: transform var(--prz-transition-fast);
}

.prz-location-card .wp-block-button.is-style-mehr-link .wp-block-button__link:hover {
	color: var(--prz-color-link-hover);
}

.prz-location-card .wp-block-button.is-style-mehr-link .wp-block-button__link:hover::after {
	transform: translateX(4px);
}