/* Layer animato iniettato nell'hero */
#wsal-layer {
  position: absolute;
  left: 0;
  top: 0;
  width: 220px; /* Manteniamo la tua correzione che funziona */
  transform-origin: 50% 50%; /* IMPORTANTE: centra la trasformazione (scala/rotazione) */
  pointer-events: none;
  opacity: 0;
}

/* * Evita che le regole globali del tema comprimano o deformino l'SVG.
 * (Molti temi impongono `max-width: 100%` che non funziona in un contenitore
 * posizionato in absolute che parte con larghezza zero).
 */
#wsal-layer svg {
  display: block !important;
  max-width: none !important;
  height: auto !important;
}

/* (Opzionale) Se l'header deve stare sopra al layer durante lo scroll */
header.site-header,
.elementor-location-header,
.elementor-sticky--active {
  position: relative;
  z-index: 50;
}

/* (Opzionale) Quando il docking è terminato, nascondi il layer animato */
.wsal--docked #wsal-layer {
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 0.1s, visibility 0.1s;
}

/* (Opzionale) Permetti al layer di uscire dai bordi dell’hero */
#needweb-hero {
  position: relative;
  overflow: visible !important;
}