// landing_v2.jsx — premium motion-rich landing sections const { useState: useS2, useEffect: useE2, useRef: useR2 } = React; function ScrollProgress() { useE2(() => { const bar = document.querySelector(".scroll-progress"); const onScroll = () => { const h = document.documentElement; const pct = (h.scrollTop / (h.scrollHeight - h.clientHeight)) * 100; if (bar) bar.style.width = `${pct}%`; }; window.addEventListener("scroll", onScroll, { passive: true }); onScroll(); return () => window.removeEventListener("scroll", onScroll); }, []); return
; } function RevealV2({ children, delay = 0, as: Tag = "div", className = "", ...rest }) { const ref = useR2(null); const [seen, setSeen] = useS2(false); useE2(() => { const el = ref.current; if (!el) return; const io = new IntersectionObserver(([e]) => { if (e.isIntersecting) { setSeen(true); io.unobserve(el); } }, { rootMargin: "0px 0px -60px 0px", threshold: 0.12 }); io.observe(el); return () => io.disconnect(); }, []); return {children}; } function SplitWords({ text, delayStart = 0, stagger = 60 }) { const words = text.split(" "); return ( {words.map((w, i) => ( ))} ); } function HeroPills() { return (
500+ élèves accompagnés
4.8/5 sur Google
Agréé service à la personne
); } function HeroFormCard({ openModal }) { const [v, setV] = useS2({ prenomParent: "", tel: "", niveau: "" }); const submit = (e) => { e.preventDefault(); openModal(v); }; return (

Prenez rendez-vous

● Dispo
setV({ ...v, prenomParent: e.target.value })} required /> setV({ ...v, tel: e.target.value })} required />

Rappel sous 2h

