/**
 * GFL — Services Hero background graphic host styles.
 * Full-bleed layer behind the hero copy: absolute, fills the hero, never
 * interactive. Hero copy sits above it on z-index 1.
 */
.sp__hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
  background: #0D0D0D;
  color: #F9F8F7;
}
.sp__hero-bg svg { display: block; width: 100%; height: 100%; }

/* Desktop-only, same contract as the Spline scene it replaces: mobile shows
   the static .hero-fallback-img instead (see gutenberg-blocks/blocks/banner.php). */
@media (max-width: 1199px) {
  .main-hero-banner .sp__hero-bg { display: none; }
}