---
const navItems = [
  { href: '/about', label: 'Sobre mí' },
  { href: '/projects', label: 'Proyectos' },
  { href: '/blog', label: 'Blog' },
];

const currentPath = Astro.url.pathname;
---

<nav class="flex items-center gap-6">
  {navItems.map(item => (
    <a 
      href={item.href}
      class={`text-sm font-medium transition-colors hover:text-primary ${
        currentPath.startsWith(item.href) 
          ? 'text-primary' 
          : 'text-text-secondary'
      }`}
    >
      {item.label}
    </a>
  ))}
</nav>