@charset "utf-8";
/* ============================================================
   产品页 · 层级导航条 (面包屑) 移动端 sticky
   2026-09-15

   背景：chatter / prm-cloud 两条产品线各有两个页面（概述 / 功能），
         移动端左栏 .pro-left 被隐藏后，页内没有任何定位与回退路径。
         统一改成 sale-cloud/spot.html 同款：
           产品概览 › 现场服务云      (上一层 = 蓝字链接, 当前页 = 浅蓝胶囊)

   分工：
     · css/sale-crumb.css        —— 提供 .sale-crumb--single 的外观
                                    (桌面端 display:none, 移动端单行)
     · 本文件                    —— 只补「吸附在固定头下方」的定位
                                    4 个页面共用，避免逐页重复

   依赖：css/mobile-hf.css 里 #header 固定高 64px。
   作用域：全部规则在 @media (max-width: 768px) 内，桌面端零影响。
   ============================================================ */

@media (max-width: 768px) {
  /* sticky 的包含块必须是「铺满屏宽的祖先」——
     .pro-right 在移动端已 float:none + width:100%, 符合条件；
     条高由 sale-crumb.css 自身的 padding/字号决定 (≈43px)，
     后续内容自然错开，无需额外占位。 */
  .pro-mes .sale-crumb.sale-crumb--single {
    position: sticky !important;
    top: 64px !important;                 /* = #header 高 (见 mobile-hf.css) */
    z-index: 9960 !important;             /* < #header 9990 */
    width: calc(100% + 24px) !important;  /* 抵消 sale-crumb.css 基类 width:100% */
    margin: 0 -12px 10px !important;      /* 负 margin 抵消 .pro-mes 的 12px padding */
    background: #ffffff !important;
    border-bottom: 1px solid #eef0f4 !important;
    box-shadow: 0 8px 16px -10px rgba(16, 42, 90, 0.22) !important;
  }
}

/* end @media (max-width: 768px) */