// Terra Group — Contact + Footer Component // Exports: Contact const Modal = ({ title, onClose, children }) => { React.useEffect(() => { const handler = (e) => { if (e.key === 'Escape') onClose(); }; document.addEventListener('keydown', handler); return () => document.removeEventListener('keydown', handler); }, [onClose]); return (
e.stopPropagation()} style={{background:'white',borderRadius:10,maxWidth:640,width:'100%',maxHeight:'80vh',display:'flex',flexDirection:'column',boxShadow:'0 16px 60px rgba(21,66,112,0.25)'}}>

{title}

{children}
); }; const Contact = () => { const [form, setForm] = React.useState({ name: '', email: '', phone: '', service: '', message: '' }); const [sent, setSent] = React.useState(false); const [modal, setModal] = React.useState(null); const [isWide, setIsWide] = React.useState(window.innerWidth >= 900); React.useEffect(() => { const onResize = () => setIsWide(window.innerWidth >= 900); window.addEventListener('resize', onResize); return () => window.removeEventListener('resize', onResize); }, []); const update = (k, v) => setForm(f => ({ ...f, [k]: v })); const submit = (e) => { e.preventDefault(); setSent(true); }; const contactItems = [ { icon: , label: 'Phone', value: '(+30) 697 2100130' }, { icon: , label: 'Email', value: 'info@terragroupevia.gr' }, { icon: , label: 'Location', value: 'Skorponeria, Evia, Greece' }, ]; const s = { section: { background: '#f4fafd', padding: '96px 24px 0' }, inner: { maxWidth: 1200, margin: '0 auto' }, // Desktop: 2-col (info left, form right). Mobile: stacked topGrid: { display: 'grid', gridTemplateColumns: isWide ? '1fr 1fr' : '1fr', gap: isWide ? 64 : 0, alignItems: 'start', marginBottom: isWide ? 0 : 32, }, // On mobile the top row splits into text + icons side by side mobileTopRow: { display: isWide ? 'block' : 'grid', gridTemplateColumns: isWide ? undefined : '1fr 1fr', gap: isWide ? undefined : 24, marginBottom: isWide ? 0 : 32, }, eyebrow: { fontFamily: "'Inter', sans-serif", fontSize: 11, fontWeight: 700, letterSpacing: '0.2em', textTransform: 'uppercase', color: '#87C8E8', marginBottom: 12, display: 'flex', alignItems: 'center', gap: 8 }, line: { width: 28, height: 1, background: '#87C8E8', display: 'inline-block' }, h2: { fontFamily: "'Playfair Display', serif", fontSize: 'clamp(22px, 3.5vw, 38px)', fontWeight: 700, color: '#0F1923', marginBottom: 16, lineHeight: 1.15 }, lead: { fontFamily: "'Inter', sans-serif", fontSize: 15, color: '#4A5568', lineHeight: 1.65, marginBottom: isWide ? 36 : 0 }, infoItem: { display: 'flex', gap: 12, alignItems: 'flex-start', marginBottom: 18 }, iconCircle: { width: 38, height: 38, background: '#154270', borderRadius: '50%', display: 'flex', alignItems: 'center', justifyContent: 'center', flexShrink: 0 }, infoLabel: { fontFamily: "'Inter', sans-serif", fontSize: 10, fontWeight: 700, letterSpacing: '0.1em', textTransform: 'uppercase', color: '#A0AEC0', marginBottom: 2 }, infoValue: { fontFamily: "'Inter', sans-serif", fontSize: 14, color: '#0F1923', fontWeight: 500 }, // Form: full-width on mobile, right column on desktop formWrap: { gridColumn: isWide ? undefined : '1 / -1' }, form: { background: 'white', borderRadius: 10, border: '1px solid #D1D5DB', padding: isWide ? 32 : 24, boxShadow: '0 4px 24px rgba(21,66,112,0.08)' }, row: { display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 16, marginBottom: 16 }, fieldWrap: { display: 'flex', flexDirection: 'column', gap: 5 }, label: { fontFamily: "'Inter', sans-serif", fontSize: 12, fontWeight: 600, color: '#2d3e4f' }, input: { fontFamily: "'Inter', sans-serif", fontSize: 14, padding: '10px 12px', border: '1px solid #D1D5DB', borderRadius: 4, color: '#0F1923', outline: 'none', width: '100%' }, textarea: { fontFamily: "'Inter', sans-serif", fontSize: 14, padding: '10px 12px', border: '1px solid #D1D5DB', borderRadius: 4, color: '#0F1923', outline: 'none', width: '100%', minHeight: 100, resize: 'vertical' }, select: { fontFamily: "'Inter', sans-serif", fontSize: 14, padding: '10px 12px', border: '1px solid #D1D5DB', borderRadius: 4, color: '#0F1923', outline: 'none', width: '100%', background: 'white' }, btn: { width: '100%', padding: '13px', background: '#154270', color: 'white', border: 'none', borderRadius: 4, fontFamily: "'Inter', sans-serif", fontSize: 15, fontWeight: 600, cursor: 'pointer', marginTop: 8 }, success: { textAlign: 'center', padding: 32 }, successIcon: { fontSize: 40, marginBottom: 12 }, successTitle: { fontFamily: "'Playfair Display', serif", fontSize: 22, fontWeight: 700, color: '#0F1923', marginBottom: 8 }, successText: { fontFamily: "'Inter', sans-serif", fontSize: 15, color: '#4A5568' }, footer: { background: '#154270', marginTop: 80, padding: '36px 24px' }, footerInner: { maxWidth: 1200, margin: '0 auto', display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 12 }, footerLogo: { display: 'flex', alignItems: 'center', gap: 10 }, footerLogoText: { fontFamily: "'Playfair Display', serif", fontSize: 18, fontWeight: 700, color: 'white', letterSpacing: '0.08em' }, footerCopy: { fontFamily: "'Inter', sans-serif", fontSize: 13, color: 'rgba(255,255,255,0.5)' }, footerLinks: { display: 'flex', gap: 24 }, footerLink: { fontFamily: "'Inter', sans-serif", fontSize: 13, color: 'rgba(255,255,255,0.65)', textDecoration: 'none', cursor: 'pointer' }, }; const InfoItems = () => (
{contactItems.map((item, i) => (
{item.icon}
{item.label}
{item.value}
))}
); const FormBlock = () => (
{sent ? (
Message Sent!
We'll get back to you shortly.
) : (
update('name', e.target.value)} required />
update('email', e.target.value)} required />
update('phone', e.target.value)} />
)}
); return ( <>
{isWide ? ( /* Desktop: text+info left, form right */
Contact

Let's Talk

We're here to answer any question about your property — reach out and we'll get back to you promptly.

) : ( /* Mobile: top row = text (left) + icons (right), below = full-width form */ <>
Contact

Let's Talk

We're here to answer any question about your property.

)}
{modal === 'terms' && ( setModal(null)}>

Last updated: April 2026

By accessing and using terragroupevia.gr, you agree to be bound by these Terms of Use. If you do not agree to these terms, please do not use this website.

Use of Content
All content on this site — including text, images, and graphics — is the property of Terra Group and may not be reproduced without prior written permission.

Services
Terra Group provides information about property management, renovation, construction, and brokerage services in Evia, Greece. Details provided on this site are for informational purposes only and do not constitute a binding offer.

Limitation of Liability
Terra Group shall not be liable for any direct, indirect, or consequential damages arising from the use of this website or reliance on any information provided herein.

Contact
For any questions regarding these terms, please contact us at info@terragroupevia.gr or call (+30) 697 2100130.

)} {modal === 'privacy' && ( setModal(null)}>

Last updated: April 2026

Terra Group is committed to protecting your personal data in accordance with the EU General Data Protection Regulation (GDPR) and applicable Greek law.

Data We Collect
When you use our contact form, we collect your name, email address, phone number, and message content solely to respond to your enquiry.

How We Use Your Data
Your data is used only to respond to your enquiry and is never sold or shared with third parties without your explicit consent.

Data Retention
We retain your data for no longer than necessary to fulfil the purpose for which it was collected, typically no more than 12 months.

Your Rights
Under GDPR, you have the right to access, correct, or delete your personal data at any time. To exercise these rights, contact us at info@terragroupevia.gr.

Cookies
This website does not currently use tracking cookies.

Contact
Data Controller: Terra Group · Skorponeria, Evia, Greece · info@terragroupevia.gr

)} ); }; Object.assign(window, { Contact, Modal });