@charset "utf-8";
/* ==========================================================================
   必应SEO排名 主题：清爽科技蓝青（覆盖 base.css 变量 + 本页独有组件 bing-*）
   ========================================================================== */
:root{
  --brand:#0F6FD1;
  --brand-2:#22B8CF;
  --accent:#F97316;
  --bg:#FFFFFF;
  --bg-soft:#EEF7FF;
  --surface:#FFFFFF;
  --surface-2:#F4FAFF;
  --ink:#0B2545;
  --text:#173A5E;
  --muted:#5C7391;
  --border:rgba(11,37,69,.10);
  --border-strong:rgba(11,37,69,.18);
  --head-bg:rgba(255,255,255,.94);
  --head-text:#0B2545;
  --nav-hover-bg:rgba(15,111,209,.08);
  --foot-bg:#08192E;
  --foot-text:#B3C8DE;
  --foot-head:#FFFFFF;
  --foot-border:rgba(255,255,255,.12);
  --radius:16px;
  --radius-sm:12px;
  --shadow:0 20px 52px rgba(11,37,69,.10);
  --shadow-sm:0 8px 22px rgba(11,37,69,.07);
}
.bing-crumb-in{display:flex;flex-wrap:wrap;gap:8px}

/* ---------- 首屏：浅色底 + 大面积留白 ---------- */
.bing-hero{
  position:relative;padding:clamp(38px,4.6vw,72px) 0 clamp(42px,5vw,76px);
  background:
    radial-gradient(880px 400px at 90% -12%,rgba(34,184,207,.16),transparent 64%),
    linear-gradient(180deg,#F6FBFF 0%,#FFFFFF 78%);
  border-bottom:1px solid var(--border);
}
.bing-hero::before{
  content:"";position:absolute;inset:0;
  background-image:url("../pic/pattern-dots.svg");background-size:28px 28px;
  opacity:.4;pointer-events:none;
}
.bing-hero .container{position:relative;z-index:2}
.bing-grid-hero{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,58px);align-items:center}
.bing-grid-hero h1{margin:16px 0}
.bing-grid-hero .hero-lead{max-width:none}
.bing-hero-visual img{
  width:100%;border-radius:18px;background:#fff;
  border:1px solid rgba(15,111,209,.20);box-shadow:0 26px 64px rgba(11,37,69,.12);
}
.bing-hero .hero-cta-box{border-color:rgba(15,111,209,.18)}

/* ---------- 三段横向步骤条 ---------- */
.bing-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,40px);counter-reset:bs}
.bing-steps li{position:relative;padding-top:58px;border-top:2px solid rgba(15,111,209,.22)}
.bing-steps li::before{
  counter-increment:bs;content:"0" counter(bs);
  position:absolute;left:0;top:-23px;width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;font-size:15px;font-weight:900;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  box-shadow:0 10px 24px rgba(15,111,209,.26);
}
.bing-steps h3{font-size:17.5px;margin-bottom:9px}
.bing-steps p{font-size:14.4px;color:var(--muted);margin:0}

