<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AigcMart - 全链路AIGC标准化服务交付平台</title>
<link rel="stylesheet" href="css/common.css">
<link rel="stylesheet" href="css/header.css">
<link rel="stylesheet" href="css/footer.css">
<link rel="stylesheet" href="css/index-new.css">
</head>
<body>
<header class="header" id="header"></header>
<main class="home-main">
<!-- Hero 区域 -->
<section class="hero-section">
<div class="hero-content">
<div class="hero-badge">
<span class="badge-dot"></span>
2024年最值得信赖的AIGC服务平台
</div>
<h1 class="hero-title">
全链路<span class="gradient-text">AIGC服务</span>交付平台
</h1>
<p class="hero-subtitle">
从"信息撮合"到"标准化交付"，解决找人难、靠谱难、合规难、匹配难四大痛点
</p>
<div class="hero-search">
<div class="search-box">
<svg class="search-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="11" cy="11" r="8"></circle>
<path d="M21 21l-4.35-4.35"></path>
</svg>
<input type="text" id="heroSearch" placeholder="搜索服务，如：AI短剧制作、医疗AI标注、电商AI设计...">
<button class="btn-primary" onclick="handleSearch()">搜索服务</button>
</div>
<div class="hot-search">
<span>热门：</span>
<a href="search.html?q=AI短剧制作" class="hot-tag">AI短剧制作</a>
<a href="search.html?q=医疗AI标注" class="hot-tag">医疗AI标注</a>
<a href="search.html?q=电商AI设计" class="hot-tag">电商AI设计</a>
<a href="search.html?q=企业素材定制" class="hot-tag">企业素材定制</a>
</div>
</div>
<div class="hero-stats">
<div class="stat-item">
<div class="stat-value">10,000+</div>
<div class="stat-label">认证服务商</div>
</div>
<div class="stat-divider"></div>
<div class="stat-item">
<div class="stat-value">98.5%</div>
<div class="stat-label">好评率</div>
</div>
<div class="stat-divider"></div>
<div class="stat-item">
<div class="stat-value">¥50亿+</div>
<div class="stat-label">累计交易额</div>
</div>
</div>
</div>
<div class="hero-graphic">
<div class="graphic-card card-1">
<div class="card-icon">✅</div>
<div class="card-title">能力认证</div>
<div class="card-desc">权威机构认证</div>
</div>
<div class="graphic-card card-2">
<div class="card-icon">📦</div>
<div class="card-title">标准交付</div>
<div class="card-desc">验收标准明确</div>
</div>
<div class="graphic-card card-3">
<div class="card-icon">🛡️</div>
<div class="card-title">资金保障</div>
<div class="card-desc">平台托管托管</div>
</div>
<div class="graphic-card card-4">
<div class="card-icon">⚖️</div>
<div class="card-title">版权保障</div>
<div class="card-desc">合规无忧</div>
</div>
</div>
</section>
<!-- 服务分类 -->
<section class="category-section">
<div class="section-header">
<h2 class="section-title">服务分类</h2>
<a href="products.html" class="section-more">查看全部 →</a>
</div>
<div class="category-grid" id="categoryGrid">
<!-- 动态生成 -->
</div>
</section>
<!-- 热门服务 -->
<section class="services-section">
<div class="section-header">
<h2 class="section-title">热门标准化服务</h2>
<div class="tab-filter">
<button class="tab-btn active" data-tab="all">全部</button>
<button class="tab-btn" data-tab="ai-design">AI设计</button>
<button class="tab-btn" data-tab="ai-video">AI视频</button>
<button class="tab-btn" data-tab="ai-annotation">AI标注</button>
</div>
</div>
<div class="services-grid" id="servicesGrid">
<!-- 动态生成 -->
</div>
</section>
<!-- 平台优势 -->
<section class="advantage-section">
<div class="section-header centered">
<h2 class="section-title">为什么选择 AigcMart</h2>
<p class="section-desc">从信息撮合到标准化交付，全面解决企业痛点</p>
</div>
<div class="advantage-grid">
<div class="advantage-card">
<div class="adv-icon" style="background: linear-gradient(135deg, #6366f1, #8b5cf6);">
🏆
</div>
<h3>能力认证</h3>
<p>中国电子学会等权威机构认证，所有服务商经过严格筛选</p>
</div>
<div class="advantage-card">
<div class="adv-icon" style="background: linear-gradient(135deg, #06b6d4, #0ea5e9);">
📋
</div>
<h3>标准交付</h3>
<p>标准化服务包，明确验收标准，不再"扯皮"</p>
</div>
<div class="advantage-card">
<div class="adv-icon" style="background: linear-gradient(135deg, #ec4899, #f43f5e);">
🔒
</div>
<h3>资金安全</h3>
<p>平台托管，验收后再付款，保障交易安全</p>
</div>
<div class="advantage-card">
<div class="adv-icon" style="background: linear-gradient(135deg, #22c55e, #10b981);">
⚖️
</div>
<h3>合规保障</h3>
<p>版权溯源、合规审计，解决企业数据安全顾虑</p>
</div>
</div>
</section>
<!-- 优秀服务商 -->
<section class="providers-section">
<div class="section-header">
<h2 class="section-title">优秀认证服务商</h2>
<a href="talents.html" class="section-more">查看全部 →</a>
</div>
<div class="providers-grid" id="providersGrid">
<!-- 动态生成 -->
</div>
</section>
<!-- CTA 区域 -->
<section class="cta-section">
<div class="cta-content">
<h2>开启您的AIGC数字化转型之旅</h2>
<p>300万+创作者正在这里服务，50万+企业已选择我们</p>
<div class="cta-buttons">
<button class="btn-primary btn-large">发布需求</button>
<button class="btn-outline btn-large">成为服务商</button>
</div>
</div>
</section>
</main>
<footer class="footer" id="footer"></footer>
<script src="js/core/app-state.js"></script>
<script src="js/data/mock-data.js"></script>
<script src="js/common.js"></script>
<script src="js/header.js"></script>
<script src="js/footer.js"></script>
<script src="js/index-new.js"></script>
</body>
</html>