ou appelez-nous : {PHONE}
); } function HeroV2({ openModal }) { return (

Les meilleurs étudiants de grande école pour vos cours particuliers.

Un matching sur-mesure entre votre enfant et un étudiant de grande école. À Paris, à domicile, sans engagement.

Prof trouvé en 24h
Sans engagement
-50% de crédit d'impôt
); } function CtaHeroForm({ openModal, eyebrow, title, lead }) { return (
{eyebrow && {eyebrow}}

{lead &&

}

); } function MarqueeBand() { const items = [ { name: "HEC Paris", src: "assets/logos/hec.png" }, { name: "École Polytechnique", src: "assets/logos/polytechnique.png" }, { name: "CentraleSupélec", src: "assets/logos/centralesupelec.png" }, { name: "Sciences Po", src: "assets/logos/sciencespo.png" }, { name: "ENS-PSL", src: "assets/logos/ens.svg" }, { name: "ESSEC", src: "assets/logos/essec.png" }, { name: "ESCP", src: "assets/logos/escp.png" }, ]; const double = [...items, ...items]; return (
{double.map((it, i) => ( {it.name} ))}
); } function PillarsV2() { const pillars = [ { num: "01", title: "Des profs de grande école", body: "Nos étudiants sortent des meilleures grandes écoles françaises. Ils sont passés par les mêmes bancs il y a peu — du collège au supérieur — et savent exactement ce qui fonctionne.", stat: "100% d'étudiants de grande école", icon: (), }, { num: "02", title: "Un matching sur-mesure", body: "Pas d'assignation au hasard. Notre équipe choisit LE prof qui correspond au niveau, aux objectifs et à la personnalité de chacun — du collège à la prépa. Premier cours en 24h.", stat: "Premier cours en 24h", icon: (), }, { num: "03", title: "La méthodologie avant tout", body: "Apprendre ses leçons ne suffit pas : il faut apprendre à travailler. Nos profs transmettent les méthodes qui les ont menés là où ils sont — celles qui font la différence au brevet, au bac, en prépa, comme à la fac.", stat: "Du collège au supérieur", icon: (), }, ]; const onMove = (e) => { const r = e.currentTarget.getBoundingClientRect(); e.currentTarget.style.setProperty("--mx", `${e.clientX - r.left}px`); e.currentTarget.style.setProperty("--my", `${e.clientY - r.top}px`); }; return (
Pourquoi Cours Edgar

Trois piliers qui font la différence.

{pillars.map((p) => (
{p.num}
{p.icon}

{p.stat && (
{p.stat}
)}

{p.body}

))}
); } function MatchingShowcase() { const kids = [ { av: "HU", img: "assets/avatars/hugo.png", name: "Hugo, 1ère", sub: "Maths · Prépa concours" }, { av: "LO", img: "assets/avatars/louise.png", name: "Louise, 4e", sub: "Français · Méthode" }, { av: "LE", img: "assets/avatars/leo.png", name: "Léo, L1 Éco", sub: "Micro · Stats" }, ]; const profs = [ { av: "CR", img: "assets/avatars/claire.png", name: "Claire R.", sub: "Polytechnique" }, { av: "TB", img: "assets/avatars/thomas.png", name: "Thomas B.", sub: "ENS Ulm" }, { av: "AM", img: "assets/avatars/antoine.png", name: "Antoine M.", sub: "HEC Paris" }, ]; const [active, setActive] = useS2(0); const [logoFail, setLogoFail] = useS2(false); const reduced = typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches; useE2(() => { if (reduced) return; const id = setInterval(() => setActive((i) => (i + 1) % kids.length), 2600); return () => clearInterval(id); }, [reduced]); const yPositions = [26, 50, 74]; return (
Matching sur-mesure

Pas d'algorithme aveugle.

Le professeur parfait pour atteindre vos objectifs.

Niveau, objectifs, personnalité, emploi du temps, style d'apprentissage : nous croisons plus de 20 critères pour chaque demande. Puis chaque match est validé à la main, par un humain. Du collège au supérieur, un binôme qui fonctionne dès le premier cours.

Premier cours sous
24h
Étudiants satisfaits du match
96%
{kids.map((k, i) => (
{k.name}{k.sub}
))}
{logoFail ? (
CE
Matching
) : ( Cours Edgar setLogoFail(true)} /> )}
{profs.map((p, i) => (
{p.name}{p.sub}
))}
); } function CountUp({ to, suffix = "", duration = 1400 }) { const [val, setVal] = useS2(0); const ref = useR2(null); useE2(() => { const el = ref.current; if (!el) return; const target = parseFloat(to); const io = new IntersectionObserver(([e]) => { if (!e.isIntersecting) return; io.disconnect(); const t0 = performance.now(); const tick = (t) => { const p = Math.min(1, (t - t0) / duration); const eased = 1 - Math.pow(1 - p, 3); setVal(target * eased); if (p < 1) requestAnimationFrame(tick); }; requestAnimationFrame(tick); }, { threshold: 0.4 }); io.observe(el); return () => io.disconnect(); }, [to, duration]); const isFloat = String(to).includes("."); const display = isFloat ? val.toFixed(1) : Math.round(val); return {display}{suffix}; } // Scroll-scrubbed progress of a section (0 → 1 as the section crosses the viewport). // Respects prefers-reduced-motion (returns 1 immediately) and hover:none (mobile → returns 1). function useScrollProgress(ref) { const [p, setP] = useS2(0); const rafRef = useR2(null); useE2(() => { const el = ref.current; if (!el) return; const reduced = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches; if (reduced) { setP(1); return; } const update = () => { rafRef.current = null; const rect = el.getBoundingClientRect(); const vh = window.innerHeight; // 0 when section just enters from bottom (rect.top == vh) // 1 when section just exits from top (rect.bottom == 0) const raw = (vh - rect.top) / (vh + rect.height); setP(Math.max(0, Math.min(1, raw))); }; const onScroll = () => { if (rafRef.current != null) return; rafRef.current = requestAnimationFrame(update); }; const io = new IntersectionObserver(([e]) => { if (e.isIntersecting) { window.addEventListener("scroll", onScroll, { passive: true }); update(); } else { window.removeEventListener("scroll", onScroll); } }, { rootMargin: "200px 0px 200px 0px" }); io.observe(el); return () => { io.disconnect(); window.removeEventListener("scroll", onScroll); if (rafRef.current) cancelAnimationFrame(rafRef.current); }; }, []); return p; } // --- Bulletin scolaire animé ---------------------------------------------- // Les notes montent en temps réel au scroll. Pour swap vers un vrai bulletin // anonymisé : changer les valeurs ci-dessous. Rien d'autre à toucher. const BULLETIN_GRADES = [ { matiere: "Mathématiques", t1: 12.0, t2: 17.5 }, { matiere: "Physique-Chimie", t1: 13.0, t2: 17.0 }, { matiere: "SVT", t1: 13.5, t2: 17.5 }, ]; const BULLETIN_MOY = { t1: 12.8, t2: 17.3 }; function BulletinShowcase({ openModal }) { const ref = useR2(null); const p = useScrollProgress(ref); // easeOutCubic pour que le tick ralentisse vers la fin, comme CountUp const eased = 1 - Math.pow(1 - p, 3); const mix = (a, b) => a + (b - a) * eased; const showT2 = p > 0.5; const showPos = p > 0.55; const showSig = p > 0.85; return (
Résultats réels

Les notes bougent. Vraiment.

Léa · Première S · après 3 mois avec Cours Edgar
Bulletin scolaire Trimestre 1 Trimestre 2
{BULLETIN_GRADES.map((g) => { const v = mix(g.t1, g.t2); const fill = Math.max(0, Math.min(100, (v / 20) * 100)); return (
{g.matiere} ); })}
Moyenne générale

T1 « Des difficultés en mathématiques. Manque de méthode. »

T2 « Progrès remarquables ce trimestre. Méthode solide, à poursuivre. »

Cas représentatif anonymisé.

); } function StatCard({ prefix, to, suffix, label, fillPct, ghost, delay = 0 }) { const ref = useR2(null); const [started, setStarted] = useS2(false); useE2(() => { const el = ref.current; if (!el) return; const io = new IntersectionObserver(([e]) => { if (!e.isIntersecting) return; io.disconnect(); setTimeout(() => setStarted(true), delay); }, { threshold: 0.8, rootMargin: "-15% 0px -15% 0px" }); io.observe(el); return () => io.disconnect(); }, [delay]); return (
{prefix}
{label}