Refactoring file locations

src/components/Projects.jsx

@@ -0,0 +1,60 @@
+import styles from '../styles/components/Projects.module.scss';
+
+const PROJECTS = [
+  {
+    name: 'Project Alpha',
+    desc: 'A short description of your featured project. What problem does it solve and what technologies make it interesting?',
+    tags: ['Tag 1', 'Tag 2', 'Tag 3'],
+    href: '#',
+    star: true,
+  },
+  {
+    name: 'Project Beta',
+    desc: 'A short description of your second project. Highlight the key challenge or the most exciting part of building it.',
+    tags: ['Tag 1', 'Tag 2', 'Tag 3'],
+    href: '#',
+    star: false,
+  },
+  {
+    name: 'Project Gamma',
+    desc: 'A short description of your third project. What did you learn, or what are you most proud of about it?',
+    tags: ['Tag 1', 'Tag 2'],
+    href: '#',
+    star: false,
+  },
+];
+
+export default function Projects() {
+  return (
+    <section id="projects" className={styles.projects}>
+      <div className={styles.inner}>
+        <div className={styles.header}>
+          <span className={styles.sectionNum}>02.</span>
+          <h2 className={styles.sectionTitle}>Projects</h2>
+          <div className={styles.line} />
+        </div>
+
+        <div className={styles.grid}>
+          {PROJECTS.map((p) => (
+            <article key={p.name} className={`${styles.card} ${p.star ? styles.featured : ''}`}>
+              {p.star && <span className={styles.featuredBadge}>Featured</span>}
+              <div className={styles.cardTop}>
+                <span className={styles.folderIcon}>⬡</span>
+                <a href={p.href} className={styles.externalLink} aria-label={`Open ${p.name}`}>
+                  ↗
+                </a>
+              </div>
+              <h3 className={styles.cardName}>{p.name}</h3>
+              <p className={styles.cardDesc}>{p.desc}</p>
+              <ul className={styles.tags}>
+                {p.tags.map((t) => (
+                  <li key={t}>{t}</li>
+                ))}
+              </ul>
+            </article>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}