feat(pulse-3d-landing): landing 3D completa — Atomic Design + Three.js + Design Tokens

- Atoms: Button, Badge, Card, GradientText, FloatingText, LightGlow, ThemeToggle, Typography
- Molecules: FloatingMesh, ParticleField, FeatureCard3d
- Organisms: HeroScene3d, FeaturesScene3d
- Templates: SceneCanvas, ThreePage (canvas + overlay 2D)
- Pages: App.tsx — Hero + FeaturesOverview + About + CTA wireframes
- Design Tokens completo: space/font/color/shadow/radius/material3d/camera3d/animation
- Globals CSS: reset, grid, scrollbar, focus-visible, light/dark mode
- Vite + React 18 + TypeScript + @react-three/fiber + drei + framer-motion
- npm install + dev server OK
- node_modules em .gitignore — commit apenas código fonte
- Repo standalone: pulse-3d-landing/

pulse-3d-landing/src/components/atoms/Badge.tsx

@@ -0,0 +1,44 @@
+/** Átomo: Badge
+ *  Etiqueta pequena — label de feature, versão ou categoria.
+ */
+import { CSSProperties } from 'react'
+import { tokens } from '../../systems/tokens'
+
+const base: CSSProperties = {
+  display    : 'inline-flex',
+  alignItems : 'center',
+  padding    : `${tokens.space[1]} ${tokens.space[3]}`,
+  fontSize   : tokens.font.size.xs,
+  fontFamily : tokens.font.family.mono,
+  fontWeight : tokens.font.weight.semibd,
+  letterSpacing: '0.08em',
+  textTransform: 'uppercase',
+  borderRadius: tokens.radius.full,
+  border     : `1px solid`,
+  transition : `all ${tokens.animation.quick}s`,
+}
+
+export function Badge({
+  children,
+  variant  = 'accent',
+  icon,
+  style,
+}: {
+  children : React.ReactNode
+  variant  ?: 'accent' | 'secondary' | 'neutral' | 'success'
+  icon     ?: React.ReactNode
+  style    ?: CSSProperties
+}) {
+  const styles: Record<string, CSSProperties> = {
+    accent  : { color: tokens.color.accent, borderColor: tokens.color.accent + '60', background: tokens.color.accentMuted },
+    secondary: { color: tokens.color.secondary, borderColor: tokens.color.secondary + '60', background: tokens.color.secondaryMuted },
+    neutral : { color: tokens.color.gray400,   borderColor: tokens.color.gray700, background: 'transparent' },
+    success : { color: tokens.color.success,   borderColor: tokens.color.success + '60', background: 'rgba(34,197,94,.1)' },
+  }
+  return (
+    <span style={{...base, ...styles[variant], ...style }}>
+      {icon && <span style={{ marginRight: 4 }}>{icon}</span>}
+      {children}
+    </span>
+  )
+}