/* ===== 手机端首页样式 ===== */
/* 显示控制：默认(PC)隐藏手机端；≤ 768px 隐藏PC、显示手机端。
   注意：.m-page-wrapper 与 .mobile-visable 同一个元素，
   flex 布局必须写在媒体查询内，避免覆盖 display:none */
.mobile-visable {
  display: none;
}

@media (max-width: 768px) {
  .pc-visable {
    display: none;
  }
  .mobile-visable {
    display: flex;
    flex-direction: column;
  }
}

/* ===== 手机端页面容器 ===== */
/* 新版 bg.png(1188×2160) 自带底部城市剪影+单位名，
   用 cover 铺满整页，任意屏高都能填满不露底；
   底色取背景图主色作为加载前的兑底 */
.m-page-wrapper {
  width: 100%;
  min-height: 100vh;
  background: #0e6c8c url(../img/index-mobile/bg.png) no-repeat top center;
  background-size: cover;
  position: relative;
  overflow-x: hidden;
}

/* 内容容器：与赛道按钮等宽(约83%屏宽)，水平居中 */
.m-content {
  width: 83%;
  margin: 0 auto;
  position: relative;
}

/* ===== LOGO区域 ===== */
.m-logo {
  text-align: center;
  padding-top: 1.6rem;
}

.m-logo img {
  width: 45%;
  height: auto;
  margin: 0 auto;
}

/* ===== 主标题 ===== */
/* 用 padding 而非 margin，避免 margin 塔陷把 .m-page-wrapper 背景往下推 */
.m-title {
  text-align: center;
  padding-top: 0.7rem;
}

.m-title img {
  width: 96%;
  height: auto;
  margin: 0 auto;
}

/* ===== 黄色提示字 ===== */
.m-subtitle {
  text-align: center;
  margin-top: 0.5rem;
}

.m-subtitle img {
  width: 92%;
  height: auto;
  margin: 0 auto;
}

/* ===== 赛事板块（主体赛/专项赛） ===== */
.m-section {
  margin-top: 1.1rem;
}

.m-section-header img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== 赛道按钮 ===== */
.m-track {
  display: block;
  margin-top: 0.5rem;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.m-track img {
  width: 100%;
  height: auto;
  display: block;
}

.m-track:active {
  transform: scale(0.98);
  opacity: 0.9;
}

/* ===== 备案号（内容末尾） ===== */
.m-icp {
  text-align: center;
  margin-top: 0.9rem;
  padding-bottom: 2.2rem; /* 给背景图底部城市剪影+单位名留出空间 */
}

.m-icp a {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.42rem;
  line-height: 1.4;
}