feat: make website fully responsive across mobile, tablet, and desktop

[HarshPopat23]

Summary

This PR introduces comprehensive responsiveness across all pages and components in Tour of JSON Schema, enabling seamless usage on mobile devices (360px–480px), tablets/iPads (768px–1024px), and desktops.

Key Changes

• Home Page (/):

  • Implemented fluid typography (clamp(...)) for hero headers and subtitles to eliminate text clipping and horizontal overflow.
  • Replaced hardcoded absolute pixel positioning on the "Continue Tour" button with a flexible responsive layout.
  • Redesigned the chapter listing grid with adaptive multi-column breakpoints.
  • Removed the mobile blocker and redirected /mobile to the main responsive application.

• Navigation Bar (NavBar):

  • Added adaptive breadcrumbs and responsive spacing so actions (Theme Toggle, Outline Drawer, GitHub link) remain visible on smaller viewports.

• Interactive Workspace (/content/...):

  • Introduced ResponsiveTourWorkspace:
    • Desktop (>= 1024px): Retains the side-by-side dual-pane view (Lesson on left, Code Editor & Output on right).
    • Mobile & Tablet (< 1024px): Features a dedicated tab switcher (Lesson | Code & Output) providing 100% height and width to the active view without cramped horizontal squeezing.
  • Added touch event handlers (onTouchStart, onTouchMove, onTouchEnd) with boundary clamping for vertical divider resizing.
  • Refactored KeyBindings and Output helper messages to use natural inline-flex wrapping, preventing overlapping badges on small containers.
  • Fixed test case code container widths and footer link wrapping to eliminate overflow scrolling issues.

Testing & Verification

• Next.js static production build (pnpm run build) succeeded across all 50 lesson routes with zero errors.
• Verified layout, navigation, editor, and validation across mobile, tablet, and desktop viewports.

Reff: #67

[Akshita-tech17]

Amazing work! @HarshPopat23 👏 This is a really thoughtful approach to making the Tour of JSON Schema responsive. The mobile/tablet workspace tabs and the attention to overflow, spacing, and touch interactions are especially nice. 🚀