/* ============================================================
   yfxerp.com · 支持服务体系页面专属样式（support 系列共用）
   ============================================================ */

/* ---------- 服务总览 Hero ---------- */
.support-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,#E8F2FE 0%,#f4faf8 55%,#E4F7EF 100%);
  padding:110px 0 90px;text-align:center;
}
.support-hero::before{
  content:"";position:absolute;left:-80px;top:-80px;width:340px;height:340px;
  background:radial-gradient(circle,rgba(47,124,246,.16),transparent 65%);border-radius:50%;
}
.support-hero::after{
  content:"";position:absolute;right:-60px;bottom:-120px;width:420px;height:420px;
  background:radial-gradient(circle,rgba(46,191,139,.14),transparent 65%);border-radius:50%;
}
.support-hero .container{position:relative;z-index:2}
.support-hero h1{font-size:clamp(30px,4.2vw,46px);color:#152A3F;margin:14px 0 14px;letter-spacing:1px}
.support-hero h1 em{font-style:normal;background:linear-gradient(90deg,#2F7CF6,#2EBF8B);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.support-hero p{max-width:680px;margin:0 auto;color:#5a6d85;font-size:16px;line-height:1.9}

/* 服务承诺条 */
.sv-promise{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px;
}
.sv-promise .sp-item{
  background:rgba(255,255,255,.86);border:1px solid rgba(47,124,246,.12);border-radius:14px;
  padding:22px 16px;backdrop-filter:blur(6px);transition:.3s;
}
.sv-promise .sp-item:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(31,95,216,.10);border-color:rgba(47,124,246,.32)}
.sv-promise .sp-ic{width:44px;height:44px;margin:0 auto 12px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff}
.sv-promise h4{font-size:16px;color:#152A3F;margin-bottom:6px}
.sv-promise p{font-size:12.5px;color:#7b8ba0;line-height:1.7;margin:0}

/* ---------- 服务项目入口 ---------- */
.sv-entry{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.sv-entry .se-card{
  background:#fff;border:1px solid #eaf1fa;border-radius:16px;padding:30px 24px;
  text-align:center;transition:.32s;position:relative;overflow:hidden;
}
.sv-entry .se-card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,#2F7CF6,#2EBF8B);opacity:0;transition:.32s;
}
.sv-entry .se-card:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(21,42,63,.08);border-color:transparent}
.sv-entry .se-card:hover::before{opacity:1}
.sv-entry .se-ic{width:64px;height:64px;margin:0 auto 18px;border-radius:18px;display:flex;align-items:center;justify-content:center;color:#fff;transition:.32s}
.sv-entry .se-card:hover .se-ic{transform:scale(1.08) rotate(-3deg)}
.sv-entry h3{font-size:18px;color:#152A3F;margin-bottom:8px}
.sv-entry p{font-size:13.5px;color:#7b8ba0;line-height:1.8;margin-bottom:16px;min-height:48px}
.sv-entry .se-link{color:#2F7CF6;font-weight:600;font-size:14px;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.sv-entry .se-link:hover{gap:10px;color:#1E5FD8}

/* ---------- 支持流程 ---------- */
.sv-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;counter-reset:svf}
.sv-flow .sf-step{position:relative;background:#fff;border:1px solid #eaf1fa;border-radius:14px;padding:26px 18px 22px;text-align:center}
.sv-flow .sf-step::before{
  counter-increment:svf;content:counter(svf,decimal-leading-zero);
  position:absolute;top:-14px;right:14px;font-size:44px;font-weight:800;line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(47,124,246,.28);
}
.sv-flow .sf-ic{width:46px;height:46px;margin:0 auto 12px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff}
.sv-flow h4{font-size:15.5px;color:#152A3F;margin-bottom:6px}
.sv-flow p{font-size:12.5px;color:#7b8ba0;line-height:1.7;margin:0}

/* ---------- 常见问题（支持页精简版） ---------- */
.sv-faq{max-width:860px;margin:0 auto}
.sv-faq .faq-item{
  background:#fff;border:1px solid #eaf1fa;border-radius:14px;margin-bottom:14px;overflow:hidden;
}
.sv-faq .faq-q{display:flex;align-items:center;gap:12px;padding:20px 24px;cursor:pointer;font-size:16px;font-weight:600;color:#152A3F;user-select:none}
.sv-faq .faq-q .fq-num{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#E8F2FE,#E4F7EF);color:#1E5FD8;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex:none}
.sv-faq .faq-q .fq-arrow{margin-left:auto;width:26px;height:26px;border-radius:50%;background:#f2f7ff;display:flex;align-items:center;justify-content:center;color:#2F7CF6;transition:.3s;flex:none}
.sv-faq .faq-item.open .fq-arrow{transform:rotate(180deg);background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff}
.sv-faq .faq-a{display:none;padding:0 24px 20px 66px;font-size:14px;color:#5a6d85;line-height:2}

/* ---------- 联系我们条 ---------- */
.sv-contact{
  background:linear-gradient(120deg,#152A3F,#1E3a5c);border-radius:20px;padding:46px 50px;
  display:flex;align-items:center;justify-content:space-between;gap:30px;color:#fff;position:relative;overflow:hidden;
}
.sv-contact::before{
  content:"";position:absolute;right:-60px;top:-60px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(46,191,139,.25),transparent 60%);
}
.sv-contact h2{font-size:26px;margin-bottom:8px}
.sv-contact p{color:#aebcd0;font-size:14.5px;margin:0;line-height:1.8}
.sv-contact .sv-ct-actions{display:flex;gap:14px;position:relative;z-index:2;flex:none}
.sv-contact .sv-phone{font-size:26px;font-weight:700;color:#5ef0bd;letter-spacing:1px}

/* ============ 下载中心 ============ */
.dl-tabs{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:36px}
.dl-tabs .dl-tab{
  padding:10px 22px;border-radius:999px;border:1px solid #dbe7f5;background:#fff;color:#5a6d85;
  font-size:14px;cursor:pointer;transition:.3s;
}
.dl-tabs .dl-tab.active{background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff;border-color:transparent;box-shadow:0 8px 20px rgba(47,124,246,.28)}
.dl-panel{display:none}
.dl-panel.active{display:block}
.dl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.dl-card{
  background:#fff;border:1px solid #eaf1fa;border-radius:16px;padding:28px 24px;text-align:center;transition:.32s;position:relative;
}
.dl-card:hover{transform:translateY(-5px);box-shadow:0 14px 36px rgba(21,42,63,.08)}
.dl-card .dl-ic{width:60px;height:60px;margin:0 auto 16px;border-radius:16px;display:flex;align-items:center;justify-content:center;color:#fff}
.dl-card h4{font-size:16px;color:#152A3F;margin-bottom:6px}
.dl-card p{font-size:12.5px;color:#7b8ba0;line-height:1.7;margin-bottom:14px}
.dl-card .dl-meta{font-size:12px;color:#a4b2c4;margin-bottom:14px}
.dl-card .dl-btn{display:inline-block;padding:9px 22px;border-radius:999px;font-size:13.5px;font-weight:600;color:#2F7CF6;background:#E8F2FE;text-decoration:none;transition:.3s}
.dl-card .dl-btn:hover{background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff}
.dl-card .dl-btn.green{color:#1f9d72;background:#E4F7EF}
.dl-card .dl-btn.green:hover{background:linear-gradient(135deg,#2EBF8B,#1f9d72);color:#fff}

/* 下载文档列表 */
.dl-list{background:#fff;border:1px solid #eaf1fa;border-radius:16px;overflow:hidden}
.dl-row{display:flex;align-items:center;gap:16px;padding:18px 26px;border-bottom:1px solid #f0f5fb;transition:.25s}
.dl-row:last-child{border-bottom:none}
.dl-row:hover{background:#f7fbfe}
.dl-row .dr-ic{width:42px;height:42px;border-radius:10px;background:linear-gradient(135deg,#E8F2FE,#E4F7EF);display:flex;align-items:center;justify-content:center;color:#1E5FD8;flex:none}
.dl-row .dr-info{flex:1}
.dl-row .dr-info b{font-size:15px;color:#152A3F;display:block;margin-bottom:4px}
.dl-row .dr-info span{font-size:12.5px;color:#8b9bb0}
.dl-row .dr-size{font-size:13px;color:#8b9bb0;flex:none}
.dl-row .dr-btn{padding:8px 20px;border-radius:999px;font-size:13px;font-weight:600;color:#fff;background:linear-gradient(135deg,#2F7CF6,#1E5FD8);text-decoration:none;flex:none;transition:.3s}
.dl-row .dr-btn:hover{box-shadow:0 8px 20px rgba(47,124,246,.3);transform:translateY(-1px)}

/* ============ FAQ 页 ============ */
.faq-hero{background:linear-gradient(135deg,#E8F2FE 0%,#f4faf8 60%,#E4F7EF 100%);padding:110px 0 80px;text-align:center}
.faq-search{max-width:560px;margin:34px auto 0;position:relative}
.faq-search input{
  width:100%;padding:15px 56px 15px 22px;border-radius:999px;border:1px solid #dbe7f5;
  background:#fff;font-size:15px;color:#152A3F;outline:none;transition:.3s;box-shadow:0 10px 30px rgba(31,95,216,.06);
}
.faq-search input:focus{border-color:#2F7CF6;box-shadow:0 10px 30px rgba(47,124,246,.16)}
.faq-search .fs-ic{position:absolute;right:20px;top:50%;transform:translateY(-50%);color:#2F7CF6}
.faq-cats{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:28px 0 0}
.faq-cats .fc-tab{padding:9px 20px;border-radius:999px;background:rgba(255,255,255,.85);border:1px solid #dbe7f5;font-size:13.5px;color:#5a6d85;cursor:pointer;transition:.3s}
.faq-cats .fc-tab.active{background:linear-gradient(135deg,#2EBF8B,#1f9d72);color:#fff;border-color:transparent}
.faq-block{margin-bottom:44px}
.faq-block .faq-block-head{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.faq-block .faq-block-head .fb-ic{width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff;display:flex;align-items:center;justify-content:center}
.faq-block .faq-block-head h2{font-size:22px;color:#152A3F;margin:0}
.faq-block .faq-item{background:#fff;border:1px solid #eaf1fa;border-radius:14px;margin-bottom:12px;overflow:hidden}
.faq-block .faq-q{display:flex;align-items:center;gap:12px;padding:18px 22px;cursor:pointer;font-size:15.5px;font-weight:600;color:#152A3F;user-select:none}
.faq-block .faq-q .fq-num{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#E8F2FE,#E4F7EF);color:#1E5FD8;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex:none}
.faq-block .faq-q .fq-arrow{margin-left:auto;width:24px;height:24px;border-radius:50%;background:#f2f7ff;display:flex;align-items:center;justify-content:center;color:#2F7CF6;transition:.3s;flex:none}
.faq-block .faq-item.open .fq-arrow{transform:rotate(180deg);background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff}
.faq-block .faq-a{display:none;padding:0 22px 18px 62px;font-size:14px;color:#5a6d85;line-height:2}

/* ============ 服务保障 SLA ============ */
.sla-hero{background:linear-gradient(120deg,#152A3F,#1E3a5c);color:#fff;padding:110px 0 90px;text-align:center;position:relative;overflow:hidden}
.sla-hero::after{content:"";position:absolute;right:-100px;bottom:-160px;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,rgba(46,191,139,.22),transparent 60%)}
.sla-hero .container{position:relative;z-index:2}
.sla-hero h1{font-size:clamp(30px,4.2vw,44px);margin:12px 0 14px}
.sla-hero h1 em{font-style:normal;color:#5ef0bd}
.sla-hero p{color:#aebcd0;max-width:660px;margin:0 auto;line-height:1.9}
.sla-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.sla-stats .sls{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:24px 16px}
.sla-stats .sls b{font-size:34px;color:#5ef0bd;display:block;margin-bottom:6px}
.sla-stats .sls span{font-size:13px;color:#aebcd0}
.sla-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sla-card{background:#fff;border:1px solid #eaf1fa;border-radius:16px;padding:30px 26px;transition:.3s}
.sla-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(21,42,63,.08)}
.sla-card .sl-ic{width:54px;height:54px;border-radius:15px;display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:18px}
.sla-card h3{font-size:18px;color:#152A3F;margin-bottom:12px}
.sla-card ul{list-style:none;margin:0;padding:0}
.sla-card li{font-size:13.5px;color:#5a6d85;line-height:1.9;padding-left:20px;position:relative;margin-bottom:6px}
.sla-card li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,#2F7CF6,#2EBF8B)}
.sla-table-wrap{background:#fff;border:1px solid #eaf1fa;border-radius:16px;overflow:hidden}
.sla-table{width:100%;border-collapse:collapse}
.sla-table th{background:linear-gradient(135deg,#152A3F,#1E3a5c);color:#fff;padding:16px 20px;text-align:left;font-size:14.5px}
.sla-table td{padding:15px 20px;border-bottom:1px solid #f0f5fb;font-size:13.5px;color:#5a6d85}
.sla-table tr:nth-child(even) td{background:#f9fbfe}
.sla-table td:first-child{font-weight:600;color:#152A3F}
.sla-table tr:hover td{background:#f4f9ff}

/* ============ 价格页 ============ */
.price-hero{background:linear-gradient(135deg,#E8F2FE 0%,#f4faf8 55%,#E4F7EF 100%);padding:110px 0 80px;text-align:center}
.price-switch{display:inline-flex;background:#fff;border:1px solid #dbe7f5;border-radius:999px;padding:5px;margin-top:26px}
.price-switch button{border:none;background:none;padding:10px 26px;border-radius:999px;font-size:14px;color:#5a6d85;cursor:pointer;transition:.3s}
.price-switch button.active{background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.price-card{
  background:#fff;border:1px solid #eaf1fa;border-radius:20px;padding:36px 30px;position:relative;transition:.32s;display:flex;flex-direction:column;
}
.price-card:hover{transform:translateY(-6px);box-shadow:0 18px 46px rgba(21,42,63,.08)}
.price-card.popular{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#2F7CF6,#2EBF8B) border-box;box-shadow:0 20px 50px rgba(47,124,246,.14)}
.price-card .pc-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#2F7CF6,#2EBF8B);color:#fff;font-size:12.5px;padding:6px 20px;border-radius:999px;white-space:nowrap}
.price-card .pc-name{font-size:18px;color:#152A3F;font-weight:700;margin-bottom:6px}
.price-card .pc-for{font-size:13px;color:#8b9bb0;margin-bottom:20px}
.price-card .pc-price{font-size:40px;font-weight:800;color:#152A3F;margin-bottom:4px}
.price-card .pc-price em{font-size:15px;font-style:normal;color:#8b9bb0;font-weight:400}
.price-card .pc-price .pc-unit{font-size:14px;color:#8b9bb0;font-weight:400}
.price-card .pc-desc{font-size:13.5px;color:#7b8ba0;line-height:1.8;margin-bottom:20px;min-height:48px}
.price-card ul{list-style:none;margin:0 0 26px;padding:0;flex:1}
.price-card li{font-size:13.5px;color:#5a6d85;line-height:1.9;padding-left:26px;position:relative;margin-bottom:9px}
.price-card li::before{content:"";position:absolute;left:0;top:9px;width:16px;height:16px;border-radius:50%;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%232EBF8B" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>') center/contain no-repeat}
.price-card .pc-btn{display:block;text-align:center;padding:14px 20px;border-radius:12px;font-size:15px;font-weight:600;text-decoration:none;transition:.3s}
.price-card .pc-btn.solid{background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff}
.price-card .pc-btn.solid:hover{box-shadow:0 12px 28px rgba(47,124,246,.3)}
.price-card .pc-btn.ghost{background:#f2f7ff;color:#2F7CF6}
.price-card .pc-btn.ghost:hover{background:linear-gradient(135deg,#2F7CF6,#1E5FD8);color:#fff}
.price-note{text-align:center;color:#8b9bb0;font-size:13px;margin-top:22px}
.price-faq{max-width:820px;margin:0 auto}

/* ============ 服务中心 ============ */
.sc-hero{background:linear-gradient(135deg,#E4F7EF 0%,#f4faf8 55%,#E8F2FE 100%);padding:110px 0 80px;text-align:center}
.sc-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.sc-stats .scs{background:#fff;border:1px solid #eaf1fa;border-radius:14px;padding:24px 16px;transition:.3s}
.sc-stats .scs:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(31,95,216,.08)}
.sc-stats .scs b{font-size:32px;background:linear-gradient(90deg,#2F7CF6,#2EBF8B);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:block;margin-bottom:6px}
.sc-stats .scs span{font-size:13px;color:#7b8ba0}
.sc-ways{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sc-way{background:#fff;border:1px solid #eaf1fa;border-radius:16px;padding:32px 26px;text-align:center;transition:.3s}
.sc-way:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(21,42,63,.08)}
.sc-way .sw-ic{width:62px;height:62px;border-radius:18px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;color:#fff}
.sc-way h3{font-size:17px;color:#152A3F;margin-bottom:8px}
.sc-way p{font-size:13.5px;color:#7b8ba0;line-height:1.8;margin-bottom:14px}
.sc-way .sw-link{color:#2F7CF6;font-weight:600;font-size:14px;text-decoration:none}
.sc-ticket{background:#fff;border:1px solid #eaf1fa;border-radius:16px;padding:30px}
.sc-ticket h3{font-size:18px;color:#152A3F;margin-bottom:6px}
.sc-ticket>p{font-size:13.5px;color:#7b8ba0;margin-bottom:22px}
.sc-ticket .sc-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sc-ticket .sc-form .full{grid-column:1/-1}
.sc-ticket input,.sc-ticket select,.sc-ticket textarea{
  width:100%;padding:13px 16px;border:1px solid #dbe7f5;border-radius:10px;font-size:14px;color:#152A3F;outline:none;transition:.3s;background:#fbfdff;
}
.sc-ticket input:focus,.sc-ticket select:focus,.sc-ticket textarea:focus{border-color:#2F7CF6;box-shadow:0 0 0 3px rgba(47,124,246,.1);background:#fff}
.sc-ticket textarea{resize:vertical;min-height:110px}
.sc-ticket .sc-form label{font-size:13px;color:#5a6d85;margin-bottom:6px;display:block}

/* ============ 响应式 ============ */
@media (max-width:1024px){
  .sv-promise,.sv-entry{grid-template-columns:repeat(2,1fr)}
  .sv-flow{grid-template-columns:repeat(3,1fr)}
  .dl-grid{grid-template-columns:repeat(2,1fr)}
  .sla-grid,.price-grid,.sc-ways{grid-template-columns:repeat(2,1fr)}
  .sla-stats,.sc-stats{grid-template-columns:repeat(2,1fr)}
  .sv-contact{flex-direction:column;text-align:center;padding:40px 26px}
}
@media (max-width:640px){
  .sv-promise,.sv-entry,.sv-flow,.dl-grid,.sla-grid,.price-grid,.sc-ways{grid-template-columns:1fr}
  .sla-stats,.sc-stats{grid-template-columns:repeat(2,1fr)}
  .sv-contact .sv-ct-actions{flex-direction:column;width:100%}
  .sv-contact .sv-ct-actions .btn{width:100%}
  .dl-row{flex-wrap:wrap;gap:10px}
  .dl-row .dr-btn{width:100%;text-align:center}
  .sc-ticket .sc-form{grid-template-columns:1fr}
  .sla-table{min-width:640px}
  .sla-table-wrap{overflow-x:auto}
  .price-card{padding:30px 22px}
}

/* ============ 价格对比表 ============ */
.compare-table-wrap{overflow-x:auto;background:#fff;border-radius:18px;border:1px solid #eaf1fa}
.compare-table-wrap .compare-table{width:100%;border-collapse:separate;border-spacing:0;border-radius:16px;overflow:hidden;background:#fff;min-width:560px}
.compare-table-wrap .compare-table th,.compare-table-wrap .compare-table td{padding:15px 18px;font-size:14px;text-align:center}
.compare-table-wrap .compare-table thead th{background:linear-gradient(135deg,#152A3F,#1E3a5c);color:#fff}
.compare-table-wrap .compare-table tbody tr:nth-child(even) td{background:#f9fbfe}
.compare-table-wrap .compare-table td:first-child{text-align:left;font-weight:600;color:#152A3F}
.compare-table-wrap .compare-table tbody tr:hover td{background:#f4f9ff}
.ct-yes{color:#1f9d72;font-weight:700}
.ct-no{color:#b6c2d2}