.sub-banner { position: relative; padding: 160px 0 80px; text-align: center; overflow: hidden; background: var(--dark-bg); }

.sub-banner::before { content: ''; position: absolute; inset: 0; background:
    radial-gradient(ellipse 60% 50% at 50% 40%, rgba(0, 100, 180, 0.12) 0%, transparent 60%),
    linear-gradient(180deg, var(--dark-bg2) 0%, var(--dark-bg) 100%); }

.sub-banner::after { content: ''; position: absolute; inset: 0; background-image:
    linear-gradient(rgba(0, 212, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 212, 255, 0.03) 1px, transparent 1px); background-size: 60px 60px; mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, black 10%, transparent 70%); }

.sub-banner .container { position: relative; z-index: 1; }

.sub-banner .breadcrumb,
.gw-hero .breadcrumb,
.ent-hero .breadcrumb,
.adv-hero .breadcrumb,
.api-hero .breadcrumb,
.ops-hero .breadcrumb { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 24px; font-size: var(--fs-body); color: var(--text-muted); }

.sub-banner .breadcrumb a,
.gw-hero .breadcrumb a,
.ent-hero .breadcrumb a,
.adv-hero .breadcrumb a,
.api-hero .breadcrumb a,
.ops-hero .breadcrumb a { color: var(--text-secondary); transition: color 0.2s; }

.sub-banner .breadcrumb a:hover,
.gw-hero .breadcrumb a:hover,
.ent-hero .breadcrumb a:hover,
.adv-hero .breadcrumb a:hover,
.api-hero .breadcrumb a:hover,
.ops-hero .breadcrumb a:hover { color: var(--primary); }

.sub-banner .breadcrumb .sep,
.gw-hero .breadcrumb .sep,
.ent-hero .breadcrumb .sep,
.adv-hero .breadcrumb .sep,
.api-hero .breadcrumb .sep,
.ops-hero .breadcrumb .sep { color: var(--text-muted); font-size: var(--fs-body); }

.sub-banner .breadcrumb .current,
.gw-hero .breadcrumb .current,
.ent-hero .breadcrumb .current,
.adv-hero .breadcrumb .current,
.api-hero .breadcrumb .current,
.ops-hero .breadcrumb .current { color: var(--primary); }

.sub-banner h1 { font-size: var(--fs-subhero); font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; margin-bottom: 16px; }

.sub-banner h1 .accent { background: linear-gradient(135deg, var(--accent-text), var(--accent-text-2)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }

.sub-banner .sub-desc { font-size: var(--fs-body-lg); color: var(--text-secondary); max-width: 600px; margin: 0 auto 32px; line-height: 1.8; }

.sub-banner .banner-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

.sub-content { padding: 80px 0; }

.sub-content.alt-bg { background: var(--dark-bg2); }

.sub-header { text-align: center; margin-bottom: 56px; }

.sub-header .section-tag { margin-bottom: 12px; }

.sub-header .section-title { margin-bottom: 12px; }

.sub-header .section-desc { margin: 0 auto; max-width: 600px; }

.sub-cta { padding: 80px 0; background: var(--dark-bg2); position: relative; overflow: hidden; }

.sub-cta::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 80% at 50% 50%, rgba(0, 212, 255, 0.06) 0%, transparent 60%); }

.sub-cta .container { position: relative; z-index: 1; text-align: center; }

.sub-cta h2 { font-size: var(--fs-subsection); font-weight: 800; margin-bottom: 16px; }

.sub-cta p { font-size: var(--fs-body); color: var(--text-secondary); margin-bottom: 32px; max-width: 500px; margin-left: auto; margin-right: auto; }

.card-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }

.card-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.card-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

.info-card { padding: 32px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); transition: all 0.25s; }

.info-card:hover { border-color: var(--border-hover); transform: translateY(-4px); box-shadow: 0 16px 44px rgba(0, 0, 0, 0.16); }

.info-card .card-icon-wrap { width: 52px; height: 52px; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; margin-bottom: 20px; font-size: var(--fs-h2); }

.info-card .card-icon-wrap .icon-svg { width: 28px; height: 28px; }

.info-card .card-icon-wrap img { width: 28px; height: 28px; display: block; }

.info-card .card-icon-wrap.icon-blue { background: rgba(0, 212, 255, 0.1); color: var(--primary); }

.info-card .card-icon-wrap.icon-purple { background: var(--tag-bg); color: var(--emphasis); }

.info-card .card-icon-wrap.icon-teal { background: var(--tag-bg); color: var(--accent-text-2); }

.info-card .card-icon-wrap.icon-amber { background: var(--tag-bg); color: var(--data-color); }

.info-card h3 { font-size: var(--fs-h4); font-weight: 700; margin-bottom: 10px; }

.info-card p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; }

.info-card > ul { list-style: none; padding: 0; margin: 0; }

.info-card > ul > li { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; padding: 4px 0; padding-left: 18px; position: relative; }

.info-card > ul > li::before { content: ''; position: absolute; left: 0; top: 12px; width: 6px; height: 6px; border-radius: 50%; background: var(--primary); opacity: 0.5; }

.info-card li > ul { margin-top: 8px; padding-left: 20px; list-style: disc; }

.info-card li > ul > li { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.9; padding: 2px 0; }

/* 招聘岗位列表（about.html「加入我们」区块） */
.info-card .job-list { list-style: none; padding: 0; margin: 0 0 16px; }
.info-card .job-list li { padding: 0; margin: 0; }
.info-card .job-link {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px; border-radius: var(--radius-sm);
  text-decoration: none; color: var(--text);
  border: 1px solid transparent;
  transition: all 0.2s ease;
  font-size: var(--fs-body);
}
.info-card .job-link:hover {
  border-color: var(--primary);
  background: var(--primary-glow);
  color: var(--primary);
  transform: translateX(2px);
}
.info-card .job-link:hover .job-arrow { color: var(--primary); transform: translateX(2px); }
.info-card .job-arrow { color: var(--text-muted); transition: all 0.2s ease; font-size: var(--fs-small); }
.info-card .job-tip {
  margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--card-border);
  font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7;
}
.info-card .job-mail { color: var(--c-link); text-decoration: none; font-weight: var(--fw-semibold); }
.info-card .job-mail:hover { text-decoration: underline; text-underline-offset: 3px; }

.process-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; position: relative; }

.process-steps::before { content: ''; position: absolute; top: 36px; left: 60px; right: 60px; height: 2px; background: var(--card-border); }

.process-step { text-align: center; position: relative; }

.process-step .step-circle { width: 72px; height: 72px; border-radius: 50%; border: 1px solid var(--border-active); display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; font-size: var(--fs-h2); font-weight: 800; color: var(--primary); background: var(--dark-bg); position: relative; z-index: 1; }

.process-step .step-label { font-size: var(--fs-body); font-weight: 700; margin-bottom: 8px; }

.process-step .step-text { font-size: var(--fs-body); color: var(--text-muted); line-height: 1.6; }

.pricing-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }

.pricing-grid-4 { grid-template-columns: repeat(4, 1fr); gap: 18px; }

.pricing-grid-4 .pricing-card { padding: 30px 22px; }

.pricing-grid-4 .pricing-card .price-val { font-size: var(--fs-h1); }

.pricing-grid-4 .pricing-card .price-features li { padding: 6px 0; font-size: var(--fs-body); }

.pricing-grid-4 .pricing-card.featured { transform: translateY(-12px) scale(1.05); z-index: 2; }

.pricing-note { margin-top: 32px; padding: 28px 32px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); }

.pricing-note-title { font-size: var(--fs-body); font-weight: 700; color: var(--text-primary); margin-bottom: 18px; letter-spacing: 0.04em; }

.pricing-note-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 18px; }

.pricing-note-item { padding: 16px 14px; background: rgba(255, 255, 255, 0.02); border: 1px solid var(--card-border); border-radius: var(--radius-md); }

.pricing-note-label { font-size: var(--fs-small); color: var(--text-muted); letter-spacing: 0.06em; margin-bottom: 8px; }

.pricing-note-val { font-size: var(--fs-h3); font-weight: 700; color: var(--primary); margin-bottom: 6px; }

.pricing-note-val span { font-size: var(--fs-small); color: var(--text-muted); font-weight: 500; margin-left: 4px; }

.pricing-note-sub { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.5; }

.pricing-note-foot { padding-top: 14px; border-top: 1px dashed var(--card-border); font-size: var(--fs-small); color: var(--text-muted); line-height: 1.7; }

.pricing-card { padding: 36px 28px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); text-align: center; transition: all 0.25s; position: relative; display: flex; flex-direction: column; }

.pricing-card:hover { border-color: var(--border-hover); transform: translateY(-4px); }

.pricing-card.featured { border-color: var(--primary); background: linear-gradient(180deg, rgba(0, 212, 255, 0.10) 0%, var(--card-bg) 100%); box-shadow:
    0 24px 60px -20px rgba(0, 212, 255, 0.35),
    0 0 0 1px rgba(0, 212, 255, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.06); z-index: 2; overflow: hidden; animation: pricing-featured-pulse 4s ease-in-out infinite; }

/* 推荐卡 (featured) 免疫 AOS 默认隐藏 — 必须保留 -10px 上移和 opacity:1
   加 html.js 前缀（type+class） + .pricing-card + .featured 把特异性拉到 (0,4,1)，
   超过 AOS 隐藏规则 html.js [data-aos]:not(.aos-animate) 的 (0,3,1) */
html.js .pricing-card.featured[data-aos] { transform: translateY(-10px); opacity: 1; }

.pricing-card.featured::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg,
    transparent 0%,
    var(--primary) 30%,
    var(--accent2) 50%,
    var(--primary) 70%,
    transparent 100%); background-size: 200% 100%; animation: pricing-shine 3.5s linear infinite; pointer-events: none; }

.pricing-card.featured::after { content: ''; position: absolute; top: -40%; left: -20%; width: 140%; height: 140%; background: radial-gradient(ellipse at center,
    rgba(0, 212, 255, 0.10) 0%,
    transparent 60%); pointer-events: none; animation: pricing-glow-breathe 4s ease-in-out infinite; z-index: 0; }

