/**
 * LEDTEK Layout-Helfer (site-weit)
 * ------------------------------------------------------------------
 * .mobil-reihenfolge-drehen
 *   Auf eine zweispaltige Container-Reihe (Medium | Text bzw. Text | Medium)
 *   legen, um die Stapel-Reihenfolge NUR auf dem Handy umzudrehen. Nützlich beim
 *   abwechselnden Text|Bild / Bild|Text-Layout: bei den "Bild-zuerst"-Reihen die
 *   Klasse setzen, damit auf dem Handy überall der Text oben steht.
 *
 *   Greift auf beide Container-Breiten: bei "boxed" sitzt der Flexcontainer auf
 *   > .e-con-inner, bei "full width" auf dem .e-con selbst.
 */
@media (max-width: 767px) {
	.mobil-reihenfolge-drehen,
	.mobil-reihenfolge-drehen > .e-con-inner {
		flex-direction: column-reverse !important;
		flex-wrap: nowrap !important;
	}
}

/**
 * .gleiche-karten
 *   Auf einen Reihen-Container mit Karten (z.B. Download-Icon-Boxen) legen:
 *   - Tablet/PC: alle Karten gleiche BREITE und gleiche HÖHE — die höchste
 *     Karte bestimmt die Zeilenhöhe, die anderen strecken sich mit.
 *   - Handy: untereinander in voller Breite, Höhe natürlich (keine Streckung).
 *   Funktioniert mit Icon-Boxen DIREKT im Container und mit je einem
 *   Zwischen-Container pro Karte; boxed ("> .e-con-inner") und full width.
 */
/* Der Karten-Container spannt immer die volle Breite (sonst schrumpft er als
   Flex-Kind auf Inhaltsbreite und quetscht die Karten zusammen) — und auch
   sein direkter Eltern-Container, falls der selbst als Flex-Kind schrumpft. */
.gleiche-karten {
	width: 100% !important;
	max-width: 100% !important;
	flex-grow: 1;
}
/* Alle Container-VORFAHREN der Karten-Reihe voll spannen — als Flex-Kinder
   schrumpfen sie sonst kettenweise auf Inhaltsbreite (z.B. wenn zwei
   Download-Sektionen im selben Row-Parent liegen und eine versteckt ist).
   Bewusst nur .e-con (nicht .e-con-inner), damit boxed-Breiten intakt bleiben;
   Ausnahme: der DIREKTE Eltern-Inner. */
.e-con:has(.gleiche-karten),
.e-con-inner:has(> .gleiche-karten) {
	width: 100% !important;
	max-width: 100% !important;
}

@media (min-width: 768px) {
	.gleiche-karten,
	.gleiche-karten > .e-con-inner {
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: stretch !important;
	}
	/* Gleiche Breite: jede Karte (Icon-Box oder Wrapper-Container) 1 Anteil */
	.gleiche-karten > .elementor-widget-icon-box,
	.gleiche-karten > .e-con,
	.gleiche-karten > .e-con-inner > .elementor-widget-icon-box,
	.gleiche-karten > .e-con-inner > .e-con {
		flex: 1 1 0 !important;
		min-width: 0;
		width: auto !important;
		max-width: none !important;
	}
	/* Gleiche Höhe: Icon-Box-Kette auf volle Container-Höhe strecken */
	.gleiche-karten .elementor-widget-icon-box {
		display: flex;
		flex-grow: 1;
	}
	.gleiche-karten .elementor-widget-icon-box > .elementor-widget-container {
		display: flex;
		width: 100%;
	}
	.gleiche-karten .elementor-icon-box-wrapper {
		display: flex;
		flex-direction: column;
		width: 100%;
	}
}
@media (max-width: 767px) {
	.gleiche-karten,
	.gleiche-karten > .e-con-inner {
		flex-direction: column !important;
		flex-wrap: nowrap !important;
	}
	.gleiche-karten .elementor-widget-icon-box {
		width: 100%;
	}
}