); } // ─── Hero ───────────────────────────────────────────────────────────────────── export default function Hero({ name, lastName, title, description, skills, projects, experiences, education, languages, interests, location, }: HeroProps) { const feat1 = projects[2]; // FOON const feat2 = projects[0]; // Gazelle const topSkills = skills.slice(0, 10); const levelColor = (level: string) => { if (level === "Native") return "#c8a96e"; if (level === "C2") return "#3a7a5a"; return "#4a6050"; }; return (

{/* ── Headline ─────────────────────────────────────────────────── */}

Let's bend
spacetime

{/* ── Name + description strip ──────────────────────────────── */}

{title}

{name}{" "} {lastName}

{description}

{location}

{/* ── Divider ───────────────────────────────────────────────── */}

{/* ── 3 × 2 Bento grid ──────────────────────────────────────── */}

{/* 01 — FOON */}

{feat1.logo && ( )}

{feat1.name}

{feat1.description}

{feat1.tasks.flatMap((t) => t.technologies).filter((v, i, a) => a.indexOf(v) === i).slice(0, 4).map((tech) => ( {tech} ))}

{feat1.links && (

{feat1.links.slice(0, 2).map((l) => ( ↗ {l.name} ))}

)} {/* 02 — Gazelle */}

{feat2.logo && ( )}

{feat2.name}

{feat2.description}

{feat2.tasks.map((task) => (

{task.name} {task.status}

))}

{/* 03 — Experience */}

Experience

{experiences.map((exp, i) => (

{exp.position}

{exp.company} · {exp.endDate === "current" ? "Present" : exp.endDate.split("-")[2]}

))}

{/* 04 — Education */}

Education

{education.map((edu, i) => (

{edu.degree}

{edu.school.split(" ").slice(-2).join(" ")} · {edu.endDate}

))}

{/* 05 — Skills */}

{skills.length} Skills

{topSkills.map((skill, i) => ( {skill} ))} {skills.length > 10 && ( +{skills.length - 10} )}

{/* 06 — About */}

About

Languages

{languages.map((lang) => ( {lang.name} {lang.level} ))}

Interests

{interests.map((interest, i) => ( {interest}{i < interests.length - 1 && ·} ))}

{/* ── Scroll hint ───────────────────────────────────────────── */}

Scroll to explore

); }