/* talkmaker talkmakeer.cn - 对话装配蓝图 · 四色体系: 黑#16130A/白/黄#FAE20C/靛蓝#2B3FE0 */
:root{
  --night:#16130A;
  --panel:#1D1910;
  --yellow:#FAE20C;
  --indigo:#2B3FE0;
  --mist:#F5F2E3;
  --line:#E3DEC8;
  --white:#FFFFFF;
  --ink:#16130A;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;background:var(--night);color:var(--white);line-height:1.7;}
img{max-width:100%;height:auto;display:block;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
[id]{scroll-margin-top:84px;}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0;}

/* ---------- 入场动画 ---------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease;}
.rv.in{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .rv{opacity:1;transform:none;transition:none;}
}

/* ---------- 按钮 ---------- */
.tbtn{display:inline-block;padding:12px 28px;font-size:15px;font-weight:800;border:2px solid var(--ink);line-height:1.4;transition:transform .15s ease;}
.tbtn:hover{transform:translate(2px,2px);}
.tbtn-lg{padding:15px 34px;font-size:17px;}
.tbtn-yellow{background:var(--yellow);color:var(--ink);border-color:var(--ink);}
.tbtn-indigo{background:var(--indigo);color:var(--white);border-color:var(--ink);}
.tbtn-line{background:transparent;color:var(--white);border-color:var(--white);}

/* ---------- 顶栏 ---------- */
.tbar{position:sticky;top:0;z-index:60;background:var(--night);border-bottom:3px solid var(--yellow);}
.tbar-in{display:flex;align-items:center;gap:26px;height:70px;}
.tlogo{display:flex;align-items:center;gap:10px;}
.tlogo img{width:40px;height:40px;object-fit:contain;}
.tlogo-t{display:flex;flex-direction:column;line-height:1.25;}
.tlogo-t strong{font-size:16px;letter-spacing:1px;color:var(--white);}
.tlogo-t small{font-size:11px;color:rgba(255,255,255,.55);}
.tnav{display:flex;gap:22px;margin-left:auto;}
.tnav a{font-size:14px;font-weight:600;color:rgba(255,255,255,.75);padding:6px 2px;border-bottom:3px solid transparent;}
.tnav a.on,.tnav a:hover{color:var(--yellow);border-bottom-color:var(--yellow);}
.tbar-r{display:flex;align-items:center;gap:14px;}
.tbar-cta{padding:9px 22px;font-size:14px;}
.burger{display:none;width:42px;height:42px;border:2px solid var(--yellow);background:var(--night);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;}
.burger span{display:block;width:20px;height:2px;background:var(--yellow);}

/* ---------- 英雄区: 对话装配蓝图 ---------- */
.the{padding:52px 0 64px;background:var(--night);}
.the-in{background:var(--panel);border:2px solid var(--yellow);box-shadow:12px -10px 0 var(--indigo);padding:46px 48px;display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;}
.tkick{font-size:12px;letter-spacing:2px;color:rgba(255,255,255,.6);font-weight:700;margin-bottom:14px;}
.tkick i{font-style:normal;background:var(--yellow);color:var(--ink);padding:3px 9px;margin-right:10px;font-size:10px;letter-spacing:1px;}
.the h1{font-size:52px;font-weight:900;letter-spacing:1px;line-height:1.15;margin-bottom:16px;color:var(--white);}
.the .lead{font-size:15px;line-height:1.95;color:rgba(255,255,255,.82);margin-bottom:24px;}
.the-acts{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:20px;}
.ttags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.ttags li{border:1px solid rgba(255,255,255,.4);padding:5px 13px;font-size:12px;font-weight:600;color:rgba(255,255,255,.85);}
.tnote-line{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.6);}
.tnote-line .sq{width:10px;height:10px;background:var(--yellow);flex:none;}
.the-r{min-width:0;}
.tdesk{position:relative;background:var(--indigo);border:2px solid var(--yellow);padding:58px 34px 34px;min-height:430px;}
.tgrid-svg{position:absolute;inset:0;width:100%;height:100%;}
.tplate{position:absolute;top:12px;left:14px;font-size:10px;letter-spacing:2px;color:rgba(255,255,255,.7);}
.tbench{position:relative;margin:0 auto;width:300px;background:var(--white);border:5px solid var(--yellow);}
.tbench img{width:100%;}
.tbench figcaption{background:var(--night);color:var(--white);font-size:11px;padding:6px 10px;text-align:center;}
.tlabel{position:absolute;background:var(--yellow);color:var(--ink);font-size:11px;font-weight:800;padding:5px 10px;border:2px solid var(--ink);white-space:nowrap;}
.tl-a{top:16%;left:-18px;}
.tl-b{top:46%;right:-18px;}
.tl-c{bottom:20%;left:-18px;}
.tline{position:absolute;border-top:2px dashed rgba(255,255,255,.75);width:64px;}
.line-a{top:24%;left:26px;}
.line-b{bottom:30%;right:26px;}
.tparts{position:absolute;bottom:10px;right:14px;display:flex;gap:8px;}
.tpart{background:var(--white);color:var(--ink);border:2px solid var(--ink);font-size:11px;font-weight:800;padding:4px 8px;}

