feat(home): reorder sections and remove skill proficiency percentages

src/components/About.tsx

@@ -6,9 +6,15 @@ interface AboutProps {
   settings: SiteSettings;
   experience: Experience[];
   education?: Education[];
+  sectionTag?: string;
 }
 
-export default function About({ settings, experience, education = [] }: AboutProps) {
+export default function About({
+  settings,
+  experience,
+  education = [],
+  sectionTag = '01 // Profile & Background'
+}: AboutProps) {
   const paragraphs = (settings.biography && settings.biography.length > 0)
     ? settings.biography
     : [];
@@ -29,7 +35,7 @@ export default function About({ settings, experience, education = [] }: AboutPro
             <div>
               <span className="section-tag">
                 <span className="w-1.5 h-1.5 rounded-full bg-primary-custom" />
-                04 // Profile &amp; Background
+                {sectionTag}
               </span>
               <h2 className="text-3xl sm:text-4xl font-bold font-heading text-foreground-custom mt-1 tracking-tight">
                 About &amp; Background

src/components/Certifications.tsx

@@ -6,11 +6,12 @@ import haptic from '../lib/haptics';
 interface Props {
   certifications?: Certification[];
   extraCerts?: Certification[];
+  sectionTag?: string;
 }
 
 type FilterMode = 'all' | 'certificates' | 'badges';
 
-export default function Certifications({ certifications, extraCerts = [] }: Props) {
+export default function Certifications({ certifications, extraCerts = [], sectionTag = '04 // Certifications' }: Props) {
   const baseCerts = (certifications && certifications.length > 0) ? certifications : mockCertifications;
   const allCerts = [...baseCerts, ...extraCerts];
 
@@ -324,7 +325,7 @@ export default function Certifications({ certifications, extraCerts = [] }: Prop
             <div>
               <span className="section-tag">
                 <span className="w-1.5 h-1.5 rounded-full bg-primary-custom" />
-                03 // Certifications
+                {sectionTag}
               </span>
               <h2 className="text-3xl sm:text-4xl font-bold font-heading text-foreground-custom mt-1 tracking-tight">
                 Verified Credentials &amp; Certifications

src/components/Projects.tsx

@@ -6,9 +6,15 @@ interface ProjectsProps {
   initialProjects: Project[];
   showArchiveLink?: boolean;
   limit?: number;
+  sectionTag?: string;
 }
 
-export default function Projects({ initialProjects, showArchiveLink = true, limit }: ProjectsProps) {
+export default function Projects({
+  initialProjects,
+  showArchiveLink = true,
+  limit,
+  sectionTag = '02 // Projects'
+}: ProjectsProps) {
   const [filter, setFilter] = useState<string>('All');
   const [selectedProject, setSelectedProject] = useState<Project | null>(null);
   const [activeImage, setActiveImage] = useState<string>('');
@@ -68,7 +74,7 @@ export default function Projects({ initialProjects, showArchiveLink = true, limi
             <div>
               <span className="section-tag">
                 <span className="w-1.5 h-1.5 rounded-full bg-primary-custom animate-pulse" />
-                01 // Projects
+                {sectionTag}
               </span>
               <h2 className="text-3xl sm:text-4xl font-bold font-heading text-foreground-custom mt-1 tracking-tight">
                 Featured Work

src/components/Skills.tsx

@@ -4,6 +4,7 @@ import ScrollReveal from './ScrollReveal';
 
 interface SkillsProps {
   skills: Skill[];
+  sectionTag?: string;
 }
 
 const getCategoryIcon = (category: string) => {
@@ -50,7 +51,7 @@ const getCategoryIcon = (category: string) => {
   );
 };
 
-export default function Skills({ skills }: SkillsProps) {
+export default function Skills({ skills, sectionTag = '03 // Tech Stack' }: SkillsProps) {
   if (!skills || skills.length === 0) {
     return null;
   }
@@ -91,7 +92,7 @@ export default function Skills({ skills }: SkillsProps) {
             <div>
               <span className="section-tag">
                 <span className="w-1.5 h-1.5 rounded-full bg-primary-custom" />
-                02 // Tech Stack
+                {sectionTag}
               </span>
               <h2 className="text-3xl sm:text-4xl font-bold font-heading text-foreground-custom mt-1 tracking-tight">
                 Technologies &amp; Tools
@@ -134,28 +135,12 @@ export default function Skills({ skills }: SkillsProps) {
                         {categorySkills.map((skill) => (
                           <div
                             key={skill.name}
-                            className="p-3 rounded-xl border border-border-custom/80 bg-foreground-custom/[0.02] hover:bg-foreground-custom/[0.05] transition-all flex flex-col justify-between"
+                            className="p-3 rounded-xl border border-border-custom/80 bg-foreground-custom/[0.02] hover:bg-foreground-custom/[0.05] hover:border-primary-custom/40 transition-all flex items-center justify-between group/item"
                           >
-                            <div className="flex items-center justify-between gap-2">
-                              <span className="text-xs font-semibold text-foreground-custom">
-                                {skill.name}
-                              </span>
-                              {typeof skill.proficiency === 'number' && skill.proficiency > 0 && (
-                                <span className="text-[10px] font-mono text-primary-custom font-medium">
-                                  {skill.proficiency}%
-                                </span>
-                              )}
-                            </div>
-
-                            {/* Minimal Proficiency Meter if defined */}
-                            {typeof skill.proficiency === 'number' && skill.proficiency > 0 && (
-                              <div className="w-full h-1 bg-border-custom/50 rounded-full overflow-hidden mt-2">
-                                <div
-                                  className="h-full bg-primary-custom rounded-full transition-all duration-500"
-                                  style={{ width: `${Math.min(100, Math.max(0, skill.proficiency))}%` }}
-                                />
-                              </div>
-                            )}
+                            <span className="text-xs font-semibold text-foreground-custom group-hover/item:text-primary-custom transition-colors">
+                              {skill.name}
+                            </span>
+                            <span className="w-1.5 h-1.5 rounded-full bg-primary-custom/40 group-hover/item:bg-primary-custom transition-colors shrink-0 ml-2" />
                           </div>
                         ))}
                       </div>

src/lib/data.ts

@@ -22,7 +22,7 @@ export interface Project {
 export interface Skill {
   name: string;
   category: 'Frontend' | 'Backend' | 'Mobile' | 'Database' | 'DevOps' | 'AI/ML' | 'Tools' | 'Cybersecurity' | string;
-  proficiency: number; // 0-100
+  proficiency?: number; // optional (deprecated)
   icon?: string;
 }
 
@@ -403,7 +403,6 @@ export async function getSkills(): Promise<Skill[]> {
     return skills.map((s: any) => ({
       name: s.name || 'Skill',
       category: s.category || 'Tools',
-      proficiency: typeof s.proficiency === 'number' ? s.proficiency : 85,
       icon: s.icon
     }));
   } catch (error) {

src/pages/about.astro

@@ -15,7 +15,7 @@ const socialLinks = await getSocialLinks();
 
 <Layout 
 	title={settings.seoTitle ? `About | ${settings.seoTitle}` : `About | ${settings.fullName}`} 
-	description="Learn more about Cris Charles Garcia's professional history, skills matrix, education, and developer biography."
+	description="Learn more about Cris Charles Garcia's professional history, technical expertise, education, and developer biography."
 	image={settings.heroImage || settings.logoImage || '/logo.png'}
 >
 	<Navbar fullName={settings.fullName} logoImage={settings.logoImage} client:load />

src/pages/api/chat.ts

@@ -284,7 +284,7 @@ export const POST: APIRoute = async ({ request }) => {
           const catSkills = skills.filter(s => (s.category || 'Core') === cat).map(s => s.name);
           return `• ${cat}: ${catSkills.join(', ')}`;
         }).join('\n') +
-        `\n\nYou can review the full interactive matrix in the Skills Matrix section.`;
+        `\n\nYou can review the full breakdown in the Technologies & Tools section.`;
 
     } else if (query.includes('experience') || query.includes('job') || query.includes('career') || query.includes('intern') || query.includes('role')) {
       reply = `Professional Experience:\n\n` +

src/pages/index.astro

@@ -57,14 +57,14 @@ const socialLinks = await getSocialLinks();
 			client:load 
 		/>
 		
+		<About settings={settings} experience={experience} education={education} client:visible />
+
 		<Projects initialProjects={featuredProjects} limit={5} client:visible />
 		
 		<Skills skills={skills} client:visible />
 		
 		<Certifications certifications={certifications} client:load />
 		
-		<About settings={settings} experience={experience} education={education} client:visible />
-		
 		<Testimonials testimonials={testimonials} client:visible />
 		
 		<ContactForm