/* ===== 广州炬牛胶粘材料有限公司 · 官网共享样式 ===== */
:root{
  --navy:#0c2440;
  --navy-2:#14335c;
  --blue:#1d6fe0;
  --accent:#ff6a00;
  --accent-2:#ffb000;
  --ink:#16202e;
  --muted:#5b6675;
  --line:#e6ebf2;
  --bg:#ffffff;
  --bg-soft:#f5f8fc;
  --bg-deep:#0c2440;
  --shadow:0 10px 30px rgba(12,36,64,.10);
  --shadow-lg:0 18px 50px rgba(12,36,64,.16);
  --radius:14px;
  --radius-sm:10px;
  --radius-lg:18px;
  --maxw:1200px;

  /* —— 统一字号阶梯（1.125 型） —— */
  --fs-3xs:12px;    /* 角标 / 元信息 */
  --fs-2xs:12.8px;  /* 标签 */
  --fs-xs:13.5px;   /* 辅助说明 */
  --fs-sm:14.5px;   /* 卡片正文 */
  --fs-base:15.5px; /* 正文 */
  --fs-md:16.5px;   /* 导语 */
  --fs-lg:18.5px;   /* 卡片标题 */
  --fs-xl:21px;     /* 小标题 */
  --fs-2xl:26px;    /* 区块副标题 */

  /* —— 统一间距阶梯（8pt 网格） —— */
  --sp-1:8px;  --sp-2:12px; --sp-3:16px; --sp-4:24px;
  --sp-5:32px; --sp-6:44px; --sp-7:56px; --sp-8:88px;

  /* —— 图形比例（封面宽高比） —— */
  --ar-card:16/9;    /* 产品卡封面 */
  --ar-wide:16/5;    /* 横向大卡封面 */
  --ar-post:16/6;    /* 列表卡封面 */
  --ar-fig:21/8;     /* 文章插图 */

  /* —— 图标尺寸（相对容器的统一比例） —— */
  --ic-sm:24px;   /* 小卡图标 */
  --ic-md:28px;   /* 内嵌图标 */
  --ic-lg:112px;  /* 产品卡封面图标 */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.section{padding:var(--sp-8) 0}
.section.soft{background:var(--bg-soft)}
.section.deep{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff}
.section-head{text-align:center;max-width:760px;margin:0 auto var(--sp-6)}
.section-head .eyebrow{display:inline-block;font-size:var(--fs-2xs);letter-spacing:2.5px;color:var(--accent);font-weight:700;margin-bottom:var(--sp-2);text-transform:uppercase}
.section-head h2{font-size:clamp(26px,3.4vw,40px);line-height:1.28;font-weight:800;letter-spacing:.5px}
.section-head p{color:var(--muted);margin-top:var(--sp-3);font-size:var(--fs-md);line-height:1.8}
.deep .section-head p{color:rgba(255,255,255,.72)}

/* ===== 按钮 ===== */
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 26px;border-radius:999px;font-weight:700;font-size:15px;transition:.25s;cursor:pointer;border:1.5px solid transparent;white-space:nowrap}
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 8px 20px rgba(255,106,0,.30)}
.btn-primary:hover{transform:translateY(-2px);background:#ff7d1f;box-shadow:0 12px 26px rgba(255,106,0,.40)}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--navy);background:var(--bg-soft)}
.deep .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.deep .btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-light{background:#fff;color:var(--navy)}
.btn-light:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.18)}

/* ===== 顶部导航 ===== */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:18px;color:var(--navy)}
.brand .logo{width:38px;height:38px;flex:0 0 auto}
.brand span{display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;line-height:1.18;letter-spacing:2px}
.brand small{display:block;font-size:10.5px;color:var(--muted);font-weight:600;letter-spacing:.3px;line-height:1.2;word-break:break-word;margin-top:2px;align-self:stretch;text-align:justify;text-align-last:justify}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-size:15px;font-weight:600;color:var(--ink);position:relative;padding:6px 0}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--accent);transition:.25s}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-links a:hover{color:var(--navy)}
.nav-cta{display:flex;align-items:center;gap:14px}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle .bars{display:flex;flex-direction:column;gap:5px}
.nav-toggle .bars i{display:block;width:24px;height:2.5px;background:var(--navy);border-radius:2px;transition:.25s}
.nav-toggle .tgl-txt{display:none;font-style:normal}

/* ===== Hero ===== */
.hero{position:relative;background:linear-gradient(135deg,#0c2440 0%,#14335c 55%,#1d6fe0 130%);color:#fff;overflow:hidden}
.hero::before{content:"";position:absolute;right:-120px;top:-120px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(255,106,0,.30),transparent 60%)}
.hero::after{content:"";position:absolute;left:-160px;bottom:-180px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(29,111,224,.35),transparent 62%)}
.hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1.02fr .98fr;gap:var(--sp-5);align-items:center;padding:88px 0 96px}
.hero .tag{display:inline-flex;align-items:center;gap:var(--sp-1);background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.20);padding:8px 16px;border-radius:999px;font-size:var(--fs-2xs);font-weight:600;letter-spacing:1.2px;margin-bottom:var(--sp-4)}
.hero h1{font-size:clamp(32px,4.4vw,52px);line-height:1.22;font-weight:900;letter-spacing:.5px}
.hero h1 .hl{color:var(--accent-2)}
.hero p.lead{margin:var(--sp-4) 0 var(--sp-5);font-size:var(--fs-md);line-height:1.85;color:rgba(255,255,255,.84);max-width:540px}
.hero-actions{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.hero-stats{display:flex;gap:var(--sp-5);margin-top:var(--sp-6);flex-wrap:wrap;padding-top:var(--sp-5);border-top:1px solid rgba(255,255,255,.14)}
.hero-stats .num{font-size:32px;font-weight:900;color:#fff;line-height:1.15}
.hero-stats .num span{color:var(--accent-2);font-size:19px}
.hero-stats .lbl{font-size:var(--fs-2xs);color:rgba(255,255,255,.68);margin-top:2px}
.hero-visual{position:relative;display:flex;justify-content:center;align-items:center;min-height:420px}
.hero-visual svg{width:100%;max-width:556px;height:auto;filter:drop-shadow(0 22px 44px rgba(0,0,0,.38))}

/* ===== 优势卡片 ===== */
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.feat-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-5) 26px 28px;transition:.25s;box-shadow:var(--shadow)}
.feat-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
.feat-card .ic{width:56px;height:56px;border-radius:15px;background:linear-gradient(135deg,var(--navy),var(--blue));display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-3)}
.feat-card .ic svg{width:var(--ic-md);height:var(--ic-md);fill:#fff}
.feat-card h3{font-size:var(--fs-lg);margin-bottom:var(--sp-1)}
.feat-card p{color:var(--muted);font-size:var(--fs-sm);line-height:1.8}

/* ===== 产品速览 ===== */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.prod-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.25s;box-shadow:var(--shadow);display:flex;flex-direction:column}
.prod-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
/* 封面改用宽高比，随卡片宽度等比缩放，不再固定高度 */
.prod-card .thumb{aspect-ratio:var(--ar-card);min-height:148px;background:linear-gradient(135deg,var(--navy-2),var(--blue));position:relative;display:flex;align-items:center;justify-content:center}
.prod-card .thumb svg{width:30%;max-width:var(--ic-lg);min-width:60px;height:auto;fill:rgba(255,255,255,.94)}
.prod-card .thumb .badge{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.18);color:#fff;font-size:var(--fs-3xs);font-weight:700;padding:6px 12px;border-radius:999px;letter-spacing:1px}
.prod-card:hover .thumb svg{transform:scale(1.08)}
.prod-card .thumb svg{transition:transform .35s}
.prod-card .body{padding:var(--sp-4) var(--sp-4) 26px;flex:1;display:flex;flex-direction:column}
.prod-card h3{font-size:var(--fs-lg);margin-bottom:var(--sp-1)}
.prod-card p{color:var(--muted);font-size:var(--fs-sm);line-height:1.8;flex:1}
.prod-card .more{margin-top:var(--sp-3);color:var(--accent);font-weight:700;font-size:var(--fs-sm);display:inline-flex;align-items:center;gap:7px}

