/* =========================================================
   企查通 · 官网首页样式（只被根目录 index.php 引用）
   ---------------------------------------------------------
   与后台 assets/style.css 完全独立：官网不加载后台样式，
   避免后台布局规则（.shell / .side / .content）污染静态页。

   约定：
     · 设计令牌集中在 :root，改主题只改这里
     · 栅格一律用 minmax(0,1fr)，否则子元素会把列撑破
     · 设了 display 的元素用 hidden 属性控显隐时，必须保留
       [hidden]{display:none!important}，否则 CSS 会盖掉浏览器默认行为
     · 首屏主色 #4A5DFF，与后台保持同一品牌色
     · 无外部字体 / 图标库，全部内联 SVG
   ========================================================= */

:root{
  --brand:#4A5DFF;  --brand-d:#3546e0;  --brand-l:#EDEFFF;  --brand-b:#dbe0ff;
  --cyan:#17b3d6;   --cyan-l:#e6f7fb;
  --violet:#7c5cff; --violet-l:#f0ecff;
  --green:#0f9d58;  --green-l:#eaf7f0;
  --amber:#e6a23c;  --amber-l:#fdf6ec;
  --rose:#f2545b;   --rose-l:#fdeced;

  --ink:#1b2033;
  --body:#4e5768;
  --muted:#8b93a3;
  --line:#e8eaf3;
  --line-s:#f1f3f9;

  --bg:#fff;
  --bg-soft:#f7f8fd;
  --bg-dark:#101528;

  --r:10px;  --r-s:8px;  --r-l:16px;
  --sh-1:0 1px 2px rgba(23,28,45,.05), 0 6px 18px rgba(23,28,45,.05);
  --sh-2:0 2px 10px rgba(23,28,45,.06), 0 22px 52px rgba(23,28,45,.10);
  --sh-3:0 10px 30px rgba(74,93,255,.22);

  --nav-h:64px;
  --max:1140px;
  --mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
}

*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none !important; }

html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--body);
  font:15px/1.75 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{ margin:0; color:var(--ink); font-weight:600; line-height:1.3; letter-spacing:-.01em; }
p{ margin:0; }
a{ color:var(--brand); text-decoration:none; }
a:hover{ color:var(--brand-d); }
ul,ol{ margin:0; padding:0; list-style:none; }
code{ font-family:var(--mono); font-size:.9em; }
img{ max-width:100%; display:block; }

.wrap{ width:100%; max-width:var(--max); margin:0 auto; padding:0 22px; }

/* ============ 按钮 ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  height:40px; padding:0 18px;
  border:1px solid transparent; border-radius:var(--r-s);
  font:inherit; font-size:14px; font-weight:500; line-height:1;
  cursor:pointer; white-space:nowrap;
  transition:background .16s, border-color .16s, color .16s, box-shadow .16s, transform .16s;
}
.btn-p{ background:var(--brand); color:#fff; box-shadow:0 2px 8px rgba(74,93,255,.25); }
.btn-p:hover{ background:var(--brand-d); color:#fff; box-shadow:var(--sh-3); }
.btn-g{ background:#fff; border-color:var(--line); color:var(--ink); }
.btn-g:hover{ border-color:var(--brand-b); color:var(--brand); }
.btn-o{ background:transparent; border-color:rgba(255,255,255,.28); color:#fff; }
.btn-o:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.5); color:#fff; }
.btn-sm{ height:34px; padding:0 14px; font-size:13px; }

/* ============ 顶部导航 ============ */
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid transparent;
  transition:border-color .2s, box-shadow .2s;
}
.nav.scrolled{ border-bottom-color:var(--line); box-shadow:0 2px 12px rgba(23,28,45,.05); }
.nav-in{ display:flex; align-items:center; gap:26px; height:var(--nav-h); }

