/*
 * File:       ansprechpartner/anzeige.css
 * Created At: 2026-08-03
 * Project:    service.kyberg
 *
 * Nur das Noetigste fuer die Ansprechpartner-Boxen: das zweispaltige Layout,
 * wenn ein Bild vorhanden ist. Farben, Schriften und Abstaende bleiben
 * bewusst aussen vor — die kommen aus Divi und sollen nicht ueberschrieben
 * werden.
 */

/*
 * .ap-box ist im Theme bereits ein Flex-Container mit flex-direction: column
 * und justify-content: end — der Inhalt klebt dadurch am unteren Rand der
 * Box. Wir wollen ihn oben. div davor, damit die Regel die bestehende
 * .ap-box-Regel sticht, ohne !important zu brauchen.
 */
div.ap-box {
	justify-content: flex-start;
}

/*
 * Die betreuten Marken stehen zwischen Ueberschrift und Namen, zurueck-
 * haltender als der Rest. margin-bottom bewusst gleich margin-top gesetzt
 * (statt den Divi-Standardabstand von <p> wirken zu lassen), damit der
 * Abstand zum Namen genauso gross ist wie der zur Ueberschrift darueber
 * (Rueckmeldung Daniela, 14.09.2026).
 */
div.ap-box .ap-marken {
	margin-top: .35em;
	margin-bottom: .35em;
	font-size: .8em;
	line-height: 1.35;
	opacity: .8;
}

/*
 * Mit Bild zweispaltig: die Richtung muss ausdruecklich gedreht werden, und
 * der Selektor braucht zwei Klassen, damit er die .ap-box-Regel sticht.
 */
.ap-box.ap-box-mit-bild {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 1em;
}

.ap-box.ap-box-mit-bild .ap-bild {
	flex: 0 0 auto;
	max-width: 40%;
}

.ap-box.ap-box-mit-bild .ap-bild img {
	display: block;
	max-width: 100%;
	height: auto;
}

.ap-box.ap-box-mit-bild .ap-inhalt {
	flex: 1 1 auto;
	min-width: 0;
}

/* Auf schmalen Bildschirmen untereinander statt nebeneinander. */
@media (max-width: 480px) {
	.ap-box.ap-box-mit-bild {
		flex-direction: column;
	}

	.ap-box.ap-box-mit-bild .ap-bild {
		max-width: 100%;
	}
}

/*
 * Layout "untereinander" ([ap-uebersicht layout="untereinander"], siehe
 * kyberg_ap_divi_grid()): style2.css:409-417 gibt .ap-box eine feste Hoehe
 * (min-height UND max-height: 212px) — sinnvoll, wenn mehrere Karten
 * nebeneinander stehen und optisch gleich hoch bleiben sollen. Bei einer
 * Karte je Zeile (Divi vergibt der Reihe dafuer die Klasse
 * et_pb_row_1col) bleibt davon nur unnoetig viel Leerraum uebrig — hier
 * soll die Box sich an ihren Inhalt anpassen.
 */
.et_pb_row_1col .ap-box {
	min-height: 0;
	max-height: none;
}