/*
 * KW Biohof – Kontakt-/Standort-Widget. Zuschaltbare Blöcke (Kontaktwege,
 * Öffnungszeiten, Anfahrt, Social) als Karten in einem responsiven Raster.
 * Inhalte aus „Standort & Daten". Anfahrt = Link (kein Karten-iframe, DSGVO).
 * Alle Farben aus Tokens; lokale --biohof-contact-* mit Marken-Fallback,
 * vom Stil-Tab überschreibbar. Kein !important.
 */

.biohof-contact {
	--biohof-contact-gap: var(--biohof-space-lg);
	--biohof-contact-ratio: 4 / 3;
	--biohof-contact-img-pos: center center;
	--biohof-contact-radius: var(--biohof-radius-md);
	--biohof-contact-text-color: var(--biohof-color-text);
	--biohof-contact-accent-color: var(--biohof-color-primary);
	--biohof-contact-surface-color: var(--biohof-color-surface-soft);

	display: flex;
	flex-direction: column;
	gap: var(--biohof-space-lg);
	color: var(--biohof-contact-text-color);
	font-family: var(--biohof-font-body);
	font-size: var(--biohof-fs-400);
	line-height: var(--biohof-line-base);
}

/* ── Info-Zeile: Kontakt / Öffnungszeiten / Social als gleich hohe Karten,
   automatisch umbrechend (passt sich der Anzahl aktiver Blöcke an). ───────── */
.biohof-contact__info {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
	gap: var(--biohof-contact-gap);
	align-items: stretch;
}

/* Anfahrt-Bild: Höhe folgt allein dem gewählten Seitenverhältnis – kein
   Höhendeckel (der machte das Format-Control wirkungslos). */

.biohof-contact__block {
	min-inline-size: 0;
	display: flex;
	flex-direction: column;
	gap: var(--biohof-space-sm);
	padding: var(--biohof-space-lg);
	border: 1px solid var(--biohof-color-border);
	border-radius: var(--biohof-contact-radius);
	background: var(--biohof-contact-surface-color);
}

/* ── Block-Titel (Akzent-Label mit Unterlinie) ─────────────────────────────── */
.biohof-contact__block-title {
	position: relative;
	margin: 0 0 var(--biohof-space-xs);
	padding-block-end: var(--biohof-space-xs);
	font-family: var(--biohof-font-body);
	font-size: var(--biohof-fs-300);
	font-weight: var(--biohof-weight-semibold);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: var(--biohof-line-snug);
	color: var(--biohof-contact-text-color);
}
.biohof-contact__block-title::after {
	content: "";
	position: absolute;
	inset-block-end: -1px;
	inset-inline-start: 0;
	inline-size: 2.5rem;
	block-size: 2px;
	border-radius: var(--biohof-radius-pill);
	background: linear-gradient(to right, var(--biohof-contact-accent-color), transparent);
}

/* ── Kontaktwege ───────────────────────────────────────────────────────────── */
.biohof-contact__list {
	display: grid;
	gap: var(--biohof-space-xs);
	list-style: none;
	margin: 0;
	padding: 0;
}
.biohof-contact__item,
.biohof-contact__link {
	display: flex;
	align-items: center;
	gap: var(--biohof-space-sm);
	min-block-size: 44px;
}
.biohof-contact__item--address { align-items: flex-start; }
.biohof-contact__ico {
	flex: none;
	display: inline-flex;
	color: var(--biohof-contact-accent-color);
}
.biohof-contact__ico svg { inline-size: 1.2rem; block-size: 1.2rem; }
.biohof-contact__item--address .biohof-contact__ico { margin-block-start: 0.15em; }
.biohof-contact__text { overflow-wrap: break-word; }
.biohof-contact__line { display: block; line-height: var(--biohof-line-snug); }

.biohof-contact__link {
	color: var(--biohof-contact-text-color);
	text-decoration: none;
	border-radius: var(--biohof-radius-sm);
	transition: color var(--biohof-duration) var(--biohof-ease);
}

/* ── Öffnungszeiten (Tag ↔ Zeit) ───────────────────────────────────────────── */
.biohof-contact__hours { margin: 0; display: grid; gap: var(--biohof-space-2xs); }
.biohof-contact__hours-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--biohof-space-sm);
	padding-block: var(--biohof-space-2xs);
	border-block-end: 1px solid var(--biohof-color-border);
}
.biohof-contact__hours-row:last-child { border-block-end: 0; }
.biohof-contact__hours-days { margin: 0; font-weight: var(--biohof-weight-medium); }
.biohof-contact__hours-time {
	margin: 0;
	color: var(--biohof-color-text);
	font-variant-numeric: tabular-nums;
}
.biohof-contact__hours-row.is-closed .biohof-contact__hours-time { font-style: italic; }

