/* ==========================================================
   HOSTED COMMUNICATIONS - NETWORK PARTICLE BACKGROUND

   Elementor class:
   hc-particles

   Purpose:
   - subtle network particle background
   - keeps Elementor content above particles
   - preserves Elementor shape dividers
   - responsive
   - reduced-motion aware
   ========================================================== */


/* ==========================================================
   PARTICLE HOST
   ========================================================== */

.hc-particles {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}


/* ==========================================================
   PARTICLE LAYER
   ========================================================== */

.hc-particles .hc-particles-canvas {
  position: absolute !important;

  inset: 0;

  width: 100% !important;
  height: 100% !important;

  z-index: 0;

  /*
   * Canvas must never block Elementor buttons,
   * links or other interactive content.
   */
  pointer-events: none;
}


/* Actual tsParticles canvas */
.hc-particles .hc-particles-canvas canvas {
  position: absolute !important;

  inset: 0;

  width: 100% !important;
  height: 100% !important;

  display: block;
}


/* ==========================================================
   ELEMENTOR CONTENT LAYER

   IMPORTANT:
   Do NOT target every direct child here.
   Doing so interferes with Elementor shape dividers.
   ========================================================== */

.hc-particles > .e-con-inner {
  position: relative;
  z-index: 2;
}


/*
 * Current Elementor containers can also place widgets/
 * child containers directly inside the parent container.
 *
 * Raise normal Elementor content, but explicitly exclude:
 * - our particle layer
 * - Elementor shape dividers
 */
.hc-particles > .elementor-element:not(.hc-particles-canvas):not(.elementor-shape) {
  position: relative;
  z-index: 2;
}


/* ==========================================================
   ELEMENTOR SHAPE DIVIDER PROTECTION

   Do not allow particle layering to alter its positioning.
   ========================================================== */

.hc-particles > .elementor-shape {
  position: absolute !important;

  left: 0;
  width: 100%;

  z-index: 1;

  pointer-events: none;
}


.hc-particles > .elementor-shape-bottom {
  bottom: -1px !important;
  top: auto !important;
}


.hc-particles > .elementor-shape-top {
  top: -1px !important;
  bottom: auto !important;
}


/* ==========================================================
   SUBTLE ATMOSPHERIC OVERLAY

   Very restrained. Keeps particles visually behind content.
   ========================================================== */

.hc-particles::after {
  content: "";

  position: absolute;
  inset: 0;

  z-index: 1;

  pointer-events: none;

  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(255, 255, 255, 0) 0%,
      rgba(16, 17, 20, 0.015) 60%,
      rgba(16, 17, 20, 0.035) 100%
    );
}


/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

  .hc-particles .hc-particles-canvas {
    display: none !important;
  }

}