1import { u as useSearchParams, r as reactExports, t as trackUserAction, j as jsxRuntimeExports, H as Helmet, L as Link, F as Footer } from './index-CeM4o6SA.js'; 2 3const sora2TemplatesData = { 4 "social-media-clips": {"title":"Social Media Clips","slug":"social-media-clips","description":"Perfect for Instagram, TikTok, YouTube Shorts","icon":"ð±","creditCost":30,"modelType":"sora2","generationSpeed":"fast","prompts":[{"id":"sm-001","title":"Product Unboxing Reel","prompt":"Create a 10-second product unboxing video for Instagram Reels, cinematic lighting, smooth zoom-in on luxury watch, modern minimalist white background, professional product photography style, 4K quality","thumbnail":"/templates/sora2/social-media-1.jpg","tags":["instagram","product","unboxing","luxury"],"duration":"10s","aspectRatio":"9:16"},{"id":"sm-002","title":"TikTok Transition Effect","prompt":"Create a viral TikTok transition video where a person snaps their fingers and the entire scene transforms from a messy room to a perfectly organized space, smooth camera movement, trending transition style, 9:16 aspect ratio","thumbnail":"/templates/sora2/social-media-2.jpg","tags":["tiktok","transition","organization","viral"],"duration":"8s","aspectRatio":"9:16"},{"id":"sm-003","title":"YouTube Shorts Intro","prompt":"Create an engaging YouTube Shorts intro with dynamic text animation, energetic background, modern typography, bright colors, fast-paced editing style, perfect for tech or lifestyle content","thumbnail":"/templates/sora2/social-media-3.jpg","tags":["youtube","intro","text","animation"],"duration":"5s","aspectRatio":"9:16"},{"id":"sm-004","title":"Instagram Stories Background","prompt":"Create a beautiful animated background for Instagram Stories featuring floating geometric shapes, soft pastel colors, gentle movement, modern minimalist aesthetic, perfect for lifestyle content","thumbnail":"/templates/sora2/social-media-4.jpg","tags":["instagram","stories","background","geometric"],"duration":"15s","aspectRatio":"9:16"},{"id":"sm-005","title":"Reels Text Animation","prompt":"Create a dynamic text reveal animation for Instagram Reels, words appearing with smooth transitions, bold typography, vibrant colors, perfect for motivational or educational content","thumbnail":"/templates/sora2/social-media-5.jpg","tags":["reels","text","animation","motivational"],"duration":"10s","aspectRatio":"9:16"},{"id":"sm-006","title":"Short Video Transition","prompt":"Create a smooth transition video between two scenes, camera movement from one location to another, seamless blend, perfect for storytelling or before/after content","thumbnail":"/templates/sora2/social-media-6.jpg","tags":["transition","storytelling","camera","movement"],"duration":"8s","aspectRatio":"16:9"}]}, 5 "ecommerce-demos": {"title":"E-commerce Product Demos","slug":"ecommerce-demos","description":"Perfect for product showcases and online stores","icon":"ðï¸","creditCost":30,"modelType":"sora2","generationSpeed":"fast","prompts":[{"id":"ec-001","title":"360° Product Rotation","prompt":"Create a smooth 360-degree rotation of wireless headphones, clean white background, professional studio lighting, focus on product details, smooth rotation motion, 4K quality","thumbnail":"/templates/sora2/ecommerce-1.jpg","tags":["product","rotation","headphones","studio"],"duration":"10s","aspectRatio":"1:1"},{"id":"ec-002","title":"Product Close-up Details","prompt":"Create a detailed close-up video of a luxury watch, focusing on the intricate craftsmanship, smooth camera movement across the surface, professional lighting, highlighting textures and materials","thumbnail":"/templates/sora2/ecommerce-2.jpg","tags":["luxury","watch","details","craftsmanship"],"duration":"12s","aspectRatio":"16:9"},{"id":"ec-003","title":"Lifestyle Usage Scene","prompt":"Create a lifestyle video showing someone using a fitness tracker during a morning run, natural outdoor lighting, dynamic movement, showcasing the product in real-world context","thumbnail":"/templates/sora2/ecommerce-3.jpg","tags":["fitness","lifestyle","outdoor","tracker"],"duration":"15s","aspectRatio":"16:9"},{"id":"ec-004","title":"Multi-Angle Product View","prompt":"Create a multi-angle product showcase of a smartphone, smooth camera movements from different perspectives, professional studio setup, highlighting design features and screen quality","thumbnail":"/templates/sora2/ecommerce-4.jpg","tags":["smartphone","multi-angle","studio","de
5sign"],"duration":"12s","aspectRatio":"16:9"},{"id":"ec-005","title":"Product Comparison","prompt":"Create a side-by-side comparison video of two coffee makers, smooth transitions between products, clear visual differences, professional presentation style","thumbnail":"/templates/sora2/ecommerce-5.jpg","tags":["comparison","coffee","appliances","side-by-side"],"duration":"10s","aspectRatio":"16:9"},{"id":"ec-006","title":"Material Texture Showcase","prompt":"Create a detailed video showcasing the texture and material of a leather handbag, close-up shots, natural lighting, highlighting quality and craftsmanship","thumbnail":"/templates/sora2/ecommerce-6.jpg","tags":["leather","texture","handbag","quality"],"duration":"8s","aspectRatio":"16:9"},{"id":"ec-007","title":"Packaging Reveal","prompt":"Create an unboxing-style video showing the packaging of a premium product, smooth camera movement, professional lighting, highlighting the unboxing experience","thumbnail":"/templates/sora2/ecommerce-7.jpg","tags":["packaging","unboxing","premium","experience"],"duration":"12s","aspectRatio":"16:9"}]}, 6 "content-creator-stock": {"title":"Content Creator Stock","slug":"content-creator-stock","description":"B-Roll footage and background content for creators","icon":"ð¬","creditCost":30,"modelType":"sora2","generationSpeed":"fast","prompts":[{"id":"cc-001","title":"City Skyline B-Roll","prompt":"Create B-roll footage of a modern city skyline at golden hour, slow camera pan, cinematic color grading, perfect for video editing background, 4K quality","thumbnail":"/templates/sora2/content-creator-1.jpg","tags":["city","skyline","golden-hour","b-roll"],"duration":"20s","aspectRatio":"16:9"},{"id":"cc-002","title":"Nature Landscape","prompt":"Create a peaceful nature landscape with flowing water, gentle camera movement, natural lighting, perfect for meditation or relaxation content","thumbnail":"/templates/sora2/content-creator-2.jpg","tags":["nature","water","landscape","peaceful"],"duration":"15s","aspectRatio":"16:9"},{"id":"cc-003","title":"Abstract Background Animation","prompt":"Create an abstract animated background with flowing particles, modern gradient colors, smooth movement, perfect for tech or creative content","thumbnail":"/templates/sora2/content-creator-3.jpg","tags":["abstract","particles","gradient","tech"],"duration":"10s","aspectRatio":"16:9"},{"id":"cc-004","title":"Particle Transition Effect","prompt":"Create a smooth particle transition effect, colorful particles forming and dissolving, modern animation style, perfect for video transitions","thumbnail":"/templates/sora2/content-creator-4.jpg","tags":["particles","transition","colorful","animation"],"duration":"8s","aspectRatio":"16:9"},{"id":"cc-005","title":"Text Animation Background","prompt":"Create a dynamic background with animated text elements, modern typography, smooth animations, perfect for educational or presentation content","thumbnail":"/templates/sora2/content-creator-5.jpg","tags":["text","animation","typography","educational"],"duration":"12s","aspectRatio":"16:9"},{"id":"cc-006","title":"Seasonal Theme Footage","prompt":"Create seasonal footage with autumn leaves falling, warm colors, gentle camera movement, perfect for seasonal content or lifestyle videos","thumbnail":"/templates/sora2/content-creator-6.jpg","tags":["autumn","leaves","seasonal","warm"],"duration":"15s","aspectRatio":"16:9"},{"id":"cc-007","title":"Time Lapse Scene","prompt":"Create a time-lapse effect of clouds moving across the sky, dramatic lighting changes, perfect for time-lapse content or background footage","thumbnail":"/templates/sora2/content-creator-7.jpg","tags":["time-lapse","clouds","sky","dramatic"],"duration":"20s","aspectRatio":"16:9"}]}, 7 "educational-content": {"title":"Educational Content","slug":"educational-content","description":"Perfect for learning and teaching materials","icon":"ð","creditCost":30,"modelType":"sora2","generationSpeed":"fast","prompts":[{"id":"ed-001","title":"Science Concept Visualization","prompt":"Create an animated explainer video showing how photosynthesis works, colorful cartoon style, clear labels, educational and engaging for students, 2D animation style","thumbnail":"/templates/sora2/educational-1.jpg","tags":["science","photosynthesis","cartoon","educational"],"duration":"15s","aspectRatio":"16:9"}
7,{"id":"ed-002","title":"Historical Event Recreation","prompt":"Create a historical recreation of the moon landing, realistic style, showing the Apollo 11 mission, educational documentary style","thumbnail":"/templates/sora2/educational-2.jpg","tags":["history","moon-landing","apollo","documentary"],"duration":"20s","aspectRatio":"16:9"},{"id":"ed-003","title":"Math Formula Animation","prompt":"Create an animated explanation of the Pythagorean theorem, geometric shapes moving and transforming, clear mathematical visualization, educational style","thumbnail":"/templates/sora2/educational-3.jpg","tags":["math","geometry","formula","animation"],"duration":"12s","aspectRatio":"16:9"},{"id":"ed-004","title":"Geography Landscape","prompt":"Create a geographical landscape showing different climate zones, educational style, clear visual distinctions, perfect for geography lessons","thumbnail":"/templates/sora2/educational-4.jpg","tags":["geography","climate","landscape","educational"],"duration":"18s","aspectRatio":"16:9"},{"id":"ed-005","title":"Biology Process Demo","prompt":"Create an animated demonstration of cell division, scientific accuracy, clear visualization, educational style, perfect for biology classes","thumbnail":"/templates/sora2/educational-5.jpg","tags":["biology","cell-division","scientific","microscopic"],"duration":"15s","aspectRatio":"16:9"},{"id":"ed-006","title":"Technology Explanation","prompt":"Create an animated explanation of how solar panels work, technical accuracy, clear visual representation, educational style","thumbnail":"/templates/sora2/educational-6.jpg","tags":["technology","solar-panels","energy","technical"],"duration":"12s","aspectRatio":"16:9"}]}, 8 "marketing-ads": {"title":"Marketing & Ads","slug":"marketing-ads","description":"Perfect for promotional content and advertisements","icon":"ð¢","creditCost":30,"modelType":"sora2","generationSpeed":"fast","prompts":[{"id":"ma-001","title":"Brand Logo Animation","prompt":"Create a dynamic logo animation for a tech company, modern design, smooth transitions, professional style, perfect for brand introduction","thumbnail":"/templates/sora2/marketing-1.jpg","tags":["logo","animation","tech","brand"],"duration":"8s","aspectRatio":"16:9"},{"id":"ma-002","title":"Coffee Shop Atmosphere","prompt":"Create a cozy coffee shop promotional video, warm lighting, steam rising from cup, inviting atmosphere, perfect for cafe marketing","thumbnail":"/templates/sora2/marketing-2.jpg","tags":["coffee","cozy","atmosphere","cafe"],"duration":"10s","aspectRatio":"16:9"},{"id":"ma-003","title":"Restaurant Food Showcase","prompt":"Create an appetizing food video for a restaurant, professional food photography style, steam rising, perfect lighting, mouth-watering presentation","thumbnail":"/templates/sora2/marketing-3.jpg","tags":["food","restaurant","appetizing","professional"],"duration":"12s","aspectRatio":"16:9"},{"id":"ma-004","title":"Fashion Clothing Display","prompt":"Create a fashion video showcasing elegant clothing, smooth camera movement, professional lighting, highlighting fabric textures and design","thumbnail":"/templates/sora2/marketing-4.jpg","tags":["fashion","clothing","elegant","texture"],"duration":"15s","aspectRatio":"16:9"},{"id":"ma-005","title":"Gym Fitness Scene","prompt":"Create a motivational gym video, energetic atmosphere, dynamic lighting, showcasing fitness equipment and workout environment","thumbnail":"/templates/sora2/marketing-5.jpg","tags":["gym","fitness","motivational","energetic"],"duration":"12s","aspectRatio":"16:9"},{"id":"ma-006","title":"Travel Destination","prompt":"Create a travel promotional video for a tropical destination, beautiful scenery, warm colors, inviting atmosphere, perfect for tourism marketing","thumbnail":"/templates/sora2/marketing-6.jpg","tags":["travel","tropical","tourism","scenic"],"duration":"18s","aspectRatio":"16:9"},{"id":"ma-007","title":"Tech Product Ad","prompt":"Create a sleek tech product advertisement, modern design, clean aesthetics, highlighting product features, professional tech marketing style","thumbnail":"/templates/sora2/marketing-7.jpg","tags":["tech","product","sleek","modern"],"duration":"10s","aspectRatio":"16:9"}]}, 9 "viral-trends": {"title":"Viral Trends","slug":"viral-trends","description":"Perfect for trending content and viral videos","icon":"ð¥","credit
9Cost":30,"modelType":"sora2","generationSpeed":"fast","prompts":[{"id":"vt-001","title":"Morning Routine Vlog","prompt":"Create a relatable morning routine video, first-person POV, modern apartment, natural lighting, millennial lifestyle aesthetic, perfect for lifestyle content","thumbnail":"/templates/sora2/viral-1.jpg","tags":["morning","routine","lifestyle","millennial"],"duration":"15s","aspectRatio":"9:16"},{"id":"vt-002","title":"Work Day Vlog","prompt":"Create a work-from-home day vlog, modern home office setup, natural lighting, productive atmosphere, perfect for remote work content","thumbnail":"/templates/sora2/viral-2.jpg","tags":["work","home-office","productive","remote"],"duration":"12s","aspectRatio":"9:16"},{"id":"vt-003","title":"Healthy Lifestyle","prompt":"Create a healthy lifestyle video, smoothie making, fresh ingredients, bright lighting, wellness aesthetic, perfect for health and fitness content","thumbnail":"/templates/sora2/viral-3.jpg","tags":["healthy","smoothie","wellness","fitness"],"duration":"10s","aspectRatio":"9:16"},{"id":"vt-004","title":"Home Decor Setup","prompt":"Create a home decor transformation video, before and after style, modern interior design, cozy atmosphere, perfect for home improvement content","thumbnail":"/templates/sora2/viral-4.jpg","tags":["home","decor","transformation","interior"],"duration":"15s","aspectRatio":"9:16"},{"id":"vt-005","title":"Pet Interaction","prompt":"Create a cute pet interaction video, playful atmosphere, natural lighting, heartwarming moments, perfect for pet content","thumbnail":"/templates/sora2/viral-5.jpg","tags":["pet","cute","playful","heartwarming"],"duration":"12s","aspectRatio":"9:16"},{"id":"vt-006","title":"Cooking Process","prompt":"Create a cooking process video, step-by-step food preparation, warm kitchen lighting, appetizing presentation, perfect for food content","thumbnail":"/templates/sora2/viral-6.jpg","tags":["cooking","food","kitchen","appetizing"],"duration":"18s","aspectRatio":"9:16"},{"id":"vt-007","title":"Emotional Connection","prompt":"Create an emotionally engaging video, relatable moments, warm lighting, authentic atmosphere, perfect for emotional or inspirational content","thumbnail":"/templates/sora2/viral-7.jpg","tags":["emotional","relatable","inspirational","authentic"],"duration":"15s","aspectRatio":"9:16"}]}, 10}; 11 12const Sora2Templates = () => { 13 const [searchParams] = useSearchParams(); 14 const [selectedCategory, setSelectedCategory] = reactExports.useState(""); 15 const [searchQuery, setSearchQuery] = reactExports.useState(""); 16 const [filteredTemplates, setFilteredTemplates] = reactExports.useState([]); 17 const [activeDemoTab, setActiveDemoTab] = reactExports.useState("text"); 18 const [demoPrompt, setDemoPrompt] = reactExports.useState("A man conducting an orchestra, wearing a black suit, in a grand concert hall."); 19 const [demoImage, setDemoImage] = reactExports.useState(null); 20 const categorySlug = searchParams.get("category"); 21 const categories = Object.values(sora2TemplatesData); 22 reactExports.useEffect(() => { 23 if (categorySlug) { 24 setSelectedCategory(categorySlug); 25 } 26 trackUserAction("sora2_templates_view", { 27 category: categorySlug || "all" 28 }); 29 }, [categorySlug]); 30 reactExports.useEffect(() => { 31 let templates = []; 32 if (selectedCategory) { 33 const category = categories.find((cat) => cat.slug === selectedCategory); 34 if (category) { 35 templates = category.prompts; 36 } 37 } else { 38 categories.forEach((category) => { 39 templates.push(...category.prompts); 40 }); 41 } 42 if (searchQuery.trim()) { 43 templates = templates.filter( 44 (template) => template.title.toLowerCase().includes(searchQuery.toLowerCase()) || template.prompt.toLowerCase().includes(searchQuery.toLowerCase()) || template.tags.some((tag) => tag.toLowerCase().includes(searchQuery.toLowerCase())) 45 ); 46 } 47 setFilteredTemplates(templates); 48 }, [selectedCategory, searchQuery, categories]); 49 const handleCategorySelect = (categorySlug2) => { 50 setSelectedCategory(categorySlug2); 51 setSearchQuery(""); 52 const url = categorySlug2 ? `/sora2-templates?category=${categorySlug2}` : "/sora2-templates"; 53 window.history.pushState({}, "", url); 54 }; 55 const handleTemplateClick = (template, category) => { 56 trackUserAction("sora2_template_click", { 57 template_id: template.id, 58 template_title: template.title, 59 category: category.slug 60 }); 61 const params = new URLSearchParams({ 62 prompt: template.prompt, 63 type: template.aspectRatio === "9:16" ? "text" : "text", 64 // é»è®¤textæ¨¡å¼ 65 model: "sora2-text" 66 }); 67 window.location.href = `/sora2-generate?${params.toString()}`; 68 }; 69 const handleSearch = (query) => { 70 setSearchQuery(query); 71 }; 72 return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-h-screen bg-[#121a22]", children: [
73 /* @__PURE__ */ jsxRuntimeExports.jsxs(Helmet, { children: [ 74 /* @__PURE__ */ jsxRuntimeExports.jsx("title", { children: "Sora 2 Video Templates - Professional AI Video Generation | 40+ Templates" }), 75 /* @__PURE__ */ jsxRuntimeExports.jsx("meta", { name: "description", content: "Choose from 40+ professional Sora 2 video templates. Create stunning AI videos with text-to-video and image-to-video. Only 30 credits each - 28% cheaper than premium models." }), 76 /* @__PURE__ */ jsxRuntimeExports.jsx("meta", { name: "keywords", content: "sora 2 templates, ai video templates, text to video templates, image to video templates, video generation, ai video creation" }), 77 /* @__PURE__ */ jsxRuntimeExports.jsx("meta", { property: "og:title", content: "Sora 2 Video Templates - Professional AI Video Generation" }), 78 /* @__PURE__ */ jsxRuntimeExports.jsx("meta", { property: "og:description", content: "40+ professional Sora 2 video templates for all use cases. Create stunning AI videos with OpenAI's latest model." }),
79 /* @__PURE__ */ jsxRuntimeExports.jsx("meta", { property: "og:type", content: "website" }), 80 /* @__PURE__ */ jsxRuntimeExports.jsx("link", { rel: "canonical", href: "https://www.veo3free.ai/sora2-templates" }) 81 ] }), 82 /* @__PURE__ */ jsxRuntimeExports.jsxs("main", { children: [ 83 /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-20 bg-gradient-to-b from-[#121a22] to-[#1a2736]", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "container mx-auto px-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center max-w-4xl mx-auto", children: [ 84 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "inline-block bg-gradient-to-r from-green-500/20 to-blue-500/20 rounded-lg px-6 py-3 mb-8 border border-green-500/30", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-green-400 font-semibold text-lg", children: "ð Sora 2 Video Templates - Professional AI Video Generation" }) }), 85 /* @__PURE__ */ jsxRuntimeExports.jsxs("h1", { className: "text-5xl md:text-6xl font-bold text-white mb-6 leading-tight", children: [ 86 "Sora 2 Video Templates",
87 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "block text-3xl md:text-4xl text-transparent bg-clip-text bg-gradient-to-r from-green-400 to-blue-400 mt-2", children: "40+ Professional Templates" }) 88 ] }), 89 /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-xl text-gray-300 mb-8 max-w-3xl mx-auto leading-relaxed", children: [ 90 "Choose from 40+ professional video templates designed for Sora 2.", 91 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-green-400 font-semibold", children: " Only 30 credits each" }), 92 " -", 93 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-blue-400 font-semibold", children: " 28% cheaper" }), 94 " than premium models. Perfect for social media, e-commerce, marketing, and content creation." 95 ] }), 96 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6 mb-12", children: [ 97 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f]/50 rounded-lg p-6 border border-green-500/20", children: [
98 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-3xl mb-3", children: "ð°" }), 99 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-2", children: "28% Cheaper" }), 100 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Only 30 credits vs 42 credits for premium models" }) 101 ] }), 102 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f]/50 rounded-lg p-6 border border-blue-500/20", children: [ 103 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-3xl mb-3", children: "â¡" }), 104 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-2", children: "Fast Generation" }), 105 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Quick processing with OpenAI's latest technology" }) 106 ] }), 107 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f]/50 rounded-lg p-6 border border-purple-500/20", children: [
108 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-3xl mb-3", children: "ðµ" }), 109 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-2", children: "Audio Support" }), 110 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Generate videos with synchronized sound and music" }) 111 ] }) 112 ] }), 113 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col sm:flex-row gap-4 justify-center", children: [ 114 /* @__PURE__ */ jsxRuntimeExports.jsx( 115 Link, 116 { 117 to: "/sora2-generate", 118 className: "px-8 py-4 bg-gradient-to-r from-[#8A7CFF] to-[#6C5CE7] text-white rounded-lg font-semibold text-lg hover:shadow-lg hover:shadow-[#8A7CFF]/20 transition-all duration-200", 119 children: "Start Generating Now" 120 } 121 ), 122 /* @__PURE__ */ jsxRuntimeExports.jsx( 123 Link, 124 { 125 to: "/sora2-video", 126 className: "px-8 py-4 border border-gray-600 text-white rounded-lg font-semibold text-lg hover:bg-white/10 transition-all duration-200", 127 children: "Learn More" 128 } 129 ) 130 ] }) 131 ] }) }) }),
132 /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-16 bg-[#1a242f]", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "container mx-auto px-4", children: [ 133 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-12", children: [ 134 /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-3xl md:text-4xl font-bold text-white mb-4", children: "Try Sora 2 Video Generation" }), 135 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-lg text-gray-300 max-w-2xl mx-auto", children: "Experience the power of Sora 2 with our interactive demo" }) 136 ] }), 137 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max-w-6xl mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#121a22] rounded-2xl overflow-hidden shadow-xl", children: [ 138 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex border-b border-gray-700", children: [ 139 /* @__PURE__ */ jsxRuntimeExports.jsx( 140 "button", 141 { 142 onClick: () => setActiveDemoTab("text"), 143 className: `px-6 py-4 font-medium transition-all duration-200 ${activeDemoTab === "text" ? "bg-[#8A7CFF] text-white" : "text-gray-400 hover:text-white hover:bg-[#2a3441]"}`, 144 children: "Text to Video" 145 } 146 ),
147 /* @__PURE__ */ jsxRuntimeExports.jsx( 148 "button", 149 { 150 onClick: () => setActiveDemoTab("image"), 151 className: `px-6 py-4 font-medium transition-all duration-200 ${activeDemoTab === "image" ? "bg-[#8A7CFF] text-white" : "text-gray-400 hover:text-white hover:bg-[#2a3441]"}`, 152 children: "Image to Video" 153 } 154 ) 155 ] }), 156 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "p-8", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-8", children: [ 157 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 158 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-4", children: "Input" }), 159 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "space-y-4", children: [ 160 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 161 /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-gray-300 text-sm mb-2", children: "Prompt" }),
162 /* @__PURE__ */ jsxRuntimeExports.jsx( 163 "textarea", 164 { 165 value: demoPrompt, 166 onChange: (e) => setDemoPrompt(e.target.value), 167 className: "w-full h-32 p-4 bg-[#2a3441] border border-gray-600 rounded-lg text-white placeholder-gray-400 focus:border-[#8A7CFF] focus:outline-none resize-none", 168 placeholder: "Describe your video..." 169 } 170 ) 171 ] }), 172 activeDemoTab === "image" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 173 /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-gray-300 text-sm mb-2", children: "Upload Image" }), 174 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "border-2 border-dashed border-gray-600 rounded-lg p-8 text-center", children: demoImage ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 175 /* @__PURE__ */ jsxRuntimeExports.jsx("img", { src: demoImage, alt: "Demo", className: "max-w-full max-h-32 mx-auto rounded" }),
176 /* @__PURE__ */ jsxRuntimeExports.jsx( 177 "button", 178 { 179 onClick: () => setDemoImage(null), 180 className: "mt-2 text-red-400 hover:text-red-300", 181 children: "Remove Image" 182 } 183 ) 184 ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 185 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-4xl mb-2", children: "ð" }), 186 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400", children: "Click to upload or drag and drop" }) 187 ] }) }) 188 ] }), 189 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [ 190 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 191 /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-gray-300 text-sm mb-2", children: "Duration" }),
192 /* @__PURE__ */ jsxRuntimeExports.jsxs("select", { className: "w-full p-3 bg-[#2a3441] border border-gray-600 rounded-lg text-white focus:border-[#8A7CFF] focus:outline-none", children: [ 193 /* @__PURE__ */ jsxRuntimeExports.jsx("option", { children: "10 seconds" }), 194 /* @__PURE__ */ jsxRuntimeExports.jsx("option", { children: "15 seconds" }), 195 /* @__PURE__ */ jsxRuntimeExports.jsx("option", { children: "20 seconds" }) 196 ] }) 197 ] }), 198 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 199 /* @__PURE__ */ jsxRuntimeExports.jsx("label", { className: "block text-gray-300 text-sm mb-2", children: "Aspect Ratio" }), 200 /* @__PURE__ */ jsxRuntimeExports.jsxs("select", { className: "w-full p-3 bg-[#2a3441] border border-gray-600 rounded-lg text-white focus:border-[#8A7CFF] focus:outline-none", children: [ 201 /* @__PURE__ */ jsxRuntimeExports.jsx("option", { children: "16:9" }),
202 /* @__PURE__ */ jsxRuntimeExports.jsx("option", { children: "9:16" }), 203 /* @__PURE__ */ jsxRuntimeExports.jsx("option", { children: "1:1" }) 204 ] }) 205 ] }) 206 ] }) 207 ] }) 208 ] }), 209 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [ 210 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-4", children: "Output" }), 211 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-black rounded-lg overflow-hidden aspect-video flex items-center justify-center", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center text-gray-400", children: [ 212 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-6xl mb-4", children: "ð¬" }), 213 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { children: "Generated video will appear here" }), 214 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm mt-2", children: 'Click "Generate Video" to see the result' }) 215 ] }) }),
216 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-4 flex gap-3", children: [ 217 /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "px-6 py-3 bg-[#8A7CFF] text-white rounded-lg hover:bg-[#7A6CE6] transition-colors", children: "Generate Video" }), 218 /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "px-6 py-3 bg-gray-600 text-white rounded-lg hover:bg-gray-700 transition-colors", children: "Download" }) 219 ] }) 220 ] }) 221 ] }) }) 222 ] }) }) 223 ] }) }), 224 /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-16", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "container mx-auto px-4", children: [ 225 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-12", children: [ 226 /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-3xl md:text-4xl font-bold text-white mb-4", children: "Professional Video Templates" }), 227 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-lg text-gray-300 max-w-2xl mx-auto", children: "Choose from 40+ professional templates across 6 categories" }) 228 ] }),
229 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max-w-md mx-auto mb-8", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [ 230 /* @__PURE__ */ jsxRuntimeExports.jsx( 231 "input", 232 { 233 type: "text", 234 placeholder: "Search templates...", 235 value: searchQuery, 236 onChange: (e) => handleSearch(e.target.value), 237 className: "w-full px-4 py-3 pl-10 bg-[#1a242f] border border-gray-600 rounded-lg text-white placeholder-gray-400 focus:border-[#8A7CFF] focus:outline-none" 238 } 239 ), 240 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400", children: "ð" }) 241 ] }) }), 242 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mb-8", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-wrap justify-center gap-2 md:gap-4", children: [ 243 /* @__PURE__ */ jsxRuntimeExports.jsxs( 244 "button", 245 { 246 onClick: () => handleCategorySelect(""), 247 className: `px-4 py-2 rounded-full text-sm font-medium transition-all duration-300 ${!selectedCategory ? "bg-[#8A7CFF] text-white shadow-lg" : "bg-[#1a242f] text-gray-300 hover:bg-[#2a3441] hover:text-white"}`, 248 children: [ 249 "All Templates (", 250 filteredTemplates.length, 251 ")" 252 ] 253 } 254 ), 255 categories.map((category) => /* @__PURE__ */ jsxRuntimeExports.jsxs( 256 "button", 257 { 258 onClick: () => handleCategorySelect(category.slug), 259 className: `px-4 py-2 rounded-full text-sm font-medium transition-all duration-300 ${selectedCategory === category.slug ? "bg-[#8A7CFF] text-white shadow-lg" : "bg-[#1a242f] text-gray-300 hover:bg-[#2a3441] hover:text-white"}`, 260 children: [ 261 category.icon, 262 " ", 263 category.title 264 ] 265 }, 266 category.slug 267 )) 268 ] }) }), 269 selectedCategory && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-center mb-8", children: (() => { 270 const category = categories.find((cat) => cat.slug === selectedCategory); 271 return category ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "inline-block bg-[#1a242f] px-6 py-4 rounded-lg", children: [
272 /* @__PURE__ */ jsxRuntimeExports.jsxs("h2", { className: "text-2xl font-bold text-white mb-2", children: [ 273 category.icon, 274 " ", 275 category.title 276 ] }), 277 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-300 mb-2", children: category.description }), 278 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center gap-4 text-sm", children: [ 279 /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-green-400 font-semibold", children: [ 280 category.creditCost, 281 " credits each" 282 ] }), 283 /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-blue-400 font-semibold", children: [ 284 category.generationSpeed, 285 " generation" 286 ] }), 287 /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-purple-400 font-semibold", children: [ 288 category.modelType, 289 " model" 290 ] }) 291 ] }) 292 ] }) : null; 293 })() }), 294 filteredTemplates.length > 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6", children: filteredTemplates.map((template) => { 295 const category = categories.find( 296 (cat) => cat.prompts.some((p) => p.id === template.id) 297 ); 298 return /* @__PURE__ */ jsxRuntimeExports.jsx( 299 TemplateCard, 300 { 301 template, 302 category, 303 onClick: () => handleTemplateClick(template, category) 304 }, 305 template.id 306 ); 307 }) }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center py-12", children: [
308 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-6xl mb-4", children: "ð" }), 309 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-xl font-semibold text-white mb-2", children: "No templates found" }), 310 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 mb-6", children: searchQuery ? "Try adjusting your search terms" : "Select a category to view templates" }), 311 searchQuery && /* @__PURE__ */ jsxRuntimeExports.jsx( 312 "button", 313 { 314 onClick: () => { 315 setSearchQuery(""); 316 setSelectedCategory(""); 317 }, 318 className: "px-6 py-3 bg-[#8A7CFF] text-white rounded-lg hover:bg-[#7A6CE6] transition-colors", 319 children: "Clear Filters" 320 } 321 ) 322 ] }) 323 ] }) }), 324 /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-16 bg-[#1a242f]", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "container mx-auto px-4", children: [
325 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-12", children: [ 326 /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-3xl md:text-4xl font-bold text-white mb-4", children: "Sora 2 vs VEO 3 - Model Comparison" }), 327 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-lg text-gray-300 max-w-2xl mx-auto", children: "Compare Sora 2 with VEO 3 and see the advantages" }) 328 ] }), 329 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max-w-4xl mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-[#121a22] rounded-2xl overflow-hidden shadow-xl", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("table", { className: "w-full", children: [ 330 /* @__PURE__ */ jsxRuntimeExports.jsx("thead", { className: "bg-[#2a3441]", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { children: [ 331 /* @__PURE__ */ jsxRuntimeExports.jsx("th", { className: "px-6 py-4 text-left text-white font-semibold", children: "Feature" }),
332 /* @__PURE__ */ jsxRuntimeExports.jsx("th", { className: "px-6 py-4 text-center text-green-400 font-semibold", children: "Sora 2" }), 333 /* @__PURE__ */ jsxRuntimeExports.jsx("th", { className: "px-6 py-4 text-center text-gray-400 font-semibold", children: "VEO 3" }) 334 ] }) }), 335 /* @__PURE__ */ jsxRuntimeExports.jsxs("tbody", { className: "divide-y divide-gray-700", children: [ 336 /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { children: [ 337 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-white font-medium", children: "Credits per Video" }), 338 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400 font-semibold", children: "30 credits" }), 339 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-gray-400", children: "42 credits" }) 340 ] }), 341 /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { className: "bg-[#1a242f]", children: [
342 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-white font-medium", children: "Price Savings" }), 343 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400 font-semibold", children: "28% cheaper" }), 344 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-gray-400", children: "-" }) 345 ] }), 346 /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { children: [ 347 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-white font-medium", children: "Generation Speed" }), 348 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-blue-400 font-semibold", children: "Fast" }), 349 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-gray-400", children: "Standard" }) 350 ] }), 351 /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { className: "bg-[#1a242f]", children: [
352 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-white font-medium", children: "Audio Support" }), 353 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400", children: "â" }), 354 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400", children: "â" }) 355 ] }), 356 /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { children: [ 357 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-white font-medium", children: "Text-to-Video" }), 358 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400", children: "â" }), 359 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400", children: "â" }) 360 ] }), 361 /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { className: "bg-[#1a242f]", children: [ 362 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-white font-medium", children: "Image-to-Video" }),
363 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400", children: "â" }), 364 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-green-400", children: "â" }) 365 ] }), 366 /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", { children: [ 367 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-white font-medium", children: "Quality" }), 368 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-blue-400 font-semibold", children: "High" }), 369 /* @__PURE__ */ jsxRuntimeExports.jsx("td", { className: "px-6 py-4 text-center text-purple-400 font-semibold", children: "Professional" }) 370 ] }) 371 ] }) 372 ] }) }) }) }) 373 ] }) }), 374 /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-16", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "container mx-auto px-4", children: [
375 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center mb-12", children: [ 376 /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-3xl md:text-4xl font-bold text-white mb-4", children: "Common Questions & Answers" }), 377 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-lg text-gray-300 max-w-2xl mx-auto", children: "Everything you need to know about Sora 2 video generation" }) 378 ] }), 379 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max-w-4xl mx-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [ 380 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f] rounded-lg p-6", children: [ 381 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-3", children: "Is Sora 2 API available 24/7?" }), 382 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Yes, our Sora 2 API is available 24/7 with 99.9% uptime guarantee. You can generate videos anytime, anywhere." }) 383 ] }),
384 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f] rounded-lg p-6", children: [ 385 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-3", children: "What types of content can I create with Sora 2 API?" }), 386 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "You can create social media clips, e-commerce demos, educational content, marketing videos, and viral content using our 40+ professional templates." }) 387 ] }), 388 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f] rounded-lg p-6", children: [ 389 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-3", children: "How do I start using the Sora 2 API?" }), 390 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Simply sign up, get your API key, and start generating videos. No credit card required for the free tier." }) 391 ] }),
392 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f] rounded-lg p-6", children: [ 393 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-3", children: "Does Sora 2 API support HD video generation?" }), 394 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Yes, Sora 2 API supports HD video generation with flexible aspect ratios including 16:9, 9:16, and 1:1 formats." }) 395 ] }), 396 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f] rounded-lg p-6", children: [ 397 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-3", children: "Can I use Sora 2 API for both text-to-video and image-to-video?" }), 398 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Absolutely! Sora 2 API supports both text-to-video and image-to-video generation with the same 30 credit cost." }) 399 ] }),
400 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "bg-[#1a242f] rounded-lg p-6", children: [ 401 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white font-semibold mb-3", children: "How is Sora 2 different from VEO 3?" }), 402 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-gray-400 text-sm", children: "Sora 2 is 28% cheaper (30 vs 42 credits), offers faster generation, and provides the same high-quality results as VEO 3." }) 403 ] }) 404 ] }) }) 405 ] }) }), 406 /* @__PURE__ */ jsxRuntimeExports.jsx("section", { className: "py-20 bg-gradient-to-b from-[#1a242f] to-[#121a22]", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "container mx-auto px-4", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center max-w-3xl mx-auto", children: [ 407 /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-4xl md:text-5xl font-bold text-white mb-6", children: "Ready to Start Creating?" }),
408 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-xl text-gray-300 mb-8", children: "Join thousands of creators using Sora 2 to generate amazing videos. Start with just 30 credits and see the difference." }), 409 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col sm:flex-row gap-4 justify-center", children: [ 410 /* @__PURE__ */ jsxRuntimeExports.jsx( 411 Link, 412 { 413 to: "/sora2-generate", 414 className: "px-8 py-4 bg-gradient-to-r from-[#8A7CFF] to-[#6C5CE7] text-white rounded-lg font-semibold text-lg hover:shadow-lg hover:shadow-[#8A7CFF]/20 transition-all duration-200", 415 children: "Start Generating Now" 416 } 417 ), 418 /* @__PURE__ */ jsxRuntimeExports.jsx( 419 Link, 420 { 421 to: "/pricing", 422 className: "px-8 py-4 border border-gray-600 text-white rounded-lg font-semibold text-lg hover:bg-white/10 transition-all duration-200", 423 children: "View Pricing" 424 } 425 ) 426 ] }),
427 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-8 text-sm text-gray-400", children: "No credit card required ⢠Start with free credits ⢠Cancel anytime" }) 428 ] }) }) }) 429 ] }), 430 /* @__PURE__ */ jsxRuntimeExports.jsx(Footer, {}) 431 ] }); 432}; 433const TemplateCard = ({ template, category, onClick }) => { 434 const [imageError, setImageError] = reactExports.useState(false); 435 return /* @__PURE__ */ jsxRuntimeExports.jsxs( 436 "div", 437 { 438 onClick, 439 className: "group bg-[#1a242f] rounded-lg overflow-hidden hover:shadow-lg hover:shadow-[#8A7CFF]/20 transition-all duration-300 hover:-translate-y-1 cursor-pointer", 440 children: [ 441 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative aspect-video bg-gray-800 overflow-hidden", children: [ 442 !imageError && template.thumbnail ? /* @__PURE__ */ jsxRuntimeExports.jsx( 443 "img", 444 { 445 src: template.thumbnail, 446 alt: template.title, 447 className: "w-full h-full object-cover group-hover:scale-105 transition-transform duration-300", 448 loading: "lazy", 449 onError: () => setImageError(true) 450 } 451 ) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-full h-full flex items-center justify-center bg-gradient-to-br from-gray-700 to-gray-800", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-center text-gray-400", children: [
452 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-4xl mb-2", children: category.icon }), 453 /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm font-medium", children: template.title }) 454 ] }) }), 455 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute top-2 right-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "bg-green-500 text-white text-xs px-2 py-1 rounded-full font-semibold", children: "30 credits â¡" }) }), 456 /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "bg-white/20 backdrop-blur-sm rounded-full p-3", children: /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { className: "w-6 h-6 text-white", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M8 5v14l11-7z" }) }) }) }) 457 ] }),
458 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-4", children: [ 459 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between mb-2", children: [ 460 /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "text-white text-lg font-semibold group-hover:text-[#8A7CFF] transition-colors", children: template.title }), 461 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-xs text-gray-400", children: template.duration }) 462 ] }), 463 /* @__PURE__ */ jsxRuntimeExports.jsxs("p", { className: "text-gray-400 text-sm mb-3 overflow-hidden", style: { 464 display: "-webkit-box", 465 WebkitLineClamp: 2, 466 WebkitBoxOrient: "vertical" 467 }, children: [ 468 template.prompt.substring(0, 100), 469 "..." 470 ] }), 471 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between text-xs text-gray-500 mb-3", children: [ 472 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: template.aspectRatio }),
473 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: category.title }) 474 ] }), 475 /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-wrap gap-1 mb-3", children: [ 476 template.tags.slice(0, 3).map((tag, index) => /* @__PURE__ */ jsxRuntimeExports.jsx( 477 "span", 478 { 479 className: "px-2 py-1 bg-[#2a3441] text-gray-300 text-xs rounded", 480 children: tag 481 }, 482 index 483 )), 484 template.tags.length > 3 && /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "px-2 py-1 bg-[#2a3441] text-gray-300 text-xs rounded", children: [ 485 "+", 486 template.tags.length - 3 487 ] }) 488 ] }), 489 /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "w-full py-2 px-4 bg-[#8A7CFF] text-white rounded-lg font-medium hover:bg-[#7A6CE6] transition-colors", children: "Try This Template" }) 490 ] }) 491 ] 492 } 493 ); 494}; 495 496export { Sora2Templates as default };
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.