/* =========================
   TRACE LAYER KNOBS
   Change these values to tune the circuit trace overlay.
   
   --trace-opacity : 0 = invisible, 1 = full strength (try 0.20–0.45)
   --trace-scale   : 1 = natural size, 1.2 = 20% bigger, 0.8 = 20% smaller
   --trace-x       : horizontal shift — negative = left, positive = right (use %, px, or vw)
   --trace-y       : vertical shift — negative = up, positive = down (use %, px, or vh)
   ========================= */
:root {
  --trace-opacity: 1.0;
  --trace-scale:   1.04;
  --trace-x:       -9%;
  --trace-y:      2%;
}

/* =========================
   CIRCUIT TRACE LAYER
   ========================= */
.zid-hero-trace-layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: visible;
  opacity: var(--trace-opacity);
}

.zid-hero-trace-layer img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right center;
  transform: scale(var(--trace-scale)) translate(var(--trace-x), var(--trace-y));
  transform-origin: center center;
}

/* =========================
   ZID HERO — NODE CANVAS LAYERING
   ========================= */
/* Cover becomes the clipping + positioning root */
.zid-hero {
  position: relative;
  overflow: hidden;
}

/* The injected canvas layer */
.zid-hero .zid-hero-nodes-layer {
  position: absolute;
  inset: 0;
  z-index: 2;            /* above background image, below text card */
  pointer-events: none;
}

/* Keep the text card above */
.zid-hero .zid-hero-card {
  position: relative;
  z-index: 3;
}

/* Color knobs (use your palette here if you want)
   - node/edge are the crisp pass
   - glow-core/mid/outer are the multi-pass emission layers
*/
:root {
  --zid-node: rgba(180, 191, 206, 0.88);
  --zid-edge: rgba(180, 191, 206, 0.35);
  --zid-glow: rgba(242, 244, 247, 0.95);
  --zid-glow-core:  rgba(242, 244, 247, 0.90);
  --zid-glow-mid:   rgba(180, 191, 206, 0.65);
  --zid-glow-outer: rgba(79, 111, 148, 0.42);
}