Organic Blob Hero

Build a "Organic Blob Hero" React component.

CONCEPT: A slow, breathing hero for a botanical skincare brand. Soft SVG blobs morph between shapes and the CTA pulses like a heartbeat at rest.

LAYOUT & CONTENT:
- Headline 'Rooted in / slow rituals.' in DM Serif Display, moss color.
- Two blobs (sage and clay) behind the right half, one leaf outline icon.
- CTA 'Shop the ritual' moss pill, small text 'Plant-based · Refillable'.

INTERACTIONS & MOTION:
- Blob paths morph between 3 shapes on an 8s ease-in-out loop (animate the d attribute).
- Blobs also rotate slowly (40s per turn) in opposite directions.
- CTA scale [1, 1.03, 1] every 4s; hover lifts it.

DESIGN SYSTEM — Organic Earth:
- Sage #A3B18A, moss #3A5A40, clay #DDA15E, bone #F7F3EA.
- Soft blob shapes that morph slowly; rounded, calm, breathing motion.
- Type: DM Serif Display for headlines, DM Sans for body.

CRAFT RULES:
- Motion: Framer Motion with spring physics (type: "spring"). Animate transform and opacity only. Respect prefers-reduced-motion via useReducedMotion().
- Icons: lucide-react where icons are needed.
- Accessibility: real <button>/<a>/<label> elements, visible focus ring, keyboard operable, aria attributes where state changes.

OUTPUT: one self-contained React component file (Tailwind CSS v4 utility classes, framer-motion, lucide-react), no external images, default export, ready to paste into a Next.js App Router page with "use client". Load any Google Font it needs with next/font/google.