/* ============================================================
   hy0532.com 全站 UI 美化覆盖层 (style-v2.css)
   版本: v2.0
   说明: 在 style.css 之后引入，现代企业风升级，保留蓝色主调。
   主色: #317EF3  (蓝)   辅助/深色: #1e5cc8   浅底: #f6f7fb
   ============================================================ */

/* ---------- 1. 全局基础 ---------- */
:root{
  --primary:#317EF3;
  --primary-dark:#1e5cc8;
  --primary-light:#5b95ef;
  --bg-soft:#f6f7fb;
  --text:#333;
  --text-sub:#666;
  --border:#e6e8ee;
  --radius:8px;
  --shadow-sm:0 2px 8px rgba(31,60,120,.06);
  --shadow-md:0 8px 24px rgba(31,60,120,.12);
  --shadow-lg:0 16px 40px rgba(31,60,120,.16);
}

body{
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  font-size:14px;
  line-height:1.75;
  color:var(--text);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5,h6{
  font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  color:#222;
  font-weight:600;
}

a{
  transition:color .25s ease, background-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

::selection{ background:var(--primary); color:#fff; }

/* ---------- 2. 头部与导航 ---------- */
#fh5co-header .logo img{
  max-height:52px;
  width:auto;
}

#fh5co-header .search-top span{
  color:var(--primary);
  font-weight:700;
  letter-spacing:.5px;
}

/* 主导航栏: 更现代的下方渐变 + 阴影 */
#fh5co-header .header-nav{
  background:linear-gradient(180deg,#3a88f5 0%, var(--primary) 100%);
  box-shadow:0 2px 10px rgba(31,94,200,.18);
}

#fh5co-header .nav li a{
  font-size:15px;
  line-height:54px;
  padding:0 28px;
  letter-spacing:.5px;
  position:relative;
  transition:background .25s ease, color .25s ease;
}

#fh5co-header .nav li a:hover,
#fh5co-header .nav li.current a,
#fh5co-header .nav li.currents a{
  background:var(--primary-dark);
  color:#fff;
}

#fh5co-header .nav li:hover a{
  background:var(--primary-dark);
}

/* 下拉菜单圆角 + 阴影 */
#fh5co-header .nav li ul{
  border-radius:0 0 var(--radius) var(--radius);
  box-shadow:var(--shadow-md);
  opacity:1;
  background:#fff;
}

#fh5co-header .nav li ul li a{
  background:#fff !important;
  color:#444;
  font-size:14px;
  line-height:38px;
  padding:0 22px 0 26px;
  border-left:3px solid transparent;
  transition:all .2s ease;
}

#fh5co-header .nav li ul li a:hover{
  background:#f0f5ff !important;
  color:var(--primary);
  border-left-color:var(--primary);
}

/* ---------- 3. Banner 轮播美化 ---------- */
.flex-control-nav a{
  background:rgba(255,255,255,.55);
  width:10px;
  height:10px;
  transition:all .25s ease;
}

.flex-control-nav .flex-active{
  background:var(--primary);
  width:24px;
  border-radius:10px;
}

.flex-direction-nav li a{
  border-radius:50%;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
  transition:transform .25s ease, opacity .25s ease;
}

.flex-direction-nav li a:hover{
  transform:scale(1.1);
}

/* ---------- 4. 区块标题 (纯CSS装饰，替代低清图片) ---------- */
.fh5co-heading h2{
  position:relative;
  padding-bottom:14px;
  letter-spacing:1px;
}

#fh5co-product-list .fh5co-heading h2,
#fh5co-case-list .fh5co-heading h2{
  color:var(--primary);
  font-size:32px;
  font-weight:600;
  height:auto;
  line-height:1.4;
  margin:32px 0 28px;
}

.fh5co-heading h2:after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:0;
  width:52px;
  height:3px;
  border-radius:3px;
  background:linear-gradient(90deg,var(--primary),var(--primary-light));
}

.fh5co-heading.text-center h2:after{
  left:50%;
  transform:translateX(-50%);
}

#fh5co-info-list .fh5co-heading{
  background:none;
  border-left:4px solid var(--primary);
  padding-left:12px;
}

#fh5co-info-list .fh5co-heading h2{
  color:var(--primary);
  font-size:22px;
  font-weight:600;
}

/* ---------- 5. 卡片与图片 ---------- */
.pro-item .portfolio-img .zoomimgs,
#fh5co-case-list .show-list .portfolio-img a{
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  transition:transform .35s ease, box-shadow .35s ease;
}

.pro-item .portfolio-img .zoomimgs:hover{
  transform:scale(1.05);
  box-shadow:var(--shadow-md);
}

