/* 公共顶部导航与页脚样式，供 index/product/news 等页引入 */
* { box-sizing: border-box; }
body { margin: 0; font-family: "Microsoft YaHei", "PingFang SC", sans-serif; color: #333; }
.home-header { background: #fff; border-bottom: 1px solid #eee; }
.header-top { padding: 12px 0; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; max-width: 1200px; margin: 0 auto; padding-left: 15px; padding-right: 15px; }
.header-logo { display: flex; align-items: center; gap: 16px; }
.header-logo .logo-cube { width: 60px; height: 60px;  border-radius: 4px; display: flex; align-items: center; justify-content: center; }
.header-logo .company-name { font-size: 14px; line-height: 1.4; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.header-logo .company-name img { max-width: 200px; height: auto; }
.header-logo .company-name strong { display: block; font-size: 16px; color: #222; }
.header-logo .company-name span { color: #666; font-size: 12px; }
.header-right .slogan { font-size: 13px; color: #666; margin-bottom: 4px; }
.header-right .hotline { font-size: 14px; }
.header-right .hotline a { color: #c00; font-size: 18px; font-weight: bold; text-decoration: none; }
.nav-bar { background: #1a5490; }
.nav-bar .nav-inner { max-width: 1200px; margin: 0 auto; padding: 0 15px; position: relative; }
.nav-bar ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.nav-bar li { position: relative; }
.nav-bar li a { display: block; padding: 14px 20px; color: #fff; text-decoration: none; font-size: 15px; }
.nav-bar li a:hover, .nav-bar li.active a { background: #0f3d6b; }
.nav-about .about-dropdown { position: absolute; left: 0; top: calc(100% - 1px); width: 150px; color: #fff; z-index: 1000; display: none; }
.nav-about:hover .about-dropdown { display: block; }
.nav-about .about-dropdown::before { content: ''; position: absolute; left: 0; right: 0; bottom: 100%; height: 14px; }
.nav-about .about-title { background: #ff0000; padding: 10px 16px; font-size: 14px; font-weight: bold; margin: 0; }
.nav-about .about-list { list-style: none; margin: 0; padding: 0; background: #003399; }
.nav-about .about-list li a { padding: 10px 16px; font-size: 13px; border-bottom: 1px solid rgba(255,255,255,0.15); white-space: nowrap; }
.nav-about .about-list li a:hover { background: #001f66; }
.nav-product .about-dropdown, .nav-news .about-dropdown { position: absolute; left: 0; top: calc(100% - 1px); width: 160px; color: #fff; z-index: 1000; display: none; }
.nav-product:hover .about-dropdown, .nav-news:hover .about-dropdown { display: block; }
.nav-product .about-dropdown::before, .nav-news .about-dropdown::before { content: ''; position: absolute; left: 0; right: 0; bottom: 100%; height: 14px; }
.nav-product .about-title, .nav-news .about-title { background: #ff0000; padding: 10px 16px; font-size: 14px; font-weight: bold; margin: 0; }
.nav-product .about-list, .nav-news .about-list { list-style: none; margin: 0; padding: 0; background: #003399; border-top: none; }
.nav-product .about-list li a, .nav-news .about-list li a { padding: 10px 16px; font-size: 13px; border-bottom: 1px solid rgba(255,255,255,0.15); white-space: nowrap; display: block; color: #fff; text-decoration: none; }
.nav-product .about-list li a:hover, .nav-news .about-list li a:hover { background: #001f66; }
.nav-about .about-dropdown .about-title, .nav-product .about-dropdown .about-title, .nav-news .about-dropdown .about-title { margin: 0 !important; }
.nav-about .about-dropdown .about-list, .nav-product .about-dropdown .about-list, .nav-news .about-dropdown .about-list { margin: 0 !important; padding: 0 !important; }
.home-footer { background: #1a5490; color: #fff; }
.footer-nav { padding: 16px 0; }
.footer-nav .nav-inner { max-width: 1200px; margin: 0 auto; padding: 0 15px; }
.footer-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 20px; }
.footer-nav a { color: #fff; text-decoration: none; font-size: 14px; }
.footer-copy { background: #0f3d6b; padding: 12px 15px; text-align: center; font-size: 13px; color: rgba(255,255,255,0.9); }

/* 手机端响应式：头部与页脚 */
@media (max-width: 768px) {
    .header-top { flex-direction: column; align-items: flex-start; padding: 10px 12px; gap: 10px; }
    .header-logo { gap: 12px; }
    .header-logo .logo-cube { width: 50px; height: 50px; }
    .header-logo .company-name { flex-direction: column; align-items: flex-start; gap: 4px; }
    .header-logo .company-name div:first-child { font-size: 16px !important; }
    .header-logo .company-name div:last-child { font-size: 11px !important; }
    .header-right { width: 100%; }
    /* 头部导航九宫格：网站首页、关于我们、产品中心等 3 列网格 */
    .nav-bar .nav-inner { padding: 12px; overflow: visible; }
    .nav-bar ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 0; min-width: 0; }
    .nav-bar li { text-align: center; }
    .nav-bar li a { padding: 12px 8px; font-size: 13px; white-space: nowrap; border-radius: 6px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.25); }
    .nav-bar li a:hover, .nav-bar li.active a { background: #0f3d6b; border-color: rgba(255,255,255,0.3); }
    .nav-about .about-dropdown, .nav-product .about-dropdown, .nav-news .about-dropdown { display: none !important; }
    /* 页脚九宫格：网站首页、关于我们、产品中心等 3 列网格 */
    .footer-nav .nav-inner { padding: 0 12px; }
    .footer-nav ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 16px 0; justify-content: stretch; }
    .footer-nav li { text-align: center; }
    .footer-nav a { display: block; padding: 14px 8px; font-size: 13px; border: 1px solid rgba(255,255,255,0.3); border-radius: 6px; background: rgba(255,255,255,0.08); }
    .footer-nav a:hover { background: rgba(255,255,255,0.15); }
    .footer-copy { padding: 10px 12px; font-size: 12px; }
}
@media (max-width: 480px) {
    .nav-bar ul { gap: 6px; }
    .nav-bar li a { padding: 10px 6px; font-size: 12px; }
    .footer-nav ul { gap: 8px; padding: 12px 0; }
    .footer-nav a { padding: 12px 6px; font-size: 12px; }
}