/* ===== 生产销售一体 时间线/流程 ===== */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.flow .step{padding:var(--sp-4) var(--sp-3) var(--sp-4);text-align:center;position:relative}
.flow .step .dot{width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.10);border:2px solid var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-3);font-weight:900;font-size:20px;color:var(--accent-2)}
.flow .step h4{font-size:var(--fs-base);margin-bottom:var(--sp-1)}
.flow .step p{font-size:var(--fs-xs);line-height:1.75;color:rgba(255,255,255,.72)}

/* ===== 关于页数据 ===== */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4);margin-top:var(--sp-2)}
.stat-box{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-5) var(--sp-4);text-align:center;box-shadow:var(--shadow)}
.stat-box .num{font-size:36px;font-weight:900;color:var(--navy);line-height:1.15}
.stat-box .num span{color:var(--accent);font-size:19px}
.stat-box .lbl{color:var(--muted);font-size:var(--fs-sm);margin-top:var(--sp-1)}

/* ===== 产品中心 筛选 ===== */
.filter-bar{display:flex;flex-wrap:wrap;gap:var(--sp-2);justify-content:center;margin-bottom:var(--sp-6)}
.filter-bar button{border:1.5px solid var(--line);background:#fff;color:var(--ink);padding:10px 22px;border-radius:999px;font-weight:700;font-size:var(--fs-sm);cursor:pointer;transition:.2s}
.filter-bar button:hover{border-color:var(--navy)}
.filter-bar button.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.prod-detail{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-4)}
/* 图片列加宽到 168px，图文占比约 29:71，视觉更均衡 */
.pd-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:grid;grid-template-columns:168px 1fr;box-shadow:var(--shadow);transition:.25s;min-height:230px}
.pd-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.pd-card .pic{background:linear-gradient(135deg,var(--navy-2),var(--blue));display:flex;align-items:center;justify-content:center}
.pd-card .pic svg{width:76px;height:76px;fill:rgba(255,255,255,.94);transition:transform .35s}
.pd-card:hover .pic svg{transform:scale(1.1)}
.pd-card .info{padding:var(--sp-4) var(--sp-4)}
.pd-card .info .cat{font-size:var(--fs-3xs);color:var(--accent);font-weight:700;letter-spacing:1px}
.pd-card .info h3{font-size:var(--fs-lg);margin:5px 0 var(--sp-1)}
.pd-card .info p{color:var(--muted);font-size:var(--fs-sm);line-height:1.8}
.pd-card .info ul{margin:var(--sp-3) 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:var(--sp-1)}
.pd-card .info li{font-size:var(--fs-2xs);background:var(--bg-soft);border:1px solid var(--line);padding:5px 11px;border-radius:8px;color:var(--navy-2)}
.pd-card.hide{display:none}

