PageSourceSearch

https://viddiai.com/

html viddiai.com collected 2026-10-06 23:51:29 UTC 191,750 bytes, 41 lines download raw bytes

1<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" as="image" href="/logo.png"/><link rel="preload" as="image" href="/logo-dark.png"/><link rel="preload" as="image" href="/images/models/seedance.ico"/><title>Free AI Video Generator Agent Online | Viddi AI</title><meta name="theme-color" content="#09090b"/><meta name="description" content="Viddi AI is your all-in-one AI video, image, and music generator agent. Generate clips, visuals, and audio from one platform — pick the capability your project needs."/><meta property="og:type" content="website"/><meta property="og:site_name" content="Viddi AI"/><meta property="og:locale" content="en"/><meta property="og:locale:alternate" content="zh_CN"/><meta property="og:title" content="Free AI Video Generator Agent Online | Viddi AI"/><meta property="og:description" content="Viddi AI is your all-in-one AI video, image, and music generator agent. Generate clips, visuals, and audio from one platform — pick the capability your project needs."/><meta property="og:url" content="https://viddiai.com/"/><meta property="og:image" content="https://viddiai.com/og.jpeg"/><meta name="twitter:title" content="Free AI Video Generator Agent Online | Viddi AI"/><meta name="twitter:description" content="Viddi AI is your all-in-one AI video, image, and music generator agent. Generate clips, visuals, and audio from one platform — pick the capability your project needs."/><meta name="twitter:url" content="https://viddiai.com/"/><meta name="twitter:card" content="summary_large_image"/><meta name="twitter:image" content="https://viddiai.com/og.jpeg"/><link rel="modulepreload" href="/assets/main-Dr7Ur_CA.js"/><link rel="modulepreload" href="/assets/index-N8CiFnkC.js"/><link rel="modulepreload" href="/assets/container-CGMUfDYj.js"/><link rel="modulepreload" href="/assets/generate-section-DxJzLeTg.js"/><link rel="modulepreload" href="/assets/footer-C6UEOTdB.js"/><link rel="modulepreload" href="/assets/faqs-qVJmjl7W.js"/><link rel="modulepreload" href="/assets/accordion-c-b5CszD.js"/><link rel="modulepreload" href="/assets/pricing-table-uJ9xHRhw.js"/><link rel="modulepreload" href="/assets/IconStarFilled-me1OXRj8.js"/><link rel="modulepreload" href="/assets/newsletter-CqvZg2ZR.js"/><link rel="modulepreload" href="/assets/useMutation-JdCt38To.js"/><link rel="modulepreload" href="/assets/dashboard-header-qTagMVb2.js"/><link rel="modulepreload" href="/assets/switch-BbojWMqt.js"/><link rel="modulepreload" href="/assets/textarea-CDFLSkOe.js"/><link rel="modulepreload" href="/assets/IconSearch-BpXh9UVs.js"/><link rel="modulepreload" href="/assets/IconClock-CbOEuRbC.js"/><link rel="modulepreload" href="/assets/IconVideo-C4AipVdq.js"/><link rel="modulepreload" href="/assets/popover-BDRglRFy.js"/><link rel="modulepreload" href="/assets/IconChevronDown-NDv1gopd.js"/><link rel="modulepreload" href="/assets/IconPlus-CS9DY6zy.js"/><link rel="modulepreload" href="/assets/image-rail-skeleton-VU6a9Eao.js"/><link rel="modulepreload" href="/assets/image-placeholder-DHsYRjB5.js"/><link rel="modulepreload" href="/assets/IconPhotoX-AGDOewMM.js"/><link rel="modulepreload" href="/assets/view-transitions-DI9Ka7KA.js"/><link rel="modulepreload" href="/assets/IconPlayerPlayFilled-KY61RsLs.js"/><link rel="modulepreload" href="/assets/badge-BfowtO_O.js"/><link rel="modulepreload" href="/assets/download-t_9I7m3H.js"/><link rel="modulepreload" href="/assets/formatter-DSiKNW4-.js"/><link rel="modulepreload" href="/assets/history-cache-BtEPrrjI.js"/><link rel="modulepreload" href="/assets/IconDownload-sRz84ZOT.js"/><link rel="modulepreload" href="/assets/IconCopy-9lz_sVdr.js"/><link rel="modulepreload" href="/assets/image-lightbox-BZPaWxGk.js"/><link rel="modulepreload" href="/assets/IconChevronLeft-BQgEJ8KU.js"/><link rel="modulepreload" href="/assets/tabs-DtyzsxuI.js"/><link rel="modulepreload" href="/assets/CompositeRoot-DTqZ8qJG.js"/><link rel="modulepreload" href="/assets/isElementDisabled-CwHw_lZC.js"/><link rel="modulepreload" href="/assets/toggle-group-DVGxZeXr.js"/><link rel="modulepreload" href="/assets/price-plan-Hy7tuV8t.js"/><link rel="modulepreload" href="/assets/models-WOgIik7l.js"/><link rel="modulepreload" href="/assets/use-creation-4xzfTSyX.js"/><link rel="modulepreload" href="/assets/IconMailFilled-Bnxnpes4.js"/><link rel="modulepreload" href="/assets/IconChevronUp-B_-Ld2VQ.js"/><link rel="modulepreload" href="/assets/payment-E_aVS6ve.js"/><link rel="modulepreload" href="/assets/select-DvQ_4pL_.js"/><link rel="modulepreload" href="/assets/IconCircleX-Bpb_KOjk.js"/><link rel="modulepreload" href="/assets/IconArrowLeft-D19EBHVj.js"/><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="icon" href="/favicon.ico"/><link rel="manifest" href="/manifest.json"/><link rel="canonical" href="https://viddiai.com/"/><link rel="alternate" hrefLang="en" href="https://viddiai.com/"/><link rel="alternate" hrefLang="zh-CN" href="https://viddiai.com/zh/"/><link rel="alternate" hrefLang="x-default" href="https://viddiai.com/"/><link rel="stylesheet" href="/assets/styles-CCqKmAqS.css"/>
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"WebSite","name":"Viddi AI","description":"Viddi AI is your all-in-one AI video, image, and music generator agent. Generate clips, visuals, and audio from one platform — pick the capability your project needs.","url":"https://viddiai.com/","inLanguage":"en"}</script>
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","mainEntity":[{"@type":"Question","name":"What can Viddi AI create?","acceptedAnswer":{"@type":"Answer","text":"Viddi AI is an all-in-one AI agent for video, image, and music. Pick the capability your project needs — generate clips, visuals, or audio from one account without switching tools."}},{"@type":"Question","name":"Is there a free tier?","acceptedAnswer":{"@type":"Answer","text":"Yes. New accounts receive free credits to try video, image, and music generation. No card required to start. Paid plans add more credits and faster queues."}},{"@type":"Question","name":"Can I generate images and music, not just video?","acceptedAnswer":{"@type":"Answer","text":"Absolutely. Generate images for thumbnails and posts, music for soundtracks and loops, and videos for Shorts, Reels, and long-form — all from the same platform."}},{"@type":"Question","name":"How is this different from using separate AI tools?","acceptedAnswer":{"@type":"Answer","text":"Separate apps mean separate logins, credits, and workflows. Viddi AI keeps video, image, and music in one place so you can switch capabilities as your project evolves."}},{"@type":"Question","name":"How much does Viddi AI cost?","acceptedA
1nswer":{"@type":"Answer","text":"Viddi AI offers a free tier with credits to try video, image, and music generation. Paid plans start at $19.80/month for more credits, priority processing, and higher resolutions."}},{"@type":"Question","name":"Is there a limit on how many files I can generate?","acceptedAnswer":{"@type":"Answer","text":"Your generation limit depends on your credit balance. Free accounts receive credits on signup. Paid plans refill monthly and unused credits roll over with most plans."}},{"@type":"Question","name":"What formats and resolutions are supported?","acceptedAnswer":{"@type":"Answer","text":"Video supports up to 1080p native resolution. Images support multiple aspect ratios and formats. Music generates high-quality audio loops and tracks. Resolution limits scale with your plan tier."}},{"@type":"Question","name":"Are my files and data private?","acceptedAnswer":{"@type":"Answer","text":"Yes. Your uploaded reference assets and generated outputs are private to your account. We do not train on your content. See our privacy policy for full details."}}]}</script>
1<script type="application/ld+json">{"@context":"https://schema.org","@type":"HowTo","name":"How it works","description":"How the AI video agent works in three steps","step":[{"@type":"HowToStep","position":1,"name":"Pick your medium","text":"Choose video, image, or music — whatever your project needs right now."},{"@type":"HowToStep","position":2,"name":"Describe and generate","text":"Write a prompt or upload a reference. AI models tuned for each media type handle the rest."},{"@type":"HowToStep","position":3,"name":"Export and publish","text":"Download your asset ready for your editor, feed, or campaign — commercial rights included."}]}</script>
1</head><body>
1<script>(function() {
2  try {
3    var theme = localStorage.getItem('theme') || 'dark';
4    var systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
5    var resolved = theme === 'system' ? systemTheme : theme;
6    document.documentElement.classList.add(resolved);
7  } catch (e) {
8    document.documentElement.classList.add('dark');
9  }
10})();;document.currentScript.remove()</script>
10<div data-slot="sidebar-wrapper" style="--sidebar-width:calc(var(--spacing) * 72);--sidebar-width-icon:3rem;--header-height:calc(var(--spacing) * 12)" class="group/sidebar-wrapper w-full has-data-[variant=inset]:bg-sidebar flex min-h-svh"><div class="group peer hidden text-sidebar-foreground md:block" data-state="expanded" data-collapsible="" data-variant="inset" data-side="left" data-slot="sidebar"><div data-slot="sidebar-gap" class="relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear group-data-[collapsible=offcanvas]:w-0 group-data-[side=right]:rotate-180 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]"></div><div data-slot="sidebar-container" data-side="left" class="fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]"><div data-sidebar="sidebar" data-slot="sidebar-inner" class="flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border"><div data-slot="sidebar-header" data-sidebar="header" class="flex flex-col gap-2 p-2"><ul data-slot="sidebar-menu" data-sidebar="menu" class="flex w-full min-w-0 flex-col gap-0"><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm data-[slot=sidebar-menu-button]:!p-1.5 active" href="/" data-status="active" aria-current="page"><img src="/logo.png" alt="Viddi AI logo" class="rounded-md dark:hidden size-5" width="32" height="32" decoding="async"/><img src="/logo-dark.png" alt="Viddi AI logo" class="rounded-md hidden dark:block size-5" width="32" height="32" decoding="async"/><span class="truncate font-semibold text-base">Viddi AI</span></a></li></ul></div><div data-slot="sidebar-content" data-sidebar="content" class="no-scrollbar flex min-h-0 flex-1 flex-col gap-0 overflow-auto group-data-[collapsible=icon]:overflow-hidden"><div data-slot="sidebar-group" data-sidebar="group" class="relative flex w-full min-w-0 flex-col p-2"><div data-slot="sidebar-group-content" data-sidebar="group-content" class="w-full text-sm flex flex-col gap-0.5"><ul data-slot="sidebar-menu" data-sidebar="menu" class="flex w-full min-w-0 flex-col gap-0"><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" data-active="" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm active" href="/" data-status="active" aria-current="page"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-home size-4 shrink-0"><path d="M5 12l-2 0l9 -9l9 9l-2 0"></path><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7"></path><path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6"></path></svg><span class="truncate font-medium text-sm">Home</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focu
10s-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm active" href="/#generate" data-status="active" aria-current="page"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-sparkles size-4 shrink-0"><path d="M16 18a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m0 -12a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m-7 12a6 6 0 0 1 6 -6a6 6 0 0 1 -6 -6a6 6 0 0 1 -6 6a6 6 0 0 1 6 6"></path></svg><span class="truncate font-medium text-sm">Generate</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/favorites" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-star size-4 shrink-0"><path d="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873l-6.158 -3.245"></path></svg><span class="truncate font-medium text-sm">Favorites</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/history" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-history size-4 shrink-0"><path d="M12 8l0 4l2 2"></path><path d="M3.05 11a9 9 0 1 1 .5 4m-.5 5v-5h5"></path></svg><span class="truncate font-medium text-sm">History</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/pricing" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focu
10s-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-credit-card size-4 shrink-0"><path d="M3 8a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3l0 -8"></path><path d="M3 10l18 0"></path><path d="M7 15l.01 0"></path><path d="M11 15l2 0"></path></svg><span class="truncate font-medium text-sm">Pricing</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/blog" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-news size-4 shrink-0"><path d="M16 6h3a1 1 0 0 1 1 1v11a2 2 0 0 1 -4 0v-13a1 1 0 0 0 -1 -1h-10a1 1 0 0 0 -1 1v12a3 3 0 0 0 3 3h11"></path><path d="M8 8l4 0"></path><path d="M8 12l4 0"></path><path d="M8 16l4 0"></path></svg><span class="truncate font-medium text-sm">Blog</span></a></li></ul></div></div><div data-slot="sidebar-group" data-sidebar="group" class="relative flex w-full min-w-0 flex-col p-2"><div data-slot="sidebar-group-label" data-sidebar="group-label" class="flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&amp;&gt;svg]:size-4 [&amp;&gt;svg]:shrink-0">Tool</div><div data-slot="sidebar-group-content" data-sidebar="group-content" class="w-full text-sm flex flex-col gap-0.5"><ul data-slot="sidebar-menu" data-sidebar="menu" class="flex w-full min-w-0 flex-col gap-0"><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/yeri-ai-image-generator" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-wand size-4 shrink-0"><path d="M6 21l15 -15l-3 -3l-15 15l3 3"></path><path d="M15 6l3 3"></path><path d="M9 3a2 2 0 0 0 2 2a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2a2 2 0 0 0 2 -2"></path><path d="M19 13a2 2 0 0 0 2 2a2 2 0 0 0 -2 2a2 2 0 0 0 -2 -2a2 2 0 0 0 2 -2"></path></svg><span class="truncate font-medium text-sm">Yeri AI Image Generator</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/bigjpg" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focu
10s-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-arrows-maximize size-4 shrink-0"><path d="M16 4l4 0l0 4"></path><path d="M14 10l6 -6"></path><path d="M8 20l-4 0l0 -4"></path><path d="M4 20l6 -6"></path><path d="M16 20l4 0l0 -4"></path><path d="M14 14l6 6"></path><path d="M8 4l-4 0l0 4"></path><path d="M4 4l6 6"></path></svg><span class="truncate font-medium text-sm">Bigjpg Image Upscaler</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/pixel-dissolve" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-atom size-4 shrink-0"><path d="M12 12v.01"></path><path d="M19.071 4.929c-1.562 -1.562 -6 .337 -9.9 4.243c-3.905 3.905 -5.804 8.337 -4.242 9.9c1.562 1.561 6 -.338 9.9 -4.244c3.905 -3.905 5.804 -8.337 4.242 -9.9"></path><path d="M4.929 4.929c-1.562 1.562 .337 6 4.243 9.9c3.905 3.905 8.337 5.804 9.9 4.242c1.561 -1.562 -.338 -6 -4.244 -9.9c-3.905 -3.905 -8.337 -5.804 -9.9 -4.242"></path></svg><span class="truncate font-medium text-sm">Pixel Dissolve</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/purupuru-maker" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brush size-4 shrink-0"><path d="M3 21v-4a4 4 0 1 1 4 4h-4"></path><path d="M21 3a16 16 0 0 0 -12.8 10.2"></path><path d="M21 3a16 16 0 0 1 -10.2 12.8"></path><path d="M10.6 9a9 9 0 0 1 4.4 4.4"></path></svg><span class="truncate font-medium text-sm">PuruPuru Maker</span></a></li><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><a data-slot="sidebar-menu-button" data-sidebar="menu-button" data-size="default" href="/oakgen-ai" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focu
10s-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:bg-sidebar-accent hover:text-sidebar-accent-foreground h-8 text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-microphone size-4 shrink-0"><path d="M9 5a3 3 0 0 1 3 -3a3 3 0 0 1 3 3v5a3 3 0 0 1 -3 3a3 3 0 0 1 -3 -3l0 -5"></path><path d="M5 10a7 7 0 0 0 14 0"></path><path d="M8 21l8 0"></path><path d="M12 17l0 4"></path></svg><span class="truncate font-medium text-sm">OakGen AI Alternative</span></a></li></ul></div></div></div><div data-slot="sidebar-footer" data-sidebar="footer" class="p-2 flex flex-col gap-4"><ul data-slot="sidebar-menu" data-sidebar="menu" class="flex w-full min-w-0 flex-col gap-0 border-t pt-4"><li data-slot="sidebar-menu-item" data-sidebar="menu-item" class="group/menu-item relative"><button type="button" data-slot="dropdown-menu-trigger" data-sidebar="menu-button" data-size="lg" class="peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 [&amp;&gt;span:last-child]:truncate hover:text-sidebar-accent-foreground h-12 text-sm group-data-[collapsible=icon]:p-0! bg-sidebar-accent/60 text-sidebar-accent-foreground hover:bg-sidebar-accent data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground" tabindex="0" aria-haspopup="menu" id="base-ui-_R_6uaoq_"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-8 border"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0"><span class="sr-only">User</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-user size-4"><path d="M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0"></path><path d="M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path></svg></span></span><div class="grid flex-1 text-left text-sm leading-tight"><span class="truncate font-semibold">Guest</span><span class="truncate text-xs text-muted-foreground">Not signed in</span></div><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector ml-auto size-4"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path></svg></button></li></ul></div></div></div></div><main data-slot="sidebar-inset" class="relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2"><div class="min-w-0 flex-1 flex flex-col"><!--$--><div class="flex min-h-svh flex-col"><header class="sticky top-0 z-50 flex h-(--header-height) shrink-0 items-center border-b bg-background transition-[width,height] ease-linear md:rounded-t-xl group-has-data-[collapsible=icon]/sidebar-wrapper:h-(--header-height)"><div class="flex w-full min-w-0 items-center gap-2 px-4 lg:px-6">
10<button type="button" tabindex="0" data-slot="sidebar-trigger" data-sidebar="trigger" class="group/button inline-flex items-center justify-center border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg -ml-1 shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-layout-sidebar "><path d="M4 6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2l0 -12"></path><path d="M9 4l0 16"></path></svg><span class="sr-only">Toggle Sidebar</span></button><div class="flex min-w-0 flex-1 items-center"></div><div class="ml-auto flex shrink-0 items-center gap-3 pl-4"><a title="Credits" href="/settings/credits" class="flex h-8 items-center gap-1.5 rounded-md border px-2.5 text-sm transition-colors hover:bg-accent"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-coins size-4 text-amber-500"><path d="M9 14c0 1.657 2.686 3 6 3s6 -1.343 6 -3s-2.686 -3 -6 -3s-6 1.343 -6 3"></path><path d="M9 14v4c0 1.656 2.686 3 6 3s6 -1.344 6 -3v-4"></path><path d="M3 6c0 1.072 1.144 2.062 3 2.598s4.144 .536 6 0c1.856 -.536 3 -1.526 3 -2.598c0 -1.072 -1.144 -2.062 -3 -2.598s-4.144 -.536 -6 0c-1.856 .536 -3 1.526 -3 2.598"></path><path d="M3 6v10c0 .888 .772 1.45 2 2"></path><path d="M3 11c0 .888 .772 1.45 2 2"></path></svg><span class="font-medium">0</span></a><div data-slot="skeleton" class="animate-pulse bg-muted h-8 w-16 rounded-md"></div><button type="button" tabindex="0" aria-haspopup="menu" id="base-ui-_R_e85ioq_" data-slot="dropdown-menu-trigger" aria-label="language" class="flex size-8 shrink-0 items-center justify-center rounded-full border border-border bg-transparent p-0 hover:bg-accent"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-language size-4"><path d="M9 6.371c0 4.418 -2.239 6.629 -5 6.629"></path><path d="M4 6.371h7"></path><path d="M5 9c0 2.144 2.252 3.908 6 4"></path><path d="M12 20l4 -9l4 9"></path><path d="M19.1 18h-6.2"></path><path d="M6.694 3l.793 .582"></path></svg></button><button type="button" tabindex="0" aria-haspopup="menu" id="base-ui-_R_eo5ioq_" data-slot="dropdown-menu-trigger" aria-label="Toggle theme" class="flex size-8 shrink-0 items-center justify-center rounded-full border border-border bg-transparent p-0 hover:bg-accent"><span class="relative inline-flex size-4 items-center justify-center"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-sun size-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0"><path d="M8 12a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path><path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-moon absolute size-4 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100"><path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454l0 .008"></path></svg></span></button></div></div></header><section id="hero" class="relative overflow-hidden"><div class="relative pt-8 sm:pt-10"><div class="container mx-auto max-w-7xl px-6"><div class="text-center sm:mx-auto lg:mr-auto lg:mt-0"><h1 class="animate-fade-up delay-1 text-balance text-3xl font-bold sm:text-4xl md:text-5xl xl:text-[4rem]">AI Video Generator Agent | Viddi AI</h1><p class="animate-fade-up delay-2 mx-auto mt-4 max-w-4xl text-balance text-base text-muted-foreground sm:text-lg">Video, image, and music in one agent. Describe your idea, pick a medium, and get publish-ready output in seconds.</p></div></div></div></section><section id="generate"><div class="[&amp;_button:not(:disabled)]:cursor-pointer flex flex-col"><div class="flex flex-col px-4 py-8 md:py-12"><div data-testid="embedded-generator-layout" class="grid w-full gap-6 min-h-[32rem] lg:min-h-[36rem] lg:items-start lg:grid-cols-[minmax(420px,520px)_minmax(0,1fr)]"><div class="flex min-w-0 animate-in fade-in zoom-in-95 slide-in-from-bottom-4 duration-500 ease-out lg:overflow-y-auto *:w-full"><aside class="flex min-h-0 flex-col gap-4 overflow-y-auto rounded-2xl border bg-card p-6 shadow-sm lg:h-full"><div class="space-y-1.5"><div class="flex items-center justify-between gap-2"><div class="flex items-center gap-1.5"><label data-slot="label" class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50">Mode</label></div></div><div class="flex flex-wrap gap-1 rounded-lg bg-muted p-1 w-full"><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all min-w-0 flex-1 text-muted-foreground hover:text-sky-600 dark:hover:text-sky-400"><span>Image</span></button><button type="button" aria-pressed="true" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all min-w-0 flex-1 bg-sky-500/15 text-sky-700 ring-1 ring-sky-500/30 dark:text-sky-300 dark:ring-sky-500/40"><span>Video</span></button></div></div><div class="flex flex-col gap-1.5"><div class="flex items-center justify-between gap-2"><div class="flex items-center gap-1.5"><label data-slot="label" class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50">Video model</label></div></div><div class="relative h-9 w-full"><button type="button" tabindex="0" data-slot="popover-trigger" data-base-ui-click-trigger="" id="base-ui-_R_1m99idioq_" aria-haspopup="dialog" aria-expanded="false" aria-label="Video model" class="group/button inline-flex shrink-0 items-center rounded-lg border bg-clip-padding text-sm whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-
10px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 border-border hover:bg-muted hover:text-foreground aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50 gap-1.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 absolute inset-0 h-9 w-full cursor-pointer justify-between bg-muted/50 px-3 font-normal shadow-none focus-visible:ring-0 aria-expanded:bg-muted/50"><span class="flex min-w-0 items-center gap-2"><img src="/images/models/seedance.ico" alt="" class="shrink-0 rounded-md object-cover size-4"/><span class="truncate">Seedance 2.5 Mini</span></span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down size-4 shrink-0 text-muted-foreground"><path d="M6 9l6 6l6 -6"></path></svg></button></div></div><div class="space-y-1.5"><div class="flex items-center justify-between gap-2"><div class="flex items-center gap-1.5"><label data-slot="label" class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50">Generation mode</label></div></div><div class="flex flex-wrap gap-1 rounded-lg bg-muted p-1 w-full"><button type="button" aria-pressed="true" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all min-w-0 flex-1 bg-sky-500/15 text-sky-700 ring-1 ring-sky-500/30 dark:text-sky-300 dark:ring-sky-500/40"><span>Text to Video</span><span class="inline-flex items-center gap-0.5 rounded px-1 text-[10px] tabular-nums bg-background/60"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-coins size-2.5"><path d="M9 14c0 1.657 2.686 3 6 3s6 -1.343 6 -3s-2.686 -3 -6 -3s-6 1.343 -6 3"></path><path d="M9 14v4c0 1.656 2.686 3 6 3s6 -1.344 6 -3v-4"></path><path d="M3 6c0 1.072 1.144 2.062 3 2.598s4.144 .536 6 0c1.856 -.536 3 -1.526 3 -2.598c0 -1.072 -1.144 -2.062 -3 -2.598s-4.144 -.536 -6 0c-1.856 .536 -3 1.526 -3 2.598"></path><path d="M3 6v10c0 .888 .772 1.45 2 2"></path><path d="M3 11c0 .888 .772 1.45 2 2"></path></svg>40</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all min-w-0 flex-1 text-muted-foreground hover:text-sky-600 dark:hover:text-sky-400"><span>Image to Video</span><span class="inline-flex items-center gap-0.5 rounded px-1 text-[10px] tabular-nums text-muted-foreground/70"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-coins size-2.5"><path d="M9 14c0 1.657 2.686 3 6 3s6 -1.343 6 -3s-2.686 -3 -6 -3s-6 1.343 -6 3"></path><path d="M9 14v4c0 1.656 2.686 3 6 3s6 -1.344 6 -3v-4"></path><path d="M3 6c0 1.072 1.144 2.062 3 2.598s4.144 .536 6 0c1.856 -.536 3 -1.526 3 -2.598c0 -1.072 -1.144 -2.062 -3 -2.598s-4.144 -.536 -6 0c-1.856 .536 -3 1.526 -3 2.598"></path><path d="M3 6v10c0 .888 .772 1.45 2 2"></path><path d="M3 11c0 .888 .772 1.45 2 2"></path></svg>40</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all min-w-0 flex-1 text-muted-foreground hover:text-sky-600 dark:hover:text-sky-400"><span>Reference to Video</span><span class="inline-flex items-center gap-0.5 rounded px-1 text-[10px] tabular-nums text-muted-foreground
10/70"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-coins size-2.5"><path d="M9 14c0 1.657 2.686 3 6 3s6 -1.343 6 -3s-2.686 -3 -6 -3s-6 1.343 -6 3"></path><path d="M9 14v4c0 1.656 2.686 3 6 3s6 -1.344 6 -3v-4"></path><path d="M3 6c0 1.072 1.144 2.062 3 2.598s4.144 .536 6 0c1.856 -.536 3 -1.526 3 -2.598c0 -1.072 -1.144 -2.062 -3 -2.598s-4.144 -.536 -6 0c-1.856 .536 -3 1.526 -3 2.598"></path><path d="M3 6v10c0 .888 .772 1.45 2 2"></path><path d="M3 11c0 .888 .772 1.45 2 2"></path></svg>40</span></button></div></div><div class="space-y-2"><div class="flex items-center justify-between gap-2"><div class="flex items-center gap-1.5"><label data-slot="label" class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50" for="generate-prompt">Prompt</label></div></div><div class="relative"><textarea data-slot="textarea" class="flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 h-36 max-h-64 resize-none overflow-y-auto" id="generate-prompt" data-testid="generator-prompt" placeholder="A silver camera slowly rotating on a warm yellow pedestal, cinematic product video, soft studio lighting.">A silver camera slowly rotating on a warm yellow pedestal, cinematic product video, soft studio lighting.</textarea></div></div><div class="space-y-4"><div class="space-y-1.5"><div class="flex items-center justify-between gap-2"><div class="flex items-center gap-1.5"><label data-slot="label" class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50">Aspect Ratio</label></div></div><div class="flex flex-wrap gap-1 rounded-lg bg-muted p-1"><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all text-muted-foreground hover:text-amber-600 dark:hover:text-amber-400"><span>Adaptive</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all text-muted-foreground hover:text-amber-600 dark:hover:text-amber-400"><span>16:9</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all text-muted-foreground hover:text-amber-600 dark:hover:text-amber-400"><span>9:16</span></button><button type="button" aria-pressed="true" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all bg-amber-500/15 text-amber-700 ring-1 ring-amber-500/30 dark:text-amber-300 dark:ring-amber-500/40"><span>1:1</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all text-muted-foreground hover:text-amber-600 dark:hover:text-amber-400"><span>3:4</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all text-muted-foreground hover:text-amber-600 dark:hover:text-amber-400"><span>4:3</span></button></div></div><div class="space-y-3 rounded-xl border bg-muted/20 p-3"><div class="flex items-center justify-between gap-3"><div class="space-y-0.5"><p class="font-medium text-sm">Generate AI audio</p><p class="text-muted-foreground text-xs">Generate audio that matches the video.</p></div><span data-unchecked="" role="switch" tabindex="0" id="base-ui-_R_ijpidioq_" aria-checked="false" data-slot="switch" data-size="default" aria-label="Generate audio" class="peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50"><span data-unchecked="" data-slot="switch-thumb" class="pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dar
10k:data-unchecked:bg-foreground"></span></span><input id="base-ui-_R_ijpidioqH1_" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" type="checkbox" aria-hidden="true"/></div></div><div class="space-y-1.5"><div class="flex items-center justify-between gap-2"><div class="flex items-center gap-1.5"><label data-slot="label" class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50">Resolution</label></div></div><div class="flex flex-wrap gap-1 rounded-lg bg-muted p-1"><button type="button" aria-pressed="true" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all bg-sky-500/15 text-sky-700 ring-1 ring-sky-500/30 dark:text-sky-300 dark:ring-sky-500/40"><span>480p</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all text-muted-foreground hover:text-sky-600 dark:hover:text-sky-400"><span>720p</span></button><button type="button" aria-pressed="false" class="inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 font-medium text-xs transition-all text-muted-foreground hover:text-sky-600 dark:hover:text-sky-400"><span>1080p</span></button></div></div><div class="space-y-3"><div class="flex items-center justify-between gap-2"><div class="flex items-center gap-1.5"><label data-slot="label" class="flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50">Duration</label></div><span class="rounded-md bg-sky-500/10 px-2 py-0.5 font-medium text-sky-700 text-xs tabular-nums ring-1 ring-sky-500/30 dark:text-sky-300 dark:ring-sky-500/40">5<!-- -->s</span></div><input type="range" min="2" max="30" step="1" aria-label="Video duration" class="h-2 w-full cursor-grab appearance-none rounded-full bg-muted accent-sky-500 active:cursor-grabbing" value="5"/><div class="flex justify-between text-muted-foreground text-xs tabular-nums"><span>2<!-- -->s</span><span>30<!-- -->s</span></div></div></div><div class="mt-auto flex flex-col gap-2 pt-2"><button type="button" class="w-full cursor-pointer rounded-xl border border-amber-200 bg-amber-50 px-3 py-2 text-left text-amber-900 text-sm dark:border-amber-500/30 dark:bg-amber-500/10 dark:text-amber-100">Not enough credits. Sign in to claim your free credits.</button><p class="text-center text-muted-foreground text-xs tabular-nums">Costs 40 credits · 0 remaining</p><button type="button" tabindex="0" data-slot="button" class="group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 bg-primary text-primary-foreground [a]:hover:bg-primary/80 h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 w-full shadow-sm hover:bg-primary/90 hover:shadow-md"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-sparkles size-4"><path d="M16 18a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m0 -12a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m-7 12a6 6 0 0 1 6 -6a6 6 0 0 1 -6 -6a6 6 0 0 1 -6 6a6 6 0 0 1 6 6"></path></svg>Generate</button><p class="text-center text-muted-foreground text-xs">Credits will be automatically refunded if generation fails.</p></div></aside></div><div data-testid="embedded-generator-result" class="flex min-w-0 animate-in fade-in slide-in-from-right-6 fill-mode-both delay-100 duration-500 ease-out lg:overflow-hidden lg:sticky lg:top-20 lg:h-[c
10alc(100svh-6rem)] lg:max-h-[48rem] lg:min-h-[36rem] lg:self-start"><div data-orientation="horizontal" data-activation-direction="none" data-slot="tabs" class="group/tabs gap-2 data-horizontal:flex-col flex min-h-0 w-full flex-col"><div data-orientation="horizontal" data-activation-direction="none" role="tablist" data-slot="tabs-list" data-variant="line" class="group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none gap-1 bg-transparent mb-3 self-start"><button type="button" data-orientation="horizontal" aria-disabled="false" tabindex="-1" role="tab" aria-selected="false" id="base-ui-_R_2tidioq_" data-slot="tabs-trigger" class="relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100">History</button><button type="button" data-active="" data-orientation="horizontal" aria-disabled="false" tabindex="-1" role="tab" aria-selected="true" id="base-ui-_R_4tidioq_" data-composite-item-active="" data-slot="tabs-trigger" class="relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100">Examples</button></div><div data-orientation="horizontal" data-activation-direction="none" id="base-ui-_R_1didioq_" role="tabpanel" tabindex="0" data-index="-1" data-slot="tabs-content" 
10class="text-sm outline-none min-h-0 flex-1"><div class="rounded-2xl border bg-card p-4 shadow-sm lg:h-full lg:overflow-y-auto"><button type="button" class="group relative block aspect-video w-full overflow-hidden rounded-lg border bg-muted"><img src="/og.jpeg" alt="Viddi AI generation example" loading="lazy" decoding="async" class="h-full w-full object-cover"/><span class="absolute inset-0 flex items-center justify-center bg-black/0 text-white transition-colors group-hover:bg-black/20"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-maximize size-6 opacity-0 transition-opacity group-hover:opacity-100"><path d="M4 8v-2a2 2 0 0 1 2 -2h2"></path><path d="M4 16v2a2 2 0 0 0 2 2h2"></path><path d="M16 4h2a2 2 0 0 1 2 2v2"></path><path d="M16 20h2a2 2 0 0 0 2 -2v-2"></path></svg></span></button></div></div></div></div></div></div></div></section><section id="features" class="px-4 py-16 md:py-24"><div class="mx-auto max-w-6xl px-2 lg:px-0 space-y-8 lg:space-y-20 dark:[--color-border:color-mix(in_oklab,var(--color-white)_10%,transparent)]"><div class="reveal-visible"><div class="flex flex-col items-center text-center gap-4"><p class="uppercase tracking-wider text-primary font-semibold">Three creative powers, one agent</p><h2 class="text-balance text-2xl text-foreground">What your AI video generator can do</h2><p class="text-balance text-lg text-muted-foreground">Switch between video, image, and music as your project needs — not locked into one media type or one workflow.</p></div></div><div class="reveal-visible" style="animation-delay:150ms"><div class="grid gap-12 lg:grid-cols-12 lg:gap-24"><div class="flex flex-col gap-8 lg:col-span-5"><div class="text-left lg:pr-0"><h3 class="py-1 text-3xl font-semibold leading-normal text-foreground lg:text-4xl">Three creative powers, one agent</h3><p class="mt-4 text-muted-foreground">Switch between video, image, and music as your project needs — not locked into one media type or one workflow.</p></div><div data-orientation="vertical" dir="ltr" role="region" data-slot="accordion" class="flex flex-col w-full"><div data-orientation="vertical" data-index="-1" data-open="" data-slot="accordion-item" class="not-last:border-b"><h3 data-orientation="vertical" data-index="-1" data-open="" class="flex"><button type="button" data-value="item-1" data-orientation="vertical" data-index="-1" data-panel-open="" aria-disabled="false" aria-controls="base-ui-_R_6chioqH1_" aria-expanded="true" id="base-ui-_R_6chioqH2_" tabindex="0" data-slot="accordion-trigger" class="group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground"><div class="flex items-center gap-2 text-base"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-database size-4"><path d="M4 6a8 3 0 1 0 16 0a8 3 0 1 0 -16 0"></path><path d="M4 6v6a8 3 0 0 0 16 0v-6"></path><path d="M4 12v6a8 3 0 0 0 16 0v-6"></path></svg>Video generation</div><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" data-slot="accordion-trigger-icon"><path d="M6 9l6 6l6 -6"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-up pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" data-slot="accordion-trigger-icon"><path d="M6 15l6 -6l6 6"></path></svg></button></h3><div data-orientation="vertical" data-index="-1" data-open="" id="base-ui-_R_6chioqH1_" aria-labelledby="base-ui-_R_6chioqH2_" role="region" style="--accordion-panel-height:auto;--accordion-panel-width:auto;
10animation-name:none" data-slot="accordion-content" class="overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up"><div class="h-(--accordion-panel-height) pt-0 pb-2.5 data-ending-style:h-0 data-starting-style:h-0 [&amp;_a]:underline [&amp;_a]:underline-offset-3 [&amp;_a]:hover:text-foreground [&amp;_p:not(:last-child)]:mb-4 text-muted-foreground">Create clips, motion content, and short-form video from text prompts or reference assets.</div></div></div><div data-orientation="vertical" data-hidden="" data-index="-1" data-closed="" data-slot="accordion-item" class="not-last:border-b"><h3 data-orientation="vertical" data-hidden="" data-index="-1" data-closed="" class="flex"><button type="button" data-value="item-1" data-orientation="vertical" data-hidden="" data-index="-1" aria-disabled="false" aria-expanded="false" id="base-ui-_R_achioqH2_" tabindex="0" data-slot="accordion-trigger" class="group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground"><div class="flex items-center gap-2 text-base"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-fingerprint size-4"><path d="M18.9 7a8 8 0 0 1 1.1 5v1a6 6 0 0 0 .8 3"></path><path d="M8 11a4 4 0 0 1 8 0v1a10 10 0 0 0 2 6"></path><path d="M12 11v2a14 14 0 0 0 2.5 8"></path><path d="M8 15a18 18 0 0 0 1.8 6"></path><path d="M4.9 19a22 22 0 0 1 -.9 -7v-1a8 8 0 0 1 12 -6.95"></path></svg>Image generation</div><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" data-slot="accordion-trigger-icon"><path d="M6 9l6 6l6 -6"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-up pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" data-slot="accordion-trigger-icon"><path d="M6 15l6 -6l6 6"></path></svg></button></h3></div><div data-orientation="vertical" data-hidden="" data-index="-1" data-closed="" data-slot="accordion-item" class="not-last:border-b"><h3 data-orientation="vertical" data-hidden="" data-index="-1" data-closed="" class="flex"><button type="button" data-value="item-1" data-orientation="vertical" data-hidden="" data-index="-1" aria-disabled="false" aria-expanded="false" id="base-ui-_R_echioqH2_" tabindex="0" data-slot="accordion-trigger" class="group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground"><div class="flex items-center gap-2 text-base"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-id size-4"><path d="M3 7a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v10a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3l0 -10"></path><path d="M7 10a2 2 0 1 0 4 0a2 2 0 1 0 -4 0"></path><path d="M15 8l2 0"></path><path d="M15 12l2 0"></path><path d="M7 16l10 0"></path></svg>Music generation</div><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" data-slot="accordion-trigger-icon"><path d="M6 9l6 6l6 -6"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-up pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" data-slot="accordion-trigger-icon"><path d="M6 15l6 -6l6 6"></path></svg></button></h3></div><div data-orientation="vertical" data-hidden="" data-index="-1" data-closed="" data-slot="accordion-item" class="not-last:border-b"><h3 data-orientation="vertical" data-hidden="" data-index="-1" data-closed="" class="flex"><button type="button" data-value="item-1" data-orientation="vertical" data-hidden="" data-index="-1" aria-disabled="false" aria-expanded="false" id="base-ui-_R_ichioqH2_" tabindex="0" data-slot="accordion-trigger" class="group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground"><div class="flex items-center gap-2 text-base"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chart-bar size-4"><path d="M3 13a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v6a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -6"></path><path d="M15 9a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v10a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -10"></path><path d="M9 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v14a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -14"></path><path d="M4 20h14"></path></svg>Unified credits</div><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-down pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" data-slot="accordion-trigger-icon"><path d="M6 9l6 6l6 -6"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-chevron-up pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" data-slot="accordion-trigger-icon"><path d="M6 15l6 -6l6 6"></path></svg></button></h3></div></div></div><div class="relative flex w-full overflow-hidden rounded-2xl border bg-background p-2 lg:col-span-7 lg:h-auto"><div class="relative w-full rounded-2xl aspect-76/59 bg-background"><div class="animate-crossfade-in size-full overflow-hidden rounded-2xl border bg-muted shadow-md"><img src="/images/home/features-video-light.png" alt="AI video generation interface showing text-to-vi
10deo results" loading="lazy" class="size-full object-cover object-top-left rounded-2xl dark:hidden"/><img src="/images/home/features-video-light.png" alt="AI video generation interface showing text-to-video results" loading="lazy" class="hidden size-full object-cover object-top-left rounded-2xl dark:block"/></div></div></div></div></div></div></section><section id="how-it-works" class="px-4 py-16 md:py-24"><div class="mx-auto max-w-6xl"><div class="reveal-visible"><div class="flex flex-col items-center text-center gap-4"><p class="uppercase tracking-wider text-primary font-semibold">How it works</p><h2 class="text-balance text-2xl text-foreground">How the AI video agent works in three steps</h2></div></div><div class="mt-12 lg:hidden"><div class="grid overflow-hidden rounded-2xl border bg-background p-2"><div class="overflow-hidden rounded-2xl bg-muted/50 col-start-1 row-start-1 border-0 shadow-none transition-opacity duration-300 opacity-100"><img src="/images/home/how-step-1-light.png" alt="Pick video, image, or music for your project" loading="lazy" class="aspect-76/59 w-full object-cover object-top dark:hidden"/><img src="https://cdn.mksaas.com/blocks/music.png" alt="Pick video, image, or music for your project" loading="lazy" class="hidden aspect-76/59 w-full object-cover object-top dark:block"/></div><div class="overflow-hidden rounded-2xl bg-muted/50 col-start-1 row-start-1 border-0 shadow-none transition-opacity duration-300 pointer-events-none opacity-0"><img src="/images/home/how-step-2-light.png" alt="Describe your idea and generate with AI" loading="lazy" class="aspect-76/59 w-full object-cover object-top dark:hidden"/><img src="https://cdn.mksaas.com/blocks/charts.png" alt="Describe your idea and generate with AI" loading="lazy" class="hidden aspect-76/59 w-full object-cover object-top dark:block"/></div><div class="overflow-hidden rounded-2xl bg-muted/50 col-start-1 row-start-1 border-0 shadow-none transition-opacity duration-300 pointer-events-none opacity-0"><img src="/images/home/how-step-3-light.png" alt="Export and publish your finished asset" loading="lazy" class="aspect-76/59 w-full object-cover object-top dark:hidden"/><img src="https://cdn.mksaas.com/blocks/dark-card.webp" alt="Export and publish your finished asset" loading="lazy" class="hidden aspect-76/59 w-full object-cover object-top dark:block"/></div></div><div class="mt-4 grid grid-cols-3 gap-2"><button type="button" aria-pressed="true" class="flex cursor-pointer touch-manipulation flex-col items-center gap-1 rounded-xl border px-2 py-3 text-center transition-colors border-primary/40 bg-primary/5"><span class="flex size-9 items-center justify-center rounded-lg border bg-background text-sm font-bold" style="color:#60a5fa">1</span><span class="text-xs leading-tight font-medium">Pick your medium</span></button><button type="button" aria-pressed="false" class="flex cursor-pointer touch-manipulation flex-col items-center gap-1 rounded-xl border px-2 py-3 text-center transition-colors border-border bg-muted/30"><span class="flex size-9 items-center justify-center rounded-lg border bg-background text-sm font-bold" style="color:#a78bfa">2</span><span class="text-xs leading-tight font-medium">Describe and generate</span></button><button type="button" aria-pressed="false" class="flex cursor-pointer touch-manipulation flex-col items-center gap-1 rounded-xl border px-2 py-3 text-center transition-colors border-border bg-muted/30"><span class="flex size-9 items-center justify-center rounded-lg border bg-background text-sm font-bold" style="color:#34d399">3</span><span class="text-xs leading-tight font-medium">Export and publish</span></button></div><div class="mt-4"><p class="text-sm leading-relaxed text-muted-foreground">Choose video, image, or music — whatever your project needs right now.</p></div></div><div class="mt-12 hidden gap-8 lg:grid lg:grid-cols-3"><div class="reveal-visible"><div class="relative flex flex-col items-center text-center"><div class="overflow-hidden rounded-2xl border bg-muted/50 shadow-sm w-full"><img src="/images/home/how-step-1-light.png" alt="Pick video, image, or music for your project" loading="lazy" class="aspect-76/59 w-full object-cover object-top dark:hidden"/><img src="https://cdn.mksaas.com/blocks/music.png" alt="Pick video, image, or music for your project" loading="lazy" class="hidden aspect-76/59 w-full object-cover object-top dark:block"/></div><div class="relative mt-6"><div class="flex size-12 items-center justify-center rounded-xl border bg-muted/50 text-lg font-bold" style="color:#60a5fa">1</div><div class="pointer-events-none absolute top-1/2 left-[calc(50%+1.5rem)] hidden h-0.5 w-[calc(100%-3rem)] -translate-y-1/2 lg:block" style="background:linear-gradient(90deg, var(--color-border) 0%, transparent 100%)" aria-hidden="true"></div></div><div class="mt-6 space-y-3"><h3 class="text-lg font-semibold">Pick your medium</h3><p class="text-sm leading-relaxed text-muted-foreground">Choose video, image, or music — whatever your project needs right now.</p></div></div></div><div class="reveal-visible" style="animation-delay:100ms"><div class="relative flex flex-col items-center text-center"><div class="overflow-hidden rounded-2xl border bg-muted/50 shadow-sm w-full"><img src="/images/home/how-step-2-light.png" alt="Describe your idea and generate with AI" loading="lazy" class="aspect-76/59 w-full object-cover object-top dark:hidden"/><img src="https://cdn.mksaas.com/blocks/charts.png" alt="Describe your idea and generate with AI" loading="lazy" class="hidden aspect-76/59 w-full object-cover object-top dark:block"/></div><div class="relative mt-6"><div class="flex size-12 items-center justify-center rounded-xl border bg-muted/50 text-lg font-bold" style="color:#a78bfa">2</div><div class="pointer-events-none absolute top-1/2 left-[calc(50%+1.5rem)] hidden h-0.5 w-[calc(100%-3rem)] -translate-y-1/2 lg:block" style="background:linear-gradient(90deg, var(--color-border) 0%, transparent 100%)" aria-hidden="true"></div></div><div class="mt-6 space-y-3"><h3 class="text-lg font-semibold">Describe and generate</h3><p class="text-sm leading-relaxed text-muted-foreground">Write a prompt or upload a reference. AI models tuned for each media type handle the rest.</p></div></div></div><div class="reveal-visible" style="animation-delay:200ms"><div class="relative flex flex-col items-center text-center"><div class="overflow-hidden rounded-2xl border bg-muted/50 shadow-sm w-full"><img src="/images/home/how-step-3-light.png" alt="Export and publish your finished asset" loading="lazy" class="aspect-76/59 w-full object-cover object-top dark:hidden"/><img src="https://cdn.mksaas.com/blocks/dark-card.webp" alt="Export and publish your finished asset" loading="lazy" class="hidden aspect-76/59 w-full object-cover object-top dark:block"/></div><div class="relative mt-6"><div class="flex size-12 items-center justify-center rounded-xl border bg-muted/50 text-lg font-bold" style="color:#34d399">3</div></div><div class="mt-6 space-y-3"><h3 class="text-lg font-semibold">Export and publish</h3><p class="text-sm leading-relaxed text-muted-foreground">Download your asset ready for your editor, feed, or campaign — commercial rights included.</p></div></div></div></div><div class="reveal-visible mt-12 text-center" style="animation-delay:350ms"><a href="/auth/login" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-
10px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 bg-primary text-primary-foreground [a]:hover:bg-primary/80 gap-1.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 h-11 rounded-xl px-6">Start creating</a></div></div></section><section id="stats" class="px-4 py-16 md:py-24"><div class="mx-auto max-w-5xl px-6 space-y-8 md:space-y-16"><div class="reveal-visible"><div class="flex flex-col items-center text-center gap-4"><p class="uppercase tracking-wider text-primary font-semibold">By the numbers</p><h2 class="text-balance text-2xl text-foreground">The AI video generator, by the numbers</h2><p class="text-balance text-lg text-muted-foreground">Video, image, and music — one platform for every creative need</p></div></div><div class="grid gap-2 *:text-center md:grid-cols-3 md:divide-x md:divide-border"><div class="reveal-visible space-y-4 py-4 md:py-0"><div class="text-5xl font-bold tabular-nums text-primary">50K+</div><p class="text-muted-foreground font-medium">Creative powers</p></div><div class="reveal-visible space-y-4 py-4 md:py-0" style="animation-delay:120ms"><div class="text-5xl font-bold tabular-nums text-primary">10K+</div><p class="text-muted-foreground font-medium">Unified platform</p></div><div class="reveal-visible space-y-4 py-4 md:py-0" style="animation-delay:240ms"><div class="text-5xl font-bold tabular-nums text-primary">Free</div><p class="text-muted-foreground font-medium">Free to start</p></div></div></div></section><section id="integration" class="px-4 py-16 md:py-24"><div class="mx-auto max-w-6xl"><div class="reveal-visible"><div class="flex flex-col items-center text-center gap-4"><p class="uppercase tracking-wider text-primary font-semibold">All-in-one agent vs. single-purpose tools</p><h2 class="text-balance text-2xl text-foreground">Why our AI video generator agent beats single-purpose tools</h2><p class="text-balance text-lg text-muted-foreground">Most AI tools do one thing well. Viddi AI covers video, image, and music so you never bounce between apps.</p></div></div><div class="mt-12 grid gap-3 sm:grid-cols-2 lg:grid-cols-3"><div class="reveal-visible"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent p-6 transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div class="relative"><div class="mb-4 flex size-10 items-center justify-center rounded-lg border bg-muted/50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-video-plus size-5 shrink-0" style="color:#a78bfa"><path d="M15 10l4.553 -2.276a1 1 0 0 1 1.447 .894v6.764a1 1 0 0 1 -1.447 .894l-4.553 -2.276v-4"></path><path d="M3 8a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v8a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2l0 -8"></path><path d="M7 12l4 0"></path><path d="M9 10l0 4"></path></svg></div><div class="space-y-2"><h3 class="text-base font-medium">Lightning-fast generation</h3><p class="text-muted-foreground line-clamp-2 text-sm">Produce professional clips, images, and audio tracks in seconds. Speed up your workflow without sacrificing quality.</p></div></div></div></div><div class="reveal-visible" style="animation-delay:80ms"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent p-6 transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div class="relative"><div class="mb-4 flex size-10 items-center justify-center rounded-lg border bg-muted/50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-color-swatch size-5 shrink-0" style="color:#60a5fa"><path d="M19 3h-4a2 2 0 0 0 -2 2v12a4 4 0 0 0 8 0v-12a2 2 0 0 0 -2 -2"></path><path d="M13 7.35l-2 -2a2 2 0 0 0 -2.828 0l-2.828 2.828a2 2 0 0 0 0 2.828l9 9"></path><path d="M7.3 13h-2.3a2 2 0 0 0 -2 2v4a2 2 0 0 0 2 2h12"></path><path d="M17 17l0 .01"></path></svg></div><div class="space-y-2"><h3 class="text-base font-medium">
10Professional-grade quality</h3><p class="text-muted-foreground line-clamp-2 text-sm">Each media type uses purpose-tuned models. Expect crisp video, stunning images, and rich audio — ready to publish.</p></div></div></div></div><div class="reveal-visible" style="animation-delay:160ms"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent p-6 transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div class="relative"><div class="mb-4 flex size-10 items-center justify-center rounded-lg border bg-muted/50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-music size-5 shrink-0" style="color:#f472b6"><path d="M3 17a3 3 0 1 0 6 0a3 3 0 0 0 -6 0"></path><path d="M13 17a3 3 0 1 0 6 0a3 3 0 0 0 -6 0"></path><path d="M9 17v-13h10v13"></path><path d="M9 8h10"></path></svg></div><div class="space-y-2"><h3 class="text-base font-medium">Zero learning curve</h3><p class="text-muted-foreground line-clamp-2 text-sm">No complex software to learn. Describe what you want, pick your medium, and let AI handle the rest.</p></div></div></div></div><div class="reveal-visible" style="animation-delay:240ms"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent p-6 transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div class="relative"><div class="mb-4 flex size-10 items-center justify-center rounded-lg border bg-muted/50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-player-track-next size-5 shrink-0" style="color:#34d399"><path d="M3 5v14l8 -7l-8 -7"></path><path d="M14 5v14l8 -7l-8 -7"></path></svg></div><div class="space-y-2"><h3 class="text-base font-medium">Built for engagement</h3><p class="text-muted-foreground line-clamp-2 text-sm">Sync visuals with matching audio to create content that holds attention and drives higher retention.</p></div></div></div></div><div class="reveal-visible" style="animation-delay:320ms"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent p-6 transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div class="relative"><div class="mb-4 flex size-10 items-center justify-center rounded-lg border bg-muted/50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-device-gamepad-2 size-5 shrink-0" style="color:#fb923c"><path d="M12 5h3.5a5 5 0 0 1 0 10h-5.5l-4.015 4.227a2.3 2.3 0 0 1 -3.923 -2.035l1.634 -8.173a5 5 0 0 1 4.904 -4.019h3.4"></path><path d="M14 15l4.07 4.284a2.3 2.3 0 0 0 3.925 -2.023l-1.6 -8.232"></path><path d="M8 9v2"></path><path d="M7 10h2"></path><path d="M14 10h2"></path></svg></div><div class="space-y-2"><h3 class="text-base font-medium">Remarkable value</h3><p class="text-muted-foreground line-clamp-2 text-sm">One subscription covers video, image, and music generation. More capabilities for less than a single-purpose tool.</p></div></div></div></div><div class="reveal-visible" style="animation-delay:400ms"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl text-sm text-card-foreground ring-1 ring-foreground
10/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent p-6 transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div class="relative"><div class="mb-4 flex size-10 items-center justify-center rounded-lg border bg-muted/50"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-brand-openai size-5 shrink-0" style="color:#a78bfa"><path d="M11.217 19.384a3.501 3.501 0 0 0 6.783 -1.217v-5.167l-6 -3.35"></path><path d="M5.214 15.014a3.501 3.501 0 0 0 4.446 5.266l4.34 -2.534v-6.946"></path><path d="M6 7.63c-1.391 -.236 -2.787 .395 -3.534 1.689a3.474 3.474 0 0 0 1.271 4.745l4.263 2.514l6 -3.348"></path><path d="M12.783 4.616a3.501 3.501 0 0 0 -6.783 1.217v5.067l6 3.45"></path><path d="M18.786 8.986a3.501 3.501 0 0 0 -4.446 -5.266l-4.34 2.534v6.946"></path><path d="M18 16.302c1.391 .236 2.787 -.395 3.534 -1.689a3.474 3.474 0 0 0 -1.271 -4.745l-4.308 -2.514l-5.955 3.42"></path></svg></div><div class="space-y-2"><h3 class="text-base font-medium">All-in-one vs the rest</h3><p class="text-muted-foreground line-clamp-2 text-sm">Competitors lock you into one format. Viddi AI gives you every medium from one account at one price.</p></div></div></div></div></div></div></section><section id="testimonials" class="px-4 py-16 md:py-24"><div class="mx-auto max-w-6xl"><div class="reveal-visible"><div class="flex flex-col items-center text-center gap-4"><p class="uppercase tracking-wider text-primary font-semibold">What creators say about Viddi AI</p><h2 class="text-balance text-2xl text-foreground">What creators say about our AI video agent</h2></div></div><div class="reveal-visible" style="animation-delay:80ms"><div class="mb-8 flex items-center justify-center gap-2 text-sm text-muted-foreground"><div class="flex"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="none" class="tabler-icon tabler-icon-star-filled size-4 text-emerald-500" aria-hidden="true"><path d="M8.243 7.34l-6.38 .925l-.113 .023a1 1 0 0 0 -.44 1.684l4.622 4.499l-1.09 6.355l-.013 .11a1 1 0 0 0 1.464 .944l5.706 -3l5.693 3l.1 .046a1 1 0 0 0 1.352 -1.1l-1.091 -6.355l4.624 -4.5l.078 -.085a1 1 0 0 0 -.633 -1.62l-6.38 -.926l-2.852 -5.78a1 1 0 0 0 -1.794 0l-2.853 5.78z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="none" class="tabler-icon tabler-icon-star-filled size-4 text-emerald-500" aria-hidden="true"><path d="M8.243 7.34l-6.38 .925l-.113 .023a1 1 0 0 0 -.44 1.684l4.622 4.499l-1.09 6.355l-.013 .11a1 1 0 0 0 1.464 .944l5.706 -3l5.693 3l.1 .046a1 1 0 0 0 1.352 -1.1l-1.091 -6.355l4.624 -4.5l.078 -.085a1 1 0 0 0 -.633 -1.62l-6.38 -.926l-2.852 -5.78a1 1 0 0 0 -1.794 0l-2.853 5.78z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="none" class="tabler-icon tabler-icon-star-filled size-4 text-emerald-500" aria-hidden="true"><path d="M8.243 7.34l-6.38 .925l-.113 .023a1 1 0 0 0 -.44 1.684l4.622 4.499l-1.09 6.355l-.013 .11a1 1 0 0 0 1.464 .944l5.706 -3l5.693 3l.1 .046a1 1 0 0 0 1.352 -1.1l-1.091 -6.355l4.624 -4.5l.078 -.085a1 1 0 0 0 -.633 -1.62l-6.38 -.926l-2.852 -5.78a1 1 0 0 0 -1.794 0l-2.853 5.78z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="none" class="tabler-icon tabler-icon-star-filled size-4 text-emerald-500" aria-hidden="true"><path d="M8.243 7.34l-6.38 .925l-.113 .023a1 1 0 0 0 -.44 1.684l4.622 4.499l-1.09 6.355l-.013 .11a1 1 0 0 0 1.464 .944l5.706 -3l5.693 3l.1 .046a1 1 0 0 0 1.352 -1.1l-1.091 -6.355l4.624 -4.5l.078 -.085a1 1 0 0 0 -.633 -1.62l-6.38 -.926l-2.852 -5.78a1 1 0 0 0 -1.794 0l-2.853 5.78z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="none" class="tabler-icon tabler-icon-star-filled size-4 text-emerald-500" aria-hidden="true"><path d="M8.243 7.34l-6.38 .925l-.113 .023a1 1 0 0 0 -.44 1.684l4.622 4.499l-1.09 6.355l-.013 .11a1 1 0 0 0 1.464 .944l5.706 -3l5.693 3l.1 .046a1 1 0 0 0 1.352 -1.1l-1.091 -6.355l4.624 -4.5l.078 -.085a1 1 0 0 0 -.633 -1.62l-6.38 -.926l-2.852 -5.78a1 1 0 0 0 -1.794 0l-2.853 5.78z"></path></svg></div><span class="font-medium">Trustpilot 4.8</span>
10<span aria-hidden="true" class="text-muted-foreground/40">·</span><span>10,000+ reviews</span></div></div><div class="mt-8 grid gap-3 sm:grid-cols-2 md:mt-12 lg:grid-cols-3"><div class="reveal-visible space-y-3"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">A</span></span><div><h3 class="font-medium">Alma Walters</h3><span class="text-muted-foreground block text-sm tracking-wide">YouTube creator · 240K subscribers</span><blockquote class="mt-3"><p class="text-muted-foreground">I generate Shorts, thumbnails, and background tracks in one session. No more tab chaos.</p></blockquote></div></div></div><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">B</span></span><div><h3 class="font-medium">Beatrice Sullivan</h3><span class="text-muted-foreground block text-sm tracking-wide">SaaS product marketer</span><blockquote class="mt-3"><p class="text-muted-foreground">Explainers need visuals and music. Viddi AI handles both without me opening three apps.</p></blockquote></div></div></div><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">K</span></span><div><h3 class="font-medium">Kelly Arnold</h3><span class="text-muted-foreground block text-sm tracking-wide">Travel vlogger</span><blockquote class="mt-3"><p class="text-muted-foreground">Reels, cover art, and audio loops — I pick what I need and keep creating.</p></blockquote></div></div></div></div><div class="reveal-visible space-y-3" style="animation-delay:120ms"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground
10/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">E</span></span><div><h3 class="font-medium">Emily Johnson</h3><span class="text-muted-foreground block text-sm tracking-wide">Growth marketing director</span><blockquote class="mt-3"><p class="text-muted-foreground">Campaign assets used to mean five subscriptions. Now video, images, and music live in one place.</p></blockquote></div></div></div><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">A</span></span><div><h3 class="font-medium">Avery Ambrose</h3><span class="text-muted-foreground block text-sm tracking-wide">Shopify store owner</span><blockquote class="mt-3"><p class="text-muted-foreground">Product shots in the morning, ad music by lunch, promo video by end of day. Same account throughout.</p></blockquote></div></div></div><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">E</span></span><div><h3 class="font-medium">Everett Reid</h3><span class="text-muted-foreground block text-sm tracking-wide">Solo app developer</span><blockquote class="mt-3"><p class="text-muted-foreground">I don&#x27;t need a full video pipeline every time. Sometimes I just need an image or a track — Viddi AI gets that.</p></blockquote></div></div></div></div><div class="reveal-visible space-y-3" style="animation-delay:240ms"><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground
10/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">G</span></span><div><h3 class="font-medium">Gladys Jimenez</h3><span class="text-muted-foreground block text-sm tracking-wide">Brand studio art director</span><blockquote class="mt-3"><p class="text-muted-foreground">Client deliverables used to take a week. With Viddi AI I turn around video, visuals, and audio in a day.</p></blockquote></div></div></div><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">J</span></span><div><h3 class="font-medium">Juanita Franklin</h3><span class="text-muted-foreground block text-sm tracking-wide">True crime podcast host</span><blockquote class="mt-3"><p class="text-muted-foreground">Intro music, episode art, and promo clips — all from one dashboard.</p></blockquote></div></div></div><div data-slot="card" data-size="default" class="group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl bg-transparent shadow-none transition-colors duration-200 hover:bg-accent dark:hover:bg-card"><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 grid grid-cols-[auto_1fr] gap-3 pt-4"><span data-slot="avatar" data-size="default" class="group/avatar relative flex shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten size-9 border-2 border-primary/25"><span data-slot="avatar-fallback" class="flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs absolute inset-0">E</span></span><div><h3 class="font-medium">Eugene Rodriquez</h3><span class="text-muted-foreground block text-sm tracking-wide">TikTok content strategist</span><blockquote class="mt-3"><p class="text-muted-foreground">Our team ships daily content across platforms. One tool for every format changed our workflow.</p></blockquote></div></div></div></div></div></div></section><section id="faqs" class="px-4 py-16 md:py-24"><div class="mx-auto max-w-4xl"><div class="reveal-visible"><div class="flex flex-col items-center text-center gap-4"><p class="uppercase tracking-wider text-primary font-semibold">FAQ</p><h2 class="text-balance text-2xl text-foreground">Common questions about the AI video generator agent</h2></div></div><div class="reveal-visible mx-auto mt-12 max-w-4xl" style="animation-delay:150ms"><div class="divide-y divide-border rounded-2xl border border-primary/15 px-4 py-3 shadow-sm dark:border-primary/10 sm:px-8"><details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>What can Viddi AI create?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">Viddi AI is an all-in-one AI agent for video, image, and music. Pick the capability your project needs — generate clips, visuals, or audio from one account without switching tools.</p></div></details>
10<details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>Is there a free tier?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">Yes. New accounts receive free credits to try video, image, and music generation. No card required to start. Paid plans add more credits and faster queues.</p></div></details><details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>Can I generate images and music, not just video?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">Absolutely. Generate images for thumbnails and posts, music for soundtracks and loops, and videos for Shorts, Reels, and long-form — all from the same platform.</p></div></details><details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>How is this different from using separate AI tools?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">Separate apps mean separate logins, credits, and workflows. Viddi AI keeps video, image, and music in one place so you can switch capabilities as your project evolves.</p></div></details><details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>How much does Viddi AI cost?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">Viddi AI offers a free tier with credits to try video, image, and music generation. Paid plans start at $19.80/month for more credits, priority processing, and higher resolutions.</p></div></details><details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>Is there a limit on how many files I can generate?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">Your generation limit depends on your credit balance. Free accounts receive credits on signup. Paid plans refill monthly and unused credits roll over with most plans.</p></div></details><details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>What formats and resolutions are supported?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">
10Video supports up to 1080p native resolution. Images support multiple aspect ratios and formats. Music generates high-quality audio loops and tracks. Resolution limits scale with your plan tier.</p></div></details><details class="group cursor-pointer py-4"><summary class="flex items-center justify-between text-base font-medium hover:no-underline [&amp;::-webkit-details-marker]:hidden"><span>Are my files and data private?</span><svg class="size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-open:rotate-180" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg></summary><div class="mt-3"><p class="text-base text-muted-foreground">Yes. Your uploaded reference assets and generated outputs are private to your account. We do not train on your content. See our privacy policy for full details.</p></div></details></div></div></div></section><section id="pricing" class="px-4 py-16 md:py-24"><div class="mx-auto max-w-6xl space-y-16"><div class="reveal-visible"><div class="flex flex-col items-center text-center gap-4"><h2 class="text-balance text-foreground text-4xl font-bold">AI video agent pricing</h2><p class="text-balance text-lg text-muted-foreground">Free credits to try video, image, and music. No card to start. Commercial use allowed.</p></div></div><div class="reveal-visible" style="animation-delay:150ms"><div class="flex flex-col gap-12"><div class="mx-auto flex w-full max-w-5xl flex-nowrap items-center justify-between gap-1 px-0.5 sm:gap-2 sm:px-1"><div class="flex min-w-0 flex-nowrap items-center gap-1 sm:gap-2"><div data-orientation="horizontal" aria-orientation="horizontal" role="group" data-slot="toggle-group" data-size="sm" data-spacing="2" class="group/toggle-group w-fit flex-row data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-vertical:flex-col data-vertical:items-stretch flex shrink-0 cursor-pointer items-center gap-0 rounded-md border bg-muted/30 p-0.5 sm:rounded-lg" style="--gap:2"><button type="button" aria-disabled="false" tabindex="-1" aria-pressed="false" data-slot="toggle-group-item" data-variant="default" data-size="sm" data-spacing="2" class="group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-1.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-1.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t group/toggle inline-flex items-center justify-center gap-1 whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 bg-transparent min-w-7 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-3.5 h-7 shrink-0 cursor-pointer rounded px-2 text-[10px] font-medium aria-pressed:!bg-primary aria-pressed:!text-primary-foreground aria-pressed:hover:!bg-primary aria-pressed:hover:!text-primary-foreground sm:h-8 sm:rounded-md sm:px-3 sm:text-xs">Monthly</button><span aria-hidden="true" class="h-3.5 w-px bg-border sm:h-4"></span><button type="button" data-pressed="" aria-disabled="false" tabindex="-1" aria-pressed="true" data-slot="toggle-group-item" data-variant="default" data-size="sm" data-spacing="2" class="group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-1.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-1.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t group/toggle inline-flex items-center justify-center gap-1 whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 bg-transparent min-w-7 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&amp;_svg:not([class*=&#x27;
10size-&#x27;])]:size-3.5 h-7 shrink-0 cursor-pointer rounded px-2 text-[10px] font-medium aria-pressed:!bg-primary aria-pressed:!text-primary-foreground aria-pressed:hover:!bg-primary aria-pressed:hover:!text-primary-foreground sm:h-8 sm:rounded-md sm:px-3 sm:text-xs">Yearly<span class="ml-1 hidden h-4 items-center rounded-full bg-primary px-1.5 text-[9px] font-bold leading-none text-primary-foreground group-data-[state=on]/toggle:bg-primary-foreground group-data-[state=on]/toggle:text-primary sm:inline-flex">Save with yearly billing</span></button></div></div><div class="flex shrink-0 flex-nowrap items-center gap-1 sm:gap-2"><div data-orientation="horizontal" aria-orientation="horizontal" role="group" data-slot="toggle-group" data-size="sm" data-spacing="2" class="group/toggle-group w-fit flex-row data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-vertical:flex-col data-vertical:items-stretch flex shrink-0 cursor-pointer items-center gap-0 rounded-md border bg-muted/30 p-0.5 sm:rounded-lg" style="--gap:2"><button type="button" aria-disabled="false" tabindex="-1" aria-pressed="false" data-slot="toggle-group-item" data-variant="default" data-size="sm" data-spacing="2" class="group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-1.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-1.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t group/toggle inline-flex items-center justify-center gap-1 whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 bg-transparent min-w-7 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-3.5 h-7 shrink-0 cursor-pointer rounded px-2 text-[10px] font-medium aria-pressed:!bg-primary aria-pressed:!text-primary-foreground aria-pressed:hover:!bg-primary aria-pressed:hover:!text-primary-foreground sm:h-8 sm:rounded-md sm:px-3 sm:text-xs"><span class="sm:hidden">One-time</span><span class="hidden sm:inline">One-time credits</span></button><span aria-hidden="true" class="h-3.5 w-px bg-border sm:h-4"></span><button type="button" data-pressed="" aria-disabled="false" tabindex="-1" aria-pressed="true" data-slot="toggle-group-item" data-variant="default" data-size="sm" data-spacing="2" class="group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-1.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-1.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t group/toggle inline-flex items-center justify-center gap-1 whitespace-nowrap transition-all outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted data-[state=on]:bg-muted dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 bg-transparent min-w-7 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&amp;_svg:not([class*=&#x27;
10size-&#x27;])]:size-3.5 h-7 shrink-0 cursor-pointer rounded px-2 text-[10px] font-medium aria-pressed:!bg-primary aria-pressed:!text-primary-foreground aria-pressed:hover:!bg-primary aria-pressed:hover:!text-primary-foreground sm:h-8 sm:rounded-md sm:px-3 sm:text-xs">Subscription</button></div><div class="inline-flex shrink-0 items-center"><button type="button" tabindex="0" id="base-ui-_R_1ad9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Payment currency" class="w-fit items-center justify-between gap-1.5 border-input py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 inline-flex h-7 min-w-7 cursor-pointer rounded-md border bg-muted/30 px-1.5 text-[10px] font-medium shadow-none sm:h-8 sm:min-w-20 sm:rou
10nded-lg sm:px-3 sm:text-xs"><span data-slot="select-value" class="flex flex-1 text-left"><span class="sm:hidden">🇺🇸</span><span class="hidden sm:inline">🇺🇸<!-- --> <!-- -->USD</span></span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_1ad9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="USD"/></div></div></div><div class="grid gap-6 grid-cols-1 md:grid-cols-2 lg:grid-cols-3"><div data-slot="card" data-size="default" class="group/card gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl flex h-full flex-col" data-testid="pricing-card-starter"><div data-slot="card-header" class="group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3"><div data-slot="card-title" class="text-base leading-snug font-medium group-data-[size=sm]/card:text-sm"><h3 class="font-medium">Basic</h3></div><div class="my-4"><p class="mb-1 text-sm font-medium text-primary tabular-nums">Billed $118.8 annually</p><div class="flex flex-wrap items-baseline gap-x-2 gap-y-1"><span class="text-3xl font-semibold tabular-nums sm:text-4xl">$9.90</span><span class="text-xl sm:text-2xl">/month</span></div><div class="mt-2"><span class="text-sm text-muted-foreground line-through tabular-nums">$19.80<!-- -->/month</span></div><p class="mt-1 text-sm font-medium text-muted-foreground">Credits are granted monthly</p><span data-slot="badge" data-variant="outline" class="group/badge inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden border whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&amp;&gt;svg]:pointer-events-none [&amp;&gt;svg]:size-3! [a]:hover:bg-muted [a]:hover:text-muted-foreground pointer-events-none mt-2 h-auto rounded-md border-primary/40 px-2.5 py-1 text-xs font-semibold text-primary">Save 50%</span><div class="mt-3 space-y-1.5"><div class="pointer-events-none flex flex-wrap items-center gap-x-2 gap-y-1 rounded-lg border border-border px-3 py-2 text-xs"><span class="font-semibold tabular-nums">$118.8 billed yearly</span><span class="text-muted-foreground line-through tabular-nums">$237.6</span></div><p class="text-xs font-medium text-primary tabular-nums">Save $118.8</p></div></div><div data-slot="card-description" class="text-sm text-muted-foreground"><p class="text-sm">Perfect for getting started with AI video generation</p></div><div class="pointer-events-none mt-4 flex items-center justify-between gap-3 rounded-lg border border-border px-3 py-2 text-xs"><span class="text-muted-foreground">Cost per 100 credits</span><span class="font-semibold tabular-nums">$1.11</span></div><a href="/auth/login" class="group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;
10size-&#x27;])]:size-4 bg-primary text-primary-foreground [a]:hover:bg-primary/80 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 mt-4 h-11 w-full cursor-pointer text-base font-semibold">Start for $118.8/year</a></div><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 space-y-4"><div data-testid="video-generation-estimate" class="flex flex-nowrap items-center justify-center gap-1 border-y border-dashed py-2 text-[11px] text-muted-foreground"><button type="button" tabindex="0" id="base-ui-_R_4tl9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video resolution" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 w-[62px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">480p</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_4tl9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="480p"/><button type="button" tabindex="0" id="base-ui-_R_8tl9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video model" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 w-[120px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">seedance-2.5-mini</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_8tl9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="seedance-2.5-mini"/><button type="button" tabindex="0" id="base-ui-_R_ctl9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video duration" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;
10size-&#x27;])]:size-4 w-[54px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">5</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_ctl9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="5"/><span class="shrink-0">up to</span><strong data-testid="video-generation-estimate-result" class="shrink-0 text-xs font-semibold tabular-nums text-primary">22 videos</strong><span class="sr-only" aria-live="polite">Up to 22 5-second 480p videos with Seedance 2.5 Mini</span></div><ul class="list-outside space-y-4 text-sm"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>892 credits/month</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Native 1080p resolution</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Standard generation speed</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>No Captcha Verification</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Email support</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Commercial usage rights included</span></li></ul><ul class="list-outside space-y-4 text-sm"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-x size-4 text-muted-foreground"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M10 10l4 4m0 -4l-4 4"></path></svg><span>No priority processing</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-x size-4 text-muted-foreground"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path>
10<path d="M10 10l4 4m0 -4l-4 4"></path></svg><span>No dedicated account manager</span></li></ul></div></div><div data-slot="card" data-size="default" class="group/card gap-4 rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl flex h-full flex-col relative overflow-visible" data-testid="pricing-card-pro"><div class="absolute -top-3 left-1/2 -translate-x-1/2 transform"><span data-slot="badge" data-variant="default" class="group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&amp;&gt;svg]:pointer-events-none [&amp;&gt;svg]:size-3! [a]:hover:bg-primary/80 bg-primary text-primary-foreground">Popular</span></div><div data-slot="card-header" class="group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3"><div data-slot="card-title" class="text-base leading-snug font-medium group-data-[size=sm]/card:text-sm"><h3 class="font-medium">Pro</h3></div><div class="my-4"><p class="mb-1 text-sm font-medium text-primary tabular-nums">Billed $239.88 annually</p><div class="flex flex-wrap items-baseline gap-x-2 gap-y-1"><span class="text-3xl font-semibold tabular-nums sm:text-4xl">$19.99</span><span class="text-xl sm:text-2xl">/month</span></div><div class="mt-2"><span class="text-sm text-muted-foreground line-through tabular-nums">$39.90<!-- -->/month</span></div><p class="mt-1 text-sm font-medium text-muted-foreground">Credits are granted monthly</p><span data-slot="badge" data-variant="outline" class="group/badge inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden border whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&amp;&gt;svg]:pointer-events-none [&amp;&gt;svg]:size-3! [a]:hover:bg-muted [a]:hover:text-muted-foreground pointer-events-none mt-2 h-auto rounded-md border-primary/40 px-2.5 py-1 text-xs font-semibold text-primary">Save 50%</span><div class="mt-3 space-y-1.5"><div class="pointer-events-none flex flex-wrap items-center gap-x-2 gap-y-1 rounded-lg border border-border px-3 py-2 text-xs"><span class="font-semibold tabular-nums">$239.88 billed yearly</span><span class="text-muted-foreground line-through tabular-nums">$478.8</span></div><p class="text-xs font-medium text-primary tabular-nums">Save $238.92</p></div></div><div data-slot="card-description" class="text-sm text-muted-foreground"><p class="text-sm">Ideal for creators and professionals</p></div><div class="pointer-events-none mt-4 flex items-center justify-between gap-3 rounded-lg border border-border px-3 py-2 text-xs"><span class="text-muted-foreground">Cost per 100 credits</span><span class="font-semibold tabular-nums">$0.98</span></div><a href="/auth/login" class="group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;
10size-&#x27;])]:size-4 bg-primary text-primary-foreground [a]:hover:bg-primary/80 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 mt-4 h-11 w-full cursor-pointer text-base font-semibold">Start for $239.88/year</a></div><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 space-y-4"><div data-testid="video-generation-estimate" class="flex flex-nowrap items-center justify-center gap-1 border-y border-dashed py-2 text-[11px] text-muted-foreground"><button type="button" tabindex="0" id="base-ui-_R_4ul9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video resolution" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 w-[62px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">480p</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_4ul9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="480p"/><button type="button" tabindex="0" id="base-ui-_R_8ul9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video model" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 w-[120px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">seedance-2.5-mini</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_8ul9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="seedance-2.5-mini"/><button type="button" tabindex="0" id="base-ui-_R_cul9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video duration" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;
10size-&#x27;])]:size-4 w-[54px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">5</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_cul9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="5"/><span class="shrink-0">up to</span><strong data-testid="video-generation-estimate-result" class="shrink-0 text-xs font-semibold tabular-nums text-primary">50 videos</strong><span class="sr-only" aria-live="polite">Up to 50 5-second 480p videos with Seedance 2.5 Mini</span></div><ul class="list-outside space-y-4 text-sm"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>2,034 credits/month</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Native 1080p resolution</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Priority processing</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>16-bit HDR &amp; EXR Export</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>No Captcha Verification</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Priority support</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Commercial video license</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Fast response</span></li></ul><ul class="list-outside space-y-4 text-sm"></ul></div></div><div data-slot="card" data-size="default" class="group/card gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground
10/10 has-data-[slot=card-footer]:pb-0 has-[&gt;img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl flex h-full flex-col" data-testid="pricing-card-premium"><div data-slot="card-header" class="group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3"><div data-slot="card-title" class="text-base leading-snug font-medium group-data-[size=sm]/card:text-sm"><h3 class="font-medium">Max</h3></div><div class="my-4"><p class="mb-1 text-sm font-medium text-primary tabular-nums">Billed $1,199.88 annually</p><div class="flex flex-wrap items-baseline gap-x-2 gap-y-1"><span class="text-3xl font-semibold tabular-nums sm:text-4xl">$99.99</span><span class="text-xl sm:text-2xl">/month</span></div><div class="mt-2"><span class="text-sm text-muted-foreground line-through tabular-nums">$199.90<!-- -->/month</span></div><p class="mt-1 text-sm font-medium text-muted-foreground">Credits are granted monthly</p><span data-slot="badge" data-variant="outline" class="group/badge inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden border whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&amp;&gt;svg]:pointer-events-none [&amp;&gt;svg]:size-3! [a]:hover:bg-muted [a]:hover:text-muted-foreground pointer-events-none mt-2 h-auto rounded-md border-primary/40 px-2.5 py-1 text-xs font-semibold text-primary">Save 50%</span><div class="mt-3 space-y-1.5"><div class="pointer-events-none flex flex-wrap items-center gap-x-2 gap-y-1 rounded-lg border border-border px-3 py-2 text-xs"><span class="font-semibold tabular-nums">$1,199.88 billed yearly</span><span class="text-muted-foreground line-through tabular-nums">$2,398.8</span></div><p class="text-xs font-medium text-primary tabular-nums">Save $1,198.92</p></div></div><div data-slot="card-description" class="text-sm text-muted-foreground"><p class="text-sm">For studios and power users</p></div><div class="pointer-events-none mt-4 flex items-center justify-between gap-3 rounded-lg border border-border px-3 py-2 text-xs"><span class="text-muted-foreground">Cost per 100 credits</span><span class="font-semibold tabular-nums">$0.83</span></div><a href="/auth/login" class="group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 bg-primary text-primary-foreground [a]:hover:bg-primary/80 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 mt-4 h-11 w-full cursor-pointer text-base font-semibold">Start for $1,199.88/year</a></div><div data-slot="card-content" class="px-4 group-data-[size=sm]/card:px-3 space-y-4"><div data-testid="video-generation-estimate" class="flex flex-nowrap items-center justify-center gap-1 border-y border-dashed py-2 text-[11px] text-muted-foreground"><button type="button" tabindex="0" id="base-ui-_R_4vl9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video resolution" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;
10size-&#x27;])]:size-4 w-[62px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">480p</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_4vl9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="480p"/><button type="button" tabindex="0" id="base-ui-_R_8vl9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video model" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 w-[120px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">seedance-2.5-mini</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_8vl9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="seedance-2.5-mini"/><button type="button" tabindex="0" id="base-ui-_R_cvl9ioq_" role="combobox" aria-expanded="false" aria-haspopup="listbox" data-slot="select-trigger" data-size="sm" aria-label="Video duration" class="flex items-center justify-between border border-input bg-transparent py-2 whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 w-[54px] h-6 shrink-0 cursor-pointer gap-0.5 rounded-md px-1.5 text-[11px] data-[size=sm]:h-6 [&amp;_svg]:size-3"><span data-slot="select-value" class="flex flex-1 text-left">5</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-selector pointer-events-none size-4 text-muted-foreground" aria-hidden="true"><path d="M8 9l4 -4l4 4"></path><path d="M16 15l-4 4l-4 -4"></path>▼</svg></button><input id="base-ui-_R_cvl9ioq_-hidden-input" style="clip-path:inset(50%);overflow:hidden;white-space:nowrap;border:0;padding:0;width:1px;height:1px;margin:-1px;position:fixed;top:0;left:0" tabindex="-1" aria-hidden="true" value="5"/><span class="shrink-0">up to</span><strong data-testid="video-generation-estimate-result" class="shrink-0 text-xs font-semibold tabular-nums text-primary">300 videos</strong>
10<span class="sr-only" aria-live="polite">Up to 300 5-second 480p videos with Seedance 2.5 Mini</span></div><ul class="list-outside space-y-4 text-sm"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>12,014 credits/month</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Native 1080p resolution</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Fastest generation speed</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Permanent video storage</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>No Captcha Verification</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Full commercial rights</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-circle-check size-4 text-chart-2"><path d="M3 12a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path><path d="M9 12l2 2l4 -4"></path></svg><span>Dedicated account manager</span></li></ul><ul class="list-outside space-y-4 text-sm"></ul></div></div></div></div></div><div class="reveal-visible" style="animation-delay:200ms"><div class="mx-auto max-w-lg text-center"><p class="flex items-center justify-center gap-2 text-sm text-muted-foreground"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-mail size-4 shrink-0"><path d="M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10"></path><path d="M3 7l9 6l9 -6"></path></svg><a href="mailto:[email protected]" class="text-foreground underline underline-offset-2 hover:text-primary transition-colors">[email protected]</a></p></div></div></div></section><section id="call-to-action" class="relative overflow-hidden px-4 py-16 md:py-24"><div class="relative mx-auto max-w-5xl px-6"><div class="reveal-visible text-center"><h2 class="text-balance text-4xl font-semibold lg:text-5xl">Start creating with your AI video generator</h2><p class="mt-4 text-lg text-muted-foreground">Free credits on signup. Try video, image, and music generation — no card required.</p><div class="mt-12 flex flex-wrap justify-center gap-4"><button type="button" class="group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-
10px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&amp;_svg]:pointer-events-none [&amp;_svg]:shrink-0 [&amp;_svg:not([class*=&#x27;size-&#x27;])]:size-4 bg-primary text-primary-foreground [a]:hover:bg-primary/80 h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2"><span>Start free</span></button></div></div></div></section><footer class="border-t"><div class="container mx-auto max-w-7xl px-4"><div class="grid grid-cols-2 gap-8 py-16 md:grid-cols-7"><div class="col-span-full flex flex-col items-start md:col-span-2"><div class="flex items-center space-x-2"><img src="/logo.png" alt="Viddi AI logo" class="size-8 rounded-md dark:hidden" width="32" height="32" decoding="async"/><img src="/logo-dark.png" alt="Viddi AI logo" class="size-8 rounded-md hidden dark:block" width="32" height="32" decoding="async"/><span class="text-xl font-semibold">Viddi AI</span></div><p class="text-muted-foreground text-base py-2 md:pr-12">Your all-in-one AI agent for video, image, and music.</p><nav aria-label="Social links" class="flex items-center gap-4 pt-6"><a href="mailto:[email protected]" target="_blank" rel="noreferrer" aria-label="Email" class="inline-flex size-8 items-center justify-center rounded-full border border-border hover:bg-primary/10 hover:text-primary hover:border-primary/30 transition-all duration-200"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="none" class="tabler-icon tabler-icon-mail-filled size-4"><path d="M22 7.535v9.465a3 3 0 0 1 -2.824 2.995l-.176 .005h-14a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-9.465l9.445 6.297l.116 .066a1 1 0 0 0 .878 0l.116 -.066l9.445 -6.297z"></path><path d="M19 4c1.08 0 2.027 .57 2.555 1.427l-9.555 6.37l-9.555 -6.37a2.999 2.999 0 0 1 2.354 -1.42l.201 -.007h14z"></path></svg></a></nav></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Product</span><ul class="mt-4 list-inside space-y-3"><li><a href="/#features" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Features</a></li><li><a href="/pricing" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Pricing</a></li><li><a href="/#faqs" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">FAQ</a></li></ul></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Tool</span><ul class="mt-4 list-inside space-y-3"><li><a href="/yeri-ai-image-generator" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Yeri AI Image Generator</a></li><li><a href="/bigjpg" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Bigjpg Image Upscaler</a></li><li><a href="/pixel-dissolve" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Pixel Dissolve</a></li><li><a href="/purupuru-maker" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">PuruPuru Maker</a></li><li><a href="/oakgen-ai" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">OakGen AI Alternative</a></li></ul></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Resources</span><ul class="mt-4 list-inside space-y-3"><li><a href="/blog" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Blog</a></li><li><a href="/changelog" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Changelog</a></li><li><a href="/roadmap" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Roadmap</a></li></ul></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Company</span><ul class="mt-4 list-inside space-y-3"><li><a href="/about" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">About</a></li><li><a href="/contact" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Contact</a></li><li><a href="/waitlist" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Waitlist</a></li></ul></div><div class="col-span-1 md:col-span-1 flex flex-col items-start"><span class="text-sm font-semibold uppercase">Legal</span><ul class="mt-4 list-inside space-y-3"><li><a href="/cookie" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Cookie Policy</a></li><li><a href="/privacy" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Privacy Policy</a></li><li><a href="/terms" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary data-[active=true]:font-semibold data-[active=true]:text-primary">Terms of Service</a></li></ul></div></div></div><div class="border-t"><div class="container mx-auto max-w-7xl px-4 py-10"><nav aria-label="Blog"><h2 class="text-sm font-semibold uppercase">Blog</h2><ul class="mt-4 flex flex-col gap-2.5"><li><a href="/blog/seedance-2-5-vs-minimax-h3" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Seedance 2.5 vs MiniMax H3: A Creator&#x27;s Buyer&#x27;s Guide to the July 31 AI Video Launches</a></li><li><a href="/blog/flux-3-open-source" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Is FLUX 3 Open Source? What Creators Can Actually Build Today (2026)</a></li><li><a href="/blog/flux-3-huggingface" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">FLUX 3 Hugging Face: A Creator&#x27;s Tracker for the Open-Weight Dev Release</a></li><li><a href="/blog/deepseek-v4-flash" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">DeepSeek V4 Flash Goes Official: Build 0731 Rewrites the Agent Benchmark Table</a></li><li><a href="/blog/laguna-s-2-1" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Laguna S 2.1: Poolside&#x27;s 118B Open-Weight Coding Agent Beats Models 20x Its Size</a></li><li><a href="/blog/honeycomb" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Claude Honeycomb EAP Leaked: What the Per-Turn Controls Reveal About Opus 5</a></li><li><a href="/blog/gpt-6" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">GPT-6: OpenAI&#x27;s Next Frontier Model Leaked — Everything We Know About Features, Benchmarks, and Release</a></li><li><a href="/blog/glm-5-5" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Z.ai GLM-5.5 Rumors: 1T+ Parameters, Open Weights, August 2026 Launc
10h — What We Know</a></li><li><a href="/blog/gemini-3-6-flash" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Gemini 3.6 Flash: Google Ships a 17% More Token-Efficient Workhorse Two Days Ago</a></li><li><a href="/blog/video-to-prompt-2026" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Video to Prompt: How to Extract and Reverse-Engineer AI Video Prompts in 2026</a></li><li><a href="/blog/seedance-pricing-2026" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Seedance Pricing in 2026: Plans, Costs, and How Much You Really Pay</a></li><li><a href="/blog/seedance-2-api-guide-2026" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">How to Use the Seedance 2.0 API: A Developer&#x27;s Complete Guide to Video Generation (2026)</a></li><li><a href="/blog/cancel-higgsfield-subscription-2026" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">How to Cancel Your Higgsfield Subscription in 2026 (and What to Use Instead)</a></li><li><a href="/blog/grok-4-6" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Grok 4.6: SpaceXAI&#x27;s 2T LLM Training Completes July 21 — What to Expect</a></li><li><a href="/blog/qwen3-8-max" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Qwen3.8 Max: Alibaba&#x27;
10s 2.4T Open-Weight LLM Claims Second Only to Claude Fable 5</a></li><li><a href="/blog/kimi-k3-pricing" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Kimi K3 Pricing: The True Economics of $0.30 per Million Tokens</a></li><li><a href="/blog/torenia-alpha" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Torenia Alpha: The Anonymous AI Model on Code Arena Nobody Can Identify</a></li><li><a href="/blog/lucy-2-5-live-ai-news" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Decart Launches Lucy 2.5: Real-Time AI Video Editing at 30 FPS 1080p</a></li><li><a href="/blog/hermes-agent" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Hermes Agent: Self-Improving AI Framework Hits 217K GitHub Stars in 5 Months</a></li><li><a href="/blog/glm-5-3" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">GLM 5.3 Doesn&#x27;t Exist — What GLM-5.2 Actually Ships in 2026</a></li><li><a href="/blog/kimi-k3-openrouter" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Kimi K3 on OpenRouter: Pricing, Caching Trade-Offs, and When to Go Direct (2026)</a></li><li><a href="/blog/kimi-k3-open-source" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Is Kimi K3 Open Source? License, Weights, and What You Can Actually Build With It (2026)</a></li><li><a href="/blog/kimi-k3-huggingface" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Kimi K3 on Hugging Face: Open Weights, Download Size, and What Your Hardware Actually Needs (July 2026)</a></li><li><a href="/blog/kimi-k3-benchmarks" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Kimi K3 Benchmark Results: Head-to-Head vs GPT-5.6, Fable 5, and Opus 4.8 (July 2026)</a></li><li><a href="/blog/kimi-k3-explained" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">What Is Kimi K3? Moonshot AI&#x27;s 2.5T Parameter Model Explained (Pre-Release)</a></li><li><a href="/blog/cosmos-3-edge" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">NVIDIA Cosmos 3 Edge: 4B World Foundation Model for On-Device Robots</a></li><li><a href="/blog/candy-ai-2026-updates" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Candy AI in 2026: Live Action Video, Story Mode, and What&#x27;s Next</a></li><li><a href="/blog/bonsai-27b" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Bonsai 27B: The 27B Model That Runs on a Phone at 3.9 GB</a></li><li><a href="/blog/what-is-reve-2-1" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">What Is Reve 2.1? The 4K Layout-First AI Image Model Explained</a></li><li><a href="/blog/soofi-s-31-6b" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Soofi S 31.6B: Germany&#x27;s Sovereign AI Model with 1M-Token Context</a></li><li><a href="/blog/jules-google-labs" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Jules: Google Labs&#x27; Proactive AI Coding Agent That Spots Bugs Before You Ask</a></li><li><a href="/blog/ornith-1-0" class="text-sm text-muted-foreground transition-colors duration-150 hover:text-primary focus-visible:text-primary">Ornith-1.0: Self-Scaffolding RL Coding Model That Beats Claude Opus 4.7</a></li></ul></nav></div></div><div class="border-t py-8"><div class="container mx-auto max-w-7xl px-4 flex items-center justify-center"><span class="text-muted-foreground text-sm">© <!-- -->2026<!-- --> <!-- -->Viddi AI<!-- -->.<!-- --> <!-- -->All Rights Reserved</span></div></div></footer></div>
10<script></script>
10<!--/$--></div></main></div><section aria-label="Notifications alt+T" tabindex="-1" aria-live="polite" aria-relevant="additions text" aria-atomic="false"></section>
10<script class="$tsr" id="$tsr-stream-barrier">(self.$R=self.$R||{})["tsr"]=[];self.$_TSR={h(){this.hydrated=!0,this.c()},e(){this.streamEnded=!0,this.c()},c(){this.hydrated&&this.streamEnded&&(delete self.$_TSR,delete self.$R.tsr)},p(e){this.initialized?e():this.buffer.push(e)},buffer:[]};
11;$_TSR.router=($R=>$R[0]={manifest:$R[1]={routes:$R[2]={__root__:$R[3]={preloads:$R[4]=["/assets/main-Dr7Ur_CA.js"],assets:$R[5]=[$R[6]={tag:"script",attrs:$R[7]={type:"module",async:!0},children:"import(\"/assets/main-Dr7Ur_CA.js\")"}]},"/":$R[8]={preloads:$R[9]=["/assets/index-N8CiFnkC.js","/assets/container-CGMUfDYj.js","/assets/generate-section-DxJzLeTg.js","/assets/footer-C6UEOTdB.js","/assets/faqs-qVJmjl7W.js","/assets/accordion-c-b5CszD.js","/assets/pricing-table-uJ9xHRhw.js","/assets/IconStarFilled-me1OXRj8.js","/assets/newsletter-CqvZg2ZR.js","/assets/useMutation-JdCt38To.js","/assets/dashboard-header-qTagMVb2.js","/assets/switch-BbojWMqt.js","/assets/textarea-CDFLSkOe.js","/assets/IconSearch-BpXh9UVs.js","/assets/IconClock-CbOEuRbC.js","/assets/IconVideo-C4AipVdq.js","/assets/popover-BDRglRFy.js","/assets/IconChevronDown-NDv1gopd.js","/assets/IconPlus-CS9DY6zy.js","/assets/image-rail-skeleton-VU6a9Eao.js","/assets/image-placeholder-DHsYRjB5.js","/assets/IconPhotoX-AGDOewMM.js","/assets/view-transitions-DI9Ka7KA.js","/assets/IconPlayerPlayFilled-KY61RsLs.js","/assets/badge-BfowtO_O.js","/assets/download-t_9I7m3H.js","/assets/formatter-DSiKNW4-.js","/assets/history-cache-BtEPrrjI.js","/assets/IconDownload-sRz84ZOT.js","/assets/IconCopy-9lz_sVdr.js","/assets/image-lightbox-BZPaWxGk.js","/assets/IconChevronLeft-BQgEJ8KU.js","/assets/tabs-DtyzsxuI.js","/assets/CompositeRoot-DTqZ8qJG.js","/assets/isElementDisabled-CwHw_lZC.js","/assets/toggle-group-DVGxZeXr.js","/assets/price-plan-Hy7tuV8t.js","/assets/models-WOgIik7l.js","/assets/use-creation-4xzfTSyX.js","/assets/IconMailFilled-Bnxnpes4.js","/assets/IconChevronUp-B_-Ld2VQ.js","/assets/payment-E_aVS6ve.js","/assets/select-DvQ_4pL_.js","/assets/IconCircleX-Bpb_KOjk.js","/assets/IconArrowLeft-D19EBHVj.js"]}}},matches:$R[10]=[$R[11]={i:"__root__/",u:1791330688153,s:"success",ssr:!0},$R[12]={i:"//{}",u:1791330688800,s:"success",l:$R[13]={testimonialProfiles:$R[14]=[$R[15]={fullName:"Alma Walters",image:"https://randomuser.me/api/portraits/women/36.jpg"},$R[16]={fullName:"Beatrice Sullivan",image:"https://randomuser.me/api/portraits/women/6.jpg"},$R[17]={fullName:"Kelly Arnold",image:"https://randomuser.me/api/portraits/women/88.jpg"},$R[18]={fullName:"Emily Johnson",image:"https://randomuser.me/api/portraits/women/12.jpg"},$R[19]={fullName:"Avery Ambrose",image:"https://randomuser.me/api/portraits/women/24.jpg"},$R[20]={fullName:"Everett Reid",image:"https://randomuser.me/api/portraits/men/78.jpg"},$R[21]={fullName:"Gladys Jimenez",image:"https://randomuser.me/api/portraits/women/12.jpg"},$R[22]={fullName:"Juanita Franklin",image:"https://randomuser.me/api/portraits/women/44.jpg"},$R[23]={fullName:"Eugene Rodriquez",image:"https://randomuser.me/api/portraits/men/78.jpg"}],blogArticles:$R[24]=[$R[25]={title:"Seedance 2.5 vs MiniMax H3: A Creator's Buyer's Guide to the July 31 AI Video Launches",href:"/blog/seedance-2-5-vs-minimax-h3"},$R[26]={title:"Is FLUX 3 Open Source? What Creators Can Actually Build Today (2026)",href:"/blog/flux-3-open-source"},$R[27]={title:"FLUX 3 Hugging Face: A Creator's Tracker for the Open-Weight Dev Release",href:"/blog/flux-3-huggingface"},$R[28]={title:"DeepSeek V4 Flash Goes Official: Build 0731 Rewrites the Agent Benchmark Table",href:"/blog/deepseek-v4-flash"},$R[29]={title:"Laguna S 2.1: Poolside's 118B Open-Weight Coding Agent Beats Models 20x Its Size",href:"/blog/laguna-s-2-1"},$R[30]={title:"Claude Honeycomb EAP Leaked: What the Per-Turn Controls Reveal About Opus 5",href:"/blog/honeycomb"},$R[31]={title:"GPT-6: OpenAI's Next Frontier Model Leaked — Everything We Know About Features, Benchmarks, and Release",href:"/blog/gpt-6"},$R[32]={title:"Z.ai GLM-5.5 Rumors: 1T+ Parameters, Open Weights, August 2026 Launch — What We Know",href:"/blog/glm-5-5"},$R[33]={title:"Gemini 3.6 Flash: Google Ships a 17% More Token-Efficient Workhorse Two Days Ago",href:"/blog/gemini-3-6-flash"},$R[34]={title:"Video to Prompt: How to Extract and Reverse-Engineer AI Video Prompts in 2026",href:"/blog/video-to-prompt-2026"},$R[35]={title:"Seedance Pricing in 2026: Plans, Costs, and How Much You Really Pay",href:"/blog/seedance-pricing-2026"},$R[36]={title:"How to Use the Seedance 2.0 API: A Developer's Complete Guide to Video Generation (2026)",href:"/blog/seedance-2-api-guide-2026"},$R[37]={title:"How to Cancel Your Higgsfield Subscription in 2026 (and What to Use Instead)",href:"/blog/cancel-higgsfield-subscription-2026"},$R[38]={title:"Grok 4.6: SpaceXAI's 2T LLM Training Completes July 21 — What to Expect",href:"/blog/grok-4-6"}
11,$R[39]={title:"Qwen3.8 Max: Alibaba's 2.4T Open-Weight LLM Claims Second Only to Claude Fable 5",href:"/blog/qwen3-8-max"},$R[40]={title:"Kimi K3 Pricing: The True Economics of $0.30 per Million Tokens",href:"/blog/kimi-k3-pricing"},$R[41]={title:"Torenia Alpha: The Anonymous AI Model on Code Arena Nobody Can Identify",href:"/blog/torenia-alpha"},$R[42]={title:"Decart Launches Lucy 2.5: Real-Time AI Video Editing at 30 FPS 1080p",href:"/blog/lucy-2-5-live-ai-news"},$R[43]={title:"Hermes Agent: Self-Improving AI Framework Hits 217K GitHub Stars in 5 Months",href:"/blog/hermes-agent"},$R[44]={title:"GLM 5.3 Doesn't Exist — What GLM-5.2 Actually Ships in 2026",href:"/blog/glm-5-3"},$R[45]={title:"Kimi K3 on OpenRouter: Pricing, Caching Trade-Offs, and When to Go Direct (2026)",href:"/blog/kimi-k3-openrouter"},$R[46]={title:"Is Kimi K3 Open Source? License, Weights, and What You Can Actually Build With It (2026)",href:"/blog/kimi-k3-open-source"},$R[47]={title:"Kimi K3 on Hugging Face: Open Weights, Download Size, and What Your Hardware Actually Needs (July 2026)",href:"/blog/kimi-k3-huggingface"},$R[48]={title:"Kimi K3 Benchmark Results: Head-to-Head vs GPT-5.6, Fable 5, and Opus 4.8 (July 2026)",href:"/blog/kimi-k3-benchmarks"},$R[49]={title:"What Is Kimi K3? Moonshot AI's 2.5T Parameter Model Explained (Pre-Release)",href:"/blog/kimi-k3-explained"},$R[50]={title:"NVIDIA Cosmos 3 Edge: 4B World Foundation Model for On-Device Robots",href:"/blog/cosmos-3-edge"},$R[51]={title:"Candy AI in 2026: Live Action Video, Story Mode, and What's Next",href:"/blog/candy-ai-2026-updates"},$R[52]={title:"Bonsai 27B: The 27B Model That Runs on a Phone at 3.9 GB",href:"/blog/bonsai-27b"},$R[53]={title:"What Is Reve 2.1? The 4K Layout-First AI Image Model Explained",href:"/blog/what-is-reve-2-1"},$R[54]={title:"Soofi S 31.6B: Germany's Sovereign AI Model with 1M-Token Context",href:"/blog/soofi-s-31-6b"},$R[55]={title:"Jules: Google Labs' Proactive AI Coding Agent That Spots Bugs Before You Ask",href:"/blog/jules-google-labs"},$R[56]={title:"Ornith-1.0: Self-Scaffolding RL Coding Model That Beats Claude Opus 4.7",href:"/blog/ornith-1-0"}]},ssr:!0}],lastMatchId:"//{}",dehydratedData:$R[57]={queryStream:$R[58]=($R[59]=(e) => new ReadableStream({ start: (r) => {
12  e.on({ next: (a2) => {
13    try {
14      r.enqueue(a2);
15    } catch (t) {
16    }
17  }, throw: (a2) => {
18    r.error(a2);
19  }, return: () => {
20    try {
21      r.close();
22    } catch (a2) {
23    }
24  } });
25} }))($R[60]=($R[61]=() => {
26  let e = [], r = [], t = true, n2 = false, a2 = 0, s = (l, g, S) => {
27    for (S = 0; S < a2; S++) r[S] && r[S][g](l);
28  }, i = (l, g, S, d) => {
29    for (g = 0, S = e.length; g < S; g++) d = e[g], !t && g === S - 1 ? l[n2 ? "return" : "throw"](d) : l.next(d);
30  }, u = (l, g) => (t && (g = a2++, r[g] = l), i(l), () => {
31    t && (r[g] = r[a2], r[a2--] = void 0);
32  });
33  return { __SEROVAL_STREAM__: true, on: (l) => u(l), next: (l) => {
34    t && (e.push(l), s(l, "next"));
35  }, throw: (l) => {
36    t && (e.push(l), s(l, "throw"), t = false, n2 = false, r.length = 0);
37  }, return: (l) => {
38    t && (e.push(l), s(l, "return"), t = false, n2 = true, r.length = 0);
39  } };
40})())}})($R["tsr"]);document.currentScript.remove()</script>
40<script type="module" async="">import("/assets/main-Dr7Ur_CA.js")</script>
40<script>($R=>$R[60].return(void 0))($R["tsr"]);$_TSR.e();document.currentScript.remove()</script>
40<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"37c5cedffd6440759bf03e83f366a152","r":1,"spa":2}' crossorigin="anonymous"></script>
40
41</body></html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.