Projects.jsx

import { useTranslation } from 'react-i18next';
import projects from '../data/projects.js';
import ProjectCard from '../components/ProjectCard.jsx';

export default function Projects() {
  const { t } = useTranslation();

  return (
    <>
      <header className="page-head">
        <span className="eyebrow">{t('nav.projects')}</span>
        <h1>{t('projects.title')}</h1>
        <p>{t('projects.subtitle')}</p>
      </header>

      <section className="section">
        <div className="container">
          <div className="grid">
            {projects.map((p) => (
              <ProjectCard key={p.slug} project={p} />
            ))}
          </div>
        </div>
      </section>
    </>
  );
}