.pricing-card.featured > * { position: relative; z-index: 1; }

.pricing-card.featured:hover,
.pricing-card.featured.aos-animate:hover { transform: translateY(-14px); box-shadow:
    0 32px 72px -20px rgba(0, 212, 255, 0.50),
    0 0 0 1px rgba(0, 212, 255, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.10); }

.pricing-card .price-tag { display: inline-block; padding: 4px 14px; border-radius: 100px; font-size: var(--fs-body); font-weight: 600; background: var(--primary); color: var(--text-on-primary); margin-bottom: 20px; }

.pricing-card.featured .price-tag { padding: 6px 18px; font-size: var(--fs-body); background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); box-shadow:
    0 4px 14px rgba(0, 212, 255, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset; animation: pricing-tag-pulse 2.4s ease-in-out infinite; }

.pricing-card .price-name { font-size: var(--fs-h3); font-weight: 700; margin-bottom: 8px; }

.pricing-card .price-val { font-size: var(--fs-display); font-weight: 800; color: var(--primary); margin-bottom: 4px; line-height: 1.1; }

.pricing-card .price-val .price-val-unit { font-size: var(--fs-h3); font-weight: 700; margin-left: 2px; }

.pricing-card .price-unit { font-size: var(--fs-body); color: var(--text-muted); margin-bottom: 24px; }

.pricing-card .price-val.price-val-text { font-size: var(--fs-h2); font-weight: 700; color: var(--text-primary); letter-spacing: 0.04em; }

.pricing-card .price-tagline { font-size: var(--fs-small); color: var(--text-muted); letter-spacing: 0.04em; margin-bottom: 18px; }

.pricing-card .price-features { list-style: none; padding: 0; margin: 0 0 28px; text-align: left; flex: 1; }

.pricing-card .price-features li { padding: 8px 0; font-size: var(--fs-small); color: var(--text-secondary); border-bottom: 1px solid var(--card-border); display: flex; align-items: center; gap: 10px; }

.pricing-card .price-features li:last-child { border-bottom: none; }

.pricing-card .price-features li .check { color: var(--accent2); font-size: var(--fs-small); flex-shrink: 0; }

.pricing-card .btn-cta,
.pricing-card .btn-outline { display: flex; justify-content: center; align-items: center; margin: auto auto 0; min-width: 200px; padding: 14px 32px; text-align: center; letter-spacing: 0.02em; position: relative; }

.pricing-card.featured .btn-primary { padding: 16px 40px; font-size: var(--fs-body); font-weight: 700; background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); color: var(--text-on-primary); box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.20),
    0 0 0 1px rgba(255, 255, 255, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.25); overflow: hidden; transition: transform 0.25s, box-shadow 0.25s; }

.pricing-card.featured .btn-primary:hover { transform: translateY(-2px); box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.24),
    0 0 0 1px rgba(255, 255, 255, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.3); }

.pricing-card.featured .btn-primary::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(110deg,
    transparent 25%,
    rgba(255, 255, 255, 0.35) 50%,
    transparent 75%); transform: translateX(-120%); transition: transform 0.7s ease; pointer-events: none; }

.pricing-card.featured .btn-primary:hover::before { transform: translateX(120%); }

.pricing-card.featured .btn-primary::after { content: '→'; margin-left: 10px; font-weight: 700; display: inline-block; transition: transform 0.25s; }

.pricing-card.featured .btn-primary:hover::after { transform: translateX(4px); }

.pay-qr-block { margin-top: 40px; padding: 28px 32px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); display: flex; align-items: center; gap: 28px; max-width: 520px; margin-left: auto; margin-right: auto; }

.pay-qr-card { width: 140px; height: 140px; flex-shrink: 0; background: #fff; border-radius: 10px; padding: 8px; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 1px var(--card-border); overflow: hidden; }

.pay-qr-card img { width: 100%; height: 100%; object-fit: contain; display: block; }

.pay-qr-card img[src*="qr-placeholder"] { background:
    repeating-linear-gradient(45deg, #f3f4f6 0 6px, #e5e7eb 6px 12px); border-radius: 6px; }

.pay-qr-info { flex: 1; min-width: 0; }

.pay-qr-title { font-size: var(--fs-h4); font-weight: 700; color: var(--text-primary); margin-bottom: 8px; line-height: 1.2; }

.pay-qr-sub { font-size: var(--fs-body); color: var(--text-secondary); line-height: 1.6; margin-bottom: 4px; }

.pay-qr-tip { font-size: var(--fs-body); color: var(--text-muted); letter-spacing: 0.04em; line-height: 1.4; }

.filter-tags { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 36px; }

.filter-tag { padding: 8px 20px; border-radius: 100px; font-size: var(--fs-small); background: var(--card-bg); border: 1px solid var(--card-border); color: var(--text-secondary); cursor: pointer; transition: all 0.2s; }

.filter-tag:hover,
.filter-tag.active { background: var(--primary-glow); border-color: var(--border-active); color: var(--primary); }

.news-pagination { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }

.news-pagination[hidden] { display: none; }

.news-pagination .filter-tag:disabled { cursor: default; opacity: 0.45; }

.timeline { position: relative; padding-left: 40px; }

.timeline::before { content: ''; position: absolute; left: 15px; top: 0; bottom: 0; width: 2px; background: var(--card-border); }

.timeline-item { position: relative; padding-bottom: 40px; }

.timeline-item::before { content: ''; position: absolute; left: -33px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--primary); border: 3px solid var(--dark-bg); }

.timeline-item .tl-year { font-size: var(--fs-small); font-weight: 700; color: var(--primary); margin-bottom: 6px; }

.timeline-item .tl-title { font-size: var(--fs-body); font-weight: 600; margin-bottom: 6px; }

.timeline-item .tl-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; }

.detail-case { padding: 36px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); transition: all 0.25s; }

.detail-case:hover { border-color: var(--border-hover); transform: translateY(-4px); }

.detail-case .case-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; flex-wrap: wrap; gap: 12px; }

.detail-case .case-industry { display: inline-block; padding: 4px 14px; border-radius: 100px; font-size: var(--fs-small); background: var(--tag-bg); color: var(--emphasis); border: 1px solid var(--border-hover); }

.detail-case h3 { font-size: var(--fs-h3); font-weight: 700; margin-bottom: 12px; line-height: 1.4; }

.detail-case .case-body { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.8; margin-bottom: 20px; }

.detail-case .case-body p { margin-bottom: 12px; }

.detail-case .case-results { display: flex; gap: 24px; flex-wrap: wrap; padding-top: 20px; border-top: 1px solid var(--card-border); }

.arch-layer { padding: 36px; border-radius: var(--radius-lg); border: 1px solid var(--card-border); margin-bottom: 20px; transition: all 0.25s; }

.arch-layer:hover { border-color: var(--border-hover); }

.arch-layer .layer-head { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }

.arch-layer .layer-icon { width: 48px; height: 48px; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; font-size: var(--fs-h3); }

.arch-layer .layer-icon .icon-svg { width: 26px; height: 26px; }

.arch-layer .layer-name { font-size: var(--fs-h3); font-weight: 700; }

.arch-layer .layer-desc { font-size: var(--fs-small); color: var(--text-secondary); margin-bottom: 20px; line-height: 1.7; }

.arch-layer .layer-items { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }

.arch-layer .layer-item { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: rgba(255, 255, 255, 0.03); border-radius: var(--radius-sm); font-size: var(--fs-small); color: var(--text-secondary); }

.arch-layer .layer-item .item-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }

.value-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 22px 18px; transition: all 0.3s; display: flex; gap: 12px; align-items: flex-start; }

.value-card:hover { border-color: var(--primary); }

.value-card .value-icon { width: 40px; height: 40px; margin-left: auto; margin-right: auto; color: var(--primary); font-size: var(--fs-display); margin-bottom: 20px; }

.value-card .value-icon .icon-svg { width: 100%; height: 100%; }

.value-card h3 { font-size: var(--fs-h3); font-weight: 700; margin-bottom: 12px; }

.value-card p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; }

.news-list-card { display: flex; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); overflow: hidden; transition: all 0.25s; cursor: pointer; }

.news-list-card:hover { border-color: var(--border-hover); transform: translateY(-2px); }

/* 头图：固定宽 280 + 高 180（与原图宽高比约 14:9 接近），保证桌面端不被拉伸 */
.news-list-card .news-thumb {
  width: 280px;
  min-width: 280px;
  aspect-ratio: 14 / 9;
  height: auto;
  background: linear-gradient(135deg, var(--dark-bg3), #0A1A2A);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}

.news-list-card .news-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }

.news-list-card:hover .news-thumb img { transform: scale(1.05); }

.news-list-card .news-body { padding: 24px 28px; flex: 1; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; }

.news-list-card .news-body .news-meta-row { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }

.news-list-card .news-body h3 { font-size: var(--fs-h4); font-weight: 700; line-height: 1.5; margin-bottom: 10px; }

.news-list-card .news-body p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; margin-bottom: 12px; }

.code-tabs { display: flex; gap: 4px; margin-bottom: 0; }

.code-tab { padding: 10px 20px; font-size: var(--fs-body); color: var(--text-muted); background: transparent; border: none; cursor: pointer; border-bottom: 2px solid transparent; transition: all 0.2s; font-family: inherit; }

.code-tab.active { color: var(--primary); border-bottom-color: var(--primary); }

.code-tab:hover { color: var(--text-secondary); }

.code-panel { display: none; }

.code-panel.active { display: block; }

.data-table { width: 100%; border-collapse: collapse; background: var(--card-bg); border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--card-border); }

.data-table th,
.data-table td { padding: 14px 20px; text-align: left; font-size: var(--fs-small); border-bottom: 1px solid var(--card-border); }

.data-table th { background: rgba(0, 212, 255, 0.05); font-weight: 600; color: var(--text-primary); font-size: var(--fs-body); }

.data-table td { color: var(--text-secondary); }

