﻿.spider-bg-page{
  background:
    radial-gradient(circle at 20% 10%, rgba(116,215,255,.06), transparent 28%),
    radial-gradient(circle at 82% 8%, rgba(138,241,255,.04), transparent 22%),
    linear-gradient(180deg, #040a14 0%, #07111f 100%) !important;
  color: inherit;
}

.spider-loop-bg{
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 22%, rgba(116,215,255,.06), transparent 24%),
    linear-gradient(180deg, rgba(2,6,12,.32), rgba(2,6,12,.62));
}

.spider-loop-bg video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  opacity: .86;
  filter: saturate(1.08) contrast(1.04) brightness(.86);
}

.spider-loop-bg::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 50%, rgba(116,215,255,.10), transparent 24%),
    linear-gradient(180deg, rgba(3,8,18,.24), rgba(3,8,18,.60));
}

.spider-bg-page > *{
  position: relative;
  z-index: 2;
}

.spider-bg-page .page,
.spider-bg-page main,
.spider-bg-page .footer,
.spider-bg-page .nav,
.spider-bg-page .hero,
.spider-bg-page .section{
  position: relative;
  z-index: 2;
}
