/* =========================================================
SNIPPET: 10 - Abstände Utilities (Padding + Margin)
WOFÜR:
- Sauberes, einheitliches Spacing in Elementor per CSS-Klassen.
ENTSCHEIDUNG (System):
- PADDING-Utilities = Layout-Abstände => nutzen --gap-*
- MARGIN-Utilities  = Element-Abstände/Feintuning => nutzen --stack-*
KLASSEN (Padding):
- abstand-{0|xxs|xs|s|m|l|xl|xxl|xxxl}        -> padding-block (oben+unten)
- abstand-rund-{...}                          -> padding (rundherum)
- abstand-inline-{...}                        -> padding-inline (links+rechts)
- abstand-oben-{...}                          -> padding-top
- abstand-unten-{...}                         -> padding-bottom
KLASSEN (Margin):
- margin-oben-{...}                           -> margin-top
- margin-unten-{...}                          -> margin-bottom
- margin-block-{...}                          -> margin-block
WERTE KOMMEN VON:
- Abgeleitete Tokens: var(--gap-*) und var(--stack-*)
HINWEIS:
- Robust für Elementor (targetet Element + .e-con-inner + .elementor-container)
========================================================= */

/* ----------------------
   PADDING: abstand-* (block)
   => Layout-Abstand: GAP
---------------------- */
.elementor .elementor-element.abstand-0,
.elementor .elementor-element.abstand-0 > .e-con-inner,
.elementor .elementor-element.abstand-0 > .elementor-container {
  padding-block: var(--gap-0) !important;
}
.elementor .elementor-element.abstand-0 { gap: 0 !important; row-gap: 0 !important; }
.elementor .elementor-element.abstand-0 > .e-con-inner > :first-child,
.elementor .elementor-element.abstand-0 > .elementor-container > :first-child { margin-top: 0 !important; }
.elementor .elementor-element.abstand-0 > .e-con-inner > :last-child,
.elementor .elementor-element.abstand-0 > .elementor-container > :last-child { margin-bottom: 0 !important; }

.elementor .elementor-element.abstand-xxs,
.elementor .elementor-element.abstand-xxs > .e-con-inner,
.elementor .elementor-element.abstand-xxs > .elementor-container { padding-block: var(--gap-xxs) !important; }

.elementor .elementor-element.abstand-xs,
.elementor .elementor-element.abstand-xs > .e-con-inner,
.elementor .elementor-element.abstand-xs > .elementor-container { padding-block: var(--gap-xs) !important; }

.elementor .elementor-element.abstand-s,
.elementor .elementor-element.abstand-s > .e-con-inner,
.elementor .elementor-element.abstand-s > .elementor-container { padding-block: var(--gap-s) !important; }

.elementor .elementor-element.abstand-m,
.elementor .elementor-element.abstand-m > .e-con-inner,
.elementor .elementor-element.abstand-m > .elementor-container { padding-block: var(--gap-m) !important; }

.elementor .elementor-element.abstand-l,
.elementor .elementor-element.abstand-l > .e-con-inner,
.elementor .elementor-element.abstand-l > .elementor-container { padding-block: var(--gap-l) !important; }

.elementor .elementor-element.abstand-xl,
.elementor .elementor-element.abstand-xl > .e-con-inner,
.elementor .elementor-element.abstand-xl > .elementor-container { padding-block: var(--gap-xl) !important; }

.elementor .elementor-element.abstand-xxl,
.elementor .elementor-element.abstand-xxl > .e-con-inner,
.elementor .elementor-element.abstand-xxl > .elementor-container { padding-block: var(--gap-xxl) !important; }

.elementor .elementor-element.abstand-xxxl,
.elementor .elementor-element.abstand-xxxl > .e-con-inner,
.elementor .elementor-element.abstand-xxxl > .elementor-container { padding-block: var(--gap-xxxl) !important; }

