Profile Page - Copy this React, Tailwind Component to your project

Profile Page (Dark Blue Theme with Framer Motion Animations) Design and implement a profile page for an edtech platform using React, Tailwind CSS, and Framer Motion. The page should be in a dark mode with varying shades of blue as the primary accent color. Header: Display the user’s name, profile picture, and a greeting. Use Framer Motion to animate the profile picture fade in and zoom upon loading. Tailwind colors: bg gray 900 for the background and text blue 400 for text accents. Profile Information Section: Create sections for personal details, education, and skills. Each section should have a card like UI with a hover effect that slightly scales up using Framer Motion. Example colors: Background: bg gray 800 Text: text white Border accent: border blue 500. Education and Skills List: Use Tailwind CSS cards with smooth animation for loading each card from the bottom up using Framer Motion’s spring animation. Highlight each skill with a blue badge (bg blue 600). Footer: Dark footer with user’s social media links (icons should have a hover animation that rotates slightly using Framer Motion). Tailwind styles: bg gray 900, text blue 400. Responsive and Mobile Friendly: Ensure the page layout is fully responsive, with columns collapsing on smaller screens. Focus on touch friendly animations and easily tappable buttons.