/*
 * Layout-Helpers
 *
 * Wrapper, Section, Grid-Helper. Klassenamen folgen dem Layout-HTML
 * (.wrap, .section), damit Elementor-HTML-Widgets aus den Layouts
 * 1:1 übernommen werden können.
 */

.wrap {
	max-width: var(--ln-container-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--ln-container-pad);
	padding-right: var(--ln-container-pad);
	width: 100%;
}

/*
 * Elementor: Container-Override für full_width-Sections.
 * Ohne diese Regel bekommt die innere `.elementor-container`-Box stets
 * `max-width: 1140px` aus dem Default-Stylesheet, wodurch Layouts auf
 * Wide-Screens links/rechts weiße Ränder zeigen. Für `elementor-section-full_width`
 * (Default in unseren Page-JSONs) und für `elementor-section-stretched` muss
 * die Innencontainer-Box den vollen Section-Width einnehmen — die eigentliche
 * Content-Breite kontrolliert dann `.wrap` aus dem HTML-Widget oder der
 * jeweilige Section-spezifische CSS-Wrapper.
 */
.elementor-section.elementor-section-full_width > .elementor-container,
.elementor-section.elementor-section-stretched > .elementor-container {
	max-width: 100% !important;
}

/*
 * Elementor: Column- + Widget-Wrap-Padding entfernen.
 * Default-Spacing innerhalb von `elementor-column` und `elementor-widget-wrap`
 * fügt Padding hinzu (über CSS-Variablen --widgets-spacing). Layout-Treue
 * verlangt 0-Padding, weil HTML-Widgets ihre eigene `.wrap`/`section`-Padding
 * mitbringen.
 */
.elementor-section.elementor-section-full_width > .elementor-container > .elementor-column > .elementor-column-wrap,
.elementor-section.elementor-section-full_width > .elementor-container > .elementor-column > .elementor-widget-wrap {
	padding: 0;
}

.section,
.ln-section {
	padding-top: var(--ln-section-pad);
	padding-bottom: var(--ln-section-pad);
}

.ln-section--dark {
	background: var(--ln-dark);
	color: var(--ln-white);
}

.ln-section--light {
	background: var(--ln-light);
}

/* Grid-Helpers für Layout-Bereiche, die nicht in Elementor abgebildet sind */
.ln-grid {
	display: grid;
	gap: 0;
}

.ln-grid--2 { grid-template-columns: repeat(2, 1fr); }
.ln-grid--3 { grid-template-columns: repeat(3, 1fr); }
.ln-grid--4 { grid-template-columns: repeat(4, 1fr); }

.ln-stack {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.ln-row {
	display: flex;
	gap: 16px;
	align-items: center;
}

.ln-row--between {
	justify-content: space-between;
}

.ln-row--end {
	justify-content: flex-end;
}