// import React, { useState, useEffect, useRef } from 'react'; const { useState, useEffect, useRef } = React; // Animated background with data constellation effect (dimmed version) const DataConstellation = () => { const canvasRef = useRef(null); useEffect(() => { const canvas = canvasRef.current; const ctx = canvas.getContext('2d'); let animationFrameId; let particles = []; const resizeCanvas = () => { canvas.width = window.innerWidth; canvas.height = window.innerHeight; }; resizeCanvas(); window.addEventListener('resize', resizeCanvas); for (let i = 0; i < 60; i++) { particles.push({ x: Math.random() * canvas.width, y: Math.random() * canvas.height, vx: (Math.random() - 0.5) * 0.2, vy: (Math.random() - 0.5) * 0.2, size: Math.random() * 1.5 + 0.5, opacity: Math.random() * 0.3 + 0.05 }); } const animate = () => { ctx.fillStyle = 'rgba(10, 12, 16, 0.03)'; ctx.fillRect(0, 0, canvas.width, canvas.height); particles.forEach((p, i) => { p.x += p.vx; p.y += p.vy; if (p.x < 0 || p.x > canvas.width) p.vx *= -1; if (p.y < 0 || p.y > canvas.height) p.vy *= -1; ctx.beginPath(); ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2); ctx.fillStyle = `rgba(94, 234, 212, ${p.opacity * 0.7})`; ctx.fill(); particles.forEach((p2, j) => { if (i === j) return; const dx = p.x - p2.x; const dy = p.y - p2.y; const dist = Math.sqrt(dx * dx + dy * dy); if (dist < 120) { ctx.beginPath(); ctx.moveTo(p.x, p.y); ctx.lineTo(p2.x, p2.y); ctx.strokeStyle = `rgba(94, 234, 212, ${0.04 * (1 - dist / 120)})`; ctx.lineWidth = 0.5; ctx.stroke(); } }); }); animationFrameId = requestAnimationFrame(animate); }; animate(); return () => { cancelAnimationFrame(animationFrameId); window.removeEventListener('resize', resizeCanvas); }; }, []); return ( ); }; // Portfolio Overview Mock for Hero const PortfolioMock = () => { const [showAlert, setShowAlert] = useState(false); useEffect(() => { const timer = setTimeout(() => setShowAlert(true), 2000); return () => clearTimeout(timer); }, []); return (
{/* Main Portfolio Card */}
Portfolio Overview Simulated
{/* Portfolio Stats */}
Total Equity
$127,450
Cash
$18,230
Today's P&L
+$1,847
{/* Positions Table */}
{['Ticker', 'Weight', 'Cost', 'Price', 'P&L'].map((h, i) => ( {h} ))}
{[ { ticker: 'ARWR', weight: '24%', cost: '$42.15', price: '$47.82', pnl: '+13.5%', positive: true }, { ticker: 'PLTR', weight: '18%', cost: '$21.40', price: '$23.16', pnl: '+8.2%', positive: true }, { ticker: 'DDOG', weight: '15%', cost: '$118.50', price: '$124.60', pnl: '+5.1%', positive: true }, { ticker: 'NET', weight: '12%', cost: '$89.20', price: '$86.45', pnl: '-3.1%', positive: false } ].map((pos, i) => (
{pos.ticker} {pos.weight} {pos.cost} {pos.price} {pos.pnl}
))}
{/* Position Detail Card */}
Position Detail ARWR

Thesis: RNAi platform with near-term catalysts from Phase 3 readouts and expanded Novo partnership.

{['FDA Decision Q1', 'Novo Partnership', 'Pipeline Expansion'].map((cat, i) => ( {cat} ))}
Risk Note

Binary event risk on FDA decision. Position sized for 20% drawdown tolerance.

{/* Alert Bubble */}
Earnings update published – review thesis
); }; // Step component for "How it works" const StepCard = ({ number, title, description, icon }) => (
{/* Connector line */} {number < 4 && (
)}
{number}

{title}

{description}

); // Dashboard View Card const DashboardViewCard = ({ title, description, features, color }) => (

{title}

{description}

); // FAQ Accordion Item const FAQItem = ({ question, answer, isOpen, onClick }) => (