.data-table tr:last-child td { border-bottom: none; }

.data-table .val-primary { color: var(--primary); font-weight: 700; }

.expand-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }

.expand-content.open { max-height: 800px; }

.expand-toggle { cursor: pointer; user-select: none; font-size: var(--fs-small); font-weight: 500; color: var(--emphasis); }

.case-tag { font-size: var(--fs-micro); letter-spacing: 0.12em; font-weight: 600; }

.case-row-tag { font-size: var(--fs-caption); letter-spacing: 0.1em; font-weight: 600; min-width: 48px; }

.case-row-title { font-size: var(--fs-body); font-weight: 600; color: var(--heading); margin-bottom: 4px; }

.case-row-desc { font-size: var(--fs-small); color: var(--text-muted); }

.news-more { font-size: var(--fs-small); color: var(--emphasis); font-weight: 500; }

.kpi-unit { font-size: var(--fs-small); }

.expand-toggle .toggle-arrow { display: inline-block; transition: transform 0.3s; font-size: var(--fs-small); }

.expand-toggle.open .toggle-arrow { transform: rotate(180deg); }

.timeline-item-planned { opacity: 0.7; }

.timeline-item-planned::before { background: var(--accent) !important; }

.sub-contact { background: linear-gradient(180deg, var(--dark-bg) 0%, var(--dark-bg2) 100%); }

.sub-form { max-width: 720px; margin: 0 auto; padding: 32px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); }

.sub-form .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }

.sub-form .form-group { margin-bottom: 16px; }

.sub-form label { display: block; font-size: var(--fs-body); color: var(--text-secondary); margin-bottom: 6px; }

.sub-form input,
.sub-form textarea,
.sub-form select { width: 100%; padding: 12px 14px; background: rgba(255,255,255,0.03); border: 1px solid var(--card-border); border-radius: var(--radius-sm); color: var(--text-primary); font-size: var(--fs-small); font-family: inherit; transition: border-color 0.18s, background 0.18s, box-shadow 0.18s; }

.sub-form input:focus,
.sub-form textarea:focus,
.sub-form select:focus {
  outline: none;
  border-color: var(--input-border-focus);
  /* P1-01 · 外发光 + 内 1px 微弱提示（与 login.css 同步升级） */
  box-shadow:
    0 0 0 3px var(--halo-border),
    inset 0 0 0 1px rgba(0, 212, 255, 0.20);
}

.partner-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 800px; margin: 0 auto; }

.partner-item { padding: 24px 16px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-md); text-align: center; color: var(--text-secondary); font-size: var(--fs-small); font-weight: 500; transition: border-color 0.2s, color 0.2s; }

.partner-item:hover { border-color: var(--border-hover); color: var(--text-primary); }

.compare-table { width: 100%; max-width: 900px; margin: 0 auto; border-collapse: collapse; font-size: var(--fs-small); }

.compare-table th,
.compare-table td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--card-border); }

.compare-table thead th { background: var(--card-bg); color: var(--text-primary); font-weight: 600; font-size: var(--fs-small); }

.compare-table tbody tr:hover { background: rgba(0, 212, 255, 0.04); }

.compare-table td:nth-child(2) { color: var(--primary); font-weight: 600; }

.info-banner { background: linear-gradient(90deg, var(--halo-bg), var(--halo-border)); border-bottom: 1px solid var(--halo-border); padding: 10px 16px; text-align: center; font-size: var(--fs-small); color: var(--text); position: sticky; top: 0; z-index: 1000; backdrop-filter: blur(12px); }

.info-banner strong { color: var(--primary); font-weight: 700; }

.info-banner a { color: var(--primary); text-decoration: none; margin: 0 6px; }

.info-banner a:hover { text-decoration: underline; }

.icon-flat { width: 24px; height: 24px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

.icon-flat.lg { width: 28px; height: 28px; }

.icon-flat.xl { width: 36px; height: 36px; }

.api-hero { padding: 96px 24px 48px; max-width: 1280px; margin: 0 auto; text-align: center; position: relative; }

.api-hero::before { content: ''; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); width: 1200px; height: 600px; background: radial-gradient(ellipse 60% 50% at center, var(--halo-bg) 0%, transparent 70%); pointer-events: none; z-index: -1; }

.api-hero .hero-tag { display: inline-block; padding: 6px 16px; background: var(--halo-bg); border: 1px solid var(--halo-border); border-radius: 20px; font-size: var(--fs-small); color: var(--primary); letter-spacing: 1px; margin-bottom: 18px; }

.api-hero h1 { font-size: var(--fs-subhero); font-weight: 800; line-height: 1.25; margin-bottom: 18px; color: var(--text); }

.api-hero .hero-desc { font-size: var(--fs-body); color: var(--text-secondary); max-width: 760px; margin: 0 auto; line-height: 1.7; }

.maas-explainer { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 18px 24px; margin: 28px auto 0; max-width: 880px; text-align: left; display: flex; gap: 14px; align-items: center; }

.maas-explainer .m-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--halo-bg); color: var(--primary); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.maas-explainer p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; }

.maas-explainer p strong { color: var(--text); }

.api-tracks { max-width: 1280px; margin: 0 auto; padding: 48px 24px 32px; }

.api-track-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

.api-track-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 32px 24px; transition: all 0.3s; text-decoration: none; color: var(--text); display: block; }

.api-track-card:hover { border-color: var(--primary); }

.api-track-card .t-num { display: inline-block; padding: 4px 10px; background: var(--halo-border); color: var(--primary); font-size: var(--fs-caption); font-weight: 700; letter-spacing: 1px; border-radius: 4px; margin-bottom: 14px; }

.api-track-card h3 { font-size: var(--fs-h3); font-weight: 700; color: var(--text); margin-bottom: 6px; }

.api-track-card .t-en { font-size: var(--fs-caption); color: var(--text-muted); letter-spacing: 1px; margin-bottom: 14px; }

.api-track-card .t-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; margin-bottom: 18px; }

.api-track-card .model-list { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; }

.api-track-card .model-pill { padding: 3px 10px; background: var(--bg-elev); border: 1px solid var(--border); border-radius: 12px; font-size: var(--fs-caption); color: var(--text-secondary); font-weight: 600; }

.api-track-card .t-cta { font-size: var(--fs-small); color: var(--primary); font-weight: 600; }

.section-block { max-width: 1280px; margin: 0 auto; padding: 56px 24px; }

.section-block + .section-block { border-top: 1px solid var(--border); }

.section-header { text-align: center; margin-bottom: 36px; }

.section-tag { display: inline-block; padding: 6px 16px; background: var(--halo-bg); border: 1px solid var(--halo-border); border-radius: 20px; font-size: var(--fs-small); color: var(--primary); letter-spacing: 1px; margin-bottom: 10px; }

.section-title-h2 { font-size: var(--fs-subsection); font-weight: 800; color: var(--text); margin-bottom: 12px; }

.section-subtitle { color: var(--text-secondary); max-width: 720px; margin: 0 auto; font-size: var(--fs-small); line-height: 1.7; }

.section-subtitle-mini { display: inline-block; margin-left: 12px; padding: 2px 10px; font-size: 12px; font-weight: 500; color: var(--accent); background: rgba(99, 102, 241, 0.1); border: 1px solid rgba(99, 102, 241, 0.3); border-radius: 10px; vertical-align: middle; letter-spacing: 0.05em; }

.value-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }

.value-card .v-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--halo-bg); color: var(--primary); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.value-card .v-body { flex: 1; }

.value-card .v-name { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 4px; }

.value-card .v-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.6; }

.model-categories { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }

.model-category { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 24px 22px; }

.model-category.is-overseas { opacity: .62; border-style: dashed; cursor: pointer; transition: opacity .2s ease, transform .2s ease, border-color .2s ease; }

.model-category.is-overseas:hover,
.model-category.is-overseas:focus-visible { opacity: 1; transform: translateY(-2px); border-color: var(--primary); outline: none; }

.model-category.is-overseas .model-row { opacity: .85; }

.model-category.is-overseas .model-name::after { content: '\23F3'; margin-left: 6px; opacity: .6; font-size: .85em; }

.toast-overseas { position: fixed; left: 50%; bottom: 48px; transform: translateX(-50%) translateY(8px); background: var(--card-bg, #0b1426); color: var(--text, #f5f5f5); border: 1px solid var(--primary, #ff7a3d); border-radius: 999px; padding: 12px 22px; font-size: 14px; font-weight: 600; box-shadow: 0 12px 32px rgba(0, 0, 0, .35); z-index: 9999; pointer-events: none; opacity: 0; transition: opacity .22s ease, transform .22s ease; max-width: calc(100vw - 32px); text-align: center; }

.toast-overseas:not([hidden]) { opacity: 1; transform: translateX(-50%) translateY(0); animation: toastOverseasIn .26s cubic-bezier(.34, 1.56, .64, 1); }

.model-category h3 { font-size: var(--fs-body); font-weight: 700; color: var(--text); margin-bottom: 4px; display: flex; align-items: center; gap: 8px; }

.model-category .h-icon { width: 24px; height: 24px; color: var(--primary); }

.model-category .cat-en { font-size: var(--fs-caption); color: var(--text-muted); letter-spacing: 1px; margin-bottom: 14px; }

.model-category .model-row { padding: 9px 0; border-bottom: 1px dashed var(--border); font-size: var(--fs-small); color: var(--text-secondary); display: flex; align-items: center; gap: 8px; }

.model-category .model-row:last-child { border-bottom: none; }

.model-category .model-name { color: var(--text); font-weight: 600; }

.model-category .model-tag { font-size: var(--fs-caption); padding: 2px 6px; background: var(--halo-border); color: var(--primary); border-radius: 3px; font-weight: 600; }

.compliance-section { max-width: 1280px; margin: 0 auto; padding: 56px 24px; }

.compliance-box { background: linear-gradient(135deg, var(--halo-bg), var(--halo-bg)); border: 1px solid var(--halo-border); border-radius: 16px; padding: 36px; }

.compliance-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; margin-bottom: 24px; }

.compliance-item { background: var(--bg-elev); border: 1px solid var(--card-border); border-radius: 10px; padding: 16px 18px; }

.compliance-item .ci-num { font-size: var(--fs-caption); font-weight: 700; color: var(--primary); letter-spacing: 1px; margin-bottom: 8px; }

.compliance-item h4 { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 6px; }

.compliance-item p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.6; }

