/* Blueprint grid + soft glow behind dark sections/cards (same look as the home build section). Content stays above via z-index: -1 + isolation. */
.pricing-card,
.ecommerce-quote-card {
  isolation: isolate;
}

.pricing-card::before,
.pricing-card::after,
.ecommerce-quote-card::before,
.ecommerce-quote-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.pricing-card::before,
.ecommerce-quote-card::before {
  background-image:
    linear-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .08) 1px, transparent 1px);
  background-size: 11.5cqw 11.5cqw;
  background-position: center top;
  -webkit-mask-image: radial-gradient(ellipse at 50% 38%, #000 25%, transparent 78%);
  mask-image: radial-gradient(ellipse at 50% 38%, #000 25%, transparent 78%);
  transition: background-position 1.2s ease;
}

.pricing-card::after,
.ecommerce-quote-card::after {
  background:
    radial-gradient(60% 38% at 100% 0%, rgba(25, 151, 194, .3), transparent 70%),
    radial-gradient(55% 30% at 0% 100%, rgba(25, 151, 194, .16), transparent 70%);
  opacity: .8;
  transition: opacity .5s ease;
}

.pricing-card:hover::before,
.ecommerce-quote-card:hover::before { background-position: center 11.5cqw; }
.pricing-card:hover::after,
.ecommerce-quote-card:hover::after { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .pricing-card::before,
  .pricing-card::after,
  .ecommerce-quote-card::before,
  .ecommerce-quote-card::after { transition: none; }
}

/* Business Starter package + Development Languages section: fixed-size grid. */
.collaborative-package,
.technology-section {
  isolation: isolate;
}

.collaborative-package::before,
.collaborative-package::after,
.technology-section::before,
.technology-section::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.technology-section {
  position: relative;
}

.ecommerce-sales-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.ecommerce-sales-cta::before,
.ecommerce-sales-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.ecommerce-sales-cta::before {
  background-image:
    linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 45%, #000 20%, transparent 78%);
  mask-image: radial-gradient(ellipse at 50% 45%, #000 20%, transparent 78%);
}

.ecommerce-sales-cta::after {
  background:
    radial-gradient(45% 55% at 100% 0%, rgba(25, 151, 194, .22), transparent 70%),
    radial-gradient(40% 50% at 0% 100%, rgba(25, 151, 194, .12), transparent 70%);
  pointer-events: none;
}

.ecommerce-sales-cta__content {
  position: relative;
  z-index: 1;
}

.ecommerce-page .ecommerce-sales-cta::before {
  background-image:
    linear-gradient(rgba(0, 26, 54, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 26, 54, .08) 1px, transparent 1px);
}

.ecommerce-page .ecommerce-sales-cta::after {
  background:
    radial-gradient(45% 55% at 100% 0%, rgba(25, 151, 194, .12), transparent 70%),
    radial-gradient(40% 50% at 0% 100%, rgba(25, 151, 194, .08), transparent 70%);
}

.collaborative-package::before,
.technology-section::before {
  background-image:
    linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 45%, #000 20%, transparent 78%);
  mask-image: radial-gradient(ellipse at 50% 45%, #000 20%, transparent 78%);
}

.technology-section::before { background-size: 56px 56px; }

.collaborative-package::after,
.technology-section::after {
  background:
    radial-gradient(45% 55% at 100% 0%, rgba(25, 151, 194, .26), transparent 70%),
    radial-gradient(40% 50% at 0% 100%, rgba(25, 151, 194, .14), transparent 70%);
}