/* ---------- 区块标题 ---------- */
.tsech{margin-bottom:30px;}
.tsech h2{font-size:29px;font-weight:900;line-height:1.4;margin-bottom:8px;}
.tsech .tsub{font-size:13px;}

/* ---------- 装配手册（浅色） ---------- */
.tfeat{background:var(--white);padding:64px 0;color:var(--ink);}
.tfeat .tsub{color:#6B6420;}
.tcards{background:var(--mist);border:2px solid var(--ink);box-shadow:-10px 8px 0 var(--indigo);padding:26px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.tcard{background:var(--white);border:1px solid var(--line);border-top:6px solid var(--yellow);padding:20px 20px 18px;}
.tcard:nth-child(even){border-top-color:var(--indigo);}
.tc-no{display:inline-block;font-size:11px;font-weight:800;letter-spacing:1px;color:var(--white);background:var(--indigo);padding:2px 9px;margin-bottom:12px;}
.tcard:nth-child(odd) .tc-no{background:var(--ink);}
.tcard h3{font-size:16px;font-weight:800;margin-bottom:8px;line-height:1.5;}
.tcard p{font-size:13px;line-height:1.85;color:#4A4638;}

/* ---------- 数据传送带（深色） ---------- */
.tbelt{background:var(--night);padding:56px 0;}
.tbelt-in{background:#221D0E;border-top:4px solid var(--yellow);border-bottom:4px solid var(--yellow);box-shadow:8px 10px 0 var(--yellow);display:grid;grid-template-columns:repeat(4,1fr);}
.tst{padding:26px 12px;text-align:center;border-left:1px dashed rgba(255,255,255,.22);}
.tst:first-child{border-left:none;}
.tst b{display:block;font-size:30px;font-weight:900;color:var(--yellow);letter-spacing:1px;}
.tst span{font-size:12px;color:rgba(255,255,255,.72);}

/* ---------- 出品车间（浅色） ---------- */
.tshop{background:var(--mist);padding:64px 0;color:var(--ink);}
.tshop .tsub{color:#6B6420;}
.tgal{background:var(--white);border:2px solid var(--ink);box-shadow:10px 10px 0 var(--yellow);padding:22px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.tf{background:var(--white);border:1px solid var(--line);}
.tf .cap{display:block;height:6px;background:var(--yellow);}
.tf:nth-child(even) .cap{background:var(--indigo);}
.tf img{max-width:232px;margin:0 auto;padding:10px 10px 0;}
.tf figcaption{border-top:1px solid var(--line);font-size:12px;font-weight:600;color:#4A4638;padding:8px 12px;}
.twide{margin-top:24px;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:stretch;}
.tnote{background:var(--white);border-left:6px solid var(--indigo);padding:22px;}
.tnote h3{font-size:18px;font-weight:800;margin-bottom:8px;}
.tnote p{font-size:13px;line-height:1.85;color:#4A4638;margin-bottom:14px;}
.twide .tf{display:flex;flex-direction:column;}
.twide .tf figcaption{margin-top:auto;}

/* ---------- 装配五步（深色） ---------- */
.tbuild{background:var(--night);padding:64px 0;}
.tbuild .tsech h2{color:var(--white);}
.tbuild .tsub,.tbuild .tkick{color:rgba(255,255,255,.65);}
.tflow{background:var(--panel);border:2px solid var(--yellow);box-shadow:-8px -8px 0 var(--yellow);padding:26px;display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.tfw{background:var(--white);color:var(--ink);border-top:6px solid var(--indigo);padding:18px 16px;}
.tfw:nth-child(odd){border-top-color:var(--yellow);}
.tfw-no{display:inline-block;background:var(--indigo);color:var(--white);font-size:11px;font-weight:800;padding:2px 9px;margin-bottom:10px;letter-spacing:1px;}
.tfw:nth-child(odd) .tfw-no{background:var(--ink);}
.tfw h3{font-size:15px;font-weight:800;margin-bottom:6px;}
.tfw p{font-size:12.5px;line-height:1.8;color:#4A4638;}

/* ---------- 工坊问答（浅色·侧签） ---------- */
.task{background:var(--white);padding:64px 0;color:var(--ink);}
.task .tsub{color:#6B6420;}
.tbook{background:var(--mist);border:2px solid var(--ink);box-shadow:0 12px 0 var(--yellow);padding:26px;display:grid;grid-template-columns:64px 1fr;gap:22px;align-items:stretch;}
.tbook-tab{background:var(--yellow);border:2px solid var(--ink);display:flex;align-items:center;justify-content:center;}
.tbook-tab span{writing-mode:vertical-rl;font-size:15px;font-weight:900;letter-spacing:8px;color:var(--ink);}
.tq{border:1px solid var(--line);background:var(--white);margin-bottom:14px;}
.tq summary{display:flex;align-items:center;gap:10px;padding:13px 15px;cursor:pointer;list-style:none;font-weight:700;font-size:14px;}
.tq summary::-webkit-details-marker{display:none;}
.tq-no{flex:none;background:var(--indigo);color:var(--white);font-size:11px;font-weight:800;padding:2px 8px;letter-spacing:1px;}
.tq-t{flex:1;}
.tq-x{flex:none;position:relative;width:16px;height:16px;}
.tq-x::before,.tq-x::after{content:"";position:absolute;background:var(--ink);top:50%;left:50%;}
.tq-x::before{width:14px;height:2px;transform:translate(-50%,-50%);}
.tq-x::after{width:2px;height:14px;transform:translate(-50%,-50%);transition:transform .2s ease;}
.tq[open] .tq-x::after{transform:translate(-50%,-50%) rotate(90deg);}
.tq[open] summary{background:var(--mist);border-bottom:1px solid var(--line);}
.tq-a{padding:12px 15px 14px;}
.tq-a p{font-size:13px;line-height:1.9;color:#4A4638;}

/* ---------- 买家回执（浅色） ---------- */
.ttalks{background:var(--mist);padding:64px 0;color:var(--ink);}
.ttalks .tsub{color:#6B6420;}
.tgrid{background:var(--white);border:2px solid var(--ink);box-shadow:12px 6px 0 var(--indigo);padding:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start;}
.tr{background:var(--mist);border:1px solid var(--line);border-top:5px solid var(--yellow);padding:18px 18px 14px;}
.tr.alt{border-top-color:var(--indigo);}
.tr-h{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#6B6420;letter-spacing:1px;margin-bottom:10px;}
.tr-h b{color:var(--indigo);font-size:10px;letter-spacing:2px;}
.tr.alt .tr-h b{color:var(--ink);}
.tr p{font-size:13px;line-height:1.9;color:#332F22;margin-bottom:12px;}
.tr footer{display:flex;justify-content:space-between;align-items:center;font-size:12px;border-top:1px solid var(--line);padding-top:10px;}
.tr footer b{font-weight:700;}
.tr footer time{color:#6B6420;}

/* ---------- 底部CTA（黄底） ---------- */
.tcta{background:var(--yellow);padding:64px 0;}
.tcta-box{background:var(--white);border:2px solid var(--ink);box-shadow:-6px 6px 0 var(--ink);padding:40px 44px;display:flex;align-items:center;gap:34px;}
.tcta-l{flex:1;}
.tcta-sign{font-size:12px;letter-spacing:2px;margin-bottom:10px;color:#6B6420;font-weight:700;}
.tcta-sign .sq{display:inline-block;width:10px;height:10px;background:var(--ink);margin-right:8px;}
.tcta-box h2{font-size:26px;font-weight:900;line-height:1.4;margin-bottom:10px;color:var(--ink);}
.tcta-p{font-size:14px;line-height:1.85;color:#4A4638;}
.tcta-box .tbtn{flex:none;}

/* ---------- 页脚 ---------- */
.tfoot{background:var(--night);color:rgba(255,255,255,.78);border-top:6px solid var(--indigo);padding:36px 0 26px;}
.tfoot-brand{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;color:var(--white);margin-bottom:16px;}
.tfoot-brand img{width:34px;height:34px;object-fit:contain;}
.tfoot-nav{display:flex;flex-wrap:wrap;gap:18px;margin-bottom:16px;}
.tfoot-nav a{font-size:12px;color:rgba(255,255,255,.7);}
.tfoot-nav a:hover{color:var(--yellow);}
.tfoot-icp{font-size:12px;color:rgba(255,255,255,.6);margin-bottom:6px;}
.tfoot-c{font-size:12px;color:rgba(255,255,255,.45);}

/* ---------- 返回顶部 ---------- */
.backtop{position:fixed;right:24px;bottom:20px;width:46px;height:46px;background:var(--yellow);border:2px solid var(--ink);color:var(--ink);font-size:20px;font-weight:900;cursor:pointer;opacity:0;visibility:hidden;transition:opacity .25s ease;z-index:70;}
.backtop.show{opacity:1;visibility:visible;}
.backtop:hover{background:var(--indigo);color:var(--white);}

/* ---------- 移动端 ---------- */
@media (max-width:960px){
  .tnav{position:absolute;top:70px;left:0;right:0;background:var(--night);border-bottom:3px solid var(--yellow);display:none;flex-direction:column;gap:0;padding:8px 0;}
  .tnav.open{display:flex;}
  .tnav a{padding:13px 24px;border-bottom:none;border-left:4px solid transparent;}
  .tnav a.on,.tnav a:hover{border-left-color:var(--yellow);background:var(--panel);}
  .burger{display:flex;}
  .tbar-cta{display:none;}
}
@media (max-width:900px){
  [id]{scroll-margin-top:72px;}
  .the{padding:36px 0 44px;}
  .the-in{grid-template-columns:1fr;padding:30px 22px;gap:34px;box-shadow:9px -8px 0 var(--indigo);}
  .the h1{font-size:38px;}
  .tdesk{padding:46px 18px 40px;min-height:0;}
  .tbench{width:min(300px,78%);}
  .tl-a{left:6px;}
  .tl-b{right:6px;}
  .tl-c{left:6px;}
  .tparts{right:8px;}
  .tbelt-in{grid-template-columns:repeat(2,1fr);}
  .tst:nth-child(3){border-left:none;}
  .tst:nth-child(1),.tst:nth-child(2){border-bottom:1px dashed rgba(255,255,255,.22);}
  .tsech h2{font-size:23px;}
  .tcards{grid-template-columns:1fr;padding:18px;}
  .tgal{display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
  .tf{scroll-snap-align:start;flex:0 0 auto;}
  .twide{grid-template-columns:1fr;}
  .tflow{grid-template-columns:1fr;padding:18px;}
  .tbook{grid-template-columns:1fr;padding:18px;}
  .tbook-tab{padding:10px;}
  .tbook-tab span{writing-mode:horizontal-tb;letter-spacing:6px;}
  .tgrid{grid-template-columns:1fr;padding:18px;}
  .tcta-box{flex-direction:column;align-items:flex-start;padding:30px 24px;}
  .backtop{bottom:142px;right:16px;}
}
@media (max-width:640px){
  .the h1{font-size:32px;}
  .the .lead{font-size:14px;}
  .tbtn-lg{padding:13px 26px;font-size:15px;}
  .tst b{font-size:24px;}
  .tf img{max-width:200px;}
}
