Aetheria AI — Modern Landing Page Project

A high-converting, visually stunning landing page for an AI automation SaaS platform built with HTML5, CSS3, and JavaScript.

---

🌟 Key Features

• Modern Glassmorphism Aesthetic: Vibrant glow effects, curated dark color palette, and micro-animations.
• Multi-Column Grid Architecture: Flexbox and CSS Grid layout for feature cards, pricing tiers, and reviews.
• Responsive Layout: Zero element overlaps across mobile, tablet, and desktop screens.
• Interactive JavaScript Components: Sticky navbar on scroll, mobile menu drawer, tabbed code showcase, and animated stat counters.
• Vercel Ready: Pre-configured vercel.json for 1-click deployment.

---

🚀 How to Deploy on Vercel

You can deploy this project to Vercel using either of the following two methods:

Method 1: Using Vercel CLI (Fastest Direct Deployment)

1. Open your terminal in this project folder (project2).
2. Run the Vercel CLI command:

   npx vercel

3. Follow the quick on-screen prompts:
   • Set up and deploy?: Type y
   • Which scope?: Select your Vercel account
   • Link to existing project?: Type n
   • Project Name: Press Enter (or type your custom name, e.g., my-landing-page)
   • In which directory is your code located?: Press Enter (./)
4. Vercel will build and output your live website link! (e.g. https://my-landing-page.vercel.app)

To deploy updates directly to production later:

npx vercel --prod

---

Method 2: Deploying via GitHub + Vercel Dashboard

1. Initialize Git & Push to GitHub:

   git init
   git add .
   git commit -m "Initial commit of Landing Page"
   git remote add origin https://github.com/YOUR_USERNAME/YOUR_REPOSITORY.name.git
   git branch -M main
   git push -u origin main

2. Import to Vercel:

   • Go to Vercel Dashboard and click "Add New..." > "Project".
   • Import your GitHub repository.
   • Click Deploy. Vercel will automatically detect the static HTML/CSS/JS files and build your live site!

---

📁 Project Structure

project2/
├── assets/
│   ├── hero_mockup.jpg       # Generated high-res hero image
│   └── ai_workflow.jpg       # Feature showcase image
├── index.html                # Semantic HTML5 layout
├── style.css                 # CSS Variables, Animations, Glassmorphic Design
├── script.js                 # Interactive JS components
├── vercel.json               # Vercel static site config
└── README.md                 # Deployment & setup documentation