/* ============================================================
   zixun.css · 在线即时咨询专属样式
   ============================================================ */

/* ---------- 题头：图底蒙层 ---------- */
.zx-hero{
  position:relative;
  padding:calc(var(--header-h) + 90px) 0 110px;
  color:#fff;
}
.zx-hero-bg{position:absolute;inset:0;z-index:-2}
.zx-hero-bg img{width:100%;height:100%;object-fit:cover}
.zx-hero-mask{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(22,48,72,.85),rgba(37,104,157,.6));
}
.zx-hero .breadcrumb a{color:var(--blue-200)}
.zx-hero .breadcrumb span{color:rgba(255,255,255,.65)}
.zx-hero .bc-now{color:#fff}
.zx-hero h1{color:#fff;margin:12px 0 14px}
.zx-hero p{color:rgba(255,255,255,.92);font-size:15.5px;max-width:560px;line-height:1.9}

/* ---------- 咨询入口矩阵 ---------- */
.zx-entry{padding:50px 0 20px;background:var(--white)}
.entry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.entry-card{
  position:relative;display:flex;flex-direction:column;gap:8px;
  background:var(--blue-50);border:1px solid var(--blue-100);
  border-radius:var(--radius-m);padding:28px 26px;
  transition:transform var(--trans),box-shadow var(--trans);
}
.entry-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-m);background:var(--blue-100)}
.entry-tag{
  position:absolute;top:18px;right:18px;
  font-size:11px;font-weight:700;color:var(--blue-700);
  background:#fff;border:1px solid var(--blue-200);
  border-radius:999px;padding:3px 10px;
}
.entry-card h3{font-size:16px}
.entry-num{font-size:22px;font-weight:800;color:var(--gray-900);letter-spacing:.5px}
.entry-card p{font-size:13px;color:var(--gray-600);line-height:1.8}
.entry-note{
  margin-top:22px;font-size:13px;color:var(--gray-500);line-height:1.9;
  background:var(--gray-50);border-radius:var(--radius-s);padding:14px 18px;
}

/* ---------- 手风琴 FAQ ---------- */
.zx-faq{padding:60px 0;background:var(--white)}
.narrow-zx{max-width:860px}
.acc{display:flex;flex-direction:column;gap:12px}
.acc-item{
  background:var(--gray-50);border:1px solid var(--gray-100);
  border-radius:var(--radius-m);overflow:hidden;
}
.acc-item summary{
  cursor:pointer;list-style:none;
  padding:18px 22px;font-size:15px;font-weight:600;color:var(--gray-900);
  position:relative;padding-right:44px;
}
.acc-item summary::-webkit-details-marker{display:none}
.acc-item summary::after{
  content:"+";position:absolute;right:20px;top:50%;
  transform:translateY(-50%);
  font-size:20px;color:var(--blue-500);font-weight:400;
  transition:transform var(--trans);
}
.acc-item[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.acc-item p{
  padding:0 22px 18px;font-size:13.5px;color:var(--gray-600);line-height:1.9;
}

/* ---------- 表单 + 服务时间 ---------- */
.zx-formzone{padding:70px 0 90px;background:var(--gray-50)}
.zx-two{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}
.zx-form h2{margin-bottom:8px}
.zx-form-sub{font-size:13.5px;color:var(--gray-500);margin-bottom:22px}
.zx-hours{
  background:var(--white);border-radius:var(--radius-m);
  padding:28px 30px;box-shadow:var(--shadow-s);
}
.zx-hours h2{font-size:18px;margin-bottom:16px}
.hours-list{border-top:1px solid var(--gray-100)}
.hours-list li{
  display:flex;justify-content:space-between;align-items:center;
  padding:13px 0;border-bottom:1px solid var(--gray-100);
  font-size:14px;
}
.hours-list strong{color:var(--gray-800)}
.hours-list span{color:var(--gray-500);font-size:13.5px}
.hours-note{font-size:12.5px;color:var(--gray-400);margin:14px 0 18px;line-height:1.8}
.hours-links{display:flex;gap:10px;flex-wrap:wrap}

/* ---------- 三种入口使用场景对照 ---------- */
.zx-scene{padding:30px 0 10px;background:var(--white)}
.scene-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.scene{
  background:var(--gray-50);border-radius:var(--radius-m);
  padding:24px 22px;border-top:3px solid var(--blue-400);
}
.scene h3{font-size:15.5px;margin-bottom:10px}
.scene p{font-size:13px;color:var(--gray-600);line-height:1.9}

/* ---------- 响应式 ---------- */
@media (max-width:920px){
  .entry-grid,.zx-two{grid-template-columns:1fr;gap:20px}
  .scene-grid{grid-template-columns:1fr}
}