@charset "utf-8";
/* ============================================================
   platform-cloud/platformcloud.html (云平台 · 概述) 移动端适配
   2026-09-15 —— 参考 sale-cloud/spot.html + prm-cloud/prmfeatures.html
   ------------------------------------------------------------
   基础 CSS: change.css + pro-god.css

   本页独有:
     · 顶部 banner = 图 990×457 + .pro-ding 绝对定位贴底 (300+ 行同款结构,
       与 chatter/chatter.html、prm-cloud/prmcloud.html 一致)
       → 沿用已上线验证的「色块+文字压图」做法: 图固定 175px + object-fit:cover,
         .pro-ding 绝对定位贴底, .back-bg (半透明 .bg_dullblue #00267f) 撑满,
         .back-con 回相对定位。banner 总高 ≈ 175px
     · .ser_report「新闻报道」白条 (890px 固定 + .report_L 640 / .report_R 250 双浮动)
     · .sale_title.platform_biao1/2/3/5 = sprite 图标标题
       ⚠️ **关键**: 桌面 `.sale_title{height:50px;line-height:50px}` 让文字中心落在
          盒内 y=25; 而 platform_bg.png(52×290) 的 5 个图标区间各 50px 高、起点
          y=1/61/120/180/238, 配上偏移 0/-58/-120/-175/-230 ⇒ 图标中心 y=25.5/27.5/
          24.5/29.5/32.5。桌面这两者本来就对得上。
          手机端**绝不能只改 line-height 不改 height** (会变成文字贴盒顶、偏上 18px,
          prmcloud/chatter 都踩过这个坑) → 这里 50/50 原样保留, 只收字号与左留白。
     · .ser_solve.height-445 (内联 height:443px !important → 只能靠 height:auto !important? 否,
       该值来自 `.height-445` 类而非内联, 见下) + .solve_left/.solve_right 双浮动
     · .service_ban.bakc_plat 引言块 (背景图 platform_05.jpg = 浅色云朵,
       桌面 h3 是深蓝字, 手机端保持深色)
     · 收尾 CTA 块 .cell-sale.font-color.border-no.bg_dullblue (#00267f 深蓝)
     · .pro-right 左边框来自类 .border_dullblue (#00267f) → 可覆盖

   作用域: 全部规则在 @media (max-width: 768px) 内, 桌面端零影响。
   ============================================================ */

