/* 响应式适配不同PC屏幕尺寸 */

/* 小屏幕 PC (1366px 及以下) */
@media screen and (max-width: 1366px) {
  .page {
    max-width: 100vw;
    width: 100%;
    transform: scale(0.8);
    transform-origin: top center;
  }
  
  .group_1, .group_3, .group_5, .group_11 {
    width: 100%;
    max-width: none;
  }
  
  /* 调整背景图片大小 */
  .block_1, .block_2, .block_3, .block_4 {
    background-size: cover;
    background-position: center;
  }
  
  /* 优化合作伙伴logo显示 */
  .section_1, .section_2, .section_3, .section_4, .section_5 {
    justify-content: center;
    gap: 0.5rem;
  }
  
  .section_1 > div, .section_2 > div, .section_3 > div, .section_4 > div, .section_5 > div {
    flex: 0 0 auto;
    min-width: 6rem;
  }
}

/* 标准屏幕 PC (1367px - 1600px) */
@media screen and (min-width: 1367px) and (max-width: 1600px) {
  .page {
    max-width: 100vw;
    width: 100%;
    transform: scale(0.9);
    transform-origin: top center;
  }
  
  /* 背景图片适配 */
  .text-wrapper_1, .block_5, .text-wrapper_3 {
    background-size: cover;
    background-position: center;
  }
}

/* 大屏幕 PC (1601px - 1920px) */
@media screen and (min-width: 1601px) and (max-width: 1920px) {
  .page {
    max-width: 100vw;
    width: 100%;
    margin: 0 auto;
  }
  
  /* 保持原始比例 */
  .image_1, .image_2 {
    max-width: 100%;
    height: auto;
    object-fit: cover;
  }
}

/* 超大屏幕 PC (1921px - 2560px) */
@media screen and (min-width: 1921px) and (max-width: 2560px) {
  .page {
    max-width: 1920px;
    width: 100%;
    margin: 0 auto;
    transform: scale(1.1);
    transform-origin: top center;
  }
  
  /* 防止内容过小 */
  body {
    min-height: 100vh;
  }
  
  /* 高分辨率图片优化 */
  .image_1, .image_2 {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
}

/* 4K和更大屏幕 (2561px 及以上) */
@media screen and (min-width: 2561px) {
  .page {
    max-width: 1920px;
    width: 100%;
    margin: 0 auto;
    transform: scale(1.3);
    transform-origin: top center;
  }
  
  body {
    min-height: 100vh;
    background-color: #f5f5f5;
  }
  
  /* 4K屏幕图片优化 */
  img {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
  }
}

/* 通用响应式规则 */
@media screen and (max-width: 1440px) {
  /* 小屏幕优化字体 */
  .text_1, .text_2, .text_3 {
    font-size: calc(var(--base-font-size, 0.8rem) * 1.1);
  }
  
  /* 调整按钮和交互元素 */
  .text-wrapper_2 {
    width: auto;
    min-width: 6rem;
    padding: 0.2rem 1rem;
  }
  
  /* 卡片布局优化 */
  .block_2, .block_3, .block_4 {
    position: relative;
    left: auto;
    top: auto;
    margin: 1rem auto;
    display: block;
  }
}

@media screen and (min-width: 2560px) {
  /* 大屏幕优化字体 */
  .text_1, .text_2, .text_3 {
    font-size: calc(var(--base-font-size, 0.8rem) * 0.9);
  }
  
  /* 保持合适的行高 */
  .text_17 {
    line-height: 1.4;
  }
}

/* 横向滚动优化 */
@media screen and (max-width: 1200px) {
  .section_1, .section_2, .section_3, .section_4, .section_5 {
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: thin;
    scrollbar-color: rgba(107, 54, 239, 0.3) transparent;
  }
  
  .section_1::-webkit-scrollbar, 
  .section_2::-webkit-scrollbar, 
  .section_3::-webkit-scrollbar, 
  .section_4::-webkit-scrollbar, 
  .section_5::-webkit-scrollbar {
    height: 6px;
  }
  
  .section_1::-webkit-scrollbar-thumb, 
  .section_2::-webkit-scrollbar-thumb, 
  .section_3::-webkit-scrollbar-thumb, 
  .section_4::-webkit-scrollbar-thumb, 
  .section_5::-webkit-scrollbar-thumb {
    background-color: rgba(107, 54, 239, 0.3);
    border-radius: 3px;
  }
  
  .section_1 > div, .section_2 > div, .section_3 > div, .section_4 > div, .section_5 > div {
    display: inline-block;
    white-space: normal;
    vertical-align: top;
  }
}

/* 确保图片响应式 */
img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* 背景图片响应式 */
[style*="background-image"], 
.text-wrapper_1,
.block_1,
.block_2,
.block_3,
.block_4,
.block_5,
.text-wrapper_3,
.group_11,
.section_6,
.section_7 {
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* 弹性布局优化 */
.flex-row {
  flex-wrap: wrap;
}

@media screen and (max-width: 1366px) {
  .flex-row.group_4 {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  
  .flex-row.justify-between {
    gap: 1rem;
    justify-content: center;
  }
}

/* 容器宽度自适应 */
@media screen and (max-width: 1600px) {
  .text-wrapper_1,
  .block_1,
  .group_2,
  .block_5,
  .text-wrapper_3 {
    width: 100% !important;
    max-width: 100vw;
  }
}

/* 保持纵横比的图片容器 */
.image-wrapper_1,
.image-wrapper_2,
.image-wrapper_3,
.image-wrapper_4 {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.image-wrapper_1 img,
.image-wrapper_2 img,
.image-wrapper_3 img,
.image-wrapper_4 img {
  object-fit: contain;
  max-width: 100%;
  max-height: 100%;
}