/* ----------------------
   PADDING: abstand-rund-* (all sides)
   => Layout-Abstand: GAP
---------------------- */
.elementor .elementor-element.abstand-rund-0,
.elementor .elementor-element.abstand-rund-0 > .e-con-inner,
.elementor .elementor-element.abstand-rund-0 > .elementor-container { padding: var(--gap-0) !important; }

.elementor .elementor-element.abstand-rund-xxs,
.elementor .elementor-element.abstand-rund-xxs > .e-con-inner,
.elementor .elementor-element.abstand-rund-xxs > .elementor-container { padding: var(--gap-xxs) !important; }

.elementor .elementor-element.abstand-rund-xs,
.elementor .elementor-element.abstand-rund-xs > .e-con-inner,
.elementor .elementor-element.abstand-rund-xs > .elementor-container { padding: var(--gap-xs) !important; }

.elementor .elementor-element.abstand-rund-s,
.elementor .elementor-element.abstand-rund-s > .e-con-inner,
.elementor .elementor-element.abstand-rund-s > .elementor-container { padding: var(--gap-s) !important; }

.elementor .elementor-element.abstand-rund-m,
.elementor .elementor-element.abstand-rund-m > .e-con-inner,
.elementor .elementor-element.abstand-rund-m > .elementor-container { padding: var(--gap-m) !important; }

.elementor .elementor-element.abstand-rund-l,
.elementor .elementor-element.abstand-rund-l > .e-con-inner,
.elementor .elementor-element.abstand-rund-l > .elementor-container { padding: var(--gap-l) !important; }

.elementor .elementor-element.abstand-rund-xl,
.elementor .elementor-element.abstand-rund-xl > .e-con-inner,
.elementor .elementor-element.abstand-rund-xl > .elementor-container { padding: var(--gap-xl) !important; }

.elementor .elementor-element.abstand-rund-xxl,
.elementor .elementor-element.abstand-rund-xxl > .e-con-inner,
.elementor .elementor-element.abstand-rund-xxl > .elementor-container { padding: var(--gap-xxl) !important; }

.elementor .elementor-element.abstand-rund-xxxl,
.elementor .elementor-element.abstand-rund-xxxl > .e-con-inner,
.elementor .elementor-element.abstand-rund-xxxl > .elementor-container { padding: var(--gap-xxxl) !important; }

/* ----------------------
   PADDING: abstand-inline-* (left+right)
   => Layout-Abstand: GAP
---------------------- */
.elementor .elementor-element.abstand-inline-0,
.elementor .elementor-element.abstand-inline-0 > .e-con-inner,
.elementor .elementor-element.abstand-inline-0 > .elementor-container { padding-inline: var(--gap-0) !important; }

.elementor .elementor-element.abstand-inline-xxs,
.elementor .elementor-element.abstand-inline-xxs > .e-con-inner,
.elementor .elementor-element.abstand-inline-xxs > .elementor-container { padding-inline: var(--gap-xxs) !important; }

.elementor .elementor-element.abstand-inline-xs,
.elementor .elementor-element.abstand-inline-xs > .e-con-inner,
.elementor .elementor-element.abstand-inline-xs > .elementor-container { padding-inline: var(--gap-xs) !important; }

.elementor .elementor-element.abstand-inline-s,
.elementor .elementor-element.abstand-inline-s > .e-con-inner,
.elementor .elementor-element.abstand-inline-s > .elementor-container { padding-inline: var(--gap-s) !important; }

.elementor .elementor-element.abstand-inline-m,
.elementor .elementor-element.abstand-inline-m > .e-con-inner,
.elementor .elementor-element.abstand-inline-m > .elementor-container { padding-inline: var(--gap-m) !important; }

.elementor .elementor-element.abstand-inline-l,
.elementor .elementor-element.abstand-inline-l > .e-con-inner,
.elementor .elementor-element.abstand-inline-l > .elementor-container { padding-inline: var(--gap-l) !important; }

.elementor .elementor-element.abstand-inline-xl,
.elementor .elementor-element.abstand-inline-xl > .e-con-inner,
.elementor .elementor-element.abstand-inline-xl > .elementor-container { padding-inline: var(--gap-xl) !important; }