{answer}

); // Main Portfolio Program Page // export default function PortfolioProgramPage() { const PortfolioProgramPage = () => { const [scrollY, setScrollY] = useState(0); const [openFAQ, setOpenFAQ] = useState(null); useEffect(() => { const handleScroll = () => setScrollY(window.scrollY); window.addEventListener('scroll', handleScroll); return () => window.removeEventListener('scroll', handleScroll); }, []); const faqs = [ { question: 'Is this real money?', answer: 'No. The program uses simulated accounts funded with virtual capital and real market data. All trading activity is purely for practice and education.' }, { question: 'Does Vestiq execute trades?', answer: 'Vestiq does not execute live trades or route orders to any exchange or broker. The program focuses entirely on research, simulation, and documentation of investment decisions.' }, { question: 'Is this investment advice?', answer: 'Vestiq provides tools and information for educational and research purposes only. Participants decide how to use those tools and remain fully responsible for any separate real-world investment decisions they may make.' }, { question: 'Can universities run cohorts?', answer: 'Yes. University programs can set up cohorts with class rosters, instructor dashboards, and shared reporting. Faculty members receive access to portfolio performance, trade documentation, and process metrics for grading and evaluation.' } ]; return (
{/* Global styles */} {/* Animated background */} {/* Navigation */} {/* Hero Section */}
{/* Left: Copy */}

Portfolio Management Program

A structured environment for running simulated portfolios with clear theses, defined risk, and a full audit trail.

Participants receive virtual capital, research from Vestiq, and tools to document every decision. The program trains disciplined portfolio managers and creates a record of performance that can be reviewed, graded, or evaluated.

Program uses simulated accounts only. No live trading or brokerage activity occurs inside Vestiq.

{/* Right: Interface mock */}
{/* What the Program Offers Section */}

What the Portfolio Management Program offers

The Portfolio Management Program turns Vestiq into a training ground for portfolio managers. Each participant runs a simulated account funded with virtual capital, guided by real research, catalyst tracking, and risk tools. Every trade carries a written thesis, risk parameters, and a reason for exit, which creates an auditable history of decisions.

Simulated capital

Virtual portfolios tracked with real market data.

Research-driven process

Company and catalyst reports from Vestiq support every decision.

Documented history

Each trade includes thesis, risk, and exit notes for later review.

{/* How It Works Section */}

How the program works

All activity stays inside a simulated environment using market data. The program focuses on process, documentation, and pattern recognition.

{/* Inside the Dashboard Section */}

Inside the participant dashboard

The dashboard provides everything participants need to manage their simulated portfolios, track decisions, and respond to market events.

{/* Dashboard Mock Preview */}
{['Overview', 'Positions', 'Activity', 'Alerts'].map((tab, i) => ( {tab} ))}
Dashboard Preview
{/* Program Structure Section */}

Program structure and rules

The Portfolio Management Program runs on a clear rule set. Participants trade long-only equities in a simulated environment with position limits, concentration limits, and basic risk guidelines. The structure keeps the focus on security selection, thesis quality, and sizing discipline.

{[ { title: 'Instrument focus', desc: 'Listed equities, with emphasis on small and mid-cap names.' }, { title: 'Long-only', desc: 'No shorts, options, futures, or margin in the initial track.' }, { title: 'Position limits', desc: 'Caps on single-name and sector exposure to encourage diversification.' }, { title: 'Documentation requirement', desc: 'Every new position requires a written thesis and basic risk outline.' }, { title: 'Exit notes', desc: 'Each closed trade includes a reason for exit and a short reflection.' } ].map((rule, i) => (

{rule.title}

{rule.desc}

))}

Advanced tracks with additional instruments can sit on top of this foundation once the core environment reaches maturity and receives appropriate approvals.

{/* Who It Serves Section */}

Who the program serves

Individual investors

A place to test ideas, practice discipline, and build a track record of documented decisions before committing real capital elsewhere.

Universities and business schools

A teaching environment where students run portfolios, write theses, and respond to real market events. Instructors can view portfolios, trade logs, and documentation quality from an instructor dashboard.

Firms and funds

A training lane for analysts and junior portfolio managers. Teams can review research quality, sizing decisions, and reactions to catalysts inside a controlled, recorded environment.

{/* Review and Evaluation Section */}

Review, grading, and oversight

The program produces a complete record of each participant's decisions. Portfolios, trades, theses, and exit notes are all visible through review dashboards. Educators, program leads, or future compliance teams can evaluate performance using both returns and process quality.

Portfolio metrics
Return, volatility, and drawdown
Process metrics
Documentation depth and consistency
Pattern analysis
Insights for Strategic Memory
{/* FAQ Section */}

Frequently asked questions

{faqs.map((faq, i) => ( setOpenFAQ(openFAQ === i ? null : i)} /> ))}
{/* Final CTA Section */}

Join the Portfolio Management Program

Run a simulated portfolio on top of Vestiq's research engine and build a documented record of your investment decisions.

{/* Footer */}
Vestiq

Market-intelligence and portfolio management.

{['About', 'Legal', 'Privacy', 'Terms', 'Disclosures'].map((link, i) => ( {link} ))}

Vestiq is a research and simulation platform. It does not execute trades, act as a broker, or provide personalized investment advice.

); } const root = ReactDOM.createRoot(document.getElementById('root')); root.render();