/* ===== Liquid Ether base (works for any section with class .liquid-ether) ===== */
.liquid-ether {
  position: relative;
  overflow: hidden;
}

.liquid-ether .liquid-ether-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none; /* keep buttons/links clickable */
  z-index: 0;           /* canvas sits behind your content */
}

/* Generic helper to ensure content stacks above canvas */
.liquid-ether > *,
.liquid-ether .znb-section-content,
.liquid-ether .znpb-section-content,
.liquid-ether .zion-inner,
.liquid-ether .kl-content,
.liquid-ether .container,
.liquid-ether .row,
.liquid-ether .columns {
  position: relative;
  z-index: 2;
}

/* ===== Second section (no Custom HTML), target by ID ===== */
/* Change #second-hero if you used a different ID in Zion Builder */
#second-hero.liquid-ether {
  background: #201e59;   /* your background */
  min-height: 200px;     /* match the height you want */
}

/* The canvas inside the second section (kept for specificity) */
#second-hero .liquid-ether-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

/* Make absolutely sure Zion inner wrappers stack above in second section */
#second-hero > *,
#second-hero .znb-section-content,
#second-hero .znpb-section-content,
#second-hero .zion-inner,
#second-hero .kl-content,
#second-hero .container,
#second-hero .row,
#second-hero .columns {
  position: relative;
  z-index: 2;
}