.elementor .elementor-element.abstand-inline-xxl,
.elementor .elementor-element.abstand-inline-xxl > .e-con-inner,
.elementor .elementor-element.abstand-inline-xxl > .elementor-container { padding-inline: var(--gap-xxl) !important; }

.elementor .elementor-element.abstand-inline-xxxl,
.elementor .elementor-element.abstand-inline-xxxl > .e-con-inner,
.elementor .elementor-element.abstand-inline-xxxl > .elementor-container { padding-inline: var(--gap-xxxl) !important; }

/* ----------------------
   PADDING: nur oben / nur unten
   => Layout-Abstand: GAP
---------------------- */
.elementor .elementor-element.abstand-oben-0,
.elementor .elementor-element.abstand-oben-0 > .e-con-inner,
.elementor .elementor-element.abstand-oben-0 > .elementor-container { padding-top: var(--gap-0) !important; }

.elementor .elementor-element.abstand-oben-xxs,
.elementor .elementor-element.abstand-oben-xxs > .e-con-inner,
.elementor .elementor-element.abstand-oben-xxs > .elementor-container { padding-top: var(--gap-xxs) !important; }

.elementor .elementor-element.abstand-oben-xs,
.elementor .elementor-element.abstand-oben-xs > .e-con-inner,
.elementor .elementor-element.abstand-oben-xs > .elementor-container { padding-top: var(--gap-xs) !important; }

.elementor .elementor-element.abstand-oben-s,
.elementor .elementor-element.abstand-oben-s > .e-con-inner,
.elementor .elementor-element.abstand-oben-s > .elementor-container { padding-top: var(--gap-s) !important; }

.elementor .elementor-element.abstand-oben-m,
.elementor .elementor-element.abstand-oben-m > .e-con-inner,
.elementor .elementor-element.abstand-oben-m > .elementor-container { padding-top: var(--gap-m) !important; }

.elementor .elementor-element.abstand-oben-l,
.elementor .elementor-element.abstand-oben-l > .e-con-inner,
.elementor .elementor-element.abstand-oben-l > .elementor-container { padding-top: var(--gap-l) !important; }

.elementor .elementor-element.abstand-oben-xl,
.elementor .elementor-element.abstand-oben-xl > .e-con-inner,
.elementor .elementor-element.abstand-oben-xl > .elementor-container { padding-top: var(--gap-xl) !important; }

.elementor .elementor-element.abstand-oben-xxl,
.elementor .elementor-element.abstand-oben-xxl > .e-con-inner,
.elementor .elementor-element.abstand-oben-xxl > .elementor-container { padding-top: var(--gap-xxl) !important; }

.elementor .elementor-element.abstand-oben-xxxl,
.elementor .elementor-element.abstand-oben-xxxl > .e-con-inner,
.elementor .elementor-element.abstand-oben-xxxl > .elementor-container { padding-top: var(--gap-xxxl) !important; }

.elementor .elementor-element.abstand-unten-0,
.elementor .elementor-element.abstand-unten-0 > .e-con-inner,
.elementor .elementor-element.abstand-unten-0 > .elementor-container { padding-bottom: var(--gap-0) !important; }

.elementor .elementor-element.abstand-unten-xxs,
.elementor .elementor-element.abstand-unten-xxs > .e-con-inner,
.elementor .elementor-element.abstand-unten-xxs > .elementor-container { padding-bottom: var(--gap-xxs) !important; }

.elementor .elementor-element.abstand-unten-xs,
.elementor .elementor-element.abstand-unten-xs > .e-con-inner,
.elementor .elementor-element.abstand-unten-xs > .elementor-container { padding-bottom: var(--gap-xs) !important; }

.elementor .elementor-element.abstand-unten-s,
.elementor .elementor-element.abstand-unten-s > .e-con-inner,
.elementor .elementor-element.abstand-unten-s > .elementor-container { padding-bottom: var(--gap-s) !important; }

