Aplicativos de Atrair Leads

This commit is contained in:
2026-06-03 22:07:59 -03:00
parent e5c18bb6fc
commit fdfb4606f0
16 changed files with 371 additions and 235 deletions
+15 -9
View File
@@ -143,11 +143,17 @@ const About = () => {
{/* Image */}
<div ref={imageRef} className="relative">
<div className="relative rounded-2xl overflow-hidden shadow-2xl border border-white/5">
<img
src="/about-image.jpg"
alt="Equipe Avanzato"
className="w-full h-auto object-cover"
/>
<picture>
<source srcSet="/about-image.webp" type="image/webp" />
<img
src="/about-image.jpg"
alt="Equipe Avanzato"
loading="lazy"
width="500"
height="685"
className="w-full h-auto object-cover"
/>
</picture>
{/* Glassmorphism overlay card */}
<div className="absolute bottom-6 left-6 right-6 glass rounded-xl p-6 border border-[#cbf400]/20">
@@ -222,28 +228,28 @@ const About = () => {
>
<div className="text-center">
<Counter end={500} suffix="+" />
<div className="flex items-center justify-center gap-2 mt-2 text-gray-500">
<div className="flex items-center justify-center gap-2 mt-2 text-gray-400">
<Users className="w-4 h-4" />
<span className="text-sm">Clientes atendidos</span>
</div>
</div>
<div className="text-center">
<Counter end={99} suffix=".9%" />
<div className="flex items-center justify-center gap-2 mt-2 text-gray-500">
<div className="flex items-center justify-center gap-2 mt-2 text-gray-400">
<Clock className="w-4 h-4" />
<span className="text-sm">Uptime garantido</span>
</div>
</div>
<div className="text-center">
<Counter end={23} suffix="+" />
<div className="flex items-center justify-center gap-2 mt-2 text-gray-500">
<div className="flex items-center justify-center gap-2 mt-2 text-gray-400">
<Award className="w-4 h-4" />
<span className="text-sm">Anos de experiência</span>
</div>
</div>
<div className="text-center">
<Counter end={24} suffix="/7" />
<div className="flex items-center justify-center gap-2 mt-2 text-gray-500">
<div className="flex items-center justify-center gap-2 mt-2 text-gray-400">
<Users className="w-4 h-4" />
<span className="text-sm">Suporte técnico</span>
</div>
+4 -4
View File
@@ -117,7 +117,7 @@ const CondominiosCTA = () => {
<Phone className="w-6 h-6 text-[#cbf400]" />
</div>
<div>
<h4 className="text-white font-bold">VOIP para Condomínios</h4>
<h3 className="text-white font-bold">VOIP para Condomínios</h3>
<p className="text-gray-500 text-sm">Comunicação moderna e econômica</p>
</div>
</div>
@@ -127,7 +127,7 @@ const CondominiosCTA = () => {
<Server className="w-6 h-6 text-blue-400" />
</div>
<div>
<h4 className="text-white font-bold">Gestão de CPD</h4>
<h3 className="text-white font-bold">Gestão de CPD</h3>
<p className="text-gray-500 text-sm">Infraestrutura profissional</p>
</div>
</div>
@@ -137,7 +137,7 @@ const CondominiosCTA = () => {
<Wifi className="w-6 h-6 text-purple-400" />
</div>
<div>
<h4 className="text-white font-bold">Rede e Conectividade</h4>
<h3 className="text-white font-bold">Rede e Conectividade</h3>
<p className="text-gray-500 text-sm">Alta disponibilidade</p>
</div>
</div>
@@ -147,7 +147,7 @@ const CondominiosCTA = () => {
<Shield className="w-6 h-6 text-red-400" />
</div>
<div>
<h4 className="text-white font-bold">Segurança</h4>
<h3 className="text-white font-bold">Segurança</h3>
<p className="text-gray-500 text-sm">Monitoramento 24/7</p>
</div>
</div>
+12 -6
View File
@@ -247,13 +247,19 @@ const Hero = () => {
{/* Glow effect */}
<div className="absolute -inset-4 bg-gradient-to-r from-[#cbf400]/20 to-[#cbf400]/10 rounded-2xl blur-2xl opacity-50" />
{/* Dashboard image */}
{/* Dashboard image com WebP + fetchpriority alta */}
<div className="relative rounded-2xl overflow-hidden shadow-2xl border border-[#cbf400]/20">
<img
src="/hero-dashboard.jpg"
alt="Dashboard Avanzato"
className="w-full h-auto"
/>
<picture>
<source srcSet="/hero-dashboard.webp" type="image/webp" />
<img
src="/hero-dashboard.jpg"
alt="Dashboard Avanzato"
fetchPriority="high"
width="800"
height="500"
className="w-full h-auto"
/>
</picture>
{/* Glossy overlay */}
<div
+1 -1
View File
@@ -46,7 +46,7 @@ const Navigation = () => {
<div className="container-custom">
<div className="flex items-center justify-between h-20">
{/* Logo - importado de config/site.ts */}
<Link to={LOGO.href} className="flex items-center">
<Link to={LOGO.href} className="flex items-center" aria-label="Avanzato Tecnologia - Pagina inicial">
{renderLogo()}
</Link>
+15 -6
View File
@@ -121,6 +121,9 @@ const ServiceCard = ({ service }: { service: Service }) => {
setMousePos({ x, y });
};
// Gerar caminho WebP com fallback PNG/JPG
const webpImage = service.image.replace(/\.(png|jpg|jpeg)$/, '.webp');
return (
<div
ref={cardRef}
@@ -138,13 +141,19 @@ const ServiceCard = ({ service }: { service: Service }) => {
setMousePos({ x: 0, y: 0 });
}}
>
{/* Image container */}
{/* Image container com WebP + lazy loading */}
<div className="relative h-48 bg-gradient-to-br from-[#2a2a2a] to-[#1a1a1a] overflow-hidden">
<img
src={service.image}
alt={service.title}
className="w-full h-full object-contain p-6 transition-transform duration-500 group-hover:scale-110"
/>
<picture>
<source srcSet={webpImage} type="image/webp" />
<img
src={service.image}
alt={service.title}
loading="lazy"
width="300"
height="300"
className="w-full h-full object-contain p-6 transition-transform duration-500 group-hover:scale-110"
/>
</picture>
{/* Icon badge */}
<div className="absolute top-4 left-4 w-12 h-12 rounded-xl bg-[#0e0e0e] shadow-lg flex items-center justify-center text-[#cbf400] border border-[#cbf400]/20">