.compliance-note { display: flex; gap: 12px; padding: 16px; background: var(--bg-elev); border-radius: 10px; align-items: flex-start; }

.compliance-note .cn-icon { width: 32px; height: 32px; border-radius: 8px; background: var(--halo-bg); color: var(--primary); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.compliance-note p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; }

.compliance-note p strong { color: var(--text); }

.relation-section { max-width: 1280px; margin: 0 auto; padding: 56px 24px; }

.relation-diagram { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 32px; }

.relation-box { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 24px; }

.relation-box.left { border-left: 4px solid var(--primary); }

.relation-box.right { border-left: 4px solid var(--emphasis); }

.relation-box h4 { font-size: var(--fs-body); font-weight: 700; color: var(--text); margin-bottom: 10px; }

.relation-box .rel-mode { display: inline-block; padding: 4px 10px; background: var(--bg-elev); color: var(--text-secondary); border-radius: 4px; font-size: var(--fs-caption); font-weight: 600; margin-bottom: 10px; }

.relation-box p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.6; margin-bottom: 10px; }

.relation-box .rel-arrow { font-size: var(--fs-small); color: var(--primary); font-weight: 700; }

.contact-section { background: var(--bg-elev); padding: 64px 24px; }

.contact-inner { max-width: 720px; margin: 0 auto; text-align: center; }

.contact-inner h2 { font-size: var(--fs-h3); font-weight: 700; margin-bottom: 10px; color: var(--text); }

.contact-inner p { color: var(--text-secondary); margin-bottom: 28px; font-size: var(--fs-small); }

.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; text-align: left; }

.contact-form .form-group { margin-bottom: 0; }

.contact-form .full { grid-column: 1 / -1; }

.footer-tag { display: inline-block; padding: 3px 8px; background: var(--halo-border); color: var(--primary); border-radius: 4px; font-size: var(--fs-caption); font-weight: 600; letter-spacing: 1px; margin-left: 8px; }

.adv-hero { padding: 96px 24px 48px; max-width: 1280px; margin: 0 auto; text-align: center; position: relative; }

.adv-hero::before { content: ''; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); width: 1200px; height: 600px; background: radial-gradient(ellipse 60% 50% at center, var(--halo-bg) 0%, transparent 70%); pointer-events: none; z-index: -1; }

.adv-hero .hero-tag { display: inline-block; padding: 6px 16px; background: var(--halo-bg); border: 1px solid var(--halo-border); border-radius: 20px; font-size: var(--fs-small); color: var(--accent2); letter-spacing: 1px; margin-bottom: 18px; }

.adv-hero h1 { font-size: var(--fs-subhero); font-weight: 800; line-height: 1.25; margin-bottom: 18px; color: var(--text); }

.adv-hero .hero-desc { font-size: var(--fs-body); color: var(--text-secondary); max-width: 760px; margin: 0 auto; line-height: 1.7; }

.core-statement { max-width: 880px; margin: 28px auto 0; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 20px 24px; text-align: left; display: flex; gap: 14px; align-items: center; }

.core-statement .c-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--halo-bg); color: var(--accent2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.core-statement p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; }

.core-statement p strong { color: var(--text); }

.services-stack { display: flex; flex-direction: column; gap: 18px; }

.service-line { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 28px 32px; transition: all 0.3s; position: relative; overflow: hidden; }

.service-line::before { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: var(--accent2); opacity: 0.6; }

.service-line:hover { border-color: var(--accent2); }

.service-line .line-header { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }

.service-line .line-num { font-size: var(--fs-h1); font-weight: 900; color: var(--halo-border); line-height: 1; }

.service-line .line-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--halo-bg); color: var(--accent2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.service-line h3 { font-size: var(--fs-h4); font-weight: 700; color: var(--text); flex: 1; margin: 0; line-height: 1; }

.service-line .line-tag { padding: 4px 10px; background: var(--halo-border); color: var(--accent2); border-radius: 4px; font-size: var(--fs-caption); font-weight: 600; letter-spacing: 1px; }

.service-line .line-slogan { font-size: var(--fs-small); color: var(--accent2); font-style: italic; margin-bottom: 12px; }

.service-line .line-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; margin-bottom: 18px; }

.service-line .line-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }

.service-line .line-item { background: var(--bg-elev); padding: 12px 14px; border-radius: 8px; display: flex; gap: 10px; align-items: flex-start; }

.service-line .line-item-icon { width: 22px; height: 22px; color: var(--accent2); flex-shrink: 0; }

.service-line .line-item-body { flex: 1; }

.service-line .line-item .i-name { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 3px; }

.service-line .line-item .i-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.5; }

.industry-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

.industry-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 20px; transition: all 0.3s; }

.industry-card:hover { border-color: var(--accent2); }

.industry-card .i-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--halo-bg); color: var(--accent2); display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }

.industry-card .i-name { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 6px; }

.industry-card .i-products { font-size: var(--fs-caption); color: var(--primary); padding: 3px 8px; background: var(--halo-bg); border-radius: 3px; display: inline-block; margin-bottom: 8px; }

.industry-card .i-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.5; }

.method-flow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; align-items: stretch; position: relative; }

.method-step { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 22px 18px; position: relative; text-align: center; }

.method-step .step-num { width: 36px; height: 36px; border-radius: 50%; background: var(--accent2); color: var(--bg); font-weight: 700; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; font-size: var(--fs-body); }

.method-step h4 { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 6px; }

.method-step p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.5; }

.method-arrow { position: absolute; right: -12px; top: 50%; transform: translateY(-50%); color: var(--accent2); font-size: var(--fs-h3); z-index: 2; }

.deliv-groups { display: flex; flex-direction: column; gap: 28px; }

.deliv-group { display: block; }

.deliv-group-header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--card-border); flex-wrap: wrap; }

.deliv-group-num { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 24px; padding: 0 8px; font-family: var(--font-mono); font-size: var(--fs-caption); font-weight: 700; color: var(--primary); background: var(--primary-glow); border-radius: 6px; letter-spacing: 0.05em; }

.deliv-group-title { font-size: var(--fs-h3); font-weight: 700; color: var(--text); margin: 0; flex: 1; min-width: 0; }

.deliv-group-tag { font-size: var(--fs-caption); color: var(--text-muted); padding: 3px 10px; border: 1px solid var(--card-border); border-radius: 100px; white-space: nowrap; }

.deliv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

.deliv-card { text-align: center; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 22px 16px; transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease; cursor: default; }

.deliv-card .d-icon { margin: 0 auto 10px; width: 36px; height: 36px; border-radius: 8px; background: var(--halo-bg); color: var(--primary); display: flex; align-items: center; justify-content: center; transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease; }

.deliv-card .d-name { font-size: var(--fs-small); font-weight: 600; color: var(--text); }

.icon-flat.xxl { width: 48px; height: 48px; stroke-width: 1.25; }

.gw-hero { padding: 96px 24px 56px; max-width: 1280px; margin: 0 auto; text-align: center; position: relative; }

.gw-hero::before { content: ''; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); width: 1200px; height: 600px; background: radial-gradient(ellipse 60% 50% at center, var(--halo-bg) 0%, transparent 70%); pointer-events: none; z-index: -1; }

.gw-hero h1 { font-size: var(--fs-subhero); font-weight: 800; line-height: 1.2; margin-bottom: 20px; color: var(--text); }

/* gateway hero-desc 桌面端放宽到 920px：核心定义句"卖的不是单个产品，是两个解决方案—— ..."约 900px 才不换行 */
.gw-hero .hero-desc { font-size: var(--fs-body); color: var(--text-secondary); max-width: 920px; margin: 0 auto; line-height: 1.7; }

/* 平板/移动：hero-desc 拉回 760px，移动本来就该换行 */
@media (max-width: 1024px) {
  .gw-hero .hero-desc { max-width: 760px; }
}

.naming-box { max-width: 880px; margin: 28px auto 0; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 20px 28px; text-align: center; }

.naming-box p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; }

.naming-box strong { color: var(--text); }

.naming-box em { color: var(--emphasis); font-style: normal; font-weight: 600; }

.key-metrics { margin: 32px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }

.key-metric { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 18px 14px; text-align: center; }

.key-metric .km-num { font-size: var(--fs-h2); font-weight: 800; color: var(--primary); line-height: 1; }

.key-metric .km-label { font-size: var(--fs-small); color: var(--text-secondary); margin-top: 8px; }

.dual-track-section { max-width: 1280px; margin: 0 auto; padding: 64px 24px 32px; }

.dual-track-header { text-align: center; margin-bottom: 40px; }

.dual-track-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }

.track-card { background: var(--card-bg); border: 2px solid var(--track-color); border-radius: 16px; padding: 32px 28px; transition: all 0.3s; position: relative; overflow: hidden; text-decoration: none; color: var(--text); display: block; }

.track-card::after { content: ''; position: absolute; top: 28px; right: 24px; width: 22px; height: 22px; background-color: var(--track-color); -webkit-mask: url('images/icons/arrow-right.svg') center/contain no-repeat; mask: url('images/icons/arrow-right.svg') center/contain no-repeat; transition: transform 0.3s; }

.track-card:hover { transform: translateY(-4px); }

.track-card:hover::after { transform: translateX(6px); }

.track-card.enterprise { --track-color: var(--emphasis); }

.track-card.operations { --track-color: var(--primary); }

.track-card .track-num { display: inline-block; padding: 4px 12px; background: var(--track-color); color: white; font-size: var(--fs-caption); font-weight: 700; letter-spacing: 1px; border-radius: 4px; margin-bottom: 16px; }

.track-card.operations .track-num { color: var(--bg); }

.track-card h3 { font-size: var(--fs-h3); font-weight: 800; color: var(--text); margin-bottom: 6px; }

