/* ===== 来自 T-0004 ===== */
@charset "UTF-8";

/* ==========================================================================
   pages.css —— 内页补充样式（site.css 未覆盖的部分）
   来源页面：T-0004 招商加盟页 /jiameng/

   使用约定：
   1) 本文件必须在 assets/css/site.css 之后引入，复用其设计令牌
      （--brand / --accent / --ink-2 / --line / --radius / --shadow）。
   2) 不修改、不覆盖 site.css 的任何规则；只新增该页需要的结构。
   3) 移动优先，断点沿用 640 / 960 / 1200；不允许出现横向滚动条。

   分节索引：
   §1 面包屑            —— /jiameng/
   §2 加盟条件（编号条）—— /jiameng/ ④
   §3 费用构成（费用项）—— /jiameng/ ⑤
   §4 咨询表单 + 电话卡片 —— /jiameng/ ⑨
   ========================================================================== */

/* ==========================================================================
   §1 面包屑 —— 来源：/jiameng/
   ========================================================================== */
.breadcrumb{
  background:var(--bg);
  border-bottom:1px solid var(--line);
}
.breadcrumb ol{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 8px;
  padding:10px 0;
  font-size:13px;
  color:var(--ink-2);
}
.breadcrumb li{display:inline-flex;align-items:center;gap:8px;}
.breadcrumb li + li::before{
  content:"/";
  color:#C3C8D2;
}
.breadcrumb a{color:var(--ink-2);}
.breadcrumb a:hover{color:var(--brand);}
.breadcrumb [aria-current="page"]{color:var(--ink);font-weight:600;}

/* ==========================================================================
   §2 加盟条件（编号条）—— 来源：/jiameng/ ④
   与 .steps 的区别：编号是固定的 01/02/03 文案，非流程顺序，故单独一套
   ========================================================================== */
.cond-list{display:grid;grid-template-columns:1fr;gap:16px;}
.cond-item{
  position:relative;
  padding:20px 20px 20px 76px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--bg);
  box-shadow:var(--shadow);
}
.cond-no{
  position:absolute;
  left:20px;
  top:20px;
  font-size:20px;
  font-weight:700;
  line-height:1.2;
  color:var(--brand);
  font-variant-numeric:tabular-nums;
}
.cond-item h3{font-size:17px;line-height:1.5;color:var(--ink);}
.cond-item p{margin-top:8px;font-size:15px;color:var(--ink-2);}

@media (min-width:960px){
  .cond-list{grid-template-columns:repeat(3,1fr);gap:20px;}
}

/* ==========================================================================
   §3 费用构成（费用项）—— 来源：/jiameng/ ⑤
   只呈现费用项目，页面不出现任何具体金额
   ========================================================================== */
.fee-list{display:grid;grid-template-columns:1fr;gap:12px;margin-top:20px;}
.fee-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--bg);
}
.fee-item .icon{
  flex:0 0 22px;
  width:22px;
  height:22px;
  margin-top:3px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--brand);
}
.fee-item .icon svg{width:18px;height:18px;fill:currentColor;}
.fee-item span{font-size:15px;color:var(--ink);}
.fee-note{margin-top:16px;padding-top:12px;border-top:1px dashed var(--line);}

@media (min-width:640px){
  .fee-list{grid-template-columns:repeat(2,1fr);gap:16px;}
}
@media (min-width:960px){
  .fee-list{grid-template-columns:repeat(3,1fr);}
}

/* ==========================================================================
   §4 咨询表单 + 电话卡片 —— 来源：/jiameng/ ⑨
   表单为静态呈现，不发起真实请求
   ========================================================================== */
.consult-grid{display:grid;grid-template-columns:1fr;gap:20px;}

.consult-form{
  padding:20px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--bg);
  box-shadow:var(--shadow);
}
.form-grid{display:grid;grid-template-columns:1fr;gap:14px;}

