/* ===== 移动AI保险顾问·保小通 项目网站 ===== */
:root {
  --blue: #0E6FBB;
  --blue-dark: #0A5590;
  --blue-light: #EAF3FB;
  --orange: #FF7D00;
  --orange-light: #FFF3E6;
  --dark: #0F172A;
  --gray: #475569;
  --gray-light: #94A3B8;
  --white: #FFFFFF;
  --bg: #F8FAFC;
  --radius: 16px;
  --shadow: 0 4px 24px rgba(14,111,187,0.10);
  --max-w: 1200px;
  --font: "Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font);color:var(--dark);background:var(--bg);line-height:1.7;overflow-x:hidden}
a{color:var(--blue);text-decoration:none}
img,svg{max-width:100%;display:block}

/* ===== 导航 ===== */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(255,255,255,0.95);backdrop-filter:blur(12px);border-bottom:1px solid rgba(14,111,187,0.12);transition:box-shadow .3s}
.nav.scrolled{box-shadow:0 2px 16px rgba(14,111,187,0.10)}
.nav-inner{max-width:var(--max-w);margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between}
.nav-brand{display:flex;align-items:center;gap:10px;font-weight:bold;font-size:18px;color:var(--dark)}
.nav-brand .dot{width:10px;height:10px;border-radius:50%;background:var(--orange)}
.nav-links{display:flex;gap:4px;list-style:none}
.nav-links a{display:block;padding:8px 14px;border-radius:8px;font-size:14px;color:var(--gray);transition:all .2s;white-space:nowrap}
.nav-links a:hover,.nav-links a.active{color:var(--blue);background:var(--blue-light)}
.nav-toggle{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--dark)}

/* ===== 通用 ===== */
section{padding:80px 24px}
.container{max-width:var(--max-w);margin:0 auto}
.section-tag{display:inline-block;font-size:13px;font-weight:bold;color:var(--orange);letter-spacing:2px;text-transform:uppercase;margin-bottom:8px}
.section-title{font-size:32px;font-weight:bold;color:var(--dark);line-height:1.3;margin-bottom:12px}
.section-sub{font-size:16px;color:var(--gray);margin-bottom:40px;max-width:680px}
.center{text-align:center}
.center .section-sub{margin-left:auto;margin-right:auto}

/* ===== Hero ===== */
.hero{min-height:100vh;display:flex;align-items:center;background:linear-gradient(135deg,#0A5590 0%,#0E6FBB 60%,#1488CC 100%);color:#fff;position:relative;overflow:hidden;padding-top:64px}
.hero::before{content:"";position:absolute;right:-10%;top:-10%;width:500px;height:500px;border-radius:50%;border:2px solid rgba(255,255,255,0.08)}
.hero::after{content:"";position:absolute;left:-5%;bottom:-10%;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,0.04)}
.hero-inner{max-width:var(--max-w);margin:0 auto;width:100%;position:relative;z-index:2}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:20px;background:rgba(255,255,255,0.12);font-size:14px;margin-bottom:24px}
.hero h1{font-size:clamp(36px,5vw,60px);font-weight:bold;line-height:1.2;margin-bottom:16px}
.hero h1 .accent{color:var(--orange)}
.hero .lead{font-size:clamp(16px,2vw,20px);opacity:0.85;max-width:560px;margin-bottom:32px;line-height:1.6}
.hero-stats{display:flex;gap:40px;flex-wrap:wrap;margin-top:40px}
.hero-stat .num{font-size:36px;font-weight:bold;color:var(--orange);line-height:1}
.hero-stat .label{font-size:14px;opacity:0.75;margin-top:4px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;margin-top:36px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;border-radius:10px;font-size:15px;font-weight:bold;transition:all .2s;cursor:pointer;border:none}
.btn-primary{background:var(--orange);color:#fff}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(255,125,0,0.35)}
.btn-ghost{background:rgba(255,255,255,0.12);color:#fff;border:1.5px solid rgba(255,255,255,0.3)}
.btn-ghost:hover{background:rgba(255,255,255,0.2)}

/* ===== 卡片网格 ===== */
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);transition:transform .2s}
.card:hover{transform:translateY(-4px)}
.card-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px}
.card-icon.blue{background:var(--blue-light);color:var(--blue)}
.card-icon.orange{background:var(--orange-light);color:var(--orange)}
.card h3{font-size:20px;font-weight:bold;margin-bottom:8px}
.card p{font-size:15px;color:var(--gray);line-height:1.6}
.card .highlight{color:var(--blue);font-weight:bold}

