Airdrop: heartbeat dot positioning is fragile in MCap chart

[realproject7]

Problem

In PR #1038, the heartbeat animated dot is positioned over the SVG chart using a negative margin hack:

```tsx

\`\`\`

This `-mt-[52px]` is a magic number tied to the SVG's `viewBox` height (80) and the chart's rendered size. If the chart height, padding, or container width changes, the dot will be misaligned.

Fix

Position the dot inside the SVG as a `` element with CSS animation, rather than as an overlaid HTML element. This keeps it pixel-perfect regardless of SVG scaling.

```tsx
{/* Inside the SVG */}
<circle cx={fillX} cy={svgH / 2} r={6} fill="#00ff88" className="animate-ping" opacity={0.75} />
<circle cx={fillX} cy={svgH / 2} r={4} fill="#00ff88" />
```

Or use SVG `` for the pulse effect.

Files

• `src/components/airdrop/CampaignHero.tsx` — move heartbeat dot into SVG

Acceptance Criteria

• Heartbeat dot rendered inside SVG, not as HTML overlay
• Pulse animation preserved
• Dot stays aligned at all viewport sizes