/*!
 * HMX Sticky Image — v1.0.0
 * © HMXNETWORK
 *
 * Lässt ein Bild (oder ein beliebiges Element) in seiner Spalte/Section beim
 * Scrollen "mitlaufen": es bleibt oben angeheftet, bis die Spalte/Section endet,
 * und scrollt dann mit dem Spaltenende weg.
 *
 * Steuerklasse:  hmx-sticky-image
 *   → im Elementor-BILD-WIDGET unter  Erweitert → CSS-Klassen  eintragen.
 *
 * Das zugehörige JS (hmx-sticky-image.js) aktiviert den Effekt erst, nachdem
 * Browser-Support, Viewport-Breite und Lauf-Spielraum geprüft sind. Es setzt
 * dann die Klasse  .hmx-sticky--active  sowie die Variable  --hmx-sticky-top.
 */

/* Aktiver Zustand — wird vom JavaScript gesetzt. */
.hmx-sticky-image.hmx-sticky--active {
  position: -webkit-sticky;
  position: sticky;
  top: var(--hmx-sticky-top, 40px);
  align-self: flex-start;   /* im Flex-Layout nicht dehnen → das Bild kann "laufen" */
  z-index: 2;
}

/* Sicherheitsnetz: Unter 1025 px stapeln sich die Elementor-Spalten. Dort soll
   das Bild normal im Fluss bleiben. Das JS deaktiviert dort ohnehin; diese Regel
   ist die zusätzliche Absicherung (gleiche Spezifität, steht später → gewinnt). */
@media (max-width: 1024px) {
  .hmx-sticky-image.hmx-sticky--active {
    position: static;
    top: auto;
  }
}