.elementor .elementor-element.abstand-unten-m,
.elementor .elementor-element.abstand-unten-m > .e-con-inner,
.elementor .elementor-element.abstand-unten-m > .elementor-container { padding-bottom: var(--gap-m) !important; }

.elementor .elementor-element.abstand-unten-l,
.elementor .elementor-element.abstand-unten-l > .e-con-inner,
.elementor .elementor-element.abstand-unten-l > .elementor-container { padding-bottom: var(--gap-l) !important; }

.elementor .elementor-element.abstand-unten-xl,
.elementor .elementor-element.abstand-unten-xl > .e-con-inner,
.elementor .elementor-element.abstand-unten-xl > .elementor-container { padding-bottom: var(--gap-xl) !important; }

.elementor .elementor-element.abstand-unten-xxl,
.elementor .elementor-element.abstand-unten-xxl > .e-con-inner,
.elementor .elementor-element.abstand-unten-xxl > .elementor-container { padding-bottom: var(--gap-xxl) !important; }

.elementor .elementor-element.abstand-unten-xxxl,
.elementor .elementor-element.abstand-unten-xxxl > .e-con-inner,
.elementor .elementor-element.abstand-unten-xxxl > .elementor-container { padding-bottom: var(--gap-xxxl) !important; }

/* ----------------------
   MARGIN Utilities (für Widgets/Elemente)
   => Element-/Content-Abstand: STACK
---------------------- */
.elementor .elementor-element.margin-oben-0 { margin-top: var(--stack-0) !important; }
.elementor .elementor-element.margin-oben-xxs { margin-top: var(--stack-xxs) !important; }
.elementor .elementor-element.margin-oben-xs { margin-top: var(--stack-xs) !important; }
.elementor .elementor-element.margin-oben-s { margin-top: var(--stack-s) !important; }
.elementor .elementor-element.margin-oben-m { margin-top: var(--stack-m) !important; }
.elementor .elementor-element.margin-oben-l { margin-top: var(--stack-l) !important; }
.elementor .elementor-element.margin-oben-xl { margin-top: var(--stack-xl) !important; }
.elementor .elementor-element.margin-oben-xxl { margin-top: var(--stack-xxl) !important; }
.elementor .elementor-element.margin-oben-xxxl { margin-top: var(--stack-xxxl) !important; }

.elementor .elementor-element.margin-unten-0 { margin-bottom: var(--stack-0) !important; }
.elementor .elementor-element.margin-unten-xxs { margin-bottom: var(--stack-xxs) !important; }
.elementor .elementor-element.margin-unten-xs { margin-bottom: var(--stack-xs) !important; }
.elementor .elementor-element.margin-unten-s { margin-bottom: var(--stack-s) !important; }
.elementor .elementor-element.margin-unten-m { margin-bottom: var(--stack-m) !important; }
.elementor .elementor-element.margin-unten-l { margin-bottom: var(--stack-l) !important; }
.elementor .elementor-element.margin-unten-xl { margin-bottom: var(--stack-xl) !important; }
.elementor .elementor-element.margin-unten-xxl { margin-bottom: var(--stack-xxl) !important; }
.elementor .elementor-element.margin-unten-xxxl { margin-bottom: var(--stack-xxxl) !important; }

.elementor .elementor-element.margin-block-0 { margin-block: var(--stack-0) !important; }
.elementor .elementor-element.margin-block-xxs { margin-block: var(--stack-xxs) !important; }
.elementor .elementor-element.margin-block-xs { margin-block: var(--stack-xs) !important; }
.elementor .elementor-element.margin-block-s { margin-block: var(--stack-s) !important; }
.elementor .elementor-element.margin-block-m { margin-block: var(--stack-m) !important; }
.elementor .elementor-element.margin-block-l { margin-block: var(--stack-l) !important; }
.elementor .elementor-element.margin-block-xl { margin-block: var(--stack-xl) !important; }
.elementor .elementor-element.margin-block-xxl { margin-block: var(--stack-xxl) !important; }
.elementor .elementor-element.margin-block-xxxl { margin-block: var(--stack-xxxl) !important; }