feat: add randomized portfolio hero variants

app/components/ContactInfo.tsx

@@ -1,8 +1,10 @@
 "use client";
 
+import { useEffect, useState } from "react";
 import { motion } from "motion/react";
 import { Mail, MessageCircle } from "lucide-react";
 import { usePortfolioData } from "@/lib/usePortfolioData";
+import { getWhatsAppDisplayNumber } from "@/lib/whatsapp";
 import MagneticButton from "./cinematic/MagneticButton";
 
 interface ContactInfoProps {
@@ -11,6 +13,11 @@ interface ContactInfoProps {
 
 export function ContactInfo({ onWhatsAppClick }: ContactInfoProps) {
   const { data } = usePortfolioData();
+  const [whatsAppDisplay, setWhatsAppDisplay] = useState("WhatsApp");
+
+  useEffect(() => {
+    setWhatsAppDisplay(getWhatsAppDisplayNumber());
+  }, []);
 
   if (!data) {
     return null; // Ou um componente de carregamento/erro
@@ -58,7 +65,7 @@ export function ContactInfo({ onWhatsAppClick }: ContactInfoProps) {
             </div>
             <div>
               <p className="text-white font-medium">WhatsApp</p>
-              <p className="text-gray-400">{data.contact.whatsapp}</p>
+              <p className="text-gray-400">{whatsAppDisplay}</p>
             </div>
           </MagneticButton>