/* ── Anfahrt (Bild + Route-Knopf) ──────────────────────────────────────────── */
.biohof-contact__map {
	overflow: hidden;
	border-radius: var(--biohof-radius-sm);
}
/* Format + Ausschnitt DIREKT auf dem Bild (nicht dem Wrapper): Elementors
   `.elementor img { height: auto }` schlägt sonst die Bildhöhe und das Foto
   füllt die Format-Box nicht (Leerraum, Ausschnitt wirkungslos). Mit
   aspect-ratio am img rechnet height:auto FÜR uns; (0,2,0) sichert ab. */
.biohof-contact .biohof-contact__map-img {
	display: block;
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: var(--biohof-contact-ratio);
	object-fit: cover;
	object-position: var(--biohof-contact-img-pos);
}
/* Block-CTA: Plastik aus assets/css/core/card-cta.css. Hier nur: volle Breite,
   unten angedockt, abgerundet, Knopffarbe aus dem Kontakt-Akzent-Token. */
.biohof-contact__route {
	--biohof-card-cta-color: var(--biohof-contact-accent-color);
	display: flex;
	inline-size: 100%;
	margin-block-start: auto;
	border-radius: var(--biohof-radius-md);
}
.biohof-contact__route-icon {
	display: inline-flex;
	transition: transform var(--biohof-duration) var(--biohof-ease);
}
.biohof-contact__route-icon svg { inline-size: 1.1rem; block-size: 1.1rem; }

/* ── Social & Bewertung (Pills) ────────────────────────────────────────────── */
.biohof-contact__social {
	display: flex;
	flex-wrap: wrap;
	gap: var(--biohof-space-xs);
	list-style: none;
	margin: 0;
	padding: 0;
}
.biohof-contact__social-link {
	display: inline-flex;
	align-items: center;
	gap: var(--biohof-space-xs);
	min-block-size: 44px;
	padding: 0.4rem 0.9rem;
	border: 1px solid var(--biohof-color-border);
	border-radius: var(--biohof-radius-pill);
	color: var(--biohof-contact-text-color);
	text-decoration: none;
	transition: color var(--biohof-duration) var(--biohof-ease), border-color var(--biohof-duration) var(--biohof-ease);
}

/* ── Hover (nur wo ein Zeiger ist) ─────────────────────────────────────────── */
@media (hover: hover) {
	.biohof-contact.biohof-contact .biohof-contact__link:hover { color: var(--biohof-contact-accent-color); }
	.biohof-contact.biohof-contact .biohof-contact__route:hover .biohof-contact__route-icon { transform: translate(1px, -1px); }
	.biohof-contact.biohof-contact .biohof-contact__social-link:hover {
		color: var(--biohof-contact-accent-color);
		border-color: var(--biohof-contact-accent-color);
	}
}

/* ── Elementor-V4-Link-Defense schlagen (Pink bei hover/focus/visited).
   Doppelklasse + :is() (nicht :where()) hält die Spezifität (0,3,1). ──────── */
.biohof-contact.biohof-contact .biohof-contact__link:visited,
.biohof-contact.biohof-contact .biohof-contact__social-link:visited {
	color: var(--biohof-contact-text-color);
}
.biohof-contact.biohof-contact .biohof-contact__link:is(:hover, :focus, :focus-visible, :active) { color: var(--biohof-contact-accent-color); }
.biohof-contact.biohof-contact .biohof-contact__social-link:is(:hover, :focus, :focus-visible, :active) { color: var(--biohof-contact-accent-color); }

/* ── Fokus sichtbar ────────────────────────────────────────────────────────── */
.biohof-contact.biohof-contact :where(a, button):focus-visible {
	outline: 3px solid var(--biohof-color-focus);
	outline-offset: 2px;
}
/* Plastischer Knopf: Fokusring nach innen (bündiger Block). */
.biohof-contact.biohof-contact .biohof-contact__route:focus-visible {
	outline-offset: -3px;
}

/* ── Editor-Hinweis (leer) ─────────────────────────────────────────────────── */
.biohof-contact--empty {
	color: var(--biohof-color-text);
	padding: var(--biohof-space-md);
	border: 1px dashed var(--biohof-color-border);
	border-radius: var(--biohof-radius-md);
	background: var(--biohof-color-surface-soft);
}

/* ── Reduced Motion ────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	.biohof-contact__link,
	.biohof-contact__route,
	.biohof-contact__route-icon,
	.biohof-contact__social-link {
		transition: none;
	}
}
