// rbd-components.jsx — Header, Footer, PlaceholderImage, useScrollReveal const { useState, useEffect } = React; // ── Placeholder Image ───────────────────────────────────────────────────────── function PlaceholderImage({ label = 'IMAGEM', style = {}, light = false, src = null }) { if (src) { return ( {typeof

); } const bg = light ? 'repeating-linear-gradient(-45deg,#e8e8e8 0,#e8e8e8 1px,#f0f0f0 1px,#f0f0f0 12px)' : 'repeating-linear-gradient(-45deg,#141414 0,#141414 1px,#1e1e1e 1px,#1e1e1e 12px)'; return (

{label}

); } // ── Scroll Reveal Hook ──────────────────────────────────────────────────────── function useScrollReveal() { useEffect(() => { const observer = new IntersectionObserver( (entries) => entries.forEach((e) => { if (e.isIntersecting) e.target.classList.add('visible'); }), { threshold: 0.1, rootMargin: '0px 0px -50px 0px' } ); document.querySelectorAll('.reveal').forEach((el) => observer.observe(el)); return () => observer.disconnect(); }); } // ── Social helpers ─────────────────────────────────────────────────────────── function openInstagram() { const user = 'rbd_arquitetura'; const ua = navigator.userAgent; if (/iPad|iPhone|iPod/.test(ua)) { window.location = `instagram://user?username=${user}`; setTimeout(() => window.open(`https://www.instagram.com/${user}/`, '_blank'), 600); } else if (/Android/.test(ua)) { window.location = `intent://instagram.com/${user}#Intent;package=com.instagram.android;scheme=https;end`; setTimeout(() => window.open(`https://www.instagram.com/${user}/`, '_blank'), 600); } else { window.open(`https://www.instagram.com/${user}/`, '_blank'); } } function openYouTube() { window.open('https://www.youtube.com/', '_blank'); } function openWhatsApp() { const phone = '5542988708525'; // +55 (42) 98870-8525 const msg = encodeURIComponent('Olá! Vim pelo site da RBD Arquitetura e gostaria de mais informações.'); window.open(`https://wa.me/${phone}?text=${msg}`, '_blank'); } // ── Header ──────────────────────────────────────────────────────────────────── function Header({ active, navigate }) { const [scrolled, setScrolled] = useState(false); const [open, setOpen] = useState(false); useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 70); window.addEventListener('scroll', onScroll, { passive: true }); return () => window.removeEventListener('scroll', onScroll); }, []); useEffect(() => { document.body.style.overflow = open ? 'hidden' : ''; return () => {document.body.style.overflow = '';}; }, [open]); const nav = [ ['home', 'HOME'], ['sobre', 'SOBRE'], ['portfolio', 'PORTFÓLIO'], ['servicos', 'SERVIÇOS'], ['contato', 'CONTATO']]; const go = (id) => {navigate(id);setOpen(false);}; return ( <>

{/* Logo */}

go('home')}>

{ e.target.style.display = 'none'; e.target.nextElementSibling.style.display = 'flex'; }} /> RBD ARCH

{/* Desktop nav */}

{nav.map(([id, label]) => )} {/* Social icons */}

{/* Hamburger */}

{/* Mobile overlay */}

{/* Social no mobile overlay */}

{nav.map(([id, label], i) => )}

); } // ── Footer ──────────────────────────────────────────────────────────────────── function Footer({ navigate }) { const navLinks = [['home', 'Home'], ['sobre', 'Sobre'], ['portfolio', 'Portfólio'], ['servicos', 'Serviços'], ['contato', 'Contato']]; return (