// js/sections.jsx — Nav, Hero, Band, About, Experience const { useState: useSt, useEffect: useEf, useRef: useRf } = React; const D = window.SHAMA; /* ───────────────────────── Nav ───────────────────────── */ function Nav() { const [solid, setSolid] = useSt(false); useEf(() => { const on = () => setSolid(window.scrollY > 40); on(); addEventListener("scroll", on, { passive: true }); return () => removeEventListener("scroll", on); }, []); const links = [["Work", "#work"], ["Experience", "#experience"], ["About", "#about"], ["Contact", "#contact"]]; return (
Shama Parveen
); } /* ───────────────────────── Hero ───────────────────────── */ function Hero() { const [copied, setCopied] = useSt(false); const copy = () => { navigator.clipboard?.writeText(D.email); setCopied(true); setTimeout(() => setCopied(false), 1600); }; return (
{D.hero.eyebrow}

{D.hero.line1}  {D.hero.lineEm}  {D.hero.line2}

{D.hero.sub}

View selected work Résumé
); } /* ───────────────────── Marquee band ───────────────────── */ function Band() { return (
); } /* ──────────────── About / statement / stats ──────────────── */ function About() { return (
What makes me “me”

Designing for people — pairing innovation with a creative, research-led process to ship solutions that actually work in the real world.

{D.stats.map((s, i) => (
{s.label}
))}
{D.about.beliefs.map((b, i) => ( {b} ))}
); } /* ──────────────── Experience + Education ──────────────── */ function Experience() { return (

Where I've worked

Experience & Education
{D.experience.map((e, i) => (
{e.org} {e.tag && {e.tag}}
{e.blurb} {e.role} {e.period}
))}
{D.education.map((e, i) => (
{e.org}
{e.deg}
{e.note}
))}
); } window.SHAMA_SECTIONS_A = { Nav, Hero, Band, About, Experience };