/* ============================================================
   匠心万众 · 留资增强模块（P0 改造）
   依赖：assets/css/style.css（沿用其 CSS 变量）
   包含：① 页尾留资模块  ② 底部悬浮留资条  ③ 案例小区筛选
        ④ 待补充内容标记（上线前需替换）
   ============================================================ */

/* ---------- ⓿ 待补充标记（红色虚线高亮，内容确认后请连同标记一起替换） ---------- */
.todo{
  display:inline-block;
  padding:1px 8px;
  border:1px dashed #e0a33c;
  border-radius:6px;
  background:#fff8ec;
  color:#a35b0a;
  font-weight:600;
  font-size:.92em;
  line-height:1.6;
}
.todo::before{content:"⟪"; opacity:.6; margin-right:2px;}
.todo::after{content:"⟫"; opacity:.6; margin-left:2px;}
.devnote{
  background:#fff8ec; border:1px dashed #e0a33c; border-radius:12px;
  padding:14px 18px; margin:0 0 22px; font-size:14.5px; color:#8a5a12;
}
.devnote b{color:#a35b0a;}
.devnote ul{margin:8px 0 0; padding-left:20px;}
.devnote li{margin:4px 0;}

/* ---------- ① 页尾留资模块 ---------- */
.lead-cta{
  margin:56px 0 0;
  background:linear-gradient(135deg,var(--brand) 0%,#0a4668 100%);
  position:relative; overflow:hidden;
}
.lead-cta::after{
  content:""; position:absolute; right:-80px; top:-80px; width:280px; height:280px;
  border-radius:50%; background:rgba(255,255,255,.05);
}
.lead-cta-in{
  position:relative; z-index:1;
  display:grid; grid-template-columns:1.05fr .95fr; gap:38px; align-items:center;
  padding:44px 22px;
}
.lead-kicker{
  display:inline-block; font-size:12.5px; letter-spacing:.14em; font-weight:700;
  color:#ffd8b0; background:rgba(255,255,255,.12); border-radius:20px; padding:4px 12px; margin-bottom:14px;
}
.lead-cta h2{color:#fff; font-size:26px; margin-bottom:12px;}
.lead-cta p{color:rgba(255,255,255,.86); font-size:15px; margin-bottom:16px;}
.lead-points{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px 20px;}
.lead-points li{color:rgba(255,255,255,.9); font-size:14px; margin:0;}
.lead-points li::before{content:"✓"; color:#7fd6a8; font-weight:700; margin-right:6px;}

.lead-form{
  background:#fff; border-radius:var(--radius); padding:22px;
  box-shadow:var(--shadow-lg);
}
.lead-form .lf-title{font-size:15px; font-weight:800; color:var(--ink); margin-bottom:4px;}
.lead-form .lf-sub{font-size:13px; color:var(--muted); margin-bottom:14px;}
.lf-row{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px;}
.lead-form .field{
  width:100%; padding:11px 13px; font-size:14.5px; font-family:inherit;
  border:1px solid var(--line); border-radius:9px; background:var(--soft); color:var(--ink);
  outline:none; transition:border-color .15s, background .15s;
}
.lead-form .field:focus{border-color:var(--brand); background:#fff;}
.lead-form select.field{appearance:none; background-image:none; cursor:pointer;}
.lead-form .field.err{border-color:#d13b3b;}
.lf-agree{display:flex; align-items:flex-start; gap:8px; font-size:12.5px; color:var(--ink-2); margin:12px 0 12px; cursor:pointer; line-height:1.6;}
.lf-agree input{margin-top:3px; flex:0 0 auto;}
.lead-form .btn{width:100%; justify-content:center;}
.form-tip{display:none; font-size:13px; color:#d13b3b; margin:8px 0 0;}
.form-tip.show{display:block;}
.form-ok{display:none; margin-top:14px; padding:16px; border-radius:10px; background:var(--brand-soft); font-size:14.5px;}
.form-ok.show{display:flex; gap:10px; align-items:flex-start;}
.form-ok .check{
  flex:0 0 auto; width:22px; height:22px; border-radius:50%; background:#1a9c62; color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700;
}
@media(max-width:860px){
  .lead-cta-in{grid-template-columns:1fr; gap:26px; padding:34px 22px;}
  .lf-row{grid-template-columns:1fr;}
}

/* ---------- ② 底部悬浮留资条 ---------- */
.lead-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  background:rgba(10,40,60,.96); backdrop-filter:blur(8px);
  border-top:1px solid rgba(255,255,255,.12);
  transform:translateY(110%); transition:transform .28s ease;
}
.lead-bar.show{transform:translateY(0);}
.lead-bar-in{
  max-width:var(--max); margin:0 auto; padding:10px 96px 10px 22px;
  display:flex; align-items:center; gap:16px;
}
.lead-bar-txt{flex:1; min-width:0; color:#fff; font-size:14.5px; line-height:1.45;}
.lead-bar-txt b{color:#ffd8b0;}
.lead-bar-txt span{display:block; color:rgba(255,255,255,.7); font-size:12.5px;}
.lead-bar-acts{display:flex; gap:10px; flex:0 0 auto;}
.lead-bar-acts .btn{padding:9px 16px; font-size:14px; white-space:nowrap;}
.lead-bar-acts .btn-ghost{border-color:rgba(255,255,255,.4); color:#fff; background:transparent;}
.lead-bar-acts .btn-ghost:hover{border-color:#fff; color:#fff; background:rgba(255,255,255,.1);}
.lead-bar .lb-close{
  position:absolute; right:14px; top:50%; transform:translateY(-50%);
  background:transparent; border:0; color:rgba(255,255,255,.6); font-size:20px; cursor:pointer; padding:4px 8px;
}
.lead-bar .lb-close:hover{color:#fff;}
@media(max-width:640px){
  .lead-bar-in{padding:9px 60px 9px 16px; gap:10px;}
  .lead-bar-txt{font-size:13.5px;}
  .lead-bar-txt span{display:none;}
  .lead-bar-acts .btn{padding:8px 12px; font-size:13px;}
}

/* ---------- ③ 案例小区筛选 ---------- */
.case-filter{
  background:var(--soft); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px 18px; margin-bottom:26px;
}
.cf-top{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.cf-top h3{font-size:15.5px; margin:0; flex:0 0 auto;}
.cf-input{
  flex:1; min-width:200px; padding:11px 14px; font-size:14.5px; font-family:inherit;
  border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); outline:none;
}
.cf-input:focus{border-color:var(--brand);}
.cf-quick{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px;}
.cf-quick button{
  border:1px solid var(--line); background:#fff; color:var(--ink-2); font-family:inherit;
  font-size:13px; padding:5px 12px; border-radius:18px; cursor:pointer; transition:.15s;
}
.cf-quick button:hover{border-color:var(--brand); color:var(--brand);}
.cf-quick button.on{background:var(--brand); border-color:var(--brand); color:#fff;}
.cf-result{font-size:13.5px; color:var(--muted); margin-top:12px;}
.cf-result b{color:var(--brand);}
.cf-empty{
  display:none; margin-top:14px; padding:18px; background:var(--brand-soft);
  border-radius:10px; font-size:14.5px; color:var(--ink-2);
}
.cf-empty.show{display:block;}
.cf-empty .btn{margin-top:10px;}
.cases .case[hidden]{display:none;}
.grp[hidden]{display:none;}

/* ---------- ④ 报价页：价格表 ---------- */
.price-table{width:100%; border-collapse:collapse; font-size:14.5px; background:#fff;}
.price-table th,.price-table td{padding:12px 14px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top;}
.price-table th{background:var(--soft); font-size:13.5px; font-weight:800; color:var(--ink-2); white-space:nowrap;}
.price-table td:first-child{font-weight:700; white-space:nowrap;}
.price-table tr:last-child td{border-bottom:none;}
.price-note{font-size:13px; color:var(--muted); margin-top:10px;}
.factor-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:8px;}
.factor-grid .fcard{padding:16px;}
@media(max-width:860px){.factor-grid{grid-template-columns:1fr;}}

/* ================= P0 第二轮：工艺标准 / 渠道合作 / 承诺 / 品牌墙 / 首屏数字锚 ================= */
/* 工艺标准条目 */
.stdlist{margin:6px 0 0;}
.std{display:grid; grid-template-columns:54px 1fr; gap:18px; padding:24px 0; border-top:1px solid var(--line);}
.std:first-child{border-top:none; padding-top:6px;}
.std-no{width:48px; height:48px; border-radius:13px; background:var(--brand-soft); color:var(--brand);
  font-size:16.5px; font-weight:800; display:flex; align-items:center; justify-content:center; letter-spacing:-.5px;}
.std-body h3{font-size:17.5px; font-weight:800; margin:0 0 7px; color:var(--ink); letter-spacing:-.2px;}
.std-body p{font-size:15.2px; color:var(--ink-2); margin:0 0 6px; line-height:1.78;}
.std-body .why{font-size:13.8px; color:var(--muted); background:var(--soft); border-left:3px solid var(--line);
  padding:9px 13px; border-radius:0 8px 8px 0; margin:11px 0 0; line-height:1.7;}
.std-fig{margin:13px 0 0; border-radius:10px; overflow:hidden; border:1px solid var(--line); background:#fff; max-width:520px;}
.std-fig img{display:block; width:100%; height:auto;}
.std-fig figcaption{font-size:12.5px; color:var(--muted); padding:8px 13px; background:var(--soft);}
.std-tag{display:inline-block; font-size:12px; font-weight:600; color:var(--warm); background:var(--warm-soft);
  border:1px solid #f2ddcb; border-radius:999px; padding:2px 10px; margin-bottom:7px;}
@media(max-width:640px){ .std{grid-template-columns:40px 1fr; gap:12px; padding:18px 0;} .std-no{width:36px; height:36px; font-size:14px; border-radius:10px;} }

/* 渠道合作：三类身份 */
.roles{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:16px 0 6px;}
.role{background:#fff; border:1px solid var(--line); border-radius:12px; padding:18px 18px 16px; transition:.2s;}
.role:hover{border-color:#bcd6e5; box-shadow:var(--shadow);}
.role .r-ico{font-size:20px; margin-bottom:6px;}
.role h4{font-size:16px; font-weight:800; margin:0 0 4px; color:var(--ink);}
.role .r-sub{font-size:13.2px; color:var(--warm); margin:0 0 10px;}
.role ul{margin:0; padding-left:18px;}
.role li{font-size:14.4px; color:var(--ink-2); margin-bottom:5px; line-height:1.7;}
@media(max-width:860px){ .roles{grid-template-columns:1fr;} }

/* 步骤条 */
.steps{counter-reset:st; margin:16px 0 6px;}
.step{display:grid; grid-template-columns:34px 1fr; gap:14px; padding:14px 0; border-top:1px dashed var(--line);}
.step:first-child{border-top:none;}
.step .s-no{counter-increment:st; width:30px; height:30px; border-radius:50%; background:var(--ink); color:#fff;
  font-size:13.5px; font-weight:700; display:flex; align-items:center; justify-content:center;}
.step .s-no::before{content:counter(st);}
.step h4{font-size:15.6px; font-weight:700; margin:2px 0 4px; color:var(--ink);}
.step p{font-size:14.6px; color:var(--ink-2); margin:0; line-height:1.72;}
@media(max-width:640px){ .step{grid-template-columns:28px 1fr; gap:10px;} .step .s-no{width:26px; height:26px; font-size:12.5px;} }

/* 品牌授权墙 */
.brandwall{display:grid; grid-template-columns:repeat(auto-fill,minmax(126px,1fr)); gap:11px; margin:16px 0 6px;}
.bw{background:#fff; border:1px solid var(--line); border-radius:10px; height:66px;
  display:flex; align-items:center; justify-content:center; padding:10px 12px;}
.bw img{max-width:100%; max-height:42px; object-fit:contain; filter:grayscale(1); opacity:.68; transition:.2s;}
.bw:hover img{filter:none; opacity:1;}

/* 承诺条款 */
.promises{display:grid; grid-template-columns:repeat(2,1fr); gap:13px; margin:16px 0 6px;}
.promise{background:#fff; border:1px solid var(--line); border-left:3px solid var(--warm); border-radius:10px; padding:15px 17px;}
.promise b{display:block; font-size:15.4px; color:var(--ink); margin-bottom:4px;}
.promise span{font-size:14.2px; color:var(--ink-2); line-height:1.7;}
@media(max-width:760px){ .promises{grid-template-columns:1fr;} }

/* 首屏：数字锚 + 二维码 */
.hero-nums{display:flex; flex-wrap:wrap; gap:12px 26px; margin-top:16px;}
.hero-num{display:flex; flex-direction:column; gap:1px;}
.hero-num b{font-size:23px; font-weight:900; color:#fff; letter-spacing:-.6px; line-height:1.1;}
.hero-num b i{font-style:normal; font-size:14px; font-weight:600; margin-left:2px;}
.hero-num span{font-size:12.6px; color:rgba(255,255,255,.80);}
.hero-qr{display:flex; align-items:center; gap:13px; margin-top:16px; padding:10px 13px; max-width:440px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.24); border-radius:13px;}
.hero-qr img{width:64px; height:64px; border-radius:8px; background:#fff; padding:3px; flex:0 0 auto;}
.hero-qr .hq-txt{font-size:13.4px; color:rgba(255,255,255,.92); line-height:1.6;}
.hero-qr .hq-txt b{display:block; font-size:14px; color:#fff; margin-bottom:2px;}
@media(max-width:640px){ .hero-qr{max-width:100%;} .hero-num b{font-size:20px;} }

/* ================= 第三轮：隐藏占位 / 虚化背景 / why配图 / 案例分享 ================= */
/* 暂无素材的占位块：保留代码、暂时隐藏；素材到位后去掉 todo-hide 类即可显示 */
.todo-hide{display:none !important;}

/* 十大系统服务：虚化背景图 */
.sec-blur{position:relative; overflow:hidden;}
.sec-blur::before{content:""; position:absolute; inset:-36px; z-index:0;
  background:url(/assets/img/shots/floor-04.jpg) center/cover no-repeat;
  filter:blur(22px) saturate(1.08) brightness(1.06); opacity:.28; transform:scale(1.06);}
.sec-blur > .wrap{position:relative; z-index:1;}

/* 为什么选择我们：卡片配图 */
.adv-img{display:block; width:calc(100% + 48px); max-width:none; margin:-26px -24px 16px;
  height:148px; object-fit:cover;}

/* 案例分享 */
.btn-share{display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line2);
  background:rgba(255,255,255,.92); color:var(--ink); font-size:13.5px; font-weight:600;
  padding:9px 16px; border-radius:999px; cursor:pointer; transition:.2s; font-family:inherit;}
.btn-share:hover{border-color:var(--brand); color:var(--brand); background:#fff;}
.share-line{margin-top:14px;}
.case-share{position:absolute; top:10px; right:10px; z-index:3; width:34px; height:34px;
  border-radius:50%; border:none; background:rgba(10,25,35,.5); color:#fff; font-size:15px;
  cursor:pointer; display:flex; align-items:center; justify-content:center; opacity:0; transition:.2s;}
.case:hover .case-share{opacity:1;}
.case-share:hover{background:var(--brand);}
@media(hover:none){ .case-share{opacity:1; background:rgba(10,25,35,.55);} }

/* 分享弹层 */
.share-ov{position:fixed; inset:0; z-index:9999; background:rgba(12,28,40,.58);
  display:flex; align-items:center; justify-content:center; padding:20px;}
.share-box{background:#fff; border-radius:16px; padding:26px 24px 20px; max-width:340px; width:100%;
  text-align:center; position:relative; box-shadow:0 24px 70px rgba(0,0,0,.28);}
.share-box h3{font-size:17.5px; margin:0 0 14px; color:var(--ink);}
.share-x{position:absolute; top:10px; right:13px; border:none; background:none; font-size:23px;
  color:var(--muted); cursor:pointer; line-height:1;}
.share-x:hover{color:var(--ink);}
.share-qr{display:flex; justify-content:center; margin-bottom:12px; min-height:180px; align-items:center;}
.share-qr img, .share-qr canvas, .share-qr table{border:1px solid var(--line); border-radius:10px;
  padding:6px; background:#fff;}
.share-tip{font-size:13.4px; color:var(--ink-2); line-height:1.75; margin:0 0 14px;}
.share-url{display:flex; gap:8px;}
.share-url input{flex:1; min-width:0; border:1px solid var(--line); border-radius:8px;
  padding:8px 10px; font-size:12.5px; color:var(--muted);}
.share-url .btn{padding:8px 14px; font-size:13px; white-space:nowrap; border-radius:8px;}
@media(max-width:640px){ .share-box{padding:22px 18px 18px;} }

/* 二维码指向提示 */
.share-host{font-size:12.2px; color:var(--muted); margin:0 0 8px;}
.share-host b{color:var(--ink-2); font-weight:700;}

/* 微信内：右上角「···」引导浮层（微信菜单为微信原生 UI，网页只能引导） */
.wx-guide{position:fixed; inset:0; z-index:9998; background:rgba(8,20,30,.74);}
.wx-guide .wxg-main{
  position:absolute; left:0; right:0; top:96px; padding:0 26px; text-align:center; color:#fff;
}
.wx-guide .wxg-p1{font-size:19px; font-weight:700; margin:0 0 6px;}
.wx-guide .wxg-p1 b{color:#ffd8b0; font-size:22px;}
.wx-guide .wxg-p2{font-size:15px; color:rgba(255,255,255,.86); margin:0 0 22px; line-height:1.7;}
.wx-guide .wxg-p2 i{display:block; font-style:normal; font-size:12.8px;
  color:rgba(255,255,255,.68); margin-top:10px; line-height:1.65;}
.wx-guide .wxg-copy{
  width:100%; max-width:320px; justify-content:center; margin:0 auto 12px; display:flex;
  background:#fff; color:var(--brand); border-color:#fff;
}
.wx-guide .wxg-copy.ok{background:#1a9c62; color:#fff; border-color:#1a9c62;}
.wx-guide .wxg-close{
  display:block; margin:0 auto; background:transparent; border:1px solid rgba(255,255,255,.45);
  color:rgba(255,255,255,.9); font-family:inherit; font-size:13.5px;
  padding:7px 20px; border-radius:999px; cursor:pointer;
}
.wxg-arrow{
  position:absolute; top:52px; right:14px; color:#fff; font-size:34px; line-height:1;
  animation:wxgFloat 1.1s ease-in-out infinite;
  text-shadow:0 2px 10px rgba(0,0,0,.5);
}
.wxg-arrow span{display:inline-block; transform:rotate(-8deg);}
@keyframes wxgFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}