/* ---------- 两列编号描边服务卡 ---------- */
.bing-svc{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bing-svc>li{
  position:relative;padding:22px 24px 22px 78px;border-radius:14px;background:#fff;
  border:1px solid rgba(15,111,209,.28);transition:box-shadow .25s,border-color .25s;
}
.bing-svc>li:hover{border-color:var(--brand);box-shadow:0 16px 40px rgba(11,37,69,.10)}
.bing-svc b{
  position:absolute;left:22px;top:22px;width:42px;height:42px;border-radius:12px;
  display:grid;place-items:center;font-size:14px;font-weight:900;color:var(--brand);
  background:var(--bg-soft);border:1px solid rgba(15,111,209,.24);
}
.bing-svc h3{font-size:16.8px;margin-bottom:8px}
.bing-svc p{font-size:14.2px;color:var(--muted);margin:0}

/* ---------- 适合客户 + 痛点面板 ---------- */
.bing-fit{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(20px,3vw,36px);align-items:start}
.bing-fit-list{display:grid;gap:14px}
.bing-fit-list li{padding:18px 20px;border-radius:12px;background:#fff;border:1px solid var(--border);border-left:4px solid var(--brand-2)}
.bing-fit-list h3{font-size:16px;margin-bottom:7px}
.bing-fit-list p{font-size:14.2px;color:var(--muted);margin:0}
.bing-pain{padding:26px;border-radius:16px;background:#fff;border:1px solid rgba(11,37,69,.13);box-shadow:var(--shadow-sm)}
.bing-pain h3{margin-bottom:16px;font-size:17px}
.bing-pain ul{display:grid;gap:14px}
.bing-pain li{position:relative;padding-left:26px;font-size:14.3px;color:var(--text)}
.bing-pain li::before{content:"";position:absolute;left:0;top:9px;width:12px;height:12px;border-radius:3px;background:var(--accent);opacity:.85}
.bing-pain li b{color:var(--ink)}

/* ---------- 流程 ---------- */
.bing-flow{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(24px,4vw,52px);align-items:center}
.bing-flow-head{margin-bottom:22px}
.bing-flow-list{display:grid;gap:13px}
.bing-flow-list li{display:flex;gap:16px;padding:16px 18px;border-radius:13px;background:var(--surface-2);border:1px solid var(--border)}
.bing-flow-list b{
  flex:0 0 auto;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;
  font-size:13.5px;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));
}
.bing-flow-list h3{font-size:15.8px;margin-bottom:5px}
.bing-flow-list p{font-size:13.9px;color:var(--muted);margin:0}
.bing-flow-visual img{width:100%;border-radius:16px;border:1px solid var(--border);box-shadow:var(--shadow)}

/* ---------- 优势 ---------- */
.bing-adv{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bing-adv li{position:relative;overflow:hidden;padding:24px;border-radius:14px;background:#fff;border:1px solid var(--border)}
.bing-adv li::after{content:"";position:absolute;right:-32px;top:-32px;width:88px;height:88px;border-radius:50%;background:var(--bg-soft)}
.bing-adv b{position:relative;display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--bg-soft);color:var(--brand);font-size:13px;margin-bottom:12px}
.bing-adv h3{position:relative;font-size:16.4px;margin-bottom:8px}
.bing-adv p{position:relative;font-size:14.1px;color:var(--muted);margin:0}

/* ---------- 案例 ---------- */
.bing-case{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bing-case article{border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.bing-case img{width:100%;background:var(--surface-2);border-bottom:1px solid var(--border)}
.bing-case .bd{padding:20px 22px 24px}
.bing-case h3{font-size:16.6px;margin-bottom:9px}
.bing-case p{font-size:14.1px;color:var(--muted)}
.bing-case .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.bing-case .row span{font-size:12.4px;font-weight:700;color:var(--brand);background:var(--bg-soft);border-radius:999px;padding:4px 12px}

/* ---------- 价格 ---------- */
.bing-plan{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.bing-plan>li{display:flex;flex-direction:column;border-radius:16px;background:#fff;border:1px solid var(--border);overflow:hidden;padding-bottom:24px}
.bing-plan .hd{padding:18px 22px;background:var(--bg-soft);border-bottom:1px solid rgba(15,111,209,.18)}
.bing-plan .hd strong{display:block;font-size:17px;color:var(--ink)}
.bing-plan .hd em{font-style:normal;font-size:12.6px;color:var(--muted)}
.bing-plan-list{display:grid;gap:10px;padding:20px 22px 0}
.bing-plan-list li{position:relative;padding-left:22px;font-size:14px;color:var(--text)}
.bing-plan-list li::before{
  content:"";position:absolute;left:0;top:7px;width:14px;height:14px;border-radius:50%;
  background:var(--brand-2) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/9px 9px no-repeat;
}
.bing-plan .foot{margin:20px 22px 0;padding-top:16px;font-size:13.4px;color:var(--muted);border-top:1px dashed var(--border-strong)}

/* ---------- FAQ：两列并排 ---------- */
.faq.bing-faq{display:block;column-count:2;column-gap:18px;max-width:none}
.faq.bing-faq details{margin:0 0 12px;break-inside:avoid;page-break-inside:avoid}

/* ---------- 响应式 ---------- */
@media (max-width:1080px){
  .bing-grid-hero,.bing-fit,.bing-flow{grid-template-columns:1fr}
  .bing-hero-visual{order:-1}
  .bing-svc,.bing-case{grid-template-columns:1fr}
  .bing-adv,.bing-plan{grid-template-columns:1fr 1fr}
  .faq.bing-faq{column-count:1}
}
@media (max-width:720px){
  .bing-steps{grid-template-columns:1fr;gap:34px}
  .bing-steps li{border-top:0;border-left:2px solid rgba(15,111,209,.22);padding:0 0 0 62px}
  .bing-steps li::before{left:-23px;top:0}
  .bing-adv,.bing-plan{grid-template-columns:1fr}
  .bing-svc>li{padding:20px}
  .bing-svc b{position:static;margin-bottom:12px}
}
