
:root{--bg:#FAF8F4;--ink:#1F2430;--muted:#6B7280;--gold:#B8895A;--gold-d:#9c6f44;
--line:#E7E1D8;--card:#fff;--shadow:0 2px 14px rgba(31,36,48,.06);--ink2:#2a2f3a;}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 22px}
img{max-width:100%}

/* 顶部工具条 */
.topbar{background:var(--ink);color:#cdd2db;font-size:12.5px}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:38px}
.topbar a{color:#cdd2db}
.topbar .l,.topbar .r{display:flex;gap:16px;align-items:center}
.topbar .sep{opacity:.35}
@media(max-width:680px){.topbar .l span:first-child{display:none}}

/* 导航 */
header.site{position:sticky;top:0;z-index:50;background:rgba(250,248,244,.94);backdrop-filter:blur(8px);
border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font-weight:800;letter-spacing:.05em;font-size:20px}
.logo span{color:var(--gold)}
.navlinks{display:flex;gap:28px;font-size:14.5px}
.navlinks a{color:#46505f;transition:.2s}
.navlinks a:hover{color:var(--gold)}
.btn{display:inline-block;background:var(--gold);color:#fff;padding:11px 22px;border-radius:30px;font-weight:600;font-size:14px;transition:.2s;border:none;cursor:pointer}
.btn:hover{background:var(--gold-d)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn.wa{background:#25D366}
.btn.wa:hover{background:#1ebe5b}

/* Hero 分栏 */
.hero2{padding:54px 0 58px;background:linear-gradient(180deg,#fff 0%,#FAF8F4 100%)}
.hero2 .grid2{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.eyebrow{display:inline-block;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom:14px}
.hero2 h1{font-size:46px;line-height:1.12;font-weight:800;letter-spacing:-.01em}
.hero2 h1 .ac{color:var(--gold)}
.hero2 p.lead{color:#4a515f;font-size:17px;margin:18px 0 26px;max-width:520px}
.hero2 .ctas{display:flex;gap:14px;flex-wrap:wrap}
.hero2 .mini{margin-top:24px;display:flex;gap:22px;flex-wrap:wrap;color:#46505f;font-size:13.5px}
.hero2 .mini b{color:var(--ink)}
.hero-media{position:relative}
.hero-media img.main{border-radius:20px;width:100%;height:420px;object-fit:cover;box-shadow:0 18px 50px rgba(31,36,48,.16)}
.hero-media .chip{position:absolute;left:-18px;bottom:26px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 18px;box-shadow:0 10px 30px rgba(31,36,48,.14)}
.hero-media .chip b{display:block;font-size:24px;color:var(--gold);font-weight:800}
.hero-media .chip span{font-size:12.5px;color:var(--muted)}

/* ===== Hero 对标版（深蓝 + 超大单品标题 + 参数签 + 橙色大CTA） ===== */
.heroB{background:linear-gradient(115deg,#0d2f6e 0%,#14418f 55%,#1d55b8 100%);color:#fff;
overflow:hidden;position:relative}
.heroB::after{content:"";position:absolute;inset:0;pointer-events:none;
background:radial-gradient(900px 420px at 78% 30%,rgba(255,255,255,.14),transparent 60%)}
.heroB .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.08fr .92fr;gap:36px;align-items:center;padding-top:58px;padding-bottom:58px}
.heroB .badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);
border:1px solid rgba(255,255,255,.25);border-radius:30px;padding:6px 16px;font-size:12.5px;
letter-spacing:.08em;text-transform:uppercase;font-weight:600;margin-bottom:22px}
.heroB .badge i{width:8px;height:8px;border-radius:50%;background:#ffb45e;display:inline-block}
.heroB h1{font-size:56px;line-height:1.04;font-weight:900;letter-spacing:.01em;text-transform:uppercase}
.heroB h1 .thin{display:block;font-size:30px;font-weight:700;letter-spacing:.04em;margin-top:10px;color:#cfe0ff}
.heroB .comp{margin-top:16px;font-size:19px;font-weight:600;color:#ffd9ac}
.heroB .sps{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px;max-width:560px}
.heroB .sp{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.10);
border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:10px 14px;font-size:13.5px;font-weight:500}
.heroB .sp i{flex:none;width:26px;height:26px;border-radius:7px;background:#f7941d;color:#fff;
display:flex;align-items:center;justify-content:center;font-style:normal;font-weight:800;font-size:14px}
.heroB .ctas{margin-top:28px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.btn-o{display:inline-block;background:#f7941d;color:#fff;padding:15px 30px;border-radius:36px;
font-weight:800;font-size:16px;box-shadow:0 10px 26px rgba(247,148,29,.42);transition:.2s}
.btn-o:hover{background:#e2830f;transform:translateY(-2px)}
.btn-ob{display:inline-block;background:transparent;color:#fff;border:2px solid rgba(255,255,255,.55);
padding:13px 26px;border-radius:36px;font-weight:700;font-size:15px;transition:.2s}
.btn-ob:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.heroB .media{position:relative}
.heroB .media img{width:100%;height:470px;object-fit:cover;border-radius:18px;
box-shadow:0 24px 60px rgba(0,0,0,.38);border:1px solid rgba(255,255,255,.18)}
.heroB .media .tag{position:absolute;right:-14px;top:26px;background:#f7941d;color:#fff;border-radius:12px;
padding:10px 16px;font-weight:800;font-size:14px;box-shadow:0 10px 26px rgba(0,0,0,.3)}
.heroB .media .tag span{display:block;font-size:11px;font-weight:600;opacity:.9}
.heroB .foot{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.16)}
.heroB .foot .wrap{display:flex;gap:34px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px;font-size:13px;color:#bcd0f5}
.heroB .foot b{color:#fff}

/* 数据条 */
.statband{background:var(--ink);color:#fff}
.statband .wrap{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:30px 22px}
.statband .s{text-align:center;border-right:1px solid rgba(255,255,255,.12)}
.statband .s:last-child{border-right:none}
.statband .s b{display:block;font-size:26px;color:var(--gold);font-weight:800}
.statband .s span{font-size:12.5px;color:#c2c8d2}

/* 通用 section */
.section{padding:64px 0}
.section h2{font-size:30px;font-weight:800;letter-spacing:-.01em}
.section .sub{color:var(--muted);margin:8px 0 32px;font-size:15.5px;max-width:680px}
.eyebrow-c{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom:8px;display:block}

/* 分类网格 */
.grid{display:grid;gap:22px}
.cats{grid-template-columns:repeat(4,1fr)}
.cat{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);transition:.25s;display:block}
.cat:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(31,36,48,.12)}
.cat .ph{overflow:hidden}
.cat img{width:100%;height:182px;object-fit:cover;transition:.4s}
.cat:hover img{transform:scale(1.06)}
.cat .body{padding:16px 18px 18px}
.cat .body h3{font-size:17px}
.cat .body p{color:var(--muted);font-size:13px;margin-top:4px}
.cat .body .n{color:var(--gold);font-size:12.5px;margin-top:10px;font-weight:600}

/* 精选产品 */
.prods{grid-template-columns:repeat(3,1fr)}
.prod{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);transition:.25s;display:flex;flex-direction:column}
.prod:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(31,36,48,.12)}
.prod img{width:100%;height:200px;object-fit:cover;background:#efe9e0}
.prod .body{padding:15px 16px 16px;flex:1;display:flex;flex-direction:column}
.prod .body h3{font-size:15px;line-height:1.35}
.prod .body .cn{color:var(--muted);font-size:12px;margin:3px 0 8px}
.prod .body .meta{font-size:12px;color:var(--ink);margin-top:auto;display:flex;justify-content:space-between}
.prod .body .meta .pr{color:var(--gold);font-weight:700}
.prod .body .spec{font-size:12px;color:#46505f;margin-top:auto;display:flex;flex-direction:column;gap:3px}
.prod .body .spec .pr{color:var(--gold);font-weight:700;font-size:13px}
.prod > a.pc{display:flex;flex-direction:column;flex:1}
.prod .btn.wa{margin:0 16px 16px;text-align:center}
.prod .btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 16px 16px}
.prod .btns .btn{margin:0;padding:10px 6px;font-size:13px;text-align:center}
.btn.inqb{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.inqb:hover{border-color:var(--gold);color:var(--gold)}
.bread{color:var(--muted);font-size:13px;margin-bottom:18px}
.bread a:hover{color:var(--ink)}
.detail{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.detail img{width:100%;border-radius:16px;box-shadow:var(--shadow)}
.pbox h1{font-size:30px;font-weight:800}
.pbox .cn{color:var(--muted);font-size:15px;margin:4px 0 18px}
.spec{width:100%;border-collapse:collapse;margin:14px 0 20px;font-size:14px}
.spec td{border:1px solid var(--line);padding:10px 14px}
.spec td:first-child{background:#f6f2ea;color:var(--muted);width:140px}
.pbox .desc{color:#3a3f4b;font-size:15px}
.cta-row{display:flex;gap:12px;margin-top:24px}

/* 为什么选我们 */
.why{grid-template-columns:repeat(3,1fr)}
.whyc{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;box-shadow:var(--shadow);transition:.2s}
.whyc:hover{transform:translateY(-3px)}
.whyc .no{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:9px;background:#f3e9dd;color:var(--gold-d);font-weight:800;font-size:14px;margin-bottom:14px}
.whyc h4{font-size:17px;margin-bottom:7px}
.whyc p{color:var(--muted);font-size:13.5px}

/* 市场 */
.markets{display:flex;gap:12px;flex-wrap:wrap}
.markets .m{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:13px 20px;font-size:14px;display:flex;align-items:center;gap:9px}
.markets .m::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold)}

/* 询盘 CTA */
.cta2{background:linear-gradient(120deg,#1F2430,#2c3340);color:#fff;border-radius:22px;padding:46px;display:grid;grid-template-columns:1.25fr .75fr;gap:30px;align-items:center;margin:10px 0}
.cta2.quote2{grid-template-columns:1fr 1.15fr;align-items:stretch}
.cta2 h2{color:#fff;font-size:28px}
.cta2 p{color:#c2c8d2;margin:10px 0 0;font-size:15px}
.cta2 .btns{display:flex;flex-direction:column;gap:12px}
.cta2 .btns .btn{text-align:center}

/* 页脚 */
.footer{background:var(--ink);color:#cfd3da;padding:50px 0 30px;margin-top:64px;font-size:13.5px}
.footer a{color:#cfd3da}
.footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px}
.footer h4{color:#fff;font-size:15px;margin-bottom:12px}
.footer .bot{border-top:1px solid #333a47;margin-top:30px;padding-top:18px;color:#8b93a1;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}

/* 悬浮 CTA */
.fab{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;flex-direction:column;gap:12px}
.fab a{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(0,0,0,.18);font-size:13px;font-weight:600;color:#fff}
.fab .wa{background:#25D366}
.fab .q{background:var(--gold)}

/* 顶部公告条 */
.announce{background:linear-gradient(90deg,#0d2f6e,#1d55b8);color:#fff;font-size:13px}
.announce .wrap{display:flex;align-items:center;justify-content:center;gap:14px;height:38px;text-align:center}
.announce b{color:#ffd9ac;font-weight:700}
.announce .abtn{background:#f7941d;color:#fff;padding:4px 14px;border-radius:20px;font-weight:700;font-size:12px;transition:.2s}
.announce .abtn:hover{background:#e2830f}
.section,section[id]{scroll-margin-top:86px}

/* Hero 动效（banner 效果） */
@keyframes ts-fadeup{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes ts-sheen{0%{transform:translateX(-40%) rotate(8deg);opacity:0}40%{opacity:.45}100%{transform:translateX(140%) rotate(8deg);opacity:0}}
@keyframes ts-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.heroB .copy{animation:ts-fadeup .7s ease both}
.heroB .media img{animation:ts-fadeup .9s .1s ease both}
.heroB::before{content:"";position:absolute;top:0;left:0;width:42%;height:100%;
background:linear-gradient(120deg,transparent,rgba(255,255,255,.18),transparent);
animation:ts-sheen 6.5s ease-in-out infinite;z-index:0}
.heroB .media .tag{animation:ts-float 3.2s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.heroB .copy,.heroB .media img,.heroB::before,.heroB .media .tag{animation:none}}

/* 下单流程 */
.process{grid-template-columns:repeat(4,1fr)}
.pstep{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px 22px;box-shadow:var(--shadow);transition:.2s}
.pstep:hover{transform:translateY(-3px)}
.pstep .n{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border-radius:10px;
background:linear-gradient(135deg,#0d2f6e,#1d55b8);color:#fff;font-weight:800;font-size:15px;margin-bottom:14px}
.pstep h4{font-size:16px;margin-bottom:6px}
.pstep p{color:var(--muted);font-size:13px}

/* 询盘表单 */
.inq{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow)}
.inq .grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.inq label{display:block;font-size:13px;color:#46505f;margin:0 0 7px;font-weight:600}
.inq label .req{color:#c0392b;margin-left:2px}
.inq input,.inq select,.inq textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:11px 13px;font-size:14px;font-family:inherit;color:var(--ink);background:#fff;transition:.2s}
.inq input:focus,.inq select:focus,.inq textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,137,90,.15)}
.inq textarea{resize:vertical;min-height:92px}
.inq .full{grid-column:1/-1}
.inq .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.inq .submit{width:100%;background:linear-gradient(135deg,#0d2f6e,#1d55b8);color:#fff;border:none;border-radius:12px;padding:14px;font-size:15px;font-weight:700;cursor:pointer;transition:.2s}
.inq .submit:hover{filter:brightness(1.08)}
.inq .submit:disabled{opacity:.6;cursor:wait}
.inq .privacy{font-size:12px;color:var(--muted);margin-top:12px;text-align:center}
.inq-done{border:1px solid var(--line);border-left:3px solid var(--gold);background:#fff;border-radius:14px;padding:22px 24px;box-shadow:var(--shadow)}
.inq-done.bad{border-left-color:#B23B38}
.inq-done .t{font-size:17px;font-weight:800;margin-bottom:6px}
.inq-done p{color:#46505f;font-size:14px}
.inq-done .fallback{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.inq-done .fallback a{padding:9px 16px;border-radius:10px;font-size:13.5px;font-weight:600}
.inq-done .fallback .m{background:var(--ink);color:#fff}
.inq-done .fallback .w{background:#25D366;color:#fff}
.inq-done .copy-email{margin-top:10px;font-size:12.5px;color:var(--muted)}
.inq-done .copy-email code{background:#f3efe7;padding:2px 7px;border-radius:6px;color:var(--ink)}
body.at-quote .fab{opacity:0;pointer-events:none;transform:translateY(8px);transition:.3s}
@media(prefers-reduced-motion:reduce){body.at-quote .fab .q{transition:none}}

@media(max-width:980px){.heroB .wrap{grid-template-columns:1fr;padding-top:40px;padding-bottom:40px}.heroB h1{font-size:40px}.heroB .media img{height:320px}.heroB .media .tag{right:10px}.hero2 .grid2{grid-template-columns:1fr}.hero-media img.main{height:300px}.statband .wrap{grid-template-columns:repeat(2,1fr);gap:18px}.statband .s{border-right:none}.cats{grid-template-columns:repeat(2,1fr)}.prods{grid-template-columns:repeat(2,1fr)}.why{grid-template-columns:1fr}.cta2{padding:32px}.cta2.quote2{grid-template-columns:1fr}.footer .cols{grid-template-columns:1fr 1fr}.process{grid-template-columns:repeat(2,1fr)}.inq .grid2{grid-template-columns:1fr}}
@media(max-width:560px){.navlinks{display:none}.heroB h1{font-size:31px}.heroB h1 .thin{font-size:21px}.heroB .comp{font-size:15px}.heroB .sps{grid-template-columns:1fr}.heroB .media img{height:240px}.hero2 h1{font-size:34px}.prods{grid-template-columns:1fr}.footer .cols{grid-template-columns:1fr}.announce .abtn{display:none}.process{grid-template-columns:1fr}.cta2{grid-template-columns:1fr}}
