/* =============================================================
   yndfushi.com 工作服定制攻略模块样式（列表页/文章页/首页攻略）
   依赖：bundle.css 之后加载；配色沿用站点主色
   ============================================================= */
:root{--gl-navy:#0d0e46;--gl-gold:#cfaa5a;--gl-blue:#033d75;--gl-red:#ff0004;
--gl-bg:#f5f7fa;--gl-line:#e9edf3;--gl-text:#333;--gl-muted:#75808f;--gl-radius:10px}
.gl-container{max-width:1200px;margin:0 auto;padding:0 16px}
.gl-page{background:var(--gl-bg);padding:24px 0 48px}

/* ---------- 面包屑 ---------- */
.gl-crumbs{font-size:13px;color:var(--gl-muted);padding:14px 2px}
.gl-crumbs a{color:var(--gl-muted)}
.gl-crumbs a:hover{color:var(--gl-blue)}

/* ---------- 列表页头 ---------- */
.gl-list-head{margin:6px 2px 18px}
.gl-list-head h1{font-size:28px;line-height:1.3;color:#1c2333;margin:0 0 6px;font-weight:700}
.gl-list-head h1 em{font-style:normal;color:var(--gl-gold)}
.gl-list-head p{margin:0;font-size:14px;color:var(--gl-muted)}

/* ---------- 分类筛选 ---------- */
.gl-cats{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px}
.gl-chip{display:inline-block;padding:8px 18px;font-size:14px;color:#40495c;background:#fff;
border:1px solid var(--gl-line);border-radius:999px;line-height:1.4;transition:.2s}
.gl-chip:hover{color:var(--gl-navy);border-color:var(--gl-gold);box-shadow:0 4px 12px rgba(13,14,70,.08)}
.gl-chip.on{background:var(--gl-navy);border-color:var(--gl-navy);color:#fff}
.gl-chip-count{font-size:12px;opacity:.55;margin-left:3px}

/* ---------- 文章卡片网格 ---------- */
.gl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.gl-card{background:#fff;border:1px solid var(--gl-line);border-radius:var(--gl-radius);
overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;display:flex}
.gl-card:hover{transform:translateY(-4px);border-color:rgba(207,170,90,.65);
box-shadow:0 14px 30px rgba(13,14,70,.10)}
.gl-card-link{display:flex;flex-direction:column;width:100%;padding:20px 20px 16px;color:inherit}
.gl-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.gl-card-cat{font-size:12px;color:var(--gl-blue);background:rgba(3,61,117,.07);
padding:3px 10px;border-radius:4px;line-height:1.5;max-width:60%;overflow:hidden;
white-space:nowrap;text-overflow:ellipsis}
.gl-card-date{font-size:12px;color:#9aa5b4;letter-spacing:.5px}
.gl-card-title{font-size:17px;line-height:1.5;color:#1c2333;font-weight:600;margin:0 0 10px;
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
transition:color .2s}
.gl-card-link:hover .gl-card-title{color:var(--gl-blue)}
.gl-card-desc{font-size:13.5px;line-height:1.8;color:var(--gl-muted);margin:0 0 14px;
display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.gl-card-foot{display:flex;align-items:center;justify-content:space-between;
border-top:1px dashed var(--gl-line);padding-top:12px;font-size:13px;color:#9aa5b4}
.gl-card-foot .views{display:inline-flex;align-items:center}
.gl-card-more{color:var(--gl-blue);font-size:13px;display:inline-flex;align-items:center;transition:.2s}
.gl-card-more::after{content:"";width:14px;height:2px;background:var(--gl-blue);margin-left:6px;
transition:width .25s}
.gl-card-link:hover .gl-card-more{color:var(--gl-gold)}
.gl-card-link:hover .gl-card-more::after{width:24px;background:var(--gl-gold)}

/* ---------- 分页 ---------- */
.gl-pages{text-align:center;padding:30px 0 6px;font-size:0}
.gl-pages a,.gl-pages span,.gl-pages li a,.gl-pages li span{display:inline-block;min-width:38px;
height:38px;line-height:36px;padding:0 12px;margin:0 5px 8px;font-size:14px;color:#40495c;
background:#fff;border:1px solid var(--gl-line);border-radius:6px;text-decoration:none;box-sizing:border-box}
.gl-pages a:hover{color:#fff;background:var(--gl-navy);border-color:var(--gl-navy)}
.gl-pages span.current,.gl-pages .active span,.gl-pages li.active span{color:#fff;
background:var(--gl-navy);border-color:var(--gl-navy)}
.gl-pages .disabled span{color:#b6bdc9}

/* ==================== 文章详情页 ==================== */
.gl-article{background:#fff;border:1px solid var(--gl-line);border-radius:var(--gl-radius);
padding:34px 40px 30px}
.gl-art-head{border-bottom:1px solid var(--gl-line);padding-bottom:20px;margin-bottom:22px}
.gl-art-head h1{font-size:26px;line-height:1.5;color:#1c2333;font-weight:700;margin:0 0 14px}
.gl-art-meta{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:13px;color:#9aa5b4}
.gl-art-meta b{font-weight:400;color:var(--gl-muted)}
.gl-art-abstract{position:relative;background:#f7f9fc;border-left:3px solid var(--gl-gold);
border-radius:0 8px 8px 0;padding:14px 18px 14px 20px;font-size:14px;line-height:1.9;
color:#5b6675;margin-bottom:24px}
.gl-art-abstract::before{content:"摘要";display:inline-block;font-size:12px;color:var(--gl-gold);
border:1px solid rgba(207,170,90,.55);border-radius:4px;padding:0 6px;margin-right:8px;
vertical-align:1px}
.gl-art-content{font-size:15.5px;line-height:2;color:#333;word-break:break-word}
.gl-art-content p{margin:0 0 16px;text-align:justify}
.gl-art-content h2,.gl-art-content h3{font-size:19px;color:#1c2333;margin:26px 0 14px;
padding-left:12px;border-left:4px solid var(--gl-gold);line-height:1.5;font-weight:600}
.gl-art-content h3{font-size:17px}
.gl-art-content img{max-width:100%;height:auto;border-radius:8px;display:block;margin:6px auto 14px}
.gl-art-content ul,.gl-art-content ol{margin:0 0 16px;padding-left:24px}
.gl-art-content li{margin-bottom:6px}
.gl-art-content blockquote{margin:0 0 16px;padding:12px 18px;background:#f7f9fc;
border-left:3px solid var(--gl-blue);color:#5b6675}
.gl-art-content table{width:100%;border-collapse:collapse;margin:0 0 16px;font-size:14px}
.gl-art-content table td,.gl-art-content table th{border:1px solid var(--gl-line);padding:8px 12px}
.gl-art-content a{color:var(--gl-blue)}
.gl-art-content a:hover{color:var(--gl-red)}

/* 标签 */
.gl-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;padding-top:18px;
border-top:1px dashed var(--gl-line)}
.gl-tags a{font-size:13px;color:var(--gl-muted);background:#f5f7fa;border:1px solid var(--gl-line);
padding:5px 14px;border-radius:999px;transition:.2s}
.gl-tags a:hover{color:#fff;background:var(--gl-navy);border-color:var(--gl-navy)}

/* 上一篇/下一篇 */
.gl-pn{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.gl-pn a,.gl-pn span{display:block;background:#fff;border:1px solid var(--gl-line);
border-radius:var(--gl-radius);padding:16px 20px;color:#40495c;font-size:14px;line-height:1.7;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:.2s}
.gl-pn a:hover{border-color:var(--gl-gold);box-shadow:0 8px 20px rgba(13,14,70,.08)}
.gl-pn i{display:block;font-style:normal;font-size:12px;color:#9aa5b4;margin-bottom:6px}
.gl-pn .pn-next{text-align:right}

/* 相关阅读 */
.gl-rel{background:#fff;border:1px solid var(--gl-line);border-radius:var(--gl-radius);
padding:26px 30px 18px;margin-top:20px}
.gl-rel h3{font-size:18px;color:#1c2333;margin:0 0 16px;font-weight:600;position:relative;
padding-left:14px}
.gl-rel h3::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
width:4px;height:18px;background:var(--gl-gold);border-radius:2px}
.gl-rel-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 28px}
.gl-rel-grid li{list-style:none;border-bottom:1px dashed var(--gl-line)}
.gl-rel-grid a{display:flex;align-items:center;padding:10px 2px;font-size:14px;color:#40495c;
text-decoration:none;transition:.2s}
.gl-rel-grid a::before{content:"";flex:none;width:5px;height:5px;background:var(--gl-gold);
border-radius:50%;margin-right:10px}
.gl-rel-grid a span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gl-rel-grid a:hover{color:var(--gl-blue)}

/* 咨询卡片 */
.gl-cta{margin-top:20px;background:linear-gradient(120deg,var(--gl-navy) 0%,#23255e 60%,#2b2e75 100%);
border-radius:var(--gl-radius);padding:26px 32px;display:flex;align-items:center;
justify-content:space-between;flex-wrap:wrap;gap:16px;color:#fff;position:relative;overflow:hidden}
.gl-cta::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;
border-radius:50%;background:rgba(207,170,90,.14)}
.gl-cta .t1{font-size:20px;font-weight:700;margin-bottom:6px}
.gl-cta .t2{font-size:13.5px;color:#c3c6e4}
.gl-cta-phone{display:flex;flex-direction:column;align-items:flex-end;position:relative;z-index:1}
.gl-cta-phone .num{font-size:26px;font-weight:700;color:#fff;letter-spacing:1px;
text-decoration:none}
.gl-cta-phone .num:hover{color:var(--gl-gold)}
.gl-cta-phone .tip{font-size:12px;color:#c3c6e4;margin-top:4px}

/* ==================== 首页攻略模块 ==================== */
.gl-homesec{background:var(--gl-bg);padding:56px 0 60px;margin-top:20px}
.gl-sec-head{text-align:center;margin-bottom:34px}
.gl-sec-head .eyebrow{display:inline-block;font-size:13px;letter-spacing:4px;color:var(--gl-gold);
border:1px solid rgba(207,170,90,.5);border-radius:999px;padding:3px 16px;margin-bottom:12px}
.gl-sec-head h2{font-size:30px;color:#1c2333;font-weight:700;margin:0 0 10px}
.gl-sec-head h2::after{content:"";display:block;width:44px;height:3px;background:var(--gl-gold);
margin:14px auto 0;border-radius:2px}
.gl-sec-head p{font-size:14px;color:var(--gl-muted);margin:10px 0 0}
.gl-home-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:glsec}
.gl-home-col{background:#fff;border:1px solid var(--gl-line);border-radius:var(--gl-radius);
padding:22px 22px 14px;counter-increment:glsec;transition:transform .25s ease,box-shadow .25s ease;
position:relative;overflow:hidden;display:flex;flex-direction:column}
.gl-home-col::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;
background:linear-gradient(90deg,var(--gl-gold),rgba(207,170,90,0));opacity:0;transition:.25s}
.gl-home-col:hover{transform:translateY(-5px);box-shadow:0 16px 34px rgba(13,14,70,.12)}
.gl-home-col:hover::before{opacity:1}
.gl-home-col-h{display:flex;align-items:center;margin-bottom:10px;padding-bottom:14px;
border-bottom:1px solid var(--gl-line)}
.gl-home-col-h .num{font-size:15px;font-weight:700;color:var(--gl-gold);margin-right:10px;
font-style:italic;letter-spacing:1px}
.gl-home-col-h .num::before{content:"0" counter(glsec)}
.gl-home-col-h h3{font-size:17px;color:#1c2333;margin:0;font-weight:600;flex:1}
.gl-home-col-h .more{font-size:12px;color:#9aa5b4;text-decoration:none;transition:.2s}
.gl-home-col-h .more:hover{color:var(--gl-blue)}
.gl-home-col ul{margin:0;padding:0;flex:1}
.gl-home-col li{list-style:none;border-bottom:1px dashed #f0f2f6}
.gl-home-col li:last-child{border-bottom:none}
.gl-home-col li a{display:flex;align-items:center;padding:11px 0;font-size:14px;color:#4a5568;
text-decoration:none;transition:.2s;line-height:1.6}
.gl-home-col li a::before{content:"";flex:none;width:4px;height:4px;background:#cfd6e0;
border-radius:50%;margin-right:10px;transition:.2s}
.gl-home-col li a span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gl-home-col li a:hover{color:var(--gl-blue)}
.gl-home-col li a:hover::before{background:var(--gl-gold)}

/* ==================== 响应式 ==================== */
@media (max-width:992px){
  .gl-grid{grid-template-columns:repeat(2,1fr)}
  .gl-home-grid{grid-template-columns:repeat(2,1fr)}
  .gl-article{padding:24px 22px}
}
@media (max-width:640px){
  .gl-page{padding:14px 0 32px}
  .gl-list-head h1{font-size:22px}
  .gl-grid{grid-template-columns:1fr;gap:14px}
  .gl-card-link{padding:16px}
  .gl-home-grid{grid-template-columns:1fr}
  .gl-homesec{padding:40px 0 44px}
  .gl-sec-head h2{font-size:24px}
  .gl-article{padding:20px 16px}
  .gl-art-head h1{font-size:20px}
  .gl-art-content{font-size:15px;line-height:1.9}
  .gl-pn{grid-template-columns:1fr}
  .gl-pn .pn-next{text-align:left}
  .gl-rel{padding:20px 16px 12px}
  .gl-rel-grid{grid-template-columns:1fr}
  .gl-cta{padding:20px}
  .gl-cta-phone{align-items:flex-start}
  .gl-cta-phone .num{font-size:22px}
}