// Leistungen.jsx — slim, three-services version

const LEISTUNGEN_DATA = [
{
  num: '01',
  eyebrow: 'Strategie',
  title: 'Strategie',
  lead: 'Klare Zielbilder, belastbare Entscheidungsgrundlagen und priorisierte Handlungsfelder schaffen Orientierung für Management und Organisation. Im Fokus stehen strategische Optionen, nachvollziehbare Prioritäten und eine Storyline, die Entscheidungen vorbereitet und Umsetzung ermöglicht.',
  items: [
  'Zielbild & strategische Stoßrichtung',
  'Priorisierung von Handlungsfeldern',
  'Entscheidungsgrundlagen für das Management',
  'Handlungsoptionen & Szenarien',
  'Managementgerechte Storylines']

},
{
  num: '02',
  eyebrow: 'Transformation',
  title: 'Transformation',
  lead: 'Transformationen brauchen klare Strukturen, abgestimmte Verantwortlichkeiten und eine pragmatische Steuerung. Wertschöpfung, Governance, Rollen und Abhängigkeiten werden so geordnet, dass Veränderung nicht nur geplant, sondern wirksam umgesetzt werden kann.',
  items: [
  'Transformationsstruktur & Governance',
  'Rollen, Aufgaben & Verantwortlichkeiten',
  'Schnittstellen & Abhängigkeiten',
  'Umsetzungsplanung & Steuerungslogik',
  'Begleitung von Veränderungsvorhaben']

},
{
  num: '03',
  eyebrow: 'Performance',
  title: 'Performance',
  lead: 'Wirksame Steuerung entsteht durch Transparenz über Kennzahlen, Fortschritt und tatsächliche Wirkung. Management Reporting, Review-Logiken und fokussierte KPIs schaffen die Grundlage für bessere Entscheidungen und kontinuierliche Verbesserung.',
  items: [
  'KPI-Systeme & Performance-Transparenz',
  'Management Reporting',
  'Review- & Eskalationslogik',
  'Fortschritts- & Wirkungsmessung',
  'Kontinuierliche Verbesserung']

}];


function LeistungenView({ onNav }) {
  return (
    <main className="view-enter">
      <section className="page-head">
        <div className="container">
          <p className="eyebrow">Leistungen</p>
          <h1 className="h-editorial">
            Drei Bereiche. <em>Ein Standard.</em>
          </h1>
          <p className="lead">Sparring & Begleitung über alle Leistungsfelder hinweg.
Ich unterstütze Entscheider und Teams als strukturierter Sparringspartner -von der strategischen Klärung über Transformations-Setups bis zur wirksamen Performance-Steuerung.

          </p>
        </div>
      </section>

      <section className="section">
        <div className="container">
          <div className="leistungen-grid">
            {LEISTUNGEN_DATA.map((s) =>
            <article key={s.num} className="leistung-block">
                <p className="eyebrow">{s.num} — {s.eyebrow}</p>
                <h2 className="h-sub" style={{ marginTop: 16 }}>{s.title}</h2>
                <p className="body" style={{ marginTop: 16, maxWidth: '38ch' }}>{s.lead}</p>
                <ul className="pillar-list" style={{ marginTop: 20 }}>
                  {s.items.map((it) => <li key={it}>{it}</li>)}
                </ul>
              </article>
            )}
          </div>
        </div>
      </section>

      <ContactBand onNav={onNav} />
    </main>);

}

window.LeistungenView = LeistungenView;