#fh5co-case-list .show-list .portfolio-img a{
  border:none;
  padding:0;
  overflow:hidden;
}

#fh5co-case-list .show-list .portfolio-img a:hover{
  box-shadow:var(--shadow-lg);
  transform:translateY(-4px);
}

.pro-item h2,
#fh5co-case-list .show-list h2 a{
  font-size:15px;
  color:#333;
  font-weight:600;
}

#fh5co-case-list .show-list h2 a:hover{
  color:var(--primary);
}

/* ---------- 6. 关于我们区块 ---------- */
#fh5co-about-us h2{
  font-size:34px;
  font-weight:600;
}

#fh5co-about-us .bg-about{
  padding:50px 24px 60px;
}

#fh5co-about-us .about-box p{
  font-size:15px;
  line-height:2;
  color:#e8ecf3;
}

#fh5co-about-us .view-all{
  border-radius:24px;
  padding:10px 26px;
  font-size:14px;
  transition:all .3s ease;
}

#fh5co-about-us .view-all:hover{
  background:#fff !important;
  color:var(--primary) !important;
  box-shadow:none;
}

/* ---------- 7. 按钮 ---------- */
.button.bg-main{
  background:linear-gradient(180deg,#4a90f8 0%,var(--primary) 100%);
  border-radius:6px;
  box-shadow:0 4px 12px rgba(49,126,243,.28);
  transition:all .25s ease;
}

.button.bg-main:hover{
  background:linear-gradient(180deg,#3a88f5 0%,var(--primary-dark) 100%);
  box-shadow:0 6px 16px rgba(49,126,243,.36);
  transform:translateY(-1px);
}

/* ---------- 8. 内容页 (内页) ---------- */
#fh5co-content_show h2.left_h{
  background:none;
  border-left:4px solid var(--primary);
  padding-left:12px;
  font-size:22px;
  font-weight:600;
}

#fh5co-content_show .title h2{
  border-bottom:2px solid var(--primary);
  font-weight:600;
}

#fh5co-content_show .nav li{
  background:none;
  padding:6px 0 6px 4px;
  border-bottom:1px solid #f2f2f2;
  transition:padding-left .2s ease;
}

#fh5co-content_show .nav li:hover{
  padding-left:12px;
}

#fh5co-content_show .detail{
  font-size:16px;
  line-height:1.9;
  color:#444;
}

/* ---------- 9. 底部 ---------- */
footer{
  background:linear-gradient(180deg,#2b3442 0%,#1f2733 100%);
}

footer .footer-bot{
  padding-top:40px;
  padding-bottom:30px;
}

footer .footer-bot .nav li a{
  font-size:13px;
  opacity:.85;
}

footer .footer-bot .nav li a:hover{
  opacity:1;
}

footer .footer-bot .Copyright{
  font-size:13px;
  opacity:.8;
}

/* ---------- 10. 响应式 ---------- */
@media (max-width:768px){
  #fh5co-header .nav li a{
    font-size:14px;
    padding:0 14px;
  }
  #fh5co-product-list .fh5co-heading h2,
  #fh5co-case-list .fh5co-heading h2{
    font-size:24px;
    margin:22px 0 20px;
  }
  #fh5co-about-us h2{
    font-size:26px;
  }
}

/* ============ 追加：面包屑 + 文章页 meta（GEO/E-E-A-T 增强） ============ */
.breadcrumb-nav{
  font-size:13px;
  color:#888;
  margin:12px 0 16px;
  padding:10px 16px;
  background:var(--bg-soft);
  border-radius:6px;
  line-height:1.6;
}
.breadcrumb-nav a{
  color:#666;
}
.breadcrumb-nav a:hover{
  color:var(--primary);
}
.breadcrumb-nav span{
  color:#333;
  font-weight:600;
}

.article-meta{
  font-size:13px;
  color:#999;
  text-align:center;
  padding:8px 0 18px;
  border-bottom:1px dashed var(--border);
  margin-bottom:20px;
}
.article-meta span{
  margin:0 12px;
}

.show_body h1{
  font-size:24px;
  line-height:1.5;
  text-align:center;
  margin:18px 0 6px;
  color:#222;
}

.tag_arc{
  margin-top:24px;
  padding:14px 16px;
  background:var(--bg-soft);
  border-radius:6px;
  font-size:13px;
}
.tag_arc a{
  display:inline-block;
  margin:0 6px 6px 0;
  padding:2px 10px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  color:#666;
}
.tag_arc a:hover{
  color:var(--primary);
  border-color:var(--primary);
}

.pager li a{
  color:var(--primary);
}
