function Themen() {
  const themen = [
    {
      name: 'Mercedes, VW, BMW: Was wirklich los ist',
      body: 'Der Insider-Read auf die deutschen Konzerne, wenn Gewinne einbrechen und Werke wackeln. Was die Quartalszahlen nicht zeigen.',
    },
    {
      name: 'China und der neue Wettbewerb',
      body: 'Warum Hersteller wie BYD die Spielregeln ändern und was das für die deutschen Marken bedeutet.',
    },
    {
      name: 'Kippt die E-Mobilität?',
      body: 'Verbrenner-Aus 2035, stockender Hochlauf, der Realitätscheck zwischen Klimaziel und Markt.',
    },
    {
      name: 'Standort Deutschland',
      body: 'Was auf dem Spiel steht, wenn Werke schließen und fast 800.000 Jobs am Auto hängen.',
    },
    {
      name: 'Kultur statt Technik',
      body: 'Warum deutsche Konzerne nicht an der Technologie scheitern, sondern an sich selbst. Eine Insider-Sicht aus 10 Jahren Mercedes.',
    },
  ];
  return (
    <section className="section themen" id="themen">
      <div className="container-narrow">
        <div className="section-eyebrow"><span className="kicker-line"></span>Interview-Themen</div>
        <h2 className="section-title">Worüber Philipp spricht</h2>
        <p className="section-lede">Themen für Interviews, Panels und O-Töne. Zu jedem auch in der Tiefe.</p>
        <div className="themen-grid">
          {themen.map((t, i) => (
            <article key={i} className="themen-item">
              <h3 className="themen-name">{t.name}</h3>
              <p className="themen-body">{t.body}</p>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Themen = Themen;