/* ===== 应用方案 ===== */
.app-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.app-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4) var(--sp-4) 26px;transition:.25s;box-shadow:var(--shadow)}
.app-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}
.app-card .ic{width:50px;height:50px;border-radius:13px;background:linear-gradient(135deg,var(--navy),var(--blue));display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-3)}
.app-card .ic svg{width:25px;height:25px;fill:#fff}
.app-card h3{font-size:var(--fs-base);margin-bottom:var(--sp-1)}
.app-card p{color:var(--muted);font-size:var(--fs-xs);line-height:1.8}

/* ===== 联系页 ===== */
/* 左信息略窄、右表单略宽，符合表单需更多横向空间的阅读习惯 */
.contact-wrap{display:grid;grid-template-columns:.92fr 1.08fr;gap:var(--sp-6);align-items:start}
.info-list{display:flex;flex-direction:column;gap:var(--sp-3)}
.info-row{display:flex;gap:var(--sp-3);align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-3) var(--sp-4);box-shadow:var(--shadow)}
.info-row .ic{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,var(--navy),var(--blue));display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.info-row .ic svg{width:23px;height:23px;fill:#fff}
.info-row .k{font-size:var(--fs-2xs);color:var(--muted);font-weight:600}
.info-row .v{font-size:var(--fs-base);line-height:1.65;font-weight:700;color:var(--navy)}
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-5);box-shadow:var(--shadow-lg)}
.form-card h3{font-size:var(--fs-xl);margin-bottom:var(--sp-1)}
.form-card p.sub{color:var(--muted);font-size:var(--fs-sm);margin-bottom:var(--sp-4)}
.field{margin-bottom:var(--sp-3)}
.field label{display:block;font-size:var(--fs-2xs);font-weight:700;color:var(--navy);margin-bottom:var(--sp-1)}
.field input,.field select,.field textarea{width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:var(--radius-sm);font-size:var(--fs-base);font-family:inherit;color:var(--ink);background:#fff;transition:.2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,111,224,.12)}
.field textarea{resize:vertical;min-height:108px}
.form-note{font-size:var(--fs-2xs);color:var(--muted);margin-top:var(--sp-1)}
.form-ok{display:none;background:#eafaf1;border:1px solid #b7e8cb;color:#1f7a46;padding:14px 16px;border-radius:10px;font-weight:700;margin-bottom:16px}
/* 地图 16:7，桌面约 380px 高，比原 330px 更舒展 */
.map-box{margin-top:var(--sp-6);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;aspect-ratio:16/7;min-height:280px;background:#eef2f7;position:relative}
.map-box iframe{width:100%;height:100%;border:0;display:block}
.map-box .map-link{position:absolute;right:14px;bottom:14px;z-index:2;background:var(--accent);color:#fff;font-size:13px;font-weight:700;padding:9px 15px;border-radius:10px;box-shadow:0 6px 16px rgba(255,106,0,.35);text-decoration:none}
.map-box .map-link:hover{background:#ff7d1f}

/* ===== 页脚 ===== */
.footer{background:var(--bg-deep);color:rgba(255,255,255,.78);padding:var(--sp-7) 0 var(--sp-4)}
.footer-grid{display:grid;grid-template-columns:1.5fr .9fr .9fr 1.25fr;gap:var(--sp-5) var(--sp-6)}
.footer .brand{color:#fff;margin-bottom:var(--sp-3)}
.footer .brand small{color:rgba(255,255,255,.55)}
.footer p.desc{font-size:var(--fs-sm);line-height:1.9;max-width:340px}
.footer h4{color:#fff;font-size:var(--fs-base);margin-bottom:var(--sp-3);letter-spacing:.5px}
.footer ul{list-style:none;display:flex;flex-direction:column;gap:var(--sp-2)}
.footer ul a, .footer ul li{font-size:var(--fs-sm);line-height:1.75;color:rgba(255,255,255,.72);transition:.2s}
.footer ul a:hover{color:var(--accent-2)}
.footer .copy{border-top:1px solid rgba(255,255,255,.12);margin-top:var(--sp-6);padding-top:var(--sp-4);font-size:var(--fs-2xs);color:rgba(255,255,255,.5);text-align:center}

/* ===== 资讯/技术文章 模块 ===== */
.page-banner{position:relative;background:linear-gradient(135deg,#0c2440 0%,#14335c 55%,#1d6fe0 130%);color:#fff;overflow:hidden;padding:64px 0 68px}
.page-banner::before{content:"";position:absolute;right:-100px;top:-140px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(255,106,0,.26),transparent 60%)}
.page-banner::after{content:"";position:absolute;left:-140px;bottom:-160px;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(29,111,224,.30),transparent 62%)}
.page-banner .inner{position:relative;z-index:2}
.page-banner h1{font-size:clamp(28px,3.6vw,42px);font-weight:900;line-height:1.26;letter-spacing:.5px;margin-bottom:var(--sp-2)}
.page-banner p.desc{color:rgba(255,255,255,.78);font-size:var(--fs-md);line-height:1.8;max-width:640px}
.crumb{display:flex;align-items:center;gap:var(--sp-1);font-size:var(--fs-2xs);color:rgba(255,255,255,.68);margin-bottom:var(--sp-3);flex-wrap:wrap}
.crumb a{color:rgba(255,255,255,.78);transition:.2s}
.crumb a:hover{color:var(--accent-2)}
.crumb span.sep{opacity:.5}
.crumb em{font-style:normal;color:var(--accent-2)}

/* 列表布局 */
.news-layout{display:grid;grid-template-columns:1fr 320px;gap:var(--sp-6);align-items:start}
.post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-4)}
.filter-bar.left{justify-content:flex-start;margin-bottom:var(--sp-4)}
.post-count{color:var(--muted);font-size:var(--fs-sm);margin-bottom:var(--sp-4)}
.post-count b{color:var(--accent);font-weight:800}

.post-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.25s;display:flex;flex-direction:column}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
/* 列表卡封面：宽高比 16:6，两列时约 210px 高，图文配比更稳 */
.post-card .cover{position:relative;aspect-ratio:var(--ar-post);min-height:150px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.post-card .cover svg{width:21%;max-width:84px;min-width:50px;height:auto;fill:rgba(255,255,255,.94);transition:transform .35s}
.post-card:hover .cover svg{transform:scale(1.09)}
.post-card .cover .cat{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.20);backdrop-filter:blur(4px);color:#fff;font-size:var(--fs-3xs);font-weight:700;padding:6px 12px;border-radius:999px;letter-spacing:.5px}
.post-card .cover .no{position:absolute;right:16px;bottom:6px;font-size:52px;font-weight:900;color:rgba(255,255,255,.16);line-height:1}
.post-card .body{padding:var(--sp-4) var(--sp-4) 24px;flex:1;display:flex;flex-direction:column}
.post-card h3{font-size:var(--fs-base);line-height:1.5;margin-bottom:var(--sp-2);transition:.2s}
.post-card:hover h3{color:var(--accent)}
.post-card p.excerpt{color:var(--muted);font-size:var(--fs-sm);line-height:1.8;flex:1}
.post-card .meta{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-top:var(--sp-4);padding-top:var(--sp-3);border-top:1px solid var(--line);font-size:var(--fs-2xs);color:var(--muted)}
.post-card .meta i{font-style:normal;display:inline-flex;align-items:center;gap:4px}
.post-card.hide{display:none}

/* 头条推荐大卡 */
/* 头条大卡：左右 1:1，封面用纵向比例，避免与右侧文字等高失衡 */
.post-featured{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.25s}
.post-featured:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.post-featured .cover{height:100%;min-height:280px}
.post-featured .cover svg{width:136px;height:136px}
.post-featured .cover .no{font-size:104px;bottom:6px;right:20px}
.post-featured .body{padding:var(--sp-5) var(--sp-6);display:flex;flex-direction:column;justify-content:center}
.post-featured .flag{display:inline-block;align-self:flex-start;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-size:var(--fs-3xs);font-weight:800;padding:6px 13px;border-radius:6px;letter-spacing:1px;margin-bottom:var(--sp-2)}
.post-featured h3{font-size:clamp(20px,2.2vw,26px);line-height:1.38;margin-bottom:var(--sp-2)}
.post-featured p.excerpt{font-size:var(--fs-base);line-height:1.85}

/* 侧边栏 */
.side-wrap{display:flex;flex-direction:column;gap:var(--sp-4);position:sticky;top:88px}
.side-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4);box-shadow:var(--shadow)}
.side-card h4{font-size:var(--fs-base);color:var(--navy);margin-bottom:var(--sp-3);padding-bottom:var(--sp-2);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:var(--sp-1)}
.side-card h4::before{content:"";width:3px;height:16px;background:var(--accent);border-radius:2px}
.rank-list{list-style:none;display:flex;flex-direction:column;gap:var(--sp-3)}
.rank-list li{display:flex;gap:var(--sp-2);align-items:flex-start}
.rank-list .rk{flex:0 0 auto;width:23px;height:23px;border-radius:6px;background:var(--bg-soft);color:var(--muted);font-size:var(--fs-3xs);font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:2px}
.rank-list li:nth-child(1) .rk{background:var(--accent);color:#fff}
.rank-list li:nth-child(2) .rk,.rank-list li:nth-child(3) .rk{background:var(--navy-2);color:#fff}
.rank-list a{font-size:var(--fs-sm);line-height:1.55;font-weight:600;transition:.2s}
.rank-list a:hover{color:var(--accent)}
.rank-list .rmeta{font-size:var(--fs-3xs);color:var(--muted);font-weight:400;margin-top:3px}
.tag-cloud{display:flex;flex-wrap:wrap;gap:var(--sp-1)}
.tag-cloud a{font-size:var(--fs-2xs);padding:7px 13px;border:1px solid var(--line);border-radius:8px;color:var(--muted);background:var(--bg-soft);transition:.2s;line-height:1.4}
.tag-cloud a:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.side-cta{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;border:0;text-align:center;padding:var(--sp-5) var(--sp-4)}
.side-cta h4{color:#fff;border-bottom:0;padding:0;margin-bottom:var(--sp-2);justify-content:center}
.side-cta h4::before{display:none}
.side-cta p{font-size:var(--fs-xs);line-height:1.8;color:rgba(255,255,255,.75);margin-bottom:var(--sp-4)}
.side-cta .btn{width:100%;justify-content:center}
.side-cta .tel{margin-top:var(--sp-3);font-size:21px;font-weight:800;color:var(--accent-2);letter-spacing:.5px}

/* 分页 */
.pager{display:flex;justify-content:center;gap:var(--sp-2);margin-top:var(--sp-7);flex-wrap:wrap}
.pager a,.pager span{min-width:42px;height:42px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid var(--line);border-radius:var(--radius-sm);font-size:var(--fs-sm);font-weight:700;color:var(--ink);background:#fff;transition:.2s}
.pager a:hover{border-color:var(--navy);color:var(--navy)}
.pager .cur{background:var(--navy);color:#fff;border-color:var(--navy)}
.pager .disabled{opacity:.45;cursor:not-allowed}

/* ===== 文章详情页 ===== */
.read-progress{position:fixed;top:68px;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));z-index:60;transition:width .1s linear}
/* 正文与目录栏比例约 3.3:1，阅读宽度更舒适 */
.article-layout{display:grid;grid-template-columns:1fr 272px;gap:var(--sp-7);align-items:start}
.article-main{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-6) var(--sp-7) var(--sp-7);box-shadow:var(--shadow)}
.article-head{border-bottom:1px solid var(--line);padding-bottom:var(--sp-4);margin-bottom:var(--sp-5)}
.article-head h1{font-size:clamp(24px,3vw,34px);line-height:1.36;font-weight:900;letter-spacing:.4px}
.article-head .ameta{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;margin-top:var(--sp-3);font-size:var(--fs-2xs);color:var(--muted)}
.article-head .ameta span{display:inline-flex;align-items:center;gap:5px}
.article-head .ameta .author{color:var(--navy);font-weight:700}
.article-tags-inline{display:inline-flex;gap:7px;flex-wrap:wrap}
.article-tags-inline a{font-size:var(--fs-3xs);color:var(--accent);background:rgba(255,106,0,.08);padding:4px 11px;border-radius:6px;font-weight:600}

.article-body{font-size:16.4px;line-height:1.95;color:#26303f}
.article-body>*{margin-bottom:var(--sp-4)}
.article-body p{text-align:justify}
.article-body h2{font-size:var(--fs-xl);font-weight:800;color:var(--navy);margin:var(--sp-6) 0 var(--sp-3);padding-left:14px;border-left:4px solid var(--accent);line-height:1.45;scroll-margin-top:86px}
.article-body h3{font-size:var(--fs-base);font-weight:800;color:var(--navy-2);margin:var(--sp-5) 0 var(--sp-2);scroll-margin-top:86px}
.article-body h3::before{content:"▪ ";color:var(--accent)}
.article-body ul,.article-body ol{padding-left:24px}
.article-body li{margin-bottom:9px}
.article-body strong{color:var(--navy);font-weight:800}
.article-body a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.article-lead{font-size:var(--fs-md);color:var(--muted);background:var(--bg-soft);border-left:4px solid var(--navy-2);padding:var(--sp-3) var(--sp-4);border-radius:0 var(--radius-sm) var(--radius-sm) 0;line-height:1.9}
.article-quote{margin:var(--sp-5) 0;padding:var(--sp-4);background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;font-size:var(--fs-base);line-height:1.9;color:var(--navy-2)}
.article-quote b{display:block;color:var(--accent);font-size:var(--fs-2xs);letter-spacing:1px;margin-bottom:var(--sp-1)}
.article-tip{display:flex;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);border-radius:12px;background:linear-gradient(135deg,rgba(255,106,0,.07),rgba(255,176,0,.07));border:1px solid rgba(255,106,0,.22)}
.article-tip .ic{flex:0 0 auto;width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:2px}
.article-tip p{font-size:var(--fs-base);line-height:1.8;color:var(--navy)}
.article-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);margin:var(--sp-4) 0;overflow:hidden;border-radius:var(--radius-sm)}
.article-table th,.article-table td{border:1px solid var(--line);padding:12px 15px;text-align:left;line-height:1.7}
.article-table th{background:var(--navy-2);color:#fff;font-weight:700;font-size:var(--fs-sm)}
.article-table tbody tr:nth-child(even){background:var(--bg-soft)}
.article-figure{margin:var(--sp-5) 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg-soft)}
/* 插图 21:8，全宽时约 290px 高，比原 150px 更有分量 */
.article-figure .figbox{aspect-ratio:var(--ar-fig);min-height:140px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--navy-2),var(--blue))}
.article-figure .figbox svg{width:13%;max-width:100px;min-width:54px;height:auto;fill:rgba(255,255,255,.94)}
.article-figure figcaption{font-size:var(--fs-xs);color:var(--muted);padding:var(--sp-2) var(--sp-3);text-align:center;background:#fff;line-height:1.7}

/* 右侧目录 */
.article-toc{position:sticky;top:88px;display:flex;flex-direction:column;gap:20px}
.toc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4);box-shadow:var(--shadow)}
.toc-card h4{font-size:var(--fs-base);color:var(--navy);margin-bottom:var(--sp-3);padding-bottom:var(--sp-2);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:var(--sp-1)}
.toc-card h4::before{content:"";width:3px;height:16px;background:var(--accent);border-radius:2px}
.toc-list{list-style:none;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 210px);overflow-y:auto}
.toc-list a{display:block;font-size:var(--fs-xs);color:var(--muted);padding:8px 12px;border-radius:8px;border-left:2px solid transparent;line-height:1.6;transition:.2s}
.toc-list a:hover{color:var(--navy);background:var(--bg-soft)}
.toc-list a.active{color:var(--accent);background:rgba(255,106,0,.07);border-left-color:var(--accent);font-weight:700}
.toc-list a.sub{padding-left:26px;font-size:var(--fs-2xs)}

