/* ========== 子页面通用样式 ========== */

/* 面包屑 */
.breadcrumb { font-size:.92rem; color:rgba(255,255,255,.7); margin-bottom:12px; }
.breadcrumb a { color:rgba(255,255,255,.85); }
.breadcrumb a:hover { color:#fff; }

/* 页面 Hero */
.page-hero {
    background:linear-gradient(135deg,#0d6efd 0%,#094bd1 55%,#073fb3 100%);
    color:#fff; padding:120px 0 60px; text-align:center;
    position:relative; overflow:hidden;
}
.page-hero::before {
    content:""; position:absolute; right:-80px; top:-80px;
    width:360px; height:360px; border-radius:50%;
    background:rgba(255,255,255,.05);
}
.page-hero h1 { font-size:2.4rem; margin-bottom:12px; position:relative; }
.page-hero p { font-size:1.12rem; opacity:.9; max-width:600px; margin:0 auto; position:relative; }

/* CTA 块 */
.cta-block { text-align:center; padding:48px 24px; }
.cta-block h2 { margin-bottom:12px; }
.cta-block p { color:#64748b; margin-bottom:24px; }
.btn-ghost-dark {
    display:inline-flex; align-items:center; justify-content:center;
    padding:14px 32px; border-radius:999px; font-weight:700; font-size:1rem;
    border:1.5px solid #0d6efd; color:#0d6efd; background:transparent;
    transition:all .2s; cursor:pointer; text-decoration:none;
}
.btn-ghost-dark:hover { background:#0d6efd; color:#fff; }

/* ========== 产品列表卡片 ========== */
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.product-card {
    background:#fff; border:1px solid #e9f0fb; border-radius:18px;
    padding:32px 24px; text-align:center;
    transition:transform .22s, box-shadow .22s; display:block;
    box-shadow:0 6px 20px rgba(15,23,42,.04);
}
.product-card:hover { transform:translateY(-6px); box-shadow:0 14px 32px rgba(15,23,42,.1); }
.product-card-icon { font-size:3rem; margin-bottom:16px; }
.product-card h3 { font-size:1.15rem; margin-bottom:10px; color:#1f2937; }
.product-card p { color:#64748b; font-size:.95rem; margin-bottom:16px; }
.product-card-link { color:#0d6efd; font-weight:700; font-size:.95rem; }
/* 产品/方案特性标签：静态预渲染版本会带出来，JS 动态版本不带，两条路径都要好看 */
.product-card-features, .solution-card-features {
    list-style:none; margin:0 0 14px; padding:0;
    display:flex; flex-wrap:wrap; gap:6px; justify-content:center;
}
.product-card-features li, .solution-card-features li {
    font-size:.78rem; color:#475569; background:#f1f5f9;
    border-radius:6px; padding:3px 9px; line-height:1.6;
}
.solution-card-sub { font-size:.88rem; color:#94a3b8; margin-bottom:10px; }

/* ========== 方案列表卡片 ========== */
.solution-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.solution-card {
    background:#fff; border:1px solid #e9f0fb; border-radius:18px;
    padding:32px 24px; transition:transform .22s, box-shadow .22s; display:block;
    box-shadow:0 6px 20px rgba(15,23,42,.04);
}
.solution-card:hover { transform:translateY(-6px); box-shadow:0 14px 32px rgba(15,23,42,.1); }
.solution-card-icon { font-size:3rem; margin-bottom:16px; text-align:center; }
.solution-card h3 { font-size:1.15rem; margin-bottom:10px; color:#1f2937; }
.solution-card p { color:#64748b; font-size:.95rem; margin-bottom:12px; }
.solution-card ul { list-style:none; padding:0; }
.solution-card ul li { padding:6px 0; color:#475569; font-size:.93rem; }
.solution-card-link { color:#0d6efd; font-weight:700; font-size:.95rem; }

/* ========== 详情页 ========== */
.detail-overview { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.detail-overview-text h2 { margin-bottom:16px; }
.detail-overview-text p { color:#475569; margin-bottom:20px; }
.detail-features { list-style:none; padding:0; margin-bottom:28px; }
.detail-features li { padding:8px 0; padding-left:28px; position:relative; color:#334155; }
.detail-features li::before { content:"✅"; position:absolute; left:0; }
.detail-overview-visual { display:flex; justify-content:center; align-items:center; }
.detail-icon-large {
    font-size:8rem; width:280px; height:280px;
    background:linear-gradient(135deg,#f0f4ff,#e0e8ff);
    border-radius:50%; display:flex; align-items:center; justify-content:center;
    box-shadow:0 16px 48px rgba(13,110,253,.12);
}

.detail-advantages { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.detail-adv-item {
    background:#fff; border:1px solid #e9f0fb; border-radius:16px;
    padding:28px; box-shadow:0 6px 20px rgba(15,23,42,.04);
}
.detail-adv-item h4 { color:#0d6efd; margin-bottom:10px; font-size:1.05rem; }
.detail-adv-item p { color:#64748b; font-size:.93rem; }

.detail-specs { max-width:700px; margin:0 auto; }
.detail-specs table { width:100%; border-collapse:collapse; }
.detail-specs td { padding:14px 16px; border-bottom:1px solid #eef3fb; font-size:.95rem; }
.detail-specs tr td:first-child { font-weight:600; color:#334155; width:35%; background:#f8fafc; }

/* ========== 下载页 ========== */
.download-categories { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:40px; }
.download-tab {
    padding:10px 22px; border-radius:999px; border:1.5px solid #d7e2f2;
    background:#fff; color:#475569; font-weight:600; font-size:.95rem;
    cursor:pointer; transition:all .2s;
}
.download-tab:hover, .download-tab.active { background:#0d6efd; color:#fff; border-color:#0d6efd; }

.download-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.download-card {
    background:#fff; border:1px solid #e9f0fb; border-radius:18px;
    padding:28px; box-shadow:0 6px 20px rgba(15,23,42,.04);
    transition:transform .22s, box-shadow .22s;
    display:flex; flex-direction:column;
}
.download-card:hover { transform:translateY(-4px); box-shadow:0 12px 28px rgba(15,23,42,.1); }
.download-card-header { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.download-card-icon { font-size:2.2rem; }
.download-card-info h3 { font-size:1.05rem; margin-bottom:2px; }
.download-card-info .version { color:#94a3b8; font-size:.85rem; }
.download-card-desc { color:#64748b; font-size:.93rem; flex:1; margin-bottom:18px; line-height:1.7; }
.download-card-meta { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-size:.85rem; color:#94a3b8; }
.download-btn {
    display:block; text-align:center; padding:12px; border-radius:999px;
    background:#0d6efd; color:#fff; font-weight:700; font-size:.95rem;
    transition:all .2s; text-decoration:none;
}
.download-btn:hover { background:#0b5ed7; transform:translateY(-1px); box-shadow:0 4px 14px rgba(13,110,253,.3); }
.download-btn.disabled { background:#94a3b8; cursor:not-allowed; pointer-events:none; }

/* ========== 案例页 ========== */
.case-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.case-card {
    background:#fff; border:1px solid #e9f0fb; border-radius:18px;
    overflow:hidden; box-shadow:0 6px 20px rgba(15,23,42,.04);
    transition:transform .22s, box-shadow .22s;
}
.case-card:hover { transform:translateY(-4px); box-shadow:0 12px 28px rgba(15,23,42,.1); }
.case-card-banner {
    height:180px; display:flex; align-items:center; justify-content:center;
    font-size:3rem; color:#fff;
}
.case-card-body { padding:24px; }
.case-card-body h3 { margin-bottom:8px; }
.case-card-body .case-tag { display:inline-block; background:#eef4ff; color:#0d6efd; padding:4px 12px; border-radius:999px; font-size:.82rem; font-weight:600; margin-bottom:12px; }
.case-card-body p { color:#64748b; font-size:.93rem; }
.case-card-body .case-result { margin-top:14px; padding-top:14px; border-top:1px solid #eef3fb; font-weight:600; color:#10b981; font-size:.93rem; }

/* ========== 关于页 ========== */
.about-hero-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.about-hero-text h2 { margin-bottom:16px; }
.about-hero-text p { color:#475569; margin-bottom:20px; }
.about-values { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:48px; }
.about-value-item { text-align:center; padding:28px 16px; }
.about-value-icon { font-size:2.4rem; margin-bottom:12px; }
.about-value-item h4 { margin-bottom:8px; font-size:1rem; }
.about-value-item p { color:#64748b; font-size:.88rem; }
.about-timeline { max-width:700px; margin:0 auto; }
.timeline-item { display:flex; gap:24px; padding-bottom:32px; position:relative; }
.timeline-dot { width:48px; min-width:48px; height:48px; border-radius:50%; background:#eef4ff; display:flex; align-items:center; justify-content:center; font-weight:800; color:#0d6efd; font-size:.95rem; }
.timeline-content { padding-top:10px; }
.timeline-content h4 { margin-bottom:6px; }
.timeline-content p { color:#64748b; font-size:.93rem; }
.timeline-item:not(:last-child)::after {
    content:""; position:absolute; left:23px; top:58px; bottom:0;
    width:2px; background:#e5eefc;
}

/* ========== 响应式 ========== */
@media (max-width:1024px) {
    .product-grid, .solution-grid, .download-grid, .detail-advantages { grid-template-columns:repeat(2,1fr); }
    .case-grid { grid-template-columns:1fr; }
    .about-values { grid-template-columns:repeat(2,1fr); }
    .detail-overview { grid-template-columns:1fr; }
    .detail-overview-visual { order:-1; }
    .about-hero-grid { grid-template-columns:1fr; }
}
@media (max-width:768px) {
    .page-hero { padding:100px 0 40px; }
    .page-hero h1 { font-size:1.8rem; }
    .product-grid, .solution-grid, .download-grid, .detail-advantages { grid-template-columns:1fr; }
    .about-values { grid-template-columns:1fr 1fr; }
    .download-categories { gap:8px; }
    .download-tab { padding:8px 16px; font-size:.88rem; }
    .detail-icon-large { font-size:5rem; width:180px; height:180px; }
    .detail-specs td { padding:10px 12px; font-size:.88rem; }
    .case-card-banner { height:120px; font-size:2rem; }
}

/* ========== 转化按钮组（详情页 / CTA 区块通用） ========== */
.btn-row { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; align-items:center; }
.btn-row-center { justify-content:center; }
.btn-row .btn { margin:0; }
@media (max-width:768px) {
    .btn-row { gap:8px; }
    .btn-row .btn { flex:1 1 calc(50% - 8px); text-align:center; justify-content:center; padding:10px 12px; font-size:.9rem; }
}

/* ========== 资源图片图标（后台可上传图片替代 emoji） ========== */
.card-icon .icon-image,
.product-card-icon .icon-image,
.solution-card-icon .icon-image {
    display:block; width:72px; height:72px; object-fit:contain; border-radius:14px;
}
.product-card-icon .icon-image { margin:0 auto; }
.solution-card-icon .icon-image { margin:0 auto; }
.detail-icon-large .icon-image {
    width:220px; height:220px; object-fit:cover; border-radius:50%;
}
#pageTitle .icon-image {
    height:1.1em; width:1.1em; object-fit:contain; vertical-align:-0.15em;
    border-radius:8px; margin-right:2px;
}
/* 案例封面图：有图铺满，没图继续显示 emoji */
.case-card-banner img { width:100%; height:100%; object-fit:cover; display:block; }

/* ========== 下载页搜索框 ========== */
.download-search { margin:16px 0 24px; }
.download-search input {
    width:100%; max-width:480px; display:block; margin:0 auto;
    padding:12px 18px; border:1.5px solid #e2e8f0; border-radius:12px;
    font-size:.95rem; outline:none; transition:border-color .2s, box-shadow .2s;
    background:#fff;
}
.download-search input:focus { border-color:#0d6efd; box-shadow:0 0 0 3px rgba(13,110,253,.12); }

/* ========== 列表加载状态（加载中 / 暂无数据 / 加载失败可重试） ========== */
.content-state {
    grid-column:1/-1; padding:32px 24px; text-align:center;
    color:#64748b; font-size:.95rem;
    border:1px dashed #e2e8f0; border-radius:16px; background:#fff;
}
.content-state.error { color:#b91c1c; border-color:#fecaca; background:#fef2f2; }
.content-state.loading { color:#64748b; }