/* ==========================================================
   管店宝联系我们 - 联系页专项样式（contact.css）
   ------------------------------------------------------------
   2026-09-21 联系页按规范重设计（A 方案）时新建。
   为什么单独一个文件而不是并进 custom.css：
     custom.css 承载的是全站骨架（顶栏/导航/字体），各页通用；
     联系页的板块（多通道联系 / 服务时间 / FAQ / 企业信息）是
     这一页独有的，单独成文件便于后续单独迭代，也便于其它页
     未来复用同一套联系板块时直接引用。
   加载顺序：在 custom.css 之后（同权重时胜出）。
   规范：品牌橙仅用于装饰与图标；正文橙走双色制
        --brand-surface(var(--brand-700, #C25200)) 橙底 / --brand-text(var(--brand-800, #B34700)) 橙字压浅底。
   ========================================================== */


/* ==========================================================
   ① hero 文字色与导语
   ========================================================== */
/* 2026-09-22 头图全站统一（第十八批）：hero 文字改白字 + 深色阴影，
   与拓客/微商城同规格。白字压纯橙 2.58:1，靠阴影撑可读性
   （阴影不计入 WCAG 对比度，用户知情选定；此前深棕字方案因"视觉不协调"废弃）。

   ⚠️⚠️ 2026-10-03 第 1 轮：本规则**推翻上述 09-22 的决定**，回到深棕字。
   原因：白字 2.58:1 是本次审查的硬门槛失败项（正文要 4.5、大字号要 3.0），
   而阴影不计入 WCAG 计算对比度，所以"看着还行"救不了审计结论。橙带底 var(--brand-500, #FF7C1C) 依旧不动。
   分两档：H1 / 大标题 --on-brand（6.16:1）；导语 --on-brand-muted（5.00:1）。见 tokens.css。
   ⚠️ 若观感仍被否，**不要退回白字**（那等于退回门槛失败）；那时走「压深底色保白字」路线
   （底色 → var(--brand-700, #C25200) 时白字 4.63:1 ✓），改的是本区块的 background 而不是文字色。
   本规则同时作用于 misc/faq.html 与 misc/lxgdb.html（两页 .s_motto 都是橙底）。 */
