/* ============================================================
   base.css — Background grid, orbs, global element defaults
   ============================================================ */

/* ── BACKGROUND GRID + ORBS ─────────────────────────── */
.bg-deco {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}
.bg-deco .grid {
  position: absolute;
  inset: -1px;
  background-image:
    linear-gradient(
      to right,
      rgba(255, 255, 255, 0.025) 1px,
      transparent 1px
    ),
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.025) 1px,
      transparent 1px
    );
  background-size: 56px 56px;
  mask-image: radial-gradient(
    ellipse 80% 60% at 50% 0%,
    black 30%,
    transparent 80%
  );
}
.bg-deco .orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(120px);
  opacity: 0.45;
}
.orb-a {
  top: -200px;
  left: -100px;
  width: 560px;
  height: 560px;
  background: radial-gradient(closest-side, #6674ff, transparent);
}
.orb-b {
  top: 280px;
  right: -160px;
  width: 520px;
  height: 520px;
  background: radial-gradient(closest-side, #9b5bff, transparent);
  opacity: 0.25;
}
.orb-c {
  top: 1500px;
  left: 50%;
  width: 600px;
  height: 600px;
  background: radial-gradient(closest-side, #22a878, transparent);
  opacity: 0.18;
  transform: translateX(-50%);
}