// Multi-License Groups solution page
function MultiLicensePage() {
  return (
    <Site>
      <PageHero
        breadcrumb={[{ label: "Solutions" }, { label: "Multi-License Groups" }]}
        eyebrow="Solution · Multi-License Groups"
        title={<>One brand, <span className="gradient-text">many entities</span>, one operating stack.</>}
        sub="Run multiple licensed entities under one back-office. Per-entity KYC, payments, jurisdictional rules — group-level BI, ops and treasury."
        ctaPrimary={{ label: "Book a demo" }}
        visual={<MultiEntityVisual/>}
      />
      <FeatureGrid
        eyebrow="Capabilities"
        title="Group-level scale, entity-level control."
        features={[
          { t: "Per-entity branding", d: "Different domains, different brands, different theming per license." },
          { t: "Per-entity compliance", d: "Different KYC vendors, different rules, different disclosure copy." },
          { t: "Per-entity payments", d: "Different PSPs, different methods, different routing." },
          { t: "Group BI", d: "Roll-up dashboards across all entities and brands." },
          { t: "Cross-entity routing", d: "Auto-route leads to the right entity based on geo, capital, profile." },
          { t: "Treasury management", d: "Group-level cash management with per-entity ledgers." },
          { t: "Compliance walls", d: "Permissions and data isolation between entities where required." },
          { t: "Single back-office", d: "One ops, one CRM, one BI — many regulated entities." },
          { t: "Migration tooling", d: "Move clients between entities cleanly when jurisdictions change." },
        ]}
      />
      <CTASection title="One stack for the whole group." primary={{ label: "Book a demo" }}/>
    </Site>
  );
}
ReactDOM.createRoot(document.getElementById("root")).render(<MultiLicensePage/>);