/**
 * 服务页 H5 基础适配（仅 services.html 引入）
 * 目的：与其他页面保持一致的 390 基准 rem，并与 PC 样式隔离。
 */

@media (max-width: 768px) {
  html:has(body[data-page='services']) {
    font-size: calc(100vw / 3.9);
    min-width: 0;
  }

  body[data-page='services'] {
    min-width: 0;
  }

  /* 服务页主内容宽度按移动端基准约束，避免受 PC 最小宽度残留影响 */
  body[data-page='services'] .service-page__main {
    width: 100%;
    max-width: 3.9rem;
    margin: 0 auto;
  }

  /**
   * 服务页首屏 H5：仅保留 images/mobile/server_top_bg.png（.page-hero__bg-h5 背景）。
   * 注意 body 自身带 .service-page，不能用「body … .service-page …」后代选择器，否则规则永远不命中。
   */
  body[data-page='services'].service-page .page-hero__visual-h5 {
    display: none !important;
  }

  body[data-page='services'].service-page .page-hero__visual-h5 img {
    display: none !important;
  }

  body[data-page='services'].service-page .page-hero__bg-h5 {
    background-image: url(../images/mobile/server_top_bg.png);
  }

  /* 服务页的一体化服务区块：H5 与首页 service-showcase 保持一致，且仅作用于 services 页面 */
  body[data-page='services'] .service-unified.service-showcase {
    padding: 0.32rem 0;
    background: transparent;
  }

  body[data-page='services'] .service-unified .service-showcase__intro {
    margin-bottom: 0.24rem;
  }

  body[data-page='services'] .service-unified .service-showcase__grid.container {
    margin-top: 0.65rem;
  }

  /* 服务页 H5：交付流程区块高度与背景图独立控制（不影响 PC） */
  body[data-page='services'] .service-deliver__inner {
    height: 2.12rem;
    min-height: 2.12rem;
    box-sizing: border-box;
    background-image: url(../images/mobile/process_bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
  }

  /* 日语 H5：交付内容第 3 条文案限宽，避免超出 .service-deliver__inner 背景区 */
  html[lang='ja'] body[data-page='services'] .service-deliver__list > li:nth-child(3) span[data-i18n='services.deliver.item3'] {
    max-width: 2rem;
    min-width: 0;
    overflow-wrap: break-word;
    word-break: normal;
  }

  /* 服务页 H5：合作方式内容容器左右内边距 20px（仅移动端服务页） */
  body[data-page='services'] .service-coop__inner.container {
    padding-left: 0.2rem;
    padding-right: 0.2rem;
  }
}
