/**
 * burnabit section divider
 *
 * Dekorative Übergänge zwischen zwei Divi-Sektionen. Die Komponente bleibt
 * inhaltlich leer; Form und Farbrollen werden ausschließlich über Klassen
 * gewählt. `burnabit-logo-divider` bleibt während der Migration als Alias
 * für die bisherige gegenläufige Form erhalten.
 */

.burnabit-section-divider:where(:not(.burnabit-section-divider--auto)),
.burnabit-logo-divider {
	--burnabit-divider-from: #fff;
	--burnabit-divider-to: #1a1a1a;
	--burnabit-divider-height: clamp(3rem, 4.5vw, 4rem);
	--burnabit-divider-radius: clamp(2.5rem, 4vw, 3.5rem);

	position: relative;
	isolation: isolate;
	width: 100%;
	height: var(--burnabit-divider-height);
	min-height: var(--burnabit-divider-height);
	padding: 0 !important;
	overflow: hidden;
	background: linear-gradient(
		to bottom,
		var(--burnabit-divider-from) 0 50%,
		var(--burnabit-divider-to) 50% 100%
	) !important;
}

.burnabit-section-divider:where(:not(.burnabit-section-divider--auto))::before,
.burnabit-section-divider:where(:not(.burnabit-section-divider--auto))::after,
.burnabit-logo-divider::before,
.burnabit-logo-divider::after {
	content: "";
	display: none;
	position: absolute;
	left: 0;
	width: 100%;
	pointer-events: none;
}

/* Bestehende Form: Sektion A schließt links, Sektion B öffnet rechts. */
.burnabit-logo-divider,
.burnabit-section-divider--close-left-open-right:where(:not(.burnabit-section-divider--auto)),
.burnabit-section-divider--open-left-close-right:where(:not(.burnabit-section-divider--auto)) {
	background: linear-gradient(
		to bottom,
		var(--burnabit-divider-to) 0 50%,
		var(--burnabit-divider-from) 50% 100%
	) !important;
}

.burnabit-logo-divider::before,
.burnabit-logo-divider::after,
.burnabit-section-divider--close-left-open-right:where(:not(.burnabit-section-divider--auto))::before,
.burnabit-section-divider--close-left-open-right:where(:not(.burnabit-section-divider--auto))::after,
.burnabit-section-divider--open-left-close-right:where(:not(.burnabit-section-divider--auto))::before,
.burnabit-section-divider--open-left-close-right:where(:not(.burnabit-section-divider--auto))::after {
	display: block;
	height: 50%;
}

.burnabit-logo-divider::before,
.burnabit-section-divider--close-left-open-right:where(:not(.burnabit-section-divider--auto))::before {
	top: 0;
	background: var(--burnabit-divider-from);
	border-bottom-left-radius: var(--burnabit-divider-radius);
}

.burnabit-logo-divider::after,
.burnabit-section-divider--close-left-open-right:where(:not(.burnabit-section-divider--auto))::after {
	bottom: 0;
	background: var(--burnabit-divider-to);
	border-top-right-radius: var(--burnabit-divider-radius);
}

.burnabit-section-divider--open-left-close-right:where(:not(.burnabit-section-divider--auto))::before {
	top: 0;
	background: var(--burnabit-divider-from);
	border-bottom-right-radius: var(--burnabit-divider-radius);
}

.burnabit-section-divider--open-left-close-right:where(:not(.burnabit-section-divider--auto))::after {
	bottom: 0;
	background: var(--burnabit-divider-to);
	border-top-left-radius: var(--burnabit-divider-radius);
}

/* Die folgende Sektion beginnt oben auf beiden Seiten gerundet. */
.burnabit-section-divider--opening:where(:not(.burnabit-section-divider--auto)) {
	background: var(--burnabit-divider-from) !important;
}

.burnabit-section-divider--opening:where(:not(.burnabit-section-divider--auto))::after {
	display: block;
	inset: 0;
	height: 100%;
	background: var(--burnabit-divider-to);
	border-top-left-radius: var(--burnabit-divider-radius);
	border-top-right-radius: var(--burnabit-divider-radius);
}

/* Die vorherige Sektion endet unten auf beiden Seiten gerundet. */
.burnabit-section-divider--closing:where(:not(.burnabit-section-divider--auto)) {
	background: var(--burnabit-divider-to) !important;
}

.burnabit-section-divider--closing:where(:not(.burnabit-section-divider--auto))::before {
	display: block;
	inset: 0;
	height: 100%;
	background: var(--burnabit-divider-from);
	border-bottom-left-radius: var(--burnabit-divider-radius);
	border-bottom-right-radius: var(--burnabit-divider-radius);
}

.burnabit-section-divider:where(:not(.burnabit-section-divider--auto)) > .et_pb_row,
.burnabit-logo-divider > .et_pb_row {
	display: none;
}

/* Ausgangsfläche */
.burnabit-section-divider--from-white:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-from: #fff; }
.burnabit-section-divider--from-light:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-from: #f3f4f6; }
.burnabit-section-divider--from-dark:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-from: #0d1117; }
.burnabit-section-divider--from-raised:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-from: #161b22; }
.burnabit-section-divider--from-orange:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-from: #ff700f; }

/* Zielfläche */
.burnabit-section-divider--to-white:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-to: #fff; }
.burnabit-section-divider--to-light:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-to: #f3f4f6; }
.burnabit-section-divider--to-dark:where(:not(.burnabit-section-divider--auto)),
.burnabit-section-divider--to-footer:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-to: #0d1117; }
.burnabit-section-divider--to-raised:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-to: #161b22; }
.burnabit-section-divider--to-orange:where(:not(.burnabit-section-divider--auto)) { --burnabit-divider-to: #ff700f; }

/* Bewusst große Inszenierung für ausgewählte Übergänge. */
.burnabit-section-divider--large:where(:not(.burnabit-section-divider--auto)) {
	--burnabit-divider-height: clamp(6rem, 10vw, 9rem);
	--burnabit-divider-radius: clamp(3rem, 6.5vw, 6.5rem);
}

@media (max-width: 767px) {
	.burnabit-section-divider:where(:not(.burnabit-section-divider--auto)),
	.burnabit-logo-divider {
		--burnabit-divider-height: 3rem;
		--burnabit-divider-radius: 2.5rem;
	}

	.burnabit-section-divider--large:where(:not(.burnabit-section-divider--auto)) {
		--burnabit-divider-height: 5rem;
		--burnabit-divider-radius: 3rem;
	}
}