// Stock & Investment solution page
function StockInvestmentPage() {
  return (
    <Site>
      <PageHero
        breadcrumb={[{ label: "Solutions" }, { label: "Stock & Investment" }]}
        eyebrow="Solution · Stock & Investment"
        title={<>Equities, ETFs and <span className="gradient-text">long-term wealth</span> — operationally.</>}
        sub="For stock platforms and investment firms: investor onboarding, suitability, subscriptions, periodic statements, plus the same trading-grade ops stack."
        ctaPrimary={{ label: "Book a demo" }}
        visual={<PortfolioVisual/>}
      />
      <FeatureGrid
        eyebrow="What's included"
        title="Built for the long-hold investor as much as the active trader."
        features={[
          { t: "Investor onboarding", d: "Suitability, appropriateness, source-of-funds and tax forms (W-8/W-9, CRS)." },
          { t: "Recurring deposits", d: "DCA-style scheduled deposits and subscriptions." },
          { t: "Periodic statements", d: "Monthly, quarterly, annual statements with tax-shape exports." },
          { t: "Equity & ETF symbols", d: "Symbol management for cash equities, ETFs and fractional shares." },
          { t: "Dividend handling", d: "Dividend declarations, withholding tax, statements." },
          { t: "Portfolios & goals", d: "Trader portal supports goal-based investing, target portfolios, risk profiles." },
          { t: "Compliance for wealth", d: "MiFID II suitability, US Reg BI, ASIC, FCA." },
          { t: "Advisor seat", d: "Optional advisor user role with portfolio recommendations." },
          { t: "BI for wealth", d: "AUM, net inflows, churn, advisor performance." },
        ]}
      />
      <CTASection title="Investment platforms on operator-grade rails." primary={{ label: "Book a demo" }}/>
    </Site>
  );
}
ReactDOM.createRoot(document.getElementById("root")).render(<StockInvestmentPage/>);