/* ============================================================
   亿互通 · 内页统一设计系统 inner.css
   覆盖：内页Hero/面包屑/文档布局/目录/表格/代码/提示/手风琴
        资讯列表/分页/侧边栏/文章详情/子导航/联系卡片/地图
   ============================================================ */

/* 内页统一使用 border-box，避免 width:100% + padding 导致内容溢出 */
.ip-hero, .ip-hero *, .ip-section, .ip-section *,
.doc-layout, .doc-layout *, .ip-layout, .ip-layout *,
.faq-layout, .faq-layout *, .contact-grid, .contact-grid *,
.article, .article *, .sub-nav, .sub-nav *{ box-sizing:border-box; }

/* ---------- 内页 Hero ---------- */
.ip-hero{
  position:relative; margin-top:70px; overflow:hidden;
  background:
    radial-gradient(circle at 82% 12%, rgba(46,167,95,.18), rgba(46,167,95,0) 46%),
    radial-gradient(circle at 10% 88%, rgba(80,160,255,.16), rgba(80,160,255,0) 48%),
    radial-gradient(circle at 50% 50%, rgba(21,78,63,.06), rgba(21,78,63,0) 70%),
    linear-gradient(180deg,#F4FAF7 0%,#FCFEFD 100%);
  border-bottom:1px solid #E9F1EC;
}
.ip-hero .ip-hero-inner{ padding:62px 0 54px; position:relative; z-index:2;}
.ip-breadcrumb{ font-size:14px; color:#8a9a92; margin-bottom:18px; letter-spacing:.3px;}
.ip-breadcrumb a{ color:#8a9a92; text-decoration:none; transition:color .2s;}
.ip-breadcrumb a:hover{ color:#2fa568;}
.ip-breadcrumb .sep{ margin:0 8px; color:#c4d2ca;}
.ip-breadcrumb .cur{ color:#5a6b62;}
.ip-hero h1{
  font-size:40px; font-weight:900; color:#154E3F; line-height:1.25;
  letter-spacing:.5px; margin-bottom:14px;
}
.ip-hero .ip-sub{ font-size:17px; color:#5a6b62; max-width:760px; line-height:1.7;}
.ip-hero .ip-hero-badges{ margin-top:22px; display:flex; gap:12px; flex-wrap:wrap;}
.ip-hero-badge{
  display:inline-flex; align-items:center; gap:6px;
  background:#fff; border:1px solid #E9F1EC; border-radius:999px;
  padding:7px 16px; font-size:13.5px; color:#3f5a4c;
  box-shadow:0 2px 10px rgba(21,78,63,.04);
}
.ip-hero-badge .dot{ width:7px; height:7px; border-radius:50%; background:#2fa568;}

/* ---------- 通用区块 ---------- */
.ip-section{ padding:64px 0;}
.ip-section.tint{ background:#F4FAF7; border-top:1px solid #E9F1EC; border-bottom:1px solid #E9F1EC;}
.ip-head{ text-align:center; margin-bottom:42px;}
.ip-head h2{
  font-size:31px; font-weight:800; color:#154E3F;
  display:inline-block; position:relative; padding-bottom:16px;
}
.ip-head h2::after{
  content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:46px; height:3px; border-radius:2px; background:#2fa568;
}
.ip-head p{ font-size:16px; color:#7a8a82; margin-top:14px;}

/* ---------- 文档布局（左目录 + 右文档） ---------- */
.doc-layout{ display:flex; gap:36px; align-items:flex-start; padding:48px 0 72px;}
.doc-toc{
  width:232px; flex:none; position:sticky; top:92px;
  background:#fff; border:1px solid #E9F1EC; border-radius:16px;
  padding:16px 0; box-shadow:0 8px 30px rgba(21,78,63,.05);
}
.doc-toc .toc-title{
  font-size:14px; font-weight:700; color:#154E3F;
  padding:2px 20px 12px; border-bottom:1px solid #EFF5F1; margin-bottom:8px;
}
.doc-toc a{
  display:block; padding:10px 20px; font-size:14.5px; color:#5a6b62;
  text-decoration:none; border-left:3px solid transparent; transition:all .2s;
}
.doc-toc a:hover{ color:#2fa568; background:#F4FAF7;}
.doc-toc a.active{ color:#2fa568; font-weight:700; border-left-color:#2fa568; background:#F4FAF7;}
.doc-body{ flex:1; min-width:0;}

/* ---------- 文档内容 ---------- */
.doc-body .doc-chapter{ margin-bottom:18px; scroll-margin-top:92px;}
.doc-body h2.doc-h2{
  font-size:25px; font-weight:800; color:#154E3F;
  padding:26px 0 12px; margin:14px 0 18px;
  border-bottom:1px solid #EDF3F0;
}
.doc-body h2.doc-h2:first-child{ margin-top:0; padding-top:0;}
.doc-body h3.doc-h3{
  font-size:17px; font-weight:700; color:#1f5a44;
  margin:26px 0 10px; display:flex; align-items:center; gap:8px;
}
.doc-body h3.doc-h3::before{
  content:""; width:4px; height:16px; border-radius:2px;
  background:linear-gradient(180deg,#2fa568,#5fc794);
}
.doc-body p{ font-size:15px; color:#44504a; line-height:1.9; margin-bottom:12px;}
.doc-body ul.doc-list{ margin:0 0 14px; padding-left:4px; list-style:none;}
.doc-body ul.doc-list li{
  position:relative; padding-left:22px; font-size:15px;
  color:#44504a; line-height:1.95; margin-bottom:6px;
}
.doc-body ul.doc-list li::before{
  content:""; position:absolute; left:4px; top:11px;
  width:7px; height:7px; border-radius:50%; background:#9ad6b8;
}

/* ---------- 参数表格 ---------- */
.doc-table-wrap{
  border:1px solid #E9F1EC; border-radius:14px; overflow:hidden;
  margin:16px 0 22px; box-shadow:0 6px 22px rgba(21,78,63,.05);
}
table.doc-table{ width:100%; border-collapse:collapse; font-size:14.5px;}
table.doc-table thead th{
  background:#F0F7F3; color:#1f5a44; font-weight:700; text-align:left;
  padding:13px 18px; border-bottom:1px solid #E2ECE7; white-space:nowrap;
}
table.doc-table tbody td{
  padding:13px 18px; border-bottom:1px solid #F0F5F2; color:#44504a; line-height:1.7;
  vertical-align:top;
}
table.doc-table tbody tr:last-child td{ border-bottom:none;}
table.doc-table tbody tr:nth-child(even){ background:#FAFCFB;}
table.doc-table tbody tr:hover{ background:#F2F9F5;}
table.doc-table code, .doc-body p code, .doc-body li code{
  font-family:"SFMono-Regular",Consolas,Menlo,monospace;
  background:#EAF4EE; color:#1f7a50; border-radius:5px;
  padding:2px 7px; font-size:13.5px;
}
table.doc-table .req-yes{ color:#2fa568; font-weight:700;}
table.doc-table .req-no{ color:#9aa8a1;}

/* ---------- 代码块（深色，含 tab） ---------- */
.codebox{
  background:#0d1518; border-radius:14px; overflow:hidden;
  margin:18px 0 24px; box-shadow:0 14px 40px rgba(10,25,20,.28);
}
.codebox-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:0 18px; background:#121d20; border-bottom:1px solid #1d2b29;
}
.codebox-tabs{ display:flex;}
.code-tab{
  appearance:none; background:none; border:none; cursor:pointer;
  font-family:inherit; font-size:14px; color:#8fa69c;
  padding:13px 18px; position:relative; transition:color .2s;
}
.code-tab:hover{ color:#dfeeea;}
.code-tab.active{ color:#7fe0ac;}
.code-tab.active::after{
  content:""; position:absolute; left:14px; right:14px; bottom:0; height:2px;
  background:#2fa568; border-radius:2px;
}
.codebox-dots{ display:flex; gap:7px;}
.codebox-dots i{ width:11px; height:11px; border-radius:50%; display:block;}
.codebox-dots i:nth-child(1){ background:#ff5f57;}
.codebox-dots i:nth-child(2){ background:#febc2e;}
.codebox-dots i:nth-child(3){ background:#28c840;}
.codebox-body{ padding:18px 20px; overflow-x:auto;}
.codebox-body pre{
  margin:0; font-family:"SFMono-Regular",Consolas,Menlo,monospace;
  font-size:13.5px; line-height:1.75; color:#c9d8d0; white-space:pre;
}
.code-pane{ display:none;}
.code-pane.active{ display:block;}
.code-pane .c-cm{ color:#6b8178;}
.code-pane .c-kw{ color:#6fc0ff;}
.code-pane .c-str{ color:#e3b877;}
.code-pane .c-fn{ color:#7fe0ac;}
.code-pane .c-var{ color:#d7e8df;}
.code-pane .c-num{ color:#e88f9e;}

/* 行内代码块（无 tab，请求地址等） */
.code-line{
  display:flex; align-items:center; gap:14px;
  background:#F4FAF7; border:1px solid #DCEAE3; border-radius:12px;
  padding:14px 18px; margin:14px 0 20px;
}
.code-line .method{
  flex:none; font-family:Consolas,Menlo,monospace; font-weight:700; font-size:12.5px;
  background:#2fa568; color:#fff; border-radius:6px; padding:4px 11px;
}
.code-line .url{
  font-family:Consolas,Menlo,monospace; font-size:14px; color:#1f5a44;
  word-break:break-all;
}

/* ---------- 提示框 ---------- */
.doc-note{
  display:flex; gap:12px; align-items:flex-start;
  background:#FFF9E8; border:1px solid #F3E4B0; border-left:4px solid #E9B949;
  border-radius:10px; padding:14px 18px; margin:18px 0;
}
.doc-note .note-icon{
  flex:none; width:20px; height:20px; border-radius:50%;
  background:#E9B949; color:#fff; font-size:13px; font-weight:700;
  display:flex; align-items:center; justify-content:center; margin-top:1px;
}
.doc-note .note-body{ font-size:14px; color:#7a5a18; line-height:1.8;}
.doc-note.info{ background:#EFF6FB; border-color:#c3dcf0; border-left-color:#4a90d9;}
.doc-note.info .note-icon{ background:#4a90d9;}
.doc-note.info .note-body{ color:#27506f;}

/* ---------- 侧边栏布局（列表/详情） ---------- */
.ip-layout{ display:flex; gap:34px; align-items:flex-start; padding:46px 0 72px;}
.ip-main{ flex:1; min-width:0;}
.ip-side{ width:322px; flex:none; position:sticky; top:92px;}
.side-panel{
  background:#fff; border:1px solid #E9F1EC; border-radius:16px;
  padding:20px 22px; margin-bottom:24px; box-shadow:0 8px 30px rgba(21,78,63,.05);
}
.side-panel h3{
  font-size:17px; font-weight:800; color:#154E3F;
  padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid #EDF3F0;
  display:flex; align-items:center; gap:8px;
}
.side-panel h3::before{
  content:""; width:4px; height:16px; border-radius:2px;
  background:linear-gradient(180deg,#2fa568,#5fc794);
}
.side-panel ul{ list-style:none; margin:0; padding:0;}
.side-hot li{ margin-bottom:13px;}
.side-hot li a{
  display:flex; align-items:flex-start; gap:9px;
  font-size:14px; color:#44504a; line-height:1.6; text-decoration:none; transition:color .2s;
}
.side-hot li a:hover{ color:#2fa568;}
.side-hot li a .idx{
  flex:none; width:18px; height:18px; border-radius:5px; margin-top:1px;
  background:#E9F1EC; color:#7a8a82; font-size:12px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.side-hot li:nth-child(-n+3) a .idx{ background:#2fa568; color:#fff;}
.side-product li{ margin-bottom:15px;}
.side-product li:last-child{ margin-bottom:0;}
.side-product li a{ display:flex; align-items:center; gap:11px; text-decoration:none;}
.side-product li a img{ width:38px; height:38px; flex:none;}
.side-product li a .sp-t{ font-size:15px; font-weight:700; color:#2c4439;}
.side-product li a .sp-d{ font-size:12.5px; color:#95a39b; margin-top:2px;}

/* ---------- 资讯列表 ---------- */
.news-item{
  background:#fff; border:1px solid #E9F1EC; border-radius:16px;
  padding:26px 28px; margin-bottom:20px;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s;
}
.news-item:hover{
  transform:translateY(-3px); border-color:#cfe5d9;
  box-shadow:0 14px 34px rgba(21,78,63,.10);
}
.news-item h2{ font-size:20px; font-weight:700; margin-bottom:10px; line-height:1.5;}
.news-item h2 a{ color:#1f3b30; text-decoration:none; transition:color .2s;}
.news-item h2 a:hover{ color:#2fa568;}
.news-item .news-excerpt{ font-size:14.5px; color:#6a7871; line-height:1.8; margin-bottom:14px;}
.news-item .news-meta{
  display:flex; align-items:center; flex-wrap:wrap; gap:14px;
  font-size:13px; color:#9aa8a1;
}
.news-item .news-meta .date{ display:inline-flex; align-items:center; gap:5px;}
.news-item .news-tags{ display:flex; flex-wrap:wrap; gap:8px;}
.news-item .news-tags a{
  font-size:12.5px; color:#5a7a68; background:#F1F7F4;
  border:1px solid #E2ECE7; border-radius:999px; padding:3px 11px;
  text-decoration:none; transition:all .2s;
}
.news-item .news-tags a:hover{ background:#2fa568; color:#fff; border-color:#2fa568;}

/* ---------- 分页 ---------- */
.pagination{ display:flex; justify-content:center; gap:8px; margin-top:34px; flex-wrap:wrap;}
.pagination a, .pagination span{
  min-width:40px; height:40px; padding:0 6px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid #E4ECE7; border-radius:10px; background:#fff;
  font-size:14.5px; color:#5a6b62; text-decoration:none; transition:all .2s;
}
.pagination a:hover{ border-color:#2fa568; color:#2fa568;}
.pagination .active{ background:#2fa568; border-color:#2fa568; color:#fff; font-weight:700;}
.pagination .gap{ border:none; background:none;}

/* ---------- 文章详情 ---------- */
.article{
  background:#fff; border:1px solid #E9F1EC; border-radius:16px;
  padding:40px 44px; box-shadow:0 8px 30px rgba(21,78,63,.05);
}
.article .art-title{ font-size:29px; font-weight:800; color:#154E3F; line-height:1.5; margin-bottom:16px;}
.article .art-meta{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px;
  padding-bottom:20px; margin-bottom:26px; border-bottom:1px solid #EDF3F0;
  font-size:13.5px; color:#9aa8a1;
}
.article .art-body{ font-size:15.5px; color:#3d4a43; line-height:2;}
.article .art-body p{ margin-bottom:18px;}
.article .art-body h3{ font-size:19px; font-weight:700; color:#1f5a44; margin:30px 0 14px;}
.article .art-body img{ max-width:100%; border-radius:12px; margin:16px auto; display:block;}
.article .art-body a{ color:#2fa568;}
.article .art-tags{
  display:flex; flex-wrap:wrap; gap:8px; align-items:center;
  padding:22px 0; margin-top:26px; border-top:1px solid #EDF3F0;
}
.article .art-tags .tag-label{ font-size:14px; color:#7a8a82;}
.article .art-tags a{
  font-size:13px; color:#5a7a68; background:#F1F7F4; border:1px solid #E2ECE7;
  border-radius:999px; padding:4px 13px; text-decoration:none; transition:all .2s;
}
.article .art-tags a:hover{ background:#2fa568; color:#fff; border-color:#2fa568;}
.article .art-prevnext{ margin-top:24px;}
.article .art-prevnext .pn-row{
  display:flex; gap:10px; padding:11px 0; font-size:14px; color:#7a8a82;
}
.article .art-prevnext .pn-row a{ color:#44504a; text-decoration:none; transition:color .2s;}
.article .art-prevnext .pn-row a:hover{ color:#2fa568;}

/* ---------- 子导航（关于/联系） ---------- */
.sub-nav{ background:#fff; border-bottom:1px solid #E9F1EC; margin-top:70px;}
.sub-nav ul{ display:flex; gap:8px;}
.sub-nav a{
  display:block; padding:20px 28px; font-size:16px; color:#5a6b62;
  text-decoration:none; position:relative; transition:color .2s;
}
.sub-nav a:hover{ color:#2fa568;}
.sub-nav a.active{ color:#2fa568; font-weight:700;}
.sub-nav a.active::after{
  content:""; position:absolute; left:28px; right:28px; bottom:0; height:3px;
  background:#2fa568; border-radius:2px;
}

/* ---------- 关于：简介 ---------- */
.about-intro{ max-width:920px; margin:0 auto;}
.about-intro p{ font-size:16px; color:#44504a; line-height:2.1; margin-bottom:18px;}

/* ---------- 联系：卡片 + 地图 ---------- */
.contact-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-bottom:36px;}
.contact-card{
  background:#fff; border:1px solid #E9F1EC; border-radius:16px;
  padding:28px 30px; display:flex; gap:18px; align-items:flex-start;
  transition:transform .25s, box-shadow .25s;
}
.contact-card:hover{ transform:translateY(-3px); box-shadow:0 14px 34px rgba(21,78,63,.10);}
.contact-card .cc-icon{
  flex:none; width:50px; height:50px; border-radius:14px;
  background:linear-gradient(135deg,#EAF6EF,#D9F0E4);
  display:flex; align-items:center; justify-content:center; color:#2fa568;
}
.contact-card .cc-label{ font-size:13.5px; color:#9aa8a1; margin-bottom:6px;}
.contact-card .cc-value{ font-size:18px; font-weight:700; color:#1f3b30; line-height:1.5;}
.contact-card .cc-value a{ color:#1f3b30; text-decoration:none;}
.contact-map{
  border:1px solid #E9F1EC; border-radius:16px; overflow:hidden;
  box-shadow:0 10px 34px rgba(21,78,63,.08);
}
.contact-map img{ display:block; width:100%; height:auto;}

/* ---------- 滚动显现 ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease;}
.reveal.visible{ opacity:1; transform:none;}

/* ---------- 手风琴（FAQ） ---------- */
.faq-cat-title{
  font-size:22px; font-weight:800; color:#154E3F; margin:40px 0 18px;
  display:flex; align-items:center; gap:10px;
}
.faq-cat-title:first-child{ margin-top:0;}
.faq-cat-title .cat-bar{
  width:5px; height:22px; border-radius:3px;
  background:linear-gradient(180deg,#2fa568,#5fc794);
}
.acc-item{
  background:#fff; border:1px solid #E9F1EC; border-radius:13px;
  margin-bottom:13px; overflow:hidden; transition:box-shadow .25s, border-color .25s;
}
.acc-item:hover{ border-color:#cfe5d9;}
.acc-item.open{ border-color:#bcdcc9; box-shadow:0 10px 28px rgba(21,78,63,.08);}
.acc-head{
  width:100%; appearance:none; background:none; border:none; cursor:pointer;
  font-family:inherit; text-align:left; display:flex; align-items:center; gap:12px;
  padding:18px 22px; font-size:15.5px; font-weight:600; color:#263b31;
}
.acc-head .q-mark{
  flex:none; width:24px; height:24px; border-radius:7px;
  background:#EAF4EE; color:#2fa568; font-size:13px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.acc-head .q-text{ flex:1; line-height:1.6;}
.acc-head .acc-arrow{
  flex:none; width:22px; height:22px; transition:transform .3s; color:#95a39b;
}
.acc-item.open .acc-arrow{ transform:rotate(180deg); color:#2fa568;}
.acc-body{ max-height:0; overflow:hidden; transition:max-height .35s ease;}
.acc-body-inner{ padding:2px 22px 20px 58px;}
.acc-body-inner p{ font-size:14.5px; color:#55635b; line-height:1.95; margin-bottom:10px;}
.acc-body-inner img{ max-width:100%; border-radius:10px; margin:10px 0;}
.acc-body-inner a{ color:#2fa568;}
.acc-body-inner b{ color:#2c4439;}

/* FAQ 分类锚点（左侧） */
.faq-layout{ display:flex; gap:36px; align-items:flex-start; padding:48px 0 72px;}
.faq-toc{ width:200px; flex:none; position:sticky; top:92px;}
.faq-toc a{
  display:block; padding:13px 20px; margin-bottom:10px;
  background:#fff; border:1px solid #E9F1EC; border-radius:12px;
  font-size:15px; color:#5a6b62; text-decoration:none; transition:all .2s;
}
.faq-toc a:hover{ border-color:#2fa568; color:#2fa568;}
.faq-toc a .toc-num{
  display:inline-block; min-width:26px; font-weight:700; color:#2fa568;
}
.faq-main{ flex:1; min-width:0;}

/* ---------- 关于：四大优势卡片 ---------- */
.about-adv-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:22px;
}
.about-adv{
  background:#fff; border:1px solid #E9F1EC; border-radius:16px;
  padding:32px 26px 28px; text-align:center;
  transition:transform .25s, box-shadow .25s, border-color .25s;
}
.about-adv:hover{
  transform:translateY(-5px); border-color:#cfe5d9;
  box-shadow:0 16px 36px rgba(21,78,63,.10);
}
.about-adv .adv-icon{
  width:62px; height:62px; border-radius:18px; margin:0 auto 20px;
  background:linear-gradient(135deg,#EAF6EF,#D9F0E4);
  display:flex; align-items:center; justify-content:center; color:#2fa568;
  transition:transform .3s;
}
.about-adv:hover .adv-icon{ transform:scale(1.08) rotate(-4deg);}
.about-adv h3{ font-size:18px; font-weight:700; color:#1f5a44; margin-bottom:12px;}
.about-adv p{ font-size:14px; color:#6a7a71; line-height:1.9; text-align:left;}

/* ---------- 关于：案例网格（复用首页样式，此处补充内页场景） ---------- */
.about-case-grid{ /* 占位，实际使用 ns-case-grid */ }

/* ---------- 小 Hero（详情页等） ---------- */
.ip-hero.ip-hero-sm .ip-hero-inner{ padding:30px 0 26px;}

/* ---------- 文章：时间 / 无下一篇 ---------- */
.article .art-meta .art-time{
  display:inline-flex; align-items:center; gap:7px;
}
.article .art-prevnext .pn-none{ color:#a6b2ab;}

/* ---------- 响应式 ---------- */
@media (max-width: 1100px){
  .doc-toc, .ip-side, .faq-toc{ position:static; width:auto;}
  .doc-layout, .ip-layout, .faq-layout{ flex-direction:column;}
  .contact-grid{ grid-template-columns:1fr;}
  .about-adv-grid{ grid-template-columns:repeat(2,1fr);}
  .article{ padding:28px 24px;}
}