/* ============================================================
   新领航塑化 - 企业官网统一样式表 (Corporate CSS)
   来源：skin/index.html, about.html, products.html, product-detail.html,
         solutions.html, equipment.html, certificates.html,
         news.html, news-detail.html, contact.html
   合并日期：2026-07-20
   ============================================================ */

/* ===== CSS 变量 (Color Scheme) ===== */
:root {
    --primary: #1a6fb5;
    --primary-dark: #0d4f85;
    --primary-light: #e8f4fd;
    --accent: #00a859;
    --accent-dark: #008a48;
    --dark: #222;
    --gray: #666;
    --light-bg: #f5f7fa;
    --border: #e8e8e8;
    --white: #fff;
    --footer-bg: #1a1f2b;
}

/* ===== Reset ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif; font-size: 14px; color: #333; line-height: 1.6; background: #fff; }
a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
img { max-width: 100%; vertical-align: middle; border: none; }
/* 所有图片容器内的 img 填满框、裁剪不溢出 */
.card-img img, .about-img img, .sol-img img, .equip-img img,
.cert-img img, .nf-img img, .fc-img img, .eq-img img, .rc-img img,
.prod-gallery .main-img img, .thumb img, .news-item .ni-img img, .sc-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.container { width: 1200px; margin: 0 auto; }
.clear { clear: both; }

