Premium Tabbed Interface - Copy this Html, Tailwind Component to your project

Generate HTML, CSS, and JavaScript code for a premium and modern tabbed interface that resembles a mobile app with Material Design style and uses Tailwind CSS for styling. The design should feature curved tabs with soft shadows and light colors to create a visually pleasing, elegant look. Here are the specifications: Tabs: Create three tabs labeled ‘Home,’ ‘Explore,’ and ‘Profile’ in a horizontal layout. Each tab should have a rounded and raised appearance, with active tab highlighting using a gradient background, subtle shadow, and a slightly larger size than inactive tabs. Inactive tabs should have light gray backgrounds. Content Area: Below the tabs, display a content section with a soft white background, rounded corners, and a subtle shadow effect. The active content area should show relevant content for each tab with smooth transitions when switching between tabs. Transition & Animation: Include smooth animations for tab switching, with a subtle slide or fade effect for content changes. Add hover effects on tabs with a light color change and slight scaling to enhance interactivity. Icons and Text: Each tab should include an icon next to the label for better recognition, using a minimalist style (such as icons from Google Material Icons or FontAwesome). Use Tailwind CSS for spacing, alignment, and responsive layout adjustments. Responsive Design: Ensure the design is fully responsive, maintaining a mobile first approach with excellent usability on both mobile and desktop screens. Color Theme: Use a soft, light color palette (e.g., pastel blues and grays), matching Material Design standards for a clean and friendly appearance. Provide the HTML, CSS (using Tailwind CSS classes), and JavaScript to enable smooth functionality and interactive transitions.