@charset "utf-8";
/* ==========================================================================
   智联迅飞 usana.net.cn · 补充样式（在 base.css 之后加载）
   基座沿用蓝白科技风：主色 #236DFF / 浅蓝底 #EFF6FF / 强调橙 #EC9A27
   本文件只写参考站没有的模块：双电话悬浮栏 / 返回列表 / 内页头图 / 分类筛选 / FAQ
   ========================================================================== */

/* ---------- 右侧悬浮栏：两个电话 + 二维码常驻 ----------
   两个号码是硬需求（19535286731 / 13501276137），所以电话卡改成
   一行号码 + 一行小字说明，两张卡并排会撑爆 168px 宽度，必须竖排压扁。
   整栏高度约 470px，视口矮于 760px 时隐藏二维码说明文字，避免溢出屏幕。 */
.side .tel{height:auto;padding:9px 0 8px;gap:1px}
.side .tel .num{font-size:14.5px;letter-spacing:-.3px}
.side .tel .lb{font-size:11px;font-weight:400;color:var(--gray2);letter-spacing:.2px}
.side .tel .ic{font-size:17px;line-height:1;margin-bottom:1px}
@media(max-height:820px){
  .side .wechat .cap,.side .wechat .tip{display:none}
  .side .wechat .wbd{padding:7px}
  .side .wechat .wbd img{width:132px;height:132px}
}
@media(max-height:700px){
  .side .wechat{display:none}
}

