// kh-stub.jsx — empty placeholder pages for Knowhub sub-routes
const KH_STUBS = {
  'kh-webinare':   { title:'Webináře',            sub:'Online setkání s odborníky, zdarma' },
  'kh-skoleni':    { title:'Školení pro firmy',   sub:'Workshopy na míru tvému týmu' },
  'kh-mom':        { title:'Master of Marketing', sub:'Náš vlajkový vzdělávací program' },
  'kh-podcast':    { title:'Podcast',             sub:'Rozhovory s lidmi, kteří dělají věci jinak' },
  'kh-blog':       { title:'Blog',                sub:'Texty, eseje, postřehy' },
  'kh-kniha':      { title:'Tomova kniha',        sub:'Dvanáct let zkušeností sepsaných do jedné knihy' },
  'kh-konzultace': { title:'Konzultace',          sub:'1:1 hodinová konzultace (ask.justmighty.cz)' },
};

function KhStubPage({ page, onNav }) {
  useReveal();
  const m = KH_STUBS[page] || { title:'Knowhub', sub:'' };
  return (
    <>
      <section className="page-hero" data-screen-label={"KH-STUB " + page}>
        <div className="shell" style={{padding:0}}>
          <span className="mono" data-reveal style={{color:'var(--coral)',fontSize:12,letterSpacing:'.18em'}}>● knowhub / {m.title.toLowerCase()}</span>
          <h1 data-reveal style={{"--reveal-delay":"120ms",marginTop:24}}>
            {m.title}<span style={{color:'var(--coral)'}}>.</span>
          </h1>
          <p data-reveal style={{"--reveal-delay":"240ms",maxWidth:'52ch',color:'#bdbdbd',marginTop:24,fontSize:18}}>
            {m.sub}
          </p>
        </div>
      </section>
      <section style={{padding:'80px 36px 160px',background:'#0E0E0E',color:'#fff'}}>
        <div className="shell" style={{padding:0,textAlign:'center'}}>
          <div style={{
            border:'1px dashed rgba(255,255,255,.18)',
            borderRadius:12,padding:'80px 40px',
            background:'rgba(255,255,255,.02)'
          }}>
            <span className="mono" style={{color:'var(--coral)',fontSize:11,letterSpacing:'.18em'}}>● work in progress</span>
            <h2 style={{
              fontFamily:'Hubot Sans',fontWeight:500,fontStretch:'75%',
              fontSize:42,textTransform:'uppercase',margin:'24px 0 16px',
              letterSpacing:'-.02em'
            }}>obsah&nbsp;<em style={{fontStyle:'italic',fontWeight:300,color:'var(--coral)'}}>doplníme</em>.</h2>
            <p style={{color:'#a8a8a8',maxWidth:'48ch',margin:'0 auto 32px',fontSize:16,lineHeight:1.5}}>
              Tato stránka je placeholder. Strukturu, obsah a tone of voice doladíme v další fázi.
            </p>
            <button className="btn btn--coral" onClick={()=>onNav('knowhub')}>
              Zpět na Knowhub
              <span className="arrow">↗</span>
            </button>
          </div>
        </div>
      </section>
      <Footer />
    </>
  );
}
window.KhStubPage = KhStubPage;
window.KH_STUB_IDS = Object.keys(KH_STUBS);
