Pricing Card Highlight

Build a single pricing card with a committed hover state. Resting: a paper card with a hairline border - plan name in muted, a big price with a small "once" suffix, 3 perks with green checks, and a "Get the kit" line with an arrow at the bottom. Soft small shadow. Hover (the whole card is one hover target): - the card rises 5px on a spring (stiffness ~320, damping ~24) - the border turns accent and the shadow warms up (a large soft shadow tinted with the accent at ~16% opacity, 0.3s) - the price and CTA text flip to the accent color - a "BEST VALUE" monospace badge springs into the top-right corner (scale from 0 with a few degrees of rotation, stiffness ~480) - the checks do a tiny staggered heartbeat (scale 1 to 1.4 and back, 70ms apart) - the CTA arrow slides 4px right on its own spring Everything reverses cleanly on leave. The card should feel like it's volunteering. Accessibility: the card is one link or button; the badge is decorative. Under prefers-reduced-motion keep only the border and color changes. Colors as tokens: paper, ink, muted, one accent, green for checks. One card, one price - this is the focused version of a pricing table. Build the component, not this demo of it. - Ambient motion that IS the component may loop: a drifting background, a marquee, a spinner while something is genuinely loading. - Do not add any timer, interval, loop or script that performs a person's action by itself. No auto-hover, no auto-click, no cycling through states, no pretend submitting, no replaying the interaction on a schedule. - Every state that answers a person waits for a real event from that person. - Placeholder copy and sample content are welcome. Simulated behaviour is not.