Build a two-page React application demonstrating "Spendid" - a white-label HSA/FSA commerce layer that benefits platforms (like Gusto or Rippling) can embed into their product. The app needs a marketing landing page and an interactive "Employee Portal" demo.

Design System & Vibe:

• Aesthetic: Clean, modern health-tech/medical. Trustworthy but sleek.
• Color Palette:
  • Backgrounds: slate-50 (off-white/light gray) for the main body, pure white for cards.
  • Primary Accent: rose-500 (light red/medical red) for buttons, icons, and highlighted text.
  • Text: slate-900 for headings, slate-600 for body text.
• Typography: Sans-serif (Inter or similar). Use tight tracking (tracking-tighter) on massive hero headers.
• Components: Use rounded corners (rounded-3xl for cards, rounded-full for buttons). Use subtle drop shadows (shadow-sm) rather than harsh borders.

Page 1: Marketing Landing Page (/)

Navigation Bar:

• Sticky top, white background with slight transparency and blur (backdrop-blur-md).
• Left: Logo (A rounded square with a rose-500 background and a white ShieldPlus icon) + "Spendid" text.
• Center: Links for "Product", "Solutions", "Pricing" (hidden on mobile).
• Right: "View Employee Demo" button (solid rose-500, pill-shaped).

Hero Section:

• Centered layout with generous top/bottom padding.
• Eyebrow Badge: A pill-shaped badge with a very light rose background (rose-50), rose text, and a tiny pulsing rose dot. Text: "THE WHITE-LABEL HSA/FSA COMMERCE LAYER".
• Headline: Massive, bold text (6xl to 8xl). "Embedded benefits [line break] commerce." Make the word "commerce." colored in rose-500.
• Subheadline: "Embed a pre-vetted marketplace of 5,000+ eligible products directly into your platform." (slate-600, text-xl).
• CTAs: Two pill-shaped buttons side-by-side.
  1. Primary: "Experience the Demo" (solid rose-500 with a subtle rose shadow) + right arrow icon.
  2. Secondary: "Read the Docs" (white background, slate border).

Feature Grid (3 columns):