/* ==========================================================================
   印秀网 SEO / GEO 优化扩展样式（首页新增板块专用） v4
   规则说明：本文件遵循拼图（Pintuer）框架用法——
   1. 布局一律使用框架栅格（xl/xs/xm/xb + line-middle）与工具类（margin-*、text-*、bg-*、radius-*）；
   2. 卡片一律复用框架 .listicon-a（白底 #ddd 边框、hover 红描边）与 .border（灰边框），本文件不重复定义边框；
   3. 字号一律复用框架 .text-large(24px)/.text-big(16px)/.text-default(14px)/.text-small(12px)；
   4. 本文件只补充框架中没有的新组件样式（公司简介、服务优势、FAQ、联系条）；
   5. 不修改、不覆盖 yxw.min.css 任何原有规则。
   主色与主题保持一致：#E84C3D（红） / #ffcc00（黄） / 深色高级感 #17171b
   ========================================================================== */

/* ---------- 板块容器：只做间距（灰底已按要求移除，用 .seo-box 白底过渡） ---------- */
.seo-box {padding:35px 0 30px;}

/* ---------- 公司简介（参考首屏Hero布局：通栏底图靠右 + 渐变蒙版 + container内文字） ---------- */
.seo-about-premium {
  position:relative;min-height:640px;overflow:hidden;color:#fff;
  display:-webkit-box;display:-webkit-flex;display:flex;
  -webkit-box-align:center;-webkit-align-items:center;align-items:center;
  background:#0a0a0a;
}
.about-bg {
  position:absolute;left:0;top:0;right:0;bottom:0;z-index:0;
  background:#0a0a0a url(/images/about-logo-gold.png) no-repeat right center/cover;
}
/* 左侧文字可读性渐变蒙版（左深右透，不压暗右侧金色主体） */
.about-mask {
  position:absolute;left:0;top:0;right:0;bottom:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(10,10,14,.94) 0%,rgba(10,10,14,.80) 36%,rgba(10,10,14,.32) 55%,rgba(10,10,14,0) 66%);
}
.about-inner {
  position:relative;z-index:2;width:100%;max-width:1200px;margin:0 auto;
  padding:70px 10px;box-sizing:border-box;
}
.seo-h1-premium {
  font-size:24px;line-height:1.7;color:#fff;margin:10px 0 14px;
  padding-left:12px;border-left:4px solid #E84C3D;
}
.seo-h1-premium strong {color:#ffcc00;}
.seo-about-text {width:43%;max-width:620px;}
.seo-about-premium .seo-about-text p {color:#d3d3da;text-align:justify;}
/* 关于我们 4 个重点模板：等分四列 + 哑金渐变数字 + 细分隔线 */
.seo-about-stats {margin:22px 0 12px;display:-webkit-box;display:-webkit-flex;display:flex;}
.seo-about-stats .stat {-webkit-box-flex:1;-webkit-flex:1;flex:1;position:relative;text-align:center;padding:6px 4px 4px;min-width:0;}
.seo-about-stats .stat + .stat::before {content:"";position:absolute;left:0;top:10px;bottom:10px;width:1px;background:rgba(255,255,255,.12);}
.seo-about-stats .stat b {display:block;font-size:26px;line-height:1.3;font-weight:bold;letter-spacing:2px;
  background:linear-gradient(180deg,#f2dcab 0%,#c9a45c 45%,#8f6b2f 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-filter:drop-shadow(0 1px 1px rgba(0,0,0,.55));filter:drop-shadow(0 1px 1px rgba(0,0,0,.55));}
.seo-about-stats .stat span {display:block;font-size:12px;color:#b9b9c4;letter-spacing:2px;margin-top:2px;white-space:nowrap;}
.seo-about-stats .stat b,.seo-about-stats .stat span {-webkit-transition:all .4s;transition:all .4s;}
.seo-about-stats .stat:hover b {-webkit-transform:translateY(-2px);transform:translateY(-2px);}
@media (max-width:760px){
	.seo-about-stats .stat b {font-size:21px;letter-spacing:1px;}
	.seo-about-stats .stat span {font-size:11px;letter-spacing:1px;}
	.seo-about-stats .stat + .stat::before {top:6px;bottom:6px;}
}
.seo-about-tel {font-size:26px;color:#ffcc00;font-weight:bold;}
.seo-about-tel:hover {color:#E84C3D;text-decoration:none;}

/* ---------- 四大业务卡片：关键词内链（沿用原 .text-gray 样式） ---------- */
.listicon-a .text-gray a {color:#999;}
.listicon-a .text-gray a:hover {color:#E84C3D;}

/* ---------- 服务优势卡片（边框用框架 .border） ---------- */
.adv-item {background:#fff;padding:24px 16px;margin-top:10px;margin-bottom:10px;text-align:center;transition:all .3s;height:100%;}
.adv-item:hover {border-color:#E84C3D;box-shadow:0 8px 18px rgba(0,0,0,.08);transform:translateY(-3px);}
.adv-ico {display:inline-block;width:64px;height:64px;line-height:64px;background:#fdf0ef;color:#E84C3D;font-size:30px;margin-bottom:14px;transition:all .3s;}
.adv-item:hover .adv-ico {background:#E84C3D;color:#fff;}
.adv-item h3 {font-size:17px;color:#333;margin-bottom:8px;}
.adv-item p {font-size:13px;line-height:22px;color:#777;text-align:left;}

/* ---------- 印刷定制流程：复用框架 .listicon-a 卡片（白底#ddd边框+hover红描边） ---------- */
.step-card .step-num {
  display:block;width:46px;height:46px;line-height:46px;margin:0 auto 12px;
  background:#E84C3D;color:#fff;font-size:20px;font-weight:bold;
}
.step-card h3 {font-size:16px;color:#333;margin-bottom:8px;}
.step-card p {font-size:13px;line-height:22px;color:#777;}

/* ---------- 常见问题：复用知识文章卡片 .listicon-f，标题+描述 ---------- */
/* .listicon-f 已在框架中定义（白底、标题红色下划线、hover 红描边）；
   此处仅补充描述行固定 3 行高度，保证 PC/移动端每行卡片对齐 */
.listicon-f .desc {
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  line-height:24px;height:72px;text-align:justify;
}

/* ---------- 联系方式条（边框用框架 .border，字号用框架 .text-large 等） ---------- */
.contact-bar {background:#fff;padding:18px 20px;margin-top:10px;margin-bottom:10px;text-align:center;}
.contact-bar p {font-size:14px;line-height:28px;color:#555;}
.contact-bar .icon-phone,.contact-bar .icon-qq,.contact-bar .icon-weixin,.contact-bar .icon-map-marker {color:#E84C3D;}

/* ---------- 移动端微调（沿用框架断点 760px） ---------- */
@media (max-width:760px) {
  .seo-box {padding:20px 0 16px;}
  .seo-about-premium {min-height:0;}
  .about-bg {background-position:right bottom;background-size:cover;}
  .about-mask {background:linear-gradient(180deg,rgba(10,10,14,.94) 0%,rgba(10,10,14,.82) 55%,rgba(10,10,14,.35) 100%);}
  .about-inner {padding:46px 10px 34px;}
  .seo-about-text {width:100%;max-width:none;}
  .seo-h1-premium {font-size:20px;}
  /* 关于我们 4 个重点模板：移动端 2x2 网格，避免窄屏溢出 */
  .seo-about-stats {flex-wrap:wrap;margin:18px 0 8px;}
  .seo-about-stats .stat {flex:0 0 50%;max-width:50%;padding:10px 6px;text-align:center;}
  .seo-about-stats .stat + .stat::before {display:none;}
  .seo-about-stats .stat:nth-child(3),.seo-about-stats .stat:nth-child(4) {border-top:1px solid rgba(255,255,255,.12);}
  .seo-about-stats .stat b {font-size:22px;letter-spacing:1px;}
  .seo-about-stats .stat span {font-size:11px;letter-spacing:1px;}
  .adv-item {padding:16px 10px;}
}