/* 上下篇 + 文末 */
.article-nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-top:var(--sp-6);padding-top:var(--sp-5);border-top:1px solid var(--line)}
.article-nav a{display:block;padding:var(--sp-3) var(--sp-4);border:1px solid var(--line);border-radius:12px;background:var(--bg-soft);transition:.2s}
.article-nav a:hover{border-color:var(--accent);background:#fff}
.article-nav .dir{font-size:var(--fs-3xs);color:var(--muted);font-weight:700;letter-spacing:1px;margin-bottom:var(--sp-1)}
.article-nav .ttl{font-size:var(--fs-base);font-weight:700;color:var(--navy);line-height:1.55}
.article-nav .next{text-align:right}
.article-tags{margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid var(--line);font-size:var(--fs-sm);color:var(--muted)}
.article-tags .tag-cloud{margin-top:var(--sp-2)}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.rel-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.25s;display:flex;flex-direction:column}
.rel-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
/* 相关推荐封面 16:7，三列时约 160px 高 */
.rel-card .cover{aspect-ratio:16/7;min-height:112px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.rel-card .cover svg{width:23%;max-width:78px;min-width:46px;height:auto;fill:rgba(255,255,255,.94);transition:transform .35s}
.rel-card:hover .cover svg{transform:scale(1.1)}
.rel-card .body{padding:var(--sp-3) var(--sp-3) var(--sp-4);flex:1;display:flex;flex-direction:column}
.rel-card h4{font-size:var(--fs-sm);line-height:1.55;margin-bottom:var(--sp-1);flex:1}
.rel-card .meta{font-size:var(--fs-2xs);color:var(--muted);margin-top:var(--sp-2)}

/* ===== 产品系列详情页 ===== */
.series-nav{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-4);position:relative;z-index:2}
.series-nav a{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border-radius:999px;font-size:var(--fs-xs);font-weight:700;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.85);transition:.2s}
.series-nav a:hover{background:rgba(255,255,255,.20);color:#fff}
.series-nav a.on{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 6px 18px rgba(255,106,0,.35)}
.series-intro{display:grid;grid-template-columns:1.08fr .92fr;gap:var(--sp-7);align-items:start}
.series-intro .lead{font-size:var(--fs-md);line-height:1.95;color:#333c4a}
.series-intro .lead p+p{margin-top:var(--sp-3)}
.spec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-3)}
.spec-box{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-3) var(--sp-4);box-shadow:var(--shadow)}
.spec-box .k{font-size:var(--fs-2xs);color:var(--muted);font-weight:700;letter-spacing:.5px}
.spec-box .v{font-size:20px;font-weight:800;color:var(--navy);margin-top:var(--sp-1);line-height:1.4}
.spec-box .v small{font-size:var(--fs-2xs);font-weight:600;color:var(--muted)}
.spec-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px}
.spec-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);min-width:840px;background:#fff;box-shadow:var(--shadow)}
.spec-table thead th{background:var(--navy);color:#fff;font-weight:700;padding:var(--sp-3) var(--sp-3);text-align:left;white-space:nowrap;font-size:var(--fs-xs);letter-spacing:.3px}
.spec-table td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--line);color:#333c4a;vertical-align:top;line-height:1.75}
.spec-table tbody tr:nth-child(even){background:var(--bg-soft)}
.spec-table tbody tr:hover{background:#fff6ef}
.spec-table td:first-child{font-weight:800;color:var(--navy);white-space:nowrap}
.spec-note{display:flex;align-items:center;gap:var(--sp-1);margin-top:var(--sp-3);font-size:var(--fs-xs);line-height:1.7;color:var(--muted);background:var(--bg-soft);border:1px dashed var(--line);padding:var(--sp-2) var(--sp-3);border-radius:var(--radius-sm)}
.model-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.model-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4) var(--sp-4) var(--sp-4);box-shadow:var(--shadow);transition:.25s;overflow:hidden}
.model-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:transparent}
.model-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--accent),var(--accent-2))}
.model-card .mk{font-size:var(--fs-lg);font-weight:900;color:var(--navy);letter-spacing:.5px}
.model-card .mtag{display:inline-block;margin:var(--sp-2) 0 var(--sp-2);font-size:var(--fs-3xs);font-weight:800;color:var(--accent);background:rgba(255,106,0,.10);padding:5px 11px;border-radius:6px}
.model-card p{font-size:var(--fs-sm);color:var(--muted);line-height:1.8}
.model-card ul{margin-top:var(--sp-3);padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:7px}
.model-card li{font-size:var(--fs-2xs);background:var(--bg-soft);border:1px solid var(--line);padding:5px 10px;border-radius:7px;color:var(--navy-2)}
.step-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.step-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4) var(--sp-3);box-shadow:var(--shadow)}
.step-item .n{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-weight:900;display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-2);font-size:var(--fs-sm)}
.step-item h4{font-size:var(--fs-base);font-weight:800;color:var(--navy);margin-bottom:var(--sp-1)}
.step-item p{font-size:var(--fs-xs);color:var(--muted);line-height:1.8}
.faq-list{display:flex;flex-direction:column;gap:var(--sp-2)}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.faq-q{padding:var(--sp-3) var(--sp-4);font-weight:800;color:var(--navy);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);font-size:var(--fs-base);line-height:1.6;user-select:none}
.faq-q::after{content:"+";color:var(--accent);font-weight:900;font-size:22px;line-height:1;transition:.25s;flex:0 0 auto}
.faq-item.open .faq-q::after{content:"\2212"}
.faq-a{display:none;padding:0 var(--sp-4) var(--sp-4);color:var(--muted);font-size:var(--fs-sm);line-height:1.9}
.faq-item.open .faq-a{display:block}
.pd-card .more{display:inline-flex;align-items:center;gap:7px;margin-top:var(--sp-3);font-size:var(--fs-xs);font-weight:800;color:var(--accent);transition:.2s}
.pd-card .more:hover{gap:12px}
.pd-card .more svg{width:16px;height:16px;fill:currentColor}