.track-card .track-en { font-size: var(--fs-caption); color: var(--text-muted); letter-spacing: 1px; margin-bottom: 14px; }

.track-card .track-slogan { font-size: var(--fs-small); color: var(--track-color); font-weight: 600; font-style: italic; margin-bottom: 14px; }

.track-card .track-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; margin-bottom: 18px; }

.track-card .track-features { list-style: none; padding: 0; margin: 0 0 20px 0; }

.track-card .track-features li { font-size: var(--fs-small); color: var(--text-secondary); padding: 6px 0 6px 22px; position: relative; border-bottom: 1px dashed var(--border); }

.track-card .track-features li:last-child { border-bottom: none; }

.track-card .track-features li::before { content: ''; position: absolute; left: 0; top: 8px; width: 14px; height: 14px; background-color: var(--track-color); -webkit-mask: url('images/icons/check.svg') center/contain no-repeat; mask: url('images/icons/check.svg') center/contain no-repeat; }

.track-card .track-cta { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; background: var(--track-color); color: white; border-radius: 8px; font-size: var(--fs-small); font-weight: 600; margin-top: 4px; }

.track-card.operations .track-cta { color: var(--bg); }

.capability-section { max-width: 1280px; margin: 0 auto; padding: 56px 24px; border-top: 1px solid var(--border); }

.capability-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 32px; }

.capability-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 22px 18px; transition: all 0.3s; display: flex; gap: 12px; align-items: flex-start; min-width: 0; }

.capability-card:hover { border-color: var(--emphasis); }

.capability-card .c-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--halo-bg); color: var(--emphasis); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.capability-card .c-body { flex: 1; }

.capability-card .c-name { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 4px; }

.capability-card .c-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.6; }

.tech-foundation { max-width: 1280px; margin: 0 auto; padding: 56px 24px; border-top: 1px solid var(--border); }

.tech-foundation-box { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 32px; text-align: center; }

.tech-foundation-box .tech-num { font-size: var(--fs-display); font-weight: 900; color: var(--emphasis); line-height: 1; margin-bottom: 12px; }

.tech-foundation-box .tech-name { font-size: var(--fs-body-lg); font-weight: 700; color: var(--text); margin-bottom: 12px; }

.tech-foundation-box .tech-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; max-width: 720px; margin: 0 auto; }

.ent-hero { padding: 96px 24px 56px; max-width: 1280px; margin: 0 auto; text-align: center; position: relative; }

.ent-hero::before { content: ''; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); width: 1200px; height: 600px; background: radial-gradient(ellipse 60% 50% at center, var(--halo-bg) 0%, transparent 70%); pointer-events: none; z-index: -1; }

.ent-hero .hero-tag { display: inline-block; padding: 6px 16px; background: var(--halo-bg); border: 1px solid var(--halo-border); border-radius: 20px; font-size: var(--fs-small); color: var(--emphasis); letter-spacing: 1px; margin-bottom: 16px; }

.ent-hero h1 { font-size: var(--fs-subhero); font-weight: 800; line-height: 1.25; margin-bottom: 18px; color: var(--text); }

.ent-hero .hero-desc { font-size: var(--fs-body); color: var(--text-secondary); max-width: 760px; margin: 0 auto; line-height: 1.7; }

.value-strip { max-width: 1280px; margin: 28px auto 0; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 22px 24px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

.value-strip .vs-item { display: flex; gap: 10px; align-items: center; }

.value-strip .vs-icon { width: 32px; height: 32px; border-radius: 8px; background: var(--halo-bg); color: var(--emphasis); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.value-strip .vs-body { flex: 1; }

.value-strip .vs-name { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 3px; }

.value-strip .vs-sub { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.5; }

.composition-flow { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 32px; }

.composition-level { margin-bottom: 20px; }

.composition-level:last-child { margin-bottom: 0; }

.composition-level .lvl-tag { display: inline-flex; align-items: baseline; gap: 8px; padding: 4px 12px; background: var(--halo-border); color: var(--emphasis); font-size: var(--fs-caption); font-weight: 700; letter-spacing: 1px; border-radius: 4px; margin-bottom: 12px; }

.composition-level .lvl-tag-en { font-size: var(--fs-micro); font-weight: 500; color: var(--emphasis); opacity: 0.55; letter-spacing: 0.8px; text-transform: uppercase; }

.composition-level .lvl-title { font-size: var(--fs-body); font-weight: 700; color: var(--text); margin-bottom: 6px; }

.composition-level .lvl-desc { font-size: var(--fs-small); color: var(--text-secondary); margin-bottom: 12px; line-height: 1.6; }

.composition-level .lvl-modules { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }

.composition-level .lvl-mod { padding: 10px 8px 8px; background: var(--bg-elev); border-radius: 8px; text-align: center; color: var(--text); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 52px; }

.composition-level .lvl-mod-cn { font-size: var(--fs-small); font-weight: 600; line-height: 1.3; color: var(--text); }

.composition-level .lvl-mod-en { font-size: var(--fs-micro); font-weight: 500; color: var(--text-muted); letter-spacing: 0.4px; line-height: 1.2; }

/* ===== 七类十八大痛点（v2.5 重构）
   设计目标：每张痛点卡片用「顶部色条 + 类别徽章 + 主题色图标」三件套
   锁定 7 类分类，让扫读时一眼分辨痛点归属。
   - 顶部 3px 色条：颜色由 data-cat="1..7" 映射 --cat-color-N
   - 类别徽章 .pain-cat-badge：色点 + 图标 + 类别名（同色系）
   - 痛点自身小图标 .pi-icon 仍保留（用所属类别色加深语义）
   - hover 时边框变类别色 + 顶部色条加宽到 4px（动效反馈） */
.pain-solution-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }

/* 卡片基础：position:relative 让 ::before 顶部色条定位 */
.pain-item {
  position: relative;
  padding: 18px 16px 16px;       /* 上 padding 留出顶部色条空间 */
  background: var(--card-bg);
  border-radius: 10px;
  border: 1px solid var(--card-border);
  overflow: hidden;              /* 顶部色条裁切 */
  transition: border-color 0.24s ease;
}
/* 顶部 3px 类别色条 */
.pain-item::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--cat-color);
  transition: height 0.24s cubic-bezier(0.16, 1, 0.3, 1);
}
/* hover：边色变类别色 + 顶部色条加粗 */
.pain-item:hover {
  border-color: var(--cat-border);
}
.pain-item:hover::before {
  height: 4px;
}

/* 类别徽章：色点 + 类别图标 + 类别名 */
.pain-item .pain-cat-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-caption);
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--cat-color);
  padding: 3px 8px 3px 6px;
  background: var(--cat-soft);
  border-radius: 4px;
  margin-bottom: 8px;
}
.pain-item .pain-cat-badge .pcb-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--cat-color);
  flex-shrink: 0;
}
.pain-item .pain-cat-badge .pcb-icon {
  width: 12px; height: 12px;
  flex-shrink: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pain-item h4 { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin: 6px 0 6px; display: flex; align-items: center; gap: 6px; }

.pain-item h4 .pi-icon { width: 18px; height: 18px; color: var(--cat-color); }

.pain-item p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.6; }

/* ===== 七类色映射（data-cat="1..7" 绑 token） ===== */
.pain-item[data-cat="1"] { --cat-color: var(--cat-color-1); --cat-soft: var(--cat-soft-1); --cat-border: var(--cat-border-1); }
.pain-item[data-cat="2"] { --cat-color: var(--cat-color-2); --cat-soft: var(--cat-soft-2); --cat-border: var(--cat-border-2); }
.pain-item[data-cat="3"] { --cat-color: var(--cat-color-3); --cat-soft: var(--cat-soft-3); --cat-border: var(--cat-border-3); }
.pain-item[data-cat="4"] { --cat-color: var(--cat-color-4); --cat-soft: var(--cat-soft-4); --cat-border: var(--cat-border-4); }
.pain-item[data-cat="5"] { --cat-color: var(--cat-color-5); --cat-soft: var(--cat-soft-5); --cat-border: var(--cat-border-5); }
.pain-item[data-cat="6"] { --cat-color: var(--cat-color-6); --cat-soft: var(--cat-soft-6); --cat-border: var(--cat-border-6); }
.pain-item[data-cat="7"] { --cat-color: var(--cat-color-7); --cat-soft: var(--cat-soft-7); --cat-border: var(--cat-border-7); }

/* ===== 七类全貌图（v2.5 新增）
   section-header 下方，pain-solution-grid 上方
   7 个胶囊横排，每胶囊 = 色点 + 类别名 + 痛点数 + 类别图标
   视觉锚点：让用户一眼看到「七类分布 + 哪类最多」 */
.pain-cat-overview {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  margin: 0 0 24px;
  padding: 14px;
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.pain-cat-overview .pco-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 4px;
  border-radius: 8px;
  background: var(--cat-soft);
  transition: transform 0.2s ease, background 0.2s ease;
  cursor: default;
}
.pain-cat-overview .pco-item:hover {
  transform: translateY(-2px);
  background: var(--cat-border);
}
.pain-cat-overview .pco-head {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--cat-color);
  font-size: var(--fs-caption);
  font-weight: 700;
  letter-spacing: 0.5px;
}
.pain-cat-overview .pco-head .pco-icon {
  width: 14px; height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.pain-cat-overview .pco-count {
  font-size: var(--fs-h3);
  font-weight: 800;
  color: var(--cat-color);
  line-height: 1;
  font-family: var(--font-mono);
}
/* 七类色映射（与卡片共享 token） */
.pain-cat-overview .pco-item[data-cat="1"] { --cat-color: var(--cat-color-1); --cat-soft: var(--cat-soft-1); --cat-border: var(--cat-border-1); }
.pain-cat-overview .pco-item[data-cat="2"] { --cat-color: var(--cat-color-2); --cat-soft: var(--cat-soft-2); --cat-border: var(--cat-border-2); }
.pain-cat-overview .pco-item[data-cat="3"] { --cat-color: var(--cat-color-3); --cat-soft: var(--cat-soft-3); --cat-border: var(--cat-border-3); }
.pain-cat-overview .pco-item[data-cat="4"] { --cat-color: var(--cat-color-4); --cat-soft: var(--cat-soft-4); --cat-border: var(--cat-border-4); }
.pain-cat-overview .pco-item[data-cat="5"] { --cat-color: var(--cat-color-5); --cat-soft: var(--cat-soft-5); --cat-border: var(--cat-border-5); }
.pain-cat-overview .pco-item[data-cat="6"] { --cat-color: var(--cat-color-6); --cat-soft: var(--cat-soft-6); --cat-border: var(--cat-border-6); }
.pain-cat-overview .pco-item[data-cat="7"] { --cat-color: var(--cat-color-7); --cat-soft: var(--cat-soft-7); --cat-border: var(--cat-border-7); }

.modules-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }

