/* ==========================================================================
   Hire-a-developer sub-pages: soft purple / yellow glow backgrounds
   Mirrors the glow treatment on /hire-software-developer/ using the same
   purplebg.png / yellowbg.png assets. Glows sit behind section content
   (isolation + z-index:-1) and never catch clicks.
   ========================================================================== */

.elementor-element-686f546,
.elementor-element-bf7e2ba,
.elementor-element-8ec5ee5,
.elementor-element-371d4ec,
.elementor-element-1304fa2,
.elementor-element-2f8970b,
.elementor-element-72f9e45 {
  position: relative;
  isolation: isolate;
}

.elementor-element-686f546::before,
.elementor-element-686f546::after,
.elementor-element-bf7e2ba::before,
.elementor-element-8ec5ee5::before,
.elementor-element-371d4ec::before,
.elementor-element-1304fa2::before,
.elementor-element-2f8970b::before,
.elementor-element-72f9e45::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* --- Hero: purple right, yellow left (skip pages that already have glow images) --- */
.elementor-element-686f546:not(:has(img[alt="purplebg"]))::before {
  background-image: url("/assets/images/2025_new/06/purplebg.png");
  width: 835px;
  height: 640px;
  left: auto;
  right: -120px;
  top: -200px;
  opacity: .75;
}
.elementor-element-686f546:not(:has(img[alt="yellowbg"]))::after {
  background-image: url("/assets/images/2025_new/06/yellowbg.png");
  width: 620px;
  height: 620px;
  left: -140px;
  right: auto;
  top: -220px;
}

/* --- "Why Hire ..." : yellow glow top-right --- */
.elementor-element-bf7e2ba::before {
  background-image: url("/assets/images/2025_new/06/yellowbg.png");
  width: 700px;
  height: 700px;
  left: auto;
  right: -160px;
  top: -180px;
}

/* --- "Reasons to Hire / Why Hire From Amenity" : big purple glow behind heading
       (same feel as "Hiring Developers Made Simple!") --- */
.elementor-element-8ec5ee5::before {
  background-image: url("/assets/images/2025_new/06/purplebg.png");
  width: 1000px;
  height: 1000px;
  left: calc(50% - 760px);
  top: -300px;
}

/* --- Long-form content sections (AI pages): alternate soft glows --- */
.elementor-element-2f8970b::before,
.elementor-element-72f9e45::before {
  background-image: url("/assets/images/2025_new/06/yellowbg.png");
  width: 760px;
  height: 760px;
  left: -220px;
  top: -160px;
}

/* --- Testimonials: yellow glow behind the intro copy --- */
.elementor-element-371d4ec::before {
  background-image: url("/assets/images/2025_new/06/yellowbg.png");
  width: 760px;
  height: 760px;
  left: -200px;
  top: -200px;
}

/* --- FAQ: subtle purple glow right --- */
.elementor-element-1304fa2::before {
  background-image: url("/assets/images/2025_new/06/purplebg.png");
  width: 760px;
  height: 760px;
  left: auto;
  right: -300px;
  top: -140px;
  opacity: .45;
}

/* --- Tablet / mobile: smaller, centred glows --- */
@media (max-width: 1024px) {
  .elementor-element-8ec5ee5::before {
    width: 700px;
    height: 700px;
    left: calc(50% - 350px);
    top: -200px;
  }
}

@media (max-width: 767px) {
  .elementor-element-686f546::before,
  .elementor-element-686f546::after,
  .elementor-element-bf7e2ba::before,
  .elementor-element-371d4ec::before,
  .elementor-element-1304fa2::before,
  .elementor-element-2f8970b::before,
    .elementor-element-72f9e45::before {
    width: 360px;
    height: 360px;
    top: -100px;
  }
  .elementor-element-686f546::after { left: -120px; }
  .elementor-element-686f546::before { right: -120px; }
  .elementor-element-8ec5ee5::before {
    width: 480px;
    height: 480px;
    left: calc(50% - 240px);
    top: -120px;
  }
}