/* STLBEAST V390 — Hero background refinement.
   Goal: replace the current hero wallpaper feel with a cleaner premium background.
   Darker, more cinematic, less distracting, more premium industrial/neon.
   Safe CSS-only patch. */

.stlb375-hero{
  background:
    radial-gradient(circle at 18% 16%, rgba(33,201,255,.16), transparent 24%),
    radial-gradient(circle at 82% 18%, rgba(137,72,255,.14), transparent 28%),
    radial-gradient(circle at 55% 82%, rgba(17,73,129,.12), transparent 30%),
    linear-gradient(180deg, #07111d 0%, #050b14 52%, #060d17 100%) !important;
  border-bottom:1px solid rgba(34,227,255,.10) !important;
}
.stlb375-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.72;
  background:
    radial-gradient(circle at 50% 8%, rgba(255,255,255,.07), transparent 18%),
    linear-gradient(90deg, transparent 0%, rgba(34,227,255,.07) 10%, transparent 24%, transparent 76%, rgba(255,79,203,.06) 90%, transparent 100%),
    repeating-linear-gradient(135deg, transparent 0 110px, rgba(255,255,255,.018) 110px 111px, transparent 111px 222px);
}
.stlb375-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), transparent 14%),
    radial-gradient(circle at 50% 50%, transparent 48%, rgba(0,0,0,.18) 100%);
  mix-blend-mode:screen;
  opacity:.42;
}

.stlb375-hero-bg{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 58% 38%, rgba(34,227,255,.08), transparent 20%),
    radial-gradient(circle at 75% 52%, rgba(173,72,255,.08), transparent 26%),
    radial-gradient(circle at 18% 40%, rgba(24,102,185,.07), transparent 24%);
  filter:blur(10px);
  opacity:.9;
}

.stlb375-hero-grid{
  position:relative;
  z-index:2;
}

.stlb375-hero-copy{
  position:relative;
}
.stlb375-hero-copy::before{
  content:"";
  position:absolute;
  inset:-20px -18px -22px -10px;
  border-radius:28px;
  background:
    radial-gradient(circle at 18% 10%, rgba(34,227,255,.08), transparent 28%),
    linear-gradient(180deg, rgba(6,16,29,.42), rgba(6,11,20,.14));
  border:1px solid rgba(34,227,255,.06);
  box-shadow: inset 0 0 30px rgba(34,227,255,.02);
  z-index:-1;
}
.stlb375-stage-glow{
  background:
    radial-gradient(circle at 40% 46%, rgba(22,131,216,.28), transparent 46%),
    radial-gradient(circle at 74% 58%, rgba(147,52,255,.14), transparent 36%) !important;
  filter:blur(24px) !important;
  opacity:.85;
}
.stlb388-circuit-layer{
  inset:4% 0 2% !important;
  border-radius:34px !important;
  opacity:.55 !important;
  background:
    linear-gradient(180deg, rgba(7,17,30,.18), rgba(6,11,19,.02)),
    radial-gradient(circle at 20% 22%, rgba(34,227,255,.10), transparent 18%),
    radial-gradient(circle at 82% 28%, rgba(255,79,203,.08), transparent 20%),
    repeating-linear-gradient(135deg, transparent 0 120px, rgba(255,255,255,.018) 120px 121px, transparent 121px 240px) !important;
  filter:saturate(1.02) blur(.2px);
}
.stlb388-showcase-console{
  position:relative;
}
.stlb388-showcase-console::before{
  content:"";
  position:absolute;
  inset:-12px;
  border-radius:34px;
  background:
    linear-gradient(180deg, rgba(4,11,21,.28), rgba(5,9,16,.06)),
    radial-gradient(circle at 72% 44%, rgba(34,227,255,.05), transparent 22%);
  border:1px solid rgba(34,227,255,.07);
  z-index:-1;
  pointer-events:none;
}
.stlb388-main-product{
  background:
    radial-gradient(circle at 50% 44%, rgba(34,227,255,.06), transparent 38%),
    linear-gradient(180deg, rgba(2,6,12,.98), rgba(3,7,14,.96)) !important;
}
.stlb388-validated-card{
  background:
    radial-gradient(circle at 88% 10%, rgba(255,79,203,.10), transparent 34%),
    linear-gradient(180deg, rgba(6,13,25,.97), rgba(4,9,18,.98)) !important;
}
.stlb388-mosaic-item{
  background:
    radial-gradient(circle at center, rgba(34,227,255,.10), rgba(3,7,14,.98) 70%) !important;
}

/* Mobile: keep the cleaner background but reduce decorative spread. */
@media(max-width:820px){
  .stlb375-hero{
    background:
      radial-gradient(circle at 18% 12%, rgba(33,201,255,.13), transparent 24%),
      radial-gradient(circle at 84% 14%, rgba(137,72,255,.10), transparent 26%),
      linear-gradient(180deg, #07111d 0%, #050b14 55%, #060d17 100%) !important;
  }
  .stlb375-hero::before{
    opacity:.55;
    background:
      linear-gradient(90deg, transparent 0%, rgba(34,227,255,.06) 8%, transparent 22%, transparent 78%, rgba(255,79,203,.05) 92%, transparent 100%),
      repeating-linear-gradient(135deg, transparent 0 130px, rgba(255,255,255,.014) 130px 131px, transparent 131px 262px);
  }
  .stlb375-hero-copy::before{
    inset:-12px -8px -14px -6px;
    border-radius:22px;
  }
  .stlb388-circuit-layer{
    inset:2% 0 0 !important;
    opacity:.42 !important;
  }
}
@media(max-width:390px){
  .stlb375-hero-copy::before{
    inset:-10px -6px -10px -4px;
  }
}