import { a as __toESM } from "../_runtime.mjs";
import { t as faqs } from "./animation-SWHcO9P0.mjs";
import { n as require_react, r as require_jsx_runtime } from "../_libs/react+tanstack__react-query.mjs";
import { t as Section } from "./Section-DMbf0dne.mjs";
import { n as redirectToThankYou, t as portfolioItems } from "./redirect-thank-you-BiC9Z-_Q.mjs";
import { h as Link } from "../_libs/@tanstack/react-router+[...].mjs";
import { E as MessageCircle, G as ChevronDown, K as Check, S as PenTool, T as Minus, Y as ArrowRight, a as WandSparkles, b as Plus, d as Star, l as ThumbsUp, o as Video, t as Zap, x as Phone } from "../_libs/lucide-react.mjs";
//#region node_modules/.nitro/vite/services/ssr/assets/animation-CPxoQ9rT.js
var import_react = /* @__PURE__ */ __toESM(require_react());
var import_jsx_runtime = require_jsx_runtime();
var _2d_1_default = "/assets/2d-1-CHXp-uaM.gif";
var _2d_8_default = "/assets/2d-8-BsHeOOh0.gif";
var gif_video_2_default = "/assets/gif-video-2-Bjst0XFj.gif";
var _3d_vid_7_default = "/assets/3d-vid-7-BN-Pw5m1.mp4";
var _3d_vid_8_default = "/assets/3d-vid-8-uRxHD7B8.mp4";
var ai_animation_default = "/assets/ai-animation-C2GqxBSY.mp4";
var ai_vid_1_default = "/assets/ai-vid-1-iIi-iWgF.mp4";
var ai_vid_2_default = "/assets/ai-vid-2-3eUpNJNk.mp4";
var ai_vid_3_default = "/assets/ai-vid-3-CaZlkm94.mp4";
var ai_vid_4_default = "/assets/ai-vid-4-C2rj-bos.mp4";
var ai_vid_5_default = "/assets/ai-vid-5-Bx38zMHp.mp4";
var ai_vid_6_default = "/assets/ai-vid-6-OXAPf3a2.mp4";
var ai_vid_7_default = "/assets/ai-vid-7-DLEYeG2M.mp4";
var ai_vid_8_default = "/assets/ai-vid-8-BpRM8AfQ.mp4";
var choose_character_default = "/assets/choose-character-CEYo4A8J.png";
var _3d_vid_1_default = "/assets/3d-vid-1-BO0reONl.mp4";
var _3d_vid_2_default = "/assets/3d-vid-2-Bfb1ir3G.mp4";
var _3d_vid_3_default = "/assets/3d-vid-3-Cv0CLgh_.mp4";
var _3d_vid_4_default = "/assets/3d-vid-4-BGChGnns.mp4";
var _3d_vid_5_default = "/assets/3d-vid-5-DusVOUrP.mp4";
var _3d_vid_6_default = "/assets/3d-vid-6-CrJdHEm3.mp4";
var _2d_vid_1_default = "/assets/2d-vid-1-D-ogc37i.mp4";
var _2d_vid_2_default = "/assets/2d-vid-2-BDGqEeB_.mp4";
var _2d_vid_3_default = "/assets/2d-vid-3-DLhN-A16.mp4";
var _2d_vid_4_default = "/assets/2d-vid-4-CdF83O-2.mp4";
var _2d_vid_5_default = "/assets/2d-vid-5-tInrKLJ0.mp4";
var _2d_vid_6_default = "/assets/2d-vid-6-CV6aaz8A.mp4";
var asmr_default = "/assets/asmr-CLvk5LIM.jpg";
var texture_default = "/assets/texture-DmjgRnwY.jpg";
var ugc_default = "/assets/ugc-biSjCXAc.jpg";
var recipe_default = "/assets/recipe-r4njttXv.jpg";
var avatar_default = "/assets/avatar-CI9zlfIe.jpg";
var walkthrough_default = "/assets/walkthrough-vn-ZwfCC.jpg";
var process_1_default = "/assets/process-1-dVwE4qtl.gif";
var process_2_default = "/assets/process-2-CSl-mfrW.gif";
var process_3_default = "/assets/process-3-u-w92Tbg.gif";
var process_4_default = "/assets/process-4-Dd2-EWwY.gif";
var aiVideos = [
	ai_vid_1_default,
	ai_vid_2_default,
	ai_vid_3_default,
	ai_vid_4_default,
	ai_vid_5_default,
	ai_vid_6_default,
	ai_vid_7_default,
	ai_vid_8_default
];
var threeDVideos = [
	_3d_vid_1_default,
	_3d_vid_2_default,
	_3d_vid_3_default,
	_3d_vid_4_default,
	_3d_vid_5_default,
	_3d_vid_6_default
];
var twoDVideos = [
	_2d_vid_1_default,
	_2d_vid_2_default,
	_2d_vid_3_default,
	_2d_vid_4_default,
	_2d_vid_5_default,
	_2d_vid_6_default
];
function AnimationPage() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Hero, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TwoDStudio, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ThreeDEngage, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AIAnimation, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CustomServices, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Pricing, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(PortfolioSamples, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(WhyChoose, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(FreeConsultCTA, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Process, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Testimonials, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(FAQs, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ContactForm, {}),
		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(FinalCTA, {})
	] });
}
function Hero() {
	const COUNTRY_CODE = "+1";
	const [phone, setPhone] = (0, import_react.useState)("");
	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
		className: "relative overflow-hidden bg-gradient-to-b from-[oklch(0.98_0.01_300)] via-background to-background",
		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "mx-auto grid max-w-7xl gap-10 px-4 pt-16 pb-12 md:grid-cols-2 md:items-center md:px-6 md:pt-24",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "text-sm font-semibold uppercase tracking-widest text-brand",
					children: "Professional Explainer Videos"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h1", {
					className: "mt-4 font-display text-4xl font-bold leading-[1.05] md:text-5xl lg:text-6xl",
					children: [
						"Every Second Sells.",
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("br", {}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
							className: "text-brand",
							children: "Every Explainer Animation"
						}),
						" Converts."
					]
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", {
					className: "mt-6 space-y-3 text-sm md:text-base",
					children: [
						"Transform Any Complex Idea Into a 60-Second Explainer Animation",
						"One Animator. Your Brand. Zero Compromises.",
						"Revise Until It's Perfect — No Limits, No Extra Charges"
					].map((t) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", {
						className: "flex items-start gap-2",
						children: [
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Check, { className: "mt-1 h-4 w-4 shrink-0 text-brand" }),
							" ",
							t
						]
					}, t))
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "mt-6 flex flex-wrap gap-3",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
						href: "tel:+18883917298",
						className: "rounded-lg bg-brand px-5 py-2.5 text-sm font-semibold text-brand-foreground shadow",
						children: "Request a Quote"
					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
						href: "#chat",
						className: "inline-flex items-center gap-2 rounded-lg border border-border bg-card px-5 py-2.5 text-sm font-semibold",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MessageCircle, { className: "h-4 w-4" }), " Live Chat 🚀"]
					})]
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
					className: "mt-6 text-sm font-semibold",
					children: [
						"We are rated 4.8 ",
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
							className: "inline-flex align-middle text-alert",
							children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Star, { className: "h-3.5 w-3.5 fill-current" }, i))
						}),
						" Among 50,000+ Happy Clients"
					]
				})
			] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "overflow-hidden rounded-2xl bg-brand shadow-2xl",
				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "bg-highlight px-6 py-4 text-center text-highlight-foreground",
					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "font-display text-lg font-bold uppercase tracking-wide",
						children: "GET STARTED NOW!"
					})
				}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "p-6 text-white",
					children: [
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
							className: "text-sm font-semibold uppercase tracking-wider text-white/80",
							children: "High Conversion Explainer Videos for"
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
							className: "mt-1 font-display text-2xl font-bold",
							children: "AI, SaaS and Tech Brands"
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", {
							className: "mt-5 space-y-3",
							onSubmit: (e) => {
								e.preventDefault();
								redirectToThankYou(e.currentTarget);
							},
							children: [
								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
									required: true,
									name: "name",
									placeholder: "Full Name",
									className: "w-full rounded-md bg-white px-4 py-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight"
								}),
								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
									required: true,
									name: "email",
									type: "email",
									placeholder: "Email Address",
									className: "w-full rounded-md bg-white px-4 py-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight"
								}),
								/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
									className: "relative",
									children: [
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
											className: "absolute left-3 top-1/2 -translate-y-1/2 text-sm font-semibold text-foreground",
											children: COUNTRY_CODE
										}),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
											type: "hidden",
											name: "phone",
											value: COUNTRY_CODE + phone
										}),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
											required: true,
											type: "tel",
											value: phone,
											onChange: (e) => setPhone(e.target.value.replace(/\D/g, "")),
											placeholder: "Phone Number",
											className: "w-full rounded-md bg-white py-3 pl-10 pr-4 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight"
										})
									]
								}),
								/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", {
									className: "w-full rounded-md bg-white px-4 py-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight",
									children: [
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "What type of Explainer Videos do you plan?" }),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "2D Animation" }),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "3D Animation" }),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "Whiteboard Animation" }),
										/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "Motion Graphics" })
									]
								}),
								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
									className: "w-full rounded-md bg-highlight px-6 py-3 text-sm font-bold uppercase tracking-wider text-highlight-foreground shadow-lg",
									children: "Get a FREE Quote"
								})
							]
						})
					]
				})]
			})]
		})
	});
}
function TwoDStudio() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
		className: "mx-auto max-w-7xl px-4 py-20 md:px-6",
		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "grid gap-10 md:grid-cols-2 md:items-center",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "relative aspect-video overflow-hidden rounded-3xl bg-black shadow-2xl",
				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
					src: _2d_1_default,
					alt: "2D animation sample",
					className: "absolute inset-0 h-full w-full object-cover"
				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "absolute bottom-6 left-6 rounded-full bg-black/50 px-4 py-2 text-xs font-semibold text-white backdrop-blur",
					children: "2D Sample"
				})]
			}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
					className: "inline-flex items-center gap-2 rounded bg-highlight px-2.5 py-1 text-[10px] font-bold uppercase tracking-wider text-highlight-foreground",
					children: "2D Animation"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
					className: "mt-3 font-display text-3xl font-bold md:text-4xl",
					children: "A Creative 2D Animation Studio That Tells Stories With Heart"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "mt-4 text-sm text-muted-foreground md:text-base",
					children: "With our 2D animation expertise, your ideas are transformed into visually engaging stories that connect and convert. Each video we create is designed to hold attention."
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "mt-3 text-sm text-muted-foreground md:text-base",
					children: "At Wix Web Support, our seasoned 2D animators combine artistic flair with strategic storytelling to deliver animations that do more than just look good — they communicate. Every frame is built with purpose."
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "mt-6 flex flex-wrap gap-3",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
						href: "tel:+18883917298",
						className: "rounded-lg bg-brand px-5 py-2.5 text-sm font-semibold text-brand-foreground shadow",
						children: "Request a Quote 🙌"
					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
						href: "#chat",
						className: "inline-flex items-center gap-2 rounded-lg border border-border bg-card px-5 py-2.5 text-sm font-semibold",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MessageCircle, { className: "h-4 w-4" }), " Live Chat"]
					})]
				})
			] })]
		})
	});
}
function ThreeDEngage() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
		className: "bg-[oklch(0.97_0.01_85)] py-20",
		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "mx-auto grid max-w-7xl gap-10 px-4 md:grid-cols-2 md:items-center md:px-6",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "order-2 md:order-1",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
						className: "inline-flex items-center gap-2 rounded bg-alert px-2.5 py-1 text-[10px] font-bold uppercase tracking-wider text-alert-foreground",
						children: "3D Animation"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
						className: "mt-3 font-display text-3xl font-bold md:text-4xl",
						children: "Engage Your Viewers Through Dynamic 3D Animation"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "mt-4 text-sm text-muted-foreground md:text-base",
						children: "At Wix Web Support, we've built a passionate team of creative professionals who know how to turn concepts into captivating 3D visual experiences. Whether it's introducing your brand, explaining a service, or showcasing a product, we craft 3D animations that elevate your story."
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "mt-3 text-sm text-muted-foreground md:text-base",
						children: "Our approach blends creativity with precision, delivering polished, high-quality 3D videos that move your brand forward."
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
						className: "mt-6 flex flex-wrap gap-3",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
							href: "tel:+18883917298",
							className: "rounded-lg bg-brand px-5 py-2.5 text-sm font-semibold text-brand-foreground shadow",
							children: "Request a Quote"
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
							href: "#chat",
							className: "inline-flex items-center gap-2 rounded-lg border border-border bg-card px-5 py-2.5 text-sm font-semibold",
							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MessageCircle, { className: "h-4 w-4" }), " Live Chat 🚀"]
						})]
					})
				]
			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "order-1 grid grid-cols-2 gap-4 md:order-2",
				children: [
					{
						type: "media",
						src: gif_video_2_default,
						grad: "from-deep via-brand to-highlight"
					},
					{
						type: "media",
						src: _2d_8_default,
						grad: "from-alert via-pink-500 to-fuchsia-600"
					},
					{
						type: "video",
						src: _3d_vid_7_default,
						grad: "from-emerald-500 via-teal-600 to-brand"
					},
					{
						type: "video",
						src: _3d_vid_8_default,
						grad: "from-orange-500 via-amber-500 to-highlight"
					}
				].map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: `relative aspect-square overflow-hidden rounded-2xl bg-gradient-to-br ${item.grad} shadow-xl`,
					children: item.type === "media" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
						src: item.src,
						alt: "Animation sample",
						className: "absolute inset-0 h-full w-full object-cover"
					}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("video", {
						src: item.src,
						autoPlay: true,
						loop: true,
						muted: true,
						playsInline: true,
						className: "absolute inset-0 h-full w-full object-cover"
					})
				}, i))
			})]
		})
	});
}
function AIAnimation() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "relative overflow-hidden bg-deep py-20 text-deep-foreground",
		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pointer-events-none absolute inset-0 bg-[radial-gradient(circle_at_20%_30%,_rgba(255,193,7,0.2),_transparent_50%),radial-gradient(circle_at_80%_70%,_rgba(226,78,66,0.25),_transparent_50%)]" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "relative mx-auto grid max-w-7xl gap-10 px-4 md:grid-cols-2 md:items-center md:px-6",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
					className: "inline-flex items-center gap-2 rounded bg-highlight px-2.5 py-1 text-[10px] font-bold uppercase tracking-wider text-highlight-foreground",
					children: "AI Animation"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
					className: "mt-3 font-display text-3xl font-bold md:text-4xl",
					children: "AI-Powered Animation Services That Bring Your Brand to Life"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "mt-4 text-sm text-white/85 md:text-base",
					children: "We combine the power of artificial intelligence with human creativity to deliver animations that are faster, smarter, and more impactful. Every frame is crafted with AI-driven precision."
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "mt-3 text-sm text-white/85 md:text-base",
					children: "Faster turnaround, sharper visuals, and storytelling that hits harder — all powered by the future of animation."
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "mt-6 flex flex-wrap gap-3",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
						href: "tel:+18883917298",
						className: "rounded-lg bg-highlight px-5 py-2.5 text-sm font-bold uppercase tracking-wider text-highlight-foreground shadow",
						children: "LETS GET STARTED 🙌"
					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
						href: "#chat",
						className: "inline-flex items-center gap-2 rounded-lg border border-white/30 bg-white/10 px-5 py-2.5 text-sm font-semibold text-white",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MessageCircle, { className: "h-4 w-4" }), " Live Chat"]
					})]
				})
			] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "relative",
				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "relative aspect-video overflow-hidden rounded-3xl bg-black shadow-2xl ring-1 ring-white/10",
					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("video", {
						src: ai_animation_default,
						autoPlay: true,
						muted: true,
						loop: true,
						playsInline: true,
						className: "absolute inset-0 h-full w-full object-cover"
					})
				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "mt-6 grid grid-cols-2 gap-3 sm:grid-cols-4",
					children: aiVideos.map((v, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
						className: "relative aspect-square overflow-hidden rounded-xl bg-black shadow-lg ring-1 ring-white/10 transition hover:scale-105",
						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("video", {
							src: v.url,
							autoPlay: true,
							muted: true,
							loop: true,
							playsInline: true,
							className: "absolute inset-0 h-full w-full object-cover"
						})
					}, i))
				})]
			})]
		})]
	});
}
var customServices = [
	{
		image: asmr_default,
		title: "ASMR Aesthetic Demos",
		desc: "Slow down, breathe, and let your product speak in the most satisfying way possible. Our ASMR-style demos pair soothing visuals and sound design to create an experience your audience won't just watch — they'll feel."
	},
	{
		image: texture_default,
		title: "Texture Macros Services",
		desc: "Get up close and let the details do the talking. Our texture macro videos capture the tactile beauty of your product in stunning, high-definition intimacy that builds instant trust and desire."
	},
	{
		image: ugc_default,
		title: "AI UGC Services",
		desc: "Authentic-looking content, produced at scale — without the logistical headache of traditional creators. Our AI-powered UGC delivers the raw, relatable feel audiences trust."
	},
	{
		image: recipe_default,
		title: "The Animated Recipe",
		desc: "Turn your process, product, or story into a frame-by-frame visual journey that's as delightful to watch as it is to share. Animated recipes make complex ideas feel effortless."
	},
	{
		image: avatar_default,
		title: "Micro-Expression Avatar Testimonials",
		desc: "Real emotion, rendered digitally — avatars that blink, pause, and react just like your happiest customers would. Bring credibility and warmth to your brand without a camera in sight."
	},
	{
		image: walkthrough_default,
		title: "Step-by-Step Sensory Walkthroughs",
		desc: "Guide your audience through every detail with walkthroughs designed to engage all the senses — not just the eyes. Each step is crafted to build confidence and move viewers closer to yes."
	}
];
function CustomServices() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "mx-auto max-w-7xl px-4 py-20 md:px-6",
		children: [
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "mb-12 text-center",
				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "text-sm font-semibold uppercase tracking-widest text-brand",
					children: "Innovate Your Business Look With"
				}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h2", {
					className: "mt-3 font-display text-3xl font-bold md:text-4xl",
					children: [
						"Customized Explainer Video",
						" ",
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
							className: "bg-gradient-to-r from-fuchsia-500 to-purple-600 bg-clip-text text-transparent",
							children: "Animation Service"
						})
					]
				})]
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "grid gap-6 sm:grid-cols-2 lg:grid-cols-3",
				children: customServices.map((f) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "group relative overflow-hidden rounded-2xl border border-border bg-card shadow-sm transition hover:-translate-y-1 hover:shadow-xl",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
						className: "overflow-hidden",
						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
							src: f.image,
							alt: f.title,
							loading: "lazy",
							width: 800,
							height: 600,
							className: "h-52 w-full object-cover transition-transform duration-500 group-hover:scale-105"
						})
					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
						className: "p-6",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
							className: "font-semibold",
							children: f.title
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
							className: "mt-2 text-sm text-muted-foreground",
							children: f.desc
						})]
					})]
				}, f.title))
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "mt-10 flex flex-wrap justify-center gap-3",
				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
					href: "tel:+18883917298",
					className: "rounded-lg bg-brand px-5 py-2.5 text-sm font-semibold text-brand-foreground shadow",
					children: "Request a Quote"
				}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
					href: "#chat",
					className: "inline-flex items-center gap-2 rounded-lg border border-border bg-card px-5 py-2.5 text-sm font-semibold",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MessageCircle, { className: "h-4 w-4" }), " Live Chat 🚀"]
				})]
			})
		]
	});
}
var tiers = [
	{
		name: "Video Basic",
		price: 159,
		tagline: "Text & Image Compilation",
		features: [
			"30 Seconds Duration",
			"Professional Voice-over & SFX",
			"Script Writing",
			"Hand-drawn Illustrations",
			"Unlimited Revisions",
			"HD Format Video",
			"Brand Color Integration",
			"Social Media Optimized Format",
			"MP4 & MOV File Delivery"
		]
	},
	{
		name: "Video Plus",
		price: 499,
		tagline: "Ultimate 2D Animation",
		featured: true,
		features: [
			"30 Seconds Duration",
			"Professional Voice-over & SFX",
			"Script Writing",
			"Custom 2D Character Animation",
			"Unlimited Revisions",
			"Full HD 1080p Format Video",
			"Storyboard & Concept Development",
			"Social Media & Web Optimized",
			"MP4, MOV & GIF File Delivery"
		]
	},
	{
		name: "Video Classic",
		price: 799,
		tagline: "AI-Powered 3D Animation",
		sale: true,
		features: [
			"30 Seconds Duration",
			"Professional Voice-over & SFX",
			"Script Writing",
			"AI-Enhanced 3D Character",
			"Advanced Motion Graphics & VFX",
			"Unlimited Revisions",
			"4K Ultra HD Format Video",
			"Storyboard & Concept Development",
			"Priority Delivery & Dedicated Manager"
		]
	}
];
function Pricing() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
		className: "bg-[oklch(0.98_0.01_240)] py-20",
		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "mx-auto max-w-7xl px-4 md:px-6",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "mb-12 text-center",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "text-sm font-semibold uppercase tracking-widest text-brand",
						children: "Pricing"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
						className: "mt-3 font-display text-3xl font-bold md:text-4xl",
						children: "Customized Explainer Video Packages For Every Brand"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "mx-auto mt-3 max-w-2xl text-sm text-muted-foreground",
						children: "Explore our flexible pricing options and choose the plan that fits your creative goals and budget perfectly."
					})
				]
			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "grid gap-6 md:grid-cols-3",
				children: tiers.map((t) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: `relative rounded-3xl border bg-card p-8 ${t.featured ? "border-brand shadow-2xl md:-translate-y-3" : "border-border"}`,
					children: [
						t.sale && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
							className: "absolute -top-3 right-6 rotate-3 rounded-full bg-alert px-4 py-1.5 text-xs font-bold uppercase tracking-wider text-alert-foreground shadow-lg",
							children: "Sale · 70% OFF"
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
							className: "font-display text-xl font-bold",
							children: t.name
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
							className: "mt-4 font-display text-5xl font-bold",
							children: [
								"$",
								t.price,
								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
									className: "text-base font-medium text-muted-foreground",
									children: "/video"
								})
							]
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
							className: "mt-1 text-sm font-semibold text-brand",
							children: t.tagline
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
							className: "mt-6 text-xs font-bold uppercase tracking-wider text-muted-foreground",
							children: "Plan Includes:"
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", {
							className: "mt-3 space-y-2.5 text-sm",
							children: t.features.map((f) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", {
								className: "flex items-start gap-2",
								children: [
									/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Check, { className: "mt-0.5 h-4 w-4 shrink-0 text-brand" }),
									" ",
									f
								]
							}, f))
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
							href: "tel:+18883917298",
							className: `mt-8 inline-flex w-full items-center justify-center gap-2 rounded-full px-6 py-3 text-sm font-semibold transition ${t.featured ? "bg-brand text-brand-foreground hover:opacity-90" : "border border-border hover:border-brand hover:text-brand"}`,
							children: ["Get in Touch ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Plus, { className: "h-4 w-4" })]
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
							className: "mt-4 space-y-1 text-center text-xs text-muted-foreground",
							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: ["Speak With Us ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
								href: "tel:+18883917298",
								className: "font-bold text-foreground",
								children: "(888) 391-7298"
							})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: ["Want To Discuss ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
								href: "#chat",
								className: "font-bold text-brand",
								children: "Live Chat"
							})] })]
						})
					]
				}, t.name))
			})]
		})
	});
}
var sampleTabs = [
	"2D Animation",
	"3D Animation",
	"AI Based Animation"
];
function PortfolioSamples() {
	const [active, setActive] = (0, import_react.useState)("2D Animation");
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "mx-auto max-w-7xl px-4 py-20 md:px-6",
		children: [
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "mb-8 text-center",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "text-sm font-semibold uppercase tracking-widest text-brand",
						children: "Portfolio"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
						className: "mt-3 font-display text-3xl font-bold md:text-4xl",
						children: "Have a Look at Our Best Video Animation Samples"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "mx-auto mt-3 max-w-2xl text-sm text-muted-foreground",
						children: "We've had the privilege of collaborating with incredible brands, crafting explainer videos that turn complex ideas into stories that connect and inspire."
					})
				]
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "mb-8 flex flex-wrap justify-center gap-2 border-b border-border",
				children: sampleTabs.map((t) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
					onClick: () => setActive(t),
					className: `relative px-6 py-3 text-sm font-semibold transition ${active === t ? "text-foreground" : "text-muted-foreground hover:text-foreground"}`,
					children: [t, active === t && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "absolute inset-x-2 -bottom-px h-1 rounded-t bg-highlight" })]
				}, t))
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "grid grid-cols-2 gap-4 md:grid-cols-3",
				children: (active === "AI Based Animation" ? aiVideos : active === "3D Animation" ? threeDVideos : twoDVideos).map((v, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "group relative aspect-square overflow-hidden rounded-2xl bg-black shadow-lg ring-1 ring-white/10 transition hover:scale-[1.02]",
					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("video", {
						src: v.url,
						autoPlay: true,
						loop: true,
						muted: true,
						playsInline: true,
						className: "h-full w-full object-cover"
					})
				}, i))
			})
		]
	});
}
var whyItems = [
	{
		title: "A Smooth, Strategic Process",
		desc: "We make video production easier with clear deadlines, a dedicated account manager, real-time project tracking, and a proven process that keeps every stage moving."
	},
	{
		title: "Animated Explainer Video Company",
		desc: "14+ years at the forefront of the industry. With over 1,000 videos produced for the US market — including work for industry leaders like Amazon, Google, and Walmart."
	},
	{
		title: "Business Results, Not Just Animation",
		desc: "Every video we produce is built with one goal in mind — to move the needle for your business. We go beyond aesthetics to deliver content that drives real engagement, conversions, and measurable growth."
	},
	{
		title: "Strategic Without Sacrificing Quality",
		desc: "Great strategy means nothing if the final product doesn't wow, and stunning visuals mean nothing if they don't serve a purpose. We deliver both — every creative decision is intentional, on-brand, and built to perform."
	}
];
function WhyChoose() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
		className: "bg-[oklch(0.97_0.01_85)] py-20",
		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "mx-auto grid max-w-7xl gap-12 px-4 md:grid-cols-2 md:items-center md:px-6",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
					className: "inline-flex items-center gap-2 rounded bg-highlight px-2.5 py-1 text-[10px] font-bold uppercase tracking-wider text-highlight-foreground",
					children: "Why Choose Us"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
					className: "mt-4 font-display text-3xl font-bold leading-tight md:text-4xl",
					children: "Why High-Growth Brands Choose Wix Web Support"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "mt-6 grid gap-5 sm:grid-cols-2",
					children: whyItems.map((w) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
						className: "rounded-2xl border border-border bg-white p-5 shadow-sm",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
							className: "font-semibold",
							children: w.title
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
							className: "mt-2 text-sm text-muted-foreground",
							children: w.desc
						})]
					}, w.title))
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "mt-6 flex flex-wrap gap-3",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
						href: "tel:+18883917298",
						className: "rounded-lg bg-brand px-5 py-2.5 text-sm font-semibold text-brand-foreground shadow",
						children: "GET STARTED!"
					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
						href: "#chat",
						className: "inline-flex items-center gap-2 rounded-lg border border-border bg-card px-5 py-2.5 text-sm font-semibold",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MessageCircle, { className: "h-4 w-4" }), " Live Chat 🚀"]
					})]
				})
			] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "relative overflow-hidden rounded-[2.5rem] bg-gradient-to-br from-deep via-[#3a2f7a] to-brand p-10 shadow-2xl",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute -left-10 -top-10 h-40 w-40 rounded-full bg-highlight/40 blur-3xl" }),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute -bottom-10 -right-10 h-40 w-40 rounded-full bg-alert/40 blur-3xl" }),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
						className: "relative mx-auto flex h-72 w-72 items-center justify-center rounded-full bg-white/10 backdrop-blur",
						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
							src: choose_character_default,
							alt: "Creative character mascot for Wix Web Support animation services",
							className: "h-64 w-64 object-contain"
						})
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
						className: "relative mt-6 grid grid-cols-3 gap-3",
						children: [
							Video,
							WandSparkles,
							PenTool
						].map((I, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
							className: "grid h-14 place-items-center rounded-xl bg-white/15 text-white backdrop-blur",
							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(I, { className: "h-6 w-6" })
						}, i))
					})
				]
			})]
		})
	});
}
function FreeConsultCTA() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
		className: "mx-auto max-w-7xl px-4 py-16 md:px-6",
		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "overflow-hidden rounded-3xl bg-gradient-to-br from-brand via-deep to-alert p-10 text-center text-white shadow-2xl md:p-14",
			children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
					className: "font-display text-3xl font-bold md:text-4xl",
					children: "Create Amazing Explainer Animation Videos For Your Business"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
					className: "mx-auto mt-4 max-w-2xl text-sm text-white/85 md:text-base",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", {
						className: "text-highlight",
						children: "Get Your Free Consultation Today."
					}), " No pressure. No commitment. Just a conversation about what's possible for your brand."]
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "mt-6 flex flex-wrap justify-center gap-3",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
						href: "tel:+18883917298",
						className: "inline-flex items-center gap-2 rounded-full bg-highlight px-6 py-3 text-sm font-bold uppercase tracking-wider text-highlight-foreground shadow-lg",
						children: ["Start Your Project ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowRight, { className: "h-4 w-4" })]
					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
						href: "tel:+18883917298",
						className: "inline-flex items-center gap-2 rounded-full border border-white/40 bg-black/30 px-6 py-3 text-sm font-bold uppercase tracking-wider text-white",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Phone, { className: "h-4 w-4" }), " Call us: (888) 391-7298"]
					})]
				})
			]
		})
	});
}
var processSteps = [
	{
		title: "Concept & Script",
		desc: "Our creative writers craft a powerful script that conveys your message clearly and persuasively, highlighting what makes your product or story unique.",
		grad: "from-brand to-deep",
		gif: process_1_default
	},
	{
		title: "Storyboard",
		desc: "Next, our illustrators sketch out a visual blueprint of your explainer video, giving you a clear idea of the pacing, mood, and flow before production begins.",
		grad: "from-alert to-highlight",
		gif: process_2_default
	},
	{
		title: "Animation",
		desc: "Here's where your story comes to life. Our animators add motion, character, and emotion, turning static visuals into engaging, story-driven movement.",
		grad: "from-highlight to-brand",
		gif: process_3_default
	},
	{
		title: "Final Touches",
		desc: "In the final step, your video is polished with sound, transitions, and fine-tuned adjustments. Once approved, it's ready to captivate audiences and drive real results.",
		grad: "from-deep to-alert",
		gif: process_4_default
	}
];
function Process() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "mx-auto max-w-7xl px-4 py-20 md:px-6",
		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "mb-12 max-w-3xl",
			children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "text-sm font-semibold uppercase tracking-widest text-brand",
					children: "Our Process"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
					className: "mt-3 font-display text-3xl font-bold leading-tight md:text-4xl",
					children: "Every Project, Seamless From First Brief to Final Frame"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "mt-3 text-sm text-muted-foreground md:text-base",
					children: "Every project at Wix Web Support starts with your brand — your goals, your audience, your message. From first brief to final frame, we keep every stage seamless, strategic, and creatively on point."
				})
			]
		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ol", {
			className: "grid gap-6 md:grid-cols-2 lg:grid-cols-4",
			children: processSteps.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", {
				className: "rounded-2xl border border-border bg-card p-6 shadow-sm",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
						className: `relative aspect-video overflow-hidden rounded-xl bg-gradient-to-br ${s.grad} shadow-inner`,
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
							src: s.gif,
							alt: s.title,
							className: "h-full w-full object-contain p-2",
							loading: "lazy"
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
							className: "absolute left-3 top-2 font-display text-2xl font-black text-white/90 drop-shadow-lg",
							children: String(i + 1).padStart(2, "0")
						})]
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", {
						className: "mt-4 font-display text-lg font-bold",
						children: s.title
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "mt-2 text-sm text-muted-foreground",
						children: s.desc
					})
				]
			}, s.title))
		})]
	});
}
var testimonials = [
	{
		name: "Liam Rodrigues",
		role: "Sales Executive",
		initials: "LR",
		text: "The most talented video animation studio in town! I've dealt with several video production firms in the past, but they were the finest. For my brand, they created an incredible 3D animated video. I was quite impressed with their service."
	},
	{
		name: "John",
		role: "Marketing Manager",
		initials: "JN",
		text: "Working with this team was an absolute pleasure. They understood our brand voice instantly and delivered a whiteboard explainer that boosted our landing page conversions significantly. Communication was smooth from start to finish."
	},
	{
		name: "David Miller",
		role: "Startup Founder",
		initials: "DM",
		text: "From script to final render, everything was handled professionally. The motion graphics video they produced for our product launch exceeded expectations, and the unlimited revisions policy made the process completely stress-free."
	},
	{
		name: "Sarah Khan",
		role: "Product Lead",
		initials: "SK",
		text: "The team delivered an AI-powered explainer that generated over 250K views in the first month. Their storytelling instincts are next-level."
	},
	{
		name: "Michael Chen",
		role: "SaaS Founder",
		initials: "MC",
		text: "Fast, thoughtful, and creative. The final 60-second animation converted our free trial signups at nearly 3x the previous rate."
	}
];
function Testimonials() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "bg-[oklch(0.98_0.01_240)] py-20",
		children: [
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "mx-auto max-w-7xl px-4 md:px-6",
				children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "text-center",
					children: [
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
							className: "text-sm font-bold uppercase tracking-widest text-brand",
							children: "Our Testimonials"
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
							className: "mt-3 font-display text-3xl font-bold md:text-4xl",
							children: "What Our Clients Say About Our Solutions"
						}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
							className: "mt-6 flex flex-wrap items-center justify-center gap-8",
							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
								className: "flex items-center gap-3",
								children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
									className: "font-display text-2xl font-black tracking-tight",
									children: "Clutch"
								}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
									className: "flex items-center gap-1 text-alert",
									children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
										className: "text-sm font-bold text-foreground",
										children: "4.8 / 5.0"
									}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
										className: "flex",
										children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Star, { className: "h-3.5 w-3.5 fill-current" }, i))
									})]
								}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
									className: "text-[11px] text-muted-foreground",
									children: "Based on 78 client reviews"
								})] })]
							}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
								className: "flex items-center gap-3",
								children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
									className: "font-display text-2xl font-black tracking-tight text-emerald-600",
									children: "Trustpilot"
								}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
									className: "flex items-center gap-1 text-emerald-500",
									children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
										className: "text-sm font-bold text-foreground",
										children: "4.8 / 5.0"
									}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
										className: "flex",
										children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Star, { className: "h-3.5 w-3.5 fill-current" }, i))
									})]
								}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
									className: "text-[11px] text-muted-foreground",
									children: "Based on 43 client reviews"
								})] })]
							})]
						})
					]
				})
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "mt-10 overflow-x-auto",
				children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "mx-auto flex w-max gap-5 px-4 pb-4 md:px-6",
					children: testimonials.map((t) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("article", {
						className: "w-80 shrink-0 rounded-2xl border border-border bg-card p-5 shadow-sm",
						children: [
							/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
								className: "flex items-center gap-3",
								children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
									className: "grid h-10 w-10 place-items-center rounded-full bg-foreground text-xs font-bold text-background",
									children: t.initials
								}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
									className: "text-sm font-bold",
									children: t.name
								}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
									className: "text-[11px] text-muted-foreground",
									children: t.role
								})] })]
							}),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
								className: "mt-4 text-sm text-muted-foreground",
								children: t.text
							}),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
								className: "mt-4 flex text-alert",
								children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Star, { className: "h-4 w-4 fill-current" }, i))
							})
						]
					}, t.name))
				})
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
				className: "mt-8 text-center",
				children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: "flex flex-wrap justify-center gap-3",
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
						to: "/pricing",
						className: "rounded-lg bg-brand px-5 py-2.5 text-sm font-semibold text-brand-foreground shadow",
						children: "Get Started"
					}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
						href: "tel:+18883917298",
						className: "inline-flex items-center gap-2 rounded-lg border border-border bg-card px-5 py-2.5 text-sm font-semibold",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Phone, { className: "h-4 w-4" }), " Call Us - (888) 391-7298"]
					})]
				})
			})
		]
	});
}
function FAQs() {
	const [open, setOpen] = (0, import_react.useState)(0);
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "mx-auto max-w-7xl px-4 py-20 md:px-6",
		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "text-center",
			children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "text-sm font-bold uppercase tracking-widest text-brand",
					children: "FAQs"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
					className: "mt-3 font-display text-3xl font-bold md:text-4xl",
					children: "Frequently Asked Questions"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "mx-auto mt-3 max-w-2xl text-sm text-muted-foreground",
					children: "Everything you need to know about our animation services."
				})
			]
		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
			className: "mt-10 grid gap-3 md:grid-cols-2 md:gap-4",
			children: faqs.map((f, i) => {
				const isOpen = open === i;
				return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
					className: `rounded-lg border ${isOpen ? "border-brand bg-white" : "border-transparent bg-muted"}`,
					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
						type: "button",
						onClick: () => setOpen(isOpen ? null : i),
						className: "flex w-full items-center justify-between gap-4 px-4 py-3 text-left",
						"aria-expanded": isOpen,
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
							className: "text-sm font-semibold text-deep",
							children: f.q
						}), isOpen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Minus, { className: "h-4 w-4 shrink-0 text-alert" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Plus, { className: "h-4 w-4 shrink-0 text-muted-foreground" })]
					}), isOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "px-4 pb-4 text-sm text-muted-foreground",
						children: f.a
					})]
				}, f.q);
			})
		})]
	});
}
function ContactForm() {
	const COUNTRY_CODE = "+1";
	const [phone, setPhone] = (0, import_react.useState)("");
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "relative overflow-hidden bg-deep py-20 text-deep-foreground",
		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pointer-events-none absolute inset-0 bg-[radial-gradient(circle_at_top_right,_rgba(255,255,255,0.12),_transparent_60%)]" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
			className: "relative mx-auto grid max-w-6xl gap-10 px-4 md:grid-cols-2 md:items-center md:px-6",
			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "text-xs font-semibold uppercase tracking-wider text-highlight",
					children: "🎞️ Limited Time Offer"
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h2", {
					className: "mt-3 font-display text-4xl font-bold leading-tight md:text-5xl",
					children: [
						"Get Your Free Video",
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("br", {}),
						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
							className: "text-highlight",
							children: "Animation Quote!"
						})
					]
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "mt-6 max-w-md text-sm text-white/85 md:text-base",
					children: "Tell us about your project and our team will send you a customized estimate within 24 hours — no commitment required."
				}),
				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "mt-6 flex flex-wrap gap-4 text-sm",
					children: portfolioItems.slice(0, 3).map((p) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
						className: "rounded-full border border-white/20 bg-white/10 px-3 py-1 font-semibold",
						children: p.name
					}, p.name))
				})
			] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", {
				className: "space-y-3",
				onSubmit: (e) => {
					e.preventDefault();
					redirectToThankYou(e.currentTarget);
				},
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
						required: true,
						name: "name",
						placeholder: "Full Name",
						className: "w-full rounded-md bg-white px-4 py-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
						className: "relative",
						children: [
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
								className: "absolute left-3 top-1/2 -translate-y-1/2 text-sm font-semibold text-foreground",
								children: COUNTRY_CODE
							}),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
								type: "hidden",
								name: "phone",
								value: COUNTRY_CODE + phone
							}),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
								required: true,
								type: "tel",
								value: phone,
								onChange: (e) => setPhone(e.target.value.replace(/\D/g, "")),
								placeholder: "Phone Number",
								className: "w-full rounded-md bg-white py-3 pl-10 pr-4 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight"
							})
						]
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
						required: true,
						name: "email",
						type: "email",
						placeholder: "Email Address",
						className: "w-full rounded-md bg-white px-4 py-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", {
						className: "w-full rounded-md bg-white px-4 py-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight",
						children: [
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "What type of Explainer Videos do you plan?" }),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "2D Animation" }),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "3D Animation" }),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "Whiteboard Animation" }),
							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { children: "Motion Graphics" })
						]
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("textarea", {
						name: "description",
						rows: 4,
						placeholder: "Tell us about your project",
						className: "w-full resize-none rounded-md bg-white px-4 py-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-highlight"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
						type: "submit",
						className: "w-full rounded-md bg-highlight px-6 py-3 text-sm font-bold uppercase tracking-wider text-highlight-foreground shadow-lg transition hover:-translate-y-0.5",
						children: "Get a FREE Quote"
					})
				]
			})]
		})]
	});
}
function FinalCTA() {
	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
		className: "relative overflow-hidden bg-gradient-to-br from-deep via-[#241a5c] to-alert/80 py-16 md:py-24",
		children: [
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "pointer-events-none absolute inset-0 opacity-30",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute -left-20 top-10 h-96 w-96 rounded-full border border-white/20" }),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute right-10 top-20 h-72 w-72 rounded-full border border-white/10" }),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute bottom-0 left-1/3 h-96 w-96 rounded-full border border-white/10" })
				]
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "absolute right-6 top-6 hidden items-center gap-2 rounded-xl bg-white px-3 py-2 shadow-lg md:flex",
				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
					className: "grid h-8 w-8 place-items-center rounded-full bg-emerald-500 text-white",
					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ThumbsUp, { className: "h-4 w-4" })
				}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "font-display text-lg font-bold leading-none text-foreground",
					children: "7000+"
				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
					className: "text-[11px] text-muted-foreground",
					children: "Satisfied Clients"
				})] })]
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
				className: "relative mx-auto max-w-4xl px-4 text-center text-white md:px-6",
				children: [
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "font-display text-xl font-semibold md:text-3xl",
						children: "Your Next Great"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
						className: "mt-1 font-display text-5xl font-black uppercase tracking-tight md:text-7xl",
						style: {
							WebkitTextStroke: "2px white",
							WebkitTextFillColor: "transparent"
						},
						children: "Animation Starts Here"
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
						className: "mx-auto mt-4 max-w-xl text-sm text-white/80 md:text-base",
						children: "Schedule a free consultation and let our senior animators craft a scroll-stopping explainer video for your brand."
					}),
					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
						className: "mt-6 flex flex-wrap justify-center gap-3",
						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
							href: "tel:+18883917298",
							className: "inline-flex items-center gap-2 rounded-full bg-highlight px-6 py-3 text-sm font-bold uppercase tracking-wider text-highlight-foreground shadow-lg",
							children: ["Send Your Inquiry ", /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowRight, { className: "h-4 w-4" })]
						}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
							href: "tel:+18883917298",
							className: "inline-flex items-center gap-2 rounded-full border border-white/40 bg-black/40 px-6 py-3 text-sm font-bold uppercase tracking-wider text-white",
							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Phone, { className: "h-4 w-4" }), " (888) 391-7298"]
						})]
					})
				]
			}),
			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
				className: "hidden",
				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronDown, {}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Zap, {})]
			})
		]
	});
}
//#endregion
export { AnimationPage as component };
