/* journify.ai — S6Homepage (scroll-triggered Before → During → After diagram). Port of s6-final_2.html. Self-contained section: includes headline, frame, bottom lines, link. */ function S6Homepage() { const frameRef = React.useRef(null); const tagRef = React.useRef(null); const bottomWrapRef = React.useRef(null); const phasesRef = React.useRef(null); React.useEffect(() => { const frame = frameRef.current; const tag = tagRef.current; const bottomWrap = bottomWrapRef.current; const phasesEl = phasesRef.current; if (!frame || !tag || !bottomWrap || !phasesEl) return; const phases = phasesEl.querySelectorAll('.s6h-phase'); const tagText = { before: 'Too many offers. None of them doing the work.', during: 'Testing one offer', after: 'One offer, validated' }; let played = false; const prefersReduce = window.matchMedia('(prefers-reduced-motion: reduce)').matches; function setActivePhase(phase) { phases.forEach(p => p.classList.toggle('is-active', p.dataset.phase === phase)); tag.style.opacity = '0'; setTimeout(() => { tag.textContent = tagText[phase]; tag.style.opacity = '1'; }, 200); setBottomVisibility(phase); } function setBottomVisibility(phase) { const before = bottomWrap.querySelector('.s6h-bottom-before'); const during = bottomWrap.querySelector('.s6h-bottom-during'); const after = bottomWrap.querySelector('.s6h-bottom-after'); if (before) before.style.opacity = phase === 'before' ? '1' : '0'; if (during) during.style.opacity = phase === 'during' ? '1' : '0'; if (after) after.style.opacity = phase === 'after' ? '1' : '0'; } function setState(state) { frame.classList.remove('is-before', 'is-during', 'is-after'); void frame.offsetWidth; frame.classList.add('is-' + state); setActivePhase(state); } const timeouts = []; function play() { if (played) return; played = true; if (prefersReduce) { setState('after'); return; } // Add is-before NOW so Before-state CSS animations fire when user actually sees the section. // (Frame mounts without a state class so the keyframes don't burn off-screen.) frame.classList.add('is-before'); setActivePhase('before'); setBottomVisibility('before'); timeouts.push(setTimeout(() => setState('during'), 6000)); timeouts.push(setTimeout(() => setState('after'), 14000)); } setBottomVisibility('before'); let io; if ('IntersectionObserver' in window) { io = new IntersectionObserver((entries) => { entries.forEach(e => { if (e.isIntersecting) { play(); io.disconnect(); } }); }, { threshold: 0.3 }); io.observe(frame); } else { play(); } return () => { timeouts.forEach(clearTimeout); if (io) io.disconnect(); }; }, []); return (

How it works.

We use AI{' '} to learn from your sales call recordings. Then we improve your offer, your content, and the way you sell. In 45 days.

Before

During

After

Too many offers. None of them doing the work.

Offer 1

Coaching

Offer 2

Lead gen — rebuilt

Offer 3

Events

The offer

One offer

Validated in 10+ calls.

Disconnected marketing Integrated marketing

Website

12 services listed. Landing page, 1 offer. Homepage, 1 offer.

Outreach

Dinners, events. LinkedIn, 20/week. LinkedIn, 100/week, tracked.

LinkedIn

Last post, 1 month ago. 2-3 posts/week. 5 posts/week, inbound.

Sales calls

"I need to think about it." 2-3 booked calls. Warm leads, booked.

The companies who would sign fast never see you.
The ones who do see you take three weeks to decide.

The first replies come in. The first meetings land.
The system learns from every call while it's still running.

Every sales call updates the offer, filters out the wrong leads, and puts the right ones on next week's calendar.

Read how it actually ran →

); } Object.assign(window, { S6Homepage });