﻿/* 基础样式 */
body { font-family: 'Noto Sans SC', sans-serif; background-color: #f8fafc; color: #1e293b; }

.hero-gradient { background:  url('/images/aiwebsite/banner.png'); position: relative; }

/* 响应式优化 */
@media (max-width: 768px) {
    .hero-gradient { background: linear-gradient(135deg, rgba(30, 58, 138, 0.9) 0%, rgba(59, 130, 246, 0.9) 100%), url('/images/aiwebsite/banner-bg.png'); }
}

/* 服务区域背景图样式 */
.products { background:  url('/images/aiwebsite/products-bg.png'); position: relative; }

    /* 卡片样式优化 */
    .products .card-hover { background-color: rgba(255, 255, 255, 0.75); backdrop-filter: blur(2px); }

/* 移动端优化 */
@media (max-width: 768px) {
    .products { background: linear-gradient(rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.92)), url('/images/aiwebsite/products-bg.png'); }
}
/* 平台服务数据背景图样式 */
.services-data { background: url('/images/aiwebsite/service-data-bg.png'); position: relative; }

/* AI贸易合规风控及咨询指数发布 */
.risk-chart { background: url('/images/aiwebsite/risk-chart-bg.png'); position: relative; }

/* 信息服务 */
.info-service { background: url('/images/aiwebsite/info-service-bg.png'); position: relative; }

.card-hover { transition: all 0.3s ease; }

    .card-hover:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(30, 58, 138, 0.2); }

.nav-link { position: relative; }

    .nav-link::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 0; height: 2px; background-color: #3b82f6; transition: width 0.3s ease; }

    .nav-link:hover::after { width: 100%; }

.chart-container { height: 300px; width: 100%; }

.service-icon { width: 60px; height: 60px; background-color: #e0e7ff; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: #3b82f6; font-size: 24px; margin-bottom: 16px; }

.mobile-menu { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }

    .mobile-menu.active { max-height: 500px; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.fade-in { animation: fadeIn 0.6s ease forwards; }

