כפתורי קליי מנופחים

Build a "Clay Inflate Buttons" React component.

CONCEPT: A set of chunky clay-like buttons and an icon toggle that look inflated, deflate on press and wobble back.

LAYOUT & CONTENT:
- Three buttons: lilac 'Get started', peach 'Learn more', mint icon-only heart toggle.
- Each: radius 999, outer soft drop shadow, inset white highlight top-left, inset darker shade bottom-right.

INTERACTIONS & MOTION:
- whileTap: scale 0.92 and shadows shrink (deflate).
- On release spring back with low damping (stiffness 400, damping 9) for a wobble.
- Heart toggle: icon scales 0 → 1.3 → 1 when turning on.

DESIGN SYSTEM — Claymorphism:
- Pastel lilac #CDB8FF, peach #FFC9A9, mint #B8F0D8 on #F3EEFF.
- Inflated rounded shapes: big radius, outer soft shadow plus inner highlight and inner shade (inset shadows).
- Type: Fredoka 600; everything feels squishy.

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.