diff --git a/README.md b/README.md
index 5affe33..d1f9efc 100644
--- a/README.md
+++ b/README.md
@@ -1,20 +1,167 @@
-
-

-
+
+
+
+
+
m5rcel.
+
+ Apple Ahh Portfolio
+
+ Inspired by the golden era of Apple design (2009).
+
+
-# Run and deploy your AI Studio app
+
+ Features •
+ Tech Stack •
+ Getting Started •
+ License
+
-This contains everything you need to run your app locally.
+
+
+
+
+
+
-View your app in AI Studio: https://ai.studio/apps/drive/1TiMFoAG3MlNJvKqVz68y71I_K1ca--la
+
-## Run Locally
+
+
+
+
+ A pixel-perfect recreation of the Snow Leopard & iPhone 3GS aesthetic.
+
-**Prerequisites:** Node.js
+
+## About The Project
-1. Install dependencies:
- `npm install`
-2. Set the `GEMINI_API_KEY` in [.env.local](.env.local) to your Gemini API key
-3. Run the app:
- `npm run dev`
+> "It’s not just about writing code. It’s about creating an experience."
+
+**Apple Ahh Portfolio** is a high-performance personal website that bridges the gap between nostalgia and modern engineering. It meticulously recreates the web design trends of **2009**—glossy "Aqua" buttons, wet-floor reflections, and Lucida Grande typography—while leveraging a bleeding-edge React stack.
+
+It features a custom **Mac OS X Boot Sequence** loading screen, fully responsive "Bento" grid layouts adapted for the 2009 style, and a robust component architecture.
+
+### Key Visual Features
+* ✨ **Aqua Aesthetics**: Glossy, gel-like buttons and navigation bars.
+* 🪞 **Webkit Reflections**: CSS-driven "wet floor" reflection effects on hero images.
+* 🍎 **Typography**: The authentic font stack of the era (`Myriad Pro`, `Lucida Grande`).
+* ⚙️ **Cinematic Loading**: A faithful recreation of the OS X Snow Leopard boot animation.
+
+---
+
+## ⚡ Tech Stack
+
+This project is built with performance and maintainability in mind, utilizing the latest standards in the React ecosystem.
+
+| Category | Technology | Description |
+| :--- | :--- | :--- |
+| **Core** | [React 18](https://react.dev/) | Component-based UI library. |
+| **Language** | [TypeScript](https://www.typescriptlang.org/) | Static typing for scalable development. |
+| **Build** | [Vite](https://vitejs.dev/) | Next-generation frontend tooling. |
+| **Styling** | [Tailwind CSS](https://tailwindcss.com/) | Utility-first CSS with custom "Retro" config. |
+| **Motion** | [Framer Motion](https://www.framer.com/motion/) | Production-ready animation library. |
+| **Icons** | [Lucide React](https://lucide.dev/) | Beautiful & consistent icon set. |
+
+---
+
+## 📂 Project Structure
+
+```text
+apple-ahh-portfolio/
+├── src/
+│ ├── components/ # UI Building Blocks
+│ │ ├── Hero.tsx # Product showcase section
+│ │ ├── Navbar.tsx # Glossy navigation bar
+│ │ ├── Projects.tsx # Grid layout for work
+│ │ └── ...
+│ ├── constants.ts # Data source (Projects, Timeline)
+│ ├── types.ts # TypeScript interfaces
+│ ├── App.tsx # Main application entry
+│ └── main.tsx # React DOM mounting
+├── public/ # Static assets
+├── index.html # Entry HTML & Tailwind Config
+├── vercel.json # Production security headers
+└── package.json # Dependencies & Scripts
+```
+
+---
+
+## 🚀 Getting Started
+
+Follow these steps to set up the project locally on your machine.
+
+### Prerequisites
+* **Node.js** (v16 or higher)
+* **npm** or **yarn**
+
+### Installation
+
+1. **Clone the repository**
+ ```bash
+ git clone https://github.com/m4rcel-lol/apple-ahh-portfolio.git
+ cd apple-ahh-portfolio
+ ```
+
+2. **Install dependencies**
+ ```bash
+ npm install
+ ```
+
+3. **Start the Development Server**
+ ```bash
+ npm run dev
+ ```
+ Open `http://localhost:5173` to view it in the browser.
+
+4. **Build for Production**
+ ```bash
+ npm run build
+ ```
+
+---
+
+## 🛠️ Customization Guide
+
+The content is decoupled from the UI logic, allowing you to update the portfolio without touching the components.
+
+### Adding Projects
+Navigate to `src/constants.ts` and add a new object to the `PROJECTS` array:
+
+```typescript
+{
+ id: 'new-project',
+ title: 'My Awesome App',
+ category: 'Web Development',
+ description: 'A brief description of what this project does.',
+ image: 'https://link-to-image.com/banner.jpg',
+ tags: ['React', 'Node.js'],
+ githubUrl: 'https://github.com/username/repo',
+}
+```
+
+### Changing Icons
+Specialized SVG icons (like Fedora or Python) are handled in `src/components/Projects.tsx`. Look for the conditional rendering block inside the map function to add your own SVGs.
+
+---
+
+## 🔒 Security & Performance
+
+This project includes a production-ready `vercel.json` configuration file that implements:
+
+* **Content Security Policy (CSP)** to prevent XSS.
+* **Immutable Caching** for static assets.
+* **X-Content-Type-Options** to prevent MIME sniffing.
+
+---
+
+## 📄 License
+
+Distributed under the MIT License. See `LICENSE` for more information.
+
+
+
+
+ Designed & Developed by m5rcel
+