425 lines
25 KiB
HTML
425 lines
25 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Banatie Features Grid</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
|
|
|
|
body {
|
|
font-family: 'Inter', sans-serif;
|
|
background: linear-gradient(180deg, #0A0E1A 0%, #141925 100%);
|
|
}
|
|
|
|
.text-gradient {
|
|
background: linear-gradient(135deg, #FFFFFF 0%, #D1D5DB 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
.brand-gradient {
|
|
background: linear-gradient(135deg, #3B82F6 0%, #8B5CF6 100%);
|
|
}
|
|
|
|
.card-bg {
|
|
background: linear-gradient(135deg, rgba(59, 130, 246, 0.05) 0%, rgba(139, 92, 246, 0.05) 100%);
|
|
backdrop-filter: blur(10px);
|
|
}
|
|
|
|
.feature-card {
|
|
transition: all 0.3s ease;
|
|
border: 1px solid rgba(55, 65, 81, 1);
|
|
}
|
|
|
|
.feature-card:hover {
|
|
transform: translateY(-8px);
|
|
border-color: rgba(59, 130, 246, 0.3);
|
|
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
.icon-glow {
|
|
box-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
|
|
}
|
|
|
|
.section-bg-alt {
|
|
background:
|
|
linear-gradient(135deg, rgba(59, 130, 246, 0.03) 0%, rgba(139, 92, 246, 0.03) 100%),
|
|
#141925;
|
|
}
|
|
|
|
.testimonial-card {
|
|
background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
|
|
backdrop-filter: blur(10px);
|
|
border: 1px solid rgba(255, 255, 255, 0.1);
|
|
}
|
|
|
|
.stat-highlight {
|
|
background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(5, 150, 105, 0.1) 100%);
|
|
border: 1px solid rgba(16, 185, 129, 0.2);
|
|
}
|
|
|
|
.code-block {
|
|
background: linear-gradient(135deg, rgba(31, 41, 55, 0.8) 0%, rgba(17, 24, 39, 0.8) 100%);
|
|
border: 1px solid rgba(75, 85, 99, 0.3);
|
|
}
|
|
|
|
.floating-element {
|
|
animation: float 6s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes float {
|
|
0%, 100% { transform: translateY(0px); }
|
|
50% { transform: translateY(-10px); }
|
|
}
|
|
|
|
.slide-in {
|
|
animation: slideIn 0.8s ease-out;
|
|
}
|
|
|
|
@keyframes slideIn {
|
|
from { opacity: 0; transform: translateX(-50px); }
|
|
to { opacity: 1; transform: translateX(0); }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="text-white">
|
|
|
|
<!-- How Banatie Solves Every Pain Point -->
|
|
<section class="py-20">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-4xl md:text-5xl font-bold text-gradient mb-6">
|
|
How Banatie Solves Every Pain Point
|
|
</h2>
|
|
<p class="text-xl text-gray-300 max-w-3xl mx-auto">
|
|
Transform your development workflow with intelligent automation that eliminates complexity without sacrificing power.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
|
<!-- Solution 1: One API Call -->
|
|
<div class="feature-card card-bg rounded-2xl p-8 text-center">
|
|
<div class="w-16 h-16 brand-gradient rounded-2xl flex items-center justify-center mx-auto mb-6 icon-glow">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-2xl font-bold text-white mb-4">⚡ One API Call</h3>
|
|
<p class="text-gray-300 mb-6 leading-relaxed">
|
|
Single endpoint replaces complex setup. Comprehensive SDKs included. Zero authentication headaches.
|
|
</p>
|
|
<div class="stat-highlight rounded-lg p-4">
|
|
<div class="text-2xl font-bold text-green-400 mb-1">5 minutes</div>
|
|
<div class="text-sm text-green-300">Start generating images</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Solution 2: AI-Powered Prompts -->
|
|
<div class="feature-card card-bg rounded-2xl p-8 text-center">
|
|
<div class="w-16 h-16 brand-gradient rounded-2xl flex items-center justify-center mx-auto mb-6 icon-glow">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-2xl font-bold text-white mb-4">🧠 AI-Powered Prompts</h3>
|
|
<p class="text-gray-300 mb-6 leading-relaxed">
|
|
Automatic optimization for Nano Banana. Any language → perfect English prompts. Consistent professional results.
|
|
</p>
|
|
<div class="stat-highlight rounded-lg p-4">
|
|
<div class="text-2xl font-bold text-green-400 mb-1">40% better</div>
|
|
<div class="text-sm text-green-300">Quality improvement</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Solution 3: Smart Collaging -->
|
|
<div class="feature-card card-bg rounded-2xl p-8 text-center">
|
|
<div class="w-16 h-16 brand-gradient rounded-2xl flex items-center justify-center mx-auto mb-6 icon-glow">
|
|
<svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-2xl font-bold text-white mb-4">🎨 Smart Collaging</h3>
|
|
<p class="text-gray-300 mb-6 leading-relaxed">
|
|
Automated reference image handling. Intelligent composition algorithms. Instant multi-image processing.
|
|
</p>
|
|
<div class="stat-highlight rounded-lg p-4">
|
|
<div class="text-2xl font-bold text-green-400 mb-1">30 minutes</div>
|
|
<div class="text-sm text-green-300">Saved per request</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Everything You Need Section -->
|
|
<section class="section-bg-alt py-20">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-4xl md:text-5xl font-bold text-white mb-6">
|
|
Everything You Need for Professional Image Generation
|
|
</h2>
|
|
<p class="text-xl text-gray-300 max-w-3xl mx-auto">
|
|
A complete toolkit that scales from your first API call to enterprise-grade deployments.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
<!-- Feature 1: Instant Integration -->
|
|
<div class="feature-card card-bg rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-12 h-12 brand-gradient rounded-lg flex items-center justify-center mr-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-white">Instant Integration</h3>
|
|
</div>
|
|
<p class="text-gray-300 mb-4">Single API endpoint, comprehensive SDKs for JavaScript, Python, PHP, Go. Complete documentation.</p>
|
|
<div class="text-sm text-blue-400 font-medium">Deploy in one afternoon</div>
|
|
</div>
|
|
|
|
<!-- Feature 2: Intelligent Optimization -->
|
|
<div class="feature-card card-bg rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-12 h-12 brand-gradient rounded-lg flex items-center justify-center mr-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-white">Intelligent Optimization</h3>
|
|
</div>
|
|
<p class="text-gray-300 mb-4">AI-enhanced prompt processing with Google best practices built-in. Consistent quality output.</p>
|
|
<div class="text-sm text-blue-400 font-medium">40% better results guaranteed</div>
|
|
</div>
|
|
|
|
<!-- Feature 3: Universal Language Support -->
|
|
<div class="feature-card card-bg rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-12 h-12 brand-gradient rounded-lg flex items-center justify-center mr-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-white">Universal Language</h3>
|
|
</div>
|
|
<p class="text-gray-300 mb-4">95+ languages accepted. Automatic translation & optimization. Global team friendly.</p>
|
|
<div class="text-sm text-blue-400 font-medium">Break down language barriers</div>
|
|
</div>
|
|
|
|
<!-- Feature 4: Reference Collaging -->
|
|
<div class="feature-card card-bg rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-12 h-12 brand-gradient rounded-lg flex items-center justify-center mr-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-white">Reference Collaging</h3>
|
|
</div>
|
|
<p class="text-gray-300 mb-4">Multi-image automation with smart composition algorithms. Style consistency maintained.</p>
|
|
<div class="text-sm text-blue-400 font-medium">Save 30 minutes per request</div>
|
|
</div>
|
|
|
|
<!-- Feature 5: Usage Analytics -->
|
|
<div class="feature-card card-bg rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-12 h-12 brand-gradient rounded-lg flex items-center justify-center mr-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-white">Usage Analytics</h3>
|
|
</div>
|
|
<p class="text-gray-300 mb-4">Generation success metrics, cost optimization insights, and performance monitoring dashboard.</p>
|
|
<div class="text-sm text-blue-400 font-medium">Optimize your workflow</div>
|
|
</div>
|
|
|
|
<!-- Feature 6: Enterprise Ready -->
|
|
<div class="feature-card card-bg rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-12 h-12 brand-gradient rounded-lg flex items-center justify-center mr-4">
|
|
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0121 12c0 .749-.071 1.485-.207 2.201m-.207-6.402A11.955 11.955 0 0121 12c0 .749-.071 1.485-.207 2.201m0-6.402L15 12l6.793 6.793M3 3l6.793 6.793L21 12"></path>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-semibold text-white">Enterprise Ready</h3>
|
|
</div>
|
|
<p class="text-gray-300 mb-4">SLA guarantees available, white-label options, and custom integrations for enterprise needs.</p>
|
|
<div class="text-sm text-blue-400 font-medium">Scale with confidence</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Code Example Section -->
|
|
<section class="py-20">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-4xl font-bold text-white mb-6">
|
|
Simple API, Powerful Results
|
|
</h2>
|
|
<p class="text-xl text-gray-300 max-w-2xl mx-auto">
|
|
See how easy it is to generate professional images with just a few lines of code.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
|
<!-- Code Block -->
|
|
<div class="slide-in">
|
|
<div class="code-block rounded-xl p-6 font-mono text-sm">
|
|
<div class="flex items-center mb-4">
|
|
<div class="flex space-x-2 mr-4">
|
|
<div class="w-3 h-3 bg-red-500 rounded-full"></div>
|
|
<div class="w-3 h-3 bg-yellow-500 rounded-full"></div>
|
|
<div class="w-3 h-3 bg-green-500 rounded-full"></div>
|
|
</div>
|
|
<span class="text-gray-400">main.js</span>
|
|
</div>
|
|
<div class="space-y-2">
|
|
<div><span class="text-purple-400">import</span> <span class="text-blue-400">{ Banatie }</span> <span class="text-purple-400">from</span> <span class="text-green-400">'@banatie/sdk'</span><span class="text-gray-400">;</span></div>
|
|
<div></div>
|
|
<div><span class="text-purple-400">const</span> <span class="text-blue-400">banatie</span> <span class="text-gray-400">=</span> <span class="text-purple-400">new</span> <span class="text-yellow-400">Banatie</span><span class="text-gray-400">(</span><span class="text-green-400">'your-api-key'</span><span class="text-gray-400">);</span></div>
|
|
<div></div>
|
|
<div><span class="text-purple-400">const</span> <span class="text-blue-400">result</span> <span class="text-gray-400">=</span> <span class="text-purple-400">await</span> <span class="text-blue-400">banatie</span><span class="text-gray-400">.</span><span class="text-yellow-400">generate</span><span class="text-gray-400">({</span></div>
|
|
<div><span class="text-gray-400"> </span><span class="text-blue-400">prompt</span><span class="text-gray-400">:</span> <span class="text-green-400">"A futuristic robot in a neon city"</span><span class="text-gray-400">,</span></div>
|
|
<div><span class="text-gray-400"> </span><span class="text-blue-400">style</span><span class="text-gray-400">:</span> <span class="text-green-400">"cyberpunk"</span><span class="text-gray-400">,</span></div>
|
|
<div><span class="text-gray-400"> </span><span class="text-blue-400">references</span><span class="text-gray-400">:</span> <span class="text-gray-400">[</span><span class="text-green-400">"ref1.jpg"</span><span class="text-gray-400">,</span> <span class="text-green-400">"ref2.jpg"</span><span class="text-gray-400">]</span></div>
|
|
<div><span class="text-gray-400">});</span></div>
|
|
<div></div>
|
|
<div><span class="text-blue-400">console</span><span class="text-gray-400">.</span><span class="text-yellow-400">log</span><span class="text-gray-400">(</span><span class="text-blue-400">result</span><span class="text-gray-400">.</span><span class="text-blue-400">imageUrl</span><span class="text-gray-400">);</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Benefits List -->
|
|
<div class="space-y-6">
|
|
<div class="flex items-start">
|
|
<div class="w-8 h-8 bg-green-500 rounded-full flex items-center justify-center mr-4 mt-1">
|
|
<svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h4 class="text-lg font-semibold text-white mb-2">Automatic Prompt Optimization</h4>
|
|
<p class="text-gray-300">Your simple prompt gets enhanced with Google's best practices automatically.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex items-start">
|
|
<div class="w-8 h-8 bg-green-500 rounded-full flex items-center justify-center mr-4 mt-1">
|
|
<svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h4 class="text-lg font-semibold text-white mb-2">Smart Reference Handling</h4>
|
|
<p class="text-gray-300">Multiple reference images get intelligently combined into the perfect composition.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex items-start">
|
|
<div class="w-8 h-8 bg-green-500 rounded-full flex items-center justify-center mr-4 mt-1">
|
|
<svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h4 class="text-lg font-semibold text-white mb-2">Production Ready</h4>
|
|
<p class="text-gray-300">Error handling, retries, and monitoring built-in for enterprise reliability.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Social Proof Section -->
|
|
<section class="section-bg-alt py-20">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-16">
|
|
<h2 class="text-4xl font-bold text-white mb-6">
|
|
Join the AI Image Generation Revolution
|
|
</h2>
|
|
<p class="text-xl text-gray-300">
|
|
Developers and businesses worldwide are already transforming their workflows with Banatie.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
|
|
<!-- Stat 1 -->
|
|
<div class="text-center floating-element">
|
|
<div class="text-5xl font-bold text-gradient mb-2">$60.8B</div>
|
|
<div class="text-lg text-gray-300 mb-2">AI Image Market by 2030</div>
|
|
<div class="text-sm text-gray-400">38.2% annual growth rate</div>
|
|
</div>
|
|
|
|
<!-- Stat 2 -->
|
|
<div class="text-center floating-element" style="animation-delay: 2s;">
|
|
<div class="text-5xl font-bold text-gradient mb-2">500+</div>
|
|
<div class="text-lg text-gray-300 mb-2">Developers on Waitlist</div>
|
|
<div class="text-sm text-gray-400">Growing daily</div>
|
|
</div>
|
|
|
|
<!-- Stat 3 -->
|
|
<div class="text-center floating-element" style="animation-delay: 4s;">
|
|
<div class="text-5xl font-bold text-gradient mb-2">89%</div>
|
|
<div class="text-lg text-gray-300 mb-2">Willing to Pay Premium</div>
|
|
<div class="text-sm text-gray-400">For simplified AI generation</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Testimonials -->
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
<div class="testimonial-card rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-10 h-10 bg-blue-500 rounded-full flex items-center justify-center mr-3">
|
|
<span class="text-white font-semibold">JS</span>
|
|
</div>
|
|
<div>
|
|
<div class="font-semibold text-white">Jake Stevens</div>
|
|
<div class="text-sm text-gray-400">Lead Developer, TechCorp</div>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-300 italic">
|
|
"I spent 2 weeks trying to get consistent results from Nano Banana. Banatie had me generating professional images in 30 minutes."
|
|
</p>
|
|
</div>
|
|
|
|
<div class="testimonial-card rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-10 h-10 bg-purple-500 rounded-full flex items-center justify-center mr-3">
|
|
<span class="text-white font-semibold">ML</span>
|
|
</div>
|
|
<div>
|
|
<div class="font-semibold text-white">Maria Lopez</div>
|
|
<div class="text-sm text-gray-400">CTO, StartupXYZ</div>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-300 italic">
|
|
"We needed reliable image generation that could scale with our user base. Banatie's infrastructure handles our 10,000+ daily requests flawlessly."
|
|
</p>
|
|
</div>
|
|
|
|
<div class="testimonial-card rounded-xl p-6">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-10 h-10 bg-green-500 rounded-full flex items-center justify-center mr-3">
|
|
<span class="text-white font-semibold">RC</span>
|
|
</div>
|
|
<div>
|
|
<div class="font-semibold text-white">Robert Chen</div>
|
|
<div class="text-sm text-gray-400">Creative Director, Agency</div>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-300 italic">
|
|
"Brand consistency across AI-generated assets was impossible before Banatie's style templates and optimization."
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</body>
|
|
</html> |