.module-item { padding: 16px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; transition: all 0.3s; display: flex; gap: 12px; align-items: flex-start; }

.module-item:hover { border-color: var(--emphasis); }

.module-item .m-icon { width: 32px; height: 32px; border-radius: 8px; background: var(--halo-bg); color: var(--emphasis); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.module-item .m-body { flex: 1; }

.module-item .m-name { margin-bottom: 4px; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }

.module-item .m-name-cn { font-size: var(--fs-small); font-weight: 700; color: var(--text); }

.module-item .m-name-en { font-size: var(--fs-caption); font-weight: 500; color: var(--text-muted); letter-spacing: 0.4px; }

.module-item .m-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.5; }

.deployment-table { width: 100%; border-collapse: collapse; margin-top: 20px; background: var(--card-bg); border-radius: 12px; overflow: hidden; }

.deployment-table th, .deployment-table td { padding: 14px 16px; text-align: left; font-size: var(--fs-small); border-bottom: 1px solid var(--border); }

.deployment-table thead th { background: var(--halo-bg); color: var(--text); font-weight: 700; font-size: var(--fs-caption); letter-spacing: 1px; }

.deployment-table tbody tr:last-child td { border-bottom: none; }

.deployment-table .recommended { color: var(--accent2); font-weight: 700; }

.toolset-section { max-width: 1280px; margin: 0 auto; padding: 64px 24px; }

.toolset-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }

.tool-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 28px 24px; transition: all 0.3s; position: relative; overflow: hidden; }

.tool-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--tool-color); }

.tool-card:hover { border-color: var(--tool-color); transform: translateY(-2px); }

.tool-card .tool-icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; color: var(--tool-color); background: rgba(255,255,255,0.04); border: 1px solid var(--border); }

.tool-card h4 { font-size: var(--fs-h4); font-weight: 700; color: var(--text); margin-bottom: 4px; }

.tool-card .tool-en { font-size: var(--fs-caption); color: var(--text-muted); letter-spacing: 1px; margin-bottom: 12px; }

.tool-card .tool-slogan { font-size: var(--fs-small); color: var(--tool-color); font-style: italic; margin-bottom: 12px; }

.tool-card .tool-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.7; margin-bottom: 16px; }

.tool-card .tool-features { list-style: none; padding: 0; margin: 0 0 16px 0; }

.tool-card .tool-features li { font-size: var(--fs-small); color: var(--text-secondary); padding: 6px 0 6px 22px; position: relative; border-bottom: 1px dashed var(--border); }

.tool-card .tool-features li:last-child { border-bottom: none; }

.tool-card .tool-features li::before { content: ''; position: absolute; left: 0; top: 8px; width: 14px; height: 14px; background-color: var(--tool-color); -webkit-mask: url('images/icons/check.svg') center/contain no-repeat; mask: url('images/icons/check.svg') center/contain no-repeat; }

.tool-card.research { --tool-color: #10B981; }

.tool-card.dev { --tool-color: #00D4FF; }

.tool-card.video { --tool-color: #FFB400; }

.tool-card.open { --tool-color: #8B5CF6; }

.biz-model-table { width: 100%; border-collapse: collapse; background: var(--card-bg); border-radius: 12px; overflow: hidden; margin-top: 20px; }

.biz-model-table th, .biz-model-table td { padding: 14px 18px; text-align: left; font-size: var(--fs-small); border-bottom: 1px solid var(--border); }

.biz-model-table thead th { background: var(--halo-bg); color: var(--text); font-weight: 700; font-size: var(--fs-caption); letter-spacing: 1px; }

.biz-model-table tbody tr:last-child td { border-bottom: none; }

.customer-grid { margin-top: 20px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }

.customer-item { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; padding: 18px; display: flex; gap: 12px; align-items: flex-start; }

.customer-item .c-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--halo-bg); color: var(--emphasis); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.customer-item .c-body { flex: 1; }

.customer-item .c-name { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 4px; }

.customer-item .c-desc { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.5; }

.cta-section { max-width: 1280px; margin: 0 auto; padding: 48px 24px; text-align: center; }

.cta-box { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 40px 32px; }

.cta-box h3 { font-size: var(--fs-h3); font-weight: 700; color: var(--text); margin-bottom: 10px; }

.cta-box p { color: var(--text-secondary); margin-bottom: 20px; font-size: var(--fs-small); }

.sibling-nav { max-width: 1280px; margin: 0 auto; padding: 32px 24px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.sibling-card { display: flex; align-items: center; gap: 12px; padding: 16px 20px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 12px; text-decoration: none; color: var(--text); transition: all 0.3s; }

.sibling-card:hover { border-color: var(--primary); transform: translateX(2px); }

.sibling-card .sib-icon { width: 36px; height: 36px; border-radius: 10px; background: var(--halo-border); color: var(--emphasis); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.sibling-card.alt .sib-icon { background: var(--halo-border); color: var(--primary); }

.sibling-card .sib-content { flex: 1; }

.sibling-card .sib-label { font-size: var(--fs-caption); color: var(--text-muted); letter-spacing: 1px; }

.sibling-card .sib-name { font-size: var(--fs-small); font-weight: 700; color: var(--text); }

.sibling-card .sib-arrow { color: var(--text-muted); font-size: var(--fs-body); }

.ops-hero { padding: 96px 24px 56px; max-width: 1280px; margin: 0 auto; text-align: center; position: relative; }

.ops-hero::before { content: ''; position: absolute; top: -100px; left: 50%; transform: translateX(-50%); width: 1200px; height: 600px; background: radial-gradient(ellipse 60% 50% at center, var(--halo-bg) 0%, transparent 70%); pointer-events: none; z-index: -1; }

.ops-hero .hero-tag { display: inline-block; padding: 6px 16px; background: var(--halo-bg); border: 1px solid var(--halo-border); border-radius: 20px; font-size: var(--fs-small); color: var(--primary); letter-spacing: 1px; margin-bottom: 16px; }

.ops-hero h1 { font-size: var(--fs-subhero); font-weight: 800; line-height: 1.25; margin-bottom: 18px; color: var(--text); }

.ops-hero .hero-desc { font-size: var(--fs-body); color: var(--text-secondary); max-width: 780px; margin: 0 auto; line-height: 1.7; }

.ops-hero .hero-highlight { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 8px 18px; background: var(--halo-bg); border: 1px solid var(--halo-border); border-radius: 20px; font-size: var(--fs-small); color: var(--primary); font-weight: 600; }

.logic-flow { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 32px; }

.logic-flow h3 { font-size: var(--fs-h3); font-weight: 700; color: var(--text); text-align: center; margin-bottom: 10px; }

.logic-flow .logic-sub { text-align: center; color: var(--text-secondary); margin-bottom: 28px; font-size: var(--fs-small); }

.logic-steps { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 14px; align-items: stretch; }

.logic-step { background: var(--bg-elev); border: 1px solid var(--card-border); border-radius: 12px; padding: 20px 16px; text-align: center; }

.logic-step .ls-num { width: 40px; height: 40px; border-radius: 50%; background: var(--primary); color: var(--bg); font-weight: 700; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; font-size: var(--fs-body); }

.logic-step h5 { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 6px; }

.logic-step p { font-size: var(--fs-caption); color: var(--text-secondary); line-height: 1.5; }

.logic-arrow { color: var(--primary); font-size: var(--fs-h3); font-weight: 700; display: flex; align-items: center; justify-content: center; }

.logic-highlight { margin-top: 20px; padding: 18px; background: var(--bg-elev); border: 1px solid var(--card-border); border-radius: 10px; text-align: center; font-size: var(--fs-small); color: var(--text-secondary); }

.logic-highlight strong { color: var(--primary); }

.customer-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 24px; transition: all 0.3s; }

.customer-card:hover { border-color: var(--primary); }

.customer-card .cust-type { display: flex; align-items: center; gap: 10px; font-size: var(--fs-body-lg); font-weight: 700; color: var(--text); margin-bottom: 10px; }

.customer-card .cust-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--halo-bg); color: var(--primary); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.customer-card .cust-scenario { font-size: var(--fs-caption); color: var(--primary); padding: 4px 10px; background: var(--halo-bg); border-radius: 4px; display: inline-block; margin-bottom: 14px; font-weight: 600; }

.customer-card .cust-table { width: 100%; border-collapse: collapse; font-size: var(--fs-small); }

.customer-card .cust-table tr td { padding: 10px 0; vertical-align: top; border-bottom: 1px dashed var(--border); }

.customer-card .cust-table tr:last-child td { border-bottom: none; }

.customer-card .cust-table td:first-child { color: var(--text-muted); width: 90px; font-weight: 600; }

.customer-card .cust-table td:last-child { color: var(--text-secondary); }

.customer-card .cust-table .highlight-val { color: var(--primary); font-weight: 700; }

.deliv-card:hover { border-color: var(--primary); transform: translateY(-2px); box-shadow: 0 8px 24px var(--primary-glow); }

.deliv-card:hover .d-icon { transform: scale(1.08); background: var(--primary); color: var(--text-on-primary); }

.deliv-card .d-body { flex: 1; }

.deliv-card h4 { font-size: var(--fs-small); font-weight: 700; color: var(--text); margin-bottom: 6px; }

.deliv-card p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.6; }

.pricing-mode { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 28px; }

.pricing-mode-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }

.pm-item { padding: 16px 12px; background: var(--bg-elev); border-radius: 10px; text-align: center; }

.pm-item .pm-name { font-size: var(--fs-small); font-weight: 700; color: var(--primary); margin-bottom: 6px; }

.pm-item .pm-type { font-size: var(--fs-caption); color: var(--text-muted); }

.moat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }

