// ── TEXT SCRAMBLE ─────────────────────────────────────────
const SCRAMBLE_CHARS = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%&*';
function TextScramble({ text, className }) {
const [displayText, setDisplayText] = useState(text);
const [isHovering, setIsHovering] = useState(false);
const [isScrambling, setIsScrambling] = useState(false);
const intervalRef = useRef(null);
const frameRef = useRef(0);
const scramble = React.useCallback(() => {
setIsScrambling(true);
frameRef.current = 0;
const duration = text.length * 3;
if (intervalRef.current) clearInterval(intervalRef.current);
intervalRef.current = setInterval(() => {
frameRef.current++;
const progress = frameRef.current / duration;
const revealedLength = Math.floor(progress * text.length);
const newText = text
.split('')
.map((char, i) => {
if (char === ' ' || char === '@' || char === '.') return char;
if (i < revealedLength) return text[i];
return SCRAMBLE_CHARS[Math.floor(Math.random() * SCRAMBLE_CHARS.length)];
})
.join('');
setDisplayText(newText);
if (frameRef.current >= duration) {
clearInterval(intervalRef.current);
setDisplayText(text);
setIsScrambling(false);
}
}, 30);
}, [text]);
useEffect(() => {
return () => { if (intervalRef.current) clearInterval(intervalRef.current); };
}, []);
return (
{ setIsHovering(true); scramble(); }}
onMouseLeave={() => setIsHovering(false)}
>
{displayText.split('').map((char, i) => (
{char}
))}
);
}
// ── FOOTER ────────────────────────────────────────────────
function Footer() {
const NAV_LINKS = [
{ label: 'Nosotros', href: '#bivia' },
{ label: 'Servicios', href: '#servicios' },
{ label: 'Proyectos', href: '#proyectos' },
{ label: 'Contacto', href: '#cta' },
];
const SOCIAL_LINKS = [
{ label: 'LinkedIn', href: 'https://linkedin.com/company/bivia' },
{ label: 'Instagram', href: 'https://instagram.com/bivia.mx' },
];
return (
);
}