/* ============================================================================
   巴特云翼 BATE 官网 — 前台设计系统单文件（bate.css）
   ----------------------------------------------------------------------------
   契约 v2 · 令牌唯一来源
   - :root 设计令牌（颜色/阴影/间距/动效等）为全站唯一来源：前台本文件、后台
     admin/css/admin.css、api 静态化页一律引用本文件变量，禁止在别处重新定义
     同名变量或改值（改令牌需走契约变更流程并 bump 版本）。
   - 来源（只读，勿改 _archive）：
       _archive/单页长滚草稿_p1-p7/p1_head.html  → :root 令牌 + 基础重置 + 按钮 + topbar/hdr/抽屉
       _archive/单页长滚草稿_p1-p7/p2_css.html   → hero/about/products/custom/applications
       _archive/单页长滚草稿_p1-p7/p3_css2.html  → tech/客户见证/social/faq/news/contact/footer/toast/modal/backtop
       _archive/单页长滚草稿_p1-p7/p4_css3.html  → 仅取其「响应式（前台部分）」；admin 样式不混入（归属 A7）
   - 契约 v2 新增组件（A1，2026-09-03）见文件末尾「§B 契约 v2 新增组件」：
       .page-hero .breadcrumb .article .news-list .news-detail
       .product-detail .spec-table .filter-bar .pagination
   - 维护约定：后续组件样式一律追加在本文件；admin 样式请勿写入本文件。
   ============================================================================ */

/* ============================================================
   §A 设计令牌（:root）— 全站唯一来源，保留 _archive 全部原值与类
   ============================================================ */