.moat-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; padding: 22px; }

.moat-card .moat-num { font-size: var(--fs-caption); font-weight: 700; color: var(--primary); letter-spacing: 1px; margin-bottom: 8px; }

.moat-card h4 { font-size: var(--fs-body); font-weight: 700; color: var(--text); margin-bottom: 8px; }

.moat-card p { font-size: var(--fs-small); color: var(--text-secondary); line-height: 1.6; }

.article-wrap { max-width: 880px; margin: 0 auto; padding: 0 24px 64px; }

.article-wrap.is-wide { max-width: 1040px; }

.article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; color: var(--text-secondary); font-size: var(--fs-small); margin: 32px 0 24px; padding: 14px 0; border-top: 1px solid var(--card-border); border-bottom: 1px solid var(--card-border); }

.article-meta .meta-item { display: inline-flex; align-items: center; gap: 6px; }

.article-meta .meta-item svg { flex-shrink: 0; opacity: 0.8; }

.article-meta .meta-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--text-muted); opacity: 0.55; flex-shrink: 0; }

.article-meta .meta-tag { display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--tag-bg); color: var(--emphasis); font-size: var(--fs-caption); font-weight: 600; letter-spacing: 0.02em; }

.article-hero-img { margin: 24px 0 12px; border-radius: var(--radius-lg); overflow: hidden; background: var(--dark-bg3); }

.article-hero-img img { width: 100%; height: auto; display: block; object-fit: cover; }

.article-hero-caption { text-align: center; font-size: var(--fs-small); color: var(--text-muted); margin-bottom: 32px; font-style: italic; }

.article-toc { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; padding: 14px 20px; margin: 0 0 32px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-md); font-size: var(--fs-small); }

.article-toc-label { font-weight: 700; color: var(--text-primary); margin-right: 4px; letter-spacing: 0.05em; }

.article-toc a { color: var(--text-secondary); text-decoration: none; padding: 4px 10px; border-radius: var(--radius-sm); transition: color 0.2s, background 0.2s; }

.article-toc a:hover { color: var(--emphasis); background: var(--tag-bg); }

.article-body { font-size: var(--fs-body); line-height: 1.85; color: var(--text-primary); }

.article-body > * + * { margin-top: 18px; }

.article-h2 { font-size: var(--fs-h2); font-weight: 700; color: var(--text-primary); margin: 56px 0 20px; line-height: 1.35; scroll-margin-top: 96px; }

.article-h2:first-child { margin-top: 8px; }

.article-h3 { font-size: var(--fs-h3); font-weight: 700; color: var(--text-primary); margin: 40px 0 14px; line-height: 1.4; scroll-margin-top: 96px; }

.article-p { font-size: var(--fs-body); line-height: 1.85; color: var(--text-secondary); }

.article-p strong { color: var(--text-primary); font-weight: 700; }

.article-list { margin: 16px 0 24px; padding-left: 22px; color: var(--text-secondary); line-height: 1.85; }

.article-list li { margin-bottom: 10px; }

.article-list li::marker { color: var(--emphasis); font-weight: 700; }

.article-list strong { color: var(--text-primary); }

.hl-primary { color: var(--emphasis); font-weight: 700; }

.article-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 32px 0; }

.article-stat { padding: 24px 20px; text-align: center; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius-lg); transition: transform 0.25s, border-color 0.25s; }

.article-stat:hover { transform: translateY(-2px); border-color: var(--border-hover); }

.article-stat .stat-num { font-size: var(--fs-h2); font-weight: 700; color: var(--emphasis); line-height: 1.2; margin-bottom: 6px; }

.article-stat .stat-label { font-size: var(--fs-small); color: var(--text-secondary); }

.article-quote { margin: 32px 0; padding: 20px 24px; background: var(--tag-bg); border-left: 4px solid var(--emphasis); border-radius: var(--radius-md); color: var(--text-primary); font-size: var(--fs-body); line-height: 1.8; }

.article-quote strong { color: var(--emphasis); }

.article-quote p + p { margin-top: 14px; }

.article-cta-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 40px 0 8px; padding: 24px 0; border-top: 1px solid var(--card-border); border-bottom: 1px solid var(--card-border); }

.article-related { margin-top: 64px; padding-top: 32px; border-top: 1px solid var(--card-border); }

.article-related .sub-header { margin-bottom: 24px; }

.article-related .card-grid-2 { margin-top: 24px; }

@keyframes pricing-shine  {
0% { background-position: 200% 0; }
100% { background-position: -200% 0; }
}

@keyframes pricing-glow-breathe  {
0%, 100% { opacity: 0.55; transform: scale(1); }
50% { opacity: 1;    transform: scale(1.08); }
}

@keyframes pricing-featured-pulse  {
0%, 100% { box-shadow:
      0 24px 60px -20px rgba(0, 212, 255, 0.35),
      0 0 0 1px rgba(0, 212, 255, 0.25),
      inset 0 1px 0 rgba(255, 255, 255, 0.06); }
50% { box-shadow:
      0 28px 72px -20px rgba(0, 212, 255, 0.55),
      0 0 0 1px rgba(0, 212, 255, 0.40),
      inset 0 1px 0 rgba(255, 255, 255, 0.08); }
}

@media (prefers-reduced-motion: reduce)  {
.pricing-card.featured,
  .pricing-card.featured::before,
  .pricing-card.featured::after { animation: none; }
.pricing-card.featured:hover { transform: translateY(-10px); }
}

@keyframes pricing-tag-pulse  {
0%, 100% { box-shadow:
      0 4px 14px rgba(0, 212, 255, 0.45),
      0 0 0 1px rgba(255, 255, 255, 0.12) inset; }
50% { box-shadow:
      0 6px 22px rgba(0, 212, 255, 0.70),
      0 0 0 1px rgba(255, 255, 255, 0.20) inset; }
}

@media (max-width: 1024px)  {
.card-grid-4 { grid-template-columns: repeat(2, 1fr); }
.process-steps { grid-template-columns: repeat(2, 1fr); }
.process-steps::before { display: none; }
.pricing-grid { grid-template-columns: 1fr; max-width: 400px; margin: 0 auto; }
.pricing-grid-4 { grid-template-columns: repeat(2, 1fr); }
.pricing-grid-4 .pricing-card.featured { transform: none; }
.pricing-note-grid { grid-template-columns: repeat(2, 1fr); }
.news-list-card { flex-direction: column; }
.news-list-card .news-thumb {
  width: 100%;
  min-width: 0;
  /* 移动端头图：aspect-ratio 锁住比例，绝不等比拉伸；
     整图最多占 viewport 一半高，避免在小屏吞掉正文 */
  aspect-ratio: 16 / 10;
  max-height: 240px;
  height: auto;
}
.arch-layer .layer-items { grid-template-columns: 1fr; }
}

/* 极窄屏：news-thumb 高度再小一点，给正文留空间 */
@media (max-width: 480px) {
  .news-list-card .news-thumb { aspect-ratio: 16 / 9; max-height: 200px; }
  .news-list-card .news-body { padding: 18px 18px; }
}

@media (max-width: 768px)  {
.sub-banner { padding: 120px 0 60px; }
.sub-content { padding: 56px 0; }
.card-grid-2 { grid-template-columns: 1fr; }
.card-grid-3 { grid-template-columns: 1fr; }
.card-grid-4 { grid-template-columns: 1fr; }
.process-steps { grid-template-columns: 1fr; gap: 32px; }
.sub-cta { padding: 56px 0; }
.detail-case .case-results { flex-direction: column; gap: 16px; }
.pay-qr-block { flex-direction: column; text-align: center; padding: 24px; gap: 20px; }
.pay-qr-card { width: 160px; height: 160px; }
.pay-qr-info { text-align: center; }
.pricing-grid-4 { grid-template-columns: 1fr; }
.pricing-note-grid { grid-template-columns: 1fr; }
.pricing-note { padding: 22px 18px; }
}