/* ---------- 内页：返回列表（上下各一处，给爬虫和人都留出口） ---------- */
.backbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:14px 0 0;
}
.backbar a{
  display:inline-flex;align-items:center;gap:7px;
  height:34px;padding:0 15px;border-radius:999px;
  border:1px solid var(--line);background:#fff;
  font-size:13px;color:var(--gray);box-shadow:var(--shadow-sm);
}
.backbar a:hover{border-color:var(--blue);color:var(--blue)}
.backbar a svg{width:13px;height:13px}
.backbar .pos{margin-left:auto;font-size:12.5px;color:var(--gray2)}
.art-back{
  margin-top:30px;padding:18px 0;border-top:1px solid var(--line2);
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.art-back .lnk{
  display:inline-flex;align-items:center;gap:8px;
  padding:0 22px;height:42px;border-radius:999px;
  background:var(--blue-pale);color:var(--blue);font-size:13.5px;font-weight:600;
}
.art-back .lnk:hover{background:var(--blue);color:#fff}
.art-back .hint{font-size:12.5px;color:var(--gray2)}

/* ---------- 内页：页头（浅蓝渐变 + 大标题） ---------- */
.phero{
  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,#DDEEFF 0%,#EEF6FF 55%,#FFFFFF 100%);
  padding:56px 0 64px;
}
.phero .silk{
  position:absolute;inset:-20%;z-index:0;pointer-events:none;
  background:
    radial-gradient(34% 44% at 74% 34%, rgba(84,154,255,.55), rgba(84,154,255,0) 70%),
    radial-gradient(30% 40% at 22% 62%, rgba(120,178,255,.50), rgba(120,178,255,0) 70%),
    radial-gradient(26% 30% at 50% 10%, rgba(255,255,255,.95), rgba(255,255,255,0) 72%);
  filter:blur(28px);transform:rotate(-8deg) scale(1.15);
}
.phero .in{position:relative;z-index:1;max-width:900px}
.phero .en{display:block;font-size:11px;letter-spacing:1.8px;color:var(--blue);font-weight:700;margin-bottom:10px}
.phero h1{font-size:34px;font-weight:800;line-height:1.45;letter-spacing:.6px;color:var(--ink)}
.phero h1 em{font-style:normal;color:var(--blue)}
.phero .sub{margin-top:14px;font-size:15px;color:#4A6788;line-height:1.9;max-width:760px}
.phero .acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.phero .acts a{
  display:inline-flex;align-items:center;height:44px;padding:0 26px;border-radius:999px;
  font-size:14px;font-weight:600;
}
.phero .acts .p1{background:var(--blue);color:#fff;box-shadow:0 10px 24px rgba(35,109,255,.28)}
.phero .acts .p1:hover{background:var(--blue-d)}
.phero .acts .p2{background:#fff;color:var(--blue);border:1px solid #CFE1FB}
.phero .acts .p2:hover{border-color:var(--blue)}

/* ---------- 三卡痛点 / 交付 ---------- */
.pain .row,.deliver .row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pain .fo .p1,.deliver .fo .p1{font-size:17px}
.pain .fo{padding:30px 26px 26px}
.pain .fo .no{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:9px;background:var(--blue-pale);
  color:var(--blue);font-size:13px;font-weight:700;margin-bottom:14px;
}

/* ---------- 勾选清单 ---------- */
.check{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 26px;margin-top:8px}
.check li{
  position:relative;padding-left:30px;font-size:14px;color:#3A3A46;line-height:1.9;
}
.check li::before{
  content:"";position:absolute;left:0;top:.55em;width:18px;height:18px;border-radius:50%;
  background:var(--blue-pale);
}
.check li::after{
  content:"";position:absolute;left:6px;top:1.03em;width:6px;height:3px;
  border-left:2px solid var(--blue);border-bottom:2px solid var(--blue);
  transform:rotate(-45deg);
}

/* ---------- 分栏说明（左标题右内容） ---------- */
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:start}
.split h3{font-size:20px;font-weight:700;line-height:1.6;color:var(--ink)}
.split h3 span{color:var(--blue)}
.split p{font-size:13.5px;color:var(--gray);line-height:2;margin-top:12px}
.split .box{
  border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;
  box-shadow:var(--shadow);padding:28px 30px;
}

/* ---------- 分类筛选 ---------- */
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 6px}
.chips a{
  display:inline-flex;align-items:center;height:36px;padding:0 18px;border-radius:999px;
  border:1px solid var(--line);background:#fff;font-size:13.5px;color:var(--gray);
}
.chips a:hover{border-color:var(--blue);color:var(--blue)}
.chips a.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}

/* ---------- FAQ ---------- */
.faq{margin-top:8px}
.faq .q{
  border:1px solid var(--line);border-radius:var(--r);background:#fff;
  box-shadow:var(--shadow-sm);padding:22px 26px;margin-bottom:14px;
}
.faq .q b{display:block;font-size:15.5px;font-weight:700;color:var(--ink);line-height:1.7}
.faq .q b::before{content:"Q";display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:7px;background:var(--blue);color:#fff;
  font-size:12px;margin-right:10px;vertical-align:1px}
.faq .q p{margin-top:10px;font-size:13.5px;color:var(--gray);line-height:2}

/* ---------- 行业客户（4 列） ---------- */
.ind-row{display:grid;grid-template-columns:repeat(4,1fr)}
.ind-row .mg{border-right:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.ind-row .mg:nth-child(4n){border-right:0}
.ind-row .mg:nth-child(n+5){border-bottom:0}
.ind-row .mg b{display:block;font-size:14.5px;color:var(--ink);font-weight:700}
.ind-row .mg i{display:block;font-style:normal;margin-top:6px;font-size:12px;color:var(--gray2);line-height:1.7}

/* ---------- 相关文章（内页底部） ---------- */
.rel{margin-top:34px}
.rel .rh{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-bottom:12px;border-bottom:1px solid var(--line2);font-size:16px;font-weight:700;color:var(--ink)}
.rel .rh a{font-size:13px;font-weight:600;color:var(--blue)}

/* ---------- 响应式 ---------- */
@media(max-width:900px){
  .pain .row,.deliver .row,.check,.split{grid-template-columns:1fr}
  .ind-row{grid-template-columns:repeat(2,1fr)}
  .phero h1{font-size:26px}
  .side{display:none}
  .wrap{max-width:100%!important}
}

/* ---------- 三卡等高：把「了解更多」压到卡片底部对齐 ---------- */
.feature .fo{display:flex;flex-direction:column}
.feature .fo p{flex:1 1 auto;min-height:0}
.feature .fo .flk{margin-top:16px}

/* ---------- 行业客户（纯文字版，去掉重复图标） ---------- */
.ind-row .mg{padding:30px 18px 26px;text-align:center}
.ind-row .mg b{font-size:16px;letter-spacing:.3px}
.ind-row .mg i{margin-top:8px;font-size:12.5px;color:var(--gray);line-height:1.8}
.ind-row .mg::after{
  content:"";display:block;width:18px;height:3px;border-radius:2px;
  background:var(--blue-pale2);margin:12px auto 0;
  transition:width .2s,background .2s;
}
.ind-row .mg:hover::after{width:34px;background:var(--blue)}

/* ---------- 品牌字标：照官网那个「斜切黑体」做 ----------
   官网原图是 900 字重、整块向右倾斜的粗黑体字标。
   用系统黑体 + skewX(-9deg) 复刻，四个字不依赖外链字体，任何设备都不会掉字。 */
.wm{
  font-family:"Source Han Sans SC","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-weight:900;
  letter-spacing:.5px;
  display:inline-block;
  transform:skewX(-13deg) scaleX(1.03);
  transform-origin:0 62%;
  -webkit-text-stroke:.55px currentColor;
  paint-order:stroke fill;
}

/* ---------- 电话点击复制 ---------- */
.side button.tel{width:100%;cursor:pointer;font-family:inherit;border:1px solid var(--line)}
.side button.tel .cp{margin-top:3px}
.side button.tel:hover{border-color:var(--blue)}
.side button.tel.done{border-color:#22A06B;background:#F6FDF9}
.cp{
  display:inline-block;font-size:10.5px;line-height:1.55;padding:1px 7px;
  border-radius:6px;border:1px dashed #CBD8EA;color:#7A879B;margin-top:4px;
}
.side button.tel.done .cp{border-color:#22A06B;color:#22A06B;background:#E9F8F1}

button.cb-item{width:100%;text-align:left;font-family:inherit;cursor:pointer;border:1px solid var(--line)}
button.cb-item:hover{border-color:var(--blue);transform:translateY(-2px);box-shadow:0 12px 26px rgba(13,12,34,.08)}
button.cb-item:active{transform:translateY(0)}

.fcopy{
  background:none;border:0;padding:0;font-family:inherit;cursor:pointer;
  font-size:13px;color:#9AA0AA;line-height:2.3;text-align:left;
}
.fcopy span{
  display:inline-block;margin-left:8px;font-size:10.5px;color:#6E7787;
  border:1px dashed #4A4A4A;border-radius:5px;padding:0 5px;
}
.fcopy:hover{color:#fff}
.fcopy:hover span{border-color:#9AA0AA;color:#C9CDD4}

/* ---------- 复制成功提示 ---------- */
.toast{
  position:fixed;left:50%;bottom:42px;z-index:9999;
  transform:translate(-50%,18px);opacity:0;pointer-events:none;
  background:rgba(13,12,34,.92);color:#fff;font-size:13.5px;
  padding:10px 22px;border-radius:999px;
  box-shadow:0 14px 34px rgba(13,12,34,.28);
  transition:opacity .24s,transform .24s;
}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ==================================================================
   LOGO 样板页
   ================================================================== */
.logo-hero{padding:54px 0 10px}
.logo-hero h1{font-size:32px;font-weight:800;letter-spacing:.5px}
.logo-hero p{margin-top:12px;font-size:14px;color:var(--gray);line-height:1.95;max-width:780px}

.logo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;padding:34px 0 20px}
.lcard{
  border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;
  box-shadow:var(--shadow-sm);padding:26px 26px 24px;
}
.lcard .no{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:30px;height:26px;padding:0 9px;border-radius:8px;
  background:var(--blue-pale);color:var(--blue);font-size:12.5px;font-weight:800;letter-spacing:.5px;
}
.lcard h3{margin-top:12px;font-size:16.5px;font-weight:700;color:var(--ink)}
.lcard .note{margin-top:6px;font-size:12.5px;color:var(--gray2);line-height:1.8}
.lcard .stage{
  margin-top:18px;padding:26px 22px;border-radius:14px;
  background:#fff;border:1px solid var(--line2);
  display:flex;align-items:center;justify-content:center;min-height:132px;
}
.lcard .stage.dark{background:#101830;border-color:#101830}
.lcard .stage.blue{background:linear-gradient(112deg,#EFF6FF,#F7FBFF 60%,#E4EFFF);border-color:#DBE9FB}

.lk{display:flex;align-items:center;gap:12px;max-width:100%}
.lcard .stage{overflow:hidden}
.lk .mk{width:46px;height:46px;flex:none;border-radius:12px}
.lk .tx b{display:block;font-size:27px;line-height:1.1;color:var(--ink)}
.lk .tx i{display:block;font-style:normal;margin-top:4px;font-size:9.5px;letter-spacing:1.2px;color:#9CA3AF}
.lk.lg .mk{width:64px;height:64px;border-radius:16px}
.lk.lg .tx b{font-size:42px}
.lk.lg .tx i{letter-spacing:1.6px;font-size:10.5px;margin-top:6px}
.lk.sm .mk{width:32px;height:32px;border-radius:8px}
.lk.sm .tx b{font-size:18px}
.lk.sm .tx i{font-size:8.5px;margin-top:2px}
.stage.dark .lk .tx b{color:#fff}
.stage.dark .lk .tx i{color:#7C8AA8}

.navprev{
  margin-top:18px;padding-top:16px;border-top:1px dashed var(--line2);
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.navprev .bar{
  display:flex;align-items:center;gap:14px;padding:8px 14px;border-radius:12px;
  background:#FAFCFF;border:1px solid var(--line2);
}
.navprev .bar span{font-size:12.5px;color:#3A3A46}
.navprev .bar span.on{color:var(--blue);font-weight:600}
.lcard.pick{cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .18s}
.lcard.pick:hover{border-color:var(--blue);box-shadow:0 16px 34px rgba(35,109,255,.14);transform:translateY(-2px)}
.lcard.wide{grid-column:span 2}
.pickbar{
  margin:26px 0 54px;padding:20px 24px;border-radius:var(--r);
  background:var(--blue-pale);border:1px solid #D8E8FF;
  font-size:13.5px;color:#2C4A75;line-height:1.95;
}
@media(max-width:900px){.logo-grid{grid-template-columns:1fr}.lcard.wide{grid-column:span 1}}

/* ==================================================================
   第二批 Logo 样板：字标 / 场景 / 并排对比
   ================================================================== */

/* 双色字标：11° 右斜、字距收紧、「智联」深墨「迅飞」主蓝 */
.wm2{
  font-family:"Source Han Sans SC","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-weight:900;
  letter-spacing:-.5px;
  display:inline-block;
  color:#111C33;
  transform:skewX(-11deg);
  transform-origin:0 62%;
  -webkit-text-stroke:.85px currentColor;
  paint-order:stroke fill;
  white-space:nowrap;
}
.wm2 span{color:var(--blue)}
.stage.dark .wm2{color:#FFFFFF}
.stage.dark .wm2 span{color:#82AEFF}

/* 批次切换 */
.loswitch{display:inline-flex;gap:4px;padding:4px;border-radius:10px;background:#F1F5FB;margin-bottom:18px}
.loswitch a{
  padding:6px 15px;border-radius:7px;font-size:12.5px;font-weight:600;color:#6E7A90;
  text-decoration:none;transition:.18s;
}
.loswitch a.on{background:#fff;color:var(--blue);box-shadow:0 2px 8px rgba(16,32,64,.1)}

.logo-hero p.sm{font-size:12.5px;color:#8A93A6;margin-top:10px;max-width:820px}

/* 卡片头部：编号 + 定位标签 */
.lcard .chd{display:flex;align-items:center;gap:10px}
.lcard .tagx{
  font-size:11px;color:var(--blue);background:var(--blue-pale);
  padding:3px 9px;border-radius:6px;font-weight:600;letter-spacing:.2px;
}

/* 场景容器 */
.scenes{display:grid;gap:12px;margin-top:18px}
.logo-grid > .lcard:nth-child(5){grid-column:span 2}
.logo-grid > .lcard:nth-child(5) .scenes{grid-template-columns:1fr 1fr}
.logo-grid > .lcard:nth-child(5) .minis{grid-column:1/-1}
.logo-grid > .lcard:nth-child(5) .lk.lg .tx b{font-size:48px}
.logo-grid > .lcard:nth-child(5) .lk.lg .mk{width:72px;height:72px}

.stage{min-height:150px}
.stage.dark{min-height:150px}

.minis{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mini{border:1px solid var(--line2);border-radius:12px;padding:12px 14px 14px;background:#FCFDFF}
.mini .lbl{display:block;font-size:10.5px;color:#9AA3B4;letter-spacing:.4px;margin-bottom:9px}

.nb{
  display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #E7EDF6;
  border-radius:9px;padding:7px 10px;box-shadow:0 2px 6px rgba(16,32,64,.05);overflow:hidden;
}
.nb .lk .tx i{display:none}
.nb .nl{font-size:10px;color:#7D8799;white-space:nowrap}
.nb .nl.on{color:var(--blue);font-weight:600}
.nb .nl:first-of-type{margin-left:auto}

.frow{display:flex;align-items:center;gap:10px}
.favbox{
  width:32px;height:32px;border-radius:8px;background:#fff;border:1px solid #E4EAF4;
  display:inline-flex;align-items:center;justify-content:center;overflow:hidden;flex:none;
  box-shadow:0 2px 5px rgba(16,32,64,.06);
}
.favbox .mk{width:24px;height:24px;border-radius:0}
.favbox.dark{background:#101830;border-color:#101830}
.favbox.inn{background:var(--blue);border:none}
.favbox.inn .mk{width:32px;height:32px}
.favbox .fi{font-size:15px;font-weight:900;color:#111C33;line-height:1}
.favbox.rnd{border-radius:50%}
.favbox.rnd .mk{width:26px;height:26px}
.favbox.inn .fi{color:#fff}

/* 并排对比条 */
.stripwrap{margin:34px 0 6px}
.stripwrap h4{font-size:13.5px;color:#44506A;font-weight:700;margin-bottom:14px}
.strip{
  display:flex;flex-wrap:wrap;align-items:center;gap:0;
  border:1px solid var(--line);border-radius:var(--r);background:#fff;
  box-shadow:var(--shadow-sm);overflow:hidden;
}
.strip .sw{flex:1 1 0;min-width:200px;padding:20px 18px;display:flex;justify-content:center;border-right:1px solid var(--line2)}
.strip .sw:last-child{border-right:0}
.lcard .stage.blue{background:linear-gradient(112deg,#EFF6FF,#F7FBFF 60%,#E4EFFF)}

@media(max-width:900px){
  .logo-grid > .lcard:nth-child(5){grid-column:span 1}
  .logo-grid > .lcard:nth-child(5) .scenes{grid-template-columns:1fr}
  .minis{grid-template-columns:1fr}
  .strip .sw{min-width:50%;border-bottom:1px solid var(--line2)}
}

.lk.lg .tx b{line-height:1.02}
.lk .tx{display:flex;flex-direction:column;justify-content:center}

/* 深色底上，只有深墨色图标需要一圈描边，否则糊成一片 */
.stage.dark.sep .mk{box-shadow:0 0 0 1px rgba(255,255,255,.22);border-radius:16px}

/* ---------- 08 号定版：页头 / 页脚的字标配比 ---------- */
.logo .mk{width:34px;height:34px;border-radius:10px}
.logo{gap:11px}
.logo .tx b.wm2{font-size:21px;letter-spacing:0;line-height:1.12;-webkit-text-stroke:0;padding-right:2px}
.logo .tx i{font-size:9px;letter-spacing:.6px;color:#94A0B4}
.logo .tx b.wm2 span{color:var(--blue)}
.fcol .logo .mk{width:34px;height:34px;border-radius:10px}
.fcol .logo .wm2{font-size:19.5px;color:#FFFFFF;letter-spacing:0;-webkit-text-stroke:0}
.fcol .logo .wm2 span{color:#82AEFF}
.fcol .logo{gap:10px}
@media(max-width:760px){
  .logo .mk{width:32px;height:32px;border-radius:9px}
  .logo .tx b.wm2{font-size:17px}
  .logo .tx i{font-size:8px}
}

.picked{
  margin:24px 0 4px;padding:16px 22px;border-radius:12px;
  background:#F2FBF6;border:1px solid #CBEBD8;color:#1F6B46;
  font-size:13.5px;line-height:1.9;display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;
}
.picked b{color:#12784C;font-weight:800}
.picked span{color:#4E7A65}


/* ---------- 页脚联系方式：纯展示，不做点击复制 ---------- */
.fcol .ftel{
  display:inline-block;font-size:13.5px;line-height:2.35;color:#C9CDD4;
  letter-spacing:.6px;font-variant-numeric:tabular-nums;
}
.fcol .fqr{margin-top:14px}
.fcol .fqr .ft b{margin-right:2px}
