Contract Registration Form - Copy this React, Tailwind Component to your project
"Design a modern and responsive contract registration form using Tailwind CSS. The form should include the following fields: **Insurance Policy Code** (numeric input), **Email Code** (numeric-only input simulating email-like IDs), **Major/Field of Study** (text input), **Insurance Company Selection** (dropdown with predefined company names), and **Individual Name** (dropdown for selecting names, starting with a placeholder like 'Select a name'). The form layout should feature a card-style design with rounded corners, a subtle shadow for depth, and a gradient background in soft pastel tones. Input fields should have a clean design, rounded borders, and focus effects that change the border color to blue or teal with a glowing animation. Dropdown menus should slide down smoothly when opened and include clear placeholders for better user guidance. Add animations to enhance the user experience, such as fade-in for the form on page load, hover effects on buttons with scaling and color transitions, and placeholders that slide or fade out when inputs are focused. Ensure the form is fully responsive, with adjustments for desktop, tablet, and mobile views to maintain usability. Provide validation for fields, with animated error messages displayed in red below invalid inputs. During submission, show a progress bar or spinner near the submit button. Include a title styled with bold text and a gradient underline, and optionally, a small logo or icon for branding. Prioritize accessibility, ease of use, and a polished, professional appearance."
