You are designing a high-end, futuristic SaaS web application called: “CareerCraft AI – Smart Career Guidance & Career Network Platform” This platform must look and feel like a Silicon Valley startup, with UI and animations inspired by: • Modern SaaS dashboards • Motion-driven interfaces • AR/VR-style immersive design • Dark neon glassmorphism The visual theme and layout must follow this style: • Dark background (#0f172a) • Purple / Indigo gradients • Cyan accent highlights • Floating 3D illustrations • Glassmorphism cards • Neon glowing buttons • Large rounded UI elements • Split layout & grid cards similar to a modern SaaS landing page The design language must be: Elegant, premium, futuristic, smooth, and interactive. ---------------------------------------------------- CORE ANIMATION SYSTEM (VERY IMPORTANT) ---------------------------------------------------- 1. PAGE LOAD – SELF-DRAWING ANIMATION When any page loads: • Lines draw themselves • Cards are revealed with stroke-drawing effects • Icons sketch into existence • Buttons outline first, then fill with glow This should look like the UI is being “drawn by an invisible pen”. ---------------------------------------------------- 2. AR / VR MOTION GRAPHICS STYLE The interface should feel 3D and spatial: • Cards float slightly in depth • UI elements have subtle parallax when moving mouse • Background gradients slowly shift • Components slightly tilt in 3D on hover • Glass cards reflect light • Sections move in Z-axis (coming toward user) This should feel like: “An immersive AR dashboard inside a virtual space”. ---------------------------------------------------- 3. LOGO & BRAND ANIMATION The CareerCraft AI logo must: • Draw itself on page load • Glow • Slightly rotate or pulse • Float in 3D space • Feel alive like a premium brand identity ---------------------------------------------------- 4. ICON & UI INTERACTION ANIMATIONS All icons must: • Animate on hover • Bounce, glow, rotate, or morph • Trigger micro-interactions • Feel responsive and satisfying Buttons must: • Have ripple effect • Neon hover glow • Press-down motion • Soft elastic bounce ---------------------------------------------------- 5. SECTION TRANSITIONS When navigating between pages: • Smooth fade + slide • Depth-based transitions • Motion blur • Floating elements • No sudden cuts ---------------------------------------------------- CORE APP FEATURES ---------------------------------------------------- Build the following LinkedIn-style career system: 1) AUTH • Login & Sign Up UI • Glassmorphism cards • Animated input focus • Floating labels 2) HOME FEED • Career posts • Job posts • AI recommendations • Cards float in 3D • Like, comment, share animations 3) JOB SEARCH • Search bar • Filters • Job cards • Salary tags • Apply buttons • AI job match score 4) MY NETWORK • Follow & Connect • People suggestions • Connection requests • Animated profile cards 5) MESSAGING • Chat UI • Message bubbles • Typing animation • Smooth transitions 6) NOTIFICATIONS • Job alerts • Connection requests • AI suggestions • Animated badge counters 7) PROFILE (ME) • Photo • Skills • Experience • Resume • AI score • Career progress bar • Animated charts ---------------------------------------------------- SMART AI SIMULATION (NO BACKEND) ---------------------------------------------------- The frontend must simulate AI using: Skills + Interests + Goals → Career Career → Salary Career → Roadmap Career → Skill gaps Career → Job matches Show results with: • Animated progress bars • Charts • Timelines • Floating cards ---------------------------------------------------- FINAL EXPERIENCE ---------------------------------------------------- The entire platform must feel like: “An AI-powered futuristic career universe” The UI should feel: • Immersive • Premium • Animated • Interactive • Real-world ready A recruiter should believe this could be a real startup product even though it is frontend-only.