/* Cases — fictional case studies / references with logos placeholder */

const CASES = [
  {
    tag: "Nemovitost",
    title: "Bytový dům Brno-Královo Pole",
    metric: "48 mil Kč",
    metricLabel: "vybráno za 21 dní",
    desc: "Plně pronajatý činžovní dům, 16 jednotek. Tokenizace primárního trhu, výnos z nájmu distribuován kvartálně.",
    investors: "127 investorů",
    yield: "6,2 % p.a.",
    icon: "home",
  },
  {
    tag: "Solární FVE",
    title: "FVE pole — jižní Morava",
    metric: "112 mil Kč",
    metricLabel: "objem emise",
    desc: "Provozovaná elektrárna 4,8 MWp s 18letou smlouvou. Investoři dostávají měsíční podíl na výnosu z prodané MWh.",
    investors: "284 investorů",
    yield: "8,4 % p.a.",
    icon: "solar",
  },
  {
    tag: "Firma",
    title: "Tech firma — SaaS pro retail",
    metric: "30 mil Kč",
    metricLabel: "Series A — revenue share",
    desc: "Růstové financování bez ředění zakladatelů. Token nese podíl na ročním revenue, splatný do 5 let.",
    investors: "92 investorů",
    yield: "11,5 % p.a.*",
    icon: "building",
  },
];

const PartnerLogo = ({ label }) => (
  <div className="partner-logo" title={label}>
    <svg viewBox="0 0 120 32" width="100%" height="32">
      <rect x="2" y="6" width="20" height="20" rx="4" fill="none" stroke="currentColor" strokeWidth="1.5"/>
      <text x="30" y="22" fontFamily="var(--font-display)" fontWeight="700" fontSize="15" fill="currentColor" letterSpacing="0.04em">{label}</text>
    </svg>
  </div>
);

const Cases = () => (
  <section className="cases" id="reference">
    <div className="container">
      <div className="section-head">
        <span className="eyebrow">Reference</span>
        <h2 className="h1">Vybrané <span className="hl">případové studie</span></h2>
        <p className="lead section-head__lead">
          Tři ukázky toho, jak tokenizace probíhá v reálu. Konkrétní detaily emisí na vyžádání pod NDA.
        </p>
      </div>

      <div className="cases__grid">
        {CASES.map((c) => (
          <article key={c.title} className="case">
            <div className="case__head">
              <span className="case__tag">{c.tag}</span>
              <Coin icon={c.icon} size={56}/>
            </div>
            <h3 className="case__title">{c.title}</h3>
            <p className="case__desc">{c.desc}</p>
            <div className="case__metric">
              <strong>{c.metric}</strong>
              <span>{c.metricLabel}</span>
            </div>
            <div className="case__foot">
              <div><span className="muted">Investoři</span><strong>{c.investors}</strong></div>
              <div><span className="muted">Výnos</span><strong>{c.yield}</strong></div>
            </div>
          </article>
        ))}
      </div>

      <div className="cases__partners">
        <span className="eyebrow">Partneři & ekosystém</span>
        <div className="cases__logos">
          {["FidoCustody", "AmlGuard", "ChainProof", "NotaryDX", "EuroLedger", "RegSys"].map((p) => (
            <PartnerLogo key={p} label={p}/>
          ))}
        </div>
      </div>

      <p className="cases__legal muted">
        * Hodnoty jsou ilustrativní pro ukázku formátu emisí. Skutečné výnosy závisí na konkrétním projektu, tržních podmínkách a právní struktuře. Investování s sebou nese riziko.
      </p>
    </div>
  </section>
);

window.Cases = Cases;