/* ==========================================================================
   万信物流 · 站点主样式 ｜ 方案 C：工业黄黑
   --------------------------------------------------------------------------
   语言：纸灰底 + 黑块 + 工程黄。粗边框、直角、高字重，模拟运单与站场标识。
   黄色分三层，面积越大越浅：F6EACB（信息条）→ EFD89B（按钮/高亮）→ E2C367（细节）
   ========================================================================== */

:root{
  --paper:      #F1EFEA;
  --white:      #FFFFFF;
  --ink:        #17181A;
  --ink-2:      #3A3A38;
  --muted:      #6E6A60;
  --line:       #17181A;
  --line-2:     #D8D2C4;
  --line-3:     #E5E0D3;

  --yellow:      #EFD89B;
  --yellow-ink:  #E2C367;
  --yellow-pale: #F6EACB;

  --dark:       #17181A;
  --dark-2:     #1D1F22;
  --dark-panel: #222427;
  --dark-line:  #3A3C40;

  --sans: "PingFang SC", "Microsoft YaHei", "Source Han Sans SC", -apple-system, system-ui, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", monospace;

  --wrap: 1200px;
  --gut: 26px;
}

*,*::before,*::after{ box-sizing: border-box; }

html{ -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body{
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.66;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img{ max-width: 100%; display: block; }
a{ color: inherit; text-decoration: none; }
button{ font: inherit; color: inherit; cursor: pointer; }
h1,h2,h3,h4{ margin: 0; line-height: 1.14; letter-spacing: -.03em; font-weight: 800; }
p{ margin: 0; }
ul,ol{ margin: 0; padding: 0; list-style: none; }

.wrap{ width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }

.mono{ font-family: var(--mono); font-size: 11px; letter-spacing: .1em; }
.dim{ color: var(--muted); }

.skip{ position: absolute; left: -9999px; top: 0; z-index: 999; background: var(--ink); color: #fff; padding: 10px 18px; }
.skip:focus{ left: 8px; top: 8px; }

/* ============================ 顶部信息条 ============================ */
.infobar{ background: var(--yellow-pale); border-bottom: 1px solid var(--line); }
.infobar-in{
  display: flex; justify-content: space-between; align-items: center;
  height: 32px; font-size: 12px; font-weight: 600; color: #3B3730;
}
.infobar-in span:last-child{ font-family: var(--mono); font-size: 11.5px; letter-spacing: .01em; }

/* ============================ 主导航 ============================ */
.topbar{
  position: sticky; top: 0; z-index: 60;
  background: var(--white);
  border-bottom: 2px solid var(--line);
}
.topbar-in{ display: flex; align-items: center; gap: 22px; height: 68px; }

.brand{ display: flex; align-items: center; gap: 9px; flex: none; }
.brand-mark{
  width: 34px; height: 34px; flex: none;
  background: var(--ink); color: var(--yellow);
  display: grid; place-items: center;
  font-family: var(--mono); font-size: 13px; font-weight: 700; letter-spacing: -.02em;
}
.brand-txt{ display: flex; flex-direction: column; line-height: 1.1; }
.brand-cn{ font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.brand-en{ font-family: var(--mono); font-size: 9px; letter-spacing: .16em; color: var(--muted); margin-top: 2px; }

.nav{ display: flex; align-items: center; gap: 2px; flex: 1; min-width: 0; }
.nav a{
  flex: none; padding: 8px 10px; font-size: 14.5px; font-weight: 600; color: var(--ink-2);
  border-bottom: 3px solid transparent; white-space: nowrap;
}
.nav a:hover{ background: var(--yellow); border-bottom-color: var(--ink); color: var(--ink); }
.nav a[aria-current="page"]{ color: var(--ink); border-bottom-color: var(--yellow-ink); }

.topbar-tel{
  flex: none; display: flex; align-items: center; gap: 10px;
  background: var(--ink); color: #fff; height: 44px; padding: 0 16px;
  font-family: var(--mono); font-size: 14px; font-weight: 700; letter-spacing: .01em;
}
.topbar-tel small{
  display: block; font-family: var(--sans); font-size: 10px; font-weight: 400;
  letter-spacing: 0; color: rgba(255,255,255,.55); line-height: 1.25;
}
.topbar-tel:hover{ background: #000; }
.topbar-tel .dot{ width: 6px; height: 6px; background: var(--yellow); flex: none; }

/* ============================ HERO（黑块） ============================ */
.hero{ background: var(--dark); color: #fff; padding-top: 54px; }
.hero-in{ display: grid; grid-template-columns: 1.08fr .92fr; gap: 46px; align-items: start; }

.flag{
  display: inline-block; background: var(--yellow); color: var(--ink);
  font-size: 12px; font-weight: 700; letter-spacing: .04em;
  padding: 5px 11px; margin-bottom: 20px;
}
.hero h1{
  font-size: clamp(34px, 4.2vw, 56px);
  font-weight: 800; line-height: 1.1; letter-spacing: -.035em;
}
.hero h1 .hl{
  background: var(--yellow); color: var(--ink);
  display: inline-block; line-height: 1.0; padding: 3px 7px; margin: 0 3px 0 -6px;
}
.lede{ margin-top: 20px; font-size: 16px; line-height: 1.72; color: rgba(255,255,255,.7); max-width: 30em; }
.lede b{ color: #fff; font-weight: 700; }

.hero-acts{ display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.btn-y{
  display: inline-flex; align-items: center; justify-content: center;
  height: 50px; padding: 0 26px;
  background: var(--yellow); color: var(--ink);
  border: 2px solid var(--yellow); font-size: 15px; font-weight: 800;
}
.btn-y:hover{ background: #fff; border-color: #fff; }
.btn-o{
  display: inline-flex; align-items: center; justify-content: center;
  height: 50px; padding: 0 26px;
  background: transparent; color: #fff;
  border: 2px solid rgba(255,255,255,.4); font-size: 15px; font-weight: 700;
}
.btn-o:hover{ background: #fff; color: var(--ink); border-color: #fff; }

/* ---------- 查询面板 ---------- */
.finder{ background: var(--dark-panel); border: 2px solid var(--dark-line); padding: 20px 20px 22px; }
.finder-head{
  display: flex; justify-content: space-between; align-items: baseline;
  padding-bottom: 13px; border-bottom: 1px solid var(--dark-line); margin-bottom: 16px;
}
.finder-head b{ font-size: 15px; font-weight: 700; }
.finder-head .mono{ font-size: 10px; color: rgba(255,255,255,.42); }

.ftabs{ display: flex; flex-wrap: wrap; gap: 0; margin-bottom: 16px; }
.ftab{
  background: none; border: 0; padding: 3px 0; margin-right: 14px;
  font-size: 13px; font-weight: 600; color: rgba(255,255,255,.5);
  border-bottom: 2px solid transparent;
}
.ftab:hover{ color: #fff; }
.ftab.is-on{ color: var(--yellow); border-bottom-color: var(--yellow); }

.fields{ display: grid; grid-template-columns: 1fr 32px 1fr; align-items: end; gap: 8px; }
.field{ display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field .sel-prov{ font-size: 13px !important; height: 38px !important; color: var(--yellow-ink) !important; border-color: var(--yellow) !important; font-weight: 700; }
.field-label{
  display: block; font-family: var(--mono); font-size: 10px; letter-spacing: .1em;
  color: rgba(255,255,255,.45); margin-bottom: 6px;
}
.field select{
  width: 100%; height: 44px; padding: 0 30px 0 11px;
  font-family: var(--sans); font-size: 15px; font-weight: 700; color: #fff;
  background-color: #181A1C;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23888' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center;
  border: 1px solid #45484D; border-radius: 0;
  -webkit-appearance: none; appearance: none;
}
.field select:focus{ outline: 2px solid var(--yellow); outline-offset: -1px; border-color: var(--yellow); }

.swap{
  width: 32px; height: 44px; border: 1px solid #45484D; background: #181A1C;
  color: rgba(255,255,255,.6); font-size: 15px; line-height: 1;
  display: grid; place-items: center;
}
.swap:hover{ color: var(--ink); background: var(--yellow); border-color: var(--yellow); }

.btn-primary{
  display: block; width: 100%; margin-top: 12px; height: 48px;
  background: var(--yellow); color: var(--ink); border: 0;
  font-size: 15.5px; font-weight: 800; letter-spacing: .02em;
}
.btn-primary:hover{ background: #fff; }

.finder-note{ margin-top: 11px; font-size: 12px; color: rgba(255,255,255,.42); line-height: 1.6; }

.result{ margin-top: 14px; border-top: 1px solid var(--dark-line); padding-top: 13px; display: none; }
.result.is-on{ display: block; }
.result-route{ font-size: 14.5px; font-weight: 700; margin-bottom: 10px; color: #fff; }
.result-route span{ color: var(--yellow); margin: 0 5px; }
.result-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--dark-line); }
.result-cell{ background: #181A1C; padding: 9px 10px; }
.result-cell .k{ font-family: var(--mono); font-size: 9.5px; letter-spacing: .06em; color: rgba(255,255,255,.42); white-space: nowrap; }
.result-cell .k i{ font-style: normal; opacity: .9; }
.result-cell .v{ font-family: var(--mono); font-size: 16px; font-weight: 700; margin-top: 3px; color: var(--yellow); white-space: nowrap; }
.result-cta{ display: inline-flex; align-items: center; gap: 5px; margin-top: 11px; font-size: 13px; font-weight: 700; color: var(--yellow); }

.finder-foot{ margin: 16px 0 0; padding-top: 13px; border-top: 1px solid var(--dark-line); display: grid; gap: 6px; }
.finder-foot div{ display: flex; gap: 10px; align-items: baseline; }
.finder-foot dt{ flex: none; width: 26px; font-size: 10px; font-weight: 700; color: var(--yellow); }
.finder-foot dd{ margin: 0; font-size: 12px; color: rgba(255,255,255,.5); line-height: 1.5; }

/* ---------- HERO 底部指标带 ---------- */
.belt{ background: var(--dark-2); border-top: 2px solid var(--yellow); border-bottom: 2px solid var(--line); margin-top: 46px; }
.belt-in{ display: grid; grid-template-columns: repeat(4,1fr); }
.belt-in > div{ padding: 18px 0 20px; border-right: 1px solid var(--dark-line); }
.belt-in > div:last-child{ border-right: 0; }
.belt-in .num{
  display: block; font-family: var(--mono); font-size: 28px; font-weight: 700;
  letter-spacing: -.02em; line-height: 1.1; color: var(--yellow);
}
.belt-in .num i{ font-style: normal; font-size: 13px; color: rgba(255,255,255,.45); margin-left: 3px; }
.belt-in .lbl{ display: block; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.55); margin-top: 4px; }

/* ============================ 结论条 ============================ */
.verdict{ padding: 46px 0 0; }
.verdict-grid{
  display: grid; grid-template-columns: repeat(3,1fr);
  background: var(--white); border: 2px solid var(--line); border-top-width: 4px;
}
.verdict-item{ padding: 22px 24px; border-right: 1px solid var(--line-2); }
.verdict-item:last-child{ border-right: 0; }
.verdict-item .k{
  display: inline-block; background: var(--ink); color: var(--yellow);
  font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .08em;
  padding: 2px 7px; margin-bottom: 10px;
}
.verdict-item p{ font-size: 14.5px; line-height: 1.68; color: var(--ink-2); }
.verdict-item p b{ color: var(--ink); font-weight: 800; }

/* ============================ 区块头 ============================ */
.sec{ padding: 62px 0 0; scroll-margin-top: 84px; }
.contact{ scroll-margin-top: 84px; }
.sec-head{
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 36px; margin-bottom: 26px; padding-bottom: 16px; border-bottom: 2px solid var(--line);
}
.sec-head-l{ max-width: 42em; }
.sec-idx{
  display: inline-block; font-family: var(--mono); font-size: 11px; font-weight: 700;
  letter-spacing: .08em; color: var(--ink); background: var(--yellow);
  padding: 2px 8px; margin-bottom: 12px;
}
.sec-head h2{ font-size: clamp(25px, 3vw, 38px); font-weight: 800; letter-spacing: -.035em; }
.sec-head h2 .hl{ background: var(--yellow); padding: 2px 7px; display: inline-block; line-height: 1.0; margin: 0 2px; }
.sec-head .sub{ margin-top: 10px; font-size: 14.5px; color: var(--ink-2); max-width: 38em; line-height: 1.7; }
.sec-more{
  flex: none; font-size: 13.5px; font-weight: 800; white-space: nowrap;
  background: var(--ink); color: var(--yellow); padding: 9px 16px;
}
.sec-more:hover{ background: var(--yellow); color: var(--ink); }

/* ============================ 业务矩阵 ============================ */
.svc-grid{
  display: grid; grid-template-columns: repeat(5,1fr);
  background: var(--white); border: 2px solid var(--line);
}
.svc{ display: flex; flex-direction: column; padding: 20px 18px 22px; border-right: 2px solid var(--line); min-height: 240px; }
.svc:last-child{ border-right: 0; }
.svc:hover{ background: var(--yellow-pale); }
.svc-id{
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: 10px; font-weight: 700; color: var(--ink);
}
.svc-id .n{ background: var(--ink); color: var(--yellow); padding: 2px 6px; }
.svc-id .flag{ background: var(--yellow-ink); color: var(--ink); padding: 2px 6px; font-size: 9.5px; letter-spacing: .04em; margin: 0; }
.svc h3{ font-size: 18px; font-weight: 800; margin: 13px 0 7px; letter-spacing: -.025em; }
.svc p{ font-size: 13px; line-height: 1.62; color: #5A554A; flex: 1; }
.svc ul{ margin-top: 11px; padding-top: 9px; border-top: 1px solid var(--line-2); }
.svc ul li{ font-size: 12.5px; color: var(--muted); padding: 2px 0 2px 11px; position: relative; }
.svc ul li::before{ content: ""; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: var(--ink); }
.svc-go{ margin-top: 13px; font-size: 12.5px; font-weight: 800; color: var(--ink); display: flex; align-items: center; gap: 5px; }
.svc:hover .svc-go{ text-decoration: underline; text-underline-offset: 3px; }

/* ============================ 热门线路 ============================ */
.city-tabs{ display: flex; flex-wrap: wrap; gap: 0; margin-bottom: 0; border: 2px solid var(--line); border-bottom: 0; background: var(--white); }
.city-tab{
  padding: 10px 18px; border: 0; border-right: 1px solid var(--line-2); background: transparent;
  font-size: 13.5px; font-weight: 700; color: var(--ink-2);
}
.city-tab:hover{ background: var(--yellow-pale); }
.city-tab.is-on{ background: var(--ink); color: var(--yellow); }

.rtable-wrap{ border: 2px solid var(--line); background: var(--white); }
.rtable{ width: 100%; border-collapse: collapse; table-layout: fixed; }
.rtable caption.hp{ display: none; }
.rtable th{
  text-align: left; font-size: 11px; font-weight: 700; letter-spacing: .02em;
  color: var(--ink); background: var(--paper);
  padding: 9px 14px; border-bottom: 2px solid var(--line);
}
.rtable th.num, .rtable td.num{ text-align: right; }
.rtable td{ padding: 11px 14px; border-bottom: 1px solid var(--line-2); font-size: 14px; vertical-align: middle; }
.rtable tr:last-child td{ border-bottom: 0; }
.rtable tr:hover td{ background: var(--yellow-pale); }
.rtable .rt-name{ font-weight: 800; font-size: 15px; letter-spacing: -.02em; }
.rtable .rt-name i{ font-style: normal; color: var(--ink); margin: 0 5px; font-size: 12.5px; }
.rtable .rt-name small{ display: inline; font-weight: 400; font-size: 11.5px; color: var(--muted); margin-left: 9px; letter-spacing: 0; }
.rtable .v{ font-family: var(--mono); font-weight: 700; font-size: 13px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rtable .u{ color: var(--muted); font-size: 11px; }
.rtable .tag{ display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; background: var(--ink); color: var(--yellow); }
.rtable .tag.warn{ background: var(--yellow-ink); color: var(--ink); }

/* ============================ 覆盖网络 ============================ */
.cover-grid{
  display: grid; grid-template-columns: repeat(4,1fr);
  background: var(--white); border: 2px solid var(--line);
}
.cover-col{ padding: 18px 22px 22px 0; border-right: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); }
.cover-col:nth-child(4){ border-right: 0; }
.cover-col:nth-child(n+5){ border-bottom: 0; }
.cover-col h4{
  font-family: var(--mono); font-size: 10.5px; font-weight: 700; letter-spacing: .08em;
  color: var(--ink); margin-bottom: 10px;
}
.cover-col h4 b{ font-weight: 800; letter-spacing: .04em; }
.cover-list{ display: flex; flex-wrap: wrap; gap: 1px 0; }
.cover-list a{ display: inline-flex; align-items: baseline; gap: 4px; font-size: 14px; padding: 3px 16px 3px 0; color: var(--ink-2); }
.cover-list a:hover{ background: var(--yellow); color: var(--ink); }
.cover-list a span{ font-family: var(--mono); font-size: 10.5px; color: var(--muted); }
.cover-note{ padding: 18px 0 22px 22px; display: flex; flex-direction: column; justify-content: center; }
.cover-note strong{ font-family: var(--mono); font-size: 32px; font-weight: 700; line-height: 1; color: var(--ink); margin: 6px 0; }
.cover-note p{ font-size: 12px; color: var(--muted); line-height: 1.6; }

/* ============================ 服务流程 ============================ */
.flow{ display: grid; grid-template-columns: repeat(4,1fr); border-top: 2px solid var(--line); background: var(--white); border-left: 2px solid var(--line); border-right: 2px solid var(--line); border-bottom: 2px solid var(--line); }
.flow-step{ padding: 20px 24px 24px 20px; border-right: 1px solid var(--line-2); }
.flow-step:last-child{ border-right: 0; }
.flow-dot{
  width: 30px; height: 30px; background: var(--ink); color: var(--yellow);
  display: grid; place-items: center;
  font-family: var(--mono); font-size: 12px; font-weight: 700; margin-bottom: 13px;
}
.flow-step:first-child .flow-dot{ background: var(--yellow); color: var(--ink); }
.flow-step h4{ font-size: 16px; font-weight: 800; margin-bottom: 5px; }
.flow-step p{ font-size: 13.5px; color: var(--ink-2); line-height: 1.66; }

/* ============================ 优势 ============================ */
.why-grid{
  display: grid; grid-template-columns: repeat(2,1fr);
  border: 2px solid var(--line); background: var(--white);
}
.why-item{ display: grid; grid-template-columns: 48px 1fr; gap: 14px; padding: 22px 26px; border-bottom: 1px solid var(--line-2); border-right: 1px solid var(--line-2); }
.why-item:nth-child(even){ border-right: 0; }
.why-item:nth-child(n+3){ border-bottom: 0; }
.why-n{ font-family: var(--mono); font-size: 20px; font-weight: 700; color: var(--ink); line-height: 1.1; }
.why-item h4{ font-size: 16px; font-weight: 800; margin-bottom: 5px; }
.why-item p{ font-size: 14px; color: var(--ink-2); line-height: 1.7; }

/* ============================ FAQ ============================ */
.faq{ border: 2px solid var(--line); background: var(--white); }
.faq details{ border-bottom: 1px solid var(--line-2); }
.faq details:last-child{ border-bottom: 0; }
.faq summary{
  list-style: none; cursor: pointer; padding: 17px 60px 17px 18px; position: relative;
  font-size: 15.5px; font-weight: 700; letter-spacing: -.01em;
}
.faq summary::-webkit-details-marker{ display: none; }
.faq summary::after{
  content: "+"; position: absolute; right: 0; top: 0; bottom: 0; width: 46px;
  display: flex; align-items: center; justify-content: center;
  background: var(--yellow); color: var(--ink);
  font-family: var(--mono); font-size: 17px; font-weight: 700; border-left: 1px solid var(--line-2);
  line-height: 1;
}
.faq details[open] summary::after{ content: "–"; background: var(--ink); color: var(--yellow); }
.faq summary:hover{ background: var(--yellow-pale); }
.faq .a{ padding: 0 60px 20px 18px; font-size: 14.5px; color: var(--ink-2); line-height: 1.78; }
.faq .a b{ color: var(--ink); font-weight: 800; }

/* ============================ 联系（黑块） ============================ */
.contact{ margin-top: 62px; background: var(--dark); color: #fff; padding: 52px 0 56px; }
.contact-in{ display: grid; grid-template-columns: 1fr 1.05fr; gap: 54px; }
.contact h2{ font-size: clamp(26px,3.2vw,40px); font-weight: 800; letter-spacing: -.035em; }
.contact h2 .hl{ background: var(--yellow); color: var(--ink); padding: 2px 7px; display: inline-block; line-height: 1.0; margin: 0 2px; }
.contact .sub{ margin-top: 14px; font-size: 14.5px; color: rgba(255,255,255,.65); line-height: 1.7; }

.contact-facts{ margin-top: 26px; border-top: 1px solid var(--dark-line); }
.contact-facts div{ display: flex; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--dark-line); font-size: 13.5px; }
.contact-facts dt{ flex: none; width: 74px; font-size: 11px; font-weight: 700; color: rgba(255,255,255,.42); padding-top: 2px; }
.contact-facts dd{ margin: 0; color: rgba(255,255,255,.9); }

.contact-tel{ display: inline-flex; align-items: baseline; gap: 10px; margin-top: 22px; font-family: var(--mono); font-size: 24px; font-weight: 700; color: var(--yellow); }
.contact-tel span{ font-family: var(--sans); font-size: 12px; font-weight: 400; color: rgba(255,255,255,.45); }
.contact-tel:hover{ color: #fff; }

.form-card{ background: var(--dark-panel); border: 2px solid var(--dark-line); padding: 24px 24px 26px; }
.form-card .fh{ display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--dark-line); }
.form-card .fh strong{ font-size: 15.5px; font-weight: 800; }
.form-card .fh span{ font-family: var(--mono); font-size: 10px; color: rgba(255,255,255,.4); }

.frow{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.flabel{ display: block; margin-bottom: 12px; }
.flabel span{ display: block; font-size: 12px; color: rgba(255,255,255,.55); margin-bottom: 5px; }
.flabel span i{ color: var(--yellow); font-style: normal; }
.flabel input, .flabel textarea{
  width: 100%; background: #181A1C; border: 1px solid #45484D; border-radius: 0;
  padding: 10px 11px; font-family: var(--sans); font-size: 14.5px; color: #fff;
}
.flabel textarea{ resize: vertical; min-height: 76px; line-height: 1.6; }
.flabel input::placeholder, .flabel textarea::placeholder{ color: rgba(255,255,255,.38); }
.flabel input:focus, .flabel textarea:focus{ outline: none; border-color: var(--yellow); background: #1B1D1F; }
.hp{ position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

.btn-light{
  width: 100%; height: 48px; background: var(--yellow); color: var(--ink); border: 0;
  font-size: 15px; font-weight: 800; margin-top: 2px;
}
.btn-light:hover{ background: #fff; }
.form-note{ margin-top: 10px; font-size: 11.5px; color: rgba(255,255,255,.38); line-height: 1.6; }
.form-err{ color: var(--yellow); font-size: 12.5px; margin-top: 8px; display: none; }
.form-err.on{ display: block; }

/* ============================ 页脚 ============================ */
.footer{ background: #0D0E10; color: rgba(255,255,255,.58); padding: 46px 0 0; font-size: 13.5px; border-top: 1px solid rgba(255,255,255,.14); }
.footer-top{ display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 34px; padding-bottom: 34px; }
.footer h5{ font-size: 12px; font-weight: 800; letter-spacing: .04em; color: var(--yellow); margin-bottom: 12px; }
.footer ul li{ padding: 3px 0; }
.footer a:hover{ color: #fff; }
.footer .brand{ margin-bottom: 12px; }
.footer .brand-mark{ background: var(--yellow); color: var(--ink); }
.footer .brand-cn{ color: #fff; }
.footer .brand-en{ color: rgba(255,255,255,.4); }
.footer .about{ line-height: 1.75; max-width: 26em; color: rgba(255,255,255,.5); }
.footer-bot{
  border-top: 1px solid rgba(255,255,255,.12); padding: 16px 0 24px;
  display: flex; flex-wrap: wrap; gap: 10px 22px; justify-content: space-between;
  font-size: 12.5px; color: rgba(255,255,255,.5);
}
.footer-bot .mono{ font-size: 10.5px; letter-spacing: .06em; }

/* ============================ 移动端底部三键 ============================ */
.mbar{ display: none; }
.mbar-in{
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
  display: grid; grid-template-columns: repeat(3,1fr);
  background: var(--white); border-top: 2px solid var(--line);
  padding-bottom: env(safe-area-inset-bottom);
}
.mbar button{
  background: none; border: 0; border-right: 1px solid var(--line-2);
  padding: 9px 0 8px; display: flex; flex-direction: column; align-items: center; gap: 3px;
  font-size: 11.5px; font-weight: 700; color: var(--ink);
}
.mbar button:last-child{ border-right: 0; }
.mbar button svg{ width: 19px; height: 19px; stroke: var(--ink); fill: none; stroke-width: 1.8; }
.mbar button:first-child{ background: var(--yellow); }

/* ============================ 弹层 ============================ */
.modal{
  position: fixed; inset: 0; z-index: 200; display: none;
  align-items: center; justify-content: center; padding: 20px;
  background: rgba(15,16,18,.62);
}
.modal.is-on{ display: flex; }
.modal-box{
  background: var(--white); width: 100%; max-width: 380px; padding: 22px;
  border: 2px solid var(--line); border-top: 6px solid var(--yellow);
  position: relative;
}
.modal-box h3{ font-size: 18px; font-weight: 800; margin-bottom: 3px; }
.modal-box .mh{ font-size: 13px; color: var(--muted); margin-bottom: 16px; }
.modal-close{
  position: absolute; right: 0; top: 6px; width: 38px; height: 38px;
  background: var(--ink); color: var(--yellow); border: 0; font-size: 20px; line-height: 1;
}
.modal-close:hover{ background: #000; }
.qr{ width: 100%; aspect-ratio: 1; background: var(--paper); border: 1px solid var(--line-2); display: grid; place-items: center; text-align: center; padding: 14px; }
.qr img{ width: 100%; height: 100%; object-fit: contain; }
.qr-ph{ font-family: var(--mono); font-size: 10px; letter-spacing: .08em; color: var(--muted); line-height: 1.9; }
.wx-id{ display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding: 10px 12px; background: var(--paper); border: 1px solid var(--line-2); }
.wx-id b{ font-family: var(--mono); font-size: 15px; letter-spacing: .02em; }
.wx-acts{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }
.wx-acts a, .wx-acts button{
  display: flex; align-items: center; justify-content: center; gap: 6px;
  height: 40px; border: 1px solid var(--line); background: var(--white);
  font-size: 13px; font-weight: 700; color: var(--ink);
}
.wx-acts button:hover, .wx-acts a:hover{ background: var(--yellow); }
.wx-acts svg{ width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 1.8; }

.mq-form .flabel span{ color: var(--muted); }
.mq-form .flabel span i{ color: var(--ink); }
.mq-form .flabel input, .mq-form .flabel textarea{ background: var(--white); border-color: var(--line); color: var(--ink); }
.mq-form .flabel input::placeholder, .mq-form .flabel textarea::placeholder{ color: #A9A498; }
.mq-form .flabel input:focus, .mq-form .flabel textarea:focus{ border-color: var(--ink); background: var(--white); }
.mq-form .btn-primary{ margin-top: 4px; background: var(--ink); color: var(--yellow); }
.mq-form .btn-primary:hover{ background: #000; }

.toast{
  position: fixed; left: 50%; bottom: 90px; transform: translate(-50%, 12px);
  background: var(--ink); color: var(--yellow); font-size: 13.5px; font-weight: 700;
  padding: 10px 20px; z-index: 300; opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s;
}
.toast.is-on{ opacity: 1; transform: translate(-50%, 0); }

/* ============================ 响应式 ============================ */
@media (max-width: 1080px){
  :root{ --gut: 22px; }
  .hero-in{ gap: 32px; }
  .svc-grid{ grid-template-columns: repeat(2,1fr); }
  .svc{ min-height: 0; border-bottom: 2px solid var(--line); }
  .svc:nth-child(2n){ border-right: 0; }
  .svc:nth-child(n+5){ border-bottom: 0; }
  .cover-grid{ grid-template-columns: repeat(2,1fr); }
  .cover-col:nth-child(2n){ border-right: 0; }
  .cover-col:nth-child(n+5){ border-bottom: 1px solid var(--line-2); }
  .topbar-tel{ display: none; }
}

@media (max-width: 900px){
  .topbar{ position: static; }
  .topbar-in{ flex-wrap: wrap; height: auto; padding-top: 10px; gap: 0; }
  .brand{ margin-right: auto; }
  .nav{ order: 3; width: 100%; flex: 1 0 100%; flex-wrap: wrap; gap: 0 2px; padding: 2px 0 8px; overflow: visible; }
  .nav a{ font-size: 13px; padding: 6px 8px; }
  .infobar-in span:last-child{ display: none; }

  .hero{ padding-top: 34px; }
  .hero-in{ grid-template-columns: 1fr; gap: 28px; }
  .hero h1{ font-size: clamp(30px, 7.4vw, 44px); }
  .belt{ margin-top: 32px; }
  .belt-in{ grid-template-columns: 1fr 1fr; }
  .belt-in > div{ border-bottom: 1px solid var(--dark-line); }
  .belt-in > div:nth-child(2n){ border-right: 0; }
  .belt-in > div:nth-child(n+3){ border-bottom: 0; }

  .verdict-grid{ grid-template-columns: 1fr; }
  .verdict-item{ border-right: 0; border-bottom: 1px solid var(--line-2); }
  .verdict-item:last-child{ border-bottom: 0; }

  .sec{ padding-top: 46px; }
  .sec-head{ flex-direction: column; align-items: flex-start; gap: 12px; }
  .svc-grid{ grid-template-columns: 1fr 1fr; }
  .cover-grid{ grid-template-columns: 1fr 1fr; }
  .flow{ grid-template-columns: 1fr 1fr; }
  .flow-step{ border-bottom: 1px solid var(--line-2); }
  .flow-step:nth-child(2n){ border-right: 0; }
  .flow-step:nth-child(n+3){ border-bottom: 0; }
  .why-grid{ grid-template-columns: 1fr; }
  .why-item{ border-right: 0; }
  .why-item:nth-child(n+3){ border-bottom: 1px solid var(--line-2); }
  .why-item:last-child{ border-bottom: 0; }
  .contact-in{ grid-template-columns: 1fr; gap: 30px; }
  .contact{ padding: 38px 0 44px; margin-top: 46px; }
  .footer-top{ grid-template-columns: 1fr 1fr; gap: 26px; }
  .mbar{ display: block; }
  body{ padding-bottom: 62px; }
  .toast{ bottom: 76px; }
}

@media (max-width: 760px){
  .rtable thead{ display: none; }
  .rtable, .rtable tbody, .rtable tr, .rtable td{ display: block; width: 100%; }
  .rtable tr{ padding: 12px 13px 10px; border-bottom: 1px solid var(--line-2); }
  .rtable td{ display: flex; justify-content: flex-end; align-items: baseline; gap: 4px; padding: 3px 0; border: 0; text-align: right !important; }
  .rtable td::before{ content: attr(data-l); margin-right: auto; font-size: 11px; font-weight: 600; color: var(--muted); }
  .rtable td.rt-cell-name{ display: block; text-align: left !important; padding-bottom: 8px; margin-bottom: 5px; border-bottom: 1px dashed var(--line-2); }
  .rtable td.rt-cell-name::before{ display: none; }
  .city-tabs{ border-bottom: 2px solid var(--line); display: grid; grid-template-columns: repeat(5,1fr); }
  .city-tab{ border-bottom: 1px solid var(--line-2); text-align: center; padding: 10px 2px; font-size: 12.5px; }
}

@media (max-width: 560px){
  :root{ --gut: 16px; }
  .svc-grid{ grid-template-columns: 1fr; }
  .svc{ border-right: 0; }
  .cover-grid{ grid-template-columns: 1fr; }
  .cover-col{ border-right: 0; padding: 14px 0 16px; }
  .cover-note{ padding: 14px 0 18px; }
  .flow{ grid-template-columns: 1fr; }
  .flow-step{ border-right: 0; }
  .fields{ grid-template-columns: 1fr 30px 1fr; gap: 6px; }
  .swap{ width: 30px; height: 42px; }
  .field select{ height: 42px; font-size: 14px; padding-right: 26px; }
  .ftabs{ display: grid; grid-template-columns: repeat(5,1fr); }
  .ftab{ margin-right: 0; font-size: 12px; text-align: left; }
  .result-grid{ grid-template-columns: 1fr; }
  .frow{ grid-template-columns: 1fr; }
  .footer-top{ grid-template-columns: 1fr; }
  .hero-acts{ gap: 8px; }
  .hero-acts .btn-y, .hero-acts .btn-o{ flex: 1 1 calc(50% - 4px); padding: 0 8px; font-size: 14px; }
  .belt-in .num{ font-size: 24px; }
}