@charset "utf-8";
/* ========== Reset & Global ========== */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #fff; overflow-x: hidden; color: #666; font-size: 14px; font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif; }
a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
img { display: block; max-width: 100%; border: 0; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
.clearfix::after { content: ""; display: block; clear: both; }
.container { width: 1200px; max-width: 100%; margin: 0 auto; }

/* ========== Fade-in Animation ========== */
.fade-in { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }

/* ========== Image Fallback ========== */
.img-fallback { background: linear-gradient(135deg, #0352a9, #00b07b); display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-height: 200px; color: #fff; font-size: 14px; border-radius: 4px; }

/* ========== Top Bar ========== */
.top-bar { background: #f8f8f8; border-bottom: 1px solid #ececec; padding: 10px 0; }
.top-bar .container { display: flex; justify-content: space-between; align-items: center; }
.top-bar p { font-size: 13px; color: #333; }
.top-bar ul { display: flex; }
.top-bar li { font-size: 13px; color: #333; padding: 0 15px; border-right: 1px solid #999; }
.top-bar li:last-child { border-right: none; }
.top-bar a:hover { color: #0352a9; }

/* ========== Header Center ========== */
.header-center { padding: 15px 0; }
.header-center .container { display: flex; align-items: center; justify-content: space-between; }
.logo-area { display: flex; align-items: center; }
.logo-area svg { width: 48px; height: 48px; margin-right: 12px; flex-shrink: 0; }
.logo-text h2 { font-size: 22px; color: #0352a9; font-weight: bold; letter-spacing: 1px; }
.logo-text p { font-size: 12px; color: #666; letter-spacing: 3px; margin-top: 4px; }
.header-phone { display: flex; align-items: center; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="%230352a9" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z"/></svg>') no-repeat left center; padding-left: 50px; }
.header-phone p { font-size: 13px; color: #6e6e6e; }
.header-phone h3 { font-size: 24px; color: #0352a9; font-weight: bold; }

/* ========== Main Navigation ========== */
.main-nav { background: #0352a9; height: 54px; line-height: 54px; position: relative; z-index: 100; }
.main-nav .container { display: flex; justify-content: center; }
.main-nav li { position: relative; }
.main-nav li a { display: block; color: #fff; padding: 0 22px; font-size: 15px; font-weight: bold; transition: background 0.3s; }
.main-nav li a:hover, .main-nav li.active a { background: rgba(255,255,255,0.15); }
.nav-dropdown { display: none; position: absolute; top: 54px; left: 0; background: #0352a9; min-width: 160px; z-index: 200; }
.main-nav li:hover .nav-dropdown { display: block; }
.nav-dropdown a { padding: 0 20px; font-size: 13px; white-space: nowrap; border-top: 1px solid rgba(255,255,255,0.15); }
.nav-dropdown a:hover { background: rgba(255,255,255,0.25); }

/* ========== Search Bar ========== */
.search-bar { background: #fff; padding: 10px 0; border-bottom: 1px solid #eee; }
.search-bar .container { display: flex; justify-content: space-between; align-items: center; }
.search-bar p { font-size: 13px; color: #333; }
.search-bar p a { margin: 0 5px; color: #333; }
.search-bar p a:hover { color: #0352a9; }
.search-box { display: flex; }
.search-box input { width: 220px; height: 32px; padding: 0 10px; border: 1px solid #ddd; border-right: none; outline: none; font-size: 13px; color: #999; }
.search-box button { width: 60px; height: 32px; background: #00b07b; color: #fff; border: none; font-size: 13px; cursor: pointer; }

/* ========== Banner ========== */
.banner { width: 100%; height: 540px; position: relative; overflow: hidden; }
.banner .slides { width: 100%; height: 100%; position: relative; }
.banner .slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; opacity: 0; transition: opacity 1s ease; }
.banner .slide.active { opacity: 1; }
.banner .slide-content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #fff; z-index: 5; }
.banner .slide-content h2 { font-size: 36px; font-weight: bold; text-shadow: 2px 2px 8px rgba(0,0,0,0.5); margin-bottom: 15px; }
.banner .slide-content p { font-size: 20px; text-shadow: 1px 1px 6px rgba(0,0,0,0.5); }
.banner .dots { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 10; display: flex; gap: 8px; }
.banner .dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.5); cursor: pointer; transition: background 0.3s; }
.banner .dot.active { background: #fff; }

/* ========== Product Section ========== */
.product-section { padding: 30px 0 40px; }
.product-section .container { display: flex; gap: 20px; }
.product-sidebar { width: 250px; flex-shrink: 0; background: #00b07b; }
.product-sidebar h3 { height: 67px; line-height: 67px; background: #0352a9; padding-left: 25px; }
.product-sidebar h3 a { color: #fff; font-size: 18px; font-weight: bold; }
.cat-list { padding: 15px 12px; }
.cat-list li { margin-bottom: 3px; }
.cat-list li a { display: block; padding: 0 15px; height: 42px; line-height: 42px; font-size: 15px; color: #333; background: #fff; transition: all 0.3s; }
.cat-list li a:hover { color: #0352a9; background: #f0f8ff; }
.product-main { flex: 1; }
.section-title { display: flex; justify-content: space-between; align-items: center; padding-bottom: 15px; border-bottom: 2px solid #0352a9; margin-bottom: 20px; }
.section-title h4 { font-size: 18px; color: #0352a9; font-weight: bold; }
.section-title h4 span { font-size: 14px; color: #999; font-weight: normal; margin-left: 10px; }
.section-title .more { font-size: 13px; color: #666; }
.section-title .more:hover { color: #0352a9; }
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.product-card { text-align: center; background: #fff; transition: box-shadow 0.3s; }
.product-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.12); }
.product-card a { display: block; }
.product-card .img-wrap { width: 100%; height: 200px; overflow: hidden; border: 1px solid #e2e2e2; }
.product-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.product-card:hover .img-wrap img { transform: scale(1.05); }
.product-card p { font-size: 14px; color: #333; line-height: 36px; }

/* ========== AD Banner ========== */
.ad-banner { width: 100%; height: 170px; background-size: cover; background-position: center; position: relative; margin-bottom: 35px; }
.ad-banner .ad-inner { position: absolute; right: 10%; top: 50%; transform: translateY(-50%); color: #fff; }
.ad-banner .ad-inner p { font-size: 13px; }
.ad-banner .ad-inner h3 { font-size: 28px; font-weight: bold; }

/* ========== Identify Section ========== */
.identify-section { padding: 60px 0; background: #f4f8fb; position: relative; }
.identify-section .sec-header { text-align: center; margin-bottom: 30px; }
.identify-section .sec-header h3 { font-size: 22px; color: #333; }
.identify-section .sec-header b { font-size: 28px; color: #00448e; font-weight: bold; }
.identify-section .sec-header p { font-size: 16px; color: #00448e; margin-top: 10px; }
.id-tabs { display: flex; margin-bottom: 0; }
.id-tab { flex: 1; height: 60px; line-height: 60px; text-align: center; background: #00b07b; color: #fff; font-size: 16px; cursor: pointer; transition: all 0.3s; }
.id-tab.active { background: #fff; color: #00b07b; }
.id-content { background: #fff; padding: 30px; }
.id-panel { display: none; }
.id-panel.active { display: block; }
.id-panel img { width: 100%; max-height: 450px; object-fit: cover; }

/* ========== Partners ========== */
.partners-section { padding: 30px 0; }
.partners-section .sec-en { font-size: 22px; color: #666; font-weight: bold; font-family: Arial; text-align: center; }
.partners-section .sec-cn { font-size: 16px; text-align: center; margin-bottom: 20px; }
.partners-section .sec-cn a { color: #00448e; }
.partners-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.partner-item { height: 90px; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; font-size: 16px; color: #333; font-weight: bold; transition: all 0.3s; }
.partner-item:hover { border-color: #0352a9; color: #0352a9; box-shadow: 0 2px 10px rgba(3,82,169,0.1); }

/* ========== Advantage Section ========== */
.advantage-section { position: relative; width: 100%; margin-bottom: 45px; }
.adv-title { width: 100%; height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #00448e; }
.adv-title h2 { font-size: 36px; color: #52cea9; }
.adv-title h3 { font-size: 36px; color: #fff; }
.adv-block { width: 100%; padding: 60px 0; background-size: cover; background-position: center; position: relative; color: #333; }
.adv-block::before { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,0.85); }
.adv-block .container { position: relative; z-index: 2; }
.adv-block h4 { font-size: 18px; color: #00448e; font-weight: bold; margin-bottom: 20px; }
.adv-block p { padding-left: 18px; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12"><circle cx="6" cy="6" r="4" fill="%2300b07b"/></svg>') no-repeat left 6px; font-size: 14px; color: #333; line-height: 26px; margin-bottom: 10px; }
.adv-block em { color: #00448e; font-size: 15px; font-weight: bold; }
.adv-left { max-width: 520px; }
.adv-right { max-width: 520px; margin-left: auto; }
.adv-block .adv-phone { margin-top: 20px; font-size: 20px; color: #0352a9; }
.adv-block .adv-phone span { font-size: 13px; color: #6e6e6e; display: block; }

/* ========== About Section ========== */
.about-section { padding: 40px 0 50px; }
.about-section .container { display: flex; gap: 30px; }
.about-left { flex: 1; }
.about-left .section-title { border-bottom-color: #0ab07e; border-left: none; }
.about-left .section-title h3 { padding-left: 12px; border-left: 3px solid #0ab07e; }
.about-intro { display: flex; gap: 20px; }
.about-intro dt { flex-shrink: 0; }
.about-intro dt img { padding: 8px; background: #e9e9e9; display: block; width: 300px; height: 200px; object-fit: cover; }
.about-intro dd { flex: 1; }
.about-intro dd h4 { font-size: 16px; color: #333; font-weight: bold; margin: 15px 0; }
.about-intro dd p { font-size: 13px; color: #666; line-height: 22px; height: 100px; overflow: hidden; }
.btn-detail { display: inline-block; width: 113px; height: 32px; line-height: 32px; text-align: center; background: #0ab07e; color: #fff; font-size: 13px; margin-top: 25px; transition: background 0.3s; }
.btn-detail:hover { background: #099d6a; }
.about-right { width: 300px; flex-shrink: 0; background: #00448e; padding: 25px 20px; }
.about-right h3 { font-size: 18px; padding-left: 10px; border-left: 3px solid #fff; margin-bottom: 20px; }
.about-right h3 a { color: #fff; }
.about-right h3 span { font-size: 12px; color: rgba(255,255,255,0.7); font-weight: normal; margin-left: 8px; }
.honor-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.honor-item img { width: 100%; height: 120px; object-fit: cover; }
.honor-item p { font-size: 12px; color: #fff; text-align: center; margin-top: 6px; }

/* ========== Company Photos ========== */
.photos-section { background: #ceefe5; padding: 40px 0; }
.photos-section .sec-en { font-size: 28px; color: #999; text-align: center; }
.photos-section .sec-cn { font-size: 20px; text-align: center; margin-bottom: 25px; }
.photos-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 15px; }
.photo-item img { width: 100%; height: 150px; object-fit: cover; border-radius: 4px; }
.photo-item p { font-size: 13px; color: #666; text-align: center; margin-top: 6px; }

/* ========== News Section ========== */
.news-section { padding: 30px 0; }
.news-section .container { display: flex; gap: 25px; }
.news-left { flex: 1; background: #fff; }
.news-tabs { display: flex; margin-bottom: 25px; }
.news-tab { flex: 1; height: 55px; line-height: 55px; text-align: center; font-size: 16px; font-weight: bold; color: #333; cursor: pointer; position: relative; transition: all 0.3s; }
.news-tab.active { background: #00448e; color: #fff; }
.news-tab span { font-size: 12px; font-weight: normal; margin-left: 8px; }
.news-content { display: none; padding: 0 20px; }
.news-content.active { display: block; }
.news-featured { display: flex; gap: 20px; margin-bottom: 25px; }
.news-featured dt { flex-shrink: 0; }
.news-featured dt img { width: 190px; height: 140px; object-fit: cover; border: 1px solid #ddd; }
.news-featured dd { flex: 1; }
.news-featured dd h4 { font-size: 15px; margin-bottom: 12px; }
.news-featured dd h4 a { color: #333; }
.news-featured dd h4 a:hover { color: #0352a9; }
.news-featured dd p { font-size: 13px; color: #666; line-height: 22px; height: 88px; overflow: hidden; }
.news-list { padding: 0 20px; }
.news-list li { display: flex; justify-content: space-between; padding-left: 12px; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8"><circle cx="4" cy="4" r="3" fill="%2300b07b"/></svg>') no-repeat left center; line-height: 34px; font-size: 13px; }
.news-list li a { color: #333; max-width: 75%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.news-list li a:hover { color: #0352a9; }
.news-list li span { color: #999; flex-shrink: 0; }
.news-right { width: 300px; flex-shrink: 0; background: #fff; }
.news-right h3 { font-size: 18px; padding-left: 12px; border-left: 3px solid #0ab07e; margin: 15px 20px 20px; }
.news-right h3 a { color: #00448e; }
.news-right h3 span { font-size: 12px; color: #999; font-weight: normal; margin-left: 8px; }
.faq-list { padding: 0 18px; }
.faq-item { padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px dashed #ddd; }
.faq-item h5 { font-size: 14px; margin-bottom: 10px; line-height: 22px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.faq-item h5 a { color: #333; }
.faq-item h5 a:hover { color: #0352a9; }
.faq-item p { font-size: 13px; color: #666; line-height: 22px; height: 66px; overflow: hidden; }

/* ========== CTA Section ========== */
.cta-section { width: 100%; padding: 50px 0; background-size: cover; background-position: center; text-align: center; color: #fff; position: relative; }
.cta-section::before { content: ""; position: absolute; inset: 0; background: rgba(3,82,169,0.8); }
.cta-section .container { position: relative; z-index: 2; }
.cta-section p { font-size: 14px; }
.cta-section h3 { font-size: 28px; font-weight: bold; margin: 10px 0 20px; }

/* ========== Links Section ========== */
.links-section { padding: 25px 0; }
.links-section h3 { font-size: 16px; padding-left: 12px; border-left: 3px solid #00448e; margin-bottom: 15px; }
.links-section h3 a { color: #333; }
.links-section h3 span { font-size: 12px; color: #999; font-weight: normal; margin-left: 8px; }
.links-section ul { display: flex; flex-wrap: wrap; gap: 20px; }
.links-section li a { color: #666; font-size: 13px; }
.links-section li a:hover { color: #0352a9; }

/* ========== Footer ========== */
.footer { background: #00448e; color: #fff; }
.footer-nav { display: flex; justify-content: center; gap: 0; padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,0.2); flex-wrap: wrap; }
.footer-nav a { color: #fff; font-size: 13px; padding: 5px 15px; border-left: 1px dotted rgba(255,255,255,0.3); }
.footer-nav a:first-child { border-left: none; }
.footer-content { display: flex; justify-content: space-between; align-items: flex-start; padding: 30px 0 20px; }
.footer-qr { flex-shrink: 0; }
.footer-qr img { background: #fff; padding: 10px; display: block; }
.footer-info { flex: 1; padding: 0 30px; }
.footer-info p { font-size: 13px; line-height: 28px; color: #fff; }
.footer-info a { color: #fff; }
.footer-info span { margin: 0 8px; }
.copyright { border-top: 1px solid rgba(255,255,255,0.15); padding: 15px 0; text-align: center; font-size: 12px; color: rgba(255,255,255,0.7); }
.copyright a { color: rgba(255,255,255,0.7); }
.copyright a:hover { color: #fff; }

/* ========== Inner Page Banner ========== */
.n-banner { width: 100%; height: 300px; background-size: cover; background-position: center; position: relative; }
.n-banner::before { content: ""; position: absolute; inset: 0; background: rgba(0,68,142,0.6); }
.n-banner .container { position: relative; z-index: 2; height: 100%; display: flex; align-items: center; justify-content: center; }
.n-banner h2 { color: #fff; font-size: 32px; font-weight: bold; }

/* ========== Breadcrumb ========== */
.breadcrumb-bar { background: #f8f8f8; border-bottom: 1px solid #eee; }
.breadcrumb-bar .container { display: flex; justify-content: space-between; align-items: center; height: 55px; }
.breadcrumb-bar h1 { font-size: 20px; color: #0352a9; font-weight: bold; }
.breadcrumb-bar h1 i { font-style: normal; font-size: 12px; color: #999; font-weight: normal; margin-left: 10px; }
.weiz { font-size: 13px; color: #666; }
.weiz a { color: #666; }
.weiz a:hover { color: #0352a9; }

/* ========== Page Content ========== */
.page-content { padding: 30px 0 50px; }
.detail-content { max-width: 900px; margin: 0 auto; }
.detail-img { text-align: center; margin-bottom: 25px; }
.detail-img img { max-width: 100%; height: auto; border: 1px solid #eee; }
.detail-info h2 { font-size: 24px; color: #333; font-weight: bold; margin-bottom: 15px; }
.detail-info p { font-size: 14px; color: #666; line-height: 26px; margin-bottom: 12px; text-indent: 2em; }

/* ========== Params Table ========== */
.params-table { width: 100%; border-collapse: collapse; margin: 25px 0; }
.params-table th { background: #0352a9; color: #fff; font-size: 14px; padding: 10px 15px; text-align: left; font-weight: bold; }
.params-table td { padding: 10px 15px; font-size: 13px; color: #333; border-bottom: 1px solid #eee; }
.params-table tr:nth-child(even) td { background: #f8f8f8; }

/* ========== Features List ========== */
.features-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin: 25px 0; }
.feature-item { display: flex; align-items: flex-start; gap: 10px; padding: 15px; background: #f4f8fb; border-radius: 4px; }
.feature-item svg { flex-shrink: 0; margin-top: 2px; }
.feature-item h4 { font-size: 14px; color: #333; font-weight: bold; margin-bottom: 5px; }
.feature-item p { font-size: 13px; color: #666; line-height: 20px; }

/* ========== Related Products ========== */
.related-products { margin-top: 40px; padding-top: 30px; border-top: 1px solid #eee; }
.related-products h3 { font-size: 18px; color: #0352a9; margin-bottom: 20px; padding-left: 12px; border-left: 3px solid #0352a9; }
.related-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.related-card a { display: block; text-align: center; }
.related-card .img-wrap { width: 100%; height: 160px; overflow: hidden; border: 1px solid #e2e2e2; }
.related-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.related-card p { font-size: 13px; color: #333; line-height: 30px; }

/* ========== Article ========== */
.article-header { text-align: center; padding-bottom: 20px; border-bottom: 1px solid #eee; margin-bottom: 25px; }
.article-header h2 { font-size: 24px; color: #333; font-weight: bold; margin-bottom: 10px; }
.article-meta { font-size: 13px; color: #999; }
.article-body { font-size: 14px; color: #666; line-height: 28px; }
.article-body p { margin-bottom: 15px; text-indent: 2em; }
.article-body img { max-width: 100%; margin: 15px auto; display: block; border: 1px solid #eee; }
.article-nav { display: flex; justify-content: space-between; margin-top: 30px; padding-top: 20px; border-top: 1px solid #eee; }
.article-nav a { font-size: 13px; color: #666; max-width: 45%; }
.article-nav a:hover { color: #0352a9; }

/* ========== Timeline ========== */
.timeline { position: relative; padding: 20px 0; margin: 30px 0; }
.timeline::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 3px; background: #0352a9; transform: translateX(-50%); }
.timeline-item { display: flex; margin-bottom: 30px; position: relative; }
.timeline-item:nth-child(odd) { flex-direction: row-reverse; text-align: right; }
.timeline-year { width: 48%; padding: 15px 20px; }
.timeline-year h4 { font-size: 22px; color: #0352a9; font-weight: bold; }
.timeline-desc { width: 48%; padding: 15px 20px; background: #f4f8fb; border-radius: 4px; }
.timeline-desc p { font-size: 14px; color: #666; line-height: 22px; }
.timeline-item::after { content: ""; position: absolute; left: 50%; top: 25px; width: 14px; height: 14px; background: #0352a9; border-radius: 50%; transform: translateX(-50%); border: 3px solid #fff; }

/* ========== Culture Cards ========== */
.culture-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin: 30px 0; }
.culture-card { padding: 30px 20px; text-align: center; background: #f4f8fb; border-radius: 4px; border-top: 3px solid #0352a9; transition: transform 0.3s; }
.culture-card:hover { transform: translateY(-5px); }
.culture-card h4 { font-size: 18px; color: #00448e; font-weight: bold; margin-bottom: 12px; }
.culture-card p { font-size: 14px; color: #666; line-height: 24px; }

/* ========== Team Grid ========== */
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; margin: 30px 0; }
.team-card { text-align: center; }
.team-card .img-wrap { width: 150px; height: 150px; border-radius: 50%; overflow: hidden; margin: 0 auto 12px; border: 3px solid #0352a9; }
.team-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.team-card h4 { font-size: 16px; color: #333; font-weight: bold; }
.team-card p { font-size: 13px; color: #666; margin-top: 4px; }

/* ========== Contact ========== */
.contact-info { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin: 30px 0; }
.contact-item { display: flex; align-items: flex-start; gap: 12px; padding: 20px; background: #f4f8fb; border-radius: 4px; }
.contact-item svg { flex-shrink: 0; }
.contact-item h4 { font-size: 15px; color: #333; font-weight: bold; margin-bottom: 6px; }
.contact-item p { font-size: 13px; color: #666; line-height: 22px; }
.contact-form { max-width: 600px; margin: 30px auto 0; }
.form-group { margin-bottom: 15px; }
.form-group label { display: block; font-size: 14px; color: #333; margin-bottom: 6px; }
.form-group input, .form-group textarea { width: 100%; padding: 10px 12px; border: 1px solid #ddd; font-size: 14px; outline: none; font-family: inherit; }
.form-group input:focus, .form-group textarea:focus { border-color: #0352a9; }
.form-group textarea { height: 120px; resize: vertical; }
.form-group button { display: inline-block; padding: 10px 40px; background: #0352a9; color: #fff; border: none; font-size: 16px; cursor: pointer; transition: background 0.3s; }
.form-group button:hover { background: #02458a; }

/* ========== News List Page ========== */
.news-list-page { padding: 30px 0 50px; }
.news-card { display: flex; gap: 20px; padding: 20px 0; border-bottom: 1px solid #eee; }
.news-card dt { flex-shrink: 0; }
.news-card dt img { width: 200px; height: 150px; object-fit: cover; border: 1px solid #ddd; }
.news-card dd { flex: 1; }
.news-card dd h4 { font-size: 16px; margin-bottom: 10px; }
.news-card dd h4 a { color: #333; }
.news-card dd h4 a:hover { color: #0352a9; }
.news-card dd .date { font-size: 12px; color: #999; margin-bottom: 8px; }
.news-card dd .summary { font-size: 13px; color: #666; line-height: 22px; height: 66px; overflow: hidden; }

/* ========== Product List Page ========== */
.product-list-page { padding: 30px 0 50px; }
.product-list-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.pl-card { text-align: center; border: 1px solid #eee; transition: all 0.3s; }
.pl-card:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.1); border-color: #0352a9; }
.pl-card a { display: block; }
.pl-card .img-wrap { width: 100%; height: 200px; overflow: hidden; }
.pl-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.pl-card:hover .img-wrap img { transform: scale(1.05); }
.pl-card p { font-size: 14px; color: #333; line-height: 40px; }

/* ========== Back to Top ========== */
.back-to-top { position: fixed; right: 20px; bottom: 80px; width: 44px; height: 44px; background: #0352a9; color: #fff; text-align: center; line-height: 44px; cursor: pointer; border-radius: 4px; display: none; z-index: 999; font-size: 20px; transition: background 0.3s; }
.back-to-top:hover { background: #02458a; }
.back-to-top.show { display: block; }

/* ========== Mobile Toggle ========== */
.mobile-toggle { display: none; width: 40px; height: 40px; background: #0352a9; border: none; cursor: pointer; position: relative; z-index: 1001; }
.mobile-toggle span { display: block; width: 22px; height: 2px; background: #fff; margin: 5px auto; transition: all 0.3s; }
.mobile-toggle.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.mobile-toggle.open span:nth-child(2) { opacity: 0; }
.mobile-toggle.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* ========== Responsive ========== */
@media (max-width: 1024px) {
  .container { width: 96%; }
  .product-sidebar { width: 220px; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .photos-grid { grid-template-columns: repeat(3, 1fr); }
  .partners-grid { grid-template-columns: repeat(3, 1fr); }
  .related-grid { grid-template-columns: repeat(3, 1fr); }
  .product-list-grid { grid-template-columns: repeat(3, 1fr); }
  .timeline::before { left: 20px; }
  .timeline-item, .timeline-item:nth-child(odd) { flex-direction: row; text-align: left; }
  .timeline-year, .timeline-desc { width: auto; flex: 1; }
  .timeline-item::after { left: 20px; }
  .timeline-item:nth-child(odd) .timeline-year { order: 0; }
}

@media (max-width: 768px) {
  .top-bar { display: none; }
  .header-center .container { flex-wrap: wrap; }
  .header-phone { display: none; }
  .mobile-toggle { display: block; }
  .main-nav { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #0352a9; z-index: 1000; }
  .main-nav.open { display: flex; align-items: center; justify-content: center; }
  .main-nav .container { flex-direction: column; width: 100%; }
  .main-nav li a { text-align: center; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.15); }
  .nav-dropdown { position: static; display: none; }
  .main-nav li:hover .nav-dropdown { display: none; }
  .search-bar { display: none; }
  .banner { height: 300px; }
  .banner .slide-content h2 { font-size: 22px; }
  .banner .slide-content p { font-size: 14px; }
  .product-section .container { flex-direction: column; }
  .product-sidebar { width: 100%; }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .ad-banner { height: 120px; }
  .identify-section .sec-header b { font-size: 20px; }
  .photos-grid { grid-template-columns: repeat(2, 1fr); }
  .partners-grid { grid-template-columns: repeat(2, 1fr); }
  .adv-title h2, .adv-title h3 { font-size: 24px; }
  .about-section .container { flex-direction: column; }
  .about-right { width: 100%; }
  .news-section .container { flex-direction: column; }
  .news-right { width: 100%; }
  .news-featured { flex-direction: column; }
  .news-featured dt img { width: 100%; }
  .footer-content { flex-direction: column; align-items: center; text-align: center; }
  .footer-info { padding: 20px 0; }
  .n-banner { height: 200px; }
  .n-banner h2 { font-size: 24px; }
  .product-list-grid { grid-template-columns: repeat(2, 1fr); }
  .related-grid { grid-template-columns: repeat(2, 1fr); }
  .features-list { grid-template-columns: 1fr; }
  .culture-cards { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-info { grid-template-columns: 1fr; }
  .timeline-item, .timeline-item:nth-child(odd) { flex-direction: column; }
  .timeline::before { left: 10px; }
  .timeline-item::after { left: 10px; }
  .adv-block { padding: 30px 0; }
  .adv-left, .adv-right { max-width: 100%; }
}