/* Demo modal — auto-advancing animated slides, plays like a product video. */ const { useState, useEffect, useRef } = React; const NAVY = "#0d1f2d"; const BRAND_BLUE = "#1a6fb5"; const SLIDE_MS = 4000; const N_SLIDES = 6; const Wordmark = ({ size = 28 }) => (
NovuRoy
); /* ---- Slides ---- */ const Slide1 = ({ active }) => (

Your personal AI college counselor.

Built for ambitious students 14–17.

); const Slide2 = ({ active }) => (
What are my chances at Cornell given my current GPA?
With your 3.85 unweighted and an upward trend, Cornell CAS sits in your reach band. Your robotics work strengthens the engineering schools more — let's sharpen that angle.
{[0,1,2].map(i => )}
The Counselor

It actually knows you.

Answers come from your profile — not a generic playbook.

); const Slide3 = ({ active }) => { const milestones = [ { x: 80, label: "Sep 2025", sub: "Start essays" }, { x: 280, label: "Oct 2025", sub: "SAT retake" }, { x: 480, label: "Nov 2025", sub: "Early decision" }, { x: 680, label: "Jan 2026", sub: "Regular apps" }, { x: 860, label: "Apr 2026", sub: "Decisions" }, ]; return (
The Timeline

Your map, alive.

Milestones move and rebuild as your goals shift.

{milestones.map((m, i) => { const t = i / (milestones.length - 1); const y = 110 + (i % 2 === 0 ? -1 : 1) * Math.sin(t * Math.PI) * 40; return ( {m.label} {m.sub} ); })}
); }; const Slide4 = ({ active }) => (
{/* Envelope body */}
{/* Flap (animates open) */}
{/* Letter peeking */}
The Overnight Agent

One email. Every morning.

Your daily briefing — what to do today, what's coming, what you're missing.

); const PriceCard = ({ tier, price, lines, recommended, active, delay }) => (
{tier}
{price} /month
{lines.map((l, i) => (
{l}
))}
); const Slide5 = ({ active }) => (

Free to begin. Pro when you're serious.

); const Slide6 = ({ active }) => (

Start building your future today.

); const SLIDES = [Slide1, Slide2, Slide3, Slide4, Slide5, Slide6]; /* ---- Modal shell ---- */ const DemoModal = ({ open, onClose }) => { const [idx, setIdx] = useState(0); const [progress, setProgress] = useState(0); const startRef = useRef(0); const rafRef = useRef(0); useEffect(() => { if (!open) return; setIdx(0); setProgress(0); startRef.current = performance.now(); const total = SLIDE_MS * N_SLIDES; const tick = (now) => { const elapsed = now - startRef.current; const p = Math.min(elapsed / total, 1); setProgress(p); const newIdx = Math.min(Math.floor(elapsed / SLIDE_MS), N_SLIDES - 1); setIdx(newIdx); if (p < 1) rafRef.current = requestAnimationFrame(tick); }; rafRef.current = requestAnimationFrame(tick); const onKey = (e) => { if (e.key === "Escape") onClose(); }; window.addEventListener("keydown", onKey); // Lock body scroll const prevOverflow = document.body.style.overflow; document.body.style.overflow = "hidden"; return () => { cancelAnimationFrame(rafRef.current); window.removeEventListener("keydown", onKey); document.body.style.overflow = prevOverflow; }; }, [open, onClose]); if (!open) return null; return (
{/* Page-behind blur veil */}
{/* Top-left wordmark */}
{/* Close button */} {/* Slide stage */}
{SLIDES.map((Slide, i) => (
))}
{/* Slide ticks */}
{Array.from({ length: N_SLIDES }).map((_, i) => ( ))}
{/* Bottom progress bar */}
); }; window.DemoModal = DemoModal;