.field{display:flex;flex-direction:column;gap:6px;min-width:0;}
.field-label{font-size:14px;font-weight:600;color:var(--ink);}
.field input,
.field select{
  width:100%;
  min-width:0;              /* grid 子项防溢出，避免窄屏横向滚动 */
  font:inherit;
  font-size:15px;
  line-height:1.6;
  color:var(--ink);
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--bg);
}
.field input::placeholder{color:#9CA3AF;}
.field input:focus-visible,
.field select:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:1px;
  border-color:var(--brand);
}

.radio-row{display:flex;flex-wrap:wrap;gap:8px 20px;padding:8px 0 2px;}
.radio-row label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:15px;
  font-weight:400;
  color:var(--ink);
  cursor:pointer;
}
.radio-row input{width:16px;height:16px;accent-color:var(--brand);}

.form-actions{margin-top:20px;}
.form-actions .btn{width:100%;}
.form-note{margin-top:12px;text-align:center;}

/* 电话卡片 */
.contact-card{
  align-self:start;
  padding:24px 20px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
  color:#FFFFFF;
  box-shadow:var(--shadow);
}
.contact-card h3{
  font-size:15px;
  font-weight:600;
  line-height:1.6;
  color:rgba(255,255,255,.88);
}
.contact-phone{
  display:inline-block;
  margin-top:8px;
  font-size:26px;
  font-weight:700;
  line-height:1.3;
  letter-spacing:.02em;
  color:var(--accent);
  font-variant-numeric:tabular-nums;
}
.contact-phone:hover{text-decoration:none;filter:brightness(1.05);}
.contact-meta{
  display:block;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.24);
  font-size:13px;
  line-height:1.7;
  color:rgba(255,255,255,.88);
}

@media (min-width:640px){
  .form-grid{grid-template-columns:repeat(2,1fr);gap:16px;}
  .form-actions .btn{width:auto;min-width:180px;}
  .form-note{text-align:left;}
}
@media (min-width:960px){
  .consult-grid{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:24px;}
  .consult-form{padding:28px;}
}

/* ===== 来自 T-0005 ===== */
@charset "UTF-8";

/* ==========================================================================
   pages.css —— 内页补充样式（T-0005：服务总览 / 关于我们 / 联系我们）
   说明：只放 site.css 没有的组件。移动优先，断点沿用 640 / 960 / 1200。
   不写死宽度，全部 max-width:100%，避免出现横向滚动条。
   ========================================================================== */

/* ---------- 通用：CTA 条内的按钮行居中（/fuwu/） ---------- */
.cta-bar .btn-row{justify-content:center;margin-top:20px;}
.cta-bar .btn-ghost{border-color:var(--accent);color:var(--accent);}

/* ---------- /guanyu/ 品牌信息定义列表 ---------- */
.brand-dl{
  margin:0;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--bg);
}
.brand-dl dt{
  padding:12px 16px 4px;
  font-size:14px;
  font-weight:600;
  color:var(--ink-2);
}
.brand-dl dd{
  margin:0;
  padding:0 16px 12px;
  font-size:16px;
  color:var(--ink);
  border-bottom:1px solid var(--line);
}
.brand-dl dd:last-of-type{border-bottom:0;}

@media (min-width:640px){
  .brand-dl{grid-template-columns:140px 1fr;align-items:baseline;}
  .brand-dl dt{padding:14px 16px;border-bottom:1px solid var(--line);}
  .brand-dl dd{padding:14px 16px;}
  /* 最后一组去掉分隔线 */
  .brand-dl dt:last-of-type,.brand-dl dd:last-of-type{border-bottom:0;}
}

/* ---------- /guanyu/ 品牌主张引用块 ---------- */
.brand-quote{
  margin:20px 0 0;
  padding:16px 20px;
  border-left:4px solid var(--brand);
  background:rgba(255,255,255,.6);
  font-size:20px;
  line-height:1.55;
  font-weight:700;
  color:var(--brand-dark);
}
.slogan .brand-quote + p{margin-top:12px;}

/* ---------- /guanyu/ 联系方式列表 ---------- */
.contact-list li{
  padding:12px 0;
  border-bottom:1px dashed var(--line);
  font-size:16px;
}
.contact-list li:last-child{border-bottom:0;}
.contact-list a{font-weight:600;}

