/* SPIDER V14 — mobile-only transaction map stacking and stable menu layer */
@media (max-width: 720px) {
  /* Keep the transaction map self-contained. */
  .spider-premium-2 .p2-transaction-map {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
  }

  /* Decorative grid and connecting paths always stay at the back. */
  .spider-premium-2 .p2-transaction-map::before,
  .spider-premium-2 .p2-transaction-map::after,
  .spider-premium-2 .p2-map-svg,
  .spider-premium-2 .p2-map-svg * {
    z-index: 0 !important;
    pointer-events: none !important;
  }

  /* Outer requirement/service cards remain below the central SPIDER core. */
  .spider-premium-2 .p2-map-node {
    z-index: 4 !important;
    position: absolute !important;
  }

  /* The central circle must always be visually dominant. */
  .spider-premium-2 .p2-map-core {
    z-index: 30 !important;
    position: absolute !important;
    isolation: isolate !important;
    pointer-events: none !important;
    background:
      radial-gradient(circle at 42% 35%, rgba(255, 112, 55, .34), rgba(28, 16, 28, .96) 58%, rgba(7, 14, 29, .99) 100%) !important;
    border: 1px solid rgba(255, 106, 42, .78) !important;
    box-shadow:
      0 0 0 1px rgba(255, 106, 42, .22),
      0 0 34px rgba(255, 106, 42, .28),
      inset 0 0 28px rgba(255, 106, 42, .16) !important;
  }

  .spider-premium-2 .p2-map-core > * {
    position: relative !important;
    z-index: 31 !important;
  }

  /* Prevent a mobile menu opening from changing document flow. */
  .header .mobile-panel,
  .header .nav-shell {
    margin: 0 !important;
    transform: none !important;
    contain: layout paint !important;
  }
}