/* ===== 数据卡 ===== */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:32px 0}
.stat-box{background:#fff;border-radius:var(--radius);padding:24px;text-align:center;box-shadow:var(--shadow)}
.stat-box .big{font-size:40px;font-weight:bold;color:var(--blue);line-height:1}
.stat-box .big.orange{color:var(--orange)}
.stat-box .desc{font-size:14px;color:var(--gray);margin-top:8px}

/* ===== 表格 ===== */
.tbl-wrap{overflow-x:auto;border-radius:var(--radius);box-shadow:var(--shadow);margin:24px 0}
table{width:100%;border-collapse:collapse;background:#fff;font-size:15px}
th{background:var(--blue);color:#fff;padding:14px 16px;text-align:left;font-weight:bold;white-space:nowrap}
td{padding:14px 16px;border-bottom:1px solid #E2E8F0;color:var(--gray)}
tr:nth-child(even) td{background:#F8FAFC}
td.bold{color:var(--dark);font-weight:bold}
td.warn{color:var(--orange);font-weight:bold}

/* ===== 流程图 ===== */
.flow{display:flex;flex-direction:column;gap:16px;max-width:640px;margin:0 auto}
.flow-node{background:#fff;border-radius:12px;padding:18px 24px;box-shadow:var(--shadow);position:relative;border-left:4px solid var(--blue)}
.flow-node.accent{border-left-color:var(--orange)}
.flow-node.dark{background:var(--dark);color:#fff;border-left-color:var(--orange)}
.flow-node .step{font-size:13px;color:var(--gray-light);font-weight:bold;margin-bottom:4px}
.flow-node.dark .step{color:rgba(255,255,255,0.6)}
.flow-node .title{font-size:17px;font-weight:bold}
.flow-node .desc{font-size:14px;color:var(--gray);margin-top:4px}
.flow-node.dark .desc{color:rgba(255,255,255,0.75)}
.flow-arrow{text-align:center;color:var(--gray-light);font-size:20px}

/* ===== 时间轴 ===== */
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;position:relative}
.timeline::before{content:"";position:absolute;top:32px;left:5%;right:5%;height:3px;background:var(--blue);border-radius:2px}
.tl-item{position:relative}
.tl-dot{width:20px;height:20px;border-radius:50%;background:var(--orange);margin:22px auto 16px;position:relative;z-index:2;border:3px solid #fff;box-shadow:0 0 0 3px var(--orange)}
.tl-item:not(:first-child) .tl-dot{background:var(--blue);box-shadow:0 0 0 3px var(--blue)}
.tl-card{background:#fff;border-radius:12px;padding:20px;box-shadow:var(--shadow);text-align:center}
.tl-card.active{border:2px solid var(--orange)}
.tl-card h4{font-size:17px;font-weight:bold;margin-bottom:4px}
.tl-card .phase{font-size:13px;color:var(--orange);font-weight:bold;margin-bottom:8px}
.tl-card ul{list-style:none;text-align:left;font-size:13px;color:var(--gray)}
.tl-card li{padding:3px 0}
.tl-card li::before{content:"▪ ";color:var(--blue)}

/* ===== 合规对照 ===== */
.compliance-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}
.comp-col{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.comp-col h3{padding:16px 20px;color:#fff;font-size:18px}
.comp-col.give h3{background:var(--blue)}
.comp-col.notgive h3{background:var(--orange)}
.comp-col ul{list-style:none;background:#fff;padding:8px 0}
.comp-col li{padding:12px 20px;font-size:15px;border-bottom:1px solid #F1F5F9}
.comp-col li:last-child{border-bottom:none}
.comp-col.give li::before{content:"✓ ";color:var(--blue);font-weight:bold}
.comp-col.notgive li::before{content:"✗ ";color:var(--orange);font-weight:bold}

/* ===== ROI ===== */
.roi-hero{background:linear-gradient(135deg,#0A5590,#0E6FBB);border-radius:var(--radius);padding:48px;text-align:center;color:#fff;margin-bottom:32px}
.roi-hero .mega{font-size:72px;font-weight:bold;color:var(--orange);line-height:1}
.roi-hero .mega-label{font-size:16px;opacity:0.8;margin-top:8px}
.roi-hero .formula{font-size:15px;opacity:0.85;margin-top:20px;padding:12px 20px;background:rgba(255,255,255,0.1);border-radius:10px;display:inline-block}

/* ===== 架构图 ===== */
.arch-box{background:#fff;border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}
.arch-svg{width:100%;height:auto}

/* ===== Footer ===== */
footer{background:var(--dark);color:rgba(255,255,255,0.7);padding:48px 24px;text-align:center}
footer .foot-brand{font-size:18px;font-weight:bold;color:#fff;margin-bottom:8px}
footer p{font-size:14px;margin:4px 0}

/* ===== 响应式 ===== */
@media(max-width:900px){
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .stat-row{grid-template-columns:repeat(2,1fr)}
  .timeline{grid-template-columns:repeat(2,1fr);gap:16px}
  .timeline::before{display:none}
  .compliance-grid{grid-template-columns:1fr}
}
@media(max-width:680px){
  section{padding:56px 16px}
  .section-title{font-size:24px}
  .nav-links{display:none;position:fixed;top:64px;left:0;right:0;background:#fff;flex-direction:column;padding:16px;box-shadow:0 8px 24px rgba(0,0,0,0.1);gap:0}
  .nav-links.open{display:flex}
  .nav-links a{padding:14px 16px;border-radius:0;border-bottom:1px solid #F1F5F9}
  .nav-toggle{display:block}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .stat-row{grid-template-columns:1fr 1fr}
  .timeline{grid-template-columns:1fr}
  .hero-stats{gap:24px}
  .roi-hero .mega{font-size:52px}
  .roi-hero{padding:32px 20px}
}

/* ===== 文档中心 ===== */
.docs-hero{background:linear-gradient(135deg,#0A5590,#0E6FBB);color:#fff;padding:120px 24px 64px;text-align:center}
.docs-hero h1{font-size:36px;font-weight:bold;margin-bottom:12px}
.docs-hero p{font-size:16px;opacity:0.85;max-width:600px;margin:0 auto}
.docs-section{padding:48px 24px;max-width:var(--max-w);margin:0 auto}
.filter-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:32px}
.filter-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.chip{padding:8px 16px;border-radius:20px;font-size:14px;cursor:pointer;border:1.5px solid #E2E8F0;background:#fff;color:var(--gray);transition:all .2s;white-space:nowrap}
.chip:hover{border-color:var(--blue);color:var(--blue)}
.chip.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.search-box{padding:10px 16px;border-radius:10px;border:1.5px solid #E2E8F0;font-size:14px;width:240px;outline:none;transition:border .2s}
.search-box:focus{border-color:var(--blue)}
.doc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.doc-card{background:#fff;border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);transition:all .2s;display:flex;flex-direction:column;border-top:4px solid var(--blue)}
.doc-card:hover{transform:translateY(-4px);box-shadow:0 8px 32px rgba(14,111,187,0.15)}
.doc-card.cat-需求{border-top-color:#FF7D00}
.doc-card.cat-架构{border-top-color:#0E6FBB}
.doc-card.cat-辅助{border-top-color:#94A3B8}
.doc-card.cat-课程{border-top-color:#0A5590}
.doc-card-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.doc-type{font-size:12px;font-weight:bold;padding:3px 10px;border-radius:6px;background:var(--blue-light);color:var(--blue)}
.doc-version{font-size:12px;padding:3px 10px;border-radius:6px;background:var(--orange-light);color:var(--orange);font-weight:bold}
.doc-card h3{font-size:17px;font-weight:bold;margin-bottom:8px;line-height:1.4}
.doc-card .desc{font-size:14px;color:var(--gray);line-height:1.6;flex:1;margin-bottom:16px}
.doc-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.doc-tag{font-size:12px;padding:2px 8px;border-radius:4px;background:#F1F5F9;color:var(--gray)}
.doc-meta{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--gray-light);margin-bottom:12px}
.doc-actions{display:flex;gap:8px}
.doc-btn{flex:1;padding:8px 12px;border-radius:8px;font-size:13px;font-weight:bold;text-align:center;cursor:pointer;border:none;transition:all .2s}
.doc-btn.preview{background:var(--blue);color:#fff}
.doc-btn.preview:hover{background:var(--blue-dark)}
.doc-btn.download{background:var(--blue-light);color:var(--blue)}
.doc-btn.download:hover{background:#D6E9F5}
.no-results{text-align:center;padding:48px;color:var(--gray-light);font-size:16px}
/* 预览模态 */
.preview-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(15,23,42,0.6);z-index:200;display:none;backdrop-filter:blur(4px)}
.preview-overlay.open{display:flex;justify-content:center;align-items:flex-start;padding:40px 20px;overflow-y:auto}
.preview-modal{background:#fff;border-radius:var(--radius);max-width:900px;width:100%;margin:auto;box-shadow:0 24px 64px rgba(0,0,0,0.25)}
.preview-head{display:flex;justify-content:space-between;align-items:center;padding:20px 28px;border-bottom:1px solid #E2E8F0;position:sticky;top:0;background:#fff;border-radius:var(--radius) var(--radius) 0 0;z-index:5}
.preview-head h3{font-size:18px;font-weight:bold}
.preview-close{background:none;border:none;font-size:28px;cursor:pointer;color:var(--gray);line-height:1;padding:0 4px}
.preview-close:hover{color:var(--dark)}
.preview-body{padding:28px 40px 48px;font-size:15px;line-height:1.8;color:var(--dark);max-width:100%}
.preview-body h1{font-size:26px;font-weight:bold;margin:24px 0 12px;padding-bottom:8px;border-bottom:2px solid var(--blue-light);color:var(--blue-dark)}
.preview-body h2{font-size:22px;font-weight:bold;margin:28px 0 12px;color:var(--dark)}
.preview-body h3{font-size:18px;font-weight:bold;margin:20px 0 8px;color:var(--blue)}
.preview-body h4{font-size:16px;font-weight:bold;margin:16px 0 6px}
.preview-body p{margin:10px 0}
.preview-body ul,.preview-body ol{margin:10px 0;padding-left:24px}
.preview-body li{margin:4px 0}
.preview-body table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px}
.preview-body th{background:var(--blue);color:#fff;padding:10px 12px;text-align:left;font-weight:bold}
.preview-body td{padding:10px 12px;border-bottom:1px solid #E2E8F0}
.preview-body tr:nth-child(even) td{background:#F8FAFC}
.preview-body code{background:#F1F5F9;padding:2px 6px;border-radius:4px;font-size:13px;font-family:Consolas,monospace}
.preview-body pre{background:#0F172A;color:#E2E8F0;padding:16px 20px;border-radius:10px;overflow-x:auto;margin:16px 0;font-size:13px}
.preview-body pre code{background:none;color:inherit;padding:0}
.preview-body blockquote{border-left:4px solid var(--blue);padding:8px 16px;margin:16px 0;background:var(--blue-light);border-radius:0 8px 8px 0;color:var(--gray)}
.preview-body strong{font-weight:bold;color:var(--dark)}
.preview-body hr{border:none;border-top:1px solid #E2E8F0;margin:24px 0}
.preview-body img{max-width:100%;border-radius:8px;margin:12px 0}
.preview-loading{text-align:center;padding:80px 20px;color:var(--gray-light)}
/* 预渲染文档页面样式 */
.doc-rendered{font-size:15px;line-height:1.8;color:var(--dark)}
.doc-rendered h1{font-size:26px;font-weight:bold;margin:24px 0 12px;padding-bottom:8px;border-bottom:2px solid var(--blue-light);color:var(--blue-dark)}
.doc-rendered h2{font-size:22px;font-weight:bold;margin:28px 0 12px;color:var(--dark)}
.doc-rendered h3{font-size:18px;font-weight:bold;margin:20px 0 8px;color:var(--blue)}
.doc-rendered h4{font-size:16px;font-weight:bold;margin:16px 0 6px}
.doc-rendered p{margin:10px 0}
.doc-rendered ul,.doc-rendered ol{margin:10px 0;padding-left:24px}
.doc-rendered li{margin:4px 0}
.doc-rendered table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px}
.doc-rendered th{background:var(--blue);color:#fff;padding:10px 12px;text-align:left;font-weight:bold}
.doc-rendered td{padding:10px 12px;border-bottom:1px solid #E2E8F0}
.doc-rendered tr:nth-child(even) td{background:#F8FAFC}
.doc-rendered code{background:#F1F5F9;padding:2px 6px;border-radius:4px;font-size:13px;font-family:Consolas,monospace}
.doc-rendered pre{background:#0F172A;color:#E2E8F0;padding:16px 20px;border-radius:10px;overflow-x:auto;margin:16px 0;font-size:13px}
.doc-rendered pre code{background:none;color:inherit;padding:0}
.doc-rendered blockquote{border-left:4px solid var(--blue);padding:8px 16px;margin:16px 0;background:var(--blue-light);border-radius:0 8px 8px 0;color:var(--gray)}
.doc-rendered strong{font-weight:bold;color:var(--dark)}
.doc-rendered hr{border:none;border-top:1px solid #E2E8F0;margin:24px 0}
@media(max-width:900px){.doc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){
  .doc-grid{grid-template-columns:1fr}
  .filter-bar{flex-direction:column;align-items:stretch}
  .search-box{width:100%}
  .preview-overlay{padding:0}
  .preview-modal{border-radius:0;min-height:100vh}
  .preview-body{padding:20px 16px 40px}
}
