feynolt
diff --git a/‎.cursorrules‎
Lines changed: 55 additions & 0 deletions b/‎.cursorrules‎
Lines changed: 55 additions & 0 deletions
diff --git a/‎assets/css/style.css‎
Lines changed: 19 additions & 14 deletions b/‎assets/css/style.css‎
Lines changed: 19 additions & 14 deletions
diff --git a/‎assets/images/X_icon.svg‎
Lines changed: 1 addition & 0 deletions b/‎assets/images/X_icon.svg‎
Lines changed: 1 addition & 0 deletions
diff --git a/‎assets/images/about-banner.png‎
612 KB b/‎assets/images/about-banner.png‎
612 KB
diff --git a/‎assets/images/about-banner.png~‎
90.3 KB b/‎assets/images/about-banner.png~‎
90.3 KB
diff --git a/‎assets/images/hero-banner-md.png‎
-5.7 KB b/‎assets/images/hero-banner-md.png‎
-5.7 KB
diff --git a/‎assets/images/hero-banner-md.png~‎
431 KB b/‎assets/images/hero-banner-md.png~‎
431 KB
diff --git a/‎assets/images/hero-banner-sm.png‎
-2.25 KB b/‎assets/images/hero-banner-sm.png‎
-2.25 KB
diff --git a/‎assets/images/hero-banner-sm.png~‎
188 KB b/‎assets/images/hero-banner-sm.png~‎
188 KB
diff --git a/‎assets/images/hero-banner.png‎
-46.6 KB b/‎assets/images/hero-banner.png‎
-46.6 KB
@@ -0,0 +1,55 @@
+# Web Portfolio Goal & Objectives
+
+## 1️⃣ Purpose
+This portfolio serves as a **professional showcase** for AI-assisted creative work, highlighting expertise in:
+- **AI-generated images** (Stable Diffusion for commercial, artistic, and trending visuals)
+- **AI-enhanced video production**
+- **Basic Unity programming & VR development**
+
+The goal is to **attract potential clients, collaborators, and employers** by demonstrating **versatility in AI-powered content creation**.
+
+---
+
+## 2️⃣ Key Features & Objectives
+
+### ✅ Promoting Your Services
+- Clearly communicate **what you offer** (AI imagery, video, Unity/VR projects).
+- Provide **case studies, examples, and project breakdowns**.
+- Include **contact options** for business inquiries and collaborations.
+
+### ✅ Showcasing Your Work Effectively
+- **Dedicated portfolio section** to display projects.
+- **Interactive previews & descriptions** for each work.
+- **Sleek and professional UI/UX** for easy navigation.
+
+### ✅ Encouraging Collaboration & Opportunities
+- Include **a contact form and social media links** for engagement.
+- Optimize for **SEO** to improve discoverability.
+- Maintain a **modern, responsive design** that works on all devices.
+
+### ✅ Delivering a High-Quality User Experience
+- **Smooth, dynamic animations** for an engaging UI.
+- **Dark & light mode toggle** for better accessibility.
+- **Fast loading and optimized assets** for seamless browsing.
+
+---
+
+## 3️⃣ Technical Execution
+
+### 💻 Core Technologies
+- **HTML, CSS, JavaScript** (Minimal frameworks for performance)
+- **Google Fonts, CSS animations** for enhanced aesthetics
+- **Responsive design** for mobile and desktop
+- **GitHub Pages hosting** for easy version control & updates
+
+### 🎯 Development Considerations
+- **Modular file structure** to keep code clean.
+- **Efficient asset handling** to optimize page speed.
+- **Interactive UI elements** (theme switcher, dynamic skill filtering).
+- **Scalable layout** for future updates and expansion.
+
+---
+
+# 🔥 Final Objective
+Create a **high-quality, AI-driven portfolio** that **markets skills, attracts clients/collaborators, and solidifies presence as an AI-enhanced creative professional**.
+
@@ -144,7 +144,9 @@ select { cursor: pointer; }
 input,
 textarea { width: 100%; }
 
-ion-icon { pointer-events: none; }
+ion-icon {
+  font-size: 24px; /* Adjust size as needed */
+}
 
 :is(a, button, select) {
   outline-color: var(--scarlet);
@@ -494,17 +496,20 @@ main { overflow-x: hidden; }
 
 
 /*-----------------------------------*\
- * #STATS
+ * #SOCIAL
 \*-----------------------------------*/
 
-.stats { padding-block: var(--section-padding); }
+.social {
+  padding-block: var(--section-padding);
+}
 
-.stats-list {
+.social-list {
   display: grid;
   gap: 30px;
+  grid-template-columns: repeat(auto-fit, minmax(500px, 1fr)); /* Responsive grid */
 }
 
-.stats-card {
+.social-card {
   background: var(--bg-secondary);
   display: flex;
   align-items: center;
@@ -515,37 +520,37 @@ main { overflow-x: hidden; }
   transition: var(--transition-1);
 }
 
-.stats-card:is(:hover, :focus) { transform: translateY(-5px); }
+.social-card:is(:hover, :focus) {
+  transform: translateY(-5px);
+}
 
-.stats-card .card-icon {
-  background: var(--raw-seinna);
+.social-card .card-icon {
   width: 60px;
   height: 60px;
   display: grid;
   place-items: center;
   border-radius: 50%;
 }
 
-.stats-card .card-icon img {
-  width: 70%;
-  filter: invert(1);
+.social-card .card-icon ion-icon {
+  font-size: 60px; /* Adjust size as needed */
 }
 
-.stats-card .card-title {
+.social-card .card-title {
   width: calc(100% - 95px);
   color: var(--raw-seinna);
   text-align: center;
 }
 
-.stats-card .card-title strong {
+.social-card .card-title strong {
   display: block;
   color: var(--color-primary);
   font-size: initial;
   line-height: 1.3;
   margin-top: 5px;
 }
 
-.stats-card > ion-icon { color: var(--color-secondary); }
+.social-card > ion-icon { color: var(--color-secondary); }