Header - Copy this React, Tailwind Component to your project

Generate a React component using Tailwind CSS for a header with the following features: 1. Top Strip: Include a Navbar component for the top info strip. 2. Logo Section: Place a clickable logo on the left, linking to the homepage. 3. Search Bar: Include a button that toggles the visibility of a search input field with smooth animation when clicked. The input field should be hidden initially and expand when the button is clicked. 4. Main Navigation Bar: Include the following links: Home About Us Members & Council Membership Subscriptions (dropdown with links to Membership Rules and Membership Form) Membership Fees Contact Us 5. Dropdown Animation: Use framer motion for smooth dropdown animation (fade and slide). 6. Icons: Use lucide react icons, including ChevronDown for dropdowns and Search for the search button. 7. Responsive: Ensure the header is fully responsive, adjusting for smaller screens using Tailwind's responsive utilities. 8. General Styles: Use bg blue 900 for the main navbar background. Use text white for the navbar text. Use hover:text gray 300 for hover effects on links. Use flex, space x 6, items center for layout. Use transition for smooth hover and click animations. Use absolute, relative, and motion for dropdown positioning and animations.