Build a single, responsive, portfolio website (HTML, CSS, JS) that meets the following high-level design goals: luxurious, modern, device-compatible (mobile/tablet/desktop), and highly animated. Structure the output as explicit file contents and folder layout. General rules: - Output three files: index.html, styles.css, main.js (plus an /assets folder for images/icons). Provide exact code for each file. - Use semantic HTML and accessible markup (aria labels, focus states). - The site must be fully responsive with breakpoints: mobile (<=640px), tablet (641–1024px), desktop (>=1025px). - Keep external library usage minimal but include CDN links where helpful: GSAP (for animations), Lottie (for vector animations), and Font Awesome or Heroicons for icons. - Include comments in code to explain each major section and how to swap content/assets. - Performance: lazy-load hero images and Lottie, compress SVG icons inline where possible. Layout & interactions: 1) Floating top navigation - A horizontal nav that *floats above the page content* and stays visible (backdrop blur + subtle shadow). On scroll the nav remains fixed and slightly shrinks (animated). - Nav items: Home, Career, Collaborations, Contact. Menu should become a hamburger on mobile. 2) Hero / First page (dark theme) - Full-height dark hero section (background #0b0c0d or similar). Left or right side shows a **shapeless, aesthetic frame** that holds the user's portrait image. The frame should be amorphous — soft blob/gradient mask with subtle blur and neon edge — and adapt to image aspect ratio. - Next to the image, large bold intro letters (H1) — e.g., "THALENTE BEKWA" — and a smaller tagline line below. Provide CSS to make the H1 oversized, tracking-tight, and responsive. - Add an animated entrance: image/frame floats in with GSAP and the H1 types/fades in; small scroll hint arrow at bottom. - Hero should include an accessible "View CV" and "Contact" CTA buttons. 3) Career timeline (second page) - Full-width horizontal timeline that visually reads left-to-right but is slightly curved (a gentle sine/bent path). - Timeline nodes: major experiences (large circular nodes with big icons) and minor achievements (small icons). Provide sample 5 events in JSON in JS so the LLM output can be swapped. - On click/tap of a node, animate it to expand into a centered floating card styled like an Instagram post (square or 4:5 ratio) with: - top bar: company/person avatar and name + timestamp, - big image/video mockup area, - caption area (role, short summary), - icons / micro-animations (likes, comments), and a subtle swipe-up affordance to close. - The timeline background should have a slow left-to-right parallax animation to suggest movement (use CSS animation or small GSAP tween applied to vector background). - Provide keyboard accessibility (arrow keys to navigate nodes; ESC to close card). 4) Collaborations / Companies & Leaders (third page) - Split section: two columns (or stacked on mobile). - Left column: Companies I've Worked With — grid of logo cards with hover tilt/3D micro-shadow and small read-more link. - Right column: Leaders I've Worked With — portrait avatars in a mosaic, each clickable to reveal a modal with short quote/testimonial and linked case study card. - Add an optional filter (industry tag chips) to highlight subsets. - Make logos grayscale by default and reveal full color on hover (animated). 5) Contact (fourth page) - High-quality, Figma-like contact card: full name input, email, subject, message, file upload (optional), and preferred contact method chips. - Client-side validation, success/error messages, accessible labels. - Add animated send button with micro-interaction; show a success modal with confetti Lottie animation on submit (no backend required; simulate success). - Include social links and a small resume download button. Extra details: - Include a small CSS utility section at top of styles.css for variables (colors, fonts). Use Google Fonts: Poppins (or Inter) for headings + Inter for body. - Provide instructions in top comments how to swap the hero image and company logos. - Provide a short README in /assets describing where to place real assets. Please produce complete and runnable code for index.html, styles.css, and main.js, using placeholder images from /assets and comments describing where to replace with real images or Lottie JSON. Keep code tidy and annotated so a developer can paste files into a folder and open index.html to see the result.