/* ==========================================================
   626519.com — 包豪斯 × 几何分区
   三原色只用红/黄/蓝，不出现任何间色；零圆角零阴影零渐变；
   圆/方/三角是类别标记而非装饰；分区靠大色块与 45° 斜切。
   ========================================================== */
:root{
  --red:#E1251B;
  --yellow:#F2C200;
  --blue:#0B4EA2;
  --ink:#111111;
  --gray:#8A8A8A;
  --soft:#E6E4DF;
  --line:#111111;
  --paper:#FFFFFF;
  --pad:32px;
  --max:1200px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}
body{
  font-family:"Helvetica Neue",Helvetica,Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:var(--paper);color:var(--ink);font-size:15px;line-height:1.7;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
ul{list-style:none}
.bwrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}

/* ---------- 形状标记：圆 / 方 / 三角 = 类别 ---------- */
.bshape{width:14px;height:14px;background:var(--red);display:block;flex:0 0 14px}
.bshape.ci{width:14px;height:14px;border-radius:50%;background:var(--yellow)}
.bshape.tr{width:0;height:0;background:none;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:14px solid var(--blue)}
.bshape.b{background:var(--blue)}.bshape.y{background:var(--yellow)}
.bshape.ci.r{background:var(--red)}.bshape.ci.b{background:var(--blue)}
.bshape.tr.r{border-bottom-color:var(--red)}.bshape.tr.y{border-bottom-color:var(--yellow)}
.bmark{display:flex;align-items:center;gap:10px}
.bmark span{font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:700}

