*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px; line-height: 1.6; color: #2d3748;
  background: #f5f7fa; overflow-x: hidden;
}
a { color: #4a5568; text-decoration: none; transition: color .2s; }
a:hover { color: #3182ce; }
ul, ol { list-style: none; }
img { max-width: 100%; display: block; }
.fa, .fas, .far { font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands'; }

/* ---------- 通用容器 ---------- */
.container { max-width: 1200px; margin: 0 auto; padding: 0 15px; }
.m { max-width: 1200px; margin: 0 auto; }
.c_b { clear: both; }

/* ---------- 顶部通知栏 ---------- */
.top-bar {
  background: linear-gradient(135deg, #1a365d 0%, #2d3748 100%);
  color: #cbd5e0; font-size: 12px; padding: 6px 0; position: relative; z-index: 100;
}
.top-bar-inner {
  max-width: 1200px; margin: 0 auto; padding: 0 15px;
  display: flex; align-items: center; justify-content: space-between;
}
.top-bar-left { display: flex; align-items: center; gap: 12px; }
.top-bar-left .city-tag {
  background: rgba(255,255,255,.15); padding: 1px 8px; border-radius: 3px; color: #fff;
}
.top-bar-left .city-switch {
  color: #90cdf4; display: inline-flex; align-items: center; gap: 4px;
}
.top-bar-left .city-switch:hover { color: #fff; }
.top-bar-right { display: flex; align-items: center; gap: 16px; }
.top-bar-right a { color: #cbd5e0; display: inline-flex; align-items: center; gap: 4px; }
.top-bar-right a:hover { color: #90cdf4; }
.top-clock { color: #a0aec0; font-family: 'Courier New', monospace; font-size: 12px; }

/* ---------- 主导航头部 ---------- */
.main-header {
  background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.06);
  position: sticky; top: 0; z-index: 99; transition: box-shadow .3s, transform .3s;
}
.main-header.header-scrolled { box-shadow: 0 4px 20px rgba(0,0,0,.1); }
.header-inner {
  max-width: 1200px; margin: 0 auto; padding: 15px;
  display: flex; align-items: center; gap: 20px;
}
/* Logo */
.logo-area { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.logo-img { max-height: 48px; width: auto; }
.logo-text .site-title { font-size: 18px; font-weight: 700; color: #1a365d; line-height: 1.3; }
.logo-text .site-subtitle { font-size: 11px; color: #a0aec0; letter-spacing: 2px; }

/* 头部右侧：城市分站按钮（居右） */
.header-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; margin-left: auto; }
.btn-city {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 22px; border-radius: 6px; font-size: 14px; font-weight: 600;
  background: linear-gradient(135deg, #3182ce, #2b6cb0); color: #fff;
  transition: all .25s; white-space: nowrap;
  box-shadow: 0 2px 8px rgba(49,130,206,.25);
}
.btn-city:hover { background: linear-gradient(135deg, #2b6cb0, #1a4971); color: #fff; transform: translateY(-1px); box-shadow: 0 4px 14px rgba(49,130,206,.35); }
.btn-city .fa, .btn-city .fas { font-size: 15px; }

/* ---------- 导航菜单 ---------- */
.nav-bar {
  background: linear-gradient(135deg, #1a365d 0%, #2d3748 100%);
  border-top: 1px solid rgba(255,255,255,.05);
}
.nav-list {
  max-width: 1200px; margin: 0 auto; padding: 0 15px;
  display: flex; align-items: center; gap: 0;
}
.nav-item { position: relative; }
.nav-item a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 12px 18px; color: #cbd5e0; font-size: 14px; font-weight: 500;
  transition: all .25s; position: relative;
}
.nav-item a:hover { color: #fff; background: rgba(255,255,255,.08); }
.nav-item.nav-active a { color: #fff; }
.nav-item.nav-active a::after {
  content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 60%; height: 2px; background: linear-gradient(90deg, #3182ce, #63b3ed); border-radius: 1px;
}
/* ---------- 侧边悬浮工具栏 ---------- */
.side-toolbar {
  position: fixed; right: 20px; bottom: 80px; z-index: 999;
  display: flex; flex-direction: column; gap: 10px;
}
.side-btn {
  width: 44px; height: 44px; border-radius: 50%;
  background: #fff; color: #4a5568; font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 10px rgba(0,0,0,.12); transition: all .3s;
}
.side-btn:hover { background: #3182ce; color: #fff; transform: scale(1.1); }
.topclass {
    width: 19px;
}
/* 底部主区域 */
.footer-main {
  background: linear-gradient(135deg, #1a365d 0%, #2d3748 100%);
  color: #cbd5e0; padding: 30px 0 20px;
}
.footer-inner { max-width: 1200px; margin: 0 auto; padding: 0 15px; text-align: center; }
.footer-sitemap { margin-bottom: 15px; font-size: 13px; }
.footer-sitemap a { color: #90cdf4; margin: 0 4px; }
.footer-sitemap a:hover { color: #fff; }
.footer-copyright .copyright-line { font-size: 13px; color: #a0aec0; margin-bottom: 6px; }
.footer-location { font-size: 13px; color: #a0aec0; margin-bottom: 6px; }
.footer-location a { color: #90cdf4; }
.footer-statement { font-size: 12px; color: #718096; margin-bottom: 6px; }
.footer-disclaimer { font-size: 11px; color: #718096; max-width: 900px; margin: 0 auto; line-height: 1.7; }


/* ---------- 响应式 ---------- */
@media (max-width: 960px) {
  .header-inner { flex-wrap: wrap; gap: 10px; }
  .header-actions { margin-left: auto; }
  .nav-list { overflow-x: auto; flex-wrap: nowrap; }
  .side-toolbar { right: 10px; bottom: 60px; }
}
@media (max-width: 640px) {
  .top-bar-inner { font-size: 11px; gap: 8px; }
  .top-bar-right { gap: 10px; }
  .logo-text .site-title { font-size: 15px; }
}

/* ============================================================
   global‑new.css
   主体来源：地区站首页样式；少量保留原global‑new工具类
   header / footer 完全沿用destoon原有模板
   ============================================================ */
/* ---------- Reset & Base（保留原公共基础reset） ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px; line-height: 1.7; color: #1a1a1a;
  background: #fff; overflow-x: hidden;
}
a { color: inherit; text-decoration: none; transition: color .2s; }
a:hover { color: inherit; }
ul, ol { list-style: none; }
img { max-width: 100%; display: block; }
.fa, .fas, .far { font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands'; }

/* 原global‑new少量工具类保留 */
.container { max-width: 1200px; margin: 0 auto; padding: 0 15px; width:94%; }
.m { max-width: 1200px; margin: 0 auto; }
.c_b { clear: both; }
.flex { display:flex; flex-wrap:wrap; }
.more-link {
  color: #0052cc !important; font-weight: 600;
  display: inline-flex; align-items: center; gap: 2px;
}
.more-link:hover { color: #003380 !important; }

/* ========== 地区站主变量 ========== */
:root {
    --main-blue: #0052cc;
    --deep-blue: #003380;
    --gold-yellow: #ffb300;
    --gray-bg: #f6f8fa;
    --text-dark: #1a1a1a;
    --text-gray: #555;
}

/* 悬浮咨询电话 */
.float-phone {
    position: fixed;left: 0;top: 35%;z-index: 998;
    background: var(--gold-yellow);
    padding: 12px 10px;
    border-radius: 0 10px 10px 0;
    flex-shrink: 0;
}
.float-phone p {writing-mode: vertical-rl;text-align: center;font-weight: bold;font-size:14px;}

/* 页面内部顶部通栏（注意：网站全局top‑bar是header模板，这个是页面区块top‑bar‑area） */
.top-bar-area {
    background: var(--deep-blue);
    color: #fff;
    padding: 9px 0;
    font-size: 14px;
}
.top-bar-area .flex {justify-content: space-between;align-items: center;}
.top-bar-area span.hot-area {color: var(--gold-yellow);font-weight: bold;}
.top-bar-area span.update-time {color: #ffd700;margin-left: 18px;}

/* Banner首屏 */
.banner {
    background: linear-gradient(rgba(0,51,128,0.82),rgba(0,51,128,0.75)), url(../images/banner-bg.jpg) center/cover no-repeat;
    color: #fff;padding: 90px 0;
}
.banner .flex {
    gap: 60px;
    align-items: center;
    justify-content: space-between;
}
.banner-left {
    flex: 1 1 550px;
}
.banner-left h1 {font-size: 44px;line-height: 1.3;margin-bottom: 20px;}
.banner-left h1 span {color: var(--gold-yellow);}
.banner-left .page-update {font-size: 15px;color: #ffd700;margin-bottom: 18px;}
.banner-left p {font-size: 17px;opacity: 0.95;margin-bottom: 30px;max-width: 620px;}
.banner-tag {display: flex;gap: 18px;margin-bottom: 35px;flex-wrap: wrap;}
.tag-item {
    background: rgba(255,255,255,0.15);
    padding: 15px 20px;border-radius: 8px;text-align: center;min-width: 130px;
}
.banner-right {
    flex: 0 1 400px;
    background: rgba(255,255,255,0.12);
    backdrop-filter: blur(8px);padding: 30px;border-radius: 12px;min-width: 380px;
}
.banner-right h3 {margin-bottom: 20px;font-size: 19px;}
.banner-right li {margin: 12px 0;padding-left: 18px;position: relative;list-style: none;}
.banner-right li::before {content: "✓";color: var(--gold-yellow);position: absolute;left: 0;}

.btn-tel {
    background: var(--gold-yellow);
    color: #000;
    padding: 10px 24px;
    border-radius: 30px;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
    display:inline-block;
}

/* 通用区块标题 */
.section-title {text-align: center;margin-bottom: 50px;}
.section-title h2 {font-size: 32px;color: var(--main-blue);position: relative;padding-bottom: 14px;display: inline-block;}
.section-title h2::after {
    content: "";width: 75px;height: 3px;background: var(--gold-yellow);
    position: absolute;left: 50%;transform: translateX(-50%);bottom: 0;
}
.section-title p {color: var(--text-gray);margin-top: 12px;font-size: 16px;}

/* 关于我们 */
.about {padding: 75px 0;background: var(--gray-bg);}
.about-wrap {
    display: flex;
    gap: 45px;
    align-items: center;
}
.about-img {
    flex: 1 1 48%;
    border-radius: 10px;
    overflow:hidden;
    box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}
.about-img img {
    width: 100%;
    height: 400px;
    display: block;
    object-fit: cover;
}
.about-text {flex: 1 1 48%;}
.about-text p {margin-bottom: 18px;color: var(--text-gray);font-size: 15px;}
.about-info {display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 16px;margin-top: 25px;}
.info-box {background: #fff;padding: 15px;border-radius: 8px;box-shadow: 0 2px 8px #00000008;}

/* 四大优势 */
.advantage {padding:75px 0;}
.adv-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(220px,1fr));
    gap:24px;
}
.adv-card {background: #fff;padding:28px 22px;text-align:center;border-radius:10px;box-shadow:0 3px 12px rgba(0,0,0,0.06);}
.adv-card h4 {color: var(--main-blue);margin:14px 0;font-size:18px;}

/* 产品&新闻卡片共用 */
.product {padding:75px 0;background: var(--gray-bg);}
.news-section-area {padding:75px 0;}
.prod-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(200px,1fr));
    gap:18px;
    margin-bottom:40px;
}
.prod-item {
    background:#fff;
    border-radius:9px;
    overflow:hidden;
    box-shadow:0 2px 9px rgba(0,0,0,0.07);
    transition:0.25s;
}
.prod-item:hover {transform:translateY(-3px);box-shadow:0 5px 14px rgba(0,0,0,0.12);}
.prod-item img {
    width:100%;
    height:190px;
    object-fit:cover;
    display:block;
}
.prod-item p {padding:12px;text-align:center;font-size:14px;color:var(--text-gray);}


/* FAQ问答 */
.faq {padding:75px 0;background: var(--gray-bg);}
.faq-grid {display:grid;grid-template-columns:1fr 1fr;gap:22px;}
.faq-item {background:#fff;padding:22px;border-radius:9px;box-shadow:0 2px 8px rgba(0,0,0,0.06);}
.faq-item h4 {color:var(--main-blue);margin-bottom:12px;font-size:17px;}

/* 底部联系栏 */
.contact-bottom {padding:65px 0;background:var(--deep-blue);color:#fff;}
.contact-wrap {display:flex;gap:50px;justify-content:space-between;flex-wrap: wrap;}
.contact-col {flex:1 1 320px;}
.contact-col h3 {font-size:23px;margin-bottom:22px;padding-bottom:12px;border-bottom:2px solid var(--gold-yellow);display:inline-block;}
.contact-col p {margin:14px 0;opacity:0.92;}
.tel-big {font-size:30px;font-weight:bold;color:var(--gold-yellow);margin:18px 0;}

/* 页脚城市导航 */
.footer-city {padding:30px 0;background:#002659;color:#ccc;}
.footer-city h4 {color:#fff;margin-bottom:16px;font-size:16px;}
.city-list {display:flex;flex-wrap:wrap;gap:12px;line-height:2;}
.city-list a {padding:4px 10px;border:1px solid #4466aa;border-radius:4px;font-size:14px;}
.city-list a.active {background:var(--gold-yellow);color:#000;border-color:var(--gold-yellow);font-weight:bold;}

/* ===================== 全分辨率电脑+平板+手机完整适配断点 ===================== */
/* 1. 4K 超宽大屏 2560px以上 带鱼屏适配 */
@media (min-width: 1921px) {
    .container {max-width: 1400px;}
    .prod-grid {grid-template-columns: repeat(5,minmax(220px,1fr));}
    .adv-grid {grid-template-columns: repeat(5,1fr);}
    .banner-left h1 {font-size: 48px;}
}
/* 2. 1920px 1080P 主流台式显示器 */
@media (max-width: 1920px) and (min-width: 1681px) {
    .container {max-width: 1300px;}
}
/* 3. 1680px 老式高分显示器 */
@media (max-width: 1680px) and (min-width: 1441px) {
    .container {max-width: 1250px;}
}
/* 4. 1440px 2K笔记本显示器 */
@media (max-width: 1440px) and (min-width: 1367px) {
    .container {max-width: 1200px;}
}
/* 5. 1366px 笔记本最经典分辨率 */
@media (max-width: 1366px) and (min-width: 1281px) {
    .container {width: 96%;}
}
/* 6. 1280px 老旧宽屏显示器 */
@media (max-width: 1280px) and (min-width: 1201px) {
    .container {width: 97%;}
    .prod-grid {grid-template-columns: repeat(4,1fr);}
}
/* 7. 大屏平板 / 笔记本窄屏 1200px‑992px */
@media (max-width: 1200px) {
    .container {width: 100%;}
    .prod-grid {grid-template-columns: repeat(3,minmax(200px,1fr));}
    .adv-grid {grid-template-columns: repeat(3,1fr);}
    .banner-left h1 {font-size: 38px;}
}
/* 8. 992px‑768px */
@media (max-width: 992px) {
    .banner .flex {flex-direction: column;}
    .banner-right {min-width: unset;width:100%;flex:none;}
    .about-wrap {flex-direction: column;}
    .about-img,.about-text {flex:none;width:100%;}
    .contact-wrap {flex-direction: column;gap:30px;}
    .prod-grid {grid-template-columns: repeat(3,minmax(180px,1fr));}
    .adv-grid {grid-template-columns: repeat(2,1fr);}
    .faq-grid {grid-template-columns: 1fr;}
    .banner {padding:60px 0;}
    .about-info {grid-template-columns: 1fr 1fr;}
    .proc-wrap {flex-wrap: wrap;row-gap:30px;}
    .proc-step {flex: 1 1 45%;}
    .proc-step:not(:last-child)::after {display: none;}
}
/* 9. 常规平板竖版 768px‑640px */
@media (max-width: 768px) {
    .top-bar-area .flex {flex-direction: column;text-align:center;gap:6px;}
    .banner-left h1 {font-size: 30px;}
    .prod-grid {grid-template-columns: repeat(2,minmax(160px,1fr));}
    .adv-grid {grid-template-columns: repeat(2,1fr);}
    .section-title h2 {font-size:26px;}
    .float-phone {padding:10px 8px;}
    .prod-item img {height:160px;}
    .about-info {grid-template-columns: 1fr;}
    .tel-big {font-size:26px;}
}
/* 10. 小平板/折叠屏手机 640px‑480px */
@media (max-width: 640px) {
    .banner-tag {justify-content:center;}
    .tag-item {min-width:110px;padding:12px 15px;font-size:14px;}
    .banner-left h1 {font-size:26px;}
    .prod-grid {grid-template-columns: repeat(2,1fr);gap:12px;}
    .adv-grid {grid-template-columns: 1fr;}
    .proc-step {flex:1 1 100%;}
    .contact-col h3 {font-size:20px;}
    .float-phone {top:30%;}
}
/* 11. 主流手机 480px‑360px */
@media (max-width: 480px) {
    .banner {padding:45px 0;}
    .banner-left h1 {font-size:22px;}
    .banner-left p {font-size:15px;}
    .prod-grid {grid-template-columns: 1fr;}
    .prod-item img {height:180px;}
    .section-title h2 {font-size:22px;}
    .float-phone {display:none;}
    .city-list a {font-size:13px;padding:3px 8px;}
}
/* 12. 超小屏手机 <360px */
@media (max-width: 360px) {
    .banner-left h1 {font-size:20px;}
    .tag-item {min-width:100px;padding:10px;}
    .prod-item img {height:150px;}
    .top-bar-area {font-size:13px;}
}