/* ===== Top Bar ===== */
.htop { background: #f0f0f0; line-height: 36px; font-size: 12px; color: #888; border-bottom: 1px solid #e5e5e5; }
.htop .container { display: flex; justify-content: space-between; }
.htop em { font-style: normal; }
.htop span a { color: #666; margin-left: 12px; transition: color .3s; }
.htop span a:hover { color: var(--primary); }

/* ===== Header ===== */
.header { background: #fff; }
.hcont { padding: 20px 0; }
.hcont .container { display: flex; justify-content: space-between; align-items: center; }
.dlogo dl { display: flex; align-items: center; }
.dlogo .logo-icon { width: 56px; height: 56px; background: linear-gradient(135deg, var(--primary), var(--accent)); border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-right: 16px; flex-shrink: 0; }
.dlogo .logo-icon svg { width: 36px; height: 36px; }
.dlogo h1 { font-size: 0; }
.dlogo dd p { font-size: 16px; font-weight: bold; color: var(--dark); }
.dlogo dd h2 { font-size: 13px; color: var(--gray); font-weight: normal; margin-top: 4px; }
.dphone dl { text-align: right; }
.dphone dt { font-size: 13px; color: var(--gray); }
.dphone dd { font-size: 22px; font-weight: bold; color: var(--primary); letter-spacing: 1px; }

/* ===== Navigation ===== */
.navBox { background: var(--primary); }
.navBox .container { position: relative; }
.nav { display: flex; }
.nav li { position: relative; }
.nav li > a { display: block; padding: 0 28px; line-height: 50px; color: #fff; font-size: 15px; transition: all .3s; white-space: nowrap; }
.nav li:hover > a,
.nav li.cur > a { background: var(--primary-dark); }

/* ===== Page Banner ===== */
.page-banner { background: linear-gradient(135deg, #0d4f85, #1a6fb5); padding: 40px 0; color: #fff; text-align: center; }
.page-banner h2 { font-size: 32px; margin-bottom: 10px; }
.page-banner .breadcrumb { font-size: 13px; color: rgba(255,255,255,0.7); }
.page-banner .breadcrumb a { color: rgba(255,255,255,0.85); }
.page-banner .breadcrumb a:hover { color: #fff; }

/* ===== Inner Page ===== */
.inner-page { padding: 40px 0 60px; }
.inner-wrap { display: flex; gap: 30px; }

/* ===== Footer ===== */
.footer { background: var(--footer-bg); color: #ccc; padding: 50px 0 20px; }
.footer-top { display: flex; gap: 40px; padding-bottom: 30px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.footer-nav { flex: 1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.footer-nav a { display: block; padding: 4px 0; font-size: 13px; color: #aaa; transition: color .3s; }
.footer-nav a:hover { color: var(--accent); }
.footer-info { flex: 2; }
.footer-info p { font-size: 13px; line-height: 1.8; color: #aaa; }
.footer-qr { flex: 1; display: flex; gap: 20px; }
.footer-qr .qr-item { text-align: center; }
.footer-qr .qr-img { width: 100px; height: 100px; background: #fff; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 36px; margin-bottom: 8px; }
.footer-qr .qr-item p { font-size: 12px; color: #888; }
.footer-bottom { padding-top: 20px; text-align: center; font-size: 12px; color: #666; }
.footer-bottom a { color: #888; }

/* ===== Sidebar Tools ===== */
.side-tools { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 999; }
.side-tools ul { background: #fff; border-radius: 6px 0 0 6px; box-shadow: -2px 2px 15px rgba(0,0,0,0.1); overflow: visible; }
.side-tools li { padding: 12px 16px; text-align: center; cursor: pointer; transition: all .3s; font-size: 13px; color: var(--gray); border-bottom: 1px solid var(--border); }
.side-tools li:hover { background: var(--primary); color: #fff; }
.side-tools li:last-child { border-bottom: none; }
.side-tools li i { display: block; font-size: 20px; margin-bottom: 4px; }
.side-tools li a { color: inherit; text-decoration: none; display: block; }
.side-tools li a:hover { color: inherit; }
/* 微信二维码弹窗 - 左侧浮现 */
.side-tools .wx-chat { position: relative; }
.side-tools .wx-chat::after { content: ''; position: absolute; left: -16px; top: 0; bottom: 0; width: 16px; }
.side-tools .wx-popup { position: absolute; right: 100%; top: 50%; transform: translateY(-50%); margin-right: 12px; background: #fff; border-radius: 8px; box-shadow: 0 4px 20px rgba(0,0,0,0.15); padding: 10px; text-align: center; display: none; white-space: nowrap; z-index: 1000; width: 130px; }
.side-tools .wx-chat:hover .wx-popup { display: block; }
.side-tools .wx-popup img { width: 100%; border-radius: 4px; display: block; }
.side-tools .wx-popup span { display: block; font-size: 12px; color: #666; margin-top: 6px; }
/* QQ咨询弹窗 - 左侧浮现 */
.side-tools .qq-chat { position: relative; }
.side-tools .qq-chat::after { content: ''; position: absolute; left: -16px; top: 0; bottom: 0; width: 16px; }
.side-tools .qq-popup { position: absolute; right: 100%; top: 50%; transform: translateY(-50%); margin-right: 12px; background: #fff; border-radius: 8px; box-shadow: 0 4px 20px rgba(0,0,0,0.15); padding: 12px 16px; text-align: center; display: none; white-space: nowrap; z-index: 1000; min-width: 160px; }
.side-tools .qq-chat:hover .qq-popup { display: block; }
.side-tools .qq-popup span { display: block; font-size: 13px; color: #333; margin-bottom: 8px; }
.side-tools .qq-popup span:last-child { font-size: 12px; color: #999; margin-bottom: 0; margin-top: 8px; }
.side-tools .qq-popup .qq-copy-btn { display: inline-block; padding: 6px 16px; background: var(--primary); color: #fff; border-radius: 4px; font-size: 13px; cursor: pointer; transition: all .3s; }
.side-tools .qq-popup .qq-copy-btn:hover { background: var(--primary-dark); }

/* ===== Mobile Bottom Nav ===== */
.m-fbtn { display: none; }

/* ===== Animations ===== */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}
.fade-in-up { animation: fadeInUp 0.6s ease-out; }

/* ============================================================
   首页 (index.html) 专属样式
   ============================================================ */

/* ===== Banner ===== */
.banner-section { position: relative; overflow: hidden; }
.swiper-slide { position: relative; }
.banner-slide { height: 520px; display: flex; align-items: center; justify-content: center; position: relative; }
.banner-slide.bg1 { background: linear-gradient(135deg, #0d4f85 0%, #1a6fb5 40%, #00a859 100%); }
.banner-slide.bg2 { background: linear-gradient(135deg, #1a3a5c 0%, #2c6faa 50%, #00a859 100%); }
.banner-slide.bg3 { background: linear-gradient(135deg, #003d6b 0%, #0d6fa0 50%, #00995c 100%); }
.banner-content { text-align: center; color: #fff; padding: 0 40px; }
.banner-content h2 { font-size: 42px; font-weight: 700; margin-bottom: 16px; letter-spacing: 2px; }
.banner-content p { font-size: 20px; opacity: 0.9; margin-bottom: 30px; }
.banner-content .banner-btn { display: inline-block; padding: 14px 40px; background: #fff; color: var(--primary); border-radius: 30px; font-size: 16px; font-weight: 600; transition: all .3s; }
.banner-content .banner-btn:hover { background: var(--accent); color: #fff; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.15); }
.banner-section .swiper-pagination-bullet { background: #fff; opacity: 0.5; width: 12px; height: 12px; }
.banner-section .swiper-pagination-bullet-active { opacity: 1; background: var(--accent); }

/* ===== Stats Bar ===== */
.stats-bar { background: #fff; padding: 30px 0; box-shadow: 0 2px 15px rgba(0,0,0,0.06); position: relative; z-index: 2; }
.stats-bar ul { display: flex; justify-content: space-around; }
.stats-bar li { text-align: center; }
.stats-bar .num { font-size: 42px; font-weight: 800; color: var(--primary); display: flex; align-items: baseline; justify-content: center; }
.stats-bar .num em { font-size: 18px; font-weight: normal; color: var(--gray); margin-left: 4px; }
.stats-bar p { color: var(--gray); margin-top: 8px; font-size: 14px; }

/* ===== Section Title ===== */
.section-title { text-align: center; padding: 60px 0 40px; }
.section-title h2 { font-size: 32px; color: var(--dark); font-weight: 700; }
.section-title h2 em { color: var(--primary); font-style: normal; }
.section-title p { color: var(--gray); font-size: 14px; margin-top: 10px; }

/* ===== Products (首页) ===== */
.products-section { background: var(--light-bg); padding-bottom: 60px; }
.product-tabs { display: flex; justify-content: center; gap: 12px; margin-bottom: 40px; flex-wrap: wrap; }
.product-tabs span { display: inline-block; padding: 10px 24px; background: #fff; border: 1px solid var(--border); border-radius: 4px; cursor: pointer; font-size: 14px; transition: all .3s; color: var(--gray); }
.product-tabs span.active,
.product-tabs span:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.product-card { background: #fff; border-radius: 8px; overflow: hidden; transition: all .3s; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.product-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,0,0,0.12); }
.product-card .card-img { height: 220px; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.product-card .card-img .img-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 48px; }
.product-card .card-img.bg1 { background: linear-gradient(135deg, #e8f4fd, #d4e8f9); }
.product-card .card-img.bg2 { background: linear-gradient(135deg, #e8fae8, #d4f4d4); }
.product-card .card-img.bg3 { background: linear-gradient(135deg, #fef3e8, #fde8d4); }
.product-card .card-img.bg4 { background: linear-gradient(135deg, #f0e8fd, #e4d4f9); }
.product-card .card-info { padding: 16px; }
.product-card .card-info h4 { font-size: 16px; color: var(--dark); margin-bottom: 8px; }
.product-card .card-info p { font-size: 13px; color: var(--gray); line-height: 1.5; }

/* ===== Custom Process (4 steps) ===== */
.process-section { padding-bottom: 60px; }
.process-steps { display: flex; justify-content: space-between; position: relative; padding: 0 40px; }
.process-steps::before { content: ''; position: absolute; top: 50px; left: 120px; right: 120px; height: 2px; border-top: 2px dashed var(--border); z-index: 0; }
.process-step { text-align: center; position: relative; z-index: 1; width: 180px; }
.process-step .step-icon { width: 100px; height: 100px; border-radius: 50%; margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; font-size: 36px; color: #fff; }
.step1 .step-icon { background: linear-gradient(135deg, var(--primary), #4da2d9); }
.step2 .step-icon { background: linear-gradient(135deg, #4da2d9, #2196f3); }
.step3 .step-icon { background: linear-gradient(135deg, #2196f3, var(--accent)); }
.step4 .step-icon { background: linear-gradient(135deg, var(--accent), #66d9a0); }
.process-step h3 { font-size: 18px; color: var(--dark); margin-bottom: 6px; }
.process-step p { color: var(--gray); font-size: 13px; }

/* ===== VS Comparison ===== */
.vs-section { background: #f9fafc; padding: 60px 0; }
.vs-container { display: flex; align-items: center; gap: 30px; }
.vs-box { flex: 1; background: #fff; border-radius: 12px; padding: 40px 30px; text-align: center; box-shadow: 0 4px 20px rgba(0,0,0,0.06); transition: all .3s; }
.vs-box.good { border-top: 4px solid var(--accent); }
.vs-box.bad { border-top: 4px solid #e74c3c; }
.vs-box .vs-icon { font-size: 56px; margin-bottom: 16px; }
.vs-box h4 { font-size: 20px; margin-bottom: 12px; }
.vs-box h4 em { color: var(--accent); font-style: normal; }
.vs-box.bad h4 em { color: #e74c3c; }
.vs-box p { color: var(--gray); font-size: 13px; line-height: 1.8; }
.vs-divider { font-size: 32px; font-weight: 900; color: var(--primary); flex-shrink: 0; }

/* ===== Advantages ===== */
.adv-section { background: var(--light-bg); padding-bottom: 60px; }
.adv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.adv-card { background: #fff; border-radius: 8px; padding: 30px 24px; transition: all .3s; box-shadow: 0 2px 10px rgba(0,0,0,0.05); display: flex; gap: 16px; align-items: flex-start; }
.adv-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.adv-card .adv-num { width: 48px; height: 48px; border-radius: 50%; background: var(--primary); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; flex-shrink: 0; }
.adv-card .adv-text h4 { font-size: 16px; color: var(--dark); margin-bottom: 8px; }
.adv-card .adv-text p { font-size: 13px; color: var(--gray); line-height: 1.6; }

/* ===== Solutions (首页) ===== */
.solutions-section { padding-bottom: 60px; }
.solutions-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.solution-card { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; transition: all .3s; background: #fff; }
.solution-card:hover { border-color: var(--primary); box-shadow: 0 6px 20px rgba(26,111,181,0.12); }
.solution-card .sol-img { height: 160px; display: flex; align-items: center; justify-content: center; font-size: 48px; }
.solution-card .sol-img.s1 { background: linear-gradient(135deg, #e3f2fd, #bbdefb); }
.solution-card .sol-img.s2 { background: linear-gradient(135deg, #e8f5e9, #c8e6c9); }
.solution-card .sol-img.s3 { background: linear-gradient(135deg, #fff3e0, #ffe0b2); }
.solution-card .sol-img.s4 { background: linear-gradient(135deg, #f3e5f5, #e1bee7); }
.solution-card .sol-text { padding: 16px; text-align: center; }
.solution-card .sol-text h4 { font-size: 15px; color: var(--dark); }

/* ===== About Us (首页) ===== */
.about-section { background: #fff; padding-bottom: 60px; }
.about-wrap { display: flex; gap: 40px; align-items: center; }
.about-img { flex: 1; height: 360px; background: linear-gradient(135deg, #e3f2fd, #c8e6e9); border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 80px; color: var(--primary); }
.about-text { flex: 1; }
.about-text h3 { font-size: 24px; color: var(--dark); margin-bottom: 12px; }
.about-text .tagline { font-size: 15px; color: var(--primary); margin-bottom: 20px; }
.about-text p { color: var(--gray); font-size: 14px; line-height: 1.8; margin-bottom: 12px; }
.about-text .more-btn { display: inline-block; padding: 10px 30px; background: var(--primary); color: #fff; border-radius: 4px; margin-top: 10px; transition: all .3s; }
.about-text .more-btn:hover { background: var(--primary-dark); }

/* ===== Equipment (首页) ===== */
.equip-section { background: var(--light-bg); padding-bottom: 60px; }
.equip-tabs { display: flex; justify-content: center; gap: 30px; margin-bottom: 30px; }
.equip-tabs span { font-size: 16px; cursor: pointer; padding-bottom: 8px; border-bottom: 2px solid transparent; transition: all .3s; color: var(--gray); }
.equip-tabs span.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }
.equip-carousel { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.equip-item { text-align: center; background: #fff; border-radius: 8px; padding: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.04); transition: all .3s; }
.equip-item:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.1); }
.equip-item .equip-img { height: 140px; display: flex; align-items: center; justify-content: center; border-radius: 6px; font-size: 40px; margin-bottom: 12px; }
.equip-item .equip-img.e1 { background: linear-gradient(135deg, #e3f2fd, #bbdefb); }
.equip-item .equip-img.e2 { background: linear-gradient(135deg, #e8f5e9, #c8e6c9); }
.equip-item .equip-img.e3 { background: linear-gradient(135deg, #fff3e0, #ffe0b2); }
.equip-item .equip-img.e4 { background: linear-gradient(135deg, #f3e5f5, #e1bee7); }
.equip-item h4 { font-size: 14px; color: var(--dark); }

/* ===== Certificates (首页) ===== */
.cert-section { padding-bottom: 60px; }
.cert-carousel { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.cert-item { text-align: center; background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 20px; transition: all .3s; }
.cert-item:hover { border-color: var(--primary); box-shadow: 0 4px 15px rgba(26,111,181,0.1); }
.cert-item .cert-img { height: 180px; display: flex; align-items: center; justify-content: center; font-size: 60px; background: linear-gradient(135deg, #fafafa, #f0f0f0); border-radius: 4px; margin-bottom: 12px; }
.cert-item h4 { font-size: 14px; color: var(--dark); }

/* ===== News (首页) ===== */
.news-section { background: var(--light-bg); padding-bottom: 60px; }
.news-wrap { display: flex; gap: 30px; }
.news-main { flex: 2; }
.news-sidebar { flex: 1; }
.news-tabs { display: flex; gap: 20px; margin-bottom: 20px; }
.news-tabs span { font-size: 16px; cursor: pointer; padding-bottom: 8px; border-bottom: 2px solid transparent; transition: all .3s; color: var(--gray); }
.news-tabs span.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }
.news-featured { display: flex; gap: 20px; background: #fff; padding: 20px; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.04); }
.news-featured .nf-img { width: 260px; height: 180px; flex-shrink: 0; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 48px; background: linear-gradient(135deg, #e3f2fd, #bbdefb); }
.news-featured .nf-text h4 { font-size: 16px; color: var(--dark); margin-bottom: 10px; line-height: 1.5; }
.news-featured .nf-text p { font-size: 13px; color: var(--gray); line-height: 1.6; }
.news-list li { padding: 12px 0; border-bottom: 1px dotted var(--border); display: flex; gap: 12px; align-items: flex-start; }
.news-list li .date { color: var(--gray); font-size: 12px; flex-shrink: 0; white-space: nowrap; }
.news-list li a { font-size: 14px; color: var(--dark); transition: color .3s; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news-list li a:hover { color: var(--primary); }
.faq-box { background: #fff; border-radius: 8px; padding: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.04); }
.faq-box dt { font-size: 14px; color: var(--dark); font-weight: 600; padding: 10px 0; border-bottom: 1px dotted var(--border); cursor: default; }
.faq-box dt:last-child { border-bottom: none; }
.faq-box dd { font-size: 13px; color: var(--gray); padding: 0 0 10px 10px; border-bottom: 1px dotted var(--border); line-height: 1.6; }

/* ============================================================
   产品中心页 (products.html) 专属样式
   ============================================================ */

/* ===== Sidebar (产品中心) ===== */
.sidebar { width: 260px; flex-shrink: 0; }
.side-box { background: #fff; border-radius: 10px; margin-bottom: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.04); padding: 24px; }
/* 产品中心侧边栏标题 */
.side-box h3 { font-size: 18px; padding: 16px 20px; background: var(--primary); color: #fff; border-radius: 8px 8px 0 0; margin: -24px -24px 0 -24px; }
.side-box ul { padding: 10px 0; }
.side-box li a { display: block; padding: 10px 20px; font-size: 14px; color: var(--gray); border-left: 3px solid transparent; transition: all .3s; margin: 0 -24px; }
.side-box li a:hover,
.side-box li a.active { color: var(--primary); border-left-color: var(--primary); background: var(--primary-light); }
/* 新闻侧边栏标题 */
.news-sidebar .side-box h4,
.article-sidebar .side-box h4 { font-size: 16px; color: var(--dark); margin-bottom: 14px; padding-bottom: 10px; border-bottom: 2px solid var(--primary); }
.side-contact { background: linear-gradient(135deg, var(--primary), var(--accent)); color: #fff; border-radius: 8px; padding: 20px; text-align: center; box-shadow: none; }
.side-contact h4 { font-size: 16px; margin-bottom: 10px; }
.side-contact .tel { font-size: 20px; font-weight: bold; margin: 10px 0; }
.side-contact a { display: inline-block; padding: 8px 24px; background: #fff; color: var(--primary); border-radius: 20px; font-weight: 600; margin-top: 8px; transition: all .3s; }
.side-contact a:hover { background: var(--accent); color: #fff; }

/* ===== Main Content ===== */
.main-content { flex: 1; }

/* ===== Product Filter ===== */
.prod-filter { background: #fff; padding: 20px; border-radius: 8px; margin-bottom: 24px; box-shadow: 0 2px 8px rgba(0,0,0,0.04); }
.prod-filter .filter-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.prod-filter .filter-row:last-child { margin-bottom: 0; }
.prod-filter .filter-label { font-size: 13px; color: var(--gray); flex-shrink: 0; font-weight: 600; }
.prod-filter .filter-tags { display: flex; gap: 8px; flex-wrap: wrap; }
.prod-filter .filter-tags span,
.prod-filter .filter-tags a { display: inline-block; padding: 5px 16px; border: 1px solid var(--border); border-radius: 20px; cursor: pointer; font-size: 13px; color: var(--gray); transition: all .3s; }
.prod-filter .filter-tags span:hover,
.prod-filter .filter-tags a:hover,
.prod-filter .filter-tags span.active,
.prod-filter .filter-tags a.active { background: var(--primary); color: #fff; border-color: var(--primary); }

/* ===== Product Grid (产品列表) ===== */
.prod-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.prod-card { background: #fff; border-radius: 8px; overflow: hidden; transition: all .3s; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.prod-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,0,0,0.12); }
.prod-card .card-img { height: 220px; display: flex; align-items: center; justify-content: center; font-size: 56px; position: relative; }
.prod-card .card-img.bg1 { background: linear-gradient(135deg, #e8f4fd, #d4e8f9); }
.prod-card .card-img.bg2 { background: linear-gradient(135deg, #e8fae8, #d4f4d4); }
.prod-card .card-img.bg3 { background: linear-gradient(135deg, #fef3e8, #fde8d4); }
.prod-card .card-img.bg4 { background: linear-gradient(135deg, #f0e8fd, #e4d4f9); }
.prod-card .card-img .hot-tag { position: absolute; top: 10px; right: 10px; background: #e74c3c; color: #fff; font-size: 11px; padding: 3px 10px; border-radius: 20px; }
.prod-card .card-info { padding: 18px; }
.prod-card .card-info h4 { font-size: 16px; color: var(--dark); margin-bottom: 8px; }
.prod-card .card-info p { font-size: 13px; color: var(--gray); line-height: 1.5; margin-bottom: 10px; }
.prod-card .card-info .btn-row { display: flex; gap: 8px; }
.prod-card .card-info .btn-detail { padding: 6px 18px; background: var(--primary); color: #fff; border-radius: 4px; font-size: 13px; transition: all .3s; }
.prod-card .card-info .btn-detail:hover { background: var(--primary-dark); }
.prod-card .card-info .btn-inquire { padding: 6px 18px; background: #fff; color: var(--primary); border: 1px solid var(--primary); border-radius: 4px; font-size: 13px; transition: all .3s; }
.prod-card .card-info .btn-inquire:hover { background: var(--primary-light); }
.prod-empty { grid-column: 1 / -1; text-align: center; padding: 80px 0; color: #999; }
.prod-empty i { font-size: 64px; display: block; margin-bottom: 16px; color: #ddd; }
.prod-empty p { font-size: 16px; margin-bottom: 16px; }
.prod-empty a { color: var(--primary); text-decoration: underline; }

/* ===== Pagination ===== */
.pagination { display: flex; justify-content: center; gap: 6px; margin-top: 40px; }
.pagination a,
.pagination span { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 4px; font-size: 14px; color: var(--gray); background: #fff; transition: all .3s; }
.pagination a:hover,
.pagination span.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.pagination .prev,
.pagination .next { width: auto; padding: 0 16px; }

/* ============================================================
   产品详情页 (product-detail.html) 专属样式
   ============================================================ */

/* ===== Product Detail Layout ===== */
.prod-detail-top { display: flex; gap: 40px; background: #fff; border-radius: 12px; padding: 30px; margin-bottom: 30px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.prod-gallery { width: 480px; flex-shrink: 0; }
.prod-gallery .main-img { width: 480px; height: 380px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 100px; background: linear-gradient(135deg, #e8f4fd, #d4e8f9); margin-bottom: 12px; }
.prod-gallery .thumb-list { display: flex; gap: 10px; }
.prod-gallery .thumb { width: 90px; height: 70px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 28px; cursor: pointer; border: 2px solid transparent; transition: all .3s; background: #f5f7fa; }
.prod-gallery .thumb.active,
.prod-gallery .thumb:hover { border-color: var(--primary); }
.prod-gallery .thumb:nth-child(2) { background: linear-gradient(135deg, #e8fae8, #d4f4d4); }
.prod-gallery .thumb:nth-child(3) { background: linear-gradient(135deg, #fef3e8, #fde8d4); }
.prod-gallery .thumb:nth-child(4) { background: linear-gradient(135deg, #e3f2fd, #bbdefb); }
.prod-info { flex: 1; }
.prod-info h1 { font-size: 24px; color: var(--dark); margin-bottom: 10px; }
.prod-info .subtitle { font-size: 13px; color: var(--gray); margin-bottom: 16px; }
.prod-info .highlights { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
.prod-info .highlights span { padding: 4px 14px; border-radius: 20px; font-size: 12px; }
.prod-info .highlights .h1 { background: #fff3e0; color: #e65100; }
.prod-info .highlights .h2 { background: #e8f5e9; color: #2e7d32; }
.prod-info .highlights .h3 { background: #e3f2fd; color: #1565c0; }
.prod-info .highlights .h4 { background: #fce4ec; color: #c62828; }
.prod-info .price { font-size: 28px; color: #e74c3c; font-weight: bold; margin-bottom: 20px; }
.prod-info .price em { font-size: 14px; font-weight: normal; color: var(--gray); }
.prod-info .spec-row { display: flex; gap: 20px; margin-bottom: 10px; font-size: 13px; }
.prod-info .spec-row span { color: var(--gray); min-width: 60px; }
.prod-info .spec-row b { color: var(--dark); }
.prod-info .action-btns { margin-top: 24px; display: flex; gap: 12px; }
.prod-info .btn-primary { padding: 12px 36px; background: var(--primary); color: #fff; border-radius: 6px; font-size: 16px; font-weight: 600; transition: all .3s; display: inline-flex; align-items: center; gap: 8px; }
.prod-info .btn-primary:hover { background: var(--primary-dark); }
.prod-info .btn-outline { padding: 12px 36px; background: #fff; color: var(--primary); border: 2px solid var(--primary); border-radius: 6px; font-size: 16px; font-weight: 600; transition: all .3s; display: inline-flex; align-items: center; gap: 8px; }
.prod-info .btn-outline:hover { background: var(--primary-light); }

/* ===== Product Tabs ===== */
.prod-tabs { background: #fff; border-radius: 12px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); overflow: hidden; margin-bottom: 30px; }
.tab-nav { display: flex; gap: 0; border-bottom: 1px solid var(--border); }
.tab-nav span { padding: 14px 30px; cursor: pointer; font-size: 15px; color: var(--gray); transition: all .3s; border-bottom: 2px solid transparent; }
.tab-nav span.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }
.tab-content { padding: 30px; display: none; }
.tab-content.active { display: block; }
.tab-content p { color: var(--gray); line-height: 1.8; margin-bottom: 12px; }
.tab-content h4 { font-size: 18px; color: var(--dark); margin-bottom: 12px; }

/* ===== Spec Table ===== */
.spec-table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.spec-table th,
.spec-table td { border: 1px solid var(--border); padding: 10px 16px; text-align: left; font-size: 14px; }
.spec-table th { background: var(--primary-light); color: var(--primary); font-weight: 600; width: 140px; }
.spec-table td { color: var(--gray); }

/* ===== Feature List ===== */
.feature-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.feature-list li { padding: 10px 16px; background: var(--light-bg); border-radius: 6px; font-size: 14px; color: var(--gray); display: flex; align-items: center; gap: 8px; }
.feature-list li::before { content: '✓'; color: var(--accent); font-weight: bold; font-size: 16px; flex-shrink: 0; }

/* ===== Related Products ===== */
.related-section h3 { font-size: 22px; color: var(--dark); margin-bottom: 20px; text-align: center; }
.related-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.related-card { background: #fff; border-radius: 8px; overflow: hidden; transition: all .3s; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.related-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.related-card .rc-img { height: 160px; display: flex; align-items: center; justify-content: center; font-size: 48px; }
.related-card .rc-info { padding: 14px; }
.related-card .rc-info h4 { font-size: 15px; color: var(--dark); margin-bottom: 6px; }
.related-card .rc-info p { font-size: 12px; color: var(--gray); }

/* ============================================================
   行业方案页 (solutions.html) 专属样式
   ============================================================ */

/* ===== Solution Intro ===== */
.sol-intro { background: #fff; border-radius: 12px; padding: 40px; margin-bottom: 40px; text-align: center; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.sol-intro h3 { font-size: 22px; color: var(--dark); margin-bottom: 12px; }
.sol-intro p { color: var(--gray); font-size: 15px; line-height: 1.8; max-width: 800px; margin: 0 auto; }

/* ===== Solution Grid ===== */
.sol-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.sol-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 15px rgba(0,0,0,0.06); transition: all .3s; }
.sol-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,0,0,0.12); }
.sol-card .sc-img { height: 200px; display: flex; align-items: center; justify-content: center; font-size: 64px; overflow: hidden; }
.sol-card .sc-body { padding: 24px; }
.sol-card .sc-body h4 { font-size: 18px; color: var(--dark); margin-bottom: 10px; }
.sol-card .sc-body p { font-size: 13px; color: var(--gray); line-height: 1.7; margin-bottom: 14px; }
.sol-card .sc-body .tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.sol-card .sc-body .tags span { padding: 3px 10px; background: var(--primary-light); color: var(--primary); border-radius: 12px; font-size: 12px; }
.sol-card .sc-body .btn-more { padding: 8px 20px; background: var(--primary); color: #fff; border-radius: 4px; font-size: 13px; transition: all .3s; display: inline-block; }
.sol-card .sc-body .btn-more:hover { background: var(--primary-dark); }

/* ===== Solution Process Banner ===== */
.process-banner { background: #fff; border-radius: 12px; padding: 40px; margin-top: 40px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.process-banner h3 { text-align: center; font-size: 22px; color: var(--dark); margin-bottom: 30px; }
.process-flow { display: flex; justify-content: space-between; position: relative; }
.process-flow::before { content: ''; position: absolute; top: 40px; left: 80px; right: 80px; height: 2px; background: linear-gradient(to right, var(--primary), var(--accent)); z-index: 0; }
.pf-step { text-align: center; position: relative; z-index: 1; flex: 1; }
.pf-step .pf-num { width: 80px; height: 80px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--accent)); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: bold; margin: 0 auto 12px; }
.pf-step h5 { font-size: 15px; color: var(--dark); margin-bottom: 4px; }
.pf-step p { font-size: 12px; color: var(--gray); }

/* ============================================================
   生产设备页 (equipment.html) 专属样式
   ============================================================ */

/* ===== Equipment Stats Bar ===== */
.equip-stats { display: flex; justify-content: space-around; background: #fff; border-radius: 12px; padding: 30px; margin-bottom: 30px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.es-item { text-align: center; }
.es-item .es-num { font-size: 36px; font-weight: 800; color: var(--primary); }
.es-item .es-label { font-size: 14px; color: var(--gray); margin-top: 4px; }

/* ===== Equipment Page Tab Nav ===== */
.equip-page-tabs { display: flex; justify-content: center; gap: 40px; margin-bottom: 30px; }
.equip-page-tabs span { font-size: 17px; cursor: pointer; padding-bottom: 10px; border-bottom: 3px solid transparent; transition: all .3s; color: var(--gray); }
.equip-page-tabs span.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* ===== Equipment List (设备详情列表) ===== */
.equip-list { display: flex; flex-direction: column; gap: 24px; }
.equip-detail-item { background: #fff; border-radius: 12px; padding: 30px; display: flex; gap: 30px; align-items: center; box-shadow: 0 2px 15px rgba(0,0,0,0.06); transition: all .3s; }
.equip-detail-item:hover { box-shadow: 0 8px 30px rgba(0,0,0,0.1); }
.equip-detail-item .eq-img { width: 280px; height: 200px; flex-shrink: 0; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 64px; }
.equip-detail-item .eq-info { flex: 1; }
.equip-detail-item .eq-info h4 { font-size: 20px; color: var(--dark); margin-bottom: 8px; }
.equip-detail-item .eq-info .eq-tags { margin-bottom: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
.equip-detail-item .eq-info .eq-tags span { padding: 3px 12px; border-radius: 15px; font-size: 12px; background: var(--primary-light); color: var(--primary); }
.equip-detail-item .eq-info p { font-size: 14px; color: var(--gray); line-height: 1.7; margin-bottom: 10px; }
.equip-detail-item .eq-info .eq-specs { display: flex; gap: 20px; font-size: 13px; color: var(--gray); flex-wrap: wrap; }
.equip-detail-item .eq-info .eq-specs li { display: flex; align-items: center; gap: 4px; }
.equip-detail-item .eq-info .eq-specs li::before { content: '●'; color: var(--accent); font-size: 8px; }

/* ===== Factory Photos ===== */
.factory-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.factory-card { position: relative; border-radius: 8px; overflow: hidden; transition: all .3s; background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.factory-card:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.12); }
.factory-card .fc-img { height: 200px; display: flex; align-items: center; justify-content: center; font-size: 56px; }
.factory-card .fc-caption { padding: 12px; text-align: center; font-size: 14px; color: var(--dark); }

/* ============================================================
   荣誉资质页 (certificates.html) 专属样式
   ============================================================ */

/* ===== Cert Cards ===== */
.cert-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.cert-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 15px rgba(0,0,0,0.06); transition: all .3s; }
.cert-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,0,0,0.12); }
.cert-card .cert-img { height: 280px; display: flex; align-items: center; justify-content: center; font-size: 80px; position: relative; }
.cert-card .cert-img .zoom-icon { position: absolute; bottom: 10px; right: 10px; width: 36px; height: 36px; background: rgba(0,0,0,0.5); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 16px; cursor: pointer; transition: all .3s; }
.cert-card .cert-img .zoom-icon:hover { background: var(--primary); }
.cert-card .cert-body { padding: 20px; text-align: center; }
.cert-card .cert-body h4 { font-size: 17px; color: var(--dark); margin-bottom: 6px; }
.cert-card .cert-body p { font-size: 13px; color: var(--gray); }

/* ===== Cert Modal ===== */
.cert-modal { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.85); z-index: 9999; align-items: center; justify-content: center; }
.cert-modal.active { display: flex; }
.cert-modal .modal-content { background: #fff; border-radius: 12px; padding: 20px; max-width: 600px; width: 90%; text-align: center; position: relative; }
.cert-modal .modal-img { height: 400px; display: flex; align-items: center; justify-content: center; font-size: 120px; border-radius: 8px; margin-bottom: 16px; }
.cert-modal .modal-close { position: absolute; top: -12px; right: -12px; width: 36px; height: 36px; background: var(--primary); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 18px; }
.cert-modal .modal-close:hover { background: var(--primary-dark); }
.cert-modal h4 { font-size: 18px; color: var(--dark); margin-bottom: 4px; }
.cert-modal p { font-size: 13px; color: var(--gray); }

/* ============================================================
   新闻列表页 (news.html) 专属样式
   ============================================================ */

/* ===== News Main (新闻列表主区域) ===== */
.news-main-content { flex: 1; }
.news-page-tabs { display: flex; gap: 30px; margin-bottom: 24px; }
.news-page-tabs span { font-size: 17px; cursor: pointer; padding-bottom: 8px; border-bottom: 3px solid transparent; transition: all .3s; color: var(--gray); }
.news-page-tabs span.active { color: var(--primary); border-bottom-color: var(--primary); font-weight: 600; }
.news-item { display: flex; gap: 20px; background: #fff; border-radius: 10px; padding: 20px; margin-bottom: 16px; transition: all .3s; box-shadow: 0 2px 10px rgba(0,0,0,0.04); }
.news-item:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.1); }
.news-item .ni-img { width: 220px; height: 150px; flex-shrink: 0; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 48px; }
.news-item .ni-info { flex: 1; display: flex; flex-direction: column; }
.news-item .ni-info h4 { font-size: 17px; color: var(--dark); margin-bottom: 8px; line-height: 1.5; }
.news-item .ni-info h4 a:hover { color: var(--primary); }
.news-item .ni-info .ni-desc { font-size: 13px; color: var(--gray); line-height: 1.7; margin-bottom: auto; }
.news-item .ni-info .ni-meta { font-size: 12px; color: #999; margin-top: 10px; display: flex; gap: 16px; align-items: center; }
.news-item .ni-info .ni-meta .category { padding: 2px 10px; background: var(--primary-light); color: var(--primary); border-radius: 12px; }

/* ===== News Sidebar (新闻侧边栏) ===== */
.news-page-sidebar { width: 320px; flex-shrink: 0; }
.side-hot li { padding: 10px 0; border-bottom: 1px dotted var(--border); display: flex; gap: 10px; align-items: flex-start; }
.side-hot li:last-child { border-bottom: none; }
.side-hot li .rank { width: 20px; height: 20px; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 11px; color: #fff; flex-shrink: 0; background: #ccc; }
.side-hot li:nth-child(1) .rank,
.side-hot li:nth-child(2) .rank,
.side-hot li:nth-child(3) .rank { background: var(--primary); }
.side-hot li a { font-size: 14px; color: var(--gray); line-height: 1.4; transition: color .3s; }
.side-hot li a:hover { color: var(--primary); }
.side-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.side-tags span { padding: 5px 14px; background: var(--light-bg); border-radius: 15px; font-size: 12px; color: var(--gray); cursor: pointer; transition: all .3s; }
.side-tags span:hover { background: var(--primary); color: #fff; }

/* ============================================================
   新闻详情页 (news-detail.html) 专属样式
   ============================================================ */

/* ===== Article ===== */
.article-main { flex: 1; background: #fff; border-radius: 12px; padding: 40px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.article-header { border-bottom: 1px solid var(--border); padding-bottom: 20px; margin-bottom: 24px; }
.article-header h2 { font-size: 26px; color: var(--dark); line-height: 1.4; margin-bottom: 14px; }
.article-header .meta { display: flex; gap: 20px; font-size: 13px; color: #999; flex-wrap: wrap; align-items: center; }
.article-header .meta .cat { padding: 3px 12px; background: var(--primary-light); color: var(--primary); border-radius: 12px; }
.article-body { font-size: 15px; color: #333; line-height: 1.9; }
.article-body p { margin-bottom: 16px; text-indent: 2em; }
.article-body h3 { font-size: 20px; color: var(--dark); margin: 28px 0 12px; }
.article-body .highlight-box { background: var(--primary-light); border-left: 4px solid var(--primary); padding: 16px 20px; margin: 20px 0; border-radius: 0 8px 8px 0; }
.article-body .highlight-box p { text-indent: 0; margin-bottom: 0; font-size: 14px; color: var(--primary-dark); }
.article-body .cover-img { height: 280px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 80px; margin: 20px 0; background: linear-gradient(135deg,#e3f2fd,#bbdefb); }
.article-footer { margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--border); display: flex; justify-content: space-between; font-size: 13px; }
.article-footer a { color: var(--gray); transition: color .3s; }
.article-footer a:hover { color: var(--primary); }
.article-footer a i { margin: 0 4px; }

/* ===== Article Sidebar ===== */
.article-sidebar { width: 320px; flex-shrink: 0; }
.side-related li { padding: 10px 0; border-bottom: 1px dotted var(--border); }
.side-related li:last-child { border-bottom: none; }
.side-related li a { font-size: 14px; color: var(--gray); line-height: 1.4; transition: color .3s; }
.side-related li a:hover { color: var(--primary); }
.side-related li .date { display: block; font-size: 12px; color: #aaa; margin-top: 2px; }

/* ============================================================
   关于我们页 (about.html) 专属样式
   ============================================================ */

/* ===== Company Intro ===== */
.about-top { display: flex; gap: 40px; align-items: center; background: #fff; border-radius: 12px; padding: 40px; margin-bottom: 40px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.about-page-img { width: 480px; height: 360px; flex-shrink: 0; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 80px; background: linear-gradient(135deg, #e3f2fd, #c8e6e9); }
.about-page-text { flex: 1; }
.about-page-text h3 { font-size: 26px; color: var(--dark); margin-bottom: 8px; }
.about-page-text .en-name { font-size: 14px; color: var(--gray); margin-bottom: 20px; }
.about-page-text p { font-size: 14px; color: var(--gray); line-height: 1.8; margin-bottom: 12px; }
.about-page-text .company-info { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 16px; }
.about-page-text .company-info li { font-size: 13px; color: var(--gray); }
.about-page-text .company-info li b { color: var(--dark); min-width: 70px; display: inline-block; }

/* ===== Timeline ===== */
.timeline-section { background: #fff; border-radius: 12px; padding: 40px; margin-bottom: 40px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.timeline-section h3 { font-size: 22px; color: var(--dark); text-align: center; margin-bottom: 30px; }
.timeline { position: relative; padding: 0; }
.timeline::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 3px; background: linear-gradient(to bottom, var(--primary), var(--accent)); transform: translateX(-50%); }
.tl-item { display: flex; margin-bottom: 40px; position: relative; }
.tl-item:nth-child(odd) { flex-direction: row; }
.tl-item:nth-child(even) { flex-direction: row-reverse; }
.tl-item:last-child { margin-bottom: 0; }
.tl-dot { position: absolute; left: 50%; top: 10px; width: 16px; height: 16px; border-radius: 50%; background: var(--primary); border: 3px solid var(--primary-light); transform: translateX(-50%); z-index: 1; }
.tl-content { width: 45%; padding: 20px 24px; background: var(--light-bg); border-radius: 8px; }
.tl-content .year { font-size: 22px; font-weight: 800; color: var(--primary); margin-bottom: 6px; }
.tl-content h4 { font-size: 16px; color: var(--dark); margin-bottom: 6px; }
.tl-content p { font-size: 13px; color: var(--gray); line-height: 1.6; }

/* ===== Culture ===== */
.culture-section { background: #fff; border-radius: 12px; padding: 40px; margin-bottom: 40px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.culture-section h3 { font-size: 22px; color: var(--dark); text-align: center; margin-bottom: 30px; }
.culture-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.culture-card { text-align: center; padding: 30px 20px; background: var(--light-bg); border-radius: 8px; transition: all .3s; }
.culture-card:hover { background: var(--primary-light); transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.culture-card .cc-icon { width: 72px; height: 72px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 32px; color: #fff; margin: 0 auto 14px; }
.culture-card .cc-icon.c1 { background: linear-gradient(135deg, var(--primary), #4da2d9); }
.culture-card .cc-icon.c2 { background: linear-gradient(135deg, #4da2d9, #2196f3); }
.culture-card .cc-icon.c3 { background: linear-gradient(135deg, #2196f3, var(--accent)); }
.culture-card .cc-icon.c4 { background: linear-gradient(135deg, var(--accent), #66d9a0); }
.culture-card h4 { font-size: 16px; color: var(--dark); margin-bottom: 6px; }
.culture-card p { font-size: 13px; color: var(--gray); }

/* ===== Team ===== */
.team-section { background: #fff; border-radius: 12px; padding: 40px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.team-section h3 { font-size: 22px; color: var(--dark); text-align: center; margin-bottom: 30px; }
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.team-card { text-align: center; }
.team-card .avatar { width: 120px; height: 120px; border-radius: 50%; margin: 0 auto 12px; display: flex; align-items: center; justify-content: center; font-size: 48px; background: linear-gradient(135deg, #e3f2fd, #bbdefb); overflow: hidden; }
.team-card .avatar img { width: 100%; height: 100%; object-fit: cover; }
.team-card h5 { font-size: 15px; color: var(--dark); margin-bottom: 4px; }
.team-card p { font-size: 13px; color: var(--gray); }

/* ============================================================
   联系我们页 (contact.html) 专属样式
   ============================================================ */

/* ===== Contact Top ===== */
.contact-top { display: flex; gap: 30px; margin-bottom: 40px; }

/* ===== Contact Cards ===== */
.contact-cards { flex: 1; display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.cc-item { background: #fff; border-radius: 12px; padding: 28px 24px; text-align: center; box-shadow: 0 2px 15px rgba(0,0,0,0.06); transition: all .3s; }
.cc-item:hover { transform: translateY(-4px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.cc-item .cc-icon { width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 26px; color: #fff; margin: 0 auto 12px; }
.cc-item .cc-icon.c1 { background: linear-gradient(135deg, var(--primary), #4da2d9); }
.cc-item .cc-icon.c2 { background: linear-gradient(135deg, #4da2d9, #2196f3); }
.cc-item .cc-icon.c3 { background: linear-gradient(135deg, #2196f3, var(--accent)); }
.cc-item .cc-icon.c4 { background: linear-gradient(135deg, var(--accent), #66d9a0); }
.cc-item h4 { font-size: 16px; color: var(--dark); margin-bottom: 6px; }
.cc-item p { font-size: 14px; color: var(--gray); }
.cc-item .cc-link { color: var(--primary); font-weight: 600; }

/* ===== QR Card Side ===== */
.qr-card-side { width: 280px; flex-shrink: 0; background: #fff; border-radius: 12px; padding: 30px 20px; text-align: center; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.qr-card-side .qr-big { width: 140px; height: 140px; background: linear-gradient(135deg, var(--light-bg), #ddd); border-radius: 8px; margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; font-size: 60px; }
.qr-card-side h4 { font-size: 16px; color: var(--dark); margin-bottom: 4px; }
.qr-card-side p { font-size: 13px; color: var(--gray); }

/* ===== Form & Map ===== */
.contact-bottom { display: flex; gap: 30px; }
.contact-form { flex: 1; background: #fff; border-radius: 12px; padding: 40px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.contact-form h3 { font-size: 22px; color: var(--dark); margin-bottom: 24px; }
.form-row { display: flex; gap: 16px; margin-bottom: 16px; }
.form-group { flex: 1; }
.form-group label { display: block; font-size: 13px; color: var(--gray); margin-bottom: 6px; }
.form-group label span { color: #e74c3c; }
.form-group input,
.form-group textarea { width: 100%; padding: 10px 14px; border: 1px solid var(--border); border-radius: 6px; font-size: 14px; font-family: inherit; transition: all .3s; outline: none; }
.form-group input:focus,
.form-group textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(26,111,181,0.1); }
.form-group textarea { height: 120px; resize: vertical; }
.submit-btn { padding: 12px 48px; background: var(--primary); color: #fff; border: none; border-radius: 6px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all .3s; }
.submit-btn:hover { background: var(--primary-dark); }

/* ===== Contact Map ===== */
.contact-map { width: 480px; flex-shrink: 0; background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 2px 15px rgba(0,0,0,0.06); }
.contact-map h3 { font-size: 18px; color: var(--dark); margin-bottom: 12px; }
.contact-map .map-placeholder { height: 360px; border-radius: 8px; background: linear-gradient(135deg, #e3f2fd, #c8e6e9); display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; font-size: 48px; color: var(--primary); }
.contact-map .map-placeholder p { font-size: 14px; color: var(--gray); }

/* ============================================================
   响应式布局 (Responsive)
   ============================================================ */

@media (max-width: 1240px) {
    .container { width: 96%; }
}

@media (max-width: 768px) {
    .container { width: 94%; }
    .nav { display: none; }

    /* 首页 Banner */
    .banner-slide { height: 300px; }
    .banner-content h2 { font-size: 24px; }
    .banner-content p { font-size: 14px; }

    /* 首页 Stats */
    .stats-bar ul { flex-wrap: wrap; gap: 16px; }
    .stats-bar li { width: 45%; }

    /* 首页 Product Grid */
    .product-grid { grid-template-columns: repeat(2, 1fr); }

    /* 首页 Process Steps */
    .process-steps { flex-direction: column; align-items: center; gap: 20px; }
    .process-steps::before { display: none; }

    /* 首页 VS */
    .vs-container { flex-direction: column; }

    /* 首页 Advantages */
    .adv-grid { grid-template-columns: 1fr; }

    /* 首页 Solutions Grid */
    .solutions-grid { grid-template-columns: repeat(2, 1fr); }

    /* 首页 About */
    .about-wrap { flex-direction: column; }

    /* 首页 Equipment */
    .equip-carousel { grid-template-columns: repeat(2, 1fr); }

    /* 首页 Certificates */
    .cert-carousel { grid-template-columns: repeat(2, 1fr); }

    /* 首页 News */
    .news-wrap { flex-direction: column; }
    .news-featured { flex-direction: column; }
    .news-featured .nf-img { width: 100%; }

    /* 产品中心 */
    .inner-wrap { flex-direction: column; }
    .sidebar { width: 100%; }
    .prod-grid { grid-template-columns: repeat(2, 1fr); }

    /* 产品详情 */
    .prod-detail-top { flex-direction: column; padding: 16px; }
    .prod-gallery { width: 100%; }
    .prod-gallery .main-img { width: 100%; height: 260px; font-size: 64px; }
    .related-grid { grid-template-columns: repeat(2, 1fr); }
    .feature-list { grid-template-columns: 1fr; }

    /* 行业方案 */
    .sol-grid { grid-template-columns: 1fr; }
    .process-flow { flex-direction: column; align-items: center; gap: 16px; }
    .process-flow::before { display: none; }

    /* 生产设备 */
    .equip-detail-item { flex-direction: column; }
    .equip-detail-item .eq-img { width: 100%; height: 180px; }
    .factory-grid { grid-template-columns: repeat(2, 1fr); }
    .equip-stats { flex-wrap: wrap; gap: 16px; }
    .es-item { width: 45%; }

    /* 荣誉资质 */
    .cert-grid { grid-template-columns: repeat(2, 1fr); }
    .cert-card .cert-img { height: 200px; font-size: 56px; }
    .cert-modal .modal-img { height: 250px; }

    /* 新闻列表 */
    .news-page-sidebar { width: 100%; }
    .news-item { flex-direction: column; }
    .news-item .ni-img { width: 100%; height: 180px; }

    /* 新闻详情 */
    .article-sidebar { width: 100%; }
    .article-main { padding: 20px; }
    .article-header h2 { font-size: 20px; }
    .article-body { font-size: 14px; }
    .article-body .cover-img { height: 180px; font-size: 48px; }
    .article-footer { flex-direction: column; gap: 8px; }

    /* 关于我们 */
    .about-top { flex-direction: column; padding: 20px; }
    .about-page-img { width: 100%; height: 240px; }
    .about-page-text .company-info { grid-template-columns: 1fr; }
    .timeline::before { left: 12px; }
    .tl-item:nth-child(odd),
    .tl-item:nth-child(even) { flex-direction: row; }
    .tl-dot { left: 12px; }
    .tl-content { width: calc(100% - 40px); margin-left: 40px; }
    .culture-grid,
    .team-grid { grid-template-columns: repeat(2, 1fr); }

    /* 联系我们 */
    .contact-top { flex-direction: column; }
    .qr-card-side { width: 100%; }
    .contact-cards { grid-template-columns: 1fr; }
    .contact-bottom { flex-direction: column; }
    .contact-form { padding: 20px; }
    .form-row { flex-direction: column; }
    .contact-map { width: 100%; }
    .contact-map .map-placeholder { height: 240px; }

    /* 通用 Footer & 移动端 */
    .footer-top { flex-direction: column; }
    .footer-nav { grid-template-columns: repeat(3, 1fr); }
    .m-fbtn { display: flex; position: fixed; bottom: 0; left: 0; right: 0; background: #fff; border-top: 1px solid #eee; z-index: 999; justify-content: space-around; padding: 8px 0; }
    .m-fbtn a { display: flex; flex-direction: column; align-items: center; font-size: 11px; color: var(--gray); }
    .m-fbtn a i { font-size: 18px; margin-bottom: 2px; }
    .side-tools { display: none; }
}