/* ============================================================
   博德赋能官网 · 统一基础样式 (site-base.css)
   单一共享样式文件，被全站所有静态页通过 <link> 引用。
   作用：
     1) 全站宽度收口到 1400px（设计令牌 --max-width）
     2) 统一导航条视觉与交互（桌面 / 悬停 / 激活 / 移动端汉堡菜单）
   说明：导航相关规则使用 !important，确保稳定覆盖各页内联样式
        （含部分页面已有的「统一导航」!important 块），实现真正统一。
   ============================================================ */

:root{
  --max-width: 1400px;        /* 全站内容最大宽度统一令牌 */
  --site-gutter: 24px;        /* 默认侧边留白 */
  /* 导航条令牌 */
  --nav-h: 96px;              /* 导航条高度（桌面，适配放大后的 logo） */
  --nav-bg: rgba(10, 22, 40, .96);          /* 导航条背景（半透明深蓝） */
  --nav-bg-scrolled: rgba(8, 18, 32, .98);  /* 滚动后背景 */
  --nav-h-shrink: 72px;       /* 滚动后高度（适配滚动态 logo） */
  --gold: #e0a93b;            /* 品牌金（字面量，避免各页 --gold 未定义） */
  --gold-soft: rgba(200, 146, 42, .16);     /* 激活/悬停底色 */
  --nav-link: rgba(255, 255, 255, .82);     /* 菜单文字常态色 */
}

/* ---------- 全局盒模型 + 图片自适应（防移动端溢出/抖动） ---------- */
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; height: auto; display: block; }

/* ============================================================
   1) 全站宽度统一收口到 1440px
   ============================================================ */
