/* ==========================================================================
   企业服务页 qiyefuwu.css —— 页面前缀 .qf-
   骨架：横幅(左文右图) → 服务对象 → 6宫格全景图 → 优势数据条 → 案例引用 → 四步流程 → FAQ → CTA
   ========================================================================== */

/* ---------- 1. 横幅 ---------- */
.qf-hero{padding-top:calc(var(--nav-h) + 40px)}
.qf-hero-in{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,60px);align-items:center}
.qf-hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.qf-hero-img img{border-radius:var(--r-lg);box-shadow:var(--shadow-md);border:1px solid var(--line);object-fit:cover;width:100%;height:auto}

/* ---------- 2. 服务对象 ---------- */
.qf-who{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.qf-who-item{
  background:var(--glass);border:1px solid var(--line);border-radius:var(--r-md);
  padding:24px 20px;transition:transform .35s,box-shadow .35s;
}
.qf-who-item:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.qf-who-item b{display:block;font-size:16px;margin-bottom:8px;color:var(--purple-deep)}
.qf-who-item span{font-size:13.5px;color:var(--ink-3)}

/* ---------- 3. 6 宫格全景图 ---------- */
.qf-map{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.qf-cell{
  background:var(--glass);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 26px;transition:transform .35s,box-shadow .35s,border-color .35s;display:block;
}
.qf-cell:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--purple-soft)}
.qf-cell.pink{background:linear-gradient(160deg,#fff,#FDF0F7);border-color:rgba(255,126,188,.35)}
.qf-cell.blue{background:linear-gradient(160deg,#fff,#EEF8FE);border-color:var(--line-2)}
.qf-cell-ico{
  width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  background:var(--purple-mist);color:var(--purple-deep);margin-bottom:16px;
}
.qf-cell-ico svg{width:26px;height:26px}
.qf-cell h3{font-size:18px;margin-bottom:10px}
.qf-cell p{font-size:14px;color:var(--ink-3)}

/* ---------- 4. 优势数据条 ---------- */
.qf-adv{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.qf-adv-num{font-size:clamp(36px,4.4vw,54px);font-weight:800;line-height:1.1;display:block}
.qf-adv-item p{margin-top:10px;font-size:14px;color:var(--ink-3)}

/* ---------- 5. 案例引用 ---------- */
.qf-case{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:center}
.qf-case-imgs{display:grid;gap:16px}
.qf-case-imgs img{border-radius:var(--r-lg);box-shadow:var(--shadow-md);object-fit:cover;width:100%;height:auto}
.qf-case-quote{
  position:relative;background:var(--glass);border:1px solid var(--line);
  border-left:4px solid var(--pink);border-radius:var(--r-lg);padding:clamp(26px,4vw,40px);
}
.qf-quote-mark{font-size:56px;line-height:1;color:var(--pink);font-family:Georgia,serif}
.qf-case-quote p{font-size:16px;color:var(--ink);margin:6px 0 18px;line-height:1.9}
.qf-case-quote footer b{display:block;font-size:14px;margin-bottom:8px;color:var(--ink-2)}
.qf-case-quote footer a{font-size:14px;color:var(--purple-deep);font-weight:600}
.qf-case-quote footer a:hover{color:var(--pink-deep)}

/* ---------- 6. 四步流程 ---------- */
.qf-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:qfstep}
.qf-step{
  position:relative;background:var(--glass);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:28px 22px;
}
.qf-step-no{font-size:34px;font-weight:800;color:var(--purple-soft);line-height:1;display:block;margin-bottom:12px}
.qf-step h3{font-size:17px;margin-bottom:8px}
.qf-step p{font-size:13.5px;color:var(--ink-3)}

/* ---------- 7. FAQ ---------- */
.qf-faq{max-width:820px}
.qf-faq-item{border:1px solid var(--line);border-radius:var(--r-md);background:var(--glass);margin-bottom:14px;overflow:hidden}
.qf-faq-item summary{cursor:pointer;padding:17px 22px;font-weight:600;font-size:15px;list-style:none;position:relative;padding-right:44px}
.qf-faq-item summary::-webkit-details-marker{display:none}
.qf-faq-item summary::after{content:"";position:absolute;right:20px;top:50%;width:10px;height:10px;border-right:2px solid var(--purple-deep);border-bottom:2px solid var(--purple-deep);transform:translateY(-70%) rotate(45deg);transition:transform .3s}
.qf-faq-item[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.qf-faq-item p{padding:0 22px 18px;font-size:14px;color:var(--ink-3)}
.qf-faq-more{margin-top:18px;font-size:14px;color:var(--ink-3)}
.qf-faq-more a{color:var(--purple-deep);font-weight:600}

/* ---------- 8. CTA ---------- */
.qf-cta{padding:clamp(56px,7vw,90px) 0;text-align:center;background:linear-gradient(140deg,#EDE6FC,#FDF1F8 55%,#DDF1FD)}
.qf-cta h2{font-size:clamp(24px,3.4vw,36px);margin-bottom:12px}
.qf-cta p{color:var(--ink-3);margin-bottom:26px}
.qf-cta .cta-btns{display:flex;justify-content:center;flex-wrap:wrap;gap:14px}

/* ---------- 响应式：1024 ---------- */
@media (max-width:1024px){
  .qf-hero-in{grid-template-columns:1fr}
  .qf-who{grid-template-columns:1fr 1fr}
  .qf-map{grid-template-columns:1fr 1fr}
  .qf-adv{grid-template-columns:1fr 1fr;gap:32px 20px}
  .qf-case{grid-template-columns:1fr}
  .qf-flow{grid-template-columns:1fr 1fr}
}
/* ---------- 响应式：768 ---------- */
@media (max-width:768px){
  .qf-hero{padding-top:calc(var(--nav-h) + 24px)}
}
/* ---------- 响应式：480 ---------- */
@media (max-width:480px){
  .qf-who,.qf-map,.qf-flow{grid-template-columns:1fr}
  .qf-adv{grid-template-columns:1fr 1fr}
  .qf-hero-cta .btn,.qf-cta .btn{width:100%}
}

/* ---------- 新增：服务数据条 ---------- */
.qf-strip{background:linear-gradient(135deg,#f8f4ff,#fff5f9)}
.qf-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.qf-num{padding:30px 20px;text-align:center}
.qf-num .grad-text{font-size:34px;font-weight:800;margin-bottom:10px}
.qf-num p{font-size:14px;color:var(--ink-3)}
.qf-note{max-width:820px;margin:26px auto 0;text-align:center;font-size:14px;color:var(--ink-3);line-height:1.9;background:#fff;border:1px dashed var(--line);border-radius:var(--r-md);padding:18px 22px}

/* ---------- 新增：企业服务 FAQ ---------- */
.qf-faqbox{max-width:840px}
.sec-sub{max-width:820px;margin:-6px auto 30px;text-align:center;font-size:14px;color:var(--ink-3);line-height:1.9}
.qf-q{border:1px solid var(--line);border-radius:var(--r-md);background:#fff;margin-bottom:13px;overflow:hidden}
.qf-q summary{cursor:pointer;padding:16px 22px;font-weight:600;font-size:15px;list-style:none;position:relative;padding-right:44px}
.qf-q summary::-webkit-details-marker{display:none}
.qf-q summary::after{content:"";position:absolute;right:20px;top:50%;width:10px;height:10px;border-right:2px solid var(--purple-deep);border-bottom:2px solid var(--purple-deep);transform:translateY(-70%) rotate(45deg);transition:transform .3s}
.qf-q[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.qf-q p{padding:0 22px 16px;font-size:14px;color:var(--ink-3);line-height:1.85}

@media (max-width:768px){
  .qf-nums{grid-template-columns:1fr 1fr}
}
