Two-Tier Card with Header, Body, and Footer

This card component uses Tailwind CSS's divide utility classes to create a two-tier structure. The outer <div> has divide-y and divide-gray-200 to split it into two vertical sections. It also has overflow-hidden, rounded-lg, bg-white, and shadow for styling. The first inner <div> is the card header with px-4 py-5 sm:p-6 for padding. The second inner <div> is the footer with px-4 py-4 sm:px-6 for tighter padding.