"use client"; import React, { useEffect } from "react"; import Link from "next/link"; import "aos/dist/aos.css"; import { FaArrowRightLong } from "react-icons/fa6"; import Image from "next/image"; const ServiceDetail = () => { useEffect(() => { let cancelled = false; let ctx: { revert: () => void } | undefined; let timer: ReturnType; // Load GSAP lazily so it stays out of the initial page bundle. (async () => { const [{ default: gsap }, { ScrollTrigger }] = await Promise.all([ import("gsap"), import("gsap/ScrollTrigger"), ]); gsap.registerPlugin(ScrollTrigger); if (cancelled) return; timer = setTimeout(() => { if (cancelled) return; ctx = gsap.context(() => { gsap.fromTo( "#animated-path", { strokeDasharray: 500, strokeDashoffset: 500 }, { strokeDashoffset: 0, duration: 5, ease: "none", scrollTrigger: { trigger: ".service_details", start: "50% 80%", end: "80% 20%", toggleActions: "play none reverse none", scrub: 1, invalidateOnRefresh: true, }, } ); gsap.fromTo( "#animated-path-2", { strokeDasharray: 500, strokeDashoffset: 500 }, { strokeDashoffset: 0, duration: 5, ease: "none", scrollTrigger: { trigger: ".service_details2", start: "50% 80%", end: "80% 20%", toggleActions: "play none reverse none", scrub: 1, invalidateOnRefresh: true, }, } ); gsap.fromTo( "#animated-path-3", { strokeDasharray: 500, strokeDashoffset: 500 }, { strokeDashoffset: 0, duration: 5, ease: "none", scrollTrigger: { trigger: ".service_details3", start: "50% 80%", end: "80% 20%", toggleActions: "play none reverse none", scrub: 1, invalidateOnRefresh: true, }, } ); gsap.fromTo( "#animated-path-4", { strokeDasharray: 500, strokeDashoffset: 500 }, { strokeDashoffset: 0, duration: 5, ease: "none", scrollTrigger: { trigger: ".service_details4", start: "50% 80%", end: "80% 20%", toggleActions: "play none reverse none", scrub: 1, invalidateOnRefresh: true, }, } ); }); ScrollTrigger.refresh(); }, 500); })(); return () => { cancelled = true; clearTimeout(timer); if (ctx) ctx.revert(); }; }, []); useEffect(() => { import("aos").then((mod) => { mod.default.init({ disable: window.innerWidth < 768, // mobile: no scroll animations (perf/LCP) duration: 1000, // Animation duration in ms offset: 100, // Offset from original trigger point easing: "ease-in-out", once: false, // Animation runs only once }); }); }, []); return (

Innovative Solutions for You

Innovation is powered by creativity, which generates distinctive concepts and resolutions. Growth is propelled by evolution, responding to obstacles and welcoming transformation. Agility is guaranteed through speed, providing outcomes rapidly while sustaining excellence in today is dynamic environment.

{/* SVG Section */}
Fruxinfo services illustration
{/* Text Section */}

Creative Design

Fruxinfo services illustration

A strong visual identity establishes your brand in a competitive market. We help take that vision into effective practice. Our expertise elevates your brand to prominence through a strong visual identity.

  • Original and innovative thoughts
  • Repeating brand narrative
  • Engaging and pleasing images
  • User-centered design strategy
View More
{/* Text Section */}

Web Development

Fruxinfo services illustration

A great website is the basis of your web presence. We create high-performance, accessible sites that achieve the highest levels of engagement and conversions.

  • Mobile-responsive and adaptable design
  • Quick loading time and search engine friendliness
  • Secure and Scalable Architecture
  • Smooth navigation and user experience
View More
{/* SVG Section */}
Fruxinfo services illustration
{/* SVG Section */}
Fruxinfo services illustration
{/* Text Section */}

App Development

Fruxinfo services illustration

A robust mobile app can reinvent your company and boost engagement. We design user-friendly, high-performance apps that suit you.

  • Personalized iOS and Android development
  • Smooth and responsive user interface.
  • Secure and scalable backend
  • Continued integration with third-party service providers.
View More
{/* Text Section */}

Marketing Strategy

Fruxinfo services illustration

A good marketing strategy puts your brand in front of the right audience and drives growth. We craft data-driven plans to maximize your reach.

  • Target audience analysis
  • Multi-channel digital marketing
  • Performance tracking and optimization
  • Brand storytelling and compelling content
View More
{/* SVG Section */}
Fruxinfo services illustration
); }; export default ServiceDetail;