:root{
  --c-brand:#1A56DB; --c-brand2:#3B82F6; --c-accent:#F05A28; --c-ok:#0E9F6E;
  --c-dark:#0F172A; --c-dark2:#1E3A5F; --c-dark3:#0A0F1A;
  --c-bg:#FFFFFF; --c-bg2:#F8FAFC; --c-line:#E2E8F0; --c-line2:#CBD5E1;
  --t:#1E293B; --t2:#64748B; --t3:#94A3B8;
  --r-lg:12px; --r-sm:8px;
  --sh-sm:0 1px 2px rgba(15,23,42,.06),0 1px 3px rgba(15,23,42,.1);
  --sh-md:0 4px 6px -1px rgba(15,23,42,.07),0 2px 4px -2px rgba(15,23,42,.06);
  --sh-lg:0 20px 25px -5px rgba(15,23,42,.1),0 8px 10px -6px rgba(15,23,42,.06);
  --sh-brand:0 8px 20px -6px rgba(26,86,219,.45);
  --sp1:8px; --sp2:16px; --sp3:24px; --sp4:32px; --sp5:48px; --sp6:64px; --sp7:88px;
  --hdr-h:72px; --topbar-h:36px;
  --fs-mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
  --ease:cubic-bezier(.4,0,.2,1); --dur:.25s;
  /* ---------- v2.1 主题语义令牌（A=默认现值；B/C 覆盖见文件尾 §D） ---------- */
  --c-brand-h:#1749c0;
  --c-cardbg:#FFFFFF;
  --c-cta:var(--c-accent); --c-cta-h:#E04E1F; --c-cta-tx:#FFFFFF;
  --c-br-rgb:26,86,219; --c-b2-rgb:59,130,246; --c-dr-rgb:15,23,42; --c-pulse-rgb:240,90,40;
  --c-hero-bg:linear-gradient(135deg,var(--c-dark) 0%,var(--c-hero-mid) 55%,var(--c-hero-end) 100%);
  --c-hero-bd:none; --c-hero-mid:#172a4a; --c-hero-end:#1E3A5F; --c-tech-mid:#13233f;
  --c-hero-grid:rgba(148,163,184,.07); --c-dgrid:rgba(148,163,184,.06);
  --c-htx:#FFFFFF; --c-hsub:#C7D2E2; --c-hmut:#94A3B8; --c-hsep:#64748B;
  --c-bcrumb:#94A3B8; --c-hact:#FFFFFF; --c-hbchover:#FFFFFF;
  --c-hi:#60A5FA; --c-hi-d:#60A5FA; --c-hi-soft:rgba(96,165,250,.15);
  --c-hg1:#60A5FA; --c-hg2:#3B82F6; --c-hg3:#22D3EE; --c-dot:#22D3EE;
  --c-kick:#93C5FD; --c-kickbd:rgba(147,197,253,.35); --c-kickbg:rgba(var(--c-dr-rgb),.5);
  --c-chiptx:#E5EDFF; --c-chipbg:rgba(148,163,184,.12); --c-chipline:rgba(148,163,184,.28);
  --c-hline:rgba(148,163,184,.18);
  --c-pillbg:rgba(var(--c-dr-rgb),.72); --c-pilltx:#BFDBFE; --c-pillbd:rgba(96,165,250,.3);
  --c-obin-tx:#FFFFFF; --c-obin-bd:rgba(255,255,255,.5); --c-obin-hov:rgba(255,255,255,.12);
  --c-tint1:#EFF6FF; --c-tint2:#F8FAFC; --c-tintdeep:#DBEAFE;
  --c-tagbg:rgba(255,255,255,.92); --c-tagtx:var(--c-brand); --c-tagbd:#BFDBFE;
  --c-shadow:var(--sh-lg);
  --c-dcard:rgba(255,255,255,.05); --c-dline:rgba(148,163,184,.2); --c-dmut:#94A3B8;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001s!important;transition-duration:.001s!important}}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;color:var(--t);background:var(--c-bg);line-height:1.6;font-size:16px;overflow-x:hidden}
img,svg{vertical-align:middle;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:14px;color:var(--t)}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--c-brand);outline-offset:2px}
.container{max-width:1200px;margin:0 auto;padding:0 var(--sp3)}
.section{padding:var(--sp7) 0}
.sec-head{text-align:center;max-width:760px;margin:0 auto var(--sp5)}
.sec-kicker{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;letter-spacing:.12em;color:var(--c-brand);text-transform:uppercase}
.sec-kicker::before,.sec-kicker::after{content:"";width:22px;height:1px;background:var(--c-brand2);opacity:.5}
.sec-title{font-size:clamp(26px,3.4vw,38px);line-height:1.25;color:var(--t);font-weight:700;margin-top:10px;letter-spacing:-.01em}
.sec-sub{color:var(--t2);margin-top:12px;font-size:16px}
/* 按钮 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 24px;border-radius:var(--r-sm);font-size:15px;font-weight:600;transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s,color .2s,border-color .2s;cursor:pointer;border:1px solid transparent;line-height:1.2}
.btn-accent{background:var(--c-cta);color:var(--c-cta-tx);box-shadow:var(--sh-brand)}
.btn-accent:hover{transform:translateY(-2px);background:var(--c-cta-h);color:var(--c-cta-tx)}
.btn-outline{border-color:var(--c-obin-bd);color:var(--c-obin-tx)}
.btn-outline:hover{background:var(--c-obin-hov);border-color:var(--c-obin-tx)}
.btn-brand{background:var(--c-brand);color:#fff}
.btn-brand:hover{background:var(--c-brand-h);transform:translateY(-2px)}
.btn-ghost{border-color:var(--c-line2);color:var(--t)}
.btn-ghost:hover{border-color:var(--c-brand);color:var(--c-brand);background:rgba(26,86,219,.04)}
.btn-danger{background:#DC2626;color:#fff}
.btn-danger:hover{background:#B91C1C}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none!important}
/* 顶部信息条 */
.topbar{background:var(--c-dark);color:#CBD5E1;font-size:13px;height:var(--topbar-h);display:flex;align-items:center}
.topbar .container{display:flex;justify-content:space-between;align-items:center;width:100%}
.topbar a{color:#E2E8F0;display:inline-flex;align-items:center;gap:6px;transition:color .2s}
.topbar a:hover{color:#fff}
.topbar .tb-right{display:flex;align-items:center;gap:22px}
.topbar svg{width:14px;height:14px;color:var(--c-brand2)}
/* 头部导航 */
.hdr{position:fixed;top:var(--topbar-h);left:0;right:0;z-index:900;height:var(--hdr-h);transition:background .3s,box-shadow .3s,backdrop-filter .3s;background:rgba(var(--c-dr-rgb),.45);backdrop-filter:blur(6px)}
.hdr .container{display:flex;align-items:center;justify-content:space-between;height:100%}
.hdr.scrolled{background:rgba(255,255,255,.96);box-shadow:var(--sh-md);backdrop-filter:blur(8px)}
.hdr.scrolled .nav>a{color:var(--t)}
.hdr.scrolled .nav>a:hover,.hdr.scrolled .nav>a.active{color:var(--c-brand)}
.hdr.scrolled .logo-sub{color:var(--t2)}
.hdr .logo{display:flex;align-items:center;gap:10px;color:#fff;transition:color .3s}
.hdr.scrolled .logo .logo-txt{color:var(--t)}
.logo .logo-badge{width:42px;height:42px;flex:0 0 42px}
.logo-txt{font-size:19px;font-weight:800;letter-spacing:.02em;line-height:1.1}
.logo-txt span{color:var(--c-accent)}
.logo-sub{display:block;font-size:10.5px;font-weight:400;color:var(--c-hmut);letter-spacing:.06em;margin-top:1px}
.nav{display:flex;align-items:center;gap:4px;height:100%}
.nav>a{position:relative;padding:8px 14px;font-size:15px;font-weight:500;color:#E2E8F0;transition:color .2s;display:inline-flex;align-items:center}
.nav>a::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;border-radius:2px;background:var(--c-accent);transform:scaleX(0);transition:transform .25s var(--ease)}
.nav>a:hover::after,.nav>a.active::after{transform:scaleX(1)}
.nav>a.active{color:#fff}
.hdr.scrolled .nav>a.active{color:var(--c-brand)}
.hdr-actions{display:flex;align-items:center;gap:12px}
.burger{display:none;width:44px;height:44px;border-radius:var(--r-sm);align-items:center;justify-content:center}
.burger span{display:block;width:20px;height:2px;background:#fff;position:relative;transition:.3s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:#fff;transition:.3s}
.burger span::before{top:-6px}.burger span::after{top:6px}
.hdr.scrolled .burger span,.hdr.scrolled .burger span::before,.hdr.scrolled .burger span::after{background:var(--t)}
.burger.on span{background:transparent}
.burger.on span::before{top:0;transform:rotate(45deg);background:#fff}
.burger.on span::after{top:0;transform:rotate(-45deg);background:#fff}
/* 移动端抽屉 */
.drawer{position:fixed;inset:0;z-index:1100;pointer-events:none}
.drawer .mask{position:absolute;inset:0;background:rgba(var(--c-dr-rgb),.55);opacity:0;transition:opacity .3s}
.drawer.open{pointer-events:auto}
.drawer.open .mask{opacity:1}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(330px,86vw);background:var(--c-dark);color:#E2E8F0;transform:translateX(102%);transition:transform .35s var(--ease);display:flex;flex-direction:column;padding:22px;overflow-y:auto}
.drawer.open .drawer-panel{transform:none}
.drawer-panel a.d-link{display:flex;align-items:center;justify-content:space-between;padding:13px 6px;font-size:16px;color:#E2E8F0;border-bottom:1px solid rgba(148,163,184,.14)}
.drawer-panel a.d-link.active{color:var(--c-brand2)}
.drawer .d-cta{margin-top:18px}
body.lock{overflow:hidden}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100vh;background:var(--c-hero-bg);color:var(--c-htx);border-bottom:var(--c-hero-bd);overflow:hidden;display:flex;align-items:center;padding:calc(var(--hdr-h) + var(--topbar-h) + 40px) 0 60px}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--c-hero-grid) 1px,transparent 1px),linear-gradient(90deg,var(--c-hero-grid) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse at 30% 40%,#000 30%,transparent 75%)}
.hero .glow{position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(120px);opacity:.35;pointer-events:none}
.hero .glow.g1{background:var(--c-brand);top:-160px;left:-120px;animation:float1 9s ease-in-out infinite}
.hero .glow.g2{background:var(--c-brand2);bottom:-200px;right:-100px;animation:float2 11s ease-in-out infinite}
@keyframes float1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,40px) scale(1.08)}}
@keyframes float2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-50px,-36px) scale(1.1)}}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;width:100%}
.hero .h-kicker{display:inline-flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.18em;color:var(--c-kick);border:1px solid var(--c-kickbd);border-radius:999px;padding:6px 16px;margin-bottom:20px;background:var(--c-kickbg)}
.hero h1{font-size:clamp(30px,4vw,52px);line-height:1.22;font-weight:800;letter-spacing:-.01em;text-wrap:balance}
.hero h1 .gr{background:linear-gradient(92deg,var(--c-hg1),var(--c-hg2) 45%,var(--c-hg3));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .h-sub{margin-top:18px;color:var(--c-hsub);font-size:clamp(15px,1.6vw,18px);line-height:1.7}
.hero .h-tags{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.hero .h-tag{display:inline-flex;align-items:center;gap:8px;background:var(--c-chipbg);border:1px solid var(--c-chipline);padding:8px 15px;border-radius:var(--r-sm);font-size:14px;color:var(--c-chiptx)}
.hero .h-tag svg{width:17px;height:17px;color:var(--c-hi)}
.hero .h-cta{display:flex;flex-wrap:wrap;gap:16px;margin-top:30px}
.hero .pulse{position:relative}
.hero .pulse::after{content:"";position:absolute;inset:0;border-radius:var(--r-sm);box-shadow:0 0 0 0 rgba(var(--c-pulse-rgb),.55);animation:pulse 1.9s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(var(--c-pulse-rgb),.5)}70%{box-shadow:0 0 0 16px rgba(var(--c-pulse-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--c-pulse-rgb),0)}}
.hero .h-stats{display:flex;flex-wrap:wrap;gap:34px;margin-top:44px;padding-top:28px;border-top:1px solid var(--c-hline)}
.hero .stat b{display:block;font-size:26px;font-weight:800;color:var(--c-htx);font-family:var(--fs-mono)}
.hero .stat b i{font-style:normal;color:var(--c-hi)}
.hero .stat span{font-size:12.5px;color:var(--c-hmut);margin-top:2px;display:block}
/* Hero 电机图 */
.motor-wrap{position:relative;display:flex;justify-content:center;align-items:center}
.motor-stage{position:relative;width:min(430px,100%);aspect-ratio:1;display:flex;align-items:center;justify-content:center}
.motor-stage svg.motor{width:78%;height:78%;filter:drop-shadow(0 20px 60px rgba(var(--c-b2-rgb),.35))}
.motor-stage .spin-slow{animation:spin 20s linear infinite;transform-origin:center;transform-box:fill-box}
.motor-stage .spin-rev{animation:spinRev 15s linear infinite;transform-origin:center;transform-box:fill-box}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spinRev{to{transform:rotate(-360deg)}}
.motor-stage .breathe{animation:breathe 3.6s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.55}50%{opacity:1}}
.mtag{position:absolute;font-size:11.5px;color:var(--c-pilltx);letter-spacing:.08em;display:flex;align-items:center;gap:6px;background:var(--c-pillbg);border:1px solid var(--c-pillbd);border-radius:999px;padding:4px 11px;backdrop-filter:blur(4px)}
.mtag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c-dot)}
.mtag.t1{top:6%;left:2%}.mtag.t2{top:16%;right:0}.mtag.t3{bottom:18%;left:-1%}.mtag.t4{bottom:4%;right:6%}
.scroll-hint{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:var(--c-hmut);font-size:12px;letter-spacing:.2em;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:3}
.scroll-hint .mouse{width:22px;height:34px;border:1.5px solid var(--c-hsep);border-radius:12px;position:relative}
.scroll-hint .mouse::after{content:"";position:absolute;left:50%;top:6px;width:3px;height:7px;border-radius:2px;background:var(--c-hi);transform:translateX(-50%);animation:wheel 1.6s infinite}
@keyframes wheel{0%{opacity:1;top:6px}70%{opacity:0;top:18px}100%{opacity:0;top:6px}}
/* Hero 轮播（多帧） */
.hero-slides{position:absolute;inset:0;overflow:hidden}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;pointer-events:none;display:flex;align-items:center}
.hero-slide.on{opacity:1;pointer-events:auto;position:relative}
.hero-slide .inner{width:100%}
.hero-nav{position:absolute;right:0;bottom:calc(100% + 14px);display:flex;gap:8px;z-index:5}
.hero-nav button{width:11px;height:11px;border-radius:99px;background:rgba(148,163,184,.4);transition:.3s}
.hero-nav button.on{width:30px;background:var(--c-accent)}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:rgba(var(--c-dr-rgb),.4);border:1px solid rgba(148,163,184,.3);color:#E2E8F0;display:flex;align-items:center;justify-content:center;font-size:20px;z-index:5;transition:.25s}
.hero-arrow:hover{background:var(--c-brand)}
.hero-arrow.prev{left:18px}.hero-arrow.next{right:18px}
@media(max-width:1024px){.hero-grid{grid-template-columns:1fr}.motor-wrap{display:none}}
/* ---------- 通用区块交替背景 ---------- */
.alt{background:var(--c-bg2)}
.sec-white{background:var(--c-cardbg)}
/* ---------- About ---------- */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.about-txt p{margin-bottom:14px;color:var(--t2);line-height:1.85}
.about-txt p strong{color:var(--t)}
.about-feats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.feat-card{background:var(--c-cardbg);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:26px 22px;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.feat-card:hover{transform:translateY(-6px);box-shadow:var(--c-shadow);border-color:var(--c-brand2)}
.feat-card .f-ico{width:48px;height:48px;border-radius:12px;background:linear-gradient(135deg,var(--c-tint1),var(--c-tintdeep));display:flex;align-items:center;justify-content:center;color:var(--c-brand)}
.feat-card .f-ico svg{width:24px;height:24px}
.feat-card h3{font-size:17px;margin:14px 0 8px;color:var(--t)}
.feat-card p{font-size:13.5px;color:var(--t2);line-height:1.7}
/* ---------- Products ---------- */
.prod-toolbar{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:38px}
.filter-btn{min-height:42px;padding:8px 20px;border-radius:999px;border:1px solid var(--c-line2);background:var(--c-cardbg);color:var(--t2);font-size:14.5px;font-weight:500;transition:.22s}
.filter-btn:hover{border-color:var(--c-brand);color:var(--c-brand)}
.filter-btn.on{background:var(--c-brand);border-color:var(--c-brand);color:#fff;box-shadow:var(--sh-brand)}
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.prod-card{background:var(--c-cardbg);border:1px solid var(--c-line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .25s var(--ease),box-shadow .25s var(--ease);position:relative}
.prod-card:hover{transform:translateY(-6px);box-shadow:var(--c-shadow)}
.prod-media{position:relative;height:208px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.prod-media .pm-bg{position:absolute;inset:0;background:linear-gradient(135deg,var(--c-tint1) 0%,var(--c-tint2) 100%);transition:transform .45s var(--ease)}
.prod-card:hover .pm-bg{transform:scale(1.06)}
.prod-media svg{position:relative;z-index:1;height:130px;width:auto;filter:drop-shadow(0 10px 18px rgba(var(--c-br-rgb),.22));transition:transform .35s var(--ease)}
.prod-card:hover .prod-media svg{transform:scale(1.08) rotate(-3deg)}
.prod-tags{position:absolute;top:12px;left:12px;display:flex;flex-wrap:wrap;gap:6px;z-index:2}
.p-tag{font-size:11px;background:var(--c-tagbg);color:var(--c-tagtx);border:1px solid var(--c-tagbd);border-radius:999px;padding:2px 9px;font-weight:600}
.p-tag.o{background:var(--c-accent);color:#fff;border-color:var(--c-accent)}
.prod-body{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1}
.prod-body h3{font-size:18.5px;color:var(--t)}
.prod-params{margin-top:12px;background:var(--c-bg2);border-radius:10px;padding:12px 14px}
.prod-params li{display:flex;gap:8px;font-size:12.5px;color:var(--t2);line-height:1.75;font-family:var(--fs-mono)}
.prod-params li b{color:var(--t);font-weight:600;min-width:44px}
.prod-app{margin-top:10px;font-size:13px;color:var(--t3)}
.prod-app b{color:var(--t2);font-weight:600}
.prod-acts{display:flex;gap:10px;margin-top:18px}
.prod-acts .btn{flex:1;min-height:42px;padding:8px 10px;font-size:14px}
/* ---------- Custom 流程 ---------- */
.steps{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;position:relative}
.step{background:var(--c-cardbg);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:22px 16px;text-align:center;position:relative;transition:.25s}
.step:hover{transform:translateY(-5px);box-shadow:var(--sh-md);border-color:var(--c-brand2)}
.step .s-num{width:44px;height:44px;margin:0 auto 12px;border-radius:50%;background:linear-gradient(135deg,var(--c-brand),var(--c-brand2));color:#fff;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 14px -4px rgba(var(--c-br-rgb),.5)}
.step h3{font-size:15px;color:var(--t);margin-bottom:6px}
.step p{font-size:12.5px;color:var(--t2);line-height:1.65}
.step-arrow{position:absolute;top:33px;right:-9px;color:var(--c-line2);z-index:2;display:none}
.adv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.adv-item{background:linear-gradient(135deg,var(--c-tint1),var(--c-tint2));border:1px solid var(--c-tintdeep);border-radius:var(--r-lg);padding:24px;display:flex;gap:16px;align-items:flex-start}
.adv-item .a-ico{flex:0 0 42px;width:42px;height:42px;border-radius:11px;background:var(--c-cardbg);border:1px solid var(--c-tintdeep);color:var(--c-brand);display:flex;align-items:center;justify-content:center}
.adv-item .a-ico svg{width:21px;height:21px}
.adv-item h4{font-size:16px;color:var(--t)}
.adv-item p{font-size:13px;color:var(--t2);margin-top:5px;line-height:1.7}
/* ---------- Applications ---------- */
.app-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.app-card{border-radius:var(--r-lg);padding:26px 22px;border:1px solid var(--c-line);background:linear-gradient(160deg,var(--c-cardbg),var(--c-tint2));transition:.28s var(--ease)}
.app-card:hover{transform:translateY(-6px);box-shadow:var(--c-shadow)}
.app-card .ap-ico{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:14px}
.app-card .ap-ico svg{width:26px;height:26px}
.app-card h3{font-size:16.5px;color:var(--t)}
.app-card p{font-size:13px;color:var(--t2);margin-top:6px;line-height:1.7}
/* ---------- Tech 深色 ---------- */
.tech-sec{background:linear-gradient(150deg,var(--c-dark) 0%,var(--c-tech-mid) 60%,var(--c-dark2) 100%);color:#fff;position:relative;overflow:hidden}
.tech-sec::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--c-dgrid) 1px,transparent 1px),linear-gradient(90deg,var(--c-dgrid) 1px,transparent 1px);background-size:38px 38px}
.tech-sec .container{position:relative;z-index:2}
.tech-sec .sec-title{color:#fff}
.tech-sec .sec-sub{color:var(--c-dmut)}
.tech-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}
.check-list{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.check-item{background:var(--c-dcard);border:1px solid var(--c-dline);border-radius:var(--r-lg);padding:20px;transition:.25s}
.check-item:hover{border-color:var(--c-brand2);background:rgba(255,255,255,.08)}
.check-item .c-ico{width:40px;height:40px;border-radius:10px;background:var(--c-hi-soft);color:var(--c-hi-d);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.check-item .c-ico svg{width:20px;height:20px}
.check-item h3{font-size:15.5px;color:#fff}
.check-item p{font-size:12.5px;color:var(--c-dmut);margin-top:5px;line-height:1.65}
.big-nums{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.num-card{background:var(--c-dcard);border:1px solid var(--c-dline);border-radius:var(--r-lg);padding:26px 22px;text-align:center}
.num-card b{font-size:clamp(30px,3vw,42px);font-weight:800;color:#fff;font-family:var(--fs-mono)}
.num-card b em{font-style:normal;color:var(--c-hi-d)}
.num-card span{display:block;font-size:13px;color:var(--c-dmut);margin-top:6px}
.cert-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px;justify-content:center}
.cert{font-size:13px;font-weight:600;color:#CBD5E1;border:1px solid rgba(148,163,184,.3);padding:9px 20px;border-radius:999px;background:rgba(var(--c-dr-rgb),.4);letter-spacing:.06em}
/* ---------- Testimonials ---------- */
.tm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tm-card{background:var(--c-cardbg);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:28px;transition:.25s}
.tm-card:hover{transform:translateY(-6px);box-shadow:var(--c-shadow)}
.tm-stars{color:#F59E0B;display:flex;gap:3px;margin-bottom:14px}
.tm-stars svg{width:17px;height:17px;fill:#F59E0B}
.tm-card blockquote{font-style:italic;color:var(--t2);font-size:14.5px;line-height:1.85;min-height:86px}
.tm-who{display:flex;align-items:center;gap:12px;margin-top:18px;padding-top:16px;border-top:1px dashed var(--c-line)}
.tm-avatar{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--c-brand),var(--c-dot));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:17px}
.tm-who b{display:block;color:var(--t);font-size:14.5px}
.tm-who span{font-size:12.5px;color:var(--t3)}
.logo-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:40px}
.lw-item{height:64px;border:1px solid var(--c-line);border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--t3);font-weight:600;background:var(--c-cardbg);transition:.25s;letter-spacing:.04em}
.lw-item:hover{border-color:var(--c-brand2);color:var(--c-brand)}
/* ---------- Social 新媒体矩阵 v2.2（F-3/F-4/F-7/F-12/F-13；色值全部走令牌随主题） ---------- */
.soc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:8px}
.soc-card{background:var(--c-cardbg);border:1px solid var(--c-line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.soc-card:hover{transform:translateY(-4px);box-shadow:var(--c-shadow);border-color:var(--c-brand2)}
.soc-hd{display:flex;align-items:center;gap:10px;padding:14px 16px;color:#fff}
.soc-hd-ico{flex:0 0 26px;width:26px;height:26px;display:flex;align-items:center;justify-content:center}
.soc-hd-ico svg{width:22px;height:22px;display:block}
.soc-hd-name{flex:1;font-size:15px;font-weight:700;letter-spacing:.02em}
.soc-hd-ok{font-style:normal;font-size:10.5px;border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:1px 8px;background:rgba(255,255,255,.16)}
.soc-bd{padding:16px 16px 18px;background:var(--c-bg2);border-top:1px solid var(--c-line);display:flex;flex-direction:column;gap:4px;flex:1}
.soc-line{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:3px 0;border-bottom:1px dashed var(--c-line)}
.soc-line span{color:var(--t3)}
.soc-line b{color:var(--t);font-weight:600;font-family:var(--fs-mono);word-break:break-all;text-align:right}
.soc-search{font-size:13px;color:var(--t2);margin-top:6px;line-height:1.7}
.soc-search b{color:var(--t);font-weight:600}
.soc-foot{padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--c-line);background:var(--c-cardbg)}
.soc-hint{font-size:11.5px;color:var(--t3)}
.soc-search-txt{font-size:11.5px;color:var(--c-brand);font-weight:600}
/* 码位：容器固定宽高比防 CLS（O-I03/F-12）；无码=虚线槽平台图标水印+「搜索关注」，零可扫（F-3） */
.soc-qr{position:relative;width:100%;max-width:150px;aspect-ratio:1/1;margin:10px auto 2px;border:1px dashed var(--c-line2);border-radius:var(--r-sm);background:var(--c-cardbg);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:var(--sh-sm)}
.soc-qr-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:8px;background:#fff;display:block}
.soc-qr-fb{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--t3)}
.soc-qr-ico{opacity:.4}
.soc-qr-ico svg{width:40px;height:40px;display:block}
.soc-qr-txt{font-size:12px;letter-spacing:.06em;color:var(--t3)}
/* 企业微信未配码文字卡（F-5/F-7：微信商务服务开通中…） */
.soc-wx-name{font-size:16px;color:var(--t);display:block}
.soc-wx-msg{margin-top:6px;font-size:13.5px;color:var(--t2);line-height:1.85}
.soc-wx-msg .soc-tel,.soc-row .soc-tel{color:var(--c-brand);font-weight:700;text-decoration:none;white-space:nowrap}
.soc-wx-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.soc-wx-cta .btn{min-height:44px}
/* 联系页码区小行（cards:false；F-5） */
.wx-rows{display:grid;gap:12px}
.soc-row{display:flex;align-items:center;gap:14px;background:var(--c-dcard);border:1px solid var(--c-dline);border-radius:var(--r-lg);padding:14px 18px;flex-wrap:wrap;color:#E2E8F0}
.soc-row-main{border-color:rgba(var(--c-pulse-rgb),.55)}
.soc-row-ico{flex:0 0 38px;width:38px;height:38px;border-radius:10px;background:var(--c-hi-soft);display:flex;align-items:center;justify-content:center}
.soc-row-ico svg{width:22px;height:22px;display:block}
.soc-row-txt{flex:1 1 220px;min-width:0;display:grid;gap:2px}
.soc-row-txt b{font-size:15px;color:#E2E8F0}
.soc-row-txt span{font-size:13px;color:var(--c-dmut);line-height:1.7}
.soc-row-txt span b{font-size:13px;color:#fff;font-weight:600}
.soc-row-cta{display:flex;flex-wrap:wrap;gap:10px}
.soc-row-cta .btn{min-height:44px}
/* 建设中平台文本行（social 页底，F-4：快手/小红书） */
.soc-building{margin-top:34px;text-align:center;color:var(--t3);font-size:13.5px;line-height:2.1}
.soc-building b{color:var(--t2);font-weight:600}
/* 首页社交条（F-6：单行纯文字，不排码不占位） */
.soc-strip{margin:36px auto 2px;text-align:center;font-size:14px}
.soc-strip a{color:var(--c-brand);font-weight:600;text-decoration:none;border-bottom:1px dashed transparent;transition:border-color .2s}
.soc-strip a:hover{border-bottom-color:var(--c-brand)}
/* 询盘 Modal 标题可换行容纳长场景文案（F-9 回显） */
.modal-head h3{line-height:1.4;overflow-wrap:break-word}
/* ---------- FAQ ---------- */
.faq-wrap{max-width:820px;margin:0 auto}
.faq-item{border:1px solid var(--c-line);border-radius:var(--r-lg);margin-bottom:14px;background:var(--c-cardbg);overflow:hidden;transition:box-shadow .25s,border-color .25s}
.faq-item.open{border-color:var(--c-brand2);box-shadow:var(--sh-md)}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 22px;text-align:left;font-size:15.5px;font-weight:600;color:var(--t);min-height:56px;background:none}
.faq-q .fq-ico{flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:var(--c-bg2);border:1px solid var(--c-line2);display:flex;align-items:center;justify-content:center;transition:transform .3s,background .3s,color .3s;color:var(--t2)}
.faq-item.open .fq-ico{transform:rotate(180deg);background:var(--c-brand);border-color:var(--c-brand);color:#fff}
.faq-q:hover{color:var(--c-brand)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.faq-a p{padding:0 22px 20px;color:var(--t2);font-size:14.5px;line-height:1.85}
/* ---------- News ---------- */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.news-card{background:var(--c-cardbg);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:24px;transition:.25s;display:flex;flex-direction:column}
.news-card:hover{transform:translateY(-6px);box-shadow:var(--c-shadow);border-color:var(--c-brand2)}
.news-card .n-date{font-size:12.5px;color:var(--c-brand);font-family:var(--fs-mono);letter-spacing:.05em}
.news-card h3{font-size:16.5px;color:var(--t);margin:10px 0 8px;line-height:1.5}
.news-card p{font-size:13.5px;color:var(--t2);line-height:1.75;flex:1}
.news-card .n-more{margin-top:14px;color:var(--c-brand);font-size:13.5px;font-weight:600;display:inline-flex;align-items:center;gap:5px}
/* ---------- Contact ---------- */
.contact-sec{background:linear-gradient(140deg,var(--c-dark) 0%,var(--c-dark2) 100%);color:#fff;position:relative;overflow:hidden}
.contact-sec::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--c-dgrid) 1px,transparent 1px),linear-gradient(90deg,var(--c-dgrid) 1px,transparent 1px);background-size:44px 44px}
.contact-sec .container{position:relative;z-index:2}
.contact-sec .sec-title{color:#fff}
.contact-sec .sec-sub{color:var(--c-dmut)}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.ci-list{display:grid;gap:16px}
.ci-item{display:flex;gap:16px;align-items:flex-start;background:var(--c-dcard);border:1px solid var(--c-dline);border-radius:var(--r-lg);padding:18px}
.ci-item .ci-ico{flex:0 0 44px;width:44px;height:44px;border-radius:11px;background:var(--c-hi-soft);color:var(--c-hi-d);display:flex;align-items:center;justify-content:center}
.ci-item .ci-ico svg{width:22px;height:22px}
.ci-item b{display:block;font-size:14px;color:#E2E8F0;font-weight:600}
.ci-item p,.ci-item a{font-size:14px;color:var(--c-dmut);margin-top:3px;line-height:1.6}
.ci-item a:hover{color:#fff}
.ci-social{display:flex;gap:10px;margin-top:6px}
.ci-social a{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.08);border:1px solid rgba(148,163,184,.25);display:flex;align-items:center;justify-content:center;transition:.22s}
.ci-social a:hover{background:var(--c-brand);border-color:var(--c-brand);transform:translateY(-3px)}
.ci-social svg{width:18px;height:18px;color:#E2E8F0}
.form-card{background:var(--c-cardbg);color:var(--t);border-radius:var(--r-lg);padding:32px;box-shadow:var(--sh-lg)}
.form-card h3{font-size:20px}
.form-card .fc-sub{color:var(--t2);font-size:13.5px;margin-top:6px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f-item{margin-bottom:16px;display:flex;flex-direction:column}
.f-item label{font-size:13.5px;font-weight:600;color:var(--t);margin-bottom:7px}
.f-item label em{color:var(--c-accent);font-style:normal;margin-left:2px}
.f-item input,.f-item select,.f-item textarea{border:1px solid var(--c-line2);border-radius:var(--r-sm);padding:11px 14px;transition:border-color .2s,box-shadow .2s;width:100%;background:#fff}
.f-item textarea{min-height:108px;resize:vertical;line-height:1.7}
.f-item input:focus,.f-item select:focus,.f-item textarea:focus{outline:none;border-color:var(--c-brand);box-shadow:0 0 0 3px rgba(var(--c-br-rgb),.13)}
.f-item.err input,.f-item.err select,.f-item.err textarea{border-color:#DC2626;box-shadow:0 0 0 3px rgba(220,38,38,.1)}
.f-err{color:#DC2626;font-size:12px;margin-top:5px;display:none}
.f-item.err .f-err{display:block}
.f-privacy{font-size:12px;color:var(--t3);text-align:center;margin-top:12px}
.form-ok{display:none;text-align:center;padding:40px 10px}
.form-ok .ok-ring{width:74px;height:74px;margin:0 auto 18px;border-radius:50%;background:#ECFDF5;border:2px solid var(--c-ok);display:flex;align-items:center;justify-content:center;color:var(--c-ok);animation:pop .5s var(--ease)}
@keyframes pop{0%{transform:scale(.5);opacity:0}80%{transform:scale(1.08)}100%{transform:scale(1)}}
.form-ok h4{font-size:19px;color:var(--t)}
.form-ok p{color:var(--t2);font-size:14px;margin-top:8px}
/* ---------- Footer ---------- */
.footer{background:var(--c-dark3);color:var(--c-dmut);font-size:14px}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:36px;padding:56px 0 44px}
.footer .f-brand p{margin-top:14px;line-height:1.8;font-size:13.5px}
.footer .f-brand .f-contact{margin-top:16px;display:grid;gap:7px;font-size:13.5px}
.footer h4{color:#E2E8F0;font-size:15.5px;margin-bottom:16px;font-weight:600}
.footer ul{display:grid;gap:9px}
.footer ul a{color:var(--c-dmut);transition:.2s;font-size:13.5px}
.footer ul a:hover{color:#fff;padding-left:3px}
.footer .admin-link{color:#475569!important;font-size:12px}
.footer .admin-link:hover{color:var(--c-dmut)}
.footer-bottom{border-top:1px solid rgba(148,163,184,.15);padding:18px 0;font-size:12.5px;color:#64748B}
.footer-bottom .container{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;align-items:center}
.footer-bottom a{color:#64748B;transition:.2s}
.footer-bottom a:hover{color:#fff}
/* ---------- Toast / Modal / BackTop / Reveal ---------- */
.toast-wrap{position:fixed;top:18px;left:50%;transform:translateX(-50%);z-index:3000;display:grid;gap:10px;width:min(92vw,420px)}
.toast{display:flex;align-items:flex-start;gap:10px;padding:13px 16px;border-radius:var(--r-sm);background:var(--c-cardbg);box-shadow:var(--sh-lg);border-left:4px solid var(--c-brand2);font-size:14px;color:var(--t);animation:toastIn .3s var(--ease)}
.toast.ok{border-color:var(--c-ok)}.toast.err{border-color:#DC2626}.toast.info{border-color:var(--c-brand2)}
@keyframes toastIn{from{opacity:0;transform:translateY(-14px)}to{opacity:1}}
.toast.out{animation:toastOut .3s forwards}
@keyframes toastOut{to{opacity:0;transform:translateY(-14px)}}
.modal-mask{position:fixed;inset:0;background:rgba(var(--c-dr-rgb),.6);z-index:2000;display:none;align-items:flex-start;justify-content:center;padding:40px 16px;overflow-y:auto}
.modal-mask.open{display:flex}
.modal{background:var(--c-cardbg);border-radius:var(--r-lg);width:100%;max-width:560px;animation:pop .25s var(--ease);margin:auto 0}
.modal.lg{max-width:760px}.modal.sm{max-width:420px}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--c-line)}
.modal-head h3{font-size:17px;color:var(--t)}
.m-close{width:34px;height:34px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;color:var(--t2);transition:.2s}
.m-close:hover{background:var(--c-bg2);color:var(--t)}
.modal-body{padding:24px;max-height:70vh;overflow-y:auto}
.modal-foot{display:flex;justify-content:flex-end;gap:10px;padding:16px 24px;border-top:1px solid var(--c-line)}
.backtop{position:fixed;right:22px;bottom:26px;z-index:1200;width:46px;height:46px;border-radius:12px;background:var(--c-brand);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-brand);opacity:0;visibility:hidden;transform:translateY(12px);transition:.3s}
.backtop.show{opacity:1;visibility:visible;transform:none}
.backtop:hover{background:var(--c-brand-h)}
.backtop svg{width:20px;height:20px}
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}
/* ---------- 产品详情弹窗（前台通用） ---------- */
.pd-media{display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,var(--c-tint1),var(--c-tint2));border-radius:var(--r-lg);padding:30px;border:1px solid var(--c-line)}
.pd-media svg{height:180px}
.pd-table{width:100%;border-collapse:collapse;margin-top:8px}
.pd-table td{border:1px solid var(--c-line);padding:9px 12px;font-size:13.5px}
.pd-table td:first-child{background:var(--c-bg2);color:var(--t2);width:40%;font-weight:500}

/* ============================================================
   §B 契约 v2 新增组件（A1 整合新增，2026-09-03）
   ============================================================ */

/* ---- 集成修正：topbar 固定，与 .hdr 拼成整条顶部（消除滚动后头部上方漏缝） ---- */
.topbar{position:fixed;top:0;left:0;right:0;z-index:901}

/* ---- 顶部为浅色/无深色 hero 的页面：给 <body> 加 class="solid-top"，头部即为实底深色 ---- */
body.solid-top .hdr{background:var(--c-dark);backdrop-filter:blur(8px);box-shadow:var(--sh-sm)}
body.solid-top .hdr .nav>a{color:#E2E8F0}
body.solid-top .hdr .logo-txt{color:#fff}
body.solid-top .topbar{position:static}

/* ---- 内页英雄横幅 .page-hero（面包屑页通用开屏，首页用 .hero 不用本类） ---- */
.page-hero{position:relative;background:var(--c-hero-bg);color:var(--c-htx);border-bottom:var(--c-hero-bd);overflow:hidden;padding:calc(var(--topbar-h) + var(--hdr-h) + 44px) 0 52px}
.page-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--c-hero-grid) 1px,transparent 1px),linear-gradient(90deg,var(--c-hero-grid) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse at 30% 40%,#000 30%,transparent 75%)}
.page-hero .container{position:relative;z-index:2}
.page-hero h1{font-size:clamp(24px,3.2vw,38px);font-weight:800;letter-spacing:-.01em;line-height:1.25}
.page-hero .ph-sub{color:var(--c-hsub);margin-top:12px;font-size:15.5px;max-width:760px;line-height:1.8}
.page-hero .ph-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.page-hero .ph-cta .btn{min-height:46px;padding:12px 26px}

/* ---- 面包屑 .breadcrumb（全站内页；对应 Breadcrumb JSON-LD 建议每页保留） ---- */
.breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--t2);list-style:none;padding:14px 0}
.page-hero .breadcrumb{position:relative;z-index:2;color:var(--c-bcrumb);padding:0 0 18px;margin-bottom:20px}
.breadcrumb a{color:inherit;transition:color .2s}
.breadcrumb a:hover{color:var(--c-brand)}
.breadcrumb .sep{color:var(--t3);opacity:.7}
.page-hero .breadcrumb a:hover{color:var(--c-hbchover)}
.page-hero .breadcrumb .sep{color:var(--c-hsep)}
.breadcrumb [aria-current="page"]{color:var(--t);font-weight:600}
.page-hero .breadcrumb [aria-current="page"]{color:var(--c-hact)}

/* ---- 通用筛选条 .filter-bar（与 .filter-btn 搭配；列表页顶部） ---- */
.filter-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:36px}
.filter-bar.left{justify-content:flex-start}
.filter-bar .fb-label{width:100%;text-align:center;font-size:12.5px;color:var(--t3);letter-spacing:.14em;margin-bottom:2px}

/* ---- 图文长文 .article（about/privacy/faq 说明/新闻详情正文等静态长文容器） ---- */
.article{max-width:860px;margin:0 auto;font-size:15.5px;line-height:1.95;color:var(--t2)}
.article p{margin:0 0 16px}
.article h2{font-size:clamp(20px,2.4vw,26px);color:var(--t);margin:42px 0 14px;font-weight:700;line-height:1.4;padding-left:14px;border-left:4px solid var(--c-brand);border-radius:2px}
.article h3{font-size:19px;color:var(--t);margin:30px 0 10px}
.article h4{font-size:16.5px;color:var(--t);margin:24px 0 8px}
.article ul,.article ol{margin:0 0 18px;padding-left:24px}
.article ul{list-style:disc}
.article ol{list-style:decimal}
.article li{margin:6px 0}
.article a{color:var(--c-brand);border-bottom:1px solid rgba(var(--c-br-rgb),.3)}
.article a:hover{color:var(--c-brand-h);border-color:var(--c-brand-h)}
.article blockquote{border-left:4px solid var(--c-line2);background:var(--c-bg2);padding:14px 18px;border-radius:0 var(--r-sm) var(--r-sm) 0;color:var(--t2);margin:0 0 18px}
.article img{border-radius:var(--r-lg);margin:6px 0 18px}
.article table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:14px}
.article table td,.article table th{border:1px solid var(--c-line);padding:9px 12px;text-align:left}
.article table th{background:var(--c-bg2);color:var(--t);font-weight:600}

/* ---- 新闻列表 .news-list（news.html 行式列表；卡片式用 .news-grid） ---- */
.news-list{display:grid;gap:16px;max-width:960px;margin:0 auto}
.news-list-item{display:flex;gap:22px;align-items:flex-start;background:#fff;border:1px solid var(--c-line);border-radius:var(--r-lg);padding:20px 24px;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}
.news-list-item:hover{transform:translateY(-4px);box-shadow:var(--c-shadow);border-color:var(--c-brand2)}
.nl-date{flex:0 0 118px;text-align:center;background:var(--c-bg2);border:1px solid var(--c-line);border-radius:var(--r-sm);padding:10px 6px}
.nl-date b{display:block;font-size:25px;font-family:var(--fs-mono);color:var(--c-brand);line-height:1.15;font-weight:800}
.nl-date span{font-size:12px;color:var(--t3)}
.nl-body{flex:1;min-width:0}
.nl-body h3{font-size:17px;color:var(--t);line-height:1.5;transition:color .2s}
.news-list-item:hover .nl-body h3{color:var(--c-brand)}
.nl-body p{font-size:13.5px;color:var(--t2);margin-top:6px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nl-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:var(--t3);margin-top:12px;align-items:center}
.nl-meta .tag-mini{color:var(--c-tagtx);background:var(--c-tint1);border-radius:999px;padding:1px 10px;font-weight:600}
.nl-more{margin-left:auto;color:var(--c-brand);font-size:13.5px;font-weight:600;display:inline-flex;align-items:center;gap:4px;transition:.2s}
.nl-more:hover{color:var(--c-brand-h);gap:7px}

/* ---- 新闻详情 .news-detail（news/<slug>.html 静态种子与 api 生成页共用） ---- */
.news-detail{max-width:860px;margin:0 auto}
.news-detail h1{font-size:clamp(22px,3vw,32px);color:var(--t);line-height:1.35;font-weight:800;letter-spacing:-.01em}
.nd-meta{display:flex;flex-wrap:wrap;gap:8px 24px;color:var(--t3);font-size:13px;padding:16px 0 18px;border-bottom:1px solid var(--c-line);margin:16px 0 26px;align-items:center}
.nd-meta .tag-mini{color:var(--c-tagtx);background:var(--c-tint1);border-radius:999px;padding:2px 11px;font-weight:600}
.nd-share{margin-left:auto;display:inline-flex;gap:6px;font-size:12px}
.news-detail .article{margin:0;max-width:none}
.nd-tail{border-top:1px dashed var(--c-line);margin-top:36px;padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:14px;color:var(--t2)}
.nd-tail a{color:var(--c-brand);font-weight:600}
.nd-tail a:hover{color:var(--c-brand-h)}

/* ---- 产品详情 .product-detail（products/<slug>.html；左图右信息+规格卡） ---- */
.product-detail{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:start}
.pd-gallery{position:relative}
.product-detail .pd-media{padding:48px 30px}
.product-detail .pd-media svg{height:300px;width:auto;filter:drop-shadow(0 16px 30px rgba(var(--c-br-rgb),.2))}
.product-detail .pd-media .pm-badge{position:absolute;top:14px;left:14px}
.pd-info h1{font-size:clamp(22px,2.9vw,31px);color:var(--t);font-weight:800;line-height:1.3;letter-spacing:-.01em}
.pd-info .pd-lead{color:var(--t2);font-size:15.5px;line-height:1.85;margin-top:14px}
.pd-info .pd-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.pd-info .pd-tags .p-tag{font-size:12px;padding:3px 12px}
.pd-info .pd-app{margin-top:16px;font-size:14px;color:var(--t2);line-height:1.8}
.pd-info .pd-app b{color:var(--t);font-weight:600}
.pd-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.pd-cta .btn{min-height:48px;padding:12px 28px}
.pd-aside{background:var(--c-bg2);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:22px;position:sticky;top:calc(var(--topbar-h) + var(--hdr-h) + 18px)}
.pd-aside h3{font-size:15px;color:var(--t);margin-bottom:12px;display:flex;align-items:center;justify-content:space-between}
.pd-aside h3 .sp-hint{font-size:11px;color:var(--t3);font-weight:400}
.pd-aside .pd-cta{margin-top:16px}
.pd-aside .pd-cta .btn{flex:1;min-height:46px;padding:11px 12px;font-size:14.5px}

/* ---- 规格参数表 .spec-table（产品详情；规格无真实值行由种子/后台隐藏） ---- */
.spec-table{width:100%;border-collapse:collapse;font-size:14px;background:#fff;border-radius:var(--r-sm);overflow:hidden}
.spec-table caption{caption-side:top;text-align:left;font-size:12px;color:var(--t3);padding:0 0 8px}
.spec-table th{background:var(--c-dark);color:#E2E8F0;text-align:left;padding:10px 14px;font-weight:600;font-size:13px}
.spec-table td{border:1px solid var(--c-line);padding:9px 14px;vertical-align:middle;color:var(--t)}
.spec-table td:first-child{background:var(--c-bg2);color:var(--t2);font-weight:500;width:38%;white-space:nowrap}
.spec-table tbody tr:nth-child(even) td{background:#FAFBFD}
.spec-table tbody tr:nth-child(even) td:first-child{background:#F1F5F9}
.spec-note{margin-top:12px;font-size:12.5px;color:var(--t3);line-height:1.7;padding:10px 13px;background:#fff;border:1px dashed var(--c-line2);border-radius:var(--r-sm)}
.spec-note b{color:var(--c-accent);font-weight:600}

/* ---- 分页 .pagination（news.html / 列表翻页；后台管理端分页类名不同，互不干扰） ---- */
.pagination{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:44px}
.pagination a,.pagination span{min-width:40px;height:40px;padding:0 6px;border-radius:10px;border:1px solid var(--c-line);display:inline-flex;align-items:center;justify-content:center;font-size:14px;color:var(--t2);background:#fff;transition:.2s;font-weight:500}
.pagination a:hover:not(.cur){border-color:var(--c-brand);color:var(--c-brand)}
.pagination .cur{background:var(--c-brand);border-color:var(--c-brand);color:#fff;box-shadow:var(--sh-brand);cursor:default}
.pagination .gap{border-color:transparent;background:none;color:var(--t3)}
.pagination .p-na{opacity:.45;pointer-events:none}

/* ---- 表单增强（询盘 Modal / 联系表单共用） ---- */
.f-row .full{grid-column:1/-1}
.modal-body .f-row{gap:16px 18px}
.modal-body .f-item .btn{width:100%;min-height:48px;margin-top:2px}
.form-card .f-item .btn{width:100%;min-height:48px;margin-top:2px}
.f-privacy{display:flex;gap:7px;align-items:flex-start;justify-content:flex-start;text-align:left;line-height:1.7}
.f-privacy input{width:auto;margin-top:3px;accent-color:var(--c-brand)}
.f-privacy a{color:var(--c-brand);text-decoration:underline}

/* ---- 页脚补充（_footer.html 用） ---- */
.footer .f-logo{display:flex;align-items:center;gap:10px;color:#fff}
.footer .f-logo img{width:40px;height:40px;flex:0 0 40px;border-radius:9px}
.footer .f-contact a{color:var(--c-dmut);transition:.2s;display:inline-flex;align-items:center;gap:6px;font-size:13.5px}
.footer .f-contact a:hover{color:#fff}
.footer .f-contact svg{width:14px;height:14px;color:var(--c-brand2);flex:0 0 14px}
.footer button.f-inq{display:inline;padding:0;border:none;background:none;font:inherit;color:var(--c-dmut);font-size:13.5px;cursor:pointer;text-align:left;transition:.2s;line-height:inherit}
.footer button.f-inq:hover{color:#fff;padding-left:3px}
.footer-bottom .fb-links{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center}

/* ============================================================
   §C 响应式（整合自 p4_css3.html 响应式块，仅前台部分；admin 相关已排除）
   ============================================================ */
@media(max-width:1024px){
  .prod-grid{grid-template-columns:repeat(2,1fr)}
  .app-grid{grid-template-columns:repeat(2,1fr)}
  .tm-grid,.soc-grid,.news-grid{grid-template-columns:repeat(2,1fr)}
  .about-grid,.contact-grid,.tech-grid{grid-template-columns:1fr;gap:36px}
  .steps{grid-template-columns:repeat(3,1fr)}
  .footer-top{grid-template-columns:1fr 1fr}
  .product-detail{grid-template-columns:1fr;gap:30px}
  .pd-aside{position:static}
  .article{max-width:780px}
}
@media(max-width:767px){
  .nav,.hdr .hdr-actions .btn{display:none}
  .burger{display:flex}
  .tb-left{display:none}
  .prod-grid,.app-grid,.tm-grid,.soc-grid,.news-grid{grid-template-columns:1fr}
  /* 375：联系页单栏表单在前（F-5）；平台行可换行不横向溢出（O-I07） */
  .contact-grid{display:flex;flex-direction:column}
  .contact-grid>.ci-side{order:2}
  .contact-grid>.form-card{order:1}
  .soc-grid{gap:14px}
  .soc-row{align-items:flex-start}
  .soc-row-cta{width:100%;padding-left:52px}
  .adv-grid{grid-template-columns:1fr}
  .check-list,.big-nums{grid-template-columns:1fr 1fr}
  .about-feats{grid-template-columns:1fr}
  .steps{grid-template-columns:repeat(2,1fr);gap:18px}
  .footer-top{grid-template-columns:1fr;gap:28px}
  .f-row{grid-template-columns:1fr}
  .hero .h-stats{gap:20px}
  .logo-wall{grid-template-columns:repeat(3,1fr)}
  .modal-mask{padding:16px 8px}
  .page-hero{padding:calc(var(--topbar-h) + var(--hdr-h) + 28px) 0 34px}
  .page-hero h1{font-size:clamp(21px,5.5vw,27px)}
  .breadcrumb{font-size:12px;gap:6px}
  .news-list-item{flex-direction:column;gap:10px;padding:16px 18px}
  .nl-date{flex:0 0 auto;width:auto;display:inline-flex;align-items:baseline;gap:8px;padding:5px 14px}
  .nl-date b{font-size:18px}
  .nl-more{margin-left:0}
  .product-detail .pd-media{padding:26px 18px}
  .product-detail .pd-media svg{height:200px}
  .spec-table{font-size:13px}
  .spec-table td:first-child{white-space:normal;width:42%}
  .pagination{gap:6px}
  .pagination a,.pagination span{min-width:36px;height:36px;font-size:13px}
  .article h2{font-size:20px;margin-top:32px}
  .nd-tail{flex-direction:column}
}
@media(max-width:380px){
  .check-list,.big-nums,.steps{grid-template-columns:1fr}
  .footer-top{gap:24px}
}


/* ============================================================
   §D 主题系统 v2.1（对应 docs/ARCHITECTURE.md v2.1 修订记录）
   机制：html[data-theme] 由 bate-core BATE.theme.apply() 于脚本最早写入；
   A「工程藏青」= 默认（无覆盖块，即 :root 现值，逐像素不变）；
   B「电光科技蓝」/ C「克制灰阶」= 本文件尾两段覆盖（唯一主题差异点，
   禁止在别处另写主题色；色值严格取自 docs/color-previews/preview-b.html
   与 preview-c.html 的 :root 对应语义，仅列 主蓝/亮蓝/高亮/CTA/深区/
   深区中段/浅tint/标签/文字/线条/卡片阴影）。
   产品卡媒体背景：B 按品类微色相（无人机蓝/无人船·遥控船青/遥控车暖橙，
   :nth-child 依赖两页 .prod-grid 内 6 卡固定顺序 uav×2/usv/rc-car/rc-boat/oem）；
   A 与 C 用统一 --c-tint1/--c-tint2 灰蓝渐变。
   ============================================================ */

/* ---------------- B · 电光科技蓝（预览 b） ---------------- */
html[data-theme="b"]{
  --c-brand:#2F7CF6; --c-brand2:#0A84FF; --c-brand-h:#0B5ED7;
  --c-dark:#0A1128; --c-dark2:#16305E;
  --c-hero-mid:#123060; --c-hero-end:#1D4ED8; --c-tech-mid:#123060;
  --c-hero-grid:rgba(96,165,250,.10); --c-dgrid:rgba(96,165,250,.08);
  --c-htx:#FFFFFF; --c-hsub:#C3D4F2; --c-hmut:#8FA3C8; --c-bcrumb:#8FA3C8;
  --c-hi:#7DC4FF; --c-hi-d:#7DC4FF; --c-hi-soft:rgba(125,196,255,.16);
  --c-hg1:#7DC4FF; --c-hg2:#38BDF8; --c-hg3:#38BDF8; --c-dot:#38BDF8;
  --c-kick:#7DC4FF; --c-kickbd:rgba(125,196,255,.4);
  --c-chiptx:#C3D4F2;
  --c-tint1:#F2F8FF; --c-tint2:#DCEBFF; --c-tintdeep:#D0E7FF;
  --c-tagbg:#E7F1FF; --c-tagtx:#0B5ED7; --c-tagbd:#C7D8F2;
  --c-br-rgb:47,124,246; --c-b2-rgb:10,132,255; --c-dr-rgb:10,17,40; --c-pulse-rgb:10,132,255;
  --c-shadow:0 16px 30px -12px rgba(23,86,210,.26);
  --sh-brand:0 8px 20px -6px rgba(47,124,246,.4);
  --c-dline:rgba(148,163,184,.22); --c-dmut:#8FA3C8;
  --t:#1B2437; --t2:#5A6B85; --t3:#97A5BC;
  --c-bg2:#F7FAFF; --c-line:#E6ECF5; --c-line2:#C7D8F2;
}
html[data-theme="b"] .btn-accent{background:linear-gradient(90deg,#0A84FF,#2F7CF6)}
html[data-theme="b"] .btn-accent:hover{background:linear-gradient(90deg,#0A84FF,#2F7CF6);filter:brightness(1.04)}
/* B 产品卡媒体背景：品类微色相 tint（预览 b 三档：无人机蓝/无人船·遥控船青/遥控车暖橙） */
html[data-theme="b"] .prod-grid .prod-card:nth-child(1) .pm-bg,
html[data-theme="b"] .prod-grid .prod-card:nth-child(2) .pm-bg{background:linear-gradient(160deg,#EAF4FF,#D0E7FF)}
html[data-theme="b"] .prod-grid .prod-card:nth-child(3) .pm-bg,
html[data-theme="b"] .prod-grid .prod-card:nth-child(5) .pm-bg{background:linear-gradient(160deg,#E2F7F8,#C5ECEF)}
html[data-theme="b"] .prod-grid .prod-card:nth-child(4) .pm-bg{background:linear-gradient(160deg,#FFEFE6,#FFDCCB)}

/* ---------------- C · 克制灰阶（预览 c，maxon 向） ---------------- */
html[data-theme="c"]{
  --r-lg:2px; --r-sm:2px;
  --c-accent:#0F172A; --c-cta-h:#262B33;
  --c-dark:#12151A; --c-dark2:#262B33; --c-dark3:#12151A;
  --c-hero-bg:#FFFFFF; --c-hero-bd:1px solid #E6E8EB;
  --c-hero-mid:#262B33; --c-hero-end:#262B33; --c-tech-mid:#262B33;
  --c-hero-grid:rgba(15,23,42,.05); --c-dgrid:rgba(148,163,184,.05);
  --c-htx:#12151A; --c-hsub:#5C6470; --c-hmut:#5C6470; --c-hsep:#C9CDD3;
  --c-bcrumb:#5C6470; --c-hact:#12151A; --c-hbchover:#1A56DB;
  --c-hi:#1A56DB; --c-hi-d:#9AA3AE; --c-hi-soft:rgba(255,255,255,.08);
  --c-hg1:#1A56DB; --c-hg2:#3B82F6; --c-hg3:#3B82F6; --c-dot:#3B82F6;
  --c-kick:#1A56DB; --c-kickbd:#E6E8EB; --c-kickbg:#F7F8FA;
  --c-chiptx:#5C6470; --c-chipbg:#F7F8FA; --c-chipline:#E6E8EB; --c-hline:#E6E8EB;
  --c-pillbg:#1A1E25; --c-pilltx:#FFFFFF; --c-pillbd:#2E333C;
  --c-obin-tx:#12151A; --c-obin-bd:#C9CDD3; --c-obin-hov:#F7F8FA;
  --c-tint1:#FBFCFD; --c-tint2:#F0F1F3; --c-tintdeep:#E6E8EB;
  --c-tagbg:#FFFFFF; --c-tagtx:#444B55; --c-tagbd:#E6E8EB;
  --c-br-rgb:26,86,219; --c-b2-rgb:59,130,246; --c-dr-rgb:18,21,26; --c-pulse-rgb:15,23,42;
  --c-shadow:0 14px 26px -14px rgba(15,23,42,.16);
  --sh-brand:0 8px 20px -6px rgba(15,23,42,.25);
  --c-dcard:#1A1E25; --c-dline:#2E333C; --c-dmut:#9AA3AE;
  --t:#1F242B; --t2:#5C6470; --t3:#98A0AA;
  --c-bg2:#F7F8FA; --c-line:#E6E8EB; --c-line2:#C9CDD3;
}
/* C：白底浅色头部（预览 c 白页头）＋ 深色顶条保留 */
html[data-theme="c"] .hdr{background:rgba(255,255,255,.9);box-shadow:0 1px 0 rgba(18,21,26,.06)}
html[data-theme="c"] .hdr.scrolled{background:rgba(255,255,255,.97)}
html[data-theme="c"] .hdr .logo{color:#12151A}
html[data-theme="c"] .hdr .logo-sub{color:#98A0AA}
html[data-theme="c"] .hdr .nav>a{color:#444B55}
html[data-theme="c"] .hdr .nav>a.active{color:#12151A}
html[data-theme="c"] .burger:not(.on) span,html[data-theme="c"] .burger:not(.on) span::before,html[data-theme="c"] .burger:not(.on) span::after{background:#12151A}
/* C：白 hero 上减弱辉光；抽屉内 CTA 反白保证可见 */
html[data-theme="c"] .hero .glow{opacity:.1}
html[data-theme="c"] .drawer .btn-accent{background:#FFFFFF;color:#12151A}