.page-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg, #020617 0%, #0b1220 100%);
}

.grid {
  display: none;
}

.orb {
  display: none;
}

.orb-a {
  background: rgba(251, 191, 36, 0.6);
  top: -160px;
  left: -140px;
}

.orb-b {
  background: rgba(34, 211, 238, 0.45);
  bottom: -180px;
  right: -160px;
  animation-delay: 2s;
}

.bg-map-pattern {
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.15) 1px, transparent 1px),
    linear-gradient(120deg, rgba(34, 211, 238, 0.25), transparent 60%);
  background-size: 18px 18px, cover;
}

.main-shell {
  background: #020617;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 32px;
  box-shadow: 0 30px 80px rgba(2, 6, 23, 0.55);
  margin-top: 24px;
  padding-top: 8px;
}

body {
  overflow-x: hidden;
}

.whatsapp-float {
  top: 35%;
  right: 24px;
}

.map-embed {
  height: 320px;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #f8fafc;
}

.map-embed-sm {
  height: 220px;
}

.leaflet-container {
  font-family: "Manrope", "Segoe UI", sans-serif;
  background: #f8fafc;
}

.leaflet-bar a {
  background: #ffffff;
  color: #0f172a;
  border: 1px solid rgba(15, 23, 42, 0.1);
}

.leaflet-bar a:hover {
  background: #e2e8f0;
}

.map-marker span {
  display: block;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #2563eb;
  box-shadow: 0 0 0 6px rgba(37, 99, 235, 0.2);
  border: 2px solid #ffffff;
}

.map-dot span {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.2);
  border: 1px solid #ffffff;
}

@media (min-width: 768px) {
  .map-embed {
    height: 380px;
  }
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-12px);
  }
}