/* ========================================================== 管店宝资讯 - 增量自定义样式（custom.css） ------------------------------------------------------------ 工作方式：页面以原文件 + theme.min.css 为底， 本文件只放自己的增量样式，在 head 中最后加载（同权重时胜出）。 当前进度：导航已对齐拓客页规范（2026-09-20）， 其余分区（字体/颜色双色制/动效等）随后续批次补齐。 目录： ① 顶栏与导航 —— 固定悬浮 / 移动端汉堡菜单 改样式须知： · theme.min.css 是 Odoo 引擎，不要手改；增量一律写本文件。 · 覆盖 theme.min.css 里带 !important 的规则时，本文件也要带 !important。 ========================================================== */ /* ========================================================== ① 顶栏与导航 ========================================================== */ /* -- 1.1 固定悬浮 ------------------------------------------------ 原文件 header 已带 o_header_fixed 类，但 theme.min.css 里对应规则 依赖 Odoo JS 补偿，本地不生效；这里纯 CSS 补齐（与拓客/收银页同款）。 left/right 必须同时为 0 才能撑满全宽，缺一会被内容宽度收缩。 */ header.o_header_fixed { position: fixed !important; left: 0; right: 0; z-index: 1030; } /* -- 1.2 移动端汉堡菜单（<992px，配合 js/mobile-nav.js）----------- Odoo JS 移除后 offcanvas 抽屉失效，换自研实现（与拓客/收银页同款交互）： 导航胶囊作为定位参照，菜单以下拉卡片浮层展示（避免撑破胶囊圆角）。 菜单项由 JS 从桌面 #top_menu 自动克隆——改菜单只改 HTML 里 #top_menu 一处。 */ .o_header_mobile { position: relative; } /* 汉堡按钮：三条橙色横线，点击后变叉 */ .mobile-nav-toggle { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 10px; background: transparent; border: 0; border-radius: 50%; cursor: pointer; } .mobile-nav-toggle:hover { background: rgba(0, 0, 0, .05); } /* 键盘焦点环（2026-10-03 第 6 轮）：汉堡按钮落在浅底导航胶囊上 → 深橙轮廓 5.50:1 */ .mobile-nav-toggle:focus-visible { outline: 2px solid var(--brand-800, #B34700); outline-offset: 2px; } .mobile-nav-toggle-bar { display: block; width: 100%; height: 2px; border-radius: 2px; background: var(--o-color-2, var(--brand-500, #FF7C1C)); transition: transform .2s ease, opacity .2s ease; } .mobile-nav-toggle[aria-expanded="true"] .mobile-nav-toggle-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); } .mobile-nav-toggle[aria-expanded="true"] .mobile-nav-toggle-bar:nth-child(2) { opacity: 0; } .mobile-nav-toggle[aria-expanded="true"] .mobile-nav-toggle-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } /* 折叠菜单：默认收起；.open 时在胶囊下方弹出白色圆角卡片 */ .mobile-nav-menu { display: none; position: absolute; top: calc(100% + 8px); left: 8px; right: 8px; background: #FFFFFF; border-radius: 24px; box-shadow: 0 8px 24px rgba(0, 0, 0, .15); padding: 8px; margin: 0; z-index: 1040; } .mobile-nav-menu.open { display: flex; flex-direction: column; gap: 2px; } /* ---------- 手机菜单项（2026-10-01 定稿，7 份页面 CSS 同步） ---------- 基座 `.navbar-nav.nav-pills .nav-link`（特异性 0,3,0）会把本页左右内边距压成 1.5rem、圆角打成 10rem， 故本规则补足到 (0,4,0) 直接胜出，不再依赖 !important。 padding 维持 10px 16px：项高 = 10 + 10 + 继承行高 27px（header font-size 1.125rem × body line-height 1.5） ≈ 47px，本就过 44px 触摸门槛。本次改动实质 = 7 页左右内边距统一到 16px + 去掉 !important，高度不变。 */ .mobile-nav-menu.navbar-nav.nav-pills .nav-link { padding: 10px 16px; border-radius: 999px; text-align: center; } /* ---------- 商家管理中心入口（桌面导航最右端，2026-10-01 恢复） ---------- 规格沿用 2026-09-21 定稿：透明底 + 深橙字 + 1px 深橙描边，悬停变深橙底白字 （与价格卡 .btn-pricing 同一套双色制：深橙字压白 5.50:1、白字压深橙 4.67:1，均过 WCAG AA）。 三条成组：菜单先撑满整行，按钮才有空间右推——缺 flex-grow 时 ul 宽度自适应内容， margin-left:auto 没有可分配空间，按钮会紧贴「关于我们」而不靠右。 padding 带 !important：用于压过下方 `header #top_menu > li > .nav-link` 的同属性 !important(28px)。 */ #top_menu { flex-grow: 1; } #top_menu .nav-item-enter { margin-left: auto; } #top_menu .nav-item-enter .nav-link { padding: 6px 18px !important; color: var(--brand-800, #B34700); background: transparent; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--brand-800, #B34700); font-weight: 500; white-space: nowrap; } #top_menu .nav-item-enter .nav-link:hover { background: var(--brand-700, #C25200); color: #FFFFFF; } /* 手机菜单里的同名入口：白面板上保持同款描边，与站内导航项区分（该项是外链，新窗口跳商家后台）。 带 `#top_menu` 前缀的两条不会命中克隆项，故此处按 .mobile-nav-menu 作用域重写。 */ .mobile-nav-menu .nav-item-enter .nav-link { color: var(--brand-800, #B34700); box-shadow: inset 0 0 0 1px var(--brand-800, #B34700); } /* ---------- 字体本地化（图片本地化批次补齐） ---------- */ /* 源 CSS（_files/web.assets_frontend.min.css）的 @font-face 指向官网服务器绝对路径， 本地加载不到 → 图标全消失；这里用本地 fonts/ 副本声明同名家族（本文件后加载优先），图标恢复。 */ @font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'); font-weight: normal; font-style: normal; font-display: block; } /* Poppins 本地化（源 CSS 无 Poppins @font-face，仅 Google @import——已删。 与其它五页同一份 woff2，保证全站字形一致） */ @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; font-display: swap; src: url('../fonts/poppins/poppins-latin-300-normal.woff2') format('woff2'); } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/poppins/poppins-latin-400-normal.woff2') format('woff2'); } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/poppins/poppins-latin-700-normal.woff2') format('woff2'); } /* ===== 活动案例页（2026-09-22 改版） ===== */ #wrapwrap:not(.o_header_overlay) header .nav-item > .nav-link > span { color: inherit !important; } #top_menu .nav-link.active { background: #FFFFFF !important; color: var(--brand-800, #B34700) !important; font-weight: 600 !important; box-shadow: 0 2px 10px rgba(194, 82, 0, .28) !important; } .s_striped_center_top h1, .s_striped_center_top .lead { text-shadow: 0 2px 12px rgba(96, 38, 0, .72); } /* ---------- 筛选区规范 v2（2026-10-01）：一套胶囊 chip 系统，两级尺码 ---------- */ /* 设计规则：同族控件，圆角 / 选中态 / 悬停 / 焦点 / 动效全族一致； 层级只靠两件事区分 —— 尺码（行业 md / 门店 sm）和未选态底色（行业白底浮起 / 门店浅底凹陷）。 行容器用 grid [维度名 | 选项组]：选项换行时在选项列内左对齐，不再顶回维度名下方。 */ .case-filter-row{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:start;max-width:1320px;margin-left:auto;margin-right:auto;scroll-margin-top:90px;} .case-filter-row[hidden]{display:none;}/* grid 会压掉 hidden 属性，行业选「全部」时门店行必须真隐藏 */ /* 20261003 深夜：行业行（.channel-nav）包进 .cf-row-ind 加「行业」标签，与「门店」行同款 两列网格；margin-top 归零沿用 nav 原顶部间距，nav 自身 margin-bottom 16 继续当行距。 */ .cf-row-ind{margin-top:0;} .cf-row-sub{margin-top:12px;} .cf-label{padding-top:10px;font-size:.8125rem;line-height:1;color:#8a7a6a;user-select:none;white-space:nowrap;} .cf-row-sub .cf-label,.cf-row-ind .cf-label{padding-top:9px;} /* 选项组骨架：现在只服务「门店」筛选器 —— 行业行已于 2026-10-02 改成 .channel-nav （文字链导航）搬进页头，不再是筛选器，故这组胶囊样式不再与导航共用。 */ .case-filter-sub{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:8px;scroll-margin-top:90px;}/* 移动端筛选后滚回列表顶部时，不被固定页头压住 */ .case-filter-sub button{font:inherit;border-radius:999px;cursor:pointer;letter-spacing:0;transition:background .15s ease,color .15s ease,border-color .15s ease;} .case-filter-sub button:hover{border-color:var(--brand-700, #C25200);color:var(--brand-800, #B34700);} .case-filter-sub button:focus-visible{outline:2px solid var(--brand-800, #B34700);outline-offset:2px;} .case-filter-sub button[aria-pressed="true"]{background:var(--brand-700, #C25200);border-color:var(--brand-700, #C25200);color:#FFFFFF;font-weight:600;} /* 2026-10-02：门店行成为列表区**唯一**的筛选器，故改用原「一级（白底浮起 + 细边框）」规格。 旧规格是「行业白底 / 门店浅底」两级对比的产物（#F2EAE1 浅底 + 透明边框）， 单独出现在 #f5f2f0 的列表底上几乎看不见 —— 层级对比没了，规格就得跟着换。 */ .case-filter-sub button{font-size:.92rem;line-height:1.4;min-height:34px;padding:6px 16px;border:1px solid #d8cfc4;background:#FFFFFF;color:#3d2b1f;} /* ============================================================ 案例页移动端「门店」筛选抽屉（2026-10-05，方案 A1） 背景：390px 行业页实测 —— 色带 480 + 行业行 136 + 门店行 162 = 网格 top 884px， 首屏 844px 一张卡都看不到（余 −40px）。门店行收起后网格 top 766、首屏余 +78px。 行业行保持可见（8 个换页链接，收进抽屉会削弱 7 个行业页的互链）。 ⚠️ 渐进增强：.cf-drawer-bar / .cf-drawer-mask 默认 hidden，由 case-filter.js 给 .s_cases 加 .is-drawer 后才显形；JS 未跑时不加类，门店行回落平铺老样子。 ⚠️ 桌面端零参与：本块全部在 ≤991.98px 内；bar/mask 另有 hidden 属性兜底， actions 的桌面隐藏靠媒体查询外的兜底规则（见下）。 ============================================================ */ /* 🩸 2026-10-05 补漏（用户截图指出）：.cf-drawer-actions 是抽屉 4 个新元素里 唯一没有 hidden 属性的，此前 display:none 只写在 ≤991.98px 内 → 桌面端把内里的「查看案例」按钮按浏览器默认样式裸渲染在门店行下方。 桌面一律隐藏；移动端显隐仍由下方媒体查询内的 .is-drawer 规则接管。 */ .cf-drawer-actions { display: none; } @media (max-width: 991.98px) { /* ⚠️ display:block 会压掉 hidden 属性（同 .case-pager[hidden] 的坑）， 故非抽屉态一律先兜底隐藏，再按 .is-drawer 显形。 */ .cf-drawer-bar, .cf-drawer-mask { display: none; } .s_cases:not(.is-drawer) .cf-drawer-bar, .s_cases:not(.is-drawer) .cf-drawer-mask { display: none !important; } /* —— 状态栏（一行 44px，替代原 162px 的门店行占位）—— */ .s_cases.is-drawer .cf-drawer-bar { display: block; margin-top: 12px; } .cf-drawer-toggle { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 0 14px; border: 1px solid #d8cfc4; border-radius: 10px; background: #FFFFFF; color: #3d2b1f; font: inherit; font-size: .92rem; cursor: pointer; -webkit-tap-highlight-color: transparent; } .cf-drawer-toggle-txt { color: #8a7a6a; font-size: .8125rem; } .cf-drawer-sum { margin-left: auto; font-weight: 600; color: var(--brand-800, #B34700); } .cf-drawer-chev { color: #8a7a6a; transition: transform .2s ease; } .cf-drawer-toggle[aria-expanded="true"] .cf-drawer-chev { transform: rotate(180deg); } /* —— 门店行 → fixed 底部抽屉 —— */ .s_cases.is-drawer .cf-row-sub { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1050; display: block; margin: 0; max-height: 76vh; overflow-y: auto; overscroll-behavior: contain; padding: 0 0 76px; background: #FFFFFF; border-radius: 16px 16px 0 0; box-shadow: 0 -8px 30px rgba(61, 43, 31, .18); transform: translateY(100%); transition: transform .24s ease; visibility: hidden; } .s_cases.is-drawer .cf-row-sub.is-open { transform: translateY(0); visibility: visible; } /* 抽屉内：标签行吸顶 */ .s_cases.is-drawer .cf-row-sub .cf-label { display: block; padding: 16px 20px 4px; line-height: 1.4; font-size: .875rem; font-weight: 600; color: #2E1F14; } .s_cases.is-drawer .cf-row-sub .case-filter-sub { padding: 8px 20px 16px; gap: 10px; } /* 抽屉内胶囊恢复 44px 触控高度（平铺态 34px 是为省版面） */ .s_cases.is-drawer .cf-row-sub .case-filter-sub button { min-height: 44px; padding: 8px 18px; } /* —— 吸底确认按钮 —— */ .cf-drawer-actions { display: none; } .s_cases.is-drawer .cf-drawer-actions { display: block; position: fixed; left: 0; right: 0; bottom: 0; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px)); background: #FFFFFF; border-top: 1px solid #F1E5D8; } .cf-drawer-done { display: block; width: 100%; min-height: 44px; border: 0; border-radius: 999px; background: var(--brand-700, #C25200); color: #FFFFFF; font: inherit; font-size: .9375rem; font-weight: 600; cursor: pointer; } /* —— 遮罩（必须是 .cf-row-sub 的紧后兄弟）—— */ .s_cases.is-drawer .cf-drawer-mask { display: block; position: fixed; inset: 0; z-index: 1045; background: rgba(46, 31, 20, .42); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; } .s_cases.is-drawer .cf-drawer-mask.is-open { opacity: 1; visibility: visible; } } .case-empty{display:none;max-width:1320px;margin:26px auto 0;padding:26px 20px;background:#FFFFFF;border:1px dashed #d8cfc4;border-radius:12px;text-align:center;color:#6b5b4d;} .case-empty.is-visible{display:block;} .case-empty a{color:var(--brand-800, #B34700);} /* 公众号图文案例卡 + 翻页（第 69 批，仿原资讯卡） */ .post-grid{display:grid;grid-template-columns:1fr;gap:26px;max-width:1320px;margin:30px auto 0;scroll-margin-top:120px;}/* 翻页/筛选后滚回列表顶端时，不被 fixed 页头压住 */ @media (min-width:768px){.post-grid{grid-template-columns:1fr 1fr;}} @media (min-width:1200px){.post-grid{grid-template-columns:1fr 1fr 1fr;}} .post-card{position:relative;background:#FFFFFF;border-radius:12px;overflow:hidden;box-shadow:0 2px 10px rgba(61,43,31,.08);transition:transform .15s,box-shadow .15s;} .post-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(61,43,31,.14);} .post-card.is-hidden{display:none;} .post-cover{line-height:0;} .post-cover img{width:100%;height:auto;display:block;aspect-ratio:2.35/1;object-fit:cover;} .post-title{font-size:1.05rem;font-weight:600;line-height:1.5;margin:14px 16px 8px;color:#3d2b1f;} .post-digest{margin:0 16px 10px;font-size:.92rem;line-height:1.6;color:#6b5b4d;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} .post-meta{margin:0 16px 16px;font-size:.88rem;color:#8a7a6a;} .case-pager{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:34px;} .case-pager-nums{display:flex;align-items:center;gap:8px;}/* 第 206 批：数字按钮由 JS 内联拼接、原为 0 间距，补 8px 与外层节奏一致 */ .case-pager[hidden]{display:none;}/* 第 130 批：display:flex 会压掉 hidden 属性，零结果/单页时翻页条必须真隐藏 */ .case-pager button{font:inherit;font-size:.92rem;min-width:40px;padding:7px 14px;border-radius:999px;border:1px solid #d8cfc4;background:#FFFFFF;color:#3d2b1f;cursor:pointer;transition:background .15s,color .15s,border-color .15s;} /* 2026-10-05：移动端翻页按钮实测 38px 高，低于 44px 触控目标 → 触摸端补到 44px。 桌面维持 38px 原值不变（鼠标场景无 44px 硬要求，且翻页条高度影响列表版面）。 */ @media (max-width: 991.98px) { .case-pager button { min-height: 44px; } } .case-pager button:hover:not(:disabled){border-color:var(--brand-700, #C25200);color:var(--brand-800, #B34700);} .case-pager button:focus-visible{outline:2px solid var(--brand-800, #B34700);outline-offset:2px;} .case-pager button[aria-current="page"]{background:var(--brand-700, #C25200);border-color:var(--brand-700, #C25200);color:#FFFFFF;} .case-pager button:disabled{opacity:.45;cursor:default;} /* 常见问题板块（第 76 批，仿试用页 FAQ） */ /* ===== 活动案例详情页（第 87 批定方案 B：公众号图文直搬，全自动同步；第 89/93 批定型）===== 页面结构：面包屑（四级）→ 标题 → 摘要（可空）→ 发布时间 → 左正文 720 + 右固定侧栏 320 底部 CTA 第 89 批撤掉、并入右侧栏；行业标签第 93 批并入面包屑 快照卡 / 成果数字条 / 同行业案例不做——需人工判断与撰稿，自动同步给不了 */ /* 列表卡接通详情页后的链接样式 */ .post-cover a{display:block;} .post-title a{color:inherit;text-decoration:none;} .post-title a:hover{color:var(--brand-800, #B34700);} .post-card:focus-within{outline:2px solid var(--brand-800, #B34700);outline-offset:3px;} /* 整卡可点（2026-10-09 用户要求：文章卡片的入口链接加在卡片上，而不是只有图片和标题）： 标题链接用 ::after 铺满卡片；.post-card 已是 position:relative，正好当锚点。 图片与标题的链接都保留、DOM 不动，只是整卡任意位置都能点进文章。 该规则是相对设计稿 docs/ 的行为增强：不改任何元素的几何与计算样式，对拍不受影响。 */ .post-card .post-title a::after{content:"";position:absolute;inset:0;} /* 锚点定位补偿：详情页行业标签带 #cases 跳回列表页时，别让吸顶导航盖住筛选区 */ #cases{scroll-margin-top:84px;} /* -- 详情页 hero（亮橙底 + 白字，避让固定导航 152px）-- */ .s_case_hero{text-align:left;} .s_case_hero .container{text-align:left;} .s_case_hero .container>*{max-width:1096px;margin-left:auto;margin-right:auto;} /* 面包屑 .case-crumb 已于 2026-10-01 抽到 assets/css/crumb.css（全站通用一份）。 案例列表页 / 案例详情页 / 联系页 / 常见问题页 / 免费试用页 / 收银页 / 微商城页共用， 原先本文件里的这份拷贝（连同 lxgdb-contact.css、mfsy.css 里各自的一份）已删除。 ⚠️ 新页要用面包屑：引用 crumb.css，不要在本文件重新加一份。 */ /* -- 标题 / 摘要 / 日期 -- 2026-10-03 第 1 轮：页面橙带底（var(--brand-500, #FF7C1C)，内联在案例详情页与干货详情页）**不动**， 下面三行文字由白字系改为深棕系 —— 白字实测仅 2.58:1、meta 约 2.1:1， 低于「正文 4.5 / 大字号 3.0」双线。变量定义见 assets/css/tokens.css。 */ .case-detail-title{font-size:1.6rem;line-height:1.42;margin:0;color:var(--on-brand,#2E1F14);font-weight:700;text-shadow:none;} @media (min-width:768px){.case-detail-title{font-size:2.15rem;}} /* 摘要文字区与正文同宽 720：盒保持 1096 与标题同位（376=1096-720）；<1200 容器不足 1096，取消 */ .s_case_hero .case-detail-lead{padding-right:376px;} @media (max-width:1199px){.s_case_hero .container>*{max-width:720px;}.s_case_hero .case-detail-lead{padding-right:0;}} .case-detail-lead{margin:14px 0 0;font-size:1.05rem;line-height:1.75;color:var(--on-brand-muted,#4A2A12);text-shadow:none;} .case-detail-lead:empty{display:none;} .case-detail-meta{margin:16px 0 0;font-size:.82rem;color:var(--on-brand-muted,#4A2A12);text-shadow:none;} /* -- 正文（公众号图文原样承载，限宽 720px 居中）-- */ .case-article-wrap{padding:46px 0 54px;background:#FFFFFF;} .case-article{max-width:720px;margin:0 auto;font-size:1.0625rem;line-height:1.9;color:#3d2b1f;} .case-article h2{font-size:1.35rem;line-height:1.55;margin:34px 0 12px;color:#3d2b1f;} .case-article h3{font-size:1.15rem;line-height:1.55;margin:26px 0 10px;color:#3d2b1f;} .case-article p{margin:0 0 18px;} .case-article ul,.case-article ol{margin:0 0 18px;padding-left:1.35em;} .case-article li{margin:7px 0;} .case-article strong{color:var(--brand-800, #B34700);} .case-article img{display:block;width:100%;height:auto;border-radius:12px;} .case-article figure{margin:26px 0;} .case-article figcaption{margin-top:9px;font-size:.88rem;line-height:1.6;color:#8a7a6a;text-align:center;} .case-article blockquote{margin:24px 0;padding:14px 20px;border-left:4px solid var(--brand-700, #C25200);border-radius:0 10px 10px 0;background:#FFF7F1;color:#5a4636;font-size:1.02rem;} /* -- 第 89 批：详情页两栏（左正文 720 + 右侧栏 320，总宽 1096，与全站其它页面对齐）-- */ .case-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;max-width:1096px;margin:0 auto;} .case-main{min-width:0;} .case-side{display:flex;flex-direction:column;gap:20px;align-self:start;} @media (min-width:1200px) and (min-height:880px){.case-side{position:sticky;top:96px;}} @media (max-width:1199.98px){.case-layout{grid-template-columns:minmax(0,1fr);gap:36px;max-width:720px;}} /* -- 侧栏卡片（165 批改 2 卡：三产品+免费试用+助教图 / 更多案例）-- */ .case-card{padding:22px 20px;border:1px solid #EFE5DC;border-radius:14px;background:#FFFFFF;} .case-card-cta{background:#FFF7F1;border-color:#F2D8C2;} .case-card-title{margin:0 0 10px;font-size:1.02rem;line-height:1.55;font-weight:700;color:#3d2b1f;} .case-card-desc{margin:0 0 10px;font-size:.9rem;line-height:1.72;color:#6a5647;} .case-card-btn{margin:0;} .case-card-btn + .case-card-btn{margin-top:10px;} .case-card .btn{display:block;width:100%;padding:.6rem .9rem;font-size:.95rem;line-height:1.5;} .case-prod{margin:0;padding:0;list-style:none;} .case-prod li + li{margin-top:10px;} .case-prod a{display:block;padding:10px 12px;border-radius:10px;background:#F7F3EF;color:#3d2b1f;font-size:.95rem;font-weight:600;text-decoration:none;transition:background-color .2s,color .2s;} .case-prod a:hover,.case-prod a:focus{background:#FFF1E5;color:var(--brand-900, #9C4200);text-decoration:none;} .case-prod em{display:block;margin-top:3px;font-style:normal;font-size:.82rem;font-weight:400;color:#8a7a6a;} .case-card-figure{margin:14px 0 0;} .case-card-figure img{display:block;width:100%;height:auto;border-radius:10px;} /* -- 正文末尾「上/下一篇」快捷入口（第 88 批）：同时充当正文结束标记 -- */ .case-nav{max-width:720px;margin:0 auto;padding-top:34px;border-top:1px solid #EFE5DC;} .case-nav-head{margin:0 0 16px;font-size:.95rem;font-weight:700;color:#3d2b1f;} .case-nav-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;} .case-nav-item{display:block;padding:16px 20px;border:1px solid #EFE5DC;border-radius:12px;background:#FFFFFF;text-decoration:none;transition:border-color .2s,background-color .2s,box-shadow .2s;} .case-nav-item:hover,.case-nav-item:focus{border-color:var(--brand-700, #C25200);background:#FFF7F1;box-shadow:0 6px 18px rgba(194,82,0,.10);text-decoration:none;} .case-nav-label{display:block;margin-bottom:6px;font-size:.82rem;color:#8a7a6a;} .case-nav-title{display:block;font-size:1rem;font-weight:600;line-height:1.6;color:#3d2b1f;} .case-nav-next{text-align:right;} /* 2026-10-01：产品筛选分段控件与卡片产品角标 .post-prod 均已下线（页面上只剩拓客活动案例，卡片不再需要产品标识） */ /* ===== 移动端间距专项（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;} /* 2026-09-26 面包屑位置统一（以联系页 104px 为标准）：详情页 hero 顶距是内联 152px， 类名降档规则管不到内联样式，须对 .s_case_hero 用 !important 压过（桌面/平板仍走内联 152px） */ .s_case_hero{padding-top:var(--nav-offset-sm, 104px) !important;} } /* -- FAQ 手风琴基础（2026-09-26 补齐：Odoo 箭头图标 + 圆角，对齐 gdbwsc-base） -- */ .s_accordion { --accordion-border-radius: 10px; } .s_accordion .accordion { --accordion-btn-focus-box-shadow: inset 0 0 0 0.25rem rgba(255, 124, 28, 0.25); } .s_accordion .accordion-button:not(:focus-visible) { box-shadow: none; } .s_accordion .accordion-button:after { margin: 0; background: none; font-family: 'odoo_ui_icons'; text-align: center; content: '\e839'; } /* ---------- 常见问题解答 FAQ（2026-09-26 全站统一：极简分隔线风，对齐 gdbwsc） ---------- */ .s_faq_collapse h2 { margin-bottom: 32px !important; } .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 !important; } .s_faq_collapse .accordion-button { padding: 16px 0; box-shadow: none !important; font-size: 1rem; background: transparent !important; } .s_faq_collapse .accordion-button:hover { background: #FFF9F4 !important; } .s_faq_collapse .accordion-button:not(.collapsed) { color: var(--brand-text, var(--brand-800, #B34700)) !important; background: transparent !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; } .s_faq_collapse .accordion-body strong { color: var(--brand-text, var(--brand-800, #B34700)); } .s_faq_collapse .accordion-button::after { filter: none; opacity: .55; } /* -- Bootstrap 折叠/手风琴基础（页面基座精简版未包含，FAQ 必需；2026-09-26） -- */ .collapse:not(.show) { display: none; } .accordion-header { margin-bottom: 0; } .accordion-button { position: relative; display: flex; align-items: center; width: 100%; padding: 1rem; font-size: 1rem; color: #212529; text-align: left; background-color: transparent; border: 0; border-radius: 0; overflow-anchor: none; } .accordion-button::after { flex-shrink: 0; width: 1.25rem; height: 1.25rem; margin-left: auto; content: ""; } .accordion-item { color: #212529; } .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; } } /* 2026-10-01：产品分段控件的手机端收窄规则（2026-09-26 方案①）随控件一起下线，此处留空 */ /* ============================================================ 顶部导航胶囊：内边距与间距（2026-10-01 定稿） ------------------------------------------------------------ 问题：logo 文字距胶囊左边缘仅 20px，恰为圆角半径（80px 高 / 2 = 40px） 的一半，文字的起点还在圆弧里；而末项距右边缘 44px —— 左右不对称， 读作「logo 贴边」。全站 5 项导航在 1140px 胶囊里仅占约 744px， 右侧空 400px+，间距预算充足。 改法：不动 .px-3 / .me-4 的全局定义（全站工具类，会影响其它元素）， 只在本页作用域内覆盖导航三处 —— 胶囊左右内边距 20px → 40px（992–1199px 随容器收窄为 32px） logo 与首项间距 30px → 40px 菜单项左右内边距 24px → 28px（项间净距 48 → 56px） 宽度预算（最紧的 992px / 容器 960px）：需 744px，余 152px，不溢出。 保留：@media (min-width:992px) and (max-width:1003.98px) 的 22px 项距压缩档 （历史为 7 项导航防溢出所设），因此新值从 ≥1004px 起生效。 手机端（<992px）：桌面胶囊带 d-none，本块全部不生效，移动端维持原样。 注意：这里给的是胶囊「内部」留白，胶囊本身仍与页面主体同宽同左边界， 不移动容器，否则会与下方正文栅格错位。 ============================================================ */ @media (min-width: 992px) { header nav.navbar.d-lg-block.px-3 { padding-left: 32px !important; padding-right: 32px !important; } header nav.navbar .navbar-brand.me-4 { margin-right: 40px !important; } } @media (min-width: 1200px) { header nav.navbar.d-lg-block.px-3 { padding-left: 40px !important; padding-right: 40px !important; } } @media (min-width: 1004px) { header #top_menu > li > .nav-link { padding-left: 28px !important; padding-right: 28px !important; } } /* ========================================================== 活动案例页 / 资讯页 头图分化（2026-10-01） ------------------------------------------------------------ 背景：两页头图此前互为副本——同一个 .s_striped_center_top、同一个内联 var(--brand-500, #FF7C1C)、 同样的 display-2-fs + h4-fs，只有文字不同，是全站最像的两页。 分工：案例 = 「规模与模式」（橙底 + 能力声明带）；资讯 = 「更新」（白刊头）。 分化靠两条：色相（橙 vs 白）+ 结构（资讯把分类胶囊上移到刊头）。 ========================================================== */ /* ---------- ① 活动案例页：橙带 + 能力声明带（20261002 改版） ---------- 原为 5 张 Pexels 封面横带（hero-01..05.webp，900×383，共 168KB），与卡片封面 不同源、纯氛围装饰，资产维护成本高；去掉后橙带偏空。改为零图片资产的两行： · 模式行：纯文字 + 中点分隔，不做胶囊——有底色/圆角/内边距的容器会被读成"假按钮"； · 数字行：大数字 + 小标签裸字排布，同样不加底色，避免与按钮同源误读； · 数据取站内既有事实口径（llms.txt / 首页 / 活动模板页一致）；篇数用准确值。 20261002 v2：字号等比放大接管视觉重心； 20261002 v3：H1 由视觉隐藏改为可见（.cs-hero-title），保住可见 H1；v4：字号加大到 2rem。 */ /* 2026-10-03 第 1 轮：橙带底 var(--brand-500, #FF7C1C) 不变，标题 / 副标题由白字系改深棕系 （原白字 2.58:1 ✗，低于正文 4.5 / 大字号 3.0 双线）。变量见 tokens.css。 */ .o_cc5 .cs-hero-title{margin:0 0 12px;font-size:clamp(2rem,1.2rem + 2.8vw,3rem);font-weight:700;line-height:1.25;letter-spacing:.04em;color:var(--on-brand,#2E1F14);text-shadow:none;} .cs-hero-sub{margin:14px 0 0;font-size:var(--fs-hero-sub, 1.25rem);line-height:1.6;color:var(--on-brand-muted,#4A2A12);text-shadow:none;} /* 20261003 v13：徽章 img 整体移除（用户拍板「头图图片去掉」），页头 = 橙底 + 居中两行文字。 v10 定的品牌橙 var(--brand-500, #FF7C1C) + 白字文字阴影保留；v11 加的 top:0 避让导航规则随 img 一起删。 case-hero.png 文件保留在 assets/images/（用户提供的资产，后续可能复用），只是不再引用。 留白 160/48（20261003 深夜用户反馈副标题下方空隙太大，pb 88→48）；≤767.98px 120/40。 */ /* 2026-10-03 第 1 轮：案例总览 + 7 个行业页（共 8 页）的橙带文字改深棕。 底色 var(--brand-500, #FF7C1C) 不动；文字色在 .o_cc5（深棕底）与 .cs-hero-home（橙底）两组规则里都改， 两组同特异性、以后者为准，保持一致以免日后再被覆盖回白色。 */ /* 20261004：本组 .cs-hero-home 规则已废弃（案例 8 页页头改用 .zx-masthead 版式），留存仅备回退。 */ .cs-hero-home{position:relative;overflow:hidden;padding-top:calc(var(--nav-offset, 152px) + 8px);padding-bottom:48px;background:var(--brand-500, #FF7C1C);color:var(--on-brand,#2E1F14);} .cs-hero-home>.container{position:relative;text-align:center;} .cs-hero-home .cs-hero-title{color:var(--on-brand,#2E1F14);text-shadow:none;} .cs-hero-home .cs-hero-sub{color:var(--on-brand-muted,#4A2A12);text-shadow:none;} /* 频道子导航（.channel-nav）2026-10-02 二次改造后**不在橙带里**了 —— 它已降级为列表区顶部的 子 tab（见 crumb.css）。原先的 `.o_cc5 .cs-hero-stats + .channel-nav{margin-top:26px}` 随之删除。 */ /* ---------- ② 资讯页：通栏刊头（20261003 深夜建浅渐变版 → 20261004 用户拍板改满橙）---------- 20261004 起为满橙 var(--brand-500, #FF7C1C)，与首页 hero / 案例页 .cs-hero-home 同色—— 用户理由：营销视觉页顶部满橙显「压」是因为挤着五级筛选，资讯刊头是留白型头图，撑得住。 连带重配（浅底配色在橙上全部失效）： - 整栏文字统一橙底深棕体系（tokens.css --on-brand-*，面包屑橙带同款，全部 ≥4.5:1； 20261004 用户拍板「全部深棕」——H1 不用白字，整栏一个色系最统一； 白字压橙仅 2.58:1，小字本就不可用）； - 色带内分隔线/底缘线 20261004 二修起全部删除：满橙→白硬切（案例页同款），深色细线在橙上 读作「莫名的黑线」（用户看截图拍板「图标区域底部的黑线去掉」）； - 右侧 SVG 看板自带白色主卡片底，压橙天然成立，仅加 drop-shadow 增强贴合； - 选中 tab 下划线改白色 3px（选中态另有加粗+字色双通道，白线为装饰性冗余标识）。 结构（badge/H1/导语/左文右图/tab 位置）一字未动。 参考 E:/优化/ai_studio_code.html 的 .media-header-wrap（只搬头部，站点导航与分类 tab 不动）： 左文右图：badge「KNOWLEDGE & UPDATES」（大写、1.2px 字距）+ H1「管店宝资讯中心」 + 说明行（站内统一字号 .9375rem，限宽 480）+ 右侧参考文件同款 SVG 数据看板（≤420px 右对齐）。 字体一律站内类（display-2-fs 等），不引入参考文件字体。 覆盖用 (0,2,1) 压 base 的 (0,1,1)：.zx-masthead.o_cc5 h1。 */ /* 20261003 深夜二修：v-l 写的 background-image:none !important 把同规则 background 简写 里的渐变也抹掉了（底色消失的根因）——background 简写本身就覆盖 o_cc5 的底色与底图，无需再补。 */ .zx-masthead.o_cc5{background:var(--brand-500, #FF7C1C) !important;color:var(--on-brand-strong, #38220F);padding-bottom:0 !important;} .zx-masthead.o_cc5 h1{color:var(--on-brand, #2E1F14);text-shadow:none;} .zx-masthead.o_cc5 .lead{color:var(--on-brand-muted, #4A2A12);text-shadow:none;} .zx-masthead .container{text-align:left;} .zx-masthead h1{margin:0;line-height:1.1;} /* 20261004：案例刊头撤 tab 后补底部间距（用户「副标题下面应该有一定的间距」）—— 资讯版色带下部由 .zx-masthead-tabs 的 26px 上边距兜底，案例版无 tab、只剩 .pb4=4px，副标题贴底。 ⚠️ 生效前提：section 必须摘掉 pb4 类——base 里 .pb4{padding-bottom:4px !important} 会压死本规则； 也不能换用 .pb48（同为 !important，手机 32px 档会被它压死）。 ⚠️ 第二层：上方 .zx-masthead.o_cc5{padding-bottom:0 !important}（资讯版共用规则）同样压普通规则—— 故本规则写 .zx-masthead.zx-masthead--notabs（同特异性 (0,2,0) + 同为 !important，靠文件位次在后取胜）。 */ .zx-masthead.zx-masthead--notabs{padding-bottom:48px !important;} @media (max-width:767.98px){.zx-masthead.zx-masthead--notabs{padding-bottom:32px !important;}} .zx-masthead .lead{margin:14px 0 0;max-width:560px;font-size:var(--fs-hero-sub, 1.25rem);font-weight:400;line-height:1.6;color:#6b5b4d;}/* 20261004 三修：导语 15→20px 并入头图副题档；四修：限宽 480→560 修「观/察」劈词断行 */ .zx-masthead-grid{display:grid;grid-template-columns:1fr;gap:18px;align-items:center;} @media (min-width:992px){.zx-masthead-grid{grid-template-columns:1.05fr .95fr;}} /* 2026-10-03 第 1 轮：badge 原为 var(--brand-500, #FF7C1C)，压在刊头浅渐变底（#FFF4E8）上仅约 2.4:1 ✗， 低于正文 4.5 线；改用 --brand-800（var(--brand-800, #B34700)）实测 5.07:1 ✓，色相仍是品牌橙家族。 20261004：刊头改满橙后 #B34700 压橙失效（橙上橙），作用域覆写为橙底深棕 --on-brand-strong。 20261004 字号阶梯：.8125rem → --fs-eyebrow(12px)，与导语拉开两级。 20261004 二修（用户拍板）：标题上方小字统一 20px → --fs-hero-sub（眉题档 12px 保留在 tokens 备用）。 */ .zx-badge{display:block;margin-bottom:6px;font-size:var(--fs-hero-sub, 1.25rem);font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--brand-800,#B34700);} .zx-masthead.o_cc5 .zx-badge{color:var(--on-brand-strong,#38220F);} .zx-masthead-art{display:flex;justify-content:flex-end;align-items:center;} /* 20261004：内容区域右对齐（用户拍板），原 flex-start */ /* 20261004 满橙版：SVG 自带白色主卡片底，压橙成立；加 drop-shadow 让白卡「坐」进橙底（纯装饰） 20261004 二修：420→460 适当加大（= viewBox 原尺寸 1:1），SVG 内文字 10/11px → 14px（3 页同步，HTML 内联） */ .zx-masthead-art svg{width:100%;max-width:460px;height:auto;filter:drop-shadow(0 10px 24px rgba(46,31,20,.18));} /* 20261003 深夜三：分类 tab 移回刊头色带内（用户反馈「tab菜单位置不一致」——参考文件头部 本来就含这排 tab；此前留在灰色列表区导致与参考不一致）。样式仍走 crumb.css 的下划线式 子 tab（.channel-nav），这里只覆写间距/分隔线，作用域锁 .zx-masthead 双类，案例 8 页胶囊 tab 不受影响。 20261004 满橙版：crumb.css 的 .channel-nav 配色按浅底设计（#6b5b4d 字 / #B34700 悬停选中）， 压橙全失效 → 作用域内整套覆写为橙底深棕体系（--on-brand-*，≥4.5:1）。 20261004 二修（用户看截图拍板）：①tab 行上方 border-top 分隔线与色带 border-bottom 底缘线 全部删除——满橙到白是硬切（案例页同款），深色细线在橙上读作「莫名的黑线」； ②选中下划线白→黑（var(--on-brand)），橙色上黑色 3px 最醒目；悬停不下划线（保留给选中态）， 只变字色。 */ .zx-masthead .zx-masthead-tabs{gap:8px 40px;margin:26px 0 0;font-size:var(--fs-tab, 1.125rem);} /* 20261004 定档 18px（试档用户认可），已收编 tokens --fs-tab */ .zx-masthead .zx-masthead-tabs a{padding:14px 0;color:var(--on-brand-strong, #38220F) !important;} .zx-masthead .zx-masthead-tabs a:hover{color:var(--on-brand, #2E1F14) !important;border-bottom-color:transparent;} .zx-masthead .zx-masthead-tabs a:focus-visible{outline-color:#FFFFFF;} .zx-masthead .zx-masthead-tabs a[aria-current="page"]{border-bottom-width:3px;margin-bottom:0;color:var(--on-brand, #2E1F14) !important;border-bottom-color:var(--on-brand, #2E1F14);} /* 20261003 深夜五（用户反馈字号比参考文件大好多）：参考头部 H1 是固定 2rem（Bootstrap .h2 档）， 我们 display-2-fs 桌面端约 100px —— 刊头内压到 2rem，全站其它 display-2-fs 不受影响。 20261003 深夜六修：2rem 又偏小（用户反馈「现在有小了」）→ 回流式档 clamp(1.75rem→2.5rem)。 20261003 深夜七修：再加大 10px（用户要求「加大10px试试」）→ clamp(2rem→3.125rem)，桌面约 50px、手机约 32px。 20261004 终稿（用户拍板字号阶梯，见 tokens.css）：流动值废弃，写死两档 —— 手机 --fs-hero(32px)、 桌面 ≥992px --fs-hero-xl(48px，≈原流动顶值 50px 观感无差）。 20261004 二修（用户追问「首页头图是多少，没有统一吗」后拍板「执行」）：桌面档 48 → **4.5rem(72px)**， 与首页 hero / 关于我们 gygdb 的 display-2-fs 基类值完全对齐（切页不再 72→48 矮一截）； 手机档 32px 不变。--fs-hero-xl 阶梯档保留在 tokens 备用，资讯刊头自此覆写为同基类值。 */ .zx-masthead .display-2-fs{font-size:var(--fs-hero, 2rem);line-height:1.2;} @media (min-width:992px){.zx-masthead .display-2-fs{font-size:4.5rem;}} /* 20261003 深夜六：版本更新板块时间轴（仅 news/hyzx-banben.html 引用，参考 ai_studio_code.html .version-timeline 配方；颜色/字号全用站内体系：竖线 #E8E2DA、圆点描边 var(--brand-500, #FF7C1C)、 badge #FFF1E2/var(--brand-700, #C25200)（与胶囊选中色同源）、标题 1rem、明细 .9375rem。版本号/明细为占位文案。） */ .zx-ver-timeline{border-left:2px solid #E8E2DA;padding-left:24px;margin:8px 0 0 8px;} .zx-ver-item{position:relative;margin-bottom:28px;} .zx-ver-item:last-child{margin-bottom:0;} .zx-ver-item::before{content:"";position:absolute;left:-31px;top:24px;width:12px;height:12px;border-radius:50%;background:#FFFFFF;border:3px solid var(--brand-500, #FF7C1C);} .zx-ver-box{background:#FFFFFF;padding:20px;border-radius:12px;border:1px solid #F1E5D8;box-shadow:0 2px 10px rgba(61,43,31,.08);} .zx-ver-head{display:flex;justify-content:space-between;align-items:center;gap:6px 12px;margin-bottom:8px;flex-wrap:wrap;} .zx-ver-badge{background:#FFF1E2;color:var(--brand-700, #C25200);font-weight:700;padding:3px 8px;border-radius:4px;font-size:.8125rem;display:inline-block;} .zx-ver-date{color:#8a7a6a;font-size:.8125rem;} .zx-ver-title{margin:0 0 8px;font-size:1rem;font-weight:700;color:#3d2b1f;line-height:1.5;} .zx-ver-list{margin:0;padding-left:20px;color:#6b5b4d;font-size:.9375rem;line-height:1.6;} .zx-ver-list li{margin-bottom:4px;} .zx-ver-list li:last-child{margin-bottom:0;} .zx-ver-list strong{color:#3d2b1f;} @media (max-width:767.98px){ .zx-ver-timeline{padding-left:18px;margin-left:2px;} .zx-ver-item::before{left:-25px;} } /* 20261003 深夜七：资讯 3 页列表区顶部间距收紧 64→32（用户反馈；pt64 是 !important 工具类， 故 3 页 section 换 .zx-list-top 专用类，案例 8 页的 pt64 不受影响）。 20261003 深夜八：三页不一致的根因——.post-grid 自带 margin-top:30px（版更页时间轴只有 8px）， 在 zx-list-top 内归零，三页实效顶距统一为 32px。 */ .zx-list-top{padding-top:32px !important;} .zx-list-top .post-grid{margin-top:0;} @media (max-width:767.98px){ .zx-masthead .zx-masthead-tabs{gap:2px 24px;} .zx-masthead .zx-masthead-tabs a{padding:10px 0;} } /* 原 .zx-tabs-bar（刊头内装分类导航的容器）2026-10-02 二次改造后下线： 资讯分类导航已降级为列表区顶部的子 tab（.channel-nav，见 crumb.css），刊头里不再有它。 ⚠️ 20261003 深夜三起分类 tab 又回到刊头内（.zx-masthead-tabs），此注释仅存史。 */ @media (max-width:767.98px){ /* 手机上页头：留白再收一档，字号降档（v13 起无徽章；pb 56→40 同 v14 收紧） */ .cs-hero-home{padding-top:calc(var(--nav-offset-sm, 104px) + 16px);padding-bottom:40px;} .o_cc5 .cs-hero-title{font-size:1.75rem;} .cs-hero-sub{font-size:var(--fs-hero-sub, 1.25rem);}/* 20261004 三修：手机不再降档，副题全端 20px 一档 */ /* 刊头窄屏：左文右图改上下叠放（文案在上、插画缩窄在下），保持左对齐 */ .zx-masthead-art svg{max-width:340px;} } /* 20261002 体检补：本页基座（gdbkhal-base.css）不含 Bootstrap 工具类， FAQ 手风琴按钮的 fw-bold / gap-2 / flex-grow-1 在其它页基座（lxgdb/tuike-base）有定义， 本页没有导致标题不加粗；按 Bootstrap 同值补齐，作用域仅限本页手风琴。 */ .s_faq_collapse .accordion-button{gap:.5rem;font-weight:700;} .s_faq_collapse .accordion-button .flex-grow-1{flex-grow:1;min-width:0;} /* ---------- 20261002 资讯拆分：分类导航 / 白底刊头 / 静态卡 ---------- 背景：资讯由「1 页 + Tab JS 切换」改为「3 个独立分类页」。 分类胶囊由