.container,
.wrapper,
.wrap,
.page,
.main,
.content,
.contact-wrapper,
.crumb-wrap,
.article-body,
.detail-body{
  max-width: var(--max-width) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 布局网格/栏：仅限制最大宽度 + 居中，不破坏栅格行为 */
.footer-grid,
.footer-inner,
.footer-bottom,
.footer-btm,
.breadcrumb-inner,
.about-content,
.services-grid,
.brand-grid,
.cases-showcase,
.news-grid,
.team-grid,
.cases-hero-inner,
.cases-card-grid,
.cases-filter-bar,
.cases-cta-section,
.testimonials-section,
.ts-grid,
.contact-stats .grid,
.stats-grid{
  max-width: var(--max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ============================================================
   2) 统一导航条
   ============================================================ */

/* 导航条容器 */
.nav{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 1000 !important;
  height: var(--nav-h) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 5% !important;
  background: var(--nav-bg) !important;
  box-shadow: 0 2px 18px rgba(0, 0, 0, .25) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
/* 滚动后收缩 + 加深 */
.nav.scrolled{
  height: var(--nav-h-shrink) !important;
  background: var(--nav-bg-scrolled) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, .3) !important;
}

/* 品牌区（Logo + 文字） */
.nav-brand{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  z-index: 1001 !important;
}
.nav-logo-img{
  height: 88px !important;      /* 原 44px → 放大 100% */
  width: auto !important;
  object-fit: contain !important;
  transition: height .25s !important;
}
/* 滚动收缩时 logo 同步略缩，保持导航条比例 */
.nav.scrolled .nav-logo-img{
  height: 68px !important;
}
.nav-name{
  font-size: 19px !important;
  font-weight: 800 !important;
  color: #fff !important;
  letter-spacing: 1px !important;
  line-height: 1 !important;
}

/* ============================================================
   3) 页脚品牌 Logo（替换原 h3 文字「博德赋能」）
   ============================================================ */
.footer-logo-img{
  height: 96px !important;        /* 页脚 logo 高度（深色背景上清晰可见） */
  width: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;      /* logo 居中 */
  filter: brightness(1.05);       /* 深色底上微提亮 */
}

/* 菜单列表（桌面：横向排列） */
.nav-links{
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.nav-links li{ list-style: none !important; }

/* 菜单项 */
.nav-links li a,
.nav-links a{
  display: inline-flex !important;
  align-items: center !important;
  color: var(--nav-link) !important;
  text-decoration: none !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 8px 14px !important;
  border-radius: 6px !important;
  letter-spacing: .3px !important;
  transition: all .25s !important;
}
/* 悬停 / 当前页激活 */
.nav-links li a:hover,
.nav-links a:hover,
.nav-links li a.active,
.nav-links a.active{
  color: #fff !important;
  background: var(--gold-soft) !important;
  border-bottom: 2px solid var(--gold) !important;
  transform: none !important;
  rotate: none !important;
}

/* 汉堡按钮（桌面隐藏，移动端显示） */
.nav-toggle{
  display: none !important;
  flex-direction: column !important;
  gap: 5px !important;
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  padding: 8px !important;
  z-index: 1001 !important;
}
.nav-toggle span{
  display: block !important;
  width: 24px !important;
  height: 2px !important;
  background: #fff !important;
  border-radius: 2px !important;
  transition: all .3s !important;
}
/* 打开态：X 形变换（兼容 .sub-nav-open 类名约定） */
.sub-nav-open .nav-toggle span:nth-child(1){ transform: rotate(45deg) translate(5px, 5px) !important; }
.sub-nav-open .nav-toggle span:nth-child(2){ opacity: 0 !important; }
.sub-nav-open .nav-toggle span:nth-child(3){ transform: rotate(-45deg) translate(5px, -5px) !important; }

/* 移动端：汉堡菜单（断点统一为 1024px） */
@media (max-width: 1024px){
  .nav-links{
    display: none !important;
    position: absolute !important;
    top: 100% !important;          /* 紧贴导航条底部（自适应滚动收缩） */
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: rgba(10, 22, 40, .98) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    padding: 16px 5% 24px !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .35) !important;
  }
  .nav-links li a,
  .nav-links a{
    width: 100% !important;
    justify-content: flex-start !important;
    padding: 12px 14px !important;
  }
  /* 同时兼容两种 JS 切换约定 */
  .nav-links.open,
  .sub-nav-open .nav-links{ display: flex !important; }
  .nav-toggle{ display: flex !important; }
}

/* 兼容残留页 cases-detail.html 的极简返回条（结构不同：.detail-nav） */
.detail-nav{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 1000 !important;
  height: var(--nav-h) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 5% !important;
  background: var(--nav-bg) !important;
  box-shadow: 0 2px 18px rgba(0, 0, 0, .25) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
.detail-nav .dn-logo img,
.detail-nav img{ height: 80px !important; width: auto !important; object-fit: contain !important; }
.detail-nav .dn-back{
  color: var(--nav-link) !important;
  text-decoration: none !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 8px 14px !important;
  border-radius: 6px !important;
  transition: all .25s !important;
}
.detail-nav .dn-back:hover{ color: #fff !important; background: var(--gold-soft) !important; }

/* ═══ 页脚版权行 ═ */
/* 新版 footer-btm（单行<p>含<a>备案号）：flex 左右分布 */
.footer-btm,
.page-footer{
  text-align: left !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  max-width: var(--max-width, 1400px) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}
/* 旧版 footer-bottom（可能多个<p>）：保持正常流式布局，不拆散文字 */
.footer-bottom {
  display: block !important;
  text-align: left !important;
  max-width: var(--max-width, 1400px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}
.footer-btm p,
.page-footer p{
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  gap: 8px !important;
}

/* ═══ 页脚联系方式：图标+文字对齐 ═══ */
.contact-list li{
  display: flex !important;
  align-items: flex-start !important;
  line-height: 1.6 !important;
  margin-bottom: 10px !important;
  font-size: 13.5px !important;
}
.contact-list li svg{
  flex-shrink: 0 !important;
  margin-top: 3px !important;
}
.contact-list li span{
  color: rgba(255,255,255,.65) !important;
}

/* ═══ 页脚 Grid 布局（强制，防止被覆盖导致竖排） ═══ */
.footer-inner{
  display: grid !important;
  grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr !important;
  gap: 28px !important;
}
@media(max-width: 1024px){
  .footer-inner{ grid-template-columns: 1fr 1fr 1fr !important; }
}
@media(max-width: 768px){
  .footer-inner{ grid-template-columns: 1fr 1fr !important; }
}
@media(max-width: 480px){
  .footer-inner{ grid-template-columns: 1fr !important; }
}

/* ═══ 页脚全列文字左对齐（品牌区除外） ═══ */
.footer,
.footer-inner,
.footer-col,
.footer-col h4,
.footer-col ul,
.footer-col li,
.footer-col a{
  text-align: left !important;
}

/* 品牌区3行内容居中 */
.footer-brand{
  text-align: center !important;
}
.footer-brand p,
.footer-brand .fb-highlight p{
  text-align: center !important;
}

/* ═══ Footer 品牌金色高亮区 ═══ */
.footer-brand .fb-highlight{margin-top:12px;padding:14px 18px;background:rgba(224,169,59,.1);
  border:1px solid rgba(224,169,59,.2);border-radius:8px;border-left:3px solid var(--gold)}
.fb-highlight p{color:#f0c674;font-size:13px;line-height:1.7;margin:0;font-weight:600}

/* ═══ Footer 列标题 & 链接 ═══ */
.footer-col h4{color:#f0c674;font-size:15px;font-weight:700;margin-bottom:14px;
  position:relative;padding-bottom:8px}
.footer-col h4::after{content:'';position:absolute;bottom:0;left:0;width:24px;height:2px;background:var(--gold-dark)}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:8px}
.footer-col a{color:rgba(255,255,255,.65);font-size:13.5px;transition:all .2s;padding:2px 0;display:inline-block}
.footer-col a:hover{color:#f0c674;transform:translateX(3px)}