@media (max-width: 768px)  {
.sub-form { padding: 20px; }
.sub-form .form-row { grid-template-columns: 1fr; gap: 0; }
.data-table thead,
  .compare-table thead { display: none; }
.data-table,
  .data-table tbody,
  .data-table tr,
  .data-table td,
  .compare-table,
  .compare-table tbody,
  .compare-table tr,
  .compare-table td { display: block;
    width: 100%;
    box-sizing: border-box; }
.data-table tr,
  .compare-table tr { margin-bottom: 12px;
    padding: 12px 14px;
    border: 1px solid var(--card-border, #e5e7eb);
    border-radius: var(--radius-md, 8px);
    background: var(--card-bg, #fff); }
.data-table td,
  .compare-table td { padding: 6px 0;
    border: none;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: baseline;
    text-align: right; }
.data-table td::before,
  .compare-table td::before { content: attr(data-label);
    font-weight: 600;
    color: var(--text-secondary, #6b7280);
    text-align: left;
    flex-shrink: 0; }
}

@media (max-width: 768px)  {
.partner-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px)  {
.sub-banner { padding: 96px 0 40px; }
.sub-banner h1 { font-size: var(--fs-subsection); }
.sub-banner .sub-desc { font-size: var(--fs-small); }
.sub-banner .breadcrumb { font-size: var(--fs-small); }
.sub-content { padding: 48px 0; }
.sub-cta { padding: 48px 0; }
.sub-cta h2 { font-size: var(--fs-h3); }
.sub-header { margin-bottom: 32px; }
.sub-header .section-title { font-size: var(--fs-h3); }
.pay-qr-block { padding: 20px; }
.pay-qr-card { width: 140px; height: 140px; }
.compare-table { font-size: var(--fs-body); }
.compare-table th,
  .compare-table td { padding: 10px 12px; }
.pain-cat-overview { grid-template-columns: repeat(2, 1fr); gap: 6px; }
.partner-grid { grid-template-columns: 1fr; }
.pricing-card { padding: 24px 18px; }
.pricing-card .price-name { font-size: var(--fs-h4); }
.pricing-card .price-val { font-size: var(--fs-h2); }
.info-card { padding: 20px; }
.info-card h3 { font-size: var(--fs-body); }
.info-card li { font-size: var(--fs-body); }
}

@media (max-width: 360px)  {
.sub-banner h1 { font-size: var(--fs-h3); }
.compare-table th,
  .compare-table td { padding: 8px 8px; font-size: var(--fs-small); }
}

@media (max-width: 768px)  {
.api-track-grid { grid-template-columns: 1fr; }
.compliance-grid { grid-template-columns: 1fr; }
.relation-diagram { grid-template-columns: 1fr; }
.service-line .line-grid { grid-template-columns: 1fr; }
.deliv-grid { grid-template-columns: repeat(2, 1fr); }
.pain-solution-grid { grid-template-columns: 1fr; }
.pain-cat-overview { grid-template-columns: repeat(2, 1fr); padding: 10px; }
.pain-cat-overview .pco-count { font-size: var(--fs-h4); }
.toolset-grid { grid-template-columns: 1fr; }
.sibling-nav { grid-template-columns: 1fr; }
.customer-grid { grid-template-columns: 1fr; }
.moat-grid { grid-template-columns: 1fr; }
.sibling-nav { grid-template-columns: 1fr; }
}

@media (max-width: 900px)  {
.value-grid { grid-template-columns: repeat(2, 1fr); }
.model-categories { grid-template-columns: repeat(2, 1fr); }
.pricing-grid { grid-template-columns: repeat(2, 1fr); }
.industry-grid { grid-template-columns: repeat(2, 1fr); }
.method-flow { grid-template-columns: 1fr 1fr; }
.method-arrow { display: none; }
.key-metrics { grid-template-columns: repeat(3, 1fr); }
.dual-track-grid { grid-template-columns: 1fr; }
.capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.value-strip { grid-template-columns: repeat(2, 1fr); }
.composition-level .lvl-modules { grid-template-columns: repeat(3, 1fr); }
.modules-grid { grid-template-columns: repeat(2, 1fr); }
.customer-grid { grid-template-columns: repeat(2, 1fr); }
.key-metrics { grid-template-columns: repeat(2, 1fr); }
.logic-steps { grid-template-columns: 1fr; }
.logic-steps .logic-arrow { transform: rotate(90deg); margin: 8px auto; }
.deliv-grid { grid-template-columns: repeat(2, 1fr); }
.pricing-mode-grid { grid-template-columns: repeat(3, 1fr); }
}

/* 1024–768（iPad 横屏 + 大手机横屏）：缩小 grid 列数，避免 4/5 列挤压 */
@media (max-width: 1024px) and (min-width: 769px) {
  .value-strip { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .composition-level .lvl-modules { grid-template-columns: repeat(3, 1fr); }
  .api-track-grid { grid-template-columns: 1fr 1fr; }
  .compliance-grid { grid-template-columns: repeat(2, 1fr); }
  .toolset-grid { grid-template-columns: 1fr; }
  .pain-solution-grid { grid-template-columns: 1fr 1fr; }
  .customer-grid { grid-template-columns: 1fr 1fr; }
  .modules-grid { grid-template-columns: repeat(3, 1fr); }
  .key-metrics { grid-template-columns: repeat(3, 1fr); }
  .deliv-grid { grid-template-columns: repeat(2, 1fr); }
  .sibling-nav { grid-template-columns: 1fr 1fr; }
  .dual-track-grid { grid-template-columns: 1fr 1fr; }
  .moat-grid { grid-template-columns: 1fr 1fr; }
  .capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-mode-grid { grid-template-columns: repeat(2, 1fr); }
  .relation-diagram { grid-template-columns: 1fr 1fr; }
  .lvl-mod { min-height: 60px; padding: 10px 6px; }
  .lvl-mod-cn { font-size: var(--fs-caption); }
}

/* 极窄屏 ≤360：lvl-mod 不再 2 列（"5 列"模块在小屏纵向堆叠更整齐） */
@media (max-width: 360px) {
  .composition-level .lvl-modules { grid-template-columns: repeat(2, 1fr); }
  .lvl-mod { min-height: 56px; padding: 8px 4px; }
  .lvl-mod-cn { font-size: var(--fs-caption); }
  .lvl-mod-en { font-size: var(--fs-micro); }
}

/* 移动端：advisory 4 条服务线卡片 — 缩小 line-num + line-icon，让标题 h3 自然换行而不被裁 */
@media (max-width: 767px) {
  .service-line { padding: 20px 18px; }
  .service-line .line-header { gap: 8px; }
  .service-line .line-num { font-size: var(--fs-h3); line-height: 1; }
  .service-line .line-icon { width: 32px; height: 32px; }
  .service-line h3 {
    font-size: var(--fs-body);
    line-height: 1.3;
    /* 标题文字用 normal wrap（6-8 个汉字一行容纳），与 num/icon/tag 同排 */
  }
  .service-line .line-tag { padding: 3px 8px; font-size: var(--fs-micro); letter-spacing: 0.5px; flex-shrink: 0; }
  .service-line .line-grid { gap: 10px; }
  .service-line .line-item { padding: 10px 12px; }
  .service-line .line-item-text { font-size: var(--fs-small); line-height: 1.5; }
}

/* 移动端：deployment-table / biz-model-table — 表格 → 卡片布局（解决 5 列挤压变形） */
@media (max-width: 767px) {
  .deployment-table thead,
  .biz-model-table thead { display: none; }
  .deployment-table,
  .deployment-table tbody,
  .deployment-table tr,
  .deployment-table td,
  .biz-model-table,
  .biz-model-table tbody,
  .biz-model-table tr,
  .biz-model-table td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .deployment-table,
  .biz-model-table { border-radius: 12px; }
  .deployment-table tr,
  .biz-model-table tr {
    margin-bottom: 12px;
    padding: 14px 16px;
    border: 1px solid var(--card-border);
    border-radius: 10px;
    background: var(--card-bg);
  }
  .deployment-table tr:last-child,
  .biz-model-table tr:last-child { margin-bottom: 0; }
  .deployment-table td,
  .biz-model-table td {
    padding: 6px 0;
    border: none;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: baseline;
    text-align: right;
  }
  /* 关键：data-cfg-attr 模式，列名通过 td 的 data-label 在 JS 中注入；这里手动用 ::before 模式 */
  /* 因为这两类表没有 data-label，需要用 CSS 计数器 / 兄弟选择器，
     简单方案：JS 渲染时加 data-label。生产改造在 HTML/CSS 双端。 */
  .deployment-table td::before,
  .biz-model-table td::before {
    content: attr(data-label);
    font-weight: 600;
    color: var(--text-secondary);
    text-align: left;
    flex-shrink: 0;
  }
  /* 移动端：网格 grid 容器统一 minmax(0, 1fr) + 居中，避免子元素 min-width 撑爆 */
  .composition-level .lvl-modules,
  .lvl-modules { grid-template-columns: minmax(0, 1fr); }
  .composition-flow { padding: 20px 18px; }
}

/* 表格在 ≤767 缺少 data-label 的临时方案：使用 CSS 计数器显示列序号（部署模式/适用规模/...） */
@media (max-width: 767px) {
  /* 通用解决方案：把 thead 内容保存到 CSS 变量，::before 用变量名显示 */
  /* 这里不重新实现，HTML 渲染时由 core.js 给 td 加 data-label */
  /* 兜底：使用第一列的 "•" 表示 */
  .deployment-table td:first-child::before { content: "▸ "; color: var(--emphasis); font-weight: 700; }
  .biz-model-table td:first-child::before { content: "▸ "; color: var(--emphasis); font-weight: 700; }
  .deployment-table td:first-child,
  .biz-model-table td:first-child {
    font-weight: 700;
    color: var(--text);
    border-bottom: 1px solid var(--border);
    padding-bottom: 8px;
    margin-bottom: 4px;
    text-align: left;
  }
}

@media (max-width: 500px)  {
.value-grid { grid-template-columns: 1fr; }
.pricing-grid { grid-template-columns: 1fr; }
.industry-grid { grid-template-columns: 1fr; }
.key-metrics { grid-template-columns: repeat(2, 1fr); }
.value-strip { grid-template-columns: 1fr; }
.composition-level .lvl-modules { grid-template-columns: repeat(2, 1fr); }
.modules-grid { grid-template-columns: 1fr; }
.customer-grid { grid-template-columns: 1fr; }
.deliv-grid { grid-template-columns: repeat(2, 1fr); }
.pricing-mode-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1100px)  {
.model-categories { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px)  {
.model-categories { grid-template-columns: 1fr; }
}

@keyframes toastOverseasIn  {
from { opacity: 0; transform: translateX(-50%) translateY(12px); }
to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

@media (max-width: 600px)  {
.contact-form { grid-template-columns: 1fr; }
.contact-form { grid-template-columns: 1fr; }
.contact-form { grid-template-columns: 1fr; }
.contact-form { grid-template-columns: 1fr; }
.contact-form { grid-template-columns: 1fr; }
}

@media (max-width: 768px)  {
.article-stat-grid { grid-template-columns: repeat(2, 1fr);
    gap: 12px; }
.article-h2 { font-size: var(--fs-h3); margin-top: 40px; }
.article-h3 { font-size: var(--fs-h4); margin-top: 32px; }
.article-hero-img { margin: 20px 0 8px; }
}

@media (max-width: 480px)  {
.article-stat-grid { grid-template-columns: 1fr; }
.article-meta { gap: 8px 10px; }
.article-toc { padding: 12px 14px; }
}

/* .yz-tip 样式已移至 style.css（统一全站可用），本文件无需重复声明 */