/* Mobile/tablet-only overrides. Loaded with media attr; desktop remains untouched. */

/* Prevent horizontal scroll */
html, body {
  max-width: 100vw;
  overflow-x: hidden;
}

/* 移动端购买页面：强制去掉所有留白 */
.purchase-section {
  padding: 0 !important;
  margin: 0 !important;
}

.purchase-section .product-image {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

.purchase-section .product-image img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

.purchase-section .product-info {
  margin: 0 !important;
  padding: 0 !important;
}

.purchase-section .product-name {
  margin: 0 !important;
  padding: 0 !important;
}

/* 强制去掉purchase-container的上外边距 */
.purchase-container {
  margin-top: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
}

/* 确保购买页面的第一个元素没有上边距 */
.purchase-section > *:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 强制去掉所有可能的间距 */
.purchase-section * {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* 移动端预售按钮样式 */
.presale-btn {
  width: 68px !important;
  height: 21px !important;
  background: #FFD166 !important;
  color: var(--Waikawa-Gray-950, #262C40) !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 10px !important;
  font-family: 'PingFang SC', sans-serif !important;
  font-weight: bold !important;
  font-size: 20px !important;
  line-height: 100% !important;
  letter-spacing: 0% !important;
  text-align: center !important;
  vertical-align: middle !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  display: block !important;
}

/* 移动端产品标题宽度限制 */
.product-title {
  width: 203px !important;
  max-width: 203px !important;
  min-width: 203px !important;
  color: var(--Waikawa-Gray-950, #262C40) !important;
  font-family: 'PingFang SC', sans-serif !important;
  font-weight: bold !important;
  font-size: 20px !important;
  line-height: 100% !important;
  letter-spacing: 0% !important;
}

/* 移动端进度条容器宽度限制 */
.progress-bar-container {
  width: 324px !important;
  max-width: 324px !important;
  min-width: 324px !important;
}

/* 移动端进度条宽度限制 */
.progress-bar {
  width: 324px !important;
  max-width: 324px !important;
  min-width: 324px !important;
}

.mobile-only {
  display: block !important;
}

.main-container {
  width: 100%;
}

/* Title and video section */
.title-box {
  height: auto !important;
  min-height: 160px;
}

.video-box {
  height: auto !important;
  min-height: 240px;
}

.subbox-video {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
}

/* Disable sticky/scroll-hijack area on small screens */
.center-box {
  position: static !important;
  height: auto !important;
  padding: 0 16px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

.center-list { order: 1 !important; margin-bottom: 20px !important; }
.center-video-box { order: 2 !important; width: 100% !important; margin: 0 !important; border-radius: 12px !important; }
.center-content { width: 348px !important; height: 250px !important; }

/* 移动端显示center-list */
.center-list { 
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

.center-list-wrapper { 
  display: flex !important; 
  flex-direction: row !important; 
  gap: 20px !important; 
  width: 242px !important; 
  padding: 0 !important; /* 清除内边距 */
  margin: 0 auto !important; /* 左右外边距为auto，实现居中 */
  visibility: visible !important;
  opacity: 1 !important;
  overflow-x: auto !important; /* 允许水平滚动 */
  overflow-y: hidden !important; /* 禁止垂直滚动 */
  -webkit-overflow-scrolling: touch !important; /* iOS平滑滚动 */
  scroll-snap-type: x mandatory !important; /* 滚动对齐 */
  scrollbar-width: none !important; /* Firefox隐藏滚动条 */
  -ms-overflow-style: none !important; /* IE隐藏滚动条 */
}

.center-list-wrapper::-webkit-scrollbar {
  display: none !important; /* Webkit隐藏滚动条 */
}

.center-item { 
  width: 242px !important; 
  height: 72px !important; 
  flex: 0 0 auto !important; 
  scroll-snap-align: center !important; /* 改为center对齐 */
  display: flex !important; /* 改为flex布局 */
  flex-direction: column !important; /* 垂直排列 */
  justify-content: center !important; /* 垂直居中 */
  align-items: center !important; /* 水平居中 */
  visibility: visible !important;
  opacity: 1 !important;
  cursor: pointer !important; /* 添加点击指针 */
  user-select: none !important; /* 防止文字选择 */
  -webkit-user-select: none !important; /* Webkit防止文字选择 */
  -moz-user-select: none !important; /* Firefox防止文字选择 */
  -ms-user-select: none !important; /* IE防止文字选择 */
  -webkit-tap-highlight-color: transparent !important; /* 移除点击高亮 */
  -webkit-touch-callout: none !important; /* 移除长按菜单 */
  touch-action: pan-x !important; /* 允许水平滑动 */
  padding: 0 !important; /* 清除内边距 */
  margin: 0 auto !important; /* 左右外边距为auto，实现居中 */
  background: transparent !important; /* 移动端无背景色 */
}

/* Middle white icon cards */
.middle-white-box { 
  height: auto !important; 
  padding: 16px 0 !important; /* 减少上下间距 */
}
.middle-white-content { 
  flex-direction: row !important; 
  align-items: stretch !important; 
  overflow-x: auto !important; 
  overflow-y: hidden !important; 
  -webkit-overflow-scrolling: touch !important; 
  scroll-snap-type: x mandatory !important; 
  gap: 12px !important; 
  padding: 0 12px !important; 
  width: 100% !important; 
  height: 100px !important; /* 固定高度为300px */
  max-height: 300px !important; /* 确保最大高度也是300px */
}
.middle-white-item { 
  flex: 0 0 auto !important; 
  width: clamp(260px, 80vw, 300px) !important; 
  scroll-snap-align: start !important; 
  margin: 0 !important; 
}
/* 强制所有卡片居中 - 使用更具体的选择器 */
.middle-white-content .middle-white-item .middle-white-imgbox {
  margin: 0 !important; 
  padding: 12px !important; /* 减少内边距 */
  height: 300px !important; /* 固定高度为300px */
  max-height: 300px !important; /* 确保最大高度也是300px */
  display: flex !important; 
  flex-direction: column !important; 
  justify-content: center !important; /* 强制垂直居中 */
  align-items: center !important; /* 水平居中 */
  gap: 0 !important; /* 移除gap，避免影响居中 */
}

/* 强制覆盖其他CSS文件的样式 - 使用最高优先级 */
div.middle-white-content div.middle-white-item div.middle-white-imgbox {
  justify-content: center !important;
  align-items: center !important;
  height: 300px !important;
  max-height: 300px !important;
}

/* 最强制性的选择器 - 确保所有卡片都居中 */
.middle-white-content .middle-white-item .middle-white-imgbox,
.middle-white-content .middle-white-item .middle-white-imgbox,
.middle-white-content .middle-white-item .middle-white-imgbox,
.middle-white-content .middle-white-item .middle-white-imgbox {
  justify-content: center !important;
  align-items: center !important;
  height: 300px !important;
  max-height: 300px !important;
  display: flex !important;
  flex-direction: column !important;
}
/* 减少图标区域高度 */
.middle-white-img {
  max-height: 32px !important; /* 减小图标高度 */
  width: auto !important;
  margin-bottom: 4px !important;
}
/* 减少文字间距 */
.middle-white-imgbox .middle-white-imgbox-text {
  margin: 2px 0 10px 0 !important; /* 减少标题间距 */
  font-size: 14px !important;
}
.middle-white-imgbox .middle-white-imgbox-bottom-text {
  margin: 2px 0 !important; /* 减少描述文字间距 */
  font-size: 12px !important;
  line-height: 1.2 !important; /* 减少行高 */
}

/* Twin rows */
.twin-row { 
  width: 100% !important; 
  flex-direction: column !important; 
  margin: 0 auto 60px auto !important; 
}
.twin-box { 
  height: auto !important; 
}
.left-twin { 
  padding: 24px 16px !important; 
  display: contents !important; /* 让子元素直接成为flex子项 */
}
.twin-text-box {
  display: contents !important; /* 让twin-text-box的子元素直接成为flex子项 */
}
.twin-video, .twin-img { 
  width: 100% !important; 
  height: auto !important; 
  object-fit: cover !important; 
}

/* 移动端：让twin-row内的元素独立显示 */
/* 标题部分（超级轨迹 + 超越导航级的轨迹追踪） */
.twin-text-box > div:first-child {
  order: 1 !important; /* 标题在上 */
  margin-bottom: 20px !important;
  width: 100% !important;
  text-align: center !important; /* 标题居中 */
}

/* 图片/视频在中间 */
.right-twin {
  order: 2 !important; /* 图片在中间 */
  margin: 20px 0 !important;
  width: 100% !important;
}

/* 其他文字内容（传统方案 + 技术创新） */
.twin-text-box > div:not(:first-child) {
  order: 3 !important; /* 其他文字在下面 */
  margin-top: 20px !important;
  width: 100% !important;
  padding: 0 16px !important; /* 只给下面的文字添加左右间距 */
}

/* Fix inline widths/margins inside the left twin content on small screens */
.left-twin .twin-text-box { padding: 8px 0 !important; }
.left-twin .twin-text-box > div { width: 100% !important; height: auto !important; margin: 0 0 12px 0 !important; }
/* 只给下面的文字内容添加左右间距，标题部分不加 */
.left-twin .twin-text-box > div:not(:first-child) { padding: 0 30px !important; }
/* 使用更强的选择器确保生效 */
div.left-twin div.twin-text-box div:not(:first-child) 
div.twin-row div.left-twin div.twin-text-box div:not(:first-child) { line-height: 30px !important; }
/* 覆盖内联样式中的margin-left */
.left-twin .twin-text-box [style*="margin-left: 61px"] { 
  margin-left: 0 !important; 
  padding: 0 16px !important; 
}
/* Collapse side-by-side flex rows into vertical stack */
.left-twin .twin-text-box > div[style*="display: flex"] { display: block !important; }
/* Neutralize hard-coded widths/margins from inline styles */
.left-twin .twin-text-box [style*="width: 590px"] { width: 100% !important; margin-left: 0 !important; }
.left-twin .twin-text-box [style*="width: 120px"] { width: auto !important; height: auto !important; }
.left-twin .twin-text-box [style*="height:210px"] { height: auto !important; }
.left-twin .twin-text-box [style*="padding: 151px"] { padding: 16px !important; }
/* Text blocks */
.left-twin .twin-desc-gray-test { width: 290px !important; height: auto !important; line-height: 30px !important; }
.left-twin .twin-desc-gray-test ul { margin: 0 !important; padding-left: 1em !important; }
.left-twin .twin-title { margin-bottom: 8px !important; }
.left-twin .twin-desc { margin-bottom: 8px !important; line-height: 1.4 !important; }

/* Bottom composite section */
.bottom-box, .bottom-box-2 { height: auto !important; padding: 40px 0 !important; }
.bottom-center-content, .bottom-center-content-2 { width: 100% !important; }
.bottom-content-row { width: 100% !important; height: auto !important; flex-direction: column !important; }
.bottom-left-box, .bottom-right-box, .bottom-right-box-2 {
  position: static !important;
  transform: none !important;
  width: calc(100% - 80px) !important;
  height: auto !important;
  margin: 0 40px 16px 40px !important;
}
.bottom-img { display: block !important; width: 100% !important; height: auto !important; }

/* 移动端视频样式 */
.bottom-video {
  width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
  margin: 0 40px !important;
}

/* 移动端center-video-box样式 */
.center-video-box {
  width: 400px !important;
  margin: 0 auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 30px !important;
  border: none !important;
  box-shadow: none !important;
}

.center-content {
  width: 400px !important;
  height: auto !important;
  border-radius: 30px !important;
  border: none !important;
  box-shadow: none !important;
}

/* 移动端去掉所有卡片的边框和发光效果 */
.center-item {
  border: none !important;
  box-shadow: none !important;
}

.center-item.active {
  border: none !important;
  box-shadow: none !important;
}

/* 移动端去掉所有可能的边框和发光效果 */
.center-item.center,
.center-item.above,
.center-item.below,
.center-item.far {
  border: none !important;
  box-shadow: none !important;
}

.center-list,
.center-list-wrapper {
  border: none !important;
  box-shadow: none !important;
}

/* 移动端标题字体大小 */
.bottom-title {
  font-size: 18px !important;
}

/* 移动端section-title样式 */
.section-title {
  text-align: center !important;
  font-size: 16px !important;
  padding: 40px 34.4px 40px !important;
}

/* 确保移动端下面的内容正常显示 */
.bottom-slider-viewport {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  overflow: visible !important;
}

.bottom-slider-track {
  width: 100% !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

.bottom-image-stack {
  width: 100% !important;
  height: 300px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  margin: 0 !important;
  background: #f6f7f9 !important;
  border-radius: 12px !important;
}

.bottom-image-stack img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  opacity: 0 !important;
  transition: opacity 0.8s ease !important;
  z-index: 1 !important;
}

.bottom-image-stack img.active {
  opacity: 1 !important;
  z-index: 3 !important;
}

.bottom-image-stack img.fade-in {
  opacity: 1 !important;
  z-index: 2 !important;
}

.bottom-image-stack img.fade-out {
  opacity: 0 !important;
  z-index: 1 !important;
}

.bottom-text-slider {
  width: 300px !important;
  height: auto !important;
  min-height: 120px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  overflow: hidden !important;
  margin: 0 auto !important;
}

.bottom-text-slider .bottom-desc-item {
  position: absolute !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0 !important;
  transform: translateX(100px) !important;
  transition: opacity 0.7s ease, transform 0.7s ease !important;
  text-align: center !important;
  padding: 0 16px !important;
  gap: 8px !important;
}

.bottom-text-slider .bottom-desc-item.active {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* 移动端底部数据分析标题样式 */
@media screen and (max-width: 768px) {
  .bottom-desc-title {
    font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-weight: 600 !important;
    font-style: normal !important;
    font-size: 15px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: #262C40 !important;
    margin-bottom: 8px !important;
  }
}

/* 移动端底部数据分析描述文字样式 */
@media screen and (max-width: 768px) {
  .bottom-desc-text {
    width: 156px !important;
    height: 43px !important;
    font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: #000000 !important;
    text-align: left !important;
  }
}

/* 移动端隐藏指示器 */
@media screen and (max-width: 768px) {
  .bottom-indicators {
    display: none !important;
  }
}

.bottom-indicator {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background-color: #ddd !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
}

.bottom-indicator.active {
  background-color: #007bff !important;
  transform: scale(1.2) !important;
}

/* 移动端卡片间距已在上面设置 */

/* 移动端卡片样式 */
.center-list .center-list-wrapper .center-item {
  margin-bottom: 0 !important;
  margin-right: 0 !important;
  transition: all 0.3s ease !important; /* 添加过渡动画 */
  transform: scale(1) !important; /* 默认正常大小 */
  opacity: 0.8 !important; /* 默认稍微透明 */
  filter: brightness(0.8) !important; /* 默认稍微暗一些 */
}

/* 激活状态的卡片放大加高亮 */
.center-list .center-list-wrapper .center-item.active {
  transform: scale(1.05) !important; /* 放大效果 */
  opacity: 1 !important; /* 完全显示 */
  box-shadow: none !important; /* 去掉蓝色高亮阴影 */
  border: none !important; /* 去掉蓝色边框 */
  filter: brightness(1.2) !important; /* 激活时更亮 */
}

/* 使用最强选择器覆盖zhuye.css中的active样式 */
.center-box .center-list .center-list-wrapper .center-item.active {
  transform: scale(1) !important; /* 移动端不放大 */
  opacity: 1 !important;
  box-shadow: none !important; /* 去掉蓝色高亮阴影 */
  border: none !important; /* 去掉蓝色边框 */
  background: transparent !important; /* 移动端无背景色 */
  filter: brightness(1.2) !important; /* 覆盖亮度 */
}

/* 确保非激活状态的卡片都是正常大小 */
.center-box .center-list .center-list-wrapper .center-item:not(.active) {
  transform: scale(1) !important; /* 强制正常大小 */
  opacity: 0.8 !important; /* 稍微透明 */
  filter: brightness(0.8) !important; /* 稍微暗一些 */
}

/* 覆盖所有center-item状态类，确保移动端大小一致 */
.center-box .center-list .center-list-wrapper .center-item.center,
.center-box .center-list .center-list-wrapper .center-item.above,
.center-box .center-list .center-list-wrapper .center-item.below,
.center-box .center-list .center-list-wrapper .center-item.far {
  transform: scale(1) !important; /* 强制所有状态都是正常大小 */
  opacity: 0.8 !important;
  filter: brightness(0.8) !important;
}

/* Promo section */
.promo-content { flex-direction: column !important; gap: 16px !important; padding: 0 16px !important; }
.promo-left, .promo-right { width: 100% !important; min-height: auto !important; }
.promo-chart { height: auto !important; }

/* Flashback block */
.flashback-section { width: 100% !important; max-width: 100% !important; padding: 30px 22px !important; margin: 20px auto !important; }
.flashback-content { width: 100% !important; max-width: 100% !important; flex-direction: column !important; gap: 24px !important; align-items: center !important; padding: 0 !important; }

/* 移动端：让flashback-left内的元素独立显示 */
.flashback-left {
  max-width: 100% !important; 
  text-align: center !important;
  display: contents !important; /* 让子元素直接成为flex子项 */
}

/* 标题区域独立 */
.flashback-header {
  order: 1 !important; /* 标题在最上面 */
  margin-bottom: 20px !important;
  text-align: center !important;
}

/* 手机图片独立 */
.flashback-phone {
  order: 2 !important; /* 图片在中间 */
  margin: 20px 0 !important;
  width: 127px !important;
  height: 275px !important;
}

.flashback-phone .phone-image {
  width: 127px !important;
  height: 275px !important;
  object-fit: contain !important;
}

/* 功能列表独立 */
.feature-list {
  order: 3 !important; /* 功能列表在下面 */
  margin-top: 20px !important;
  text-align: left !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* 增加flashback内容的间距 */
.flashback-header {
  margin-bottom: 20px !important; /* 标题区域下方间距 */
}
.flashback-title {
  margin-bottom: 12px !important; /* 标题下方间距 */
  font-size: 15px !important;
  font-weight: 600;
}
.flashback-subtitle {
  margin-bottom: 36px !important; /* 副标题下方间距 */
  font-size: 13px !important;
  line-height: 1.4 !important;
  font-weight: 500;
}
.feature-list {
  margin-top: 20px !important; /* 功能列表上方间距 */
}
.feature-item {
  margin-bottom: 16px !important; /* 功能项之间的间距 */
  text-align: left !important; /* 左对齐 */
}
.feature-title {
 /* 功能标题下方间距 */
  font-size: 13px !important;
  font-weight: bold !important;
}
.feature-desc {
  font-size: 12px !important;
  line-height: 30px !important;
  color: #333338 !important;
  width: 290px;
}

/* 强制调整flashback布局顺序 - 使用最高优先级 */
div.flashback-content div.flashback-left div.flashback-header {
  order: 1 !important; /* 标题在最上面 */
}
div.flashback-content div.flashback-phone {
  order: 2 !important; /* 图片在中间 */
}
div.flashback-content div.flashback-left div.feature-list {
  order: 3 !important; /* 功能列表在下面 */
}

/* 额外强制规则 - 确保flex布局生效 */
.flashback-content {
  display: flex !important;
  flex-direction: column !important;
}
.flashback-content > * {
  order: unset !important;
}

/* 进步卡片在移动设备上的布局 */
.new-section-box {
  flex-direction: column !important;
  gap: 20px !important;
  align-items: center !important;
  padding: 10px 16px 40px 16px !important;
}

.small-item-box {
  width: 100% !important;
  max-width: 320px !important;
  height: auto !important;
  min-height: 280px !important;
  margin: 0 auto !important;
}

/* 移动端进度区域布局重构 */
@media screen and (max-width: 768px) {
  .progress-section {
    display: flex !important;
    flex-direction: row !important;
    gap: 15px !important;
    align-items: flex-start !important;
  }
  
  /* 左边盒子：包含进度信息和用户头像，上下排列 */
  .progress-left-container {
    display: flex !important;
    flex-direction: column !important;
    /* gap: 10px !important; */
    flex-shrink: 0 !important;
  }
  
  /* 右边：进度描述文字 */
  .progress-description {
    flex: 1 !important;
    text-align: left !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
    color: #000 !important;
    margin-top: 10px;
  }
  
  /* 重新定义progress-bottom在移动端的行为 */
  .progress-bottom {
    display: contents !important;
  }
}

/* 确保进步卡片内部文字对齐正确 */
.progress-top {
  align-items: flex-start !important;
}

.progress-label {
  text-align: left !important;
}

.progress-value {
  justify-content: flex-start !important;
  align-items: baseline !important;
}

/* SkiEdge智能滑雪助手标题和描述的移动端样式 */
@media screen and (max-width: 768px) {
  .title-box {
    height: 120px !important;
    min-height: 120px !important;
    max-height: 120px !important;
  }
  
  .sub-box {
    height: 120px !important;
    min-height: 120px !important;
    max-height: 120px !important;
    padding: 10px 0 !important;
  }
  
  .sub-box-title {
    font-family: PingFang SC !important;
    font-weight: bold !important;
    font-size: 13px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
    text-align: center !important;
  }
  
  .sub-box-desc {
    font-family: PingFang SC !important;
    font-weight: bold !important;
    font-size: 13px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
    text-align: center !important;
  }
}

/* 移动端专用：强制标题居中 - 只针对移动端 */
@media screen and (max-width: 768px) {
  .twin-title, .twin-desc {
    text-align: center !important;
  }
  
  /* 增加移动端twin-desc的宽度 */
  .twin-desc {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* 增加移动端twin-title的宽度 */
  .twin-title {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* 设置移动端center-video-box和center-content的尺寸 */
  .center-video-box {
    width: 348px !important;
    height: 250px !important;
  }
  
  .center-content {
    width: 348px !important;
    height: 250px !important;
    object-fit: cover !important; /* 确保视频完全填充容器，消除灰色部分 */
    will-change: auto !important; /* 优化视频渲染性能 */
    transform: translateZ(0) !important; /* 启用硬件加速 */
  }
  
  /* 使用更强的选择器确保移动端居中 */
  div.twin-text-box div:first-child .twin-title,
  div.twin-text-box div:first-child .twin-desc {
    text-align: center !important;
  }
  
  /* 最强制性的选择器 */
  div.twin-row div.left-twin div.twin-text-box div:first-child div.twin-title,
  div.twin-row div.left-twin div.twin-text-box div:first-child div.twin-desc {
    text-align: center !important;
  }
  
  /* 覆盖内联样式中的padding-left，确保标题居中 */
  .twin-text-box [style*="padding: 151px"] {
    padding: 16px 0 !important; /* 移除左右padding，只保留上下padding */
    text-align: center !important;
  }
}

/* 重复样式已移除 */

/* 激活状态的高亮效果 */
.center-box .center-list .center-list-wrapper .center-item.active {
  transform: scale(1) !important; /* 移动端不放大，保持原始尺寸 */
  opacity: 1 !important; /* 完全显示 */
  filter: brightness(1.2) !important; /* 适度提亮 */
  background: transparent !important; /* 移动端无背景色 */
  border: none !important; /* 去掉蓝色高亮边框 */
  box-shadow: none !important; /* 去掉蓝色发光效果 */
}

/* 强制覆盖所有状态类，确保大小一致 */
.center-box .center-list .center-list-wrapper .center-item.center,
.center-box .center-list .center-list-wrapper .center-item.above,
.center-box .center-list .center-list-wrapper .center-item.below,
.center-box .center-list .center-list-wrapper .center-item.far {
  transform: scale(1) !important; /* 强制所有状态都是正常大小 */
  opacity: 0.7 !important;
  filter: brightness(0.8) !important;
  background: transparent !important; /* 移动端无背景色 */
  border: none !important; /* 去掉边框 */
  box-shadow: none !important; /* 去掉阴影 */
}

/* 移动端激活状态文字样式 */
@media screen and (max-width: 1024px) {
  .center-box .center-list .center-list-wrapper .center-item.active .center-item-title {
    color: #FFFFFF !important; /* 激活状态标题白色 */
    opacity: 1 !important;
  }

  .center-box .center-list .center-list-wrapper .center-item.active .center-item-desc {
    color: #FFFFFF !important; /* 激活状态描述白色 */
    opacity: 1 !important;
  }
  
  .center-box .center-list .center-list-wrapper .center-item:not(.active) .center-item-title {
    color: #CCCCCC !important; /* 非激活状态稍微暗一些 */
    opacity: 0.7 !important;
  }

  .center-box .center-list .center-list-wrapper .center-item:not(.active) .center-item-desc {
    color: #CCCCCC !important; /* 非激活状态稍微暗一些 */
    opacity: 0.7 !important;
  }
}

/* 移动端隐藏右下角图片 */
.bottom-right-box {
  display: none !important;
}

/* 移动端视频容器高度调整 */
.video-container {
  height: auto !important;
  min-height: 250px !important;
  max-height: none !important;
  margin-left: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 20px !important;
  padding: 20px 0 !important;
}

/* 移动端标题样式 */
.ski-tech-title {
  width: 173px !important;
  height: auto !important;
  font-family: PingFang SC !important;
  font-weight: bold !important;
  font-size: 15px !important;
  line-height: 22px !important;
  letter-spacing: -0.41px !important;
  text-align: center !important;
  color: #FFFFFF !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 移动端视频容器尺寸 */
.center-video-box {
  width: 253px !important;
  height: 162px !important;
  margin: 0 auto !important;
}

/* 移动端视频和图片内容尺寸 */
.center-content {
  width: 253px !important;
  height: 162px !important;
  object-fit: cover !important; /* 确保视频和图片按比例填充 */
}

/* 移动端隐藏数据图表 */
.promo-chart {
  display: none !important;
}

/* 移动端隐藏页脚 */
.footer-section {
  display: none !important;
}

/* 移动端去掉头部标题动画效果 */
.title-box {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.sub-box {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.sub-box-title {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.sub-box-desc {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* 去掉所有fade-in-up动画 */
.fade-in-up {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.scale-in {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* 移动端AI模型介绍部分居中 */
@media screen and (max-width: 768px) {
  .promo-section {
    padding: 40px 16px !important;
    height: 700px !important;
    max-height: 700px !important;
    min-height: 700px !important;
  }
  
  .promo-title {
    font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-weight: bold !important;
    font-size: 15px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: #FFFFFF !important;
    text-align: left !important;
  }
  
  .promo-subtitle {
    font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-weight: bold !important;
    font-size: 15px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: #FFFFFF !important;
    text-align: left !important;
  }
}

.promo-content {
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  height: 520px !important;
  gap: 0px !important;
}

.promo-left {
  width: 100% !important;
  max-width: 400px !important;
}

.promo-video {
  width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
}

.promo-right {
  width: 100% !important;
  max-width: 400px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.promo-text-content {
  text-align: center !important;
  width: 150px !important;
  height: 42px !important;
  margin: 0 auto !important;
}

.promo-subtitle {
  font-size: 15px !important;
  margin-bottom: 8px !important;
}

.promo-title {
  font-size: 15px !important;
  margin-bottom: 16px !important;
}

.promo-description {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 24px !important;
}

.promo-button {
  width: 100% !important;
  max-width: 280px !important;
  margin: 0 auto !important;
  padding: 20px 40px !important;
  font-size: 18px !important;
}

.promo-button.mobile-only {
  width: 126px !important;
  height: 32px !important;
  max-width: 126px !important;
  padding: 0 !important;
  margin: 0 auto !important;
  background: #EBFE4B !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 16px !important;
  font-size: 12px !important;
}

/* 移动端优惠码输入框placeholder样式 */
@media screen and (max-width: 768px) {
  .coupon-input::placeholder,
  .form-input.coupon-input::placeholder {
    color: #BFBFBF !important;
    font-family: 'PingFang SC', sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 12px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
  }
}

/* 移动端按钮显示控制 */
.desktop-only {
  display: none !important;
}

.mobile-only {
  display: block !important;
}

/* 移动端隐藏desktop-box，显示mobile-box */
.desktop-box {
  display: none !important;
}

.mobile-box {
  display: flex !important;
  flex-direction: column !important;
}

/* 移动端进度卡片底部区域保持垂直排列 */
.mobile-box .progress-bottom-section {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
}

.mobile-box .progress-bottom-section .progress-description {
  text-align: left !important;
  width: 100% !important;
  margin-left: 0 !important;
  color: #666666 !important;
}

.mobile-box .progress-bottom-section .user-avatar-progress {
  width: 45px !important;
  height: 45px !important;
}

/* 移动端进度标签保持原有样式 */
.mobile-box .progress-label {
  font-family: 'PingFang SC', sans-serif !important;
  font-size: 13px !important;
  font-weight: bold !important;
  font-style: normal !important;
  line-height: 100% !important;
  letter-spacing: -1% !important;
}

/* 移动端进度新值样式 */
.mobile-box .progress-new {
  font-family: 'PingFang SC', sans-serif !important;
  font-size: 15px !important;
  font-weight: bold !important;
  font-style: normal !important;
  line-height: 100% !important;
  color: #000 !important;
}

/* 移动端进度旧值保持原有样式 */
.mobile-box .progress-old {
  font-family: 'PingFang SC', sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  line-height: 100% !important;
  color: #999999 !important;
}

/* 确保center-box支持触摸滑动 */
.center-box {
  touch-action: pan-x pan-y !important; /* 允许水平和垂直滑动 */
  -webkit-overflow-scrolling: touch !important;
  user-select: none !important; /* 防止文字选择 */
  -webkit-user-select: none !important; /* Webkit防止文字选择 */
  -moz-user-select: none !important; /* Firefox防止文字选择 */
  -ms-user-select: none !important; /* IE防止文字选择 */
  -webkit-tap-highlight-color: transparent !important; /* 移除点击高亮 */
  -webkit-touch-callout: none !important; /* 移除长按菜单 */
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
}

/* 防止卡片内文字被选中 */
.center-item-title,
.center-item-desc {
  user-select: none !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  -webkit-tap-highlight-color: transparent !important;
  -webkit-touch-callout: none !important;
}

/* 移动端卡片标题字体样式 */
@media screen and (max-width: 1024px) {
  .center-item-title {
    font-family: 'SF Pro Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
    font-size: 13px !important;
    line-height: 22px !important;
    letter-spacing: -0.41px !important;
    text-align: center !important;
    color: #FFFFFF !important;
    width: 82px !important;
    height: 12px !important;
    margin-bottom: 8px !important; /* 添加下外边距 */
  }
  
  .center-item-desc {
    font-family: 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-weight: 500 !important;
    font-style: normal !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: #FFFFFF !important;
    text-align: left !important;
    width: 242px !important;
    height: 30px !important;
    word-wrap: break-word !important; /* 自动换行 */
    white-space: normal !important; /* 允许换行 */
  }
}

/* PC端强制隐藏mobile-only按钮 */
@media (min-width: 1025px) {
  .promo-button.mobile-only {
    display: none !important;
  }
}

