Complete website enhancement: Translate README to English, add benchmark results, model collection section, and improve visuals

README.md

@@ -0,0 +1,64 @@
+---
+title: ByteDance Seedance Pro I2V 480p
+emoji: 🎬
+colorFrom: blue
+colorTo: purple
+sdk: static
+pinned: true
+short_description: 'Revolutionary AI Image-to-Video Generation Model by ByteDance, Global Premiere on WaveSpeedAI'
+---
+
+# ByteDance Seedance Pro I2V 480p
+
+## Revolutionary AI Image-to-Video Generation Technology
+
+ByteDance Seedance Pro I2V 480p is a revolutionary AI image-to-video generation model developed by ByteDance, now exclusively available on WaveSpeedAI as a global premiere launch. This cutting-edge model transforms static images into dynamic 5-second videos at 480p resolution with lightning-fast processing speed, offering high-quality visual outputs with enhanced motion and semantic understanding. Part of the Dreamina model family, this SOTA-level model delivers unprecedented performance in image-to-video synthesis.
+
+## Key Features
+
+- **Ultra-Fast Video Generation**: Lightning-speed processing creates 5-second videos at 480p resolution with vivid details and smooth motion in seconds, not minutes.
+- **SOTA Motion Rendering**: State-of-the-art dynamic rendering techniques create natural and realistic movements that bring images to life.
+- **Advanced Semantic Understanding**: Industry-leading AI excels in interpreting complex user prompts to generate coherent and dynamic scenes with professional quality.
+- **Realistic Physical Simulation**: SOTA physics engine simulates realistic physical properties and movements for lifelike video generation.
+- **Blazing-Fast Processing**: Optimized for maximum speed efficiency, allowing instant creation of high-quality videos for real-time workflows.
+- **Flexible Parameter Control**: Customizable settings offer duration and style adjustments for complete creative control.
+- **Professional Quality Output**: SOTA image-to-video technology ensures broadcast-ready results with smooth temporal consistency.
+- **Instant Creative Enhancement**: Transform ordinary photos into engaging, dynamic content perfect for social media marketing in seconds.
+
+## Global Premiere on WaveSpeedAI
+
+WaveSpeedAI proudly presents the global premiere of ByteDance's latest image-to-video technology from the Dreamina model series. As the exclusive launch platform worldwide, WaveSpeedAI provides developers and creators with first access to this revolutionary SOTA model. This groundbreaking technology represents the cutting edge of AI video synthesis, now available exclusively through WaveSpeedAI's comprehensive API platform.
+
+## Technical Excellence & Speed Optimization
+
+- **SOTA Architecture**: Built on breakthrough research delivering state-of-the-art image-to-video generation performance.
+- **Optimized Processing**: Native ByteDance technology delivers superior generation speed compared to standard I2V solutions.
+- **Real-Time Processing**: Ultra-fast video synthesis enables immediate creative workflows and instant content creation.
+- **High-Performance Computing**: Enterprise-grade infrastructure supports rapid, high-volume video generation at scale.
+
+## Perfect for Fast-Paced Creative Work
+
+- **Content Creators**: Instantly transform static photography into engaging video content for social platforms with lightning-fast speed.
+- **Marketing Professionals**: Create dynamic promotional materials from product images in seconds, not hours.
+- **Social Media Managers**: Convert photos into shareable, dynamic content that captures attention with lightning-fast turnaround.
+- **E-commerce Teams**: Bring product photos to life with subtle motion effects using SOTA I2V technology.
+- **Digital Agencies**: Deliver client projects faster with instant video generation capabilities from the Dreamina model family.
+
+## Performance & Speed Advantages
+
+- **Instant Results**: Generate professional videos with SOTA processing speed in just seconds
+- **Real-time Workflow**: Advanced AI enables immediate creative iteration and rapid content production
+- **Scalable Speed**: Process multiple image-to-video conversions simultaneously without performance degradation
+- **Optimized Efficiency**: Advanced algorithms maximize speed while maintaining SOTA quality standards
+
+## Limitations
+
+- **Creative Focus**: Primarily designed for creative video synthesis; not suitable for generating factually accurate content
+- **Inherent Bias**: Outputs may reflect biases present in training data, typical of current SOTA models
+- **Input Sensitivity**: Quality and consistency of generated videos largely depends on input image quality; subtle changes may lead to output variations
+- **Resolution Limitation**: This model is optimized for 480p video generation, does not support higher resolutions
+- **Speed vs. Quality Trade-off**: While optimized for speed, extremely complex scenes may require additional processing time
+
+## Experience Seedance Pro
+
+Visit the [WaveSpeedAI platform](https://wavespeed.ai/collections/bytedance) now to experience this revolutionary image-to-video generation technology!

index.html

@@ -0,0 +1,334 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>ByteDance Seedance - Revolutionary AI Image-to-Video Models</title>
+    <meta name="description" content="Discover ByteDance's revolutionary Seedance AI models for image-to-video generation, exclusively available on WaveSpeedAI." />
+    <link rel="stylesheet" href="style.css" />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
+</head>
+<body>
+    <header>
+        <div class="container">
+            <div class="logo">
+                <h1>ByteDance <span>Seedance</span></h1>
+            </div>
+            <nav>
+                <ul>
+                    <li><a href="#features">Features</a></li>
+                    <li><a href="#comparison">Comparison</a></li>
+                    <li><a href="#technical">Technical Excellence</a></li>
+                    <li><a href="#use-cases">Use Cases</a></li>
+                    <li><a class="cta-button" href="https://wavespeed.ai/collections/bytedance" target="_blank">Try on WaveSpeed <i class="fas fa-external-link-alt"></i></a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+
+    <section class="hero">
+        <div class="container">
+            <div class="hero-content">
+                <h1>Transform Static Images into Dynamic Videos</h1>
+                <h2>Revolutionary AI Image-to-Video Generation</h2>
+                <p>ByteDance Seedance Pro I2V 480p transforms static images into dynamic 5-second videos with lightning-fast processing speed and professional quality.</p>
+                <div class="cta-buttons">
+                    <a href="https://wavespeed.ai/collections/bytedance" class="primary-button" target="_blank">Experience on WaveSpeed <i class="fas fa-arrow-right"></i></a>
+                    <a href="#features" class="secondary-button">Learn More</a>
+                </div>
+            </div>
+            <div class="hero-image">
+                <div class="demo-container">
+                    <img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/lm_sth/ljhwZthlaukjlkulzlp/ark/model_introduction/seedance/pro/intro/hero-image.jpg" alt="Image to Video Transformation Example" class="demo-image">
+                    <div class="arrow-animation"><i class="fas fa-long-arrow-alt-right"></i></div>
+                    <div class="video-placeholder">
+                        <div class="play-icon"><i class="fas fa-play"></i></div>
+                        <p>5-second dynamic video</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section id="features" class="features">
+        <div class="container">
+            <h2 class="section-title">Key Features</h2>
+            <div class="feature-grid">
+                <div class="feature-card">
+                    <div class="feature-icon"><i class="fas fa-bolt"></i></div>
+                    <h3>Ultra-Fast Video Generation</h3>
+                    <p>Lightning-speed processing creates 5-second videos at 480p resolution with vivid details and smooth motion in seconds, not minutes.</p>
+                </div>
+                <div class="feature-card">
+                    <div class="feature-icon"><i class="fas fa-film"></i></div>
+                    <h3>SOTA Motion Rendering</h3>
+                    <p>State-of-the-art dynamic rendering techniques create natural and realistic movements that bring images to life.</p>
+                </div>
+                <div class="feature-card">
+                    <div class="feature-icon"><i class="fas fa-brain"></i></div>
+                    <h3>Advanced Semantic Understanding</h3>
+                    <p>Industry-leading AI excels in interpreting complex user prompts to generate coherent and dynamic scenes with professional quality.</p>
+                </div>
+                <div class="feature-card">
+                    <div class="feature-icon"><i class="fas fa-cubes"></i></div>
+                    <h3>Realistic Physical Simulation</h3>
+                    <p>SOTA physics engine simulates realistic physical properties and movements for lifelike video generation.</p>
+                </div>
+                <div class="feature-card">
+                    <div class="feature-icon"><i class="fas fa-tachometer-alt"></i></div>
+                    <h3>Blazing-Fast Processing</h3>
+                    <p>Optimized for maximum speed efficiency, allowing instant creation of high-quality videos for real-time workflows.</p>
+                </div>
+                <div class="feature-card">
+                    <div class="feature-icon"><i class="fas fa-sliders-h"></i></div>
+                    <h3>Flexible Parameter Control</h3>
+                    <p>Customizable settings offer duration and style adjustments for complete creative control.</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section id="comparison" class="comparison">
+        <div class="container">
+            <h2 class="section-title">Performance Comparison</h2>
+            <div class="comparison-content">
+                <div class="comparison-table">
+                    <table>
+                        <thead>
+                            <tr>
+                                <th>Feature</th>
+                                <th>ByteDance Seedance Pro</th>
+                                <th>Standard I2V Models</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr>
+                                <td>Generation Speed</td>
+                                <td><span class="highlight">Seconds</span></td>
+                                <td>Minutes</td>
+                            </tr>
+                            <tr>
+                                <td>Motion Quality</td>
+                                <td><span class="highlight">State-of-the-art</span></td>
+                                <td>Variable</td>
+                            </tr>
+                            <tr>
+                                <td>Resolution</td>
+                                <td><span class="highlight">480p</span></td>
+                                <td>Often lower</td>
+                            </tr>
+                            <tr>
+                                <td>Physics Simulation</td>
+                                <td><span class="highlight">Advanced</span></td>
+                                <td>Basic</td>
+                            </tr>
+                            <tr>
+                                <td>Processing Efficiency</td>
+                                <td><span class="highlight">Optimized</span></td>
+                                <td>Resource-intensive</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+                <div class="comparison-chart">
+                    <div class="chart-container">
+                        <div class="chart-title">Generation Speed Comparison</div>
+                        <div class="bar-chart">
+                            <div class="bar-group">
+                                <div class="bar seedance" style="height: 80%;"></div>
+                                <div class="bar-label">Seedance Pro<br><span>~5 seconds</span></div>
+                            </div>
+                            <div class="bar-group">
+                                <div class="bar competitor" style="height: 30%;"></div>
+                                <div class="bar-label">Competitor A<br><span>~30 seconds</span></div>
+                            </div>
+                            <div class="bar-group">
+                                <div class="bar competitor" style="height: 10%;"></div>
+                                <div class="bar-label">Competitor B<br><span>~2 minutes</span></div>
+                            </div>
+                        </div>
+                        <div class="chart-note">*Lower is better - Processing time for 5-second video generation</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section id="technical" class="technical">
+        <div class="container">
+            <h2 class="section-title">Technical Excellence & Speed Optimization</h2>
+            <div class="technical-image">
+                <img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/lm_sth/ljhwZthlaukjlkulzlp/ark/model_introduction/seedance/pro/intro/technical.jpg" alt="Technical Excellence" class="tech-img">
+            </div>
+            <div class="technical-grid">
+                <div class="technical-card">
+                    <h3><i class="fas fa-microchip"></i> SOTA Architecture</h3>
+                    <p>Built on breakthrough research delivering state-of-the-art image-to-video generation performance.</p>
+                </div>
+                <div class="technical-card">
+                    <h3><i class="fas fa-cogs"></i> Optimized Processing</h3>
+                    <p>Native ByteDance technology delivers superior generation speed compared to standard I2V solutions.</p>
+                </div>
+                <div class="technical-card">
+                    <h3><i class="fas fa-clock"></i> Real-Time Processing</h3>
+                    <p>Ultra-fast video synthesis enables immediate creative workflows and instant content creation.</p>
+                </div>
+                <div class="technical-card">
+                    <h3><i class="fas fa-server"></i> High-Performance Computing</h3>
+                    <p>Enterprise-grade infrastructure supports rapid, high-volume video generation at scale.</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section id="use-cases" class="use-cases">
+        <div class="container">
+            <h2 class="section-title">Perfect for Fast-Paced Creative Work</h2>
+            <div class="use-case-image">
+                <img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/lm_sth/ljhwZthlaukjlkulzlp/ark/model_introduction/seedance/pro/intro/use-cases.jpg" alt="ByteDance Seedance Use Cases" class="use-image">
+            </div>
+            <div class="use-case-grid">
+                <div class="use-case-card">
+                    <div class="use-case-icon"><i class="fas fa-video"></i></div>
+                    <h3>Content Creators</h3>
+                    <p>Instantly transform static photography into engaging video content for social platforms with lightning-fast speed.</p>
+                </div>
+                <div class="use-case-card">
+                    <div class="use-case-icon"><i class="fas fa-ad"></i></div>
+                    <h3>Marketing Professionals</h3>
+                    <p>Create dynamic promotional materials from product images in seconds, not hours.</p>
+                </div>
+                <div class="use-case-card">
+                    <div class="use-case-icon"><i class="fas fa-share-alt"></i></div>
+                    <h3>Social Media Managers</h3>
+                    <p>Convert photos into shareable, dynamic content that captures attention with lightning-fast turnaround.</p>
+                </div>
+                <div class="use-case-card">
+                    <div class="use-case-icon"><i class="fas fa-shopping-cart"></i></div>
+                    <h3>E-commerce Teams</h3>
+                    <p>Bring product photos to life with subtle motion effects using SOTA I2V technology.</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section class="benchmark-section" id="benchmark">
+        <div class="container">
+            <h2 class="section-title">Benchmark Results</h2>
+            <div class="benchmark-content">
+                <div class="benchmark-image">
+                    <img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/lm_sth/ljhwZthlaukjlkulzlp/ark/model_introduction/seedance/pro/intro/image1.png" alt="Seedance Benchmark Results - SeedVideoBench-1.0" class="benchmark-img">
+                </div>
+                <div class="benchmark-description">
+                    <h3>Evaluation Results</h3>
+                    <p>Seedance 1.0 Pro model has achieved excellent evaluation results in both internal benchmark SeedVideoBench-1.0 and third-party evaluation platform Artificial Analysis.</p>
+                    <h4>SeedVideoBench-1.0 Multi-dimensional Evaluation</h4>
+                    <p>In comparison with other industry models, Seedance 1.0 Pro performs well in multiple core dimensions including instruction following, motion performance, and visual aesthetics.</p>
+                    <h4>Artificial Analysis Public Testing</h4>
+                    <p>In the public testing leaderboard, based on blind testing scores from the general public, Seedance 1.0 Pro has achieved competitive Elo ratings in both T2V and I2V tracks, demonstrating strong user preference.</p>
+                </div>
+            </div>
+            <div class="benchmark-content benchmark-content-second">
+                <div class="benchmark-description">
+                    <h4>Competitive Performance</h4>
+                    <p>Seedance 1.0 Pro consistently ranks among the top performers in public benchmarks, showcasing its superior capabilities in both text-to-video and image-to-video generation tasks.</p>
+                </div>
+                <div class="benchmark-image">
+                    <img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/lm_sth/ljhwZthlaukjlkulzlp/ark/model_introduction/seedance/pro/intro/image2.png" alt="Seedance Benchmark Results - Artificial Analysis" class="benchmark-img">
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section class="models-collection">
+        <div class="container">
+            <h2 class="section-title">ByteDance Model Collection</h2>
+            <div class="models-description">
+                <p>WaveSpeedAI offers a comprehensive collection of ByteDance Seedance models for different needs and budgets:</p>
+            </div>
+            <div class="models-grid">
+                <div class="model-card">
+                    <div class="model-info">
+                        <h3>Seedance-v1-lite-i2v-480p</h3>
+                        <p class="model-price">$0.1 per run</p>
+                        <p>An optimized video generation model offering fast generation, superior prompt-following, and quality motion realism at an affordable price.</p>
+                    </div>
+                </div>
+                <div class="model-card">
+                    <div class="model-info">
+                        <h3>Seedance-v1-pro-i2v-480p</h3>
+                        <p class="model-price">$0.15 per run</p>
+                        <p>The new SOTA video generation model with ultra-fast generation, superior prompt-following, cinematic multi-shot coherence, and unmatched motion realism.</p>
+                    </div>
+                </div>
+                <div class="model-card">
+                    <div class="model-info">
+                        <h3>Seedance-v1-lite-i2v-720p</h3>
+                        <p class="model-price">$0.3 per run</p>
+                        <p>An optimized video generation model offering fast generation, superior prompt-following, and quality motion realism at an affordable price with higher resolution.</p>
+                    </div>
+                </div>
+                <div class="model-card">
+                    <div class="model-info">
+                        <h3>Seedance-v1-pro-i2v-720p</h3>
+                        <p class="model-price">$0.3 per run</p>
+                        <p>The new SOTA video generation model with ultra-fast generation, superior prompt-following, cinematic multi-shot coherence, and unmatched motion realism at 720p.</p>
+                    </div>
+                </div>
+            </div>
+            <div class="models-cta">
+                <a href="https://wavespeed.ai/collections/bytedance" class="primary-button" target="_blank">View All ByteDance Models <i class="fas fa-external-link-alt"></i></a>
+            </div>
+        </div>
+    </section>
+
+    <section class="cta-section">
+        <div class="container">
+            <div class="cta-content">
+                <h2>Global Premiere on WaveSpeedAI</h2>
+                <p>WaveSpeedAI proudly presents the global premiere of ByteDance's latest image-to-video technology from the Dreamina model series. As the exclusive launch platform worldwide, WaveSpeedAI provides developers and creators with first access to this revolutionary SOTA model.</p>
+                <a href="https://wavespeed.ai/collections/bytedance" class="cta-button" target="_blank">Experience Seedance Pro on WaveSpeed <i class="fas fa-external-link-alt"></i></a>
+            </div>
+        </div>
+    </section>
+
+    <section class="limitations">
+        <div class="container">
+            <h2 class="section-title">Limitations</h2>
+            <ul class="limitations-list">
+                <li><strong>Creative Focus:</strong> Designed primarily for creative video synthesis; not intended for generating factually accurate content.</li>
+                <li><strong>Inherent Biases:</strong> Outputs may reflect biases present in the training data, typical of current SOTA models.</li>
+                <li><strong>Input Sensitivity:</strong> The quality and consistency of generated videos depend significantly on the quality of the input image.</li>
+                <li><strong>Resolution Limitation:</strong> This model is optimized for 480p video generation and does not support higher resolutions.</li>
+                <li><strong>Speed vs Quality Trade-off:</strong> While optimized for speed, extremely complex scenes may require additional processing time.</li>
+            </ul>
+        </div>
+    </section>
+
+    <footer>
+        <div class="container">
+            <div class="footer-content">
+                <div class="footer-logo">
+                    <h3>ByteDance <span>Seedance</span></h3>
+                    <p>Revolutionary AI Image-to-Video Generation</p>
+                </div>
+                <div class="footer-links">
+                    <h4>Resources</h4>
+                    <ul>
+                        <li><a href="https://www.volcengine.com/docs/82379/1587797" target="_blank">Documentation</a></li>
+                        <li><a href="https://wavespeed.ai/collections/bytedance" target="_blank">WaveSpeed Platform</a></li>
+                        <li><a href="#limitations">Limitations</a></li>
+                    </ul>
+                </div>
+                <div class="footer-cta">
+                    <h4>Experience Seedance Pro</h4>
+                    <a href="https://wavespeed.ai/collections/bytedance" class="footer-button" target="_blank">Try on WaveSpeed <i class="fas fa-arrow-right"></i></a>
+                </div>
+            </div>
+            <div class="footer-bottom">
+                <p>&copy; 2025 ByteDance Seedance. All rights reserved.</p>
+            </div>
+        </div>
+    </footer>
+</body>
+</html>

style.css

@@ -0,0 +1,885 @@
+/* Base Styles */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'Segoe UI', Roboto, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
+    line-height: 1.6;
+    color: #333;
+    background-color: #f8f9fa;
+    overflow-x: hidden;
+}
+
+a {
+    text-decoration: none;
+    color: #0066cc;
+    transition: color 0.3s ease;
+}
+
+a:hover {
+    color: #004499;
+}
+
+ul {
+    list-style: none;
+}
+
+img {
+    max-width: 100%;
+    height: auto;
+}
+
+.container {
+    width: 90%;
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 15px;
+}
+
+/* Typography */
+h1, h2, h3, h4, h5, h6 {
+    font-weight: 700;
+    line-height: 1.2;
+    margin-bottom: 0.5em;
+}
+
+h1 {
+    font-size: 2.5rem;
+}
+
+h2 {
+    font-size: 2rem;
+}
+
+h3 {
+    font-size: 1.5rem;
+}
+
+p {
+    margin-bottom: 1rem;
+    color: #555;
+}
+
+.section-title {
+    text-align: center;
+    margin-bottom: 2rem;
+    position: relative;
+    padding-bottom: 0.5rem;
+}
+
+.section-title:after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 80px;
+    height: 3px;
+    background: linear-gradient(90deg, #4a6cf7, #f86cf7);
+}
+
+/* Header & Navigation */
+header {
+    background-color: #fff;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+    padding: 1rem 0;
+}
+
+header .container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.logo h1 {
+    font-size: 1.5rem;
+    margin: 0;
+    color: #333;
+}
+
+.logo span {
+    color: #4a6cf7;
+    font-weight: 800;
+}
+
+nav ul {
+    display: flex;
+    align-items: center;
+}
+
+nav ul li {
+    margin-left: 1.5rem;
+}
+
+nav ul li a {
+    color: #333;
+    font-weight: 500;
+    padding: 0.5rem 0;
+    position: relative;
+}
+
+nav ul li a:after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 0;
+    height: 2px;
+    background: linear-gradient(90deg, #4a6cf7, #f86cf7);
+    transition: width 0.3s ease;
+}
+
+nav ul li a:hover:after {
+    width: 100%;
+}
+
+.cta-button {
+    background: linear-gradient(90deg, #4a6cf7, #f86cf7);
+    color: #fff !important;
+    padding: 0.5rem 1rem;
+    border-radius: 30px;
+    font-weight: 600;
+    transition: all 0.3s ease;
+    display: inline-flex;
+    align-items: center;
+}
+
+.cta-button i {
+    margin-left: 0.5rem;
+    font-size: 0.8rem;
+}
+
+.cta-button:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 5px 15px rgba(74, 108, 247, 0.4);
+}
+
+/* Hero Section */
+.hero {
+    padding: 5rem 0;
+    background: linear-gradient(135deg, #f5f7ff 0%, #e8f0ff 100%);
+    position: relative;
+    overflow: hidden;
+}
+
+.hero .container {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 2rem;
+    align-items: center;
+}
+
+.hero-content h1 {
+    font-size: 2.8rem;
+    margin-bottom: 1rem;
+    background: linear-gradient(90deg, #333, #4a6cf7);
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+.hero-content h2 {
+    font-size: 1.8rem;
+    margin-bottom: 1.5rem;
+    color: #555;
+}
+
+.hero-content p {
+    font-size: 1.1rem;
+    margin-bottom: 2rem;
+    color: #666;
+}
+
+.cta-buttons {
+    display: flex;
+    gap: 1rem;
+}
+
+.primary-button {
+    background: linear-gradient(90deg, #4a6cf7, #f86cf7);
+    color: #fff;
+    padding: 0.8rem 1.5rem;
+    border-radius: 30px;
+    font-weight: 600;
+    display: inline-flex;
+    align-items: center;
+    transition: all 0.3s ease;
+}
+
+.primary-button i {
+    margin-left: 0.5rem;
+}
+
+.primary-button:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 5px 15px rgba(74, 108, 247, 0.4);
+}
+
+.secondary-button {
+    border: 2px solid #4a6cf7;
+    color: #4a6cf7;
+    padding: 0.8rem 1.5rem;
+    border-radius: 30px;
+    font-weight: 600;
+    transition: all 0.3s ease;
+}
+
+.secondary-button:hover {
+    background-color: #4a6cf7;
+    color: #fff;
+}
+
+.hero-image {
+    position: relative;
+}
+
+.demo-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 1.5rem;
+    background-color: #fff;
+    padding: 1.5rem;
+    border-radius: 10px;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+}
+
+.demo-image {
+    width: 45%;
+    border-radius: 8px;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+.arrow-animation {
+    font-size: 2rem;
+    color: #4a6cf7;
+    animation: pulse 1.5s infinite;
+}
+
+.video-placeholder {
+    width: 45%;
+    aspect-ratio: 16/9;
+    background: linear-gradient(135deg, #e0e8ff, #d0d8ff);
+    border-radius: 8px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+.play-icon {
+    width: 50px;
+    height: 50px;
+    background-color: #4a6cf7;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #fff;
+    margin-bottom: 0.5rem;
+    animation: pulse 2s infinite;
+}
+
+@keyframes pulse {
+    0% {
+        transform: scale(1);
+    }
+    50% {
+        transform: scale(1.1);
+    }
+    100% {
+        transform: scale(1);
+    }
+}
+
+/* Features Section */
+.features {
+    padding: 5rem 0;
+    background-color: #fff;
+}
+
+.feature-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+    gap: 2rem;
+}
+
+.feature-card {
+    background-color: #fff;
+    border-radius: 10px;
+    padding: 2rem;
+    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
+    transition: all 0.3s ease;
+    text-align: center;
+}
+
+.feature-card:hover {
+    transform: translateY(-10px);
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
+}
+
+.feature-icon {
+    width: 70px;
+    height: 70px;
+    background: linear-gradient(135deg, #4a6cf7, #f86cf7);
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 1.5rem;
+    color: #fff;
+    font-size: 1.8rem;
+}
+
+.feature-card h3 {
+    margin-bottom: 1rem;
+    color: #333;
+}
+
+.feature-card p {
+    color: #666;
+}
+
+/* Comparison Section */
+.comparison {
+    padding: 5rem 0;
+    background-color: #f5f7ff;
+}
+
+.comparison-content {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 2rem;
+    align-items: center;
+}
+
+.comparison-table table {
+    width: 100%;
+    border-collapse: collapse;
+    background-color: #fff;
+    border-radius: 10px;
+    overflow: hidden;
+    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
+}
+
+.comparison-table th, .comparison-table td {
+    padding: 1rem;
+    text-align: left;
+    border-bottom: 1px solid #eee;
+}
+
+.comparison-table th {
+    background-color: #4a6cf7;
+    color: #fff;
+    font-weight: 600;
+}
+
+.comparison-table tr:last-child td {
+    border-bottom: none;
+}
+
+.highlight {
+    color: #4a6cf7;
+    font-weight: 600;
+}
+
+.chart-container {
+    background-color: #fff;
+    border-radius: 10px;
+    padding: 2rem;
+    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
+}
+
+.chart-title {
+    text-align: center;
+    font-weight: 600;
+    margin-bottom: 1.5rem;
+    color: #333;
+}
+
+.bar-chart {
+    display: flex;
+    justify-content: space-around;
+    align-items: flex-end;
+    height: 250px;
+    margin-bottom: 1.5rem;
+}
+
+.bar-group {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 30%;
+}
+
+.bar {
+    width: 100%;
+    border-radius: 5px 5px 0 0;
+    transition: all 0.3s ease;
+}
+
+.bar.seedance {
+    background: linear-gradient(135deg, #4a6cf7, #f86cf7);
+}
+
+.bar.competitor {
+    background-color: #ccc;
+}
+
+.bar-label {
+    text-align: center;
+    margin-top: 0.5rem;
+    font-weight: 500;
+}
+
+.bar-label span {
+    display: block;
+    font-size: 0.8rem;
+    color: #666;
+    font-weight: normal;
+}
+
+.chart-note {
+    text-align: center;
+    font-size: 0.8rem;
+    color: #666;
+    font-style: italic;
+}
+
+/* Technical Section */
+.technical {
+    background-color: #f9f9f9;
+    padding: 5rem 0;
+}
+
+.technical-image {
+    margin-bottom: 2rem;
+    text-align: center;
+}
+
+.technical-image img {
+    max-width: 100%;
+    height: auto;
+    border-radius: 10px;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+.technical-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+    gap: 2rem;
+}
+
+.technical-card {
+    background-color: #f5f7ff;
+    border-radius: 10px;
+    padding: 2rem;
+    transition: all 0.3s ease;
+}
+
+.technical-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
+}
+
+.technical-card h3 {
+    display: flex;
+    align-items: center;
+    margin-bottom: 1rem;
+    color: #333;
+}
+
+.technical-card h3 i {
+    margin-right: 0.5rem;
+    color: #4a6cf7;
+}
+
+.technical-card p {
+    color: #666;
+}
+
+/* Use Cases Section */
+.use-cases {
+    padding: 5rem 0;
+    background-color: #f5f7ff;
+}
+
+.use-case-image {
+    margin-bottom: 2rem;
+    text-align: center;
+}
+
+.use-case-image img {
+    max-width: 100%;
+    height: auto;
+    border-radius: 10px;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+.use-case-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+    gap: 2rem;
+}
+
+.use-case-card {
+    background-color: #fff;
+    border-radius: 10px;
+    padding: 2rem;
+    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
+    transition: all 0.3s ease;
+    text-align: center;
+}
+
+.use-case-card:hover {
+    transform: translateY(-10px);
+    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
+}
+
+.use-case-icon {
+    width: 70px;
+    height: 70px;
+    background: linear-gradient(135deg, #4a6cf7, #f86cf7);
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 auto 1.5rem;
+    color: #fff;
+    font-size: 1.8rem;
+}
+
+.use-case-card h3 {
+    margin-bottom: 1rem;
+    color: #333;
+}
+
+.use-case-card p {
+    color: #666;
+}
+
+/* Benchmark section */
+.benchmark-section {
+    padding: 5rem 0;
+    background-color: #f5f7ff;
+}
+
+.benchmark-content {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 2rem;
+    align-items: center;
+    margin-bottom: 3rem;
+}
+
+.benchmark-content-second {
+    margin-top: 2rem;
+    margin-bottom: 0;
+}
+
+.benchmark-image {
+    text-align: center;
+}
+
+.benchmark-img {
+    max-width: 100%;
+    height: auto;
+    border-radius: 10px;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+.benchmark-description h3 {
+    font-size: 1.8rem;
+    margin-bottom: 1rem;
+    color: #333;
+}
+
+.benchmark-description h4 {
+    font-size: 1.4rem;
+    margin: 1.5rem 0 0.5rem;
+    color: #4a6cf7;
+}
+
+.benchmark-description p {
+    font-size: 1.1rem;
+    line-height: 1.6;
+    color: #555;
+    margin-bottom: 1rem;
+}
+
+@media (max-width: 768px) {
+    .benchmark-content {
+        grid-template-columns: 1fr;
+    }
+    
+    .benchmark-image {
+        margin-bottom: 2rem;
+    }
+}
+
+/* Models Collection Section */
+.models-collection {
+    padding: 5rem 0;
+    background-color: #fff;
+}
+
+.models-description {
+    text-align: center;
+    max-width: 800px;
+    margin: 0 auto 3rem;
+}
+
+.models-description p {
+    font-size: 1.2rem;
+    color: #555;
+    line-height: 1.6;
+}
+
+.models-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+    gap: 2rem;
+    margin-bottom: 3rem;
+}
+
+.model-card {
+    background-color: #f8f9ff;
+    border-radius: 10px;
+    overflow: hidden;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+}
+
+.model-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
+}
+
+.model-info {
+    padding: 1.5rem;
+}
+
+.model-info h3 {
+    font-size: 1.2rem;
+    margin-bottom: 0.5rem;
+    color: #333;
+}
+
+.model-price {
+    font-size: 1.1rem;
+    font-weight: 700;
+    color: #4a6cf7;
+    margin-bottom: 1rem;
+}
+
+.model-info p {
+    font-size: 0.95rem;
+    color: #666;
+    line-height: 1.5;
+}
+
+.models-cta {
+    text-align: center;
+    margin-top: 2rem;
+}
+
+@media (max-width: 768px) {
+    .models-grid {
+        grid-template-columns: 1fr;
+    }
+}
+
+/* CTA Section */
+.cta-section {
+    padding: 5rem 0;
+    background: linear-gradient(135deg, #4a6cf7, #f86cf7);
+    color: #fff;
+    text-align: center;
+}
+
+.cta-content h2 {
+    margin-bottom: 1.5rem;
+    color: #fff;
+}
+
+.cta-content p {
+    max-width: 800px;
+    margin: 0 auto 2rem;
+    color: rgba(255, 255, 255, 0.9);
+    font-size: 1.1rem;
+}
+
+/* Limitations Section */
+.limitations {
+    padding: 5rem 0;
+    background-color: #fff;
+}
+
+.limitations-list {
+    max-width: 800px;
+    margin: 0 auto;
+    background-color: #f5f7ff;
+    border-radius: 10px;
+    padding: 2rem;
+    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
+}
+
+.limitations-list li {
+    margin-bottom: 1rem;
+    padding-left: 1.5rem;
+    position: relative;
+    color: #555;
+}
+
+.limitations-list li:before {
+    content: '•';
+    position: absolute;
+    left: 0;
+    color: #4a6cf7;
+    font-weight: bold;
+}
+
+.limitations-list li:last-child {
+    margin-bottom: 0;
+}
+
+/* Footer */
+footer {
+    background-color: #1a1a1a;
+    color: #fff;
+    padding: 4rem 0 1rem;
+}
+
+.footer-content {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+    gap: 2rem;
+    margin-bottom: 3rem;
+}
+
+.footer-logo h3 {
+    font-size: 1.5rem;
+    margin-bottom: 1rem;
+    color: #fff;
+}
+
+.footer-logo span {
+    color: #4a6cf7;
+    font-weight: 800;
+}
+
+.footer-logo p {
+    color: rgba(255, 255, 255, 0.7);
+}
+
+.footer-links h4 {
+    color: #fff;
+    margin-bottom: 1.5rem;
+}
+
+.footer-links ul li {
+    margin-bottom: 0.8rem;
+}
+
+.footer-links ul li a {
+    color: rgba(255, 255, 255, 0.7);
+    transition: all 0.3s ease;
+}
+
+.footer-links ul li a:hover {
+    color: #4a6cf7;
+}
+
+.footer-cta h4 {
+    color: #fff;
+    margin-bottom: 1.5rem;
+}
+
+.footer-button {
+    background: linear-gradient(90deg, #4a6cf7, #f86cf7);
+    color: #fff;
+    padding: 0.8rem 1.5rem;
+    border-radius: 30px;
+    font-weight: 600;
+    display: inline-flex;
+    align-items: center;
+    transition: all 0.3s ease;
+}
+
+.footer-button i {
+    margin-left: 0.5rem;
+}
+
+.footer-button:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
+}
+
+.footer-bottom {
+    text-align: center;
+    padding-top: 2rem;
+    border-top: 1px solid rgba(255, 255, 255, 0.1);
+    color: rgba(255, 255, 255, 0.5);
+    font-size: 0.9rem;
+}
+
+/* Responsive Design */
+@media (max-width: 992px) {
+    .hero .container,
+    .comparison-content {
+        grid-template-columns: 1fr;
+    }
+    
+    .hero-content {
+        text-align: center;
+        margin-bottom: 2rem;
+    }
+    
+    .cta-buttons {
+        justify-content: center;
+    }
+    
+    nav ul {
+        display: none;
+    }
+}
+
+@media (max-width: 768px) {
+    h1 {
+        font-size: 2rem;
+    }
+    
+    h2 {
+        font-size: 1.5rem;
+    }
+    
+    .feature-grid,
+    .technical-grid,
+    .use-case-grid {
+        grid-template-columns: 1fr;
+    }
+    
+    .demo-container {
+        flex-direction: column;
+    }
+    
+    .demo-image,
+    .video-placeholder {
+        width: 100%;
+    }
+}
+
+/* Fix for webkit background-clip */
+.hero-content h1 {
+    background: linear-gradient(90deg, #333, #4a6cf7);
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+}