/* ---------- 顶栏 ---------- */
.btri{display:grid;grid-template-columns:1fr 1fr 1fr;height:14px}
.btri i:nth-child(1){background:var(--red)}
.btri i:nth-child(2){background:var(--yellow)}
.btri i:nth-child(3){background:var(--blue)}
.bbar{border-bottom:1px solid var(--line)}
.bbar .in{max-width:var(--max);margin:0 auto;padding:0 var(--pad);height:60px;display:flex;align-items:center}
.bbar .dots{display:flex;gap:4px;margin-right:14px}
.bbar .dots i{width:10px;height:10px;display:block}
.bbar .dots i:nth-child(1){background:var(--red)}
.bbar .dots i:nth-child(2){background:var(--yellow)}
.bbar .dots i:nth-child(3){background:var(--blue)}
.blogo{font-size:16px;font-weight:800;letter-spacing:-.01em;white-space:nowrap}
.bnv{margin-left:auto;display:flex;gap:28px}
.bnv a{font-size:13px;font-weight:600;padding:4px 2px;white-space:nowrap}
.bnv a.on{background:var(--ink);color:#fff}
.bnv a:hover{background:var(--ink);color:#fff}
.breg{margin-left:28px;background:var(--ink);color:#fff;font-size:12px;font-weight:700;padding:9px 20px;letter-spacing:.08em;white-space:nowrap}
.bmb{display:none;margin-left:auto;width:34px;height:34px;background:none;border:1px solid var(--ink);cursor:pointer}
.bmb i{display:block;height:2px;background:var(--ink);margin:5px 7px}
.bmn{display:none;border-bottom:1px solid var(--line)}
.bmn.open{display:block}
.bmn a{display:block;padding:14px var(--pad);font-size:14px;font-weight:600;border-top:1px solid var(--soft)}

/* ---------- 首屏：2/5 黑底 + 3/5 几何构成 ---------- */
.bhero{display:grid;grid-template-columns:2fr 3fr;min-height:420px}
.bhero .bhl{background:var(--ink);color:#fff;padding:60px 44px;display:flex;flex-direction:column;justify-content:center}
.bhero .mk{display:flex;gap:8px;margin-bottom:24px}
.bhero .mk i{width:16px;height:16px;display:block}
.bhero .mk i:nth-child(1){background:var(--blue)}
.bhero .mk i:nth-child(2){background:var(--red);border-radius:50%}
.bhero .mk i:nth-child(3){width:0;height:0;background:none;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:16px solid var(--yellow)}
.bhero h1{font-size:44px;line-height:1.08;font-weight:800;letter-spacing:-.035em}
.bhero h1 em{font-style:normal;color:var(--yellow)}
.bhero .sub{color:rgba(255,255,255,.66);margin-top:20px;font-size:15px;max-width:30em}
.bhero .bs{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}
.bpr{background:var(--red);color:#fff;font-size:13px;font-weight:700;padding:13px 28px;letter-spacing:.06em}
.bse{background:var(--yellow);color:var(--ink);font-size:13px;font-weight:700;padding:13px 28px;letter-spacing:.06em}
.bhr{background:var(--blue);position:relative;overflow:hidden;min-height:300px}
.bhr .big{position:absolute;width:270px;height:270px;border-radius:50%;background:var(--yellow);right:-70px;top:-70px}
.bhr .sqr{position:absolute;width:140px;height:140px;background:var(--paper);left:56px;bottom:64px}
.bhr .tri2{position:absolute;width:0;height:0;border-left:84px solid transparent;border-right:84px solid transparent;border-bottom:146px solid var(--red);right:110px;bottom:36px}
.bhr .cap{position:absolute;left:56px;top:46px;color:#fff}
.bhr .cap b{display:block;font-size:60px;font-weight:800;letter-spacing:-.04em;line-height:1}
.bhr .cap span{font-size:11px;letter-spacing:.24em;text-transform:uppercase}

/* ---------- 分区段落（色块满宽，内容约束居中） ---------- */
.bsec{border-bottom:1px solid var(--line)}
.bsecin{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 3fr}
.bsec .bside{padding:40px 30px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:16px}
.bsec .bside .no{font-size:50px;font-weight:800;letter-spacing:-.05em;line-height:1}
.bsec .bbd{padding:40px 38px}
.bsec .bbd h2{font-size:25px;font-weight:800;letter-spacing:-.02em;line-height:1.28;margin-bottom:14px}
.bsec .bbd p{margin-bottom:12px;max-width:52em}
.bsec .bbd .go{display:inline-block;margin-top:10px;border-bottom:3px solid var(--red);font-weight:700;font-size:14px;padding-bottom:2px}
.bsec.on-yellow{background:var(--yellow);border-color:var(--yellow)}
.bsec.on-yellow .bside{border-color:rgba(17,17,17,.25)}
.bsec.on-yellow .bbd .go{border-color:var(--blue)}
.bsec.on-red{background:var(--red);color:#fff;border-color:var(--red)}
.bsec.on-red .bside{border-color:rgba(255,255,255,.35)}

/* ---------- 四栏索引块 ---------- */
.bintro{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--ink);border:1px solid var(--ink)}

/* ---------- 图片带 ---------- */
.bband{border-bottom:1px solid var(--line)}
.bband .g{display:grid;grid-template-columns:repeat(3,1fr)}
.bband figure{border-right:1px solid var(--line);margin:0}
.bband figure:last-child{border-right:0}
.bband img{width:100%;height:250px;object-fit:cover;display:block}
.bband figcaption{border-top:1px solid var(--soft);padding:14px 18px;font-size:11px;letter-spacing:.14em;color:var(--gray)}

/* ---------- 数据带 ---------- */
.bstats{background:var(--ink);color:#fff}
.bstats .g{display:grid;grid-template-columns:repeat(4,1fr)}
.bstats .it{padding:36px 24px;border-right:1px solid rgba(255,255,255,.18);display:flex;flex-direction:column;gap:14px}
.bstats .it:last-child{border-right:0}
.bstats b{font-size:42px;font-weight:800;letter-spacing:-.045em;line-height:1}
.bstats .lb{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.6)}

/* ---------- FAQ ---------- */
.bfaq{display:grid;grid-template-columns:1fr 3fr}
.bfaq .bside{padding:48px 30px;border-right:1px solid var(--line)}
.bfaq .bside h3{font-size:21px;font-weight:800;letter-spacing:-.02em;line-height:1.3}
.bfaq .bside p{margin-top:12px;color:#444}
.bfaq .list{padding:0 38px}
.bfaq .it{display:grid;grid-template-columns:140px 1fr;gap:26px;padding:26px 0;border-bottom:1px solid var(--soft);align-items:start}
.bfaq .it:first-child{border-top:1px solid var(--soft)}
.bfaq .q{font-size:16px;font-weight:700;line-height:1.5}
.bfaq .a{color:#333}

/* ---------- CTA 45° 斜切 ---------- */
.bcta{background:var(--red);color:#fff;padding:62px 0;clip-path:polygon(0 0,100% 0,100% 84%,0 100%)}
.bcta .in{max-width:var(--max);margin:0 auto;padding:0 var(--pad);display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.bcta h2{font-size:29px;font-weight:800;letter-spacing:-.03em;line-height:1.25;flex:1 1 420px}
.bcta .b2{background:var(--ink);color:#fff;font-size:13px;font-weight:700;padding:14px 30px;letter-spacing:.06em}

/* ---------- 页脚 ---------- */
.bft{border-top:1px solid var(--line);padding:50px 0 32px}
.bft .g{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}
.bft h4{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--gray);margin-bottom:14px}
.bft li{font-size:13px;margin-bottom:8px}
.bft li a:hover{background:var(--ink);color:#fff}
.bft .cp{border-top:1px solid var(--soft);margin-top:38px;padding-top:18px;font-size:12px;color:var(--gray)}

/* ---------- L1：不对称色块网格 ---------- */
.bl1top{padding:54px 0 0}
.bl1top .bcrumb{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gray);font-weight:700}
.bl1top h1{font-size:36px;font-weight:800;letter-spacing:-.03em;margin-top:14px}
.bl1top .sub{margin-top:12px;color:#444;max-width:46em}
.bgrid{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:150px;gap:1px;background:var(--ink);border:1px solid var(--ink);margin-top:34px}
.bcell{background:var(--paper);padding:20px;display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden}
.bcell:hover{background:#F4F2ED}
.bcell .k{font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--gray)}
.bcell h3{font-size:15px;font-weight:700;line-height:1.45}
.bcell .d{position:absolute;left:20px;bottom:16px;font-size:11px;color:var(--gray);letter-spacing:.06em}
.bcell.big{grid-column:span 3;grid-row:span 2}
.bcell.wide{grid-column:span 2}
.bcell.tall{grid-row:span 2}
.bcell.red{background:var(--red);color:#fff}
.bcell.red .k,.bcell.red .d{color:rgba(255,255,255,.75)}
.bcell.yellow{background:var(--yellow)}
.bcell.blue{background:var(--blue);color:#fff}
.bcell.blue .k,.bcell.blue .d{color:rgba(255,255,255,.75)}
.bcell.black{background:var(--ink);color:#fff}
.bcell.black .k,.bcell.black .d{color:rgba(255,255,255,.6)}
.bcell .bcorner{position:absolute;right:-24px;top:-24px;width:76px;height:76px;border-radius:50%;background:rgba(255,255,255,.22)}
.bpager{padding:32px 0;display:flex;gap:20px;font-weight:700}
.bpager a{padding:8px 16px;border:2px solid var(--ink)}
.bpager a.on{background:var(--ink);color:#fff}

/* ---------- L2：色块小节标题 ---------- */
.bart{padding:46px 0 78px}
.bart .bcrumb{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gray);font-weight:700}
.bart h1{font-size:36px;font-weight:800;letter-spacing:-.03em;line-height:1.18;margin-top:14px}
.bmeta{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--ink);border-bottom:1px solid var(--ink);margin-top:24px}
.bmeta span{padding:12px 14px;font-size:12px;color:var(--gray);border-right:1px solid var(--soft)}
.bmeta span:last-child{border-right:0}
.bbody{margin-top:32px}
.bbody p{margin-bottom:16px}
.bbody p.lead{font-size:17px;font-weight:600}
.bh2{display:flex;align-items:stretch;margin:38px 0 18px}
.bh2 .tag{width:62px;background:var(--red);color:#fff;font-size:23px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:0 0 62px}
.bh2 h2{background:var(--ink);color:#fff;font-size:19px;font-weight:800;padding:14px 20px;flex:1;letter-spacing:-.01em;display:flex;align-items:center}
.bh2.y .tag{background:var(--yellow);color:var(--ink)}
.bh2.b .tag{background:var(--blue)}
.bfig{margin:28px 0}
.bfig img{width:100%;height:auto;border:1px solid var(--ink)}
.bfig figcaption{border-top:1px solid var(--ink);margin-top:8px;padding-top:8px;font-size:12px;color:var(--gray)}
.bpull{border-left:8px solid var(--blue);padding:6px 0 6px 18px;margin:24px 0;font-size:17px;font-weight:600}
.brel{margin-top:50px;border-top:2px solid var(--ink);padding-top:22px}
.brel .g{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ink);border:1px solid var(--ink);margin-top:16px}
.brel .c{background:var(--paper);padding:18px;font-size:14px;font-weight:700;line-height:1.5}
.brel .c:hover{background:var(--yellow)}
.bprevnext{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:34px}
.bprevnext a{padding:20px 0;font-size:14px;color:var(--ink)}
.bprevnext a:hover{background:var(--yellow)}
.bprevnext a.nx{text-align:right;border-left:1px solid var(--line);padding-left:22px}
.bprevnext a.pv{padding-right:22px}
.bprevnext span{display:block;font-size:11px;letter-spacing:.24em;color:var(--gray);text-transform:uppercase;margin-bottom:8px;font-weight:700}
.bsame{border-top:1px solid var(--line);margin-top:34px;padding-top:22px}
.bsame li{border-bottom:1px solid var(--soft);padding:12px 0}
.bsame li a{font-size:14px;display:flex;gap:14px}
.bsame li a:hover{background:var(--yellow)}
.bsame li b{font-size:11px;letter-spacing:.2em;color:var(--gray);font-weight:700;flex:0 0 84px;padding-top:3px}

/* ---------- 信任页 / 404 ---------- */
.bpg{padding:56px 0 80px}
.bpg .blbl{font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--gray)}
.bpg h1{font-size:36px;font-weight:800;letter-spacing:-.03em;line-height:1.18;margin-top:14px}
.bpg .main{max-width:760px;margin-top:28px}
.bpg .main h2{font-size:22px;font-weight:800;border-top:2px solid var(--ink);padding-top:20px;margin:38px 0 14px}
.bpg .main p{margin-bottom:14px}
.bpg .err .code{font-size:110px;font-weight:800;letter-spacing:-.06em;line-height:1;margin-top:40px}

/* ---------- 移动端 ---------- */
@media (max-width:900px){
  :root{--pad:20px}
  .bnv,.breg{display:none}
  .bmb{display:block}
  .bhero{grid-template-columns:1fr;min-height:0}
  .bhero .bhl{padding:44px 24px}
  .bhero h1{font-size:32px}
  .bhero .bhr{min-height:220px}
  .bhr .cap{left:24px;top:28px}
  .bhr .cap b{font-size:38px}
  .bhr .sqr{width:96px;height:96px;left:24px;bottom:40px}
  .bhr .tri2{border-left-width:52px;border-right-width:52px;border-bottom-width:92px;right:36px;bottom:22px}
  .bhr .big{width:150px;height:150px}
  .bsecin{grid-template-columns:1fr}
  .bsec .bside{border-right:0;border-bottom:1px solid var(--line);padding:22px var(--pad);flex-direction:row;align-items:center;gap:14px}
  .bsec.on-yellow .bside,.bsec.on-red .bside{border-bottom-color:inherit}
  .bsec .bside .no{font-size:34px}
  .bsec .bbd{padding:26px var(--pad) 34px}
  .bsec .bbd h2{font-size:22px}
  .bintro{grid-template-columns:repeat(2,1fr)}
  .bband .g{grid-template-columns:1fr}
  .bband figure{border-right:0;border-bottom:1px solid var(--line)}
  .bband img{height:190px}
  .bstats .g{grid-template-columns:repeat(2,1fr)}
  .bstats .it{border-right:0;padding:26px 20px}
  .bstats b{font-size:30px}
  .bfaq{grid-template-columns:1fr}
  .bfaq .bside{border-right:0;border-bottom:1px solid var(--line);padding:26px var(--pad)}
  .bfaq .list{padding:0 var(--pad)}
  .bfaq .it{grid-template-columns:1fr;gap:10px}
  .bcta{padding:44px 0;clip-path:polygon(0 0,100% 0,100% 90%,0 100%)}
  .bcta h2{font-size:22px}
  .bft .g{grid-template-columns:1fr 1fr;gap:24px}
  .bl1top{padding:36px 0 0}
  .bl1top h1{font-size:26px}
  .bgrid{grid-template-columns:1fr;grid-auto-rows:auto;margin-top:24px}
  .bcell,.bcell.big,.bcell.wide,.bcell.tall{grid-column:auto;grid-row:auto;min-height:132px;padding:20px 20px 46px}
  .bart h1{font-size:26px}
  .bmeta{grid-template-columns:1fr 1fr}
  .bmeta span{border-bottom:1px solid var(--soft)}
  .bh2 .tag{flex:0 0 48px;width:48px;font-size:19px}
  .bh2 h2{font-size:16px;padding:12px 14px}
  .bprevnext{grid-template-columns:1fr}
  .bprevnext a.nx{text-align:left;border-left:0;border-top:1px solid var(--soft);padding-left:0}
  .brel .g{grid-template-columns:1fr}
  .bsame li a{flex-direction:column;gap:2px}
  .bsame li b{flex:none;padding-top:0}
  .bpg h1{font-size:26px}
  .bpg .err .code{font-size:72px}
}