/* ---------- /lianxi/ 电话卡片 ---------- */
.phone-card{text-align:center;}
.phone-big{
  display:block;
  margin-top:10px;
  font-size:28px;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--brand);
  word-break:break-all;
}
.phone-card p{margin-top:12px;text-align:left;}

/* ---------- /lianxi/ 留言表单 ---------- */
.msg-form{max-width:560px;}
.field{margin-bottom:16px;}
.field label{
  display:block;
  margin-bottom:6px;
  font-size:14px;
  font-weight:600;
  color:var(--ink);
}
.field input,
.field select,
.field textarea{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  padding:10px 12px;
  font:inherit;
  font-size:16px;
  color:var(--ink);
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:var(--radius);
}
.field textarea{resize:vertical;}
.field input:focus,
.field select:focus,
.field textarea:focus{
  outline:3px solid var(--accent);
  outline-offset:1px;
  border-color:var(--brand);
}
.msg-form .btn{width:100%;}
.form-note{margin-top:12px;}

@media (min-width:640px){
  .phone-big{font-size:32px;}
  .msg-form .btn{width:auto;min-width:160px;}
}

/* ===== 来自 T-0006 ===== */
@charset "UTF-8";

/* ==========================================================================
   pages.css —— 内页补充样式（T-0006：门店网络 / 知识库）
   说明：只放 site.css 没有的组件。移动优先，断点沿用 640 / 960 / 1200。
   不写死宽度，全部 max-width:100%，避免出现横向滚动条。
   !! 集成提示：本文件为 T-0006 增量，请与 T-0005 的 pages.css 合并（追加），
      不要整文件覆盖，否则 /guanyu/ /lianxi/ 的样式会丢失。
   ========================================================================== */

/* ---------- 通用：CTA 条内的按钮行居中（/fuwu/、/men-dian/） ---------- */
.cta-bar .btn-row{justify-content:center;margin-top:20px;}
.cta-bar .btn-ghost{border-color:var(--accent);color:var(--accent);}

/* ---------- /men-dian/ 门店卡片 ---------- */
.card .store-city{
  display:inline-block;
  margin-top:0;
  margin-bottom:6px;
  padding:2px 10px;
  background:var(--brand-tint);
  color:var(--brand-dark);
  border-radius:999px;
  font-size:13px;
  font-weight:600;
}
.store-card h3{font-size:18px;}
.store-bays{margin-top:8px;font-size:15px;color:var(--ink);font-weight:600;}
.store-card .store-bays + p{margin-top:6px;}

/* ---------- /men-dian/ CTA 条内的免责小字 ---------- */
.cta-bar .disclaimer{
  display:block;
  margin-top:14px;
  font-size:13px;
  font-weight:400;
  line-height:1.7;
  color:rgba(255,255,255,.86);
}

/* ---------- /zhishi/ 主题区块 ---------- */
.topic + .topic{margin-top:32px;}
.topic-title{
  margin-bottom:14px;
  padding-left:12px;
  border-left:4px solid var(--brand);
  font-size:18px;
  line-height:1.5;
  color:var(--brand-dark);
}
/* 问答标题用 h4，沿用 .faq-item 的 h3 视觉 */
.faq-item h4{
  font-size:16px;
  line-height:1.55;
  color:var(--brand-dark);
}

/* ---------- /zhishi/ 相关服务纯文字链接列表 ---------- */
.link-list{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
}
.link-list li{border-bottom:1px solid var(--line);}
.link-list li:last-child{border-bottom:0;}
.link-list a{
  display:block;
  padding:12px 16px;
  font-size:16px;
}

@media (min-width:640px){
  .link-list{grid-template-columns:repeat(2,1fr);}
  .link-list li:nth-last-child(-n+2){border-bottom:0;}
  .topic-title{font-size:20px;}
}
@media (min-width:960px){
  .topic + .topic{margin-top:40px;}
}
