Merge version_2 into main #1

Merged
bender merged 2 commits from version_2 into main 2026-03-23 18:51:44 +00:00
2 changed files with 203 additions and 266 deletions

View File

@@ -11,6 +11,7 @@ import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Shield, Zap } from "lucide-react";
import LoadingScreen from '@/components/layout/LoadingScreen';
export default function LandingPage() {
return (
@@ -26,278 +27,180 @@ export default function LandingPage() {
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "home",
},
{
name: "Sobre",
id: "about",
},
{
name: "Serviços",
id: "services",
},
{
name: "Depoimentos",
id: "testimonials",
},
{
name: "Planos",
id: "pricing",
},
{
name: "Contato",
id: "contact",
},
]}
button={{
text: "Fale no WhatsApp",
href: "https://wa.me/554430422046",
}}
brandName="MGP IOT SERVICES"
/>
</div>
<LoadingScreen>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home", id: "home"},
{
name: "Sobre", id: "about"},
{
name: "Serviços", id: "services"},
{
name: "Depoimentos", id: "testimonials"},
{
name: "Planos", id: "pricing"},
{
name: "Contato", id: "contact"},
]}
button={{
text: "Fale no WhatsApp", href: "https://wa.me/554430422046"}}
brandName="MGP IOT SERVICES"
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText="MGP IOT SERVICES"
description="Conectividade, tecnologia e performance para quem exige mais."
buttons={[
{
text: "Solicitar Atendimento",
href: "#contact",
},
{
text: "Conhecer Planos",
href: "#pricing",
},
{
text: "Fale no WhatsApp",
href: "https://wa.me/554430422046",
},
]}
slides={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-dynamic-and-futuristic-image-represent-1774291010068-64760877.png",
imageAlt: "Fibra óptica de alta velocidade",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/an-abstract-visualization-of-global-conn-1774291009524-3aeec672.png",
imageAlt: "Rede global de IoT e dispositivos conectados",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-image-depicting-a-modern--1774291009910-4a384efb.png",
imageAlt: "Data center moderno e servidores de alta performance",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/an-image-illustrating-a-secure-and-relia-1774291009992-55b3d7e1.png",
imageAlt: "Rede de telecomunicações segura e confiável",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-visually-striking-image-combining-elem-1774291010186-ecbb8c22.png",
imageAlt: "Pessoas conectadas trabalhando em diferentes locais",
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-sophisticated-abstract-graphic-represe-1774291010260-f821c8bd.png",
imageAlt: "Representação abstrata de inovação tecnológica",
},
]}
autoplayDelay={4000}
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText="MGP IOT SERVICES"
description="Conectividade, tecnologia e performance para quem exige mais."
buttons={[
{
text: "Solicitar Atendimento", href: "#contact"},
{
text: "Conhecer Planos", href: "#pricing"},
{
text: "Fale no WhatsApp", href: "https://wa.me/554430422046"},
]}
slides={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-dynamic-and-futuristic-image-represent-1774291010068-64760877.png", imageAlt: "Fibra óptica de alta velocidade"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/an-abstract-visualization-of-global-conn-1774291009524-3aeec672.png", imageAlt: "Rede global de IoT e dispositivos conectados"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-image-depicting-a-modern--1774291009910-4a384efb.png", imageAlt: "Data center moderno e servidores de alta performance"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/an-image-illustrating-a-secure-and-relia-1774291009992-55b3d7e1.png", imageAlt: "Rede de telecomunicações segura e confiável"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-visually-striking-image-combining-elem-1774291010186-ecbb8c22.png", imageAlt: "Pessoas conectadas trabalhando em diferentes locais"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-sophisticated-abstract-graphic-represe-1774291010260-f821c8bd.png", imageAlt: "Representação abstrata de inovação tecnológica"},
]}
autoplayDelay={4000}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="MGP IOT SERVICES: Mais de 15 anos Conectando o Futuro"
description="A MGP IOT Services atua há mais de 15 anos no mercado, oferecendo soluções completas em conectividade, internet e tecnologia. Especialista em integrar inovação e eficiência, a empresa entrega serviços personalizados que atendem às necessidades de diversos setores, com foco em qualidade, segurança e performance. Nossos diferenciais incluem experiência de mercado, atendimento de qualidade, suporte eficiente, tecnologia atual e compromisso com a performance."
metrics={[
{
value: "4.8",
title: "Avaliação Google",
},
{
value: "2.757",
title: "Avaliações no Google",
},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-team-of-diverse-professional-individua-1774291009896-50304180.png"
imageAlt="Equipe da MGP IOT SERVICES trabalhando em escritório moderno"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="MGP IOT SERVICES: Mais de 15 anos Conectando o Futuro"
description="A MGP IOT Services atua há mais de 15 anos no mercado, oferecendo soluções completas em conectividade, internet e tecnologia. Especialista em integrar inovação e eficiência, a empresa entrega serviços personalizados que atendem às necessidades de diversos setores, com foco em qualidade, segurança e performance. Nossos diferenciais incluem experiência de mercado, atendimento de qualidade, suporte eficiente, tecnologia atual e compromisso com a performance."
metrics={[
{
value: "4.8", title: "Avaliação Google"},
{
value: "2.757", title: "Avaliações no Google"},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-team-of-diverse-professional-individua-1774291009896-50304180.png"
imageAlt="Equipe da MGP IOT SERVICES trabalhando em escritório moderno"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "internet-fibra",
name: "Internet Fibra Óptica",
price: "Planos sob medida",
variant: "Residencial e Empresarial",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-sleek-modern-icon-representing-fiber-o-1774291008785-148bc2b4.png",
imageAlt: "Ícone de Internet Fibra Óptica",
},
{
id: "telefonia",
name: "Telefonia",
price: "Consulte nossos combos",
variant: "Linhas fixas e móveis",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-modern-minimalist-icon-representing-ad-1774291008562-74979382.png",
imageAlt: "Ícone de Telefonia",
},
{
id: "conectividade",
name: "Soluções em Conectividade",
price: "Projetos personalizados",
variant: "Redes e VPNs",
imageSrc: "asset://service-conectividade",
imageAlt: "Ícone de Soluções em Conectividade",
},
{
id: "tecnologia",
name: "Tecnologia e IOT",
price: "Inovação para seu negócio",
variant: "Smart Solutions",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/an-abstract-modern-icon-representing-cut-1774291009879-63fe23bc.png",
imageAlt: "Ícone de Tecnologia e IOT",
},
]}
title="Soluções Completas para o Seu Negócio e Sua Casa"
description="Descubra a gama de serviços da MGP IOT SERVICES que transformam sua conectividade e comunicação com qualidade, segurança e alta performance."
/>
</div>
<div id="services" data-section="services">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "internet-fibra", name: "Internet Fibra Óptica", price: "Planos sob medida", variant: "Residencial e Empresarial", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-sleek-modern-icon-representing-fiber-o-1774291008785-148bc2b4.png", imageAlt: "Ícone de Internet Fibra Óptica"},
{
id: "telefonia", name: "Telefonia", price: "Consulte nossos combos", variant: "Linhas fixas e móveis", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-modern-minimalist-icon-representing-ad-1774291008562-74979382.png", imageAlt: "Ícone de Telefonia"},
{
id: "conectividade", name: "Soluções em Conectividade", price: "Projetos personalizados", variant: "Redes e VPNs", imageSrc: "asset://service-conectividade", imageAlt: "Ícone de Soluções em Conectividade"},
{
id: "tecnologia", name: "Tecnologia e IOT", price: "Inovação para seu negócio", variant: "Smart Solutions", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/an-abstract-modern-icon-representing-cut-1774291009879-63fe23bc.png", imageAlt: "Ícone de Tecnologia e IOT"},
]}
title="Soluções Completas para o Seu Negócio e Sua Casa"
description="Descubra a gama de serviços da MGP IOT SERVICES que transformam sua conectividade e comunicação com qualidade, segurança e alta performance."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
useInvertedBackground={true}
testimonial="“Ótimo atendimento, na venda, instalação e no pós venda. Melhor serviço de internet da cidade e região de Maringá. Super recomendo!”"
rating={5}
author="Cliente MGP IOT SERVICES"
avatars={[
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009387-4cadfbab.png",
alt: "Avaliação de Sarah Johnson",
},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009366-23934d96.png",
alt: "Avaliação de Michael Chen",
},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009670-14903bb1.png",
alt: "Avaliação de Emily Rodriguez",
},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009818-ae2fa705.png",
alt: "Avaliação de David Kim",
},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009297-55357621.png",
alt: "Avaliação de Jessica Lee",
},
]}
ratingAnimation="slide-up"
avatarsAnimation="slide-up"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
useInvertedBackground={true}
testimonial="“Ótimo atendimento, na venda, instalação e no pós venda. Melhor serviço de internet da cidade e região de Maringá. Super recomendo!”"
rating={5}
author="Cliente MGP IOT SERVICES"
avatars={[
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009387-4cadfbab.png", alt: "Avaliação de Sarah Johnson"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009366-23934d96.png", alt: "Avaliação de Michael Chen"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009670-14903bb1.png", alt: "Avaliação de Emily Rodriguez"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009818-ae2fa705.png", alt: "Avaliação de David Kim"},
{
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BMFEuWIN0p6dxl2VXzUe9UwXxK/a-professional-portrait-of-a-diverse-sat-1774291009297-55357621.png", alt: "Avaliação de Jessica Lee"},
]}
ratingAnimation="slide-up"
avatarsAnimation="slide-up"
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "residencial-plus",
badge: "Mais Velocidade",
badgeIcon: Zap,
price: "A partir de R$ 99,90",
subtitle: "Ideal para residências e uso básico.",
buttons: [
{
text: "Ver Detalhes",
href: "#contact",
},
],
features: [
"Internet Fibra Óptica Ultra Rápida",
"Suporte Técnico Dedicado",
"Instalação Gratuita",
"Atendimento Prioritário",
],
},
{
id: "empresarial-pro",
badge: "Alta Performance",
badgeIcon: Shield,
price: "A partir de R$ 249,90",
subtitle: "Soluções robustas para empresas de todos os portes.",
buttons: [
{
text: "Solicitar Orçamento",
href: "#contact",
},
],
features: [
"Internet Corporativa de Alta Capacidade",
"SLA Garantido",
"Telefonia VoIP Integrada",
"Consultoria de Conectividade",
"Segurança Avançada de Rede",
],
},
]}
title="Escolha o Plano Ideal para Suas Necessidades"
description="Oferecemos uma variedade de planos de internet e combos de serviços, projetados para atender você e sua empresa com a melhor performance e custo-benefício."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "residencial-plus", badge: "Mais Velocidade", badgeIcon: Zap,
price: "A partir de R$ 99,90", subtitle: "Ideal para residências e uso básico.", buttons: [
{
text: "Ver Detalhes", href: "#contact"},
],
features: [
"Internet Fibra Óptica Ultra Rápida", "Suporte Técnico Dedicado", "Instalação Gratuita", "Atendimento Prioritário"],
},
{
id: "empresarial-pro", badge: "Alta Performance", badgeIcon: Shield,
price: "A partir de R$ 249,90", subtitle: "Soluções robustas para empresas de todos os portes.", buttons: [
{
text: "Solicitar Orçamento", href: "#contact"},
],
features: [
"Internet Corporativa de Alta Capacidade", "SLA Garantido", "Telefonia VoIP Integrada", "Consultoria de Conectividade", "Segurança Avançada de Rede"],
},
]}
title="Escolha o Plano Ideal para Suas Necessidades"
description="Oferecemos uma variedade de planos de internet e combos de serviços, projetados para atender você e sua empresa com a melhor performance e custo-benefício."
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "radial-gradient",
}}
tag="Fale Conosco"
title="Conecte-se com a MGP IOT SERVICES Hoje Mesmo!"
description="Precisa de internet, telefonia ou soluções tecnológicas com alta performance em Maringá-PR? Nossa equipe está pronta para te atender. Entre em contato e descubra como podemos impulsionar sua conectividade."
buttons={[
{
text: "Solicitar Orçamento",
href: "mailto:contato@mgpiotservices.com.br",
},
{
text: "Fale no WhatsApp",
href: "https://wa.me/554430422046",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "radial-gradient"}}
tag="Fale Conosco"
title="Conecte-se com a MGP IOT SERVICES Hoje Mesmo!"
description="Precisa de internet, telefonia ou soluções tecnológicas com alta performance em Maringá-PR? Nossa equipe está pronta para te atender. Entre em contato e descubra como podemos impulsionar sua conectividade."
buttons={[
{
text: "Solicitar Orçamento", href: "mailto:contato@mgpiotservices.com.br"},
{
text: "Fale no WhatsApp", href: "https://wa.me/554430422046"},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="MGP IOT SERVICES"
leftLink={{
text: "Política de Privacidade",
href: "#",
}}
rightLink={{
text: "Termos de Serviço",
href: "#",
}}
/>
</div>
</ReactLenis>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="MGP IOT SERVICES"
leftLink={{
text: "Política de Privacidade", href: "#"}}
rightLink={{
text: "Termos de Serviço", href: "#"}}
/>
</div>
</ReactLenis>
</LoadingScreen>
</ThemeProvider>
);
}
}

View File

@@ -0,0 +1,34 @@
"use client";
import React, { useState, useEffect } from 'react';
const LoadingScreen = ({ children }: { children: React.ReactNode }) => {
const [isLoading, setIsLoading] = useState(true);
const [isFadingOut, setIsFadingOut] = useState(false);
useEffect(() => {
// Simulate content loading delay
const timer = setTimeout(() => {
setIsFadingOut(true); // Start fade-out animation
setTimeout(() => {
setIsLoading(false); // Remove loader after fade-out
}, 500); // Duration of fade-out animation
}, 1500); // Show loader for at least 1.5 seconds
return () => clearTimeout(timer);
}, []);
if (isLoading) {
return (
<div className={`fixed inset-0 z-[9999] flex items-center justify-center bg-background transition-opacity duration-500 ${isFadingOut ? 'opacity-0' : 'opacity-100'}`}>
{/* Simple spinner */}
<div className="h-16 w-16 animate-spin rounded-full border-4 border-primary-cta border-t-transparent"></div>
<span className="sr-only">Loading...</span>
</div>
);
}
return <>{children}</>;
};
export default LoadingScreen;