/* ============================================================================
   GAP MINING — CANONICAL SHARED BACKGROUND (site-bg.css)
   ----------------------------------------------------------------------------
   ONE backdrop for every page: the gold-crystal circuit image over #07090f
   with a top-light → bottom-dark legibility vignette. This matches the
   index.html hero exactly (same image, same anchor point `center 15%`).

   USAGE (every page except index.html, which already IS the reference):
     1. <link rel="stylesheet" href="/site-bg.css">  — placed AFTER the page's
        inline <style> so the body override wins the cascade.
     2. <div class="gm-bg" aria-hidden="true"></div> — first element in <body>.

   Page-local solid body colours are neutralised here so the shared layer
   shows through; content panels should be solid dark (no frosted glass).
   ============================================================================ */

html { background: #07090f; }
body { background: transparent !important; }

.gm-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(
      to bottom,
      rgba(7, 9, 15, 0.20) 0%,
      rgba(7, 9, 15, 0.38) 30%,
      rgba(7, 9, 15, 0.66) 58%,
      rgba(7, 9, 15, 0.88) 82%,
      rgba(7, 9, 15, 0.94) 100%
    ),
    url('/hero-crystals.png') center 15% / cover no-repeat #07090f;
}

/* Dim variant — SAME image, SAME anchor, heavier scrim. For text-heavy pages
   (legal, docs, reports, dashboards) where paragraphs sit directly on the
   backdrop: crystals stay visible but subdued so copy is readable at any
   scroll position. */
.gm-bg--dim {
  background:
    linear-gradient(
      to bottom,
      rgba(7, 9, 15, 0.62) 0%,
      rgba(7, 9, 15, 0.74) 40%,
      rgba(7, 9, 15, 0.88) 75%,
      rgba(7, 9, 15, 0.94) 100%
    ),
    url('/hero-crystals.png') center 15% / cover no-repeat #07090f;
}

/* Solid panel standard — replaces the old misty-glass card look.
   Apply .gm-panel (or copy these values) wherever a translucent
   backdrop-filter card used to be. */
.gm-panel {
  background: rgba(10, 13, 20, 0.92);
  border: 1px solid rgba(212, 168, 67, 0.18);
}

@media print {
  .gm-bg { display: none; }
  html, body { background: #ffffff !important; }
}
