// Media — 5 themes for media/partners.
function Media({ onNav }) {
  const topics = [
    "Соло-стартапы на AI: как делать продукты без команды",
    "YouTube как система: рост без вирусняков и инфоповодов",
    "Yoolip AI как кейс: 58 дней, 700 магазинов",
    "AI как операционная система бизнеса",
    "Антипод инфобиза: почему «учить» работает только когда сам делаешь",
  ];
  return (
    <section id="media" className="section media" data-screen-label="media">
      <div className="media__inner">
        <div className="media__head">
          <div className="section__num" style={{marginBottom:14}}>Для медиа и партнёров</div>
          <h2 className="media__title">
            Темы, по которым я<br/>комментирую публично.
          </h2>
        </div>
        <ul className="media__list" role="list">
          {topics.map((t, i) => (
            <li key={i} className="media__row"
                onClick={()=>onNav("contact", { topic: "Спикерство" })}
                tabIndex={0}
                onKeyDown={(e)=>{ if(e.key==="Enter") onNav("contact", { topic: "Спикерство" }); }}
                role="button">
              <span className="num">0{i+1}</span>
              <span className="text">{t}</span>
              <span className="arrow"><Icon name="arrow" size={20}/></span>
            </li>
          ))}
        </ul>
      </div>
    </section>
  );
}

window.Media = Media;
