function Header({ page, setPage }) {
  const items = [ ['home','首頁'], ['live','直播營運'], ['event','活動策劃'], ['cases','成功案例'], ['contact','聯絡我們'] ];
  return React.createElement('header', { style: { position: 'sticky', top: 0, zIndex: 20, background: 'var(--bg-page)', borderBottom: '1px solid var(--ink-900)', display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '0 40px', height: 72, fontFamily: 'var(--font-sans-body)' } },
    React.createElement('img', { src: 'assets/photography/logo.png', alt: '詩映視界 VerseView', style: { height: 34, cursor: 'pointer' }, onClick: () => setPage('home') }),
    React.createElement('nav', { style: { display: 'flex', gap: 30 } },
      items.map(([k, l]) => React.createElement('a', { key: k, onClick: () => setPage(k),
        style: { cursor: 'pointer', fontSize: 13, fontWeight: 500, color: 'var(--text-heading)', textDecoration: page === k ? 'underline' : 'none', textDecorationThickness: 2, textUnderlineOffset: 5, display: 'flex', alignItems: 'center', gap: 4 } },
        page === k ? React.createElement('span', { style: { color: 'var(--coral)' } }, '●') : null, l))
    ),
    React.createElement('div', { style: { display: 'flex', gap: 8 } },
      React.createElement('button', { onClick: () => setPage('live'), style: { fontFamily: 'var(--font-sans-body)', fontSize: 12, fontWeight: 700, padding: '9px 14px', border: 'none', borderRadius: 6, background: 'var(--sky)', color: 'var(--ink-900)', cursor: 'pointer', whiteSpace: 'nowrap' } }, '直播服務咨詢'),
      React.createElement('button', { onClick: () => setPage('event'), style: { fontFamily: 'var(--font-sans-body)', fontSize: 12, fontWeight: 700, padding: '9px 14px', border: 'none', borderRadius: 6, background: 'var(--pink)', color: 'var(--ink-900)', cursor: 'pointer', whiteSpace: 'nowrap' } }, '活動策劃報價')
    )
  );
}
window.Header = Header;
