// cases.jsx
function Cases() {
  const cases = [
    {
      v: 'v1',
      name: 'Jonas M.',
      role: 'Amazon FBA · 2,4M $ Jahresumsatz',
      location: 'München → Wyoming LLC',
      avatar: 'JM',
      chips: ['E-Commerce', 'Wyoming', 'ITIN'],
      q: '„Mit der GmbH hätte ich nächstes Jahr 98k an den Fiskus gezahlt. Durch die LLC + ITIN-Struktur sind es 36k — und ich habe zusätzlich Zugriff auf Amex Business und eine 50k Credit Line bekommen.“',
      results: [
        { n: '62k', l: 'Steuer gespart / Jahr' },
        { n: '50k', l: 'Credit Line (Amex)' },
        { n: '14T', l: 'bis Go-Live' }
      ],
      before: 'GmbH, 48% Gesamtsteuer, Stripe-Account eingefroren',
      after: 'Wyoming LLC + ITIN, Mercury + Amex, Stripe US live'
    },
    {
      v: 'v2',
      name: 'Sarah & Daniel T.',
      role: 'SaaS Founders · B2B Agentur',
      location: 'Wien → Delaware LLC',
      avatar: 'ST',
      chips: ['SaaS', 'Delaware', 'Banking'],
      q: '„Wir hatten 3 Bank-Ablehnungen in Europa. Bei llc-setup hatten wir nach dem Banking-Call Mercury, Relay und Wise in 11 Tagen offen. Die ITIN kam 9 Wochen später — dann ging auch Brex.“',
      results: [
        { n: '4×', l: 'Bank-Konten aktiv' },
        { n: '9T', l: 'bis EIN' },
        { n: '9W', l: 'ITIN-Zeit' }
      ],
      before: '3× Bank-Ablehnung, keine US-Payment-Rails',
      after: 'Delaware LLC, Mercury/Relay/Wise/Brex, Stripe Global'
    },
    {
      v: 'v3',
      name: 'Felix W.',
      role: 'Online-Coach · OPM · 7-stellig',
      location: 'Zürich → New Mexico LLC',
      avatar: 'FW',
      chips: ['Creator', 'New Mexico', 'Funding'],
      q: '„Ich wollte die Anonymität von New Mexico. Die ITIN hat mir 30k Kreditrahmen in 6 Monaten freigeschaltet — ohne die hätte ich nie Chase Ink Business bekommen. Community allein war die Gründung wert.“',
      results: [
        { n: '30k', l: 'Credit freigeschaltet' },
        { n: '8W', l: 'ITIN-Zeit' },
        { n: '1:1', l: 'Banking-Call' }
      ],
      before: 'Einzelunternehmen CH, keine US-Infrastruktur',
      after: 'New Mexico LLC anonym + ITIN, Chase Ink, Amex Gold Business'
    }
  ];

  return (
    <section className="cases" id="cases" data-screen-label="Case Studies">
      <div className="wrap">
        <SectionHead
          eyebrow="Case Studies"
          title={<>Echte Zahlen.<br/><em>Echte Gründer.</em></>}
          sub="1.400+ LLCs gegründet. Hier drei Geschichten mit konkreten Vorher/Nachher-Zahlen, die zeigen, was mit der richtigen Struktur möglich ist."
        />

        <div className="cases-grid">
          {cases.map((c, i) => (
            <article className="case" key={i}>
              <div className={`case-img ${c.v}`}></div>
              <div className="case-body">
                <div className="chips">
                  {c.chips.map(ch => <span key={ch} className="chip">{ch}</span>)}
                </div>
                <div className="q">{c.q}</div>

                <div className="case-ba">
                  <div className="ba-row before">
                    <span className="ba-lbl">Vorher</span>
                    <span className="ba-txt">{c.before}</span>
                  </div>
                  <div className="ba-row after">
                    <span className="ba-lbl">Nachher</span>
                    <span className="ba-txt">{c.after}</span>
                  </div>
                </div>

                <div className="result">
                  {c.results.map((r, j) => (
                    <div className="r" key={j}>
                      <span className="rn">{r.n}</span>
                      <span className="rl">{r.l}</span>
                    </div>
                  ))}
                </div>

                <div className="meta">
                  <div className="av">{c.avatar}</div>
                  <div>
                    <div className="name">{c.name}</div>
                    <div className="role">{c.role}</div>
                    <div className="role" style={{ color: 'var(--accent)', marginTop: 2 }}>{c.location}</div>
                  </div>
                </div>
              </div>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Cases = Cases;