1<!DOCTYPE html><html lang="fr" class="scroll-smooth dark inter_b21886cc-module__H39p-a__variable outfit_c74927ed-module__BewnRq__variable"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/immutable/media/1b99372b3eaef0c8-s.p.1ay-qk1u8nydy.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" href="/_next/static/immutable/media/83afe278b6a6bb3c-s.p.45535valc9rzk.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="preload" as="image" href="/services/zeplug-logo-dark.webp"/><link rel="stylesheet" href="/_next/static/immutable/chunks/2wwb431r9_89j.css" data-precedence="next"/><link rel="stylesheet" href="/_next/static/immutable/chunks/380kg-a757my7.css" data-precedence="next"/><link rel="preload" as="script" fetchPriority="low" href="/_next/static/immutable/chunks/2n5bv9p3-l876.js"/>
1<script src="/_next/static/immutable/chunks/0ws7t_wz4dvp7.js" async=""></script>
1<script src="/_next/static/immutable/chunks/2xuuta6eq-lq9.js" async=""></script>
1<script src="/_next/static/immutable/chunks/1x8rwzlio-m0-.js" async=""></script>
1<script src="/_next/static/immutable/chunks/turbopack-29g5-byhkw0cr.js" async=""></script>
1<script src="/_next/static/immutable/chunks/31fuu0r8nbrxd.js" async=""></script>
1<script src="/_next/static/immutable/chunks/32c__9irwyfyx.js" async=""></script>
1<script src="/_next/static/immutable/chunks/0xc9mjxmktz10.js" async=""></script>
1<script src="/_next/static/immutable/chunks/1qhomylv4-i4r.js" async=""></script>
1<script src="/_next/static/immutable/chunks/27dql0qugea-u.js" async=""></script>
1<script src="/_next/static/immutable/chunks/3is9bhkuj0-bo.js" async=""></script>
1<script src="/_next/static/immutable/chunks/4041q50gom64s.js" async=""></script>
1<link rel="preload" href="https://www.googletagmanager.com/gtag/js?id=G-HLHZ9X5NNX" as="script"/><meta name="theme-color" content="#050505"/><title>Zeplug.ai â Agence Créative IA à Casablanca | Vidéo, Photo, Design</title><meta name="description" content="Zeplug est l'agence créative IA de Casablanca. Vidéo promotionnelle, photo produit, design graphique et contenu digital â sur abonnement, sans engagement."/><link rel="canonical" href="https://zeplug.ai"/><link rel="alternate" hrefLang="fr-MA" href="https://zeplug.ai"/><link rel="alternate" hrefLang="en" href="https://zeplug.ai/en"/><link rel="alternate" hrefLang="x-default" href="https://zeplug.ai"/><meta property="og:title" content="Zeplug.ai â Votre Agence Créative IA au Maroc"/><meta property="og:description" content="Vidéo, Photo produit, Design et IA â l'agence créative de Casablanca sur abonnement."/><meta property="og:url" content="https://zeplug.ai"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:title" content="Zeplug.ai â Votre Agence Créative IA au Maroc"/><meta name="twitter:description" content="Vidéo, Photo produit, Design et IA â l'agence créative de Casablanca sur abonnement."/><meta name="twitter:image" content="https://zeplug.ai/og-image.png"/><meta name="next-size-adjust" content=""/><link rel="icon" type="image/webp" href="/services/agence-creative-ia-maroc-icone.webp"/><link rel="preconnect" href="https://nfpslhfjdmfgusnthmkg.supabase.co" crossorigin="anonymous"/>
1<script type="application/ld+json">{"@context":"https://schema.org","@type":["LocalBusiness","ProfessionalService"],"@id":"https://zeplug.ai/#organization","name":"Zeplug","alternateName":"Zeplug.ai","legalName":"ZEPLUG SARL","identifier":[{"@type":"PropertyValue","propertyID":"RC Casablanca","value":"454037"},{"@type":"PropertyValue","propertyID":"ICE","value":"002363402000081"}],"description":"Agence créative IA à Casablanca : production vidéo, photo produit, design, branding, développement web et SEO sur abonnement.","url":"https://zeplug.ai","logo":{"@type":"ImageObject","url":"https://zeplug.ai/services/zeplug-logo-light.webp"},"image":"https://zeplug.ai/og-image.png","email":"[email protected]","telephone":"+212635461718","address":{"@type":"PostalAddress","streetAddress":"45 Rue Abdelkader Mouftakar, N4","addressLocality":"Casablanca","addressRegion":"Casablanca-Settat","addressCountry":"MA"},"geo":{"@type":"GeoCoordinates","latitude":33.5731,"longitude":-7.5898},"areaServed":[{"@type":"City","name":"Casablanca"},{"@type":"Country","name":"Maroc"}],"priceRange":"4500 MAD - 9000 MAD / mois","currenciesAccepted":"MAD","foundingDate":"2024","sameAs":["https://www.instagram.com/zeplug.ai/","https://www.linkedin.com/company/zeplug/","https://www.facebook.com/zeplug/","https://twitter.com/zeplug"]}</script>
1<script src="/_next/static/immutable/chunks/0c0hxoamwjsbw.js" noModule=""></script>
1</head><body class="min-h-screen bg-gray-50 dark:bg-[#050505] text-neutral-900 dark:text-white transition-colors duration-300 selection:bg-[#FFC20E] selection:text-black"><div hidden=""><!--$--><!--/$--></div><!--$!--><template data-dgst="BAILOUT_TO_CLIENT_SIDE_RENDERING"></template><!--/$--><div class="min-h-screen bg-[#0a0a0a] text-white"><nav class="fixed top-0 left-0 right-0 z-50 transition-all duration-300 bg-transparent"><div class="max-w-7xl mx-auto px-4 md:px-8"><div class="flex items-center justify-between h-20 w-full"><div class="flex-none flex items-center z-10"><a href="/" class="flex items-center"><img src="/services/zeplug-logo-dark.webp" alt="Logo Zeplug â Agence créative IA Maroc" class="h-12 md:h-14" width="150" height="56"/></a></div><div class="hidden md:flex flex-none items-center justify-center space-x-8 z-10"><a href="/services" class="text-sm font-semibold text-white hover:text-[#FFC20E] transition-colors">Services</a><a href="/#portfolio" class="text-sm font-semibold text-white hover:text-[#FFC20E] transition-colors">Réalisations</a><a href="/#a-propos" class="text-sm font-semibold text-white hover:text-[#FFC20E] transition-colors">à propos</a><a href="/#pricing" class="text-sm font-semibold text-white hover:text-[#FFC20E] transition-colors">Tarifs</a><a href="/contact" class="text-sm font-semibold text-white hover:text-[#FFC20E] transition-colors">Contact</a><a href="/blog" class="text-sm font-semibold text-white hover:text-[#FFC20E] transition-colors">Blog</a></div><div class="hidden md:flex flex-none items-center justify-end space-x-4 z-10"><div class="relative"><button class="flex items-center text-sm font-semibold text-white hover:text-[#FFC20E] transition-colors" aria-label="Toggle language"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe mr-1" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg>FR</button></div><div class="flex items-center space-x-3 pl-4 border-l border-white/10"><button class="hidden lg:inline-flex items-center justify-center gap-2 px-4 py-2 rounded-full font-semibold text-sm transition-all duration-300 bg-transparent border-2 border-[#FFC20E] text-[#FFC20E] hover:bg-[#FFC20E] hover:text-black hover:shadow-[0_0_15px_rgba(255,194,14,0.3)] focus:outline-none focus:ring-2 focus:ring-[#FFC20E] focus:ring-offset-2 focus:ring-offset-black"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-calendar" aria-hidden="true"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>Réserver une démo</button><button class="inline-flex items-center justify-center px-6 py-3 rounded-full font-semibold transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[#FFC20E] focus:ring-offset-white dark:focus:ring-offset-black bg-[#FFC20E] text-black hover:bg-[#e0a800] hover:shadow-[0_0_15px_rgba(255,194,14,0.4)] !px-5 !py-2 text-sm">Platform Client</button></div></div><div class="md:hidden flex items-center space-x-4"><div class="relative">
1<button class="text-sm font-bold text-neutral-600 dark:text-neutral-400 hover:text-[#FFC20E] transition-colors">FR</button></div><button class="text-black dark:text-white focus:outline-none"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu" aria-hidden="true"><path d="M4 5h16"></path><path d="M4 12h16"></path><path d="M4 19h16"></path></svg></button></div></div></div><!--$--><!--/$--></nav><main><section class="relative min-h-screen flex items-center justify-center overflow-hidden pt-20"><div class="absolute inset-0 z-0 bg-gray-50 dark:bg-[#050505] transition-colors duration-300"><!--$--><canvas class="absolute inset-0 w-full h-full pointer-events-auto" style="z-index:0"></canvas><!--/$--><div class="absolute inset-0 bg-gradient-to-b from-transparent via-white/50 to-white dark:via-black/50 dark:to-black pointer-events-none"></div></div><div class="relative z-10 max-w-5xl mx-auto px-4 text-center pointer-events-none"><div class="mb-6 inline-flex items-center px-3 py-1 rounded-full border border-black/10 dark:border-white/10 bg-white/50 dark:bg-white/5 backdrop-blur-sm pointer-events-auto"><span class="w-2 h-2 rounded-full bg-[#FFC20E] mr-2 animate-pulse"></span><span class="text-[11px] font-bold tracking-widest text-neutral-600 dar
1k:text-neutral-300">Exclusivement pour les fondateurs & CMOs</span></div><h1 class="text-4xl md:text-6xl lg:text-7xl font-bold font-heading tracking-tight mb-8 text-black dark:text-white leading-[1.1] pointer-events-auto">Votre <span class="text-transparent bg-clip-text bg-gradient-to-r from-neutral-800 to-neutral-500 dark:from-white dark:to-neutral-500">Agence Créative IA </span> <br class="hidden md:block"/><span class="text-[#FFC20E] drop-shadow-[0_0_15px_rgba(255,194,14,0.3)]">au Maroc.</span></h1><p class="text-lg md:text-xl text-neutral-600 dark:text-neutral-400 max-w-2xl mx-auto mb-10 leading-relaxed pointer-events-auto">Nous combinons la créativité avec des données orientées conversion et une IA haute fidélité pour produire à la demande des contenus de marque performants.</p></div></section><!--$?--><template id="B:0"></template><div class="flex items-center justify-center py-12"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-loader-circle animate-spin text-[#FFC20E]" aria-hidden="true"><path d="M21 12a9 9 0 1 1-6.219-8.56"></path></svg></div><!--/$--></main><!--$?--><template id="B:1"></template><!--/$--></div><!--$--><!--/$-->
1<script>requestAnimationFrame(function(){$RT=performance.now()});</script>
1<script src="/_next/static/immutable/chunks/2n5bv9p3-l876.js" id="_R_" async=""></script>
1<div hidden id="S:0"><section id="services" class="w-full py-20 md:py-32 bg-[#020202] py-32 relative overflow-hidden"><div class="max-w-7xl mx-auto px-4 md:px-8 w-full"><div class="absolute inset-0 bg-[url('https://grainy-gradients.vercel.app/noise.svg')] opacity-20 pointer-events-none mix-blend-overlay"></div><div class="absolute inset-0 z-0 opacity-[0.1]" style="background-image:linear-gradient(#1a1a1a 1px, transparent 1px), linear-gradient(90deg, #1a1a1a 1px, transparent 1px);background-size:40px 40px"></div><div class="absolute top-0 left-1/2 -translate-x-1/2 w-[800px] h-[500px] bg-[#FFC20E]/10 blur-[120px] rounded-full pointer-events-none"></div><div class="container mx-auto px-4 relative z-10"><div class="mb-20 text-center max-w-3xl mx-auto"><span class="inline-block py-1 px-3 rounded-full bg-[#FFC20E]/10 border border-[#FFC20E]/20 text-[#FFC20E] text-xs font-bold tracking-widest uppercase mb-4">Nos Expertises</span><h2 class="text-5xl md:text-7xl font-bold text-white mb-6 tracking-tight leading-tight">Solutions digitales<!-- --> <br/><span class="text-transparent bg-clip-text bg-gradient-to-r from-[#FFC20E] to-orange-500 animate-gradient">Next-Gen</span></h2><p class="text-neutral-400 text-lg md:text-xl font-light leading-relaxed">Une fusion parfaite entre design immersif et technologies de pointe pour propulser votre marque.</p></div><div class="grid grid-cols-1 md:grid-cols-4 gap-6 auto-rows-min"><div class="group relative rounded-[2rem] bg-[#0A0A0A]/80 backdrop-blur-md border border-white/5 overflow-hidden flex flex-col justify-between hover:border-[#FFC20E]/30 hover:shadow-[0_0_40px_-10px_rgba(255,194,14,0.3)] transition-all duration-500 md:col-span-2 md:row-span-2 min-h-[350px] md:min-h-[460px]" style="opacity:0;transform:translateY(20px)"><div class="absolute -top-20 -right-20 w-64 h-64 bg-[#FFC20E]/20 blur-[80px] rounded-full pointer-events-none group-hover:bg-[#FFC20E]/30 transition-colors duration-500"></div><div class="absolute -bottom-20 -left-20 w-64 h-64 bg-orange-600/10 blur-[80px] rounded-full pointer-events-none group-hover:bg-orange-600/20 transition-colors duration-500"></div><div class="absolute inset-0 flex items-center justify-center pointer-events-none z-0 opacity-100 mt-8"><img src="/services/production-audiovisuelle-maroc.webp" alt="Illustration Production Audiovisuelle par Zeplug" class="w-[85%] h-[85%] object-contain drop-shadow-[0_0_40px_rgba(255,194,14,0.3)] transform transition-transform duration-700 ease-in-out group-hover:scale-110 " loading="lazy" width="256" height="256"/></div><div class="relative z-10 p-8 flex flex-col h-full pointer-events-none"><div class="flex justify-between items-start mb-6"><div class="relative z-20"><div class="w-14 h-14 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-[#FFC20E] group-hover:text-black group-hover:bg-[#FFC20E] group-hover:border-[#FFC20E] transition-all duration-300 shadow-lg shadow-orange-900/10"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-video" aria-hidden="true"><path d="m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5"></path><rect x="2" y="6" width="14" height="12" rx="2"></rect></svg></div></div></div><div class="mt-auto pointer-events-auto"><h3 class="text-2xl font-bold text-white mb-3 tracking-tight group-hover:text-[#FFC20E] transition-colors">Production Audiovisuelle</h3><p class="text-neutral-400 text-sm leading-relaxed mb-6 line-clamp-3 group-hover:text-neutral-300 transition-colors">Réalisation de vidéos, reels, motion design et contenus animés pour dynamiser votre image de marque.</p></div></div></div><div class="group relative rounded-[2rem] bg-[#0A0A0A]/80 backdrop-blur-md border border-white/5 overflow-hidden flex flex-col justify-between hover:border-[#FFC20E]/30 hover:shadow-[0_0_40px_-10px_rgba(255,194,14,0.3)] transition-all duration-500 md:col-span-2 min-h-[220px]" style="opacity:0;transform:translateY(20px)"><div class="absolute -top-20 -right-20 w-64 h-64 bg-[#FFC20E]/20 blur-[80px] rounded-full pointer-events-none group-hover:bg-[#FFC20E]/30 transition-colors duration-500"></div><div class="absolute -bottom-20 -left-20 w-64 h-64 bg-orange-600/10 blur-[80px] rounded-full pointer-events-none group-hover:bg-orange-600/20 transition-colors duration-500"></div><div class="absolute inset-0 flex items-center justify-center pointer-events-none z-0 opacity-100 "><img src="/services/innovation-ia-video.webp" alt="Illustration IA Vidéo & Innovation par Zeplug" class="w-[85%] h-[85%] object-contain drop-shadow-[0_0_40px_rgba(255,194,14,0.3)] transform transition-transform duration-700 ease-in-out group-hover:scale-110 opacity-80 scale-125" loading="lazy" width="256" height="256"/></div><div class="relative z-10 p-8 flex flex-col h-full pointer-events-none"><div class="flex justify-between items-start mb-6"><div class="relative z-20">
1<div class="w-14 h-14 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-[#FFC20E] group-hover:text-black group-hover:bg-[#FFC20E] group-hover:border-[#FFC20E] transition-all duration-300 shadow-lg shadow-orange-900/10"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-megaphone" aria-hidden="true"><path d="M11 6a13 13 0 0 0 8.4-2.8A1 1 0 0 1 21 4v12a1 1 0 0 1-1.6.8A13 13 0 0 0 11 14H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2z"></path><path d="M6 14a12 12 0 0 0 2.4 7.2 2 2 0 0 0 3.2-2.4A8 8 0 0 1 10 14"></path><path d="M8 6v8"></path></svg></div></div></div><div class="mt-auto pointer-events-auto"><h3 class="text-2xl font-bold text-white mb-3 tracking-tight group-hover:text-[#FFC20E] transition-colors">IA Vidéo & Innovation</h3><p class="text-neutral-400 text-sm leading-relaxed mb-6 line-clamp-3 group-hover:text-neutral-300 transition-colors">Création et optimisation de campagnes Social Ads ultra-ciblées grâce à l'intelligence artificielle.</p></div></div></div><div class="group relative rounded-[2rem] bg-[#0A0A0A]/80 backdrop-blur-md border border-white/5 overflow-hidden flex flex-col justify-between hover:border-[#FFC20E]/30 hover:shadow-[0_0_40px_-10px_rgba(255,194,14,0.3)] transition-all duration-500 md:col-span-1 min-h-[220px]" style="opacity:0;transform:translateY(20px)"><div class="absolute -top-20 -right-20 w-64 h-64 bg-[#FFC20E]/20 blur-[80px] rounded-full pointer-events-none group-hover:bg-[#FFC20E]/30 transition-colors duration-500"></div><div class="absolute -bottom-20 -left-20 w-64 h-64 bg-orange-600/10 blur-[80px] rounded-full pointer-events-none group-hover:bg-orange-600/20 transition-colors duration-500"></div><div class="absolute inset-0 flex items-center justify-center pointer-events-none z-0 opacity-100 "><img src="/services/conception-ux-ui-design-zeplug.webp" alt="Illustration UX/UI Design par Zeplug" class="w-[85%] h-[85%] object-contain drop-shadow-[0_0_40px_rgba(255,194,14,0.3)] transform transition-transform duration-700 ease-in-out group-hover:scale-110 opacity-80 scale-125" loading="lazy" width="256" height="256"/></div><div class="relative z-10 p-8 flex flex-col h-full pointer-events-none"><div class="flex justify-between items-start mb-6"><div class="relative z-20"><div class="w-14 h-14 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-[#FFC20E] group-hover:text-black group-hover:bg-[#FFC20E] group-hover:border-[#FFC20E] transition-all duration-300 shadow-lg shadow-orange-900/10"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-panels-top-left" aria-hidden="true"><rect width="18" height="18" x="3" y="3" rx="2"></rect><path d="M3 9h18"></path><path d="M9 21V9"></path></svg></div></div></div><div class="mt-auto pointer-events-auto"><h3 class="text-2xl font-bold text-white mb-3 tracking-tight group-hover:text-[#FFC20E] transition-colors">UX/UI Design</h3><p class="text-neutral-400 text-sm leading-relaxed mb-6 line-clamp-3 group-hover:text-neutral-300 transition-colors">Architecture d'interfaces web et mobiles alliant esthétique premium et conversion maximale.</p></div></div></div><div class="group relative rounded-[2rem] bg-[#0A0A0A]/80 backdrop-blur-md border border-white/5 overflow-hidden flex flex-col justify-between hover:border-[#FFC20E]/30 hover:shadow-[0_0_40px_-10px_rgba(255,194,14,0.3)] transition-all duration-500 md:col-span-1 min-h-[220px]" style="opacity:0;transform:translateY(20px)"><div class="absolute -top-20 -right-20 w-64 h-64 bg-[#FFC20E]/20 blur-[80px] rounded-full pointer-events-none group-hover:bg-[#FFC20E]/30 transition-colors duration-500"></div><div class="absolute -bottom-20 -left-20 w-64 h-64 bg-orange-600/10 blur-[80px] rounded-full pointer-events-none group-hover:bg-orange-600/20 transition-colors duration-500"></div><div class="absolute inset-0 flex items-center justify-center pointer-events-none z-0 opacity-100 "><img src="/services/developpement-web-sur-mesure-maroc.webp" alt="Illustration Développement Web par Zeplug" class="w-[85%] h-[85%] object-contain drop-shadow-[0_0_40px_rgba(255,194,14,0.3)] transform transition-transform duration-700 ease-in-out group-hover:scale-110 opacity-80 scale-125" loading="lazy" width="256" height="256"/></div><div class="relative z-10 p-8 flex flex-col h-full pointer-events-none"><div class="flex justify-between items-start mb-6"><div class="relative z-20">
1<div class="w-14 h-14 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-[#FFC20E] group-hover:text-black group-hover:bg-[#FFC20E] group-hover:border-[#FFC20E] transition-all duration-300 shadow-lg shadow-orange-900/10"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe" aria-hidden="true"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg></div></div></div><div class="mt-auto pointer-events-auto"><h3 class="text-2xl font-bold text-white mb-3 tracking-tight group-hover:text-[#FFC20E] transition-colors">Développement Web</h3><p class="text-neutral-400 text-sm leading-relaxed mb-6 line-clamp-3 group-hover:text-neutral-300 transition-colors">Création, refonte et maintenance de sites web performants, vitrines ou e-commerce.</p></div></div></div><div class="group relative rounded-[2rem] bg-[#0A0A0A]/80 backdrop-blur-md border border-white/5 overflow-hidden flex flex-col justify-between hover:border-[#FFC20E]/30 hover:shadow-[0_0_40px_-10px_rgba(255,194,14,0.3)] transition-all duration-500 md:col-span-2 min-h-[220px]" style="opacity:0;transform:translateY(20px)"><div class="absolute -top-20 -right-20 w-64 h-64 bg-[#FFC20E]/20 blur-[80px] rounded-full pointer-events-none group-hover:bg-[#FFC20E]/30 transition-colors duration-500"></div><div class="absolute -bottom-20 -left-20 w-64 h-64 bg-orange-600/10 blur-[80px] rounded-full pointer-events-none group-hover:bg-orange-600/20 transition-colors duration-500"></div><div class="absolute inset-0 flex items-center justify-center pointer-events-none z-0 opacity-100 "><img src="/services/creation-design-graphique.webp" alt="Illustration Graphique Design par Zeplug" class="w-[85%] h-[85%] object-contain drop-shadow-[0_0_40px_rgba(255,194,14,0.3)] transform transition-transform duration-700 ease-in-out group-hover:scale-110 opacity-80 scale-125" loading="lazy" width="256" height="256"/></div><div class="relative z-10 p-8 flex flex-col h-full pointer-events-none"><div class="flex justify-between items-start mb-6"><div class="relative z-20"><div class="w-14 h-14 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-[#FFC20E] group-hover:text-black group-hover:bg-[#FFC20E] group-hover:border-[#FFC20E] transition-all duration-300 shadow-lg shadow-orange-900/10"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pen-tool" aria-hidden="true"><path d="M15.707 21.293a1 1 0 0 1-1.414 0l-1.586-1.586a1 1 0 0 1 0-1.414l5.586-5.586a1 1 0 0 1 1.414 0l1.586 1.586a1 1 0 0 1 0 1.414z"></path><path d="m18 13-1.375-6.874a1 1 0 0 0-.746-.776L3.235 2.028a1 1 0 0 0-1.207 1.207L5.35 15.879a1 1 0 0 0 .776.746L13 18"></path><path d="m2.3 2.3 7.286 7.286"></path><circle cx="11" cy="11" r="2"></circle></svg></div></div></div><div class="mt-auto pointer-events-auto"><h3 class="text-2xl font-bold text-white mb-3 tracking-tight group-hover:text-[#FFC20E] transition-colors">Graphique Design</h3><p class="text-neutral-400 text-sm leading-relaxed mb-6 line-clamp-3 group-hover:text-neutral-300 transition-colors">Conception de visuels percutants, direction artistique et contenus créatifs pour votre marque.</p></div></div></div><div class="group relative rounded-[2rem] bg-[#0A0A0A]/80 backdrop-blur-md border border-white/5 overflow-hidden flex flex-col justify-between hover:border-[#FFC20E]/30 hover:shadow-[0_0_40px_-10px_rgba(255,194,14,0.3)] transition-all duration-500 md:col-span-2 min-h-[220px]" style="opacity:0;transform:translateY(20px)"><div class="absolute -top-20 -right-20 w-64 h-64 bg-[#FFC20E]/20 blur-[80px] rounded-full pointer-events-none group-hover:bg-[#FFC20E]/30 transition-colors duration-500"></div><div class="absolute -bottom-20 -left-20 w-64 h-64 bg-orange-600/10 blur-[80px] rounded-full pointer-events-none group-hover:bg-orange-600/20 transition-colors duration-500"></div><div class="absolute inset-0 flex items-center justify-center pointer-events-none z-0 opacity-100 "><img src="/services/branding-identite-visuelle-logo.webp" alt="Illustration Branding & Logo par Zeplug" class="w-[85%] h-[85%] object-contain drop-shadow-[0_0_40px_rgba(255,194,14,0.3)] transform transition-transform duration-700 ease-in-out group-hover:scale-110 opacity-80 scale-125" loading="lazy" width="256" height="256"/></div><div class="relative z-10 p-8 flex flex-col h-full pointer-events-none"><div class="flex justify-between items-start mb-6"><div class="relative z-20">
1<div class="w-14 h-14 rounded-2xl bg-white/5 border border-white/10 flex items-center justify-center text-[#FFC20E] group-hover:text-black group-hover:bg-[#FFC20E] group-hover:border-[#FFC20E] transition-all duration-300 shadow-lg shadow-orange-900/10"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-layers" aria-hidden="true"><path d="M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83z"></path><path d="M2 12a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 12"></path><path d="M2 17a1 1 0 0 0 .58.91l8.6 3.91a2 2 0 0 0 1.65 0l8.58-3.9A1 1 0 0 0 22 17"></path></svg></div></div></div><div class="mt-auto pointer-events-auto"><h3 class="text-2xl font-bold text-white mb-3 tracking-tight group-hover:text-[#FFC20E] transition-colors">Branding & Logo</h3><p class="text-neutral-400 text-sm leading-relaxed mb-6 line-clamp-3 group-hover:text-neutral-300 transition-colors">Création d'identités visuelles complètes, logos sur-mesure et chartes graphiques mémorables.</p></div></div></div></div></div></div></section><section class="py-12 md:py-16 relative overflow-hidden bg-[#050505] text-white flex flex-col justify-center min-h-[90vh]"><div class="absolute top-0 left-1/2 -translate-x-1/2 w-full max-w-4xl h-96 bg-gradient-to-b from-[#FFC20E]/5 to-transparent blur-3xl pointer-events-none opacity-50"></div><div class="container mx-auto px-4 lg:px-6 relative z-10 max-w-7xl flex flex-col h-full"><div class="text-center max-w-3xl mx-auto mb-6"><div class="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-[#FFC20E]/10 border border-[#FFC20E]/20 text-[#FFC20E] text-xs font-semibold mb-4"><span class="w-1.5 h-1.5 rounded-full bg-[#FFC20E] animate-pulse"></span>Workflow Intelligent</div><h2 class="text-3xl md:text-4xl lg:text-5xl font-black font-heading tracking-tight mb-3">Un Moteur. Zéro Chaos.</h2><p class="text-base md:text-lg text-neutral-400">Remplacez les e-mails fragmentés et les agences lentes par une puissance d'exécution unifiée.</p></div><div class="flex justify-center mb-6 px-1 md:px-4 w-full"><div class="flex flex-nowrap justify-center gap-1 md:gap-2 p-1 md:p-1.5 bg-white/5 backdrop-blur-md rounded-2xl border border-white/10 shadow-xl w-full max-w-full overflow-hidden"><button class="relative px-2 sm:px-3 md:px-6 py-2 md:py-3 rounded-xl font-semibold transition-all duration-300 text-[11px] sm:text-xs md:text-base flex-1 flex items-center justify-center text-white"><div class="absolute inset-0 bg-[#FFC20E]/10 border border-[#FFC20E]/20 rounded-xl"></div><span class="relative z-10 block whitespace-nowrap">Magic Brief</span></button><button class="relative px-2 sm:px-3 md:px-6 py-2 md:py-3 rounded-xl font-semibold transition-all duration-300 text-[11px] sm:text-xs md:text-base flex-1 flex items-center justify-center text-neutral-500 hover:text-neutral-300 hover:bg-white/5"><span class="relative z-10 block whitespace-nowrap">Workspace</span></button><button class="relative px-2 sm:px-3 md:px-6 py-2 md:py-3 rounded-xl font-semibold transition-all duration-300 text-[11px] sm:text-xs md:text-base flex-1 flex items-center justify-center text-neutral-500 hover:text-neutral-300 hover:bg-white/5"><span class="relative z-10 block whitespace-nowrap">Moodboard</span></button><button class="relative px-2 sm:px-3 md:px-6 py-2 md:py-3 rounded-xl font-semibold transition-all duration-300 text-[11px] sm:text-xs md:text-base flex-1 flex items-center justify-center text-neutral-500 hover:text-neutral-300 hover:bg-white/5"><span class="relative z-10 block whitespace-nowrap">Brand Center</span></button></div></div><div class="flex flex-col items-center w-full mt-4 flex-grow"><div class="w-full flex flex-col items-center flex-grow" style="opacity:0;transform:translateY(15px)"><div class="text-center max-w-3xl mx-auto mb-6 px-4"><h3 class="text-2xl md:text-3xl font-bold font-heading mb-2 text-white hover:text-[#FFC20E] transition-colors">Moteur d'Idéation</h3><p class="text-lg text-neutral-400 leading-relaxed max-w-2xl mx-auto">L'idée brute devient une direction artistique en quelques secondes. Plus aucune page blanche.</p></div><div class="relative w-full max-w-[1240px] mx-auto px-2 lg:px-0 mt-auto flex-grow flex items-center justify-center"><div class="absolute inset-0 bg-gradient-to-tr from-[#FFC20E]/10 to-transparent blur-[60px] opacity-40 rounded-[2rem] pointer-events-none"></div><div class="relative w-full shadow-2xl max-h-[55vh] 2xl:max-h-[60vh] flex items-center justify-center"><video src="/services/Magic Brief.mp4" class="w-full h-full max-h-[55vh] 2xl:max-h-[60vh] object-contain rounded-2xl lg:rou
1nded-[1.5rem] aspect-video" autoPlay="" muted="" loop="" playsInline=""></video><div class="absolute inset-0 rounded-[2rem] border border-white/5 pointer-events-none shadow-[inset_0_0_50px_rgba(0,0,0,0.6)]"></div></div></div></div></div></div></section><section id="a-propos" class="py-24 bg-white dark:bg-black relative overflow-hidden"><div class="container mx-auto px-4 z-10 relative"><div class="text-center max-w-4xl mx-auto mb-16"><div class="flex items-center justify-center -space-x-4 mb-8" style="opacity:0;transform:translateY(10px)"><div class="w-16 h-16 rounded-full border-4 border-white dark:border-black overflow-hidden shadow-lg relative z-0 hover:z-10 transition-all duration-300 transform hover:scale-110"><img src="https://i.pravatar.cc/150?u=a042581f4e29026024d" alt="Membre équipe créative Zeplug" class="w-full h-full object-cover" loading="lazy" width="64" height="64"/></div><div class="w-16 h-16 rounded-full border-4 border-white dark:border-black overflow-hidden shadow-lg relative z-0 hover:z-10 transition-all duration-300 transform hover:scale-110"><img src="https://i.pravatar.cc/150?u=a042581f4e29026704d" alt="Membre équipe créative Zeplug" class="w-full h-full object-cover" loading="lazy" width="64" height="64"/></div><div class="w-16 h-16 rounded-full border-4 border-white dark:border-black overflow-hidden shadow-lg relative z-0 hover:z-10 transition-all duration-300 transform hover:scale-110"><img src="https://i.pravatar.cc/150?u=a04258114e29026302d" alt="Membre équipe créative Zeplug" class="w-full h-full object-cover" loading="lazy" width="64" height="64"/></div><div class="w-16 h-16 rounded-full border-4 border-white dark:border-black overflow-hidden shadow-lg relative z-0 hover:z-10 transition-all duration-300 transform hover:scale-110"><img src="https://i.pravatar.cc/150?u=a042581f4e29026703d" alt="Membre équipe créative Zeplug" class="w-full h-full object-cover" loading="lazy" width="64" height="64"/></div><div class="w-16 h-16 rounded-full border-4 border-white dark:border-black overflow-hidden shadow-lg relative z-0 hover:z-10 transition-all duration-300 transform hover:scale-110"><img src="https://i.pravatar.cc/150?u=a04258a2462d826712d" alt="Membre équipe créative Zeplug" class="w-full h-full object-cover" loading="lazy" width="64" height="64"/></div><div class="w-16 h-16 rounded-full border-4 border-white dark:border-black overflow-hidden shadow-lg relative z-0 hover:z-10 transition-all duration-300 transform hover:scale-110"><img src="https://i.pravatar.cc/150?u=a042581f4e29026704c" alt="Membre équipe créative Zeplug" class="w-full h-full object-cover" loading="lazy" width="64" height="64"/></div><div class="w-16 h-16 rounded-full border-4 border-white dark:border-black bg-neutral-100 dark:bg-neutral-800 flex items-center justify-center text-xs font-bold shadow-lg z-0 relative">+150</div></div><h2 class="text-4xl md:text-6xl font-bold font-heading mb-6 text-black dark:text-white leading-tight">N'embauchez pas. <!-- --> <span class="text-[#FFC20E]">Pluggez!</span></h2>
1<p class="text-xl text-neutral-600 dark:text-neutral-400 leading-relaxed max-w-2xl mx-auto">Pourquoi attendre ? Connectez votre projet à nos experts maintenant. Pas d'entretiens, pas de gestion, pas de délais. <!-- --> <span class="text-black dark:text-white font-semibold">Votre production démarre aujourd'hui.</span></p></div><div class="relative"><div class="overflow-x-auto pb-8 hide-scrollbar flex gap-4 px-4 snap-x snap-mandatory" style="scrollbar-width:none;-ms-overflow-style:none"><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/directeur-artistique-zeplug-casablanca.webp" alt="Photo profil Directeur Artistique â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Directeur Artistique</h3></div></div></div><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/community-manager-agence-maroc.webp" alt="Photo profil Community Manager â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Community Manager</h3></div></div></div><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/createur-de-contenu-maroc.webp" alt="Photo profil Créateur de Contenu â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Créateur de Contenu</h3></div></div></div><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/designer-creatif-casablanca.webp" alt="Photo profil Designer â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Designer</h3></div></div></div><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/developpeur-web-agence-maroc.webp" alt="Photo profil Développeur â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Développeur</h3></div></div></div><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/motion-designer-zeplug.webp" alt="Photo profil Motion Designer â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Motion Designer</h3></div></div></div><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/monteur-video-professionnel-maroc.webp" alt="Photo profil Monteur
1Vidéo â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Monteur Vidéo</h3></div></div></div><div class="snap-start shrink-0 first:pl-2"><div class="group relative rounded-2xl overflow-hidden w-[65vw] sm:w-[280px] max-w-[280px] h-[400px] flex-shrink-0 cursor-pointer shadow-lg hover:shadow-2xl transition-shadow duration-300 bg-neutral-900" style="opacity:0;transform:rotateY(90deg)"><img src="/services/videaste-production-zeplug.webp" alt="Photo profil Vidéaste â Ãquipe créative Zeplug" class="absolute inset-0 w-full h-full object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy" width="280" height="400"/><div class="absolute inset-0 bg-gradient-to-t from-black/80 via-black/20 to-transparent opacity-60 transition-opacity duration-300"></div><div class="absolute inset-x-0 bottom-0 p-6 z-10 translate-y-0 transition-transform duration-300"><h3 class="text-white font-bold text-2xl mb-1">Vidéaste</h3></div></div></div></div><div class="flex justify-center gap-4 mt-8"><button disabled="" class="w-14 h-14 rounded-full border border-neutral-300 dark:border-neutral-700 flex items-center justify-center transition-all group opacity-30 cursor-not-allowed" aria-label="Previous"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-left text-neutral-500 group-hover:text-black dark:group-hover:text-white transition-colors opacity-50" aria-hidden="true"><path d="m12 19-7-7 7-7"></path><path d="M19 12H5"></path></svg></button><button class="w-14 h-14 rounded-full border border-black dark:border-white flex items-center justify-center transition-all group hover:bg-neutral-100 dark:hover:bg-neutral-800 cursor-pointer" aria-label="Next"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right text-black dark:text-white group-hover:text-black dark:group-hover:text-white transition-colors" aria-hidden="true"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></button></div></div></div></section><section class="py-24 bg-white dark:bg-black relative overflow-hidden"><div class="container mx-auto px-4 z-10 relative"><div class="text-center max-w-4xl mx-auto mb-12" style="opacity:0;transform:translateY(20px)"><h2 class="text-4xl md:text-6xl font-bold font-heading mb-6 text-black dark:text-white leading-tight">Vos concurrents s'arrêtent le Vendredi.<!-- --> <span class="text-[#FFC20E]">Nous, on accélère.</span></h2>
1<p class="text-xl text-neutral-600 dark:text-neutral-400 leading-relaxed max-w-2xl mx-auto">Le monde n'attend plus le lundi matin. Nous avons structuré une machine de guerre asynchrone qui fonctionne pendant que votre équipe dort.</p></div><div class="relative max-w-5xl mx-auto rounded-3xl overflow-hidden shadow-2xl" style="opacity:0;transform:scale(0.95)"><div class="absolute bottom-8 left-1/2 -translate-x-1/2 z-20 bg-green-500 text-white px-6 py-3 rounded-full font-bold text-sm shadow-xl flex items-center gap-3 animate-pulse border-4 border-white dark:border-neutral-900 whitespace-nowrap"><span class="relative flex h-3 w-3"><span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-white opacity-75"></span><span class="relative inline-flex rounded-full h-3 w-3 bg-white"></span></span>En Ligne (Oui, même ce Weekend)</div><img src="/services/agence-digitale-7j-7-casablanca.webp" alt="Ãquipe créative Zeplug travaillant 7j/7 â agence active tous les jours" class="w-full h-auto object-cover" loading="lazy" width="800" height="500"/><div class="absolute inset-0 bg-gradient-to-t from-black/60 to-transparent pointer-events-none"></div></div></div></section><section class="w-full py-20 md:py-32 py-24 bg-[#050505] relative"><div class="max-w-7xl mx-auto px-4 md:px-8 w-full"><div class="absolute inset-0 overflow-hidden pointer-events-none"><div class="absolute top-0 left-1/2 -translate-x-1/2 w-[600px] h-[600px] bg-[#FFC20E]/5 blur-[120px] rounded-full"></div></div><div class="container mx-auto px-4 relative z-10"><div class="text-center max-w-4xl mx-auto mb-16 lg:mb-20"><h2 class="text-4xl md:text-5xl font-bold text-white mb-6 tracking-tight leading-tight">Le Vieux Monde vs.<!-- --> <span class="text-transparent bg-clip-text bg-gradient-to-r from-yellow-400 to-yellow-600">La Nouvelle Norme</span></h2><p class="text-neutral-400 text-lg md:text-xl font-light">Fini les factures surprises, les réunions inutiles et les équipes fragmentées. Voici comment la nouvelle norme écrase l'ancien système.</p></div><div class="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-8 items-stretch max-w-5xl mx-auto"><div class="w-full"><div class="relative p-8 rounded-[2rem] bg-zinc-900/50 border border-zinc-800 flex flex-col justify-center h-full hover:bg-zinc-900/80 transition-all duration-300 min-h-[450px]" style="opacity:0;transform:translateX(-20px)"><div class="flex items-center gap-5 mb-8"><div class="w-14 h-14 rounded-2xl bg-zinc-800/50 flex items-center justify-center text-zinc-500 shadow-inner border border-zinc-700/50"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-building2 lucide-building-2" aria-hidden="true"><path d="M10 12h4"></path><path d="M10 8h4"></path><path d="M14 21v-3a2 2 0 0 0-4 0v3"></path><path d="M6 10H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-2"></path><path d="M6 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16"></path></svg></div><h3 class="text-xl md:text-2xl font-bold text-zinc-500 leading-tight">Le Vieux Monde</h3></div><ul class="space-y-5 flex-1 flex flex-col justify-center"><li class="flex items-start gap-3 text-zinc-500 text-base md:text-lg font-medium group"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x text-red-900/50 group-hover:text-red-500 transition-colors shrink-0 mt-1" aria-hidden="true"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg><span class="group-hover:text-zinc-400 transition-colors">Facturation opaque à l'heure</span></li><li class="flex items-start gap-3 text-zinc-500 text-base md:text-lg font-medium group"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x text-red-900/50 group-hover:text-red-500 transition-colors shrink-0 mt-1" aria-hidden="true"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg><span class="group-hover:text-zinc-400 transition-colors">Abonnements inutiles multiples</span></li><li class="flex items-start gap-3 text-zinc-500 text-base md:text-lg font-medium group"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x text-red-900/50 group-hover:text-red-500 transition-colors shrink-0 mt-1" aria-hidden="true"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg><span class="group-hover:text-zinc-400 transition-colors">Frais cachés & devis instables</span></li><li class="flex items-start gap-3 text-zinc-500 text-base md:text-lg font-medium group"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x text-red-900/50 group-hover:text-red-500 transition-colors shrink-0 mt-1" aria-hidden="true"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg><span class="group-hover:text-zinc-400 transition-colors">Rétention de droits d'auteur</span></li><li class="flex items-start gap-3 text-zinc-500 text-base md:text-lg font-medium group"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x text-red-900/50 group-hover:text-red-500 transition-colors shrink-0 mt-1" aria-hidden="true"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg><span class="group-hover:text-zinc-400 transition-colors">Ãquipe éparpillée et lente</span></li></ul></div></div><div class="w-full group/card"><div class="relative p-8 rounded-[2rem] bg-black border border-[#FFC20E]/20 flex flex-col justify-center h-full overflow-hidden group/zeplug hover:border-[#FFC20E]/50 transition-colors duration-500 min-h-[450px]" style="opacity:0;transform:translateX(20px)"><div class="pointer-events-none absolute -inset-px rounded-[2rem] opacity-0 transition duration-300 group-hover/card:opacity-100" style="background:radial-gradient( 2 650px circle at 0px 0px, 3 rgba(255, 194, 14, 0.15), 4 transparent 80% 5 )"></div><div class="absolute inset-0 bg-[linear-gradient(to_bottom_right,rgba(255,194,14,0.05),transparent_40%)] pointer-events-none"></div><div class="flex items-center gap-5 mb-8 relative z-10">
5<div class="w-14 h-14 rounded-2xl bg-[#FFC20E]/10 flex items-center justify-center text-[#FFC20E] shadow-[0_0_20px_rgba(255,194,14,0.2)] border border-[#FFC20E]/20 group-hover/zeplug:scale-110 transition-transform duration-300"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="#FFC20E" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap" aria-hidden="true"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg></div><div><h3 class="text-xl md:text-2xl font-bold text-white leading-none mb-1 group-hover/zeplug:text-[#FFC20E] transition-colors duration-300">ZEPLUG</h3><span class="text-[#FFC20E] text-sm font-medium tracking-wide opacity-90">(Creative-as-a-Service)</span></div></div><ul class="space-y-5 flex-1 flex flex-col justify-center relative z-10"><li class="flex items-start gap-3 text-white text-base md:text-lg font-medium cursor-default p-2 rounded-lg hover:bg-[#FFC20E]/10 transition-colors" style="opacity:0;transform:translateX(20px)"><div class="mt-1 bg-[#FFC20E] rounded-full p-0.5 shrink-0 shadow-[0_0_10px_rgba(255,194,14,0.5)]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check text-black w-3 h-3" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></div><span class="group-hover:text-white transition-colors">Une seule facture transparente</span></li><li class="flex items-start gap-3 text-white text-base md:text-lg font-medium cursor-default p-2 rounded-lg hover:bg-[#FFC20E]/10 transition-colors" style="opacity:0;transform:translateX(20px)"><div class="mt-1 bg-[#FFC20E] rounded-full p-0.5 shrink-0 shadow-[0_0_10px_rgba(255,194,14,0.5)]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check text-black w-3 h-3" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></div><span class="group-hover:text-white transition-colors">Votre suite d'outils incluse</span></li><li class="flex items-start gap-3 text-white text-base md:text-lg font-medium cursor-default p-2 rounded-lg hover:bg-[#FFC20E]/10 transition-colors" style="opacity:0;transform:translateX(20px)"><div class="mt-1 bg-[#FFC20E] rounded-full p-0.5 shrink-0 shadow-[0_0_10px_rgba(255,194,14,0.5)]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check text-black w-3 h-3" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></div><span class="group-hover:text-white transition-colors">Un moteur unique et illimité</span></li><li class="flex items-start gap-3 text-white text-base md:text-lg font-medium cursor-default p-2 rounded-lg hover:bg-[#FFC20E]/10 transition-colors" style="opacity:0;transform:translateX(20px)"><div class="mt-1 bg-[#FFC20E] rounded-full p-0.5 shrink-0 shadow-[0_0_10px_rgba(255,194,14,0.5)]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check text-black w-3 h-3" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></div><span class="group-hover:text-white transition-colors">Vous possédez tout, à 100%</span></li><li class="flex items-start gap-3 text-white text-base md:text-lg font-medium cursor-default p-2 rounded-lg hover:bg-[#FFC20E]/10 transition-colors" style="opacity:0;transform:translateX(20px)"><div class="mt-1 bg-[#FFC20E] rounded-full p-0.5 shrink-0 shadow-[0_0_10px_rgba(255,194,14,0.5)]"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check text-black w-3 h-3" aria-hidden="true"><path d="M20 6 9 17l-5-5"></path></svg></div><span class="group-hover:text-white transition-colors">Exécution IA ultra-rapide</span></li></ul></div></div></div></div></div></section><section id="portfolio" class="w-full py-20 md:py-32 bg-neutral-100 dar
5k:bg-neutral-900/20"><div class="max-w-7xl mx-auto px-4 md:px-8 w-full"><div class="flex flex-col md:flex-row md:items-end justify-between mb-16 gap-6"><div><h2 class="text-3xl md:text-5xl font-bold font-heading mb-4 text-black dark:text-white">Projets<!-- --> <span class="text-[#FFC20E]">Sélectionnés</span></h2><p class="text-neutral-600 dark:text-neutral-400 max-w-lg">Une vitrine de nos projets les plus récents et impactants à travers diverses industries.</p></div><a href="#" class="flex items-center text-[#FFC20E] hover:text-black dark:hover:text-white transition-colors group">Voir tous les projets<!-- --> <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up-right ml-2 group-hover:translate-x-1 group-hover:-translate-y-1 transition-transform" aria-hidden="true"><path d="M7 7h10v10"></path><path d="M7 17 17 7"></path></svg></a></div><div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"><a href="/#portfolio" class="group relative rounded-xl overflow-hidden cursor-pointer shadow-lg dark:shadow-none block"><div class="aspect-[4/3] bg-neutral-200 dark:bg-neutral-800 overflow-hidden"><img src="https://picsum.photos/800/600?random=1" alt="Neon Horizon â Réalisation Zeplug" class="w-full h-full object-cover transform transition-transform duration-700 group-hover:scale-110" loading="lazy" width="400" height="300"/></div><div class="absolute inset-0 bg-black/80 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col items-center justify-center p-6 text-center backdrop-blur-sm"><span class="text-[#FFC20E] text-sm font-medium tracking-wider uppercase mb-2 transform translate-y-4 group-hover:translate-y-0 transition-transform duration-300 delay-75">Branding & Identité</span><h3 class="text-2xl font-bold font-heading text-white mb-6 transform translate-y-4 group-hover:translate-y-0 transition-transform duration-300 delay-100">Neon Horizon</h3><button class="px-6 py-2 rounded-full border border-[#FFC20E] text-[#FFC20E] hover:bg-[#FFC20E] hover:text-black transition-all duration-300 transform translate-y-4 group-hover:translate-y-0 delay-150">Voir l'Ãtude de Cas</button></div></a><a href="/#portfolio" class="group relative rounded-xl overflow-hidden cursor-pointer shadow-lg dark:shadow-none block"><div class="aspect-[4/3] bg-neutral-200 dark:bg-neutral-800 overflow-hidden"><img src="https://picsum.photos/800/600?random=2" alt="Flux Finance â Réalisation Zeplug" class="w-full h-full object-cover transform transition-transform duration-700 group-hover:scale-110" loading="lazy" width="400" height="300"/></div><div class="absolute inset-0 bg-black/80 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-col items-center justify-center p-6 text-center backdrop-blur-sm"><span class="text-[#FFC20E] text-sm font-medium tracking-wider uppercase mb-2 transform translate-y-4 group-hover:translate-y-0 transition-transform duration-300 delay-75">Design UI/UX</span><h3 class="text-2xl font-bold font-heading text-white mb-6 transform translate-y-4 group-hover:translate-y-0 transition-transform duration-300 delay-100">Flux Finance</h3><button class="px-6 py-2 rounded-full border border-[#FFC20E] text-[#FFC20E] hover:bg-[#FFC20E] hover:text-black transition-all duration-300 transform translate-y-4 group-hover:translate-y-0 delay-150">Voir l'Ãtude de Cas</button></div></a></div></div></section><div class="w-full bg-white dark:bg-black border-y border-neutral-200 dark:border-white/5 py-10 overflow-hidden relative transition-colors duration-300"><div class="absolute left-0 top-0 bottom-0 w-32 bg-gradient-to-r from-white dark:from-black to-transparent z-10 transition-colors duration-300"></div><div class="absolute right-0 top-0 bottom-0 w-32 bg-gradient-to-l from-white dark:from-black to-transparent z-10 transition-colors duration-300"></div><div class="flex w-[200%] animate-scroll hover:[animation-play-state:paused]"><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/linear.app" alt="Logo client Linear â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Linear</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/supabase.com" alt="Logo client Supabase â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Supabase</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/raycast.com" alt="Logo client Raycast â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Raycast</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/vercel.com" alt="Logo client Vercel â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Vercel</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/retool.com" alt="Logo client Retool â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Retool</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/algolia.com" alt="Logo client Algolia â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Algolia</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/contentful.com" alt="Logo client Contentful â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Contentful</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/framer.com" alt="Logo client Framer â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Framer</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/netlify.com" alt="Logo client Netlify â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Netlify</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/gatsbyjs.com" alt="Logo client Gatsby â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Gatsby</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/linear.app" alt="Logo client Linear â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Linear</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/supabase.com" alt="Logo client Supabase â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Supabase</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/raycast.com" alt="Logo client Raycast â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Raycast</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/vercel.com" alt="Logo client Vercel â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Vercel</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/retool.com" alt="Logo client Retool â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Retool</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/algolia.com" alt="Logo client Algolia â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Algolia</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/contentful.com" alt="Logo client Contentful â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Contentful</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/framer.com" alt="Logo client Framer â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Framer</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/netlify.com" alt="Logo client Netlify â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Netlify</span></div><div class="flex-shrink-0 w-[200px] flex items-center justify-center group cursor-pointer"><img src="https://logo.clearbit.com/gatsbyjs.com" alt="Logo client Gatsby â Partenaire Zeplug" class="h-8 md:h-12 object-contain grayscale opacity-50 group-hover:grayscale-0 group-hover:opacity-100 transition-all duration-300 drop-shadow-none group-hover:drop-shadow-[0_0_15px_rgba(255,255,255,0.3)]" loading="lazy" width="120" height="48"/><span class="hidden text-xl font-bold font-heading text-neutral-400 dark:text-neutral-600 transition-all duration-300">Gatsby</span></div></div></div><section id="pricing" class="w-full py-20 md:py-32 "><div class="max-w-7xl mx-auto px-4 md:px-8 w-full"><div class="text-center mb-12 max-w-4xl mx-auto"><div class="inline-block relative group w-full sm:w-auto"><div class="absolute -inset-1 bg-gradient-to-r from-[#FFC20E] to-yellow-600 rounded-3xl blur opacity-30 group-hover:opacity-70 transition duration-500"></div><button class="relative flex flex-col sm:flex-row items-center justify-center gap-4 w-full sm:w-auto px-6 sm:px-10 py-6 bg-black text-white rounded-3xl border border-yellow-500/30 font-bold text-xl md:text-2xl shadow-2xl overflow-hidden hover:scale-[1.02] transition-all duration-300"><div class="absolute inset-0 bg-gradient-to-r from-transparent via-white/10 to-transparent -translate-x-[200%] group-hover:animate-[shimmer_2s_infinite]"></div><
5div class="flex items-center gap-3"><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles text-[#FFC20E] animate-pulse shrink-0" aria-hidden="true"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg><span class="text-center">Besoin de sur-mesure ? Configurez votre offre</span></div><svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right text-[#FFC20E] group-hover:translate-x-2 transition-transform shrink-0 hidden sm:block" aria-hidden="true"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></button></div></div></div></section><section id="testimonials" class="w-full py-20 md:py-32 bg-gradient-to-b from-gray-50 to-gray-100 dark:from-black dark:to-neutral-900/50"><div class="max-w-7xl mx-auto px-4 md:px-8 w-full"><div class="text-center mb-16"><h2 class="text-3xl md:text-5xl font-bold font-heading mb-6 text-black dark:text-white">Témoignages<!-- --> <span class="text-[#FFC20E]">Clients</span></h2></div><div class="grid grid-cols-1 md:grid-cols-3 gap-8"><div class="bg-white dark:bg-black border border-neutral-200 dark:border-white/5 p-8 rounded-2xl relative group hover:border-[#FFC20E]/30 transition-colors duration-300 shadow-sm dark:shadow-none"><svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote absolute top-8 right-8 text-neutral-200 dark:text-neutral-800 group-hover:text-[#FFC20E]/20 transition-colors duration-300" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><div class="mb-6 relative z-10"><div class="flex gap-1 mb-4"><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span></div>
5<p class="text-neutral-600 dark:text-neutral-300 leading-relaxed text-lg">"<!-- -->Zeplug a transformé notre plateforme confuse en un chef-d'Åuvre élégant et convivial. Nos taux de conversion ont doublé du jour au lendemain.<!-- -->"</p></div><div class="border-t border-neutral-100 dark:border-white/5 pt-6"><p class="font-bold text-black dark:text-white text-lg">Elena Richardson</p><p class="text-[#FFC20E] text-sm">PDG, FinTech Nova</p></div></div><div class="bg-white dark:bg-black border border-neutral-200 dark:border-white/5 p-8 rounded-2xl relative group hover:border-[#FFC20E]/30 transition-colors duration-300 shadow-sm dark:shadow-none"><svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote absolute top-8 right-8 text-neutral-200 dark:text-neutral-800 group-hover:text-[#FFC20E]/20 transition-colors duration-300" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><div class="mb-6 relative z-10"><div class="flex gap-1 mb-4"><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span></div>
5<p class="text-neutral-600 dark:text-neutral-300 leading-relaxed text-lg">"<!-- -->L'attention aux détails de l'équipe et leur langage de design futuriste correspondaient parfaitement à notre vision pour l'outil IA de nouvelle génération.<!-- -->"</p></div><div class="border-t border-neutral-100 dark:border-white/5 pt-6"><p class="font-bold text-black dark:text-white text-lg">Marcus Chen</p><p class="text-[#FFC20E] text-sm">Responsable Produit, Neural Systems</p></div></div><div class="bg-white dark:bg-black border border-neutral-200 dark:border-white/5 p-8 rounded-2xl relative group hover:border-[#FFC20E]/30 transition-colors duration-300 shadow-sm dark:shadow-none"><svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-quote absolute top-8 right-8 text-neutral-200 dark:text-neutral-800 group-hover:text-[#FFC20E]/20 transition-colors duration-300" aria-hidden="true"><path d="M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path><path d="M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z"></path></svg><div class="mb-6 relative z-10"><div class="flex gap-1 mb-4"><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span><span class="text-[#FFC20E]">â
</span></div>
5<p class="text-neutral-600 dark:text-neutral-300 leading-relaxed text-lg">"<!-- -->Rapide, professionnel et incroyablement créatif. Ils n'ont pas seulement conçu un site web ; ils ont construit une expérience de marque.<!-- -->"</p></div><div class="border-t border-neutral-100 dark:border-white/5 pt-6"><p class="font-bold text-black dark:text-white text-lg">Sarah Jenkins</p><p class="text-[#FFC20E] text-sm">Fondatrice, Kinetic Apparel</p></div></div></div></div></section><section id="contact" class="w-full py-20 md:py-32 relative overflow-hidden"><div class="max-w-7xl mx-auto px-4 md:px-8 w-full"><div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[500px] h-[500px] bg-[#FFC20E] rounded-full mix-blend-multiply filter blur-[128px] opacity-10 dark:opacity-5 pointer-events-none"></div><div class="relative z-10 max-w-4xl mx-auto bg-white/80 dark:bg-neutral-900/80 backdrop-blur-lg border border-neutral-200 dark:border-white/5 p-8 md:p-12 rounded-3xl shadow-xl dark:shadow-none"><div class="text-center mb-10"><h2 class="text-3xl md:text-5xl font-bold font-heading mb-4 text-black dark:text-white">Construisons Quelque Chose de<!-- --> <span class="text-[#FFC20E]">Grand</span></h2>
5<p class="text-neutral-600 dark:text-neutral-400">Prêt à transformer votre présence numérique ? Envoyez-nous un message et discutons.</p></div><form class="space-y-6"><div class="grid grid-cols-1 md:grid-cols-2 gap-6"><div class="space-y-2"><label for="name" class="text-sm font-medium text-neutral-700 dark:text-neutral-300">Nom</label><input type="text" id="name" required="" placeholder="Jean Dupont" class="w-full bg-gray-50 dark:bg-black border border-neutral-300 dark:border-white/10 rounded-lg px-4 py-3 text-neutral-900 dark:text-white focus:outline-none focus:border-[#FFC20E] focus:ring-1 focus:ring-[#FFC20E] transition-all" name="name"/></div><div class="space-y-2"><label for="email" class="text-sm font-medium text-neutral-700 dark:text-neutral-300">Email</label><input type="email" id="email" required="" placeholder="[email protected]" class="w-full bg-gray-50 dark:bg-black border border-neutral-300 dark:border-white/10 rounded-lg px-4 py-3 text-neutral-900 dark:text-white focus:outline-none focus:border-[#FFC20E] focus:ring-1 focus:ring-[#FFC20E] transition-all" name="email"/></div></div><div class="space-y-2"><label for="message" class="text-sm font-medium text-neutral-700 dark:text-neutral-300">Message</label><textarea id="message" name="message" required="" rows="4" placeholder="Parlez-nous de votre projet..." class="w-full bg-gray-50 dark:bg-black border border-neutral-300 dark:border-white/10 rounded-lg px-4 py-3 text-neutral-900 dark:text-white focus:outline-none focus:border-[#FFC20E] focus:ring-1 focus:ring-[#FFC20E] transition-all"></textarea></div><div class="flex justify-center pt-4"><button class="inline-flex items-center justify-center px-6 py-3 rounded-full font-semibold transition-all duration-300 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[#FFC20E] focus:ring-offset-white dark:focus:ring-offset-black bg-[#FFC20E] text-black hover:bg-[#e0a800] hover:shadow-[0_0_15px_rgba(255,194,14,0.4)] w-full md:w-auto px-12 py-4 text-lg shadow-lg shadow-[#FFC20E]/20" type="submit">Envoyer le Message</button></div></form></div></div></section></div>
5<script>$RB=[];$RV=function(a){$RT=performance.now();for(var b=0;b<a.length;b+=2){var c=a[b],e=a[b+1];null!==e.parentNode&&e.parentNode.removeChild(e);var f=c.parentNode;if(f){var g=c.previousSibling,h=0;do{if(c&&8===c.nodeType){var d=c.data;if("/$"===d||"/&"===d)if(0===h)break;else h--;else"$"!==d&&"$?"!==d&&"$~"!==d&&"$!"!==d&&"&"!==d||h++}d=c.nextSibling;f.removeChild(c);c=d}while(c);for(;e.firstChild;)f.insertBefore(e.firstChild,c);g.data="$";g._reactRetry&&requestAnimationFrame(g._reactRetry)}}a.length=0}; 6$RC=function(a,b){if(b=document.getElementById(b))(a=document.getElementById(a))?(a.previousSibling.data="$~",$RB.push(a,b),2===$RB.length&&("number"!==typeof $RT?requestAnimationFrame($RV.bind(null,$RB)):(a=performance.now(),setTimeout($RV.bind(null,$RB),2300>a&&2E3<a?2300-a:$RT+300-a)))):b.parentNode.removeChild(b)};$RC("B:0","S:0")</script>
6<div hidden id="S:1"><footer class="bg-white dark:bg-black border-t border-neutral-200 dark:border-white/5 py-12 md:py-20 px-4 md:px-8 transition-colors duration-300"><div class="max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-12 gap-12 lg:gap-8"><div class="lg:col-span-3 space-y-6"><a href="/" class="inline-block"><img src="/services/zeplug-logo-dark.webp" alt="Logo Zeplug â Agence créative IA Maroc" class="h-8 md:h-10" width="120" height="40"/></a><p class="text-neutral-500 text-sm max-w-xs leading-relaxed">Forger des expériences numériques pour les marques de demain.</p><address class="not-italic text-sm text-neutral-600 dark:text-neutral-500 space-y-1 pt-2"><p>ZEPLUG SARL<!-- --> â <!-- -->45 Rue Abdelkader Mouftakar, N4</p><p>Casablanca</p><p class="pt-2"><a href="tel:+212635461718" class="hover:text-white transition-colors">+212 6 35 46 17 18</a> · <a href="mailto:[email protected]" class="hover:text-white transition-colors">[email protected]</a></p></address></div><div class="lg:col-span-4 lg:pl-8"><div class="grid grid-cols-2 sm:grid-cols-4 gap-y-6 gap-x-4"><a href="/services" class="text-neutral-400 hover:text-white transition-colors text-sm">Services</a><a href="/#portfolio" class="text-neutral-400 hover:text-white transition-colors text-sm">Réalisations</a><a href="/#a-propos" class="text-neutral-400 hover:text-white transition-colors text-sm">à propos</a><a href="/#pricing" class="text-neutral-400 hover:text-white transition-colors text-sm">Tarifs</a><a href="/contact" class="text-neutral-400 hover:text-white transition-colors text-sm">Contact</a><a href="/blog" class="text-neutral-400 hover:text-white transition-colors text-sm">Blog</a></div></div><nav aria-label="Nos services" class="lg:col-span-4 space-y-6"><p class="text-white font-medium text-sm">Nos services</p><ul class="grid grid-cols-1 sm:grid-cols-2 gap-y-4 gap-x-8 text-sm text-neutral-500"><li><a href="/services/production-video-casablanca" class="hover:text-white transition-colors">Production vidéo</a></li><li><a href="/services/photo-produit-maroc" class="hover:text-white transition-colors">Photo produit</a></li><li><a href="/services/identite-visuelle-branding" class="hover:text-white transition-colors">Design & identité visuelle</a></li><li><a href="/services/community-management-maroc" class="hover:text-white transition-colors">Community management</a></li><li><a href="/services/developpement-web-maroc" class="hover:text-white transition-colors">Développement web</a></li><li><a href="/services/ux-ui-design-maroc" class="hover:text-white transition-colors">UX/UI design</a></li><li><a href="/services/motion-design-maroc" class="hover:text-white transition-colors">Motion design</a></li><li><a href="/services/agence-seo-maroc" class="hover:text-white transition-colors">SEO</a></li></ul></nav><div class="lg:col-span-1 flex lg:justify-end items-start gap-4 pt-2 lg:pt-14"><a href="https://twitter.com/zeplug" target="_blank" rel="noopener noreferrer" class="text-neutral-500 hover:text-white transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-twitter" aria-hidden="true"><path d="M22 4s-.7 2.1-2 3.4c1.6 10-9.4 17.3-18 11.6 2.2.1 4.4-.6 6-2C3 15.5.5 9.6 3 5c2.2 2.6 5.6 4.1 9 4-.9-4.2 4-6.6 7-3.8 1.1 0 3-1.2 3-1.2z"></path></svg></a><a href="https://www.instagram.com/zeplug.ai/" target="_blank" rel="noopener noreferrer" class="text-neutral-500 hover:text-white transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-instagram" aria-hidden="true"><rect width="20" height="20" x="2" y="2" rx="5" ry="5"></rect><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path><line x1="17.5" x2="17.51" y1="6.5" y2="6.5"></line></svg></a><a href="https://www.linkedin.com/company/zeplug/" target="_blank" rel="noopener noreferrer" class="text-neutral-500 hover:text-white transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-linkedin" aria-hidden="true"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect width="4" height="12" x="2" y="9"></rect><circle cx="4" cy="4" r="2"></circle></svg></a><a href="https://www.facebook.com/zeplug/" target="_blank" rel="noopener noreferrer" class="text-neutral-500 hover:text-white transition-colors"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-facebook" aria-hidden="true"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg></a></div></div><div class="max-w-7xl mx-auto mt-16 pt-8 border-t border-neutral-200 dark:border-white/5 flex flex-col md:flex-row justify-between items-center text-sm text-neutral-600 dar
6k:text-neutral-600"><p>© <!-- -->2026<!-- --> Zeplug. <!-- -->Tous droits réservés.</p><div class="flex space-x-6 mt-4 md:mt-0"><a href="/mentions-legales#donnees-personnelles" class="hover:text-neutral-400">Politique de Confidentialité</a><a href="/mentions-legales" class="hover:text-neutral-400">Mentions légales</a></div></div></footer><div class="fixed bottom-6 right-6 z-50 group"><div class="w-14 h-14 bg-[#FFC20E] rounded-full flex items-center justify-center shadow-lg cursor-pointer hover:scale-110 transition-transform duration-300 relative overflow-hidden" tabindex="0"><div class="absolute inset-0 bg-gradient-to-r from-transparent via-white/30 to-transparent -translate-x-full group-hover:animate-shine pointer-events-none"></div><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-message-square text-black group-hover:rotate-12 transition-transform duration-300" aria-hidden="true"><path d="M22 17a2 2 0 0 1-2 2H6.828a2 2 0 0 0-1.414.586l-2.202 2.202A.71.71 0 0 1 2 21.286V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2z"></path></svg></div></div></div>
6<script>$RC("B:1","S:1")</script>
6<script>(self.__next_f=self.__next_f||[]).push([0])</script>
6<script>self.__next_f.push([1,"1:\"$Sreact.fragment\"\n2:I[39756,[\"/_next/static/immutable/chunks/31fuu0r8nbrxd.js\"],\"default\"]\n3:I[37457,[\"/_next/static/immutable/chunks/31fuu0r8nbrxd.js\"],\"default\"]\n9:I[68027,[],\"default\",1]\n:HL[\"/_next/static/immutable/chunks/2wwb431r9_89j.css\",\"style\"]\n:HL[\"/_next/static/immutable/chunks/380kg-a757my7.css\",\"style\"]\n:HL[\"/_next/static/immutable/media/1b99372b3eaef0c8-s.p.1ay-qk1u8nydy.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n:HL[\"/_next/static/immutable/media/83afe278b6a6bb3c-s.p.45535valc9rzk.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n4:T508,{\"@context\":\"https://schema.org\",\"@type\":[\"LocalBusiness\",\"ProfessionalService\"],\"@id\":\"https://zeplug.ai/#organization\",\"name\":\"Zeplug\",\"alternateName\":\"Zeplug.ai\",\"legalName\":\"ZEPLUG SARL\",\"identifier\":[{\"@type\":\"PropertyValue\",\"propertyID\":\"RC Casablanca\",\"value\":\"454037\"},{\"@type\":\"PropertyValue\",\"propertyID\":\"ICE\",\"value\":\"002363402000081\"}],\"description\":\"Agence créative IA à Casablanca : production vidéo, photo produit, design, branding, développement web et SEO sur abonnement.\",\"url\":\"https://zeplug.ai\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://zeplug.ai/services/zeplug-logo-light.webp\"},\"image\":\"https://zeplug.ai/og-image.png\",\"email\":\"[email protected]\",\"telephone\":\"+212635461718\",\"address\":{\"@type\":\"PostalAddress\",\"streetAddress\":\"45 Rue Abdelkader Mouftakar, N4\",\"addressLocality\":\"Casablanca\",\"addressRegion\":\"Casablanca-Settat\",\"addressCountry\":\"MA\"},\"geo\":{\"@type\":\"GeoCoordinates\",\"latitude\":33.5731,\"longitude\":-7.5898},\"areaServed\":[{\"@type\":\"City\",\"name\":\"Casablanca\"},{\"@type\":\"Country\",\"name\":\"Maroc\"}],\"priceRange\":\"4500 MAD - 9000 MAD / mois\",\"currenciesAccepted\":\"MAD\",\"foundingDate\":\"2024\",\"sameAs\":[\"https://www.instagram.com/zeplug.ai/\",\"https://www.linkedin.com/company/zeplug/\",\"https://www.facebook.com/zeplug/\",\"https://twitter.com/zeplug\"]}7:X\n0:{\"P\":null,\"c\":[\"\",\"\"],\"q\":\"\",\"i\":false,\"f\":[[[\"\",{\"children\":[\"(fr)\",{\"children\":[\"__PAGE__\",{},\"$undefined\",\"$undefined\",4608]},\"$undefined\",\"$undefined\",4624]},\"$undefined\",\"$undefined\",4624],[[\"$\",\"$1\",\"c\",{\"children\":[null,[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":404}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]]}],{\"children\":[[\"$\",\"$1\",\"c\",{\"children\":[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/immutable/chunks/2wwb431r9_89j.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"link\",\"1\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/immutable/chunks/380kg-a757my7.css\",\"precedence\":\"next\",\"crossOrigin\":\"$undefined\",\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/immutable/chunks/32c__9irwyfyx.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-1\",{\"src\":\"/_next/static/immutable/chunks/0xc9mjxmktz10.js\",\"async\":true,\"nonce\":\"$undefined\"}
6],[\"$\",\"script\",\"script-2\",{\"src\":\"/_next/static/immutable/chunks/1qhomylv4-i4r.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-3\",{\"src\":\"/_next/static/immutable/chunks/27dql0qugea-u.js\",\"async\":true,\"nonce\":\"$undefined\"}],[\"$\",\"script\",\"script-4\",{\"src\":\"/_next/static/immutable/chunks/3is9bhkuj0-bo.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"html\",null,{\"lang\":\"fr\",\"className\":\"scroll-smooth dark inter_b21886cc-module__H39p-a__variable outfit_c74927ed-module__BewnRq__variable\",\"children\":[[\"$\",\"head\",null,{\"children\":[[\"$\",\"link\",null,{\"rel\":\"icon\",\"type\":\"image/webp\",\"href\":\"/services/agence-creative-ia-maroc-icone.webp\"}],[\"$\",\"link\",null,{\"rel\":\"preconnect\",\"href\":\"https://nfpslhfjdmfgusnthmkg.supabase.co\",\"crossOrigin\":\"anonymous\"}],[\"$\",\"script\",null,{\"type\":\"application/ld+json\",\"dangerouslySetInnerHTML\":{\"__html\":\"$4\"}}]]}],\"$L5\"]}]]}],{\"children\":[\"$L6\",{},null,false,null]},null,false,null]},null,false,\"$7\"],\"$L8\",false]],\"m\":\"$undefined\",\"G\":[\"$9\",[]],\"S\":true,\"h\":null,\"r\":\"$undefined\",\"s\":\"$undefined\",\"a\":\"$undefined\",\"l\":\"$undefined\",\"p\":\"$undefined\",\"d\":\"$undefined\",\"b\":\"c0arsHqPebw_kiNuxIbqn\"}\na:I[96923,[\"/_next/static/immutable/chunks/32c__9irwyfyx.js\",\"/_next/static/immutable/chunks/0xc9mjxmktz10.js\",\"/_next/static/immutable/chunks/1qhomylv4-i4r.js\",\"/_next/static/immutable/chunks/27dql0qugea-u.js\",\"/_next/static/immutable/chunks/3is9bhkuj0-bo.js\"],\"Providers\"]\nb:I[79520,[\"/_next/static/immutable/chunks/32c__9irwyfyx.js\",\"/_next/static/immutable/chunks/0xc9mjxmktz10.js\",\"/_next/static/immutable/chunks/1qhomylv4-i4r.js\",\"/_next/static/immutable/chunks/27dql0qugea-u.js\",\"/_next/static/immutable/chunks/3is9bhkuj0-bo.js\"],\"\"]\nc:I[23571,[\"/_next/static/immutable/chunks/32c__9irwyfyx.js\",\"/_next/static/immutable/chunks/0xc9mjxmktz10.js\",\"/_next/static/immutable/chunks/1qhomylv4-i4r.js\",\"/_next/static/immutable/chunks/27dql0qugea-u.js\",\"/_next/static/immutable/chunks/3is9bhkuj0-bo.js\",\"/_next/static/immutable/chunks/4041q50gom64s.js\"],\"default\"]\nd:I[97367,[\"/_next/static/immutable/chunks/31fuu0r8nbrxd.js\"],\"OutletBoundary\"]\ne:\"$Sreact.suspense\"\n10:I[97367,[\"/_next/static/immutable/chunks/31fuu0r8nbrxd.js\"],\"ViewportBoundary\"]\n12:I[97367,[\"/_next/static/immutable/chunks/31fuu0r8nbrxd.js\"],\"MetadataBoundary\"]\n5:[\"$\",\"body\",null,{\"className\":\"min-h-screen bg-gray-50 dark:bg-[#050505] text-neutral-900 dark:text-white transition-colors duration-300 selection:bg-[#FFC20E] selection:text-black\",\"children\":[[\"$\",\"$La\",null,{\"children\":[\"$\",\"$L2\",null,{\"parallelRouterKey\":\"children\",\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"errorScripts\":\"$undefined\",\"template\":[\"$\",\"$L3\",null,{}],\"templateStyles\":\"$undefined\",\"templateScripts\":\"$undefined\",\"notFound\":[[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":\"$0:f:0:1:0:props:children:1:props:notFound:0:1:props:style\",\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":\"$0:f:0:1:0:props:children:1:props:notFound:0:1:props:children:props:children:1:props:style\",\"children\":404}],[\"$\",\"div\",null,{\"style\":\"$0:f:0:1:0:props:children:1:props:notFound:0:1:props:children:props:children:2:props:style\",\"children\":[\"$\",\"h2\",null,{\"style\":\"$0:f:0:1:0:props:children:1:props:notFound:0:1:props:children:props:children:2:props:children:props:style\",\"children\":\"This page could not be found.\"}]}]]}]}]],[]],\"forbidden\":\"$undefined\",\"unauthorized\":\"$undefined\"}]}],[\"$\",\"$Lb\",null,{\"src\":\"https://www.googletagmanager.com/gtag/js?i
6d=G-HLHZ9X5NNX\",\"strategy\":\"afterInteractive\"}],[\"$\",\"$Lb\",null,{\"id\":\"google-analytics\",\"strategy\":\"afterInteractive\",\"children\":\"\\n window.dataLayer = window.dataLayer || [];\\n function gtag(){dataLayer.push(arguments);}\\n gtag('js', new Date());\\n gtag('config', 'G-HLHZ9X5NNX');\\n \"}]]}]\n6:[\"$\",\"$1\",\"c\",{\"children\":[[\"$\",\"$Lc\",null,{}],[[\"$\",\"script\",\"script-0\",{\"src\":\"/_next/static/immutable/chunks/4041q50gom64s.js\",\"async\":true,\"nonce\":\"$undefined\"}]],[\"$\",\"$Ld\",null,{\"children\":[\"$\",\"$e\",null,{\"name\":\"Next.MetadataOutlet\",\"children\":\"$@f\"}]}]]}]\n8:[\"$\",\"$1\",\"h\",{\"children\":[null,[\"$\",\"$L10\",null,{\"children\":\"$L11\"}],[\"$\",\"div\",null,{\"hidden\":true,\"children\":[\"$\",\"$L12\",null,{\"children\":[\"$\",\"$e\",null,{\"name\":\"Next.Metadata\",\"children\":\"$L13\"}]}]}],[\"$\",\"meta\",null,{\"name\":\"next-size-adjust\",\"content\":\"\"}]]}]\n7:C\n11:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"meta\",\"1\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"2\",{\"name\":\"theme-color\",\"content\":\"#050505\"}]]\nf:null\n13:[[\"$\",\"title\",\"0\",{\"children\":\"Zeplug.ai â Agence Créative IA à Casablanca | Vidéo, Photo, Design\"}],[\"$\",\"meta\",\"1\",{\"name\":\"description\",\"content\":\"Zeplug est l'agence créative IA de Casablanca. Vidéo promotionnelle, photo produit, design graphique et contenu digital â sur abonnement, sans engagement.\"}],[\"$\",\"link\",\"2\",{\"rel\":\"canonical\",\"href\":\"https://zeplug.ai\"}],[\"$\",\"link\",\"3\",{\"rel\":\"alternate\",\"hrefLang\":\"fr-MA\",\"href\":\"https://zeplug.ai\"}],[\"$\",\"link\",\"4\",{\"rel\":\"alternate\",\"hrefLang\":\"en\",\"href\":\"https://zeplug.ai/en\"}],[\"$\",\"link\",\"5\",{\"rel\":\"alternate\",\"hrefLang\":\"x-default\",\"href\":\"https://zeplug.ai\"}],[\"$\",\"meta\",\"6\",{\"property\":\"og:title\",\"content\":\"Zeplug.ai â Votre Agence Créative IA au Maroc\"}],[\"$\",\"meta\",\"7\",{\"property\":\"og:description\",\"content\":\"Vidéo, Photo produit, Design et IA â l'agence créative de Casablanca sur abonnement.\"}],[\"$\",\"meta\",\"8\",{\"property\":\"og:url\",\"content\":\"https://zeplug.ai\"}],[\"$\",\"meta\",\"9\",{\"name\":\"twitter:card\",\"content\":\"summary_large_image\"}],[\"$\",\"meta\",\"10\",{\"name\":\"twitter:title\",\"content\":\"Zeplug.ai â Votre Agence Créative IA au Maroc\"}],[\"$\",\"meta\",\"11\",{\"name\":\"twitter:description\",\"content\":\"Vidéo, Photo produit, Design et IA â l'agence créative de Casablanca sur abonnement.\"}],[\"$\",\"meta\",\"12\",{\"name\":\"twitter:image\",\"content\":\"https://zeplug.ai/og-image.png\"}]]\n"])</script>
6</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.