/* ============================================================
   FiguForge v2 设计系统 · 「墨与火」
   基因来自LOGO: 墨黑#111827 × 锻炉橙#E8590C × 粗无衬线
   骨架参考: WB 开发 8.22.html(黑金收藏版式)
   ============================================================ */
@font-face{font-family:'Inter';src:url('../vendor/fonts/f-inter-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('../vendor/fonts/f-inter-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Archivo';src:url('../vendor/fonts/f-archivo-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Archivo';src:url('../vendor/fonts/f-archivo-800.woff2') format('woff2');font-weight:800;font-display:swap}
:root{
  --ink:#111827; --ink-800:#1F2937; --ink-600:#374151;
  --ember:#E8590C; --ember-deep:#C2410C; --ember-soft:rgba(232,89,12,.10);
  --paper:#FAF7F3; --paper-deep:#F0EBE4; --white:#FFFFFF;
  --muted:#6B7280; --line:rgba(17,24,39,.12);
  --r-lg:18px; --r-md:12px; --r-sm:8px;
  --sh-1:0 1px 2px rgba(17,24,39,.05),0 10px 30px rgba(17,24,39,.08);
  --ease:cubic-bezier(.2,0,0,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:'Inter',system-ui,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.disp{font-family:'Archivo',Inter,system-ui,sans-serif;letter-spacing:-.5px}
.kicker{display:inline-block;font-size:12px;font-weight:600;letter-spacing:3px;color:var(--ember);text-transform:uppercase;margin-bottom:14px}
.sec{padding:92px 0}
.sec-head{text-align:center;max-width:680px;margin:0 auto 54px}
.sec-head h2{font-family:'Archivo';font-size:clamp(30px,4vw,44px);font-weight:800;line-height:1.15}
.sec-head p{color:var(--muted);font-size:16px;margin-top:14px}
.btn{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:#fff;font-weight:600;font-size:15px;padding:14px 30px;border-radius:var(--r-sm);border:none;text-decoration:none;letter-spacing:.2px;transition:.2s var(--ease);cursor:pointer}
.btn:hover{background:var(--ember);transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn.ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn.ember{background:var(--ember)} .btn.ember:hover{background:var(--ember-deep)}
/* 导航 */
.nav{position:sticky;top:0;z-index:200;background:rgba(250,247,243,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:70px}
.logo{font-family:'Archivo';font-weight:800;font-size:21px;letter-spacing:.5px;color:var(--ink);text-decoration:none}
.logo em{font-style:normal;color:var(--ember)}
.nav-links{display:flex;gap:26px;font-size:14px;font-weight:500}
.nav-links a{color:var(--ink-600);text-decoration:none;position:relative;padding:6px 0}
.nav-links a:hover,.nav-links a.on{color:var(--ink)}
.nav-links a:hover::after,.nav-links a.on::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--ember)}
/* Hero */
.hero{position:relative;min-height:640px;display:flex;align-items:center;color:#fff;overflow:hidden}
.hero-media{position:absolute;inset:0;z-index:0}
.hero .slot-video{position:absolute;inset:0;width:100%;height:100%}
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,rgba(17,24,39,.93) 0%,rgba(17,24,39,.72) 45%,rgba(17,24,39,.35) 100%)}
.hero .wrap{position:relative;z-index:2;padding-top:60px;padding-bottom:80px}
.hero h1{font-family:'Archivo';font-weight:800;font-size:clamp(40px,5.6vw,68px);line-height:1.06;max-width:760px}
.hero h1 em{font-style:normal;color:var(--ember)}
.hero p.sub{font-size:18px;color:rgba(255,255,255,.78);max-width:560px;margin:22px 0 34px}
.trust-bar{display:flex;gap:14px;flex-wrap:wrap;margin-top:56px}
.trust-bar span{background:rgba(255,255,255,.08);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);color:#fff;font-size:13px;font-weight:600;padding:10px 18px;border-radius:999px}
.trust-bar b{color:#FFB27A}
/* 媒体占位体系 */
.phm{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;color:#8A94A6;background:
 repeating-linear-gradient(45deg,#EEF1F5 0 12px,#E9EDF2 12px 24px);border:1.5px dashed #C3CCD9;border-radius:var(--r-md);overflow:hidden}
.phm::before{content:'▶ 影像位';font-size:11px;letter-spacing:2px;font-weight:600;position:absolute;top:10px;left:12px;color:#98A2B3}
.phm .cap{padding:18px;font-size:13px;font-weight:500;color:#667085;max-width:90%}
.phm .aid{position:absolute;bottom:8px;right:12px;font-size:10px;font-weight:700;letter-spacing:1px;color:#B0B8C4}
.phm.img::before{content:'🖼 图位'}
.r169{aspect-ratio:16/9}.r43{aspect-ratio:4/3}.r11{aspect-ratio:1/1}.r219{aspect-ratio:21/9}
/* 产品卡 */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:26px}
.card{background:var(--white);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden;transition:.25s var(--ease);text-decoration:none;color:inherit;display:block}
.card:hover{transform:translateY(-5px);box-shadow:0 6px 16px rgba(17,24,39,.10),0 20px 48px rgba(17,24,39,.13)}
.card .phm{border:none;border-radius:0;border-bottom:1px solid var(--line)}
.card-body{padding:24px 26px 28px}
.card .cat{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--ember);text-transform:uppercase}
.card h3{font-family:'Archivo';font-size:21px;font-weight:700;margin:7px 0 8px}
.card p{font-size:14px;color:var(--muted)}
.chips{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:34px;padding-top:26px;border-top:1px dashed var(--line)}
.chips .lbl{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--ink-600);text-transform:uppercase;align-self:center}
.chip{font-size:13px;font-weight:500;color:var(--ink-800);border:1px solid rgba(17,24,39,.25);padding:8px 20px;border-radius:2px;text-decoration:none;transition:.2s}
.chip:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
/* 拼贴画廊 */
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.mosaic .phm{min-height:200px;border-radius:var(--r-md)}
.mosaic .big{grid-column:span 2;grid-row:span 2;min-height:414px}
/* 步骤 */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;counter-reset:st}
.step{background:var(--white);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden;border-top:3px solid var(--ember)}
.step .phm{border:none;border-radius:0;height:150px}
.step-b{padding:22px 24px 26px}
.step .num{font-family:'Archivo';font-weight:800;font-size:13px;color:var(--ember);letter-spacing:2px}
.step h4{font-size:17px;font-weight:600;margin:8px 0 7px}
.step p{font-size:13.5px;color:var(--muted)}
.tag{display:inline-block;margin-top:12px;font-size:11px;font-weight:600;letter-spacing:1px;color:var(--ember-deep);background:var(--ember-soft);border:1px solid rgba(232,89,12,.35);padding:3px 12px;border-radius:2px}
/* 深色特性块 */
.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.feat{background:var(--ink);border-radius:var(--r-lg);padding:32px;color:#fff;position:relative;overflow:hidden}
.feat::after{content:'';position:absolute;top:-40px;right:-40px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,rgba(232,89,12,.25),transparent 70%)}
.feat .num{font-family:'Archivo';font-weight:800;font-size:30px;color:var(--ember)}
.feat h4{font-size:17px;font-weight:600;margin:10px 0 8px}
.feat p{font-size:13.5px;color:rgba(255,255,255,.72)}
/* About */
.about-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.about-copy h2{font-family:'Archivo';font-size:clamp(28px,3.4vw,40px);font-weight:800;line-height:1.18;margin-bottom:16px}
.about-copy p{color:var(--muted);font-size:15px;margin-bottom:14px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:14px}
.stat{background:var(--ink);border-radius:var(--r-md);padding:20px;text-align:center}
.stat .num{font-family:'Archivo';font-weight:800;font-size:24px;color:var(--ember)}
.stat .lbl{font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:3px}
.cert-note{font-size:12px;color:var(--muted);border-left:3px solid var(--ember);padding:8px 14px;background:var(--white);border-radius:0 8px 8px 0}
/* 案例 */
.works{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.work{background:var(--white);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden;transition:.25s var(--ease)}
.work:hover{transform:translateY(-4px)}
.work-b{padding:18px 24px;display:flex;justify-content:space-between;align-items:center}
.work-b .t{font-weight:600;font-size:15px}.work-b .m{font-size:12px;color:var(--muted);margin-top:2px}
.work-b .arrow{color:var(--ember);font-size:20px}
/* FAQ */
.faq{max-width:820px;margin:0 auto}
details.fqi{background:var(--white);border-radius:var(--r-md);box-shadow:var(--sh-1);margin-bottom:12px;border:1px solid transparent}
details.fqi[open]{border-color:rgba(232,89,12,.4)}
details.fqi summary{cursor:pointer;padding:20px 26px;font-weight:600;font-size:15px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px}
details.fqi summary::-webkit-details-marker{display:none}
details.fqi summary::after{content:'+';font-family:'Archivo';font-size:22px;color:var(--ember);flex-shrink:0}
details.fqi[open] summary::after{content:'−'}
details.fqi .a{padding:0 26px 22px;font-size:14px;color:var(--muted);border-top:1px solid var(--line);padding-top:16px}
/* 联系深色面板 */
.contact-panel{background:var(--ink);border-radius:var(--r-lg);padding:64px;color:#fff;position:relative;overflow:hidden}
.contact-panel::before{content:'';position:absolute;top:-70px;right:-70px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(232,89,12,.22),transparent 70%)}
.cgrid{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;position:relative}
.contact-panel h2{font-family:'Archivo';font-size:34px;font-weight:800}
.contact-panel .sub{color:rgba(255,255,255,.65);font-size:14px;margin:10px 0 30px}
.field{margin-bottom:15px}
.field label{display:block;font-size:12px;font-weight:600;letter-spacing:.5px;color:rgba(255,255,255,.8);margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;padding:13px 15px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:var(--r-sm);color:#fff;font-family:inherit;font-size:14px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ember)}
.field select option{color:var(--ink)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.side-info{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.13);border-radius:var(--r-lg);padding:28px}
.side-info h3{font-family:'Archivo';color:var(--ember);font-size:21px;margin-bottom:16px}
.side-info .row{font-size:14px;margin-bottom:13px}
.side-info .row b{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:2px}
.side-info a{color:var(--ember);text-decoration:none}
.promise{border-left:3px solid var(--ember);padding:10px 16px;font-size:13px;color:rgba(255,255,255,.75);margin-top:18px}
/* 分类页 */
.crumbs{font-size:13px;color:var(--muted);padding:22px 0 0}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--ember)}
.cat-hero{display:grid;grid-template-columns:1fr 1.1fr;gap:52px;align-items:center;padding:46px 0 74px}
.cat-hero h1{font-family:'Archivo';font-weight:800;font-size:clamp(32px,4.4vw,52px);line-height:1.1}
.spec-chips{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 28px}
.spec-chips span{background:var(--white);border:1px solid var(--line);border-radius:8px;padding:9px 16px;font-size:13.5px;font-weight:600;box-shadow:0 1px 2px rgba(17,24,39,.04)}
.spec-chips b{color:var(--ember)}
.gal-cap{font-size:12.5px;color:var(--muted);text-align:center;margin-top:10px}
/* CTA横带 */
.cta-band{background:linear-gradient(115deg,var(--ink) 55%,var(--ember));border-radius:var(--r-lg);color:#fff;padding:56px;display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.cta-band h3{font-family:'Archivo';font-size:28px;font-weight:800}
.cta-band p{color:rgba(255,255,255,.75);margin-top:8px}
/* 页脚 */
footer{border-top:1px solid var(--line);padding:38px 0;font-size:13px;color:var(--muted)}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}
footer b{color:var(--ink)}footer em{font-style:normal;color:var(--ember);font-weight:700}
@media(max-width:900px){.about-grid,.cat-hero,.cgrid{grid-template-columns:1fr}.mosaic{grid-template-columns:repeat(2,1fr)}.mosaic .big{grid-column:span 2;grid-row:auto;min-height:240px}.nav-links{display:none}.sec{padding:64px 0}.contact-panel{padding:36px 24px}.hero{min-height:560px}}

/* ============ 移动端导航修复 ============ */
@media(max-width:900px){
  .nav .wrap{flex-wrap:wrap;height:auto;padding:10px 16px;row-gap:4px}
  .nav .btn{padding:9px 18px;font-size:13px}
  .nav-links{order:3;width:100vw;margin:0 -16px;padding:6px 16px 10px;display:flex;gap:20px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-top:1px solid var(--line)}
  .nav-links::-webkit-scrollbar{display:none}
  .nav-links a{white-space:nowrap;font-size:13.5px}
}
/* ============ 右下角即时通讯悬浮窗 ============ */
.fab-wrap{position:fixed;right:18px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:300;display:flex;flex-direction:column;gap:12px;align-items:flex-end;opacity:0;transform:translateY(16px);transition:.35s var(--ease);pointer-events:none}
.fab-wrap.show{opacity:1;transform:none;pointer-events:auto}
.fab{position:relative;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 10px 26px rgba(17,24,39,.30);transition:transform .2s var(--ease)}
.fab:hover{transform:scale(1.07)}
.fab svg{width:28px;height:28px;fill:#fff}
.fab.wa{background:#25D366}
.fab.mail{background:var(--ink)}.fab.mail svg{width:23px;height:23px}
.fab.wa::before{content:'';position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(37,211,102,.5);animation:fabbreathe 2.6s infinite}
@keyframes fabbreathe{0%{transform:scale(.92);opacity:.85}70%{transform:scale(1.22);opacity:0}100%{transform:scale(1.22);opacity:0}}
@media(prefers-reduced-motion:reduce){.fab.wa::before{animation:none}}
.fab-tip{position:absolute;right:68px;top:50%;transform:translateY(-50%) translateX(6px);background:var(--ink);color:#fff;font-size:12px;font-weight:600;padding:7px 13px;border-radius:8px;white-space:nowrap;opacity:0;transition:.2s var(--ease);pointer-events:none}
.fab:hover .fab-tip{opacity:1;transform:translateY(-50%) translateX(0)}
@media(max-width:600px){.fab-wrap{right:14px;bottom:calc(16px + env(safe-area-inset-bottom,0px))}.fab{width:52px;height:52px}}
/* ============ 移动端体验修复(v2.2) ============ */
html,body{max-width:100%;overflow-x:clip}
img,svg,video{max-width:100%}
/* 修正此前100vw写法可能引发的横向溢出 */
@media(max-width:900px){.nav-links{width:auto;margin:0;padding:6px 0 12px}}
/* 手机端：所有图墙/卡片强制单列，杜绝左右滑动 */
@media(max-width:640px){
  .cards,.steps,.works,.feats,.stats{grid-template-columns:1fr!important}
  .mosaic{grid-template-columns:1fr!important;gap:18px}
  .mosaic .big{grid-column:auto!important;grid-row:auto!important;min-height:250px}
  .g2{grid-template-columns:1fr}
}
/* 手机端禁用入场动画的隐藏态——内容永远直接可见(断层根治) */
@media(max-width:900px){[data-aos]{opacity:1!important;transform:none!important;transition:none!important}}
/* 页脚品类快捷链接 */
.foot-links{margin:4px 0}
.foot-links b{color:var(--ink);font-size:12px;letter-spacing:1px;text-transform:uppercase;margin-right:6px}
.foot-links a{color:var(--muted);text-decoration:none;margin-right:4px}
.foot-links a:hover{color:var(--ember);text-decoration:underline}