/* ===== 响应式 ===== */
@media(max-width:980px){
  .hero-inner{grid-template-columns:1fr;padding:64px 0 72px;gap:var(--sp-5)}
  .hero-visual{order:-1;min-height:0}
  .hero-visual svg{max-width:400px}
  .feat-grid,.prod-grid,.stat-grid,.app-grid{grid-template-columns:repeat(2,1fr)}
  .flow{grid-template-columns:repeat(2,1fr)}
  .prod-detail{grid-template-columns:1fr}
  /* 单列时卡片变宽，封面改为横向比例，避免高度失控 */
  .pd-card{grid-template-columns:1fr;min-height:0}
  .pd-card .pic{aspect-ratio:16/6;min-height:96px}
  .pd-card .pic svg{width:48px;height:48px}
  .contact-wrap{grid-template-columns:1fr;gap:var(--sp-5)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .series-intro{grid-template-columns:1fr;gap:var(--sp-5)}
  .model-grid{grid-template-columns:repeat(2,1fr)}
  .step-flow{grid-template-columns:repeat(2,1fr)}
  .news-layout{grid-template-columns:1fr}
  .article-layout{grid-template-columns:1fr}
  .side-wrap,.article-toc{position:static}
  .post-featured{grid-template-columns:1fr}
  .post-featured .cover{min-height:180px;aspect-ratio:16/7}
  .rel-grid{grid-template-columns:repeat(2,1fr)}
  .side-hot{order:-1}
}
@media(max-width:760px){
  /* 两列封面进一步压扁，保持与卡片宽度的合理比例 */
  .prod-card .thumb{aspect-ratio:16/8}
  .rel-card .cover{aspect-ratio:16/6}
  .post-card .cover{aspect-ratio:16/5}
}
@media(max-width:680px){
  .section{padding:var(--sp-7) 0}
  .container{padding:0 18px}
  .prod-card .thumb{aspect-ratio:16/7}
  .rel-card .cover{aspect-ratio:16/6}
  .post-card .cover{aspect-ratio:16/5}
  .hero-stats{gap:var(--sp-4)}
  .hero-stats .num{font-size:27px}
  .nav-links{position:fixed;top:68px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:10px 22px 20px;border-bottom:1px solid var(--line);box-shadow:var(--shadow);transform:translateY(-120%);transition:.3s;z-index:49}
  .nav-links.open{transform:translateY(0)}
  .nav-links a{padding:14px 0;border-bottom:1px solid var(--line)}
  .nav-links a::after{display:none}
  .nav-toggle{display:flex}
  .nav-cta .btn-ghost{display:none}
  .feat-grid,.prod-grid,.stat-grid,.app-grid,.flow{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .pd-card{grid-template-columns:1fr}
  .pd-card .pic{aspect-ratio:16/5;min-height:84px}
  .post-grid{grid-template-columns:1fr}
  .rel-grid{grid-template-columns:1fr}
  .model-grid{grid-template-columns:1fr}
  .step-flow{grid-template-columns:1fr}
  .spec-grid{grid-template-columns:1fr}
  .article-main{padding:26px 20px 30px}
  .article-body{font-size:15.6px}
  .article-nav{grid-template-columns:1fr}
  .article-nav .next{text-align:left}
  .page-banner{padding:44px 0 46px}
  .toc-list{max-height:none}
}

/* ===== 小节标题（子页正文内） ===== */
.sub-head{font-size:clamp(21px,2.5vw,29px);font-weight:800;color:var(--navy);margin-bottom:var(--sp-5);padding-left:14px;border-left:4px solid var(--accent);line-height:1.4}

/* ===== 中等屏幕：导航紧凑化，避免与品牌全称挤压 ===== */
@media(max-width:1080px){
  .nav-links{gap:20px}
  .nav-links a{font-size:14.5px}
  .brand{font-size:16.5px}
  .brand small{font-size:9.6px}
}
@media(max-width:900px){
  .nav-links{position:fixed;top:68px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:10px 22px 20px;border-bottom:1px solid var(--line);box-shadow:var(--shadow);transform:translateY(-120%);transition:.3s;z-index:49}
  .nav-links.open{transform:translateY(0)}
  .nav-links a{padding:14px 0;border-bottom:1px solid var(--line)}
  .nav-links a::after{display:none}
  .nav-toggle{display:flex}
}

/* ===== 无障碍 & 体验增强 ===== */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--navy);color:#fff;padding:12px 20px;border-radius:0 0 10px 0;font-weight:700}
.skip-link:focus{left:0}
:focus-visible{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:4px}
.to-top{
  position:fixed;right:22px;bottom:26px;z-index:55;
  width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 26px rgba(255,106,0,.42);
  opacity:0;visibility:hidden;transform:translateY(14px);transition:.28s;
}
.to-top svg{width:20px;height:20px;fill:#fff}
.to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
.to-top:hover{transform:translateY(-3px)}
@media(max-width:680px){.to-top{right:14px;bottom:16px;width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* ===== 页脚备案 / 版权 ===== */
.foot-legal{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:20px;text-align:center}
.foot-legal .copy{font-size:13px;color:rgba(255,255,255,.5);border:0;margin:0;padding:0}
.foot-legal .beian{margin-top:8px;font-size:12.5px;color:rgba(255,255,255,.45);display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.foot-legal .beian a{color:rgba(255,255,255,.55)}
.foot-legal .beian a:hover{color:var(--accent-2)}

/* ===== 询盘表单增强 ===== */
.form-ok .ok-title{font-size:15px;margin-bottom:6px}
.form-ok .ok-sub{font-size:13px;font-weight:400;color:#2c6b48;line-height:1.7}
.form-ok .ok-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.form-ok .ok-actions a,.form-ok .ok-actions button{
  border:0;cursor:pointer;font-family:inherit;font-size:13px;font-weight:700;
  padding:9px 15px;border-radius:9px;background:#1f7a46;color:#fff;transition:.2s;text-decoration:none;display:inline-flex;align-items:center;
}
.form-ok .ok-actions .ghost{background:#fff;color:#1f7a46;border:1px solid #b7e8cb}
.form-ok .ok-actions a:hover,.form-ok .ok-actions button:hover{opacity:.88}
.form-tip{margin-top:14px;font-size:12.5px;color:var(--muted);line-height:1.7;background:var(--bg-soft);border:1px dashed var(--line);border-radius:10px;padding:11px 14px}

/* ==========================================================================
   ===== 全站视觉统一层（2026-09-18 全面升级） =====
   统一 CTA 区块 / 按钮 / 亮色流程条 / 紧凑变体 / 中间断点
   ========================================================================== */

/* —— 统一 CTA 区块：替代各页内联 style —— */
.cta-block{text-align:center;max-width:780px}
.cta-block h2{font-size:clamp(24px,3vw,34px);font-weight:800;line-height:1.36;letter-spacing:.5px}
.cta-block p{margin:var(--sp-3) 0 var(--sp-5);font-size:var(--fs-md);line-height:1.85;color:var(--muted)}
.deep .cta-block p{color:rgba(255,255,255,.78)}
.center-block{text-align:center;margin-top:var(--sp-6)}

/* —— 通栏按钮 —— */
.btn.btn-block{width:100%;justify-content:center}

/* —— 亮色流程条（浅底区块内使用） —— */
.flow-light{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.flow-light .step{color:var(--ink)}
.flow-light .dot{background:var(--bg-soft);border-color:var(--navy);color:var(--accent)}
.flow-light h4{color:var(--navy)}
.flow-light p{color:var(--muted)}

/* —— 紧凑变体 —— */
.page-banner-sm{padding:28px 0}
.crumb-tight{margin-bottom:0}
.section-tight{padding-top:var(--sp-6)}
.section-head-tight{margin-bottom:var(--sp-5)}
.hero-inner-tight{padding:0;align-items:center}
.stat-grid-2{grid-template-columns:repeat(2,1fr);gap:var(--sp-3)}
.side-tel{margin-top:var(--sp-3);font-size:17px;font-weight:800;color:var(--accent);text-align:center;letter-spacing:.5px}
.lead-strong{font-size:var(--fs-md);color:var(--ink);line-height:1.9;margin-bottom:var(--sp-3)}
.lead-normal{color:var(--muted);line-height:1.9;margin-bottom:var(--sp-3)}
.hl-accent{color:var(--accent);font-weight:700}

/* —— 中间断点：让 1024 / 1280 等常见宽度也不挤 —— */
@media(max-width:1180px){
  .news-layout{gap:var(--sp-5)}
  .article-layout{gap:var(--sp-5)}
  .footer-grid{gap:var(--sp-4) var(--sp-5)}
}
@media(min-width:1400px){
  :root{--maxw:1280px}
}

/* ===== 封面质感统一层：柔光 + 细斜纹，消除大面积纯色空白 ===== */
.pd-card .pic,.article-figure .figbox{position:relative}
.prod-card .thumb::after,
.post-card .cover::after,
.rel-card .cover::after,
.post-featured .cover::after,
.pd-card .pic::after,
.article-figure .figbox::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(circle at 80% 16%,rgba(255,255,255,.18),transparent 58%),
    repeating-linear-gradient(135deg,rgba(255,255,255,.055) 0 1px,transparent 1px 12px);
}
.prod-card .thumb svg,.post-card .cover svg,.rel-card .cover svg,
.post-featured .cover svg,.pd-card .pic svg,.article-figure .figbox svg{position:relative;z-index:1}
.prod-card .thumb .badge,.post-card .cover .cat,.post-card .cover .no,
.post-featured .cover .no{z-index:1}

/* ==========================================================================
   ===== 移动端顶栏与标题修正（置于末尾以确保优先级） =====
   ========================================================================== */
@media(max-width:680px){
  /* 顶栏：收起英文副标题，品牌全称保持单行，避免撑高导航 */
  .header .nav{height:62px}
  .header .brand{font-size:14px;letter-spacing:.5px;gap:9px}
  .header .brand .logo{width:33px;height:33px}
  .header .brand small{display:none}
  .header .brand span{letter-spacing:.5px}
  .header .nav-cta{gap:10px}
  .header .nav-cta .btn-primary{padding:10px 17px;font-size:13.5px}
  .header .nav-links{top:62px}
  .read-progress{top:62px}
  /* 标题：缩小到不会出现末行孤字 */
  .hero h1{font-size:clamp(25px,7vw,31px);line-height:1.3}
  .hero .tag{font-size:12px;letter-spacing:.8px;padding:7px 13px}
}
/* 页脚列宽微调：让产品中心列与其他列的高度差更小 */
@media(min-width:981px){
  .footer-grid{grid-template-columns:1.55fr .92fr .92fr 1.4fr}
}

/* —— 移动端顶栏收紧（确保品牌全称单行不换行） —— */
@media(max-width:680px){
  .header .brand{font-size:13px;letter-spacing:.4px;gap:8px;flex:0 0 auto}
  .header .brand .logo{width:31px;height:31px}
  .header .brand span{letter-spacing:.4px;white-space:nowrap}
  .header .nav-cta{gap:8px}
  .header .nav-cta .btn-primary{padding:9px 15px;font-size:13px}
  .header .nav-toggle{padding:6px;gap:4px}
}

/* ===== 联系页区位示意图 ===== */
.map-svg{width:100%;height:100%;display:block}
.map-legend{
  position:absolute;left:14px;bottom:14px;z-index:2;
  background:rgba(12,36,64,.86);color:rgba(255,255,255,.92);
  font-size:var(--fs-3xs);font-weight:600;letter-spacing:.3px;
  padding:8px 14px;border-radius:var(--radius-sm);backdrop-filter:blur(4px);
}
@media(max-width:680px){
  .map-box{aspect-ratio:4/3;min-height:240px}
  .map-legend{left:10px;bottom:10px;font-size:11.5px;padding:6px 11px}
  .map-box .map-link{right:10px;bottom:10px;font-size:12px;padding:8px 13px}
}

/* ==========================================================================
   ===== 窄屏溢出与比例冲突修复 =====
   ========================================================================== */

/* 1) 头条卡：它同时带 .post-card 类，须覆盖普通卡的封面比例与图标上限，
      否则 aspect-ratio 会反推出超宽封面，导致图标偏离中心。 */
.post-featured .cover{width:100%;aspect-ratio:auto}
.post-featured .cover svg{width:172px;height:172px;max-width:none;min-width:0}

/* 2) Grid 子项允许收缩，避免内容 min-content 撑破容器 */
.article-layout>*,.news-layout>*,.post-grid>*,.prod-grid>*,.feat-grid>*,
.app-grid>*,.model-grid>*,.step-flow>*,.rel-grid>*,.footer-grid>*{min-width:0}

/* 3) 文章正文内的宽表格：窄屏改为容器内横向滚动，不再撑破页面 */
@media(max-width:820px){
  .article-body{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .article-table{min-width:560px}
}
@media(max-width:680px){
  .article-main{padding:var(--sp-4) var(--sp-3) var(--sp-5)}
  .article-table{font-size:13.5px}
  .article-table th,.article-table td{padding:10px 12px}
}
/* 4) 头条卡在窄屏的封面高度 */
@media(max-width:980px){
  .post-featured .cover{min-height:200px}
}

/* —— 极窄屏（≤400px）顶栏进一步压缩，避免撑破页面 —— */
@media(max-width:400px){
  .header .brand{font-size:12.5px;gap:7px}
  .header .brand .logo{width:29px;height:29px}
  .header .nav-cta{gap:6px}
  .header .nav-cta .btn-primary{padding:8px 12px;font-size:12.5px}
  .hero-stats{gap:var(--sp-3)}
  .hero-stats .num{font-size:25px}
}
@media(max-width:345px){
  .header .nav-cta .btn-primary{display:none}
}

/* ==========================================================================
   ===== 封面比例加固：显式撑满宽度，避免 aspect-ratio 在窄屏反推出超宽尺寸 =====
   ========================================================================== */
.prod-card .thumb,.post-card .cover,.rel-card .cover,.post-featured .cover,
.article-figure .figbox,.map-box,.pd-card .pic{width:100%}
.contact-wrap>*,.series-intro>*,.step-flow>*,.model-grid>*,.spec-grid>*,
.prod-detail>*,.info-list,.form-card{min-width:0}


/* ==========================================================================
   ===== 导航按键可见性修复（2026-09-18 晚）=====
   问题：原断点 ≤900px 就把 6 个主导航整组收进汉堡菜单，窗口稍窄（含站内
         预览面板、平板竖屏）就会"看不到按键"。
   方案：1) 761~1024px 保持横向导航可见，仅收紧排版；
         2) 761~900px 收起品牌英文副标题腾出空间（桌面仍完整展示）；
         3) ≤760px 才启用汉堡菜单，并把汉堡加上「菜单」文字提示；
         4) ≤760px 增加底部常驻快捷导航，手机端任何页面都有按键可点。
   ========================================================================== */

/* —— 1) 中屏（761~1024px）：保留 6 个导航按键 —— */
@media(min-width:761px) and (max-width:1024px){
  .header .nav{height:64px}
  .header .brand{flex:0 0 auto;gap:10px}
  .header .brand .logo{width:34px;height:34px}
  .header .brand span{white-space:nowrap}
  .nav-links{
    position:static;transform:none;flex-direction:row;align-items:center;
    background:transparent;border:0;box-shadow:none;padding:0;z-index:auto;
    gap:clamp(9px,1.5vw,16px);
  }
  .nav-links a{padding:6px 0;border-bottom:0;font-size:clamp(13px,1.4vw,14.5px);white-space:nowrap}
  .nav-links a::after{display:block}
  .nav-toggle{display:none}
  .nav-cta{gap:10px}
  .nav-cta .btn-primary{padding:10px 16px;font-size:13.5px}
  .nav-cta .btn-ghost{display:inline-flex;padding:9px 14px;font-size:13.5px}
}
/* —— 2) 761~900px：品牌收起英文副标题，优先保证导航按键 —— */
@media(min-width:761px) and (max-width:900px){
  .header .brand{font-size:15px;letter-spacing:.6px}
  .header .brand small{display:none}
}

/* —— 3) ≤760px：汉堡菜单（顶栏高度对齐菜单起始位置） —— */
@media(max-width:760px){
  .nav-links{
    position:fixed;top:68px;left:0;right:0;background:#fff;
    flex-direction:column;align-items:stretch;gap:0;padding:10px 22px 20px;
    border-bottom:1px solid var(--line);box-shadow:var(--shadow);
    transform:translateY(-120%);transition:.3s;z-index:49;
  }
  .nav-links.open{transform:translateY(0)}
  .nav-links a{padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
  .nav-links a::after{display:none}
  /* 汉堡按钮：三条杠竖向排列 + 右侧「菜单」文字，避免用户找不到入口 */
  .nav-toggle{display:flex;flex-direction:row;align-items:center;gap:7px}
  .nav-toggle .bars{display:flex;flex-direction:column;gap:4px;width:auto;height:auto;background:none;border-radius:0}
  .nav-toggle .bars i{display:block;width:20px;height:2.5px;background:var(--navy);border-radius:2px;transition:.25s}
  .nav-toggle .tgl-txt{display:inline;font-size:12.5px;font-weight:700;font-style:normal;color:var(--navy);letter-spacing:.5px}
}
@media(max-width:400px){
  .nav-toggle .tgl-txt{display:none}
}

/* —— 4) 底部常驻快捷导航（仅 ≤760px 显示，手机端按键永远可见） —— */
.quick-nav{display:none}
@media(max-width:760px){
  body{padding-bottom:64px}
  .quick-nav{
    display:grid;grid-template-columns:repeat(5,1fr);
    position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:rgba(255,255,255,.97);backdrop-filter:blur(10px);
    border-top:1px solid var(--line);box-shadow:0 -6px 22px rgba(12,36,64,.10);
    padding:7px 6px calc(7px + env(safe-area-inset-bottom,0px));
  }
  .quick-nav a{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    padding:5px 2px;border-radius:10px;color:var(--muted);
    font-size:11px;font-weight:700;letter-spacing:.2px;line-height:1.2;text-align:center;
  }
  .quick-nav a svg{width:21px;height:21px;fill:currentColor;opacity:.9}
  .quick-nav a.active,.quick-nav a:active{color:var(--accent);background:rgba(255,106,0,.09)}
  /* 回顶按钮上移，避免与快捷导航重叠 */
  .to-top{bottom:78px;right:14px;width:42px;height:42px}
}
/* 760~900px 之间若用户横屏手机，也保持底部导航可用 */
@media(max-width:760px) and (orientation:landscape){
  body{padding-bottom:58px}
}

/* —— 顶栏高度 62px 档：菜单与进度条同步对齐 —— */
@media(max-width:680px){
  .nav-links{top:62px}
}


/* ==========================================================================
   ===== 顶栏窄屏溢出修复（2026-09-18 晚）=====
   根因：360~420px 时「立即询盘」按钮 + 汉堡把品牌全称挤出视口（375>360）。
   方案：≤420px 收起顶栏询盘按钮（底部快捷导航已提供「联系」入口），
         并把品牌英文副标题的收起范围统一到 ≤900px，避免 681~760px 换行。
   ========================================================================== */
@media(max-width:900px){
  .header .brand small{display:none}
  .header .brand span{white-space:nowrap}
}
@media(max-width:420px){
  .header .nav-cta .btn-primary{display:none}
  .header .nav-cta{gap:6px}
  .header .brand{font-size:13px;letter-spacing:.3px;gap:8px}
  .header .brand .logo{width:30px;height:30px}
}
@media(max-width:340px){
  .header .brand{font-size:12.5px;letter-spacing:.2px}
  .header .brand .logo{width:28px;height:28px}
}


/* ==========================================================================
   ===== 高德地图容器样式（2026-09-18）=====
   地图容器必须撑满父级且要有确定高度，否则高德 JS API 渲染空白。
   ========================================================================== */
.map-canvas{position:absolute;inset:0;width:100%;height:100%;background:#eef2f7}
.map-fallback{position:absolute;inset:0;width:100%;height:100%}

/* —— 地图工具条（实时路况 / 回到公司，仅在真地图生效时出现） —— */
.map-tools{position:absolute;left:14px;top:14px;z-index:3;display:flex;gap:8px}
.map-tool{
  border:0;cursor:pointer;font-family:inherit;
  background:rgba(255,255,255,.94);color:var(--navy);
  font-size:12.5px;font-weight:700;letter-spacing:.3px;
  padding:8px 13px;border-radius:9px;
  box-shadow:0 4px 14px rgba(12,36,64,.18);
  transition:.2s;
}
.map-tool:hover{background:#fff;transform:translateY(-1px)}
.map-tool.on{background:var(--accent);color:#fff;box-shadow:0 6px 16px rgba(255,106,0,.38)}

/* —— 地图上的公司标签气泡 —— */
.amap-tip{
  background:#0c2440;color:#fff;border-radius:9px;padding:7px 12px;
  box-shadow:0 6px 18px rgba(12,36,64,.28);line-height:1.45;text-align:center;
  max-width:230px;border:0;outline:0;
}
/* 高德 label 默认会给内容框加蓝边，去掉 */
.amap-marker-label{border:0!important;background:transparent!important;padding:0!important}
.amap-tip b{display:block;font-size:13px;font-weight:800}
.amap-tip span{display:block;font-size:11.5px;color:#ffb000;margin-top:2px}

@media(max-width:680px){
  .map-tools{left:10px;top:10px;gap:6px}
  .map-tool{padding:7px 11px;font-size:12px}
  .amap-tip{max-width:180px}
  .amap-tip b{font-size:12px}
}

/* 页眉「咨询电话」按钮：内边距整体缩至 80%（框缩小20%）、字号不变、黑色字 */
/* 页眉「咨询电话」按钮：背景同 LOGO 橙→金黄渐变、字号不变、黑色字 */
.header .nav-cta .btn-primary.tel-cta{padding:.533em .8em;color:#141414;background:linear-gradient(135deg,#ff6a00,#ffb000);box-shadow:0 8px 20px rgba(255,106,0,.30)}
.header .nav-cta .btn-primary.tel-cta:hover{color:#141414;background:linear-gradient(135deg,#ff7d1f,#ffc233);transform:translateY(-2px);box-shadow:0 12px 26px rgba(255,106,0,.40)}