html {
  background: #02070d;
}

body.compact-home {
  position: relative;
  isolation: isolate;
  background: transparent;
}

.particle-background {
  position: fixed;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100vh;
  height: 100lvh;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 42%, rgba(51, 128, 214, .2), transparent 31%),
    #02070d;
}

.particle-background canvas {
  display: block;
  width: 100%;
  height: 100%;
  opacity: .58;
  transform: translateX(8vw) scale(1.04);
  transform-origin: center;
}

body.compact-home::before {
  z-index: -2;
  background:
    radial-gradient(circle at 50% 42%, transparent 10%, rgba(0, 5, 10, .08) 48%, rgba(0, 3, 7, .66) 100%),
    linear-gradient(90deg, rgba(0, 4, 9, .48) 0%, transparent 31%, transparent 70%, rgba(0, 3, 8, .42) 100%);
  transform: none;
  opacity: 1;
  mask-image: none;
}

body.compact-home::after {
  z-index: -1;
  background-image:
    linear-gradient(rgba(151, 205, 238, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151, 205, 238, .035) 1px, transparent 1px);
  background-size: 64px 64px;
  opacity: .2;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .8), transparent 72%);
}

body.compact-home > main,
body.compact-home > .site-footer {
  position: relative;
  z-index: 0;
}

body.compact-home .profile-hero > div:first-child,
body.compact-home .profile-facts div,
body.compact-home .proof-strip div,
body.compact-home .evidence-item,
body.compact-home .case-row,
body.compact-home .capability-block {
  background: linear-gradient(145deg, rgba(5, 9, 14, .84), rgba(5, 9, 14, .7));
  border-color: rgba(192, 222, 242, .16);
}

body.compact-home .nav-shell {
  border-color: rgba(192, 222, 242, .17);
  background: rgba(3, 8, 13, .68);
}

body.compact-home .site-header.is-scrolled .nav-shell,
body.compact-home.menu-open .nav-links {
  background: rgba(3, 8, 13, .92);
}

@media (max-width: 680px) {
  .particle-background {
    background:
      radial-gradient(circle at 58% 38%, rgba(51, 128, 214, .17), transparent 34%),
      #02070d;
  }

  .particle-background canvas {
    opacity: .52;
    transform: translateX(3vw) scale(1.03);
  }

  body.compact-home::before {
    background:
      radial-gradient(circle at 52% 38%, transparent 8%, rgba(0, 5, 10, .16) 48%, rgba(0, 3, 7, .72) 100%),
      linear-gradient(90deg, rgba(0, 4, 9, .45), rgba(0, 3, 8, .28));
  }
}

@media (prefers-reduced-motion: reduce) {
  .particle-background canvas {
    opacity: .48;
  }
}