/* ═══ VIBRANT HERO — additive only ═══ */
.hero {
  background:
    radial-gradient(ellipse 60% 50% at 15% 25%, rgba(232,25,44,0.07), transparent 60%),
    radial-gradient(ellipse 55% 45% at 85% 75%, rgba(26,58,110,0.10), transparent 60%),
    #fff !important;
}

/* Floating orbs */
.hero::before, .hero::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  pointer-events: none;
  z-index: 0;
}
.hero::before {
  width: 400px; height: 400px;
  background: rgba(232,25,44,0.15);
  top: -80px; left: -60px;
  animation: floatA 14s ease-in-out infinite;
}
.hero::after {
  width: 350px; height: 350px;
  background: rgba(26,58,110,0.18);
  bottom: -80px; right: 5%;
  animation: floatB 18s ease-in-out infinite;
}
@keyframes floatA { 0%,100%{transform:translate(0,0)} 50%{transform:translate(30px,-25px)} }
@keyframes floatB { 0%,100%{transform:translate(0,0)} 50%{transform:translate(-25px,20px)} }

/* Shimmer on "Eleven" */
.hero h1 em {
  background: linear-gradient(90deg, var(--red), #ff7a8a, var(--red));
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shimmer 4s linear infinite;
}
@keyframes shimmer { to { background-position: 200% center; } }

/* Button glow + shine */
.btn-primary {
  box-shadow: 0 6px 20px -6px rgba(232,25,44,0.5) !important;
}
.btn-primary:hover {
  box-shadow: 0 10px 28px -6px rgba(232,25,44,0.65) !important;
  transform: translateY(-2px) !important;
}

/* Map float + glow */
.map-bg {
  animation: mapFloat 6s ease-in-out infinite;
  box-shadow: 0 20px 60px -20px rgba(10,22,40,0.25);
}
@keyframes mapFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }

/* Map dots — bigger pulse */
.map-dot-ring.pulse {
  animation: map-pulse 2.5s ease-out infinite;
}
@keyframes map-pulse {
  0%   { r: 5px; opacity: 0.7; }
  100% { r: 22px; opacity: 0; }
}

/* Kicker dot pulse */
.hero-kicker {
  position: relative;
}
.hero-kicker span:first-child,
.hero-kicker::before {
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  .hero::before, .hero::after, .hero h1 em, .map-bg { animation: none !important; }
  .hero h1 em { -webkit-text-fill-color: var(--red); }
}