.brand{ display:flex; align-items:center; gap:10px; flex:0 0 auto; color:var(--ink); }
.brand:hover{ color:var(--ink); }
.brand-mark{
  width:32px; height:32px; flex:0 0 32px;
  display:flex; align-items:center; justify-content:center;
  border-radius:9px; background:var(--brand); overflow:hidden;
}
.brand-mark svg{ width:19px; height:19px; fill:none; stroke:#fff; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.brand-mark img{ width:100%; height:100%; object-fit:cover; }
.brand-name{ font-size:16px; font-weight:600; letter-spacing:-.01em; }
.brand-ver{
  font-size:11px; font-weight:500; color:var(--brand);
  background:var(--brand-l); border-radius:99px; padding:1px 7px;
}

.nav-links{ display:flex; align-items:center; gap:24px; margin-left:6px; }
.nav-links a{ color:var(--body); font-size:14px; }
.nav-links a:hover{ color:var(--brand); }
.nav-acts{ margin-left:auto; display:flex; align-items:center; gap:10px; }

.nav-burger{
  display:none; margin-left:auto;
  width:38px; height:38px; padding:0;
  border:1px solid var(--line); border-radius:var(--r-s);
  background:#fff; cursor:pointer;
}
.nav-burger span{
  display:block; width:16px; height:1.6px; margin:3px auto;
  background:var(--ink); border-radius:2px; transition:transform .2s, opacity .2s;
}
.nav-burger.on span:nth-child(1){ transform:translateY(4.6px) rotate(45deg); }
.nav-burger.on span:nth-child(2){ opacity:0; }
.nav-burger.on span:nth-child(3){ transform:translateY(-4.6px) rotate(-45deg); }

.nav-mob{ display:none; border-top:1px solid var(--line); background:#fff; padding:8px 22px 16px; }
.nav-mob a{ display:block; padding:11px 0; color:var(--body); border-bottom:1px solid var(--line-s); }
.nav-mob a:hover{ color:var(--brand); }
.nav-mob .mob-cta{ border-bottom:0; color:var(--brand); font-weight:600; }

/* ============ 首屏 ============ */
.hero{
  position:relative; overflow:hidden;
  padding:64px 0 0;
  background:
    radial-gradient(900px 460px at 12% 0%, rgba(74,93,255,.10), transparent 62%),
    radial-gradient(720px 400px at 92% 8%, rgba(23,179,214,.10), transparent 60%),
    linear-gradient(180deg,#fbfcff 0%, #fff 78%);
}
.hero-in{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,460px);
  gap:52px; align-items:center; padding-bottom:52px;
}
.hero-copy{ min-width:0; }
.pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:5px 13px; margin-bottom:20px;
  border:1px solid var(--brand-b); border-radius:99px;
  background:#fff; color:var(--brand);
  font-size:12.5px; font-weight:500;
}
.pill .dot{ width:6px; height:6px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 3px rgba(74,93,255,.16); }

.hero h1{ font-size:44px; line-height:1.22; letter-spacing:-.025em; }
.hero h1 em{
  font-style:normal;
  background:linear-gradient(96deg,var(--brand) 0%, var(--violet) 55%, var(--cyan) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-sub{ margin-top:18px; font-size:15.5px; line-height:1.85; color:var(--body); max-width:560px; }

.hero-search{
  display:flex; align-items:center; gap:8px;
  margin-top:28px; padding:7px 7px 7px 14px;
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r); box-shadow:var(--sh-1);
  transition:border-color .18s, box-shadow .18s;
}
.hero-search:focus-within{ border-color:var(--brand-b); box-shadow:var(--sh-2); }
.hs-icon{ display:flex; flex:0 0 auto; }
.hs-icon svg{ width:19px; height:19px; fill:none; stroke:var(--muted); stroke-width:1.7; stroke-linecap:round; }
.hero-search input{
  flex:1; min-width:0; height:40px;
  border:0; outline:0; background:transparent;
  font:inherit; font-size:14.5px; color:var(--ink);
}
.hero-search input::placeholder{ color:#a9b0bd; }
.hero-search input:disabled{ background:transparent; }
.hero-hint{ margin-top:12px; font-size:12.5px; color:var(--muted); }
.hero-hint b{ color:var(--body); font-weight:600; }

/* 首屏右侧代码卡 */
.hero-side{ min-width:0; }
.hs-card{
  background:#0f172a; border-radius:var(--r-l);
  box-shadow:var(--sh-2); overflow:hidden;
}
.hs-head{
  display:flex; align-items:center; gap:6px;
  padding:11px 14px; background:rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.hs-dot{ width:9px; height:9px; border-radius:50%; background:#3b4763; }
.hs-dot:nth-child(1){ background:#ff5f57; }
.hs-dot:nth-child(2){ background:#febc2e; }
.hs-dot:nth-child(3){ background:#28c840; }
.hs-title{ margin-left:auto; font-size:12px; color:#8593b3; }
.hs-code{
  margin:0; padding:16px 18px 20px;
  font-family:var(--mono); font-size:12.5px; line-height:1.85;
  color:#cfe0ff; overflow-x:auto; white-space:pre;
}
.hs-code .c-k{ color:#7dd3fc; }
.hs-code .c-s{ color:#a5d6ff; }
.hs-code .c-c{ color:#6b7a99; }

/* 首屏统计条 */
.hero-stats{
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  background:#fff; border:1px solid var(--line); border-radius:var(--r-l);
  box-shadow:var(--sh-1); overflow:hidden;
}
.hs-item{ padding:20px 18px; border-right:1px solid var(--line-s); min-width:0; }
.hs-item:last-child{ border-right:0; }
.hs-item b{ display:block; font-size:26px; font-weight:600; color:var(--ink); letter-spacing:-.02em; line-height:1.2; }
.hs-item span{ display:block; margin-top:4px; font-size:12.5px; color:var(--muted); }

/* ============ 通用区块 ============ */
.sec{ padding:78px 0; }
.sec-soft{ background:var(--bg-soft); border-top:1px solid var(--line-s); border-bottom:1px solid var(--line-s); }
.sec-head{ max-width:720px; margin:0 auto 44px; text-align:center; }
.sec-tag{
  display:inline-block; margin-bottom:12px; padding:3px 11px;
  border-radius:99px; background:var(--brand-l); color:var(--brand);
  font-size:12px; font-weight:600; letter-spacing:.02em;
}
.sec-head h2{ font-size:30px; letter-spacing:-.02em; }
.sec-head p{ margin-top:12px; font-size:15px; line-height:1.85; }

/* ============ 核心能力 ============ */
.feat-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.feat{
  padding:26px 24px; background:#fff;
  border:1px solid var(--line); border-radius:var(--r-l);
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.feat:hover{ border-color:var(--brand-b); box-shadow:var(--sh-2); transform:translateY(-2px); }
.feat-ico{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; margin-bottom:16px; border-radius:11px;
}
.feat-ico svg{ width:21px; height:21px; fill:none; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }
.i-blue{ background:var(--brand-l); }  .i-blue svg{ stroke:var(--brand); }
.i-violet{ background:var(--violet-l); } .i-violet svg{ stroke:var(--violet); }
.i-cyan{ background:var(--cyan-l); }   .i-cyan svg{ stroke:var(--cyan); }
.i-amber{ background:var(--amber-l); } .i-amber svg{ stroke:var(--amber); }
.i-green{ background:var(--green-l); } .i-green svg{ stroke:var(--green); }
.i-rose{ background:var(--rose-l); }   .i-rose svg{ stroke:var(--rose); }
.feat h3{ font-size:16.5px; margin-bottom:8px; }
.feat p{ font-size:13.8px; line-height:1.85; color:var(--body); }

/* ============ 数据来源流水线 ============ */
.flow{
  display:grid; grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr) 44px minmax(0,1fr);
  align-items:stretch; gap:0;
}
.flow-step{
  position:relative; padding:26px 22px 24px;
  background:#fff; border:1px solid var(--line); border-radius:var(--r-l);
  box-shadow:var(--sh-1); min-width:0;
}
.flow-no{
  display:inline-block; margin-bottom:12px;
  font-family:var(--mono); font-size:12px; font-weight:600;
  color:var(--brand); letter-spacing:.06em;
}
.flow-step h4{ font-size:16px; margin-bottom:8px; }
.flow-step p{ font-size:13.6px; line-height:1.85; min-height:66px; }
.flow-tag{
  display:inline-block; margin-top:12px; padding:3px 10px;
  border-radius:99px; font-size:12px; font-weight:500;
}
.t-local{ background:var(--green-l); color:var(--green); }
.t-cache{ background:var(--amber-l); color:#b87d15; }
.t-prov{ background:var(--brand-l); color:var(--brand); }
.flow-arrow{ display:flex; align-items:center; justify-content:center; }
.flow-arrow svg{ width:20px; height:20px; fill:none; stroke:#c3cad9; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.src-note{
  margin-top:22px; padding:16px 20px;
  background:#fff; border:1px solid var(--line); border-left:3px solid var(--brand);
  border-radius:var(--r-s); font-size:13.6px; line-height:1.9;
}
.src-note b{ color:var(--ink); }

/* ============ 字段覆盖 ============ */
.field-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.field-card{
  padding:22px 20px; background:#fff;
  border:1px solid var(--line); border-radius:var(--r-l); min-width:0;
}
.field-card h4{
  font-size:14.5px; margin-bottom:12px; padding-bottom:11px;
  border-bottom:1px solid var(--line-s);
}
.field-card li{
  position:relative; padding-left:15px; margin-bottom:7px;
  font-size:13.2px; line-height:1.7; color:var(--body);
}
.field-card li::before{
  content:""; position:absolute; left:0; top:8px;
  width:5px; height:5px; border-radius:50%; background:var(--brand-b);
}

/* ============ 开放接口（深色区块） ============ */
.sec-dark{
  background:var(--bg-dark); color:#c3cbdd;
  border-top:0; border-bottom:0;
}
.sec-dark .sec-head h2{ color:#fff; }
.sec-head-dark p{ color:#98a3bf; }
.sec-head-dark code{
  background:rgba(255,255,255,.08); color:#a5d6ff;
  padding:2px 7px; border-radius:5px; font-size:.85em;
}
.sec-dark .sec-tag{ background:rgba(74,93,255,.22); color:#a9b4ff; }

.api-wrap{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:22px; align-items:start; }
.api-code{
  background:#0b101f; border:1px solid rgba(255,255,255,.09);
  border-radius:var(--r-l); overflow:hidden; min-width:0;
}
.api-code-hd{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:11px 16px; background:rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.07);
  font-size:12.5px; color:#8593b3;
}
.api-code pre{
  margin:0; padding:16px 18px 20px;
  font-family:var(--mono); font-size:12.5px; line-height:1.9;
  color:#cfe0ff; overflow-x:auto; white-space:pre;
}
.api-code .c-c{ color:#6b7a99; }
.copy-btn{
  padding:4px 11px; border:1px solid rgba(255,255,255,.18); border-radius:6px;
  background:transparent; color:#aab6d4; font:inherit; font-size:12px; cursor:pointer;
  transition:background .16s, color .16s, border-color .16s;
}
.copy-btn:hover{ background:rgba(255,255,255,.08); color:#fff; }
.copy-btn.copied{ border-color:rgba(40,200,64,.5); color:#5ee27a; }

.api-list{ display:flex; flex-direction:column; gap:10px; min-width:0; }
.api-item{
  display:flex; align-items:center; gap:14px;
  padding:14px 16px; border-radius:var(--r);
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.07);
}
.api-item code{
  flex:0 0 auto; min-width:80px;
  padding:3px 9px; border-radius:6px;
  background:rgba(74,93,255,.24); color:#a9b4ff;
  font-size:12.5px; text-align:center;
}
.api-item div{ min-width:0; }
.api-item b{ display:block; color:#eef2ff; font-size:14px; font-weight:600; }
.api-item span{ display:block; font-size:12.5px; color:#8b98b8; margin-top:1px; }
.api-doc-btn{ margin-top:6px; align-self:flex-start; }

/* ============ 接入流程 ============ */
.steps{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; counter-reset:step; }
.step{
  position:relative; padding:24px 22px;
  background:#fff; border:1px solid var(--line); border-radius:var(--r-l); min-width:0;
}
.step-no{
  display:flex; align-items:center; justify-content:center;
  width:32px; height:32px; margin-bottom:14px;
  border-radius:50%; background:var(--brand); color:#fff;
  font-size:14px; font-weight:600;
}
.step-bd h4{ font-size:15.5px; margin-bottom:8px; }
.step-bd p{ font-size:13.4px; line-height:1.85; }
.step-bd code{
  background:var(--brand-l); color:var(--brand-d);
  padding:1px 6px; border-radius:4px; font-size:.88em;
}

/* ============ 常见问题 ============ */
.faq-wrap{ max-width:860px; margin:0 auto; display:flex; flex-direction:column; gap:12px; }
.faq-item{
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r); overflow:hidden;
  transition:border-color .18s, box-shadow .18s;
}
.faq-item[open]{ border-color:var(--brand-b); box-shadow:var(--sh-1); }
.faq-item summary{
  position:relative; padding:16px 46px 16px 20px;
  cursor:pointer; list-style:none;
  font-size:15px; font-weight:500; color:var(--ink);
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{
  content:""; position:absolute; right:20px; top:50%;
  width:8px; height:8px; margin-top:-6px;
  border-right:1.8px solid var(--muted); border-bottom:1.8px solid var(--muted);
  transform:rotate(45deg); transition:transform .2s;
}
.faq-item[open] summary::after{ transform:rotate(-135deg); margin-top:-2px; }
.faq-bd{ padding:0 20px 18px; font-size:13.8px; line-height:1.95; }
.faq-bd code{
  background:var(--brand-l); color:var(--brand-d);
  padding:1px 6px; border-radius:4px; font-size:.87em;
}

/* ============ 页脚 ============ */
.foot{
  padding:44px 0 34px;
  background:var(--bg-soft);
  border-top:1px solid var(--line);
}
.foot-in{ display:flex; flex-direction:column; gap:18px; }
.foot-brand{ display:flex; align-items:center; gap:12px; }
.foot-brand b{ display:block; font-size:15.5px; color:var(--ink); font-weight:600; }
.foot-brand span span,.foot-brand div span{ display:block; font-size:12.5px; color:var(--muted); }
.foot-tip{ font-size:12.5px; line-height:1.9; color:var(--muted); max-width:900px; }
.foot-tip b{ color:var(--body); }
.foot-bot{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding-top:18px; border-top:1px solid var(--line);
  font-size:12.5px; color:var(--muted);
}
.foot-links{ display:flex; align-items:center; gap:18px; }
.foot-links a{ color:var(--muted); }
.foot-links a:hover{ color:var(--brand); }

/* ============ 响应式 ============ */
@media (max-width:1040px){
  .nav-links{ display:none; }
  .nav-burger{ display:block; }
  .nav-mob{ display:block; }
  .nav-acts .btn-g{ display:none; }

  .hero{ padding-top:48px; }
  .hero-in{ grid-template-columns:minmax(0,1fr); gap:36px; padding-bottom:40px; }
  .hero h1{ font-size:36px; }
  .hero-side{ max-width:560px; }

  .feat-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .field-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .steps{ grid-template-columns:repeat(2,minmax(0,1fr)); }

  .flow{ grid-template-columns:minmax(0,1fr); }
  .flow-arrow{ padding:10px 0; transform:rotate(90deg); }
  .flow-step p{ min-height:0; }

  .api-wrap{ grid-template-columns:minmax(0,1fr); }
  .hero-stats{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .hs-item:nth-child(3){ border-right:0; }
  .hs-item:nth-child(4),.hs-item:nth-child(5){ border-top:1px solid var(--line-s); }
  .hs-item:nth-child(4){ border-right:1px solid var(--line-s); }
}

@media (max-width:680px){
  .wrap{ padding:0 18px; }
  .sec{ padding:56px 0; }
  .sec-head{ margin-bottom:32px; }
  .sec-head h2{ font-size:23px; }
  .hero h1{ font-size:29px; }
  .hero-sub{ font-size:14.5px; }

  .hero-search{ flex-wrap:wrap; padding:10px; }
  .hs-icon{ display:none; }
  .hero-search input{ flex:1 1 100%; height:36px; }
  .hero-search .btn{ flex:1 1 100%; }
  .hero-hint{ font-size:12px; }

  .hero-stats{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hs-item{ padding:16px 14px; }
  .hs-item b{ font-size:21px; }
  .hs-item:nth-child(2n){ border-right:0; }
  .hs-item:nth-child(n+3){ border-top:1px solid var(--line-s); }

  .feat-grid,.field-grid,.steps{ grid-template-columns:minmax(0,1fr); }
  .feat{ padding:22px 20px; }
  .api-code pre{ font-size:11.5px; }
  .foot-bot{ flex-direction:column; align-items:flex-start; }
}