const { useState, useEffect, useRef } = React; // ============================================================ // CONTACT FORM CONFIG — both keys below are PUBLIC by design. // They are meant to live in client HTML. No .env needed. // 1. Sign up at https://web3forms.com → grab your Access Key. // 2. Sign up at https://www.cloudflare.com/products/turnstile/ // → grab your SITE key. The Turnstile SECRET key is pasted // into the Web3Forms dashboard, NEVER into this file. // ============================================================ const WEB3FORMS_ACCESS_KEY = "a7fd0840-9127-4d12-af5f-adce819461b6"; const TURNSTILE_SITE_KEY = "0x4AAAAAADQa3hPUHPSEZOIg"; // ============ icons ============ const CIcon = { Arrow: (p) => ( ), Menu: (p) => ( ), }; // ============ NAV ============ function Nav({ scrolled }) { const [menuOpen, setMenuOpen] = useState(false); useEffect(() => { document.body.style.overflow = menuOpen ? 'hidden' : ''; return () => { document.body.style.overflow = ''; }; }, [menuOpen]); const closeMenu = () => setMenuOpen(false); const scrollTop = (e) => { e.preventDefault(); window.scrollTo({ top: 0, behavior: 'smooth' }); closeMenu(); }; return (
Ages Productions
Home Media Workflow Self-Shoot Systems About Use Cases Contact
); } // ============ FOOTER ============ function Footer() { return ( ); } // ============ CONTACT FORM ============ function ContactForm() { const [status, setStatus] = useState('idle'); const [errorMsg, setErrorMsg] = useState(''); const formRef = useRef(null); const keysConfigured = WEB3FORMS_ACCESS_KEY && !WEB3FORMS_ACCESS_KEY.startsWith('YOUR_') && TURNSTILE_SITE_KEY && !TURNSTILE_SITE_KEY.startsWith('YOUR_'); useEffect(() => { if (!keysConfigured) return; if (document.querySelector('script[data-turnstile]')) return; const s = document.createElement('script'); s.src = 'https://challenges.cloudflare.com/turnstile/v0/api.js'; s.async = true; s.defer = true; s.dataset.turnstile = 'true'; document.head.appendChild(s); }, [keysConfigured]); async function onSubmit(e) { e.preventDefault(); if (status === 'sending') return; setStatus('sending'); setErrorMsg(''); const form = formRef.current; const data = new FormData(form); if (data.get('botcheck')) { setStatus('success'); form.reset(); return; } try { const res = await fetch('https://api.web3forms.com/submit', { method: 'POST', headers: { 'Accept': 'application/json' }, body: data, }); const json = await res.json(); if (json.success) { setStatus('success'); form.reset(); if (window.turnstile) window.turnstile.reset(); } else { setStatus('error'); setErrorMsg(json.message || 'Something went wrong. Please try again.'); } } catch (err) { setStatus('error'); setErrorMsg('Network error. Please try again.'); } } if (status === 'success') { return (
// INQUIRY · RECEIVED REPLY WITHIN 24H

Thanks — your inquiry is in.

I read every message personally. Expect a direct reply within 24 hours, usually sooner. Talk soon.

— Ages Productions

); } return (
// PRODUCTION INQUIRY REPLY WITHIN 24H
{keysConfigured ? (
) : ( )}
{status === 'error' && (
Couldn't send: {errorMsg}
)}
Your information is used only to respond to your inquiry. No mailing list. No file uploads — a secure upload link will be provided after initial contact if needed.
); } // ============ PAGE ============ function App() { const [scrolled, setScrolled] = useState(false); useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 40); window.addEventListener('scroll', onScroll); onScroll(); return () => window.removeEventListener('scroll', onScroll); }, []); return (
); } const root = ReactDOM.createRoot(document.getElementById('root')); root.render();