.s_motto.o_colored_level h1,
.s_motto.o_colored_level .display-2-fs,
.s_motto.o_colored_level font {
  color: var(--on-brand, #2E1F14) !important;
  text-shadow: none; }

.s_motto.o_colored_level .contact-hero-sub,
.s_motto.o_colored_level .contact-hero-sub .h4-fs {
  color: var(--on-brand-muted, #4A2A12) !important;
  text-shadow: none; }

.contact-hero-sub { margin-top: 16px; margin-bottom: 0; font-size: var(--fs-hero-sub, 1.25rem); }
.contact-hero-sub .h4-fs { font-weight: 400; }

/* ==========================================================
   ③ 头图副题「不折行」定稿（2026-10-04 用户要求：
      faq / 联系我们两页头图副标题尽量不要换行）
   ----------------------------------------------------------
   折行根因两条，都已处理：
     ① 原 .contact-hero-sub 上的 `max-width: 46em`：em 基数是本元素的 20px，
        实际只给 920px；而副标题文字被 span.h4-fs 包着、桌面按 24px 渲染
        （这两页文案实测宽 1005px / 1026px）→ 桌面必然折两行。该声明已删。
     ② 外层列是 col-lg-10（10/12 列），1366px 屏可用宽度只有约 920px。
        两页 HTML 的 .s_motto 列已改 col-lg-12 → 可用宽度提到 1110~1290px。
     ③ 992~1199px 区间容器仅 960px（可用 930px），24px 档仍临界折行，
        故该区间副题降一档到 --fs-hero-sub(20px)（见下方媒体查询）。
        这一档正是 tokens 为「头图副题」定的档位，与案例页 .cs-hero-sub、
        资讯刊头导语同口径；**≥1200px 仍是 24px，观感未变**。

   实测（用「折行实测器」：static-site-audit skill 的 scripts/measure-lines.html，
        无头 Chrome 跑 14 个屏宽，输出 lines=1 即单行）：
     1280 / 1366 / 1440 / 1600 / 1920 → 24px 档，两页均 1 行 ✓
     1024 / 1100 / 1180 / 1200 → 20px 档，两页均 1 行 ✓
     <992（992 / 900 / 768 / 480 / 390）→ 2~3 行；窄屏必然多行，属预期。
     ⚠️ 视口 992~1009 有个 15px 滚动条窄缝（有效宽落到 977~991 → 容器降到 720px），
        那一段仍会折行，属浏览器滚动条造成的边界情形，不必处理。

   ⚠️ 以后改这两段文案，先按「全角字 ≈ 字号、半角字 ≈ 半字宽」估宽：
     ≥1200px 可容 ≈46 个全角字；992~1199px 可容 ≈46 个全角字（20px 档）。
     超了就会折行 —— 折行本身不报错，但要改文案请先估。
   ⚠️ 这两页的 .s_motto 是橙底，副题的深棕字色在文件顶部（--on-brand-muted），
     与本次排版改动无关，勿混改。 */
@media (min-width: 992px) and (max-width: 1199.98px){
  .contact-hero-sub .h4-fs { font-size: var(--fs-hero-sub, 1.25rem); }
}

/* 面包屑（第 126 批）：联系页已撤出主菜单，导航无选中项，
   可见面包屑承担定位感；字面与页内 JSON-LD BreadcrumbList 逐字一致（管店宝官网 › 联系我们）。
   2026-10-01：样式已抽到 assets/css/crumb.css（全站通用一份，仍是 .case-crumb）。
   本文件原先那份拷贝已删除 —— 链接色的 !important 与文字阴影的来由都记在 crumb.css 里。
   ⚠️ 需要改面包屑规格，改 crumb.css，不要在本文件重新加一份。 */


/* ==========================================================
   ② 板块标题（与全站 h2 档位一致）
   ========================================================== */
.contact-section-title { margin-bottom: 12px; }
.contact-section-title-sm { margin-bottom: 24px; }
.contact-section-lead { margin-bottom: 32px; }


/* ==========================================================
   ③ 多通道联系方式
   ========================================================== */
.contact-row { align-items: flex-start; }

/* 联系项：橙底图标块（与拓客页联系板块同一视觉语言） */
.contact-item { margin-bottom: 28px; }
.s_contact_info .contact-item h3 { display: flex; align-items: center; margin-bottom: 8px; }
.s_contact_info .contact-item h3 .fa {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 32px; height: 32px; border-radius: 8px;
  background: #FFF1E5; color: var(--brand-800, #B34700); font-size: .95rem; margin-right: 10px;
}
.s_contact_info .contact-item p { padding-left: 42px; }

/* 咨询热线：号码即链接，移动端点按直接拨号。
   本板块是 .o_cc1（白底），主题样式 `.o_cc1 a:not(.btn)` 会把橙色接管，
   故四条规则统一补 !important，并把纯橙收紧为双色制。 */
.s_contact_info .contact-phone-link {
  font-size: calc(1.25rem + .5vw); font-weight: 700;
  color: var(--brand-text) !important; text-decoration: none;
}
.s_contact_info .contact-phone-link:hover { color: var(--brand-surface) !important; text-decoration: none; }
.s_contact_info .contact-call-btn {
  display: inline-flex; align-items: center; gap: 6px; margin-left: 42px;
  padding: 6px 18px; border: 1px solid var(--brand-text) !important;
  border-radius: 999px; color: var(--brand-text) !important; background: #fff;
  font-weight: 700; text-decoration: none;
}
.s_contact_info .contact-call-btn:hover { background: var(--brand-surface) !important; color: #fff !important; text-decoration: none; }
/* 2026-10-05：实测 37px 高 < 44px 触控目标 → 触摸端补到 44px（桌面维持原值）。 */
@media (max-width: 991.98px) {
  .s_contact_info .contact-call-btn { min-height: 44px; }
}

/* 说明文字：弱化层级 */
.contact-note { padding-left: 42px; margin-top: 6px; margin-bottom: 0; color: rgba(0, 0, 0, .6); font-size: .9375rem; line-height: 1.6; }
.contact-addr-text { font-weight: 600; }

/* 右侧二维码列 */
.contact-qr-col { text-align: center; }
.s_contact_info .contact-qr-col img.img-fluid {
  width: 100%;
  box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
}
.contact-qr-cap { margin-top: 12px; margin-bottom: 0; color: rgba(0, 0, 0, .6); font-size: .9375rem; }


/* ==========================================================
   ④ 服务时间 / 响应承诺 三联
   ========================================================== */
/* 白底段，与上下（米色联系段 / 米色 FAQ 段）形成分界 */
.s_contact_hours { background-color: #fff; }
.contact-hours-row { row-gap: 28px; }
.contact-hours-cell h3 { margin-bottom: 10px; }
/* 160 批：s_key_benefits 编号式——大序号 1/2/3（品牌橙）+ 细分隔线，替代原小圆角图标 */
.hours-num { display: block; font-size: 2.75rem; font-weight: 700; line-height: 1; color: var(--brand-text); }
.hours-hr { height: 1px; background: rgba(0, 0, 0, .10); margin: 14px 0 16px; }
.contact-hours-cell p { margin-bottom: 4px; }
.contact-hours-cell .contact-note { padding-left: 0; }
.contact-hours-cell a { color: var(--brand-text) !important; text-decoration: none; }
.contact-hours-cell a:hover { color: var(--brand-surface) !important; text-decoration: underline; }


/* ==========================================================
   ⑤ FAQ 手风琴（复用 theme 的 accordion 结构 + 本地 accordion.js）
   ========================================================== */
/* 本板块为 .o_cc2（米色）。accordion 默认描边色偏灰，统一为品牌语言的浅橙分隔 */
.s_faq_collapse .accordion-item { border: 0 !important; border-bottom: 1px solid rgba(0, 0, 0, .08) !important; background: transparent !important; }
.s_faq_collapse .accordion-item:last-child { border-bottom: 0; }
.s_faq_collapse .accordion-button { padding: 16px 0; box-shadow: none !important; font-size: 1rem; background: transparent !important; }  /* 2026-09-26 对齐全站统一基准 */
.s_faq_collapse .accordion-button:not(.collapsed) { color: var(--brand-text) !important; background: transparent; }/* 2026-09-25 第214批：必须 !important——按钮带 .text-reset{color:inherit !important}，否则展开色被压掉 */
.s_faq_collapse .accordion-body { padding: 0 0 16px; }
.s_faq_collapse .accordion-body p { margin-bottom: 8px; }
.s_faq_collapse .accordion-body p:last-child { margin-bottom: 0; }
/* 展开箭头：theme 的 ::after 默认是黑三角，换成品牌橙 */
/* 2026-09-25 第214批：与管店宝微商城页 FAQ 视觉对齐（悬停底色 + 正文加粗小标题品牌色） */
.s_faq_collapse .accordion-button:hover { background: #FFF9F4 !important; }
.s_faq_collapse .accordion-body strong { color: var(--brand-text); }
.s_faq_collapse .accordion-button::after { filter: none; opacity: .55; }


/* ==========================================================
   ⑥ 企业信息正式披露
   ========================================================== */
.s_company_info { background-color: #fff; }
.company-info-card {
  border: 1px solid rgba(0, 0, 0, .08); border-radius: 16px;
  padding: 32px 28px; background: #fff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, .05);
}
/* 160 批：s_features_grid 行形态——「圆角小图标+标签+内容」行替代纯文字表格 */
.company-info-list { list-style: none; margin: 0; padding: 0; }
.company-info-list li { display: flex; align-items: flex-start; padding: 11px 0; }
.company-info-list li + li { border-top: 1px solid rgba(0, 0, 0, .06); }
.company-info-list .fa {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 30px; height: 30px; border-radius: 8px;
  background: #FFF1E5; color: var(--brand-800, #B34700); font-size: .85rem; margin-right: 12px; margin-top: 1px;
}
.company-info-list .ci-label { flex: none; width: 72px; font-weight: 600; color: rgba(0, 0, 0, .6); padding-right: 12px; }
.company-info-list .ci-value { flex: 1; color: rgba(0, 0, 0, .85); min-width: 0; overflow-wrap: break-word; }
.company-info-list .ci-value a { color: var(--brand-text) !important; text-decoration: none; }
.company-info-list .ci-value a:hover { color: var(--brand-surface) !important; text-decoration: underline; }
/* 160 批：新增字形（FontAwesome 字体文件全量在，本页图标集缺的 content 码补这里） */
.fa-building-o:before{content: "\f1ad";}
.fa-calendar:before{content: "\f073";}
.fa-briefcase:before{content: "\f0b1";}
.fa-cube:before{content: "\f1b2";}
.fa-certificate:before{content: "\f0a3";}

.company-info-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
/* 160 批：s_numbers 语言——分隔线 + 数字加大 */
.company-stat { text-align: left; border-top: 1px solid rgba(0, 0, 0, .08); padding-top: 12px; }
.company-stat strong { display: block; font-size: 2.125rem; line-height: 1.2; color: var(--brand-text); }
.company-stat span { display: block; margin-top: 4px; color: rgba(0, 0, 0, .6); font-size: .9375rem; }


/* ==========================================================
   ⑦ 窄屏适配
   ========================================================== */
@media (max-width: 991.98px) {
  .contact-qr-col { margin-top: 32px; }
  .company-info-card { padding: 24px 20px; }
}

@media (max-width: 575.98px) {
  .company-info-stats { grid-template-columns: 1fr; gap: 14px; }
  .s_contact_info .contact-call-btn { margin-left: 0; margin-top: 8px; }
}

/* ===== 移动端间距专项（2026-09-25）：≤767px 大间距降档，首屏露出文案+按钮；桌面端零变化 ===== */
@media (max-width:767px){
  .pt256,.pt192,.pt152,.pt136,.pt104{padding-top:56px !important;}
  .pb256,.pb192,.pb160,.pb136,.pb104{padding-bottom:40px !important;}
  .pt88{padding-top:48px !important;}
  .pb88{padding-bottom:36px !important;}
  .pt64{padding-top:40px !important;} /* 2026-09-26：pt64 原先漏在手机降档名单外，板块交界叠成 128px；收为 40px 后交界 80px */
  .pb64{padding-bottom:40px !important;}
  .s_motto.pt192{padding-top:var(--nav-offset-sm, 104px) !important;} /* 手机头图给固定导航胶囊留出空间 */
  /* 2026-09-26：企业信息右侧 4 组数据卡（15年/25+万/5千万+/200+）+ 小注手机端隐藏（HTML 保留，电脑端照常） */
  .s_company_info .col-lg-5 { display: none; }
  /* 2026-09-26：s_discovery 大标题手机端 39.8px→34px，9 字排版 306px < 345px 保证单行不折行 */
  .s_discovery h2 { font-size: 34px; }
}
.s_faq_collapse .container { padding-left: 24px; padding-right: 24px; }
/* 2026-09-26：FAQ 两列中间间距 30px→48px（左列右 24 + 右列左 24），两侧 24px 不变；仅电脑端两列并排时生效 */
@media (min-width: 992px) {
  .s_faq_collapse .row > .col-lg-6:first-child { padding-right: 24px; }
  .s_faq_collapse .row > .col-lg-6:last-child { padding-left: 24px; }
}
