/* Sentient Spaces — Laplacian growth background.
   A fixed layer behind everything, never in the way of a click. */

.ssg-host {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}

.ssg-canvas {
  display: block;
  width: 100%;
  height: 100%;
}

/* Sections painted a solid colour would sit on top of the layer; this lets it read
   through them while leaving their own imagery alone. Applied only when asked for. */
body.ssg-show-through .elementor-section,
body.ssg-show-through .e-con,
body.ssg-show-through .e-con-inner {
  background-color: transparent !important;
}

/* The header is chrome, not page — it stays a solid bar so the words on it never sit
   over moving linework. */
body.ssg-show-through .xpro-theme-builder-header,
body.ssg-show-through .xpro-theme-builder-header .e-con,
body.ssg-show-through .xpro-theme-builder-header .e-con-inner,
body.ssg-show-through .xpro-theme-builder-header .elementor-section,
body.ssg-show-through header .e-con,
body.ssg-show-through header .e-con-inner {
  background-color: #07080a !important;
}

/* The layer sits behind everything, so the ground has to move up to the root and the
   body has to stop painting over it. */
html.ssg-root { background-color: #07080a; }
body.ssg-on { background-color: transparent !important; }

/* In the settings screen the layer is a normal block, not a fixed backdrop. */
.ssg-preview {
  position: relative;
  height: 320px;
  background: #07080a;
  border: 1px solid #c3c4c7;
  overflow: hidden;
}

.ssg-preview .ssg-host {
  position: absolute;
  z-index: 0;
}