@media (max-width: 768px) {

  .pro-mes {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
    font-size: 13px !important;
  }

  .pro-mes .pro-left { display: none !important; }

  .pro-mes .pro-right {
    width: 100% !important;
    float: none !important;
    height: auto !important;
    margin-top: 10px !important;
    box-sizing: border-box !important;
  }
  /* 去掉 .border_dullblue 的深蓝左竖线 */
  .pro-mes .pro-right.border_dullblue { border-left: none !important; }

  .pro-right .pro-two,
  .pro-mes .cell-sale,
  .clear-both {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  /* ---------- banner: 色块 + 文字压在图上 (对齐 PC 形态), 总高 ≈ 175px ---------- */
  .pro-mes .pro-right .pro-one {
    position: relative !important;
    width: 100% !important;
  }
  .pro-mes .pro-one > div:first-child {
    width: 100% !important;
    height: 175px !important;
    overflow: hidden !important;
    line-height: 0 !important;
  }
  .pro-mes .pro-one > div:first-child img {
    width: 100% !important;
    max-width: 100% !important;
    height: 175px !important;
    object-fit: cover !important;
    object-position: center 42% !important;
    display: block !important;
  }
  .pro-mes .pro-right .pro-ding {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: 0 !important;
    width: 100% !important;
    height: auto !important;
    background: none !important;
    padding: 0 !important;
    z-index: 11 !important;
  }
  /* 半透明色块 —— 与 PC 同源: .back-bg.bg_dullblue = #00267f @ opacity .5
     (只撑满, 不覆盖色值, 让品牌色从 PC 类继承) */
  .pro-mes .pro-right .pro-ding .back-bg {
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  .pro-mes .pro-right .pro-ding .back-con {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 14px 16px !important;
    box-sizing: border-box !important;
  }
  .pro-mes .pro-right .pro-ding .back-con h3 {
    color: #ffffff !important;
    font-size: 17px !important;
    line-height: 1.5 !important;
    margin: 0 0 10px !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
  }
  .pro-mes .pro-right .pro-ding .back-con p { color: #ffffff !important; margin: 0 !important; }
  /* 2026-09-15: banner 内的「免费试用」按钮隐藏 (移动端) —— 与固定头右上角的
     按钮重复。连同它所在的 <p> 一起隐藏, 否则空 <p> 仍按行高占一行, 把色块垫高。
     ⚠️ 只作用于 banner(.pro-ding .back-con, 该块内 <p> 仅此一个);
     页面收尾 CTA 的 .free-shi / 引言块的 .free-shi 保持显示。
     特异度 5 个类 > 文件末尾 `.pro-mes .free-shi`(2 个类), 两者都带 !important 也不会被反超。 */
  .pro-mes .pro-right .pro-ding .back-con .free-shi,
  .pro-mes .pro-right .pro-ding .back-con p {
    display: none !important;
  }
  /* 「观看演示」视频弹窗容器 (内含 820×418 的 #show + iframe) → 隐藏 */
  .pro-mes .pro-right .pro-ding .banyou2,
  .pro-mes .pro-right #show,
  .pro-mes .pro-right #moiveys { display: none !important; }

  /* ---------- 「新闻报道」白条 .ser_report ----------
     2026-09-15: 用户要求移动端**整块隐藏** (其内是 2021 年的过期荣誉文案)。
     下方整宽 / 字号 / 按钮规则**保留作兜底** —— 日后若要恢复显示, 只需删掉这条
     display:none, 布局规则仍在, 不必重写。 */
  .pro-mes .pro-two .ser_report { display: none !important; }
  .pro-mes .pro-two .ser_report {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 16px !important;
    box-sizing: border-box !important;
  }
  .pro-mes .pro-two .ser_report .report_L,
  .pro-mes .pro-two .ser_report .report_R {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    line-height: 1.6 !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
  }
  .pro-mes .pro-two .ser_report .report_L p {
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin: 0 0 6px !important;
  }
  .pro-mes .pro-two .ser_report .report_L p:first-child {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1c3d7a !important;
  }
  .pro-mes .pro-two .ser_report .report_R { margin-top: 12px !important; }
  .pro-mes .pro-two .ser_report .report_R .btn-block {
    display: inline-block !important;
    padding: 10px 24px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    background: linear-gradient(115deg, #0564F5 0%, #4a7bff 50%, #06bcd4 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 14px rgba(5, 100, 245, 0.28) !important;
    text-decoration: none !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  /* ---------- 各内容块 .cell-sale ---------- */
  .pro-mes .cell-sale {
    padding: 16px !important;
    margin-bottom: 10px !important;
    box-sizing: border-box !important;
  }
  .pro-mes .cell-sale.pad-top-30 { padding-top: 16px !important; }
  .pro-mes .cell-sale .clear-both { margin-top: 0 !important; }
  .cell-sale .sale-con {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  .pro-mes .cell-sale .padding-px { padding: 14px 0 10px !important; }

  /* ---------- 产品行单列堆叠 ----------
     ⚠️ .no-potion 桌面 position:absolute;right:40px;top:40px → 必须回正常流 */
  .cell-sale .sale-left,
  .cell-sale .sale-right,
  .no-potion,
  .no-float {
    float: none !important;
    box-sizing: border-box !important;
  }
  .cell-sale .sale-left {
    position: static !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    line-height: 0 !important;
  }
  .cell-sale .sale-left.no-potion {
    position: static !important;
    right: auto !important;
    top: auto !important;
  }
  .cell-sale .sale-left img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }
  .cell-sale .sale-right {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .pro-mes img { max-width: 100% !important; height: auto !important; }

  /* ---------- sprite 图标标题 (.sale_title.platform_biao*) ----------
     ⚠️ 保留桌面 height/line-height 各 50px —— 这是让文字中心落在 y=25 的唯一依据,
        只收字号与左留白 (60 → 62: 图标 52px + 10px 间距)。
        只改 line-height 不改 height 会让文字贴盒顶, 偏上 ~15px。 */
  .pro-mes .cell-sale .top-shou h3.sale_title {
    font-size: 15px !important;
    height: 50px !important;
    line-height: 50px !important;
    padding-left: 62px !important;
    padding-top: 0 !important;
    margin: 0 0 4px !important;
    background-size: 52px 290px !important;   /* = platform_bg.png 原生尺寸, 防被缩放 */
    color: #1c3d7a !important;
  }

  /* ---------- 字号 / 间距收敛 ---------- */
  .cell-sale h3,
  .cell-sale .top-shou h3 {
    font-size: 15px !important;
    line-height: 1.4 !important;
    margin: 10px 0 8px !important;
    padding-top: 0 !important;
    color: #1c3d7a !important;
  }
  .cell-sale .sale-right p,
  .cell-sale p {
    font-size: 13px !important;
    line-height: 1.7 !important;
    margin: 0 0 8px !important;
  }
  .cell-sale h4 {
    font-size: 18px !important;
    line-height: 1.4 !important;
    margin: 0 0 10px !important;
  }
  .cell-sale .top-shou { padding-bottom: 18px !important; }
  /* 「相关功能 / 相关内容」文字链接 → 次级按钮 (浅蓝底 + 蓝字 + 描边) */
  .pro-mes .cell-sale a.more_sales {
    display: inline-block !important;
    padding: 7px 18px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: #0564F5 !important;
    background: #eef3ff !important;
    border: 1px solid #c9ddff !important;
    border-radius: 999px !important;
    text-decoration: none !important;
    margin: 2px 0 0 !important;
    white-space: nowrap !important;
  }

  /* ---------- .ser_solve (内联 class height-445 = 443px !important) ---------- */
  .pro-mes .pro-two .ser_solve,
  .pro-mes .pro-two .ser_solve.height-445 {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 16px !important;
    box-sizing: border-box !important;
  }
  .pro-mes .pro-two .ser_solve .solve_left,
  .pro-mes .pro-two .ser_solve .solve_right {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .pro-mes .pro-two .ser_solve .solve_left h3 {
    font-size: 16px !important;
    line-height: 1.5 !important;
    color: #1c3d7a !important;
    margin: 0 0 8px !important;
  }
  .pro-mes .pro-two .ser_solve .solve_left p {
    font-size: 13px !important;
    line-height: 1.7 !important;
  }
  .pro-mes .pro-two .ser_solve .solve_left .btn-block {
    display: inline-block !important;
    padding: 10px 24px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    background: linear-gradient(115deg, #0564F5 0%, #4a7bff 50%, #06bcd4 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 14px rgba(5, 100, 245, 0.28) !important;
    text-decoration: none !important;
    margin: 12px 0 0 !important;
    white-space: nowrap !important;
  }
  .pro-mes .pro-two .ser_solve .solve_right { margin-top: 12px !important; }
  .pro-mes .pro-two .ser_solve .solve_right img { width: 100% !important; height: auto !important; }

  /* ---------- 引言 / 证言块 .service_ban.bakc_plat ----------
     背景图 platform_05.jpg (990×540, 浅色云朵) → 整宽铺底 + 内边距自适应 */
  .pro-mes .pro-two .service_ban {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 26px 18px !important;
    background-size: cover !important;
    background-position: center !important;
    box-sizing: border-box !important;
  }
  .pro-mes .pro-two .service_ban h3 {
    width: 100% !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.6 !important;
    color: #1b2c4d !important;
    text-align: center !important;
    padding-top: 0 !important;
    margin: 0 0 12px !important;
    text-shadow: none !important;
  }
  .pro-mes .pro-two .service_ban p {
    font-size: 13px !important;
    line-height: 1.6 !important;
    color: #33415c !important;
    text-align: center !important;
    margin: 0 !important;
  }
  /* 浅色底上的按钮改回蓝渐变胶囊 (默认样式在白底上对比不足) */
  .pro-mes .pro-two .service_ban .free-shi {
    background: linear-gradient(115deg, #0564F5 0%, #4a7bff 50%, #06bcd4 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(5, 100, 245, 0.28) !important;
  }

  /* ---------- 收尾 CTA 块 (.cell-sale.font-color.border-no.bg_dullblue) ---------- */
  .pro-mes .cell-sale.bg_dullblue { background: #00267f !important; }
  .pro-mes .cell-sale.bg_dullblue .font-color,
  .pro-mes .cell-sale.bg_dullblue .sale-con h4,
  .pro-mes .cell-sale.bg_dullblue .top-shou p { color: #ffffff !important; }
  .pro-mes .cell-sale.bg_dullblue .sale-left img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 442 / 319;
    object-fit: cover;
    object-position: center 62%;
  }
  .pro-mes .cell-sale.bg_dullblue .free-shi {
    background: #ffffff !important;
    color: #00267f !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2) !important;
  }

  /* ---------- 按钮统一渐变胶囊 ---------- */
  .pro-mes .free-shi {
    display: inline-block !important;
    padding: 9px 22px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: #ffffff !important;
    background: linear-gradient(115deg, #0564F5 0%, #4a7bff 50%, #06bcd4 100%) !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 14px rgba(5, 100, 245, 0.28) !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    margin: 0 !important;
  }

  /* ---------- 隐藏固定悬浮 / 底部 SEO 长文 Tab 轮播 ----------
     ⚠️ #footer 是那个轮播的分页圆点 (在 .div-dian 内), 不是页面页脚 */
  .div-dian { display: none !important; }
  #footer { display: none !important; }
  #back-to-top { display: none !important; }
  .qr_code_l { display: none !important; }
}

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