[HOME] Add Use Case Examples Section

[Omcci]

• [x] Create a section showcasing different use cases of NotionSync.
• [x] Use cards or icons to represent different use cases.

[Omcci]

Example

<section className="use-cases py-12">
  <h2 className="text-3xl font-bold text-center mb-8">Use Cases</h2>
  <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
    <div className="use-case-card p-6 bg-white rounded shadow">
      <h3 className="text-xl font-semibold mb-4">Project Management</h3>
      <p>Keep your projects organized and on track with seamless Notion integration.</p>
    </div>
    <div className="use-case-card p-6 bg-white rounded shadow">
      <h3 className="text-xl font-semibold mb-4">Team Collaboration</h3>
      <p>Collaborate with your team in real-time and keep everyone on the same page.</p>
    </div>
    <div className="use-case-card p-6 bg-white rounded shadow">
      <h3 className="text-xl font-semibold mb-4">Personal Productivity</h3>
      <p>Boost your personal productivity with automated workflows and task management.</p>
    </div>
  </div>
</section>