WebMatrix Solution is a modern, high-performance landing page designed for a digital services agency. This project focuses on a "Cyber-Fresh" aesthetic, combining deep obsidian tones with vibrant Emerald and Cyan accents to create a premium, high-tech user experience.
🚀 Launch Live Demo---
- Aesthetic UI/UX: A "Cyber-obsidian" dark mode theme with glassmorphism effects and neon glow accents.
- 3D Hero Section: Integrated with DotLottie for high-fidelity, vector-based animations that are lightweight and performant.
- Responsive Grid: A fluid service matrix built with CSS Grid that seamlessly adapts from 4K monitors to mobile devices.
- Interactive Motion: * Sticky glassmorphism navigation.
- Scroll-reveal animations using the Intersection Observer API.
- Dynamic hover states with lifting cards and glowing borders.
- Modern Typography: Utilizing Space Grotesk for high-impact headings and Inter for maximum readability.
- HTML5: Semantic structure for SEO and accessibility.
- CSS3: Custom design system using CSS Variables, Flexbox, and Grid.
- JavaScript (Vanilla): Light-weight interaction logic without the overhead of heavy frameworks.
- DotLottie: Next-gen animation format for the hero visual.
- Lucide Icons: Clean, consistent vector iconography.
.
├── index.html # Main entry point and layout
├── style.css # Design system and "Aesthetic Tech" styles
├── script.js # Interaction and animation logic
├── hero-animation.lottie # 3D Hero asset
└── README.md # Documentation (You are here!)