/* =========================
   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: 0.75;
  --trace-scale:   1.0;
  --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);
}

/* The SVG is printed inline by the theme (functions.php). It stays hidden
   until the trace animation script has applied its reveal mask, so the
   finished artwork never flashes before the draw-on starts. */
.zid-hero-trace-layer svg {
  display: block;
  width: 100%;
  height: 100%;
  transform: scale(var(--trace-scale)) translate(var(--trace-x), var(--trace-y));
  transform-origin: center center;
  overflow: visible;
  visibility: hidden;
}

.zid-hero-trace-layer svg.zid-trace-ready {
  visibility: visible;
}

/* =========================
   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: 3;            /* above trace + brushed layers, below text card */
  pointer-events: none;
}

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

/* Color knobs */
: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);
}