/** Shopify CDN: Minification failed

Line 530:0 Unexpected "}"
Line 533:2 Unexpected "0%"
Line 534:2 Unexpected "100%"

**/
.swiper-kv-banner-tr {
  position: relative;
  width: 100%;
  max-width: var(--pc-max);
  margin: 0 auto;
  overflow: hidden;
  height: var(--pc-height);

  /* 初始状态：隐藏 + 向上 */
.swiper-slide .slide-content-text-box > * {
  opacity: 0;
  transform: translateY(-20px);
  transition:
    opacity 0.5s ease,
    transform 0.6s ease;
}

/* 激活状态：显示 */
.swiper-slide.is-animating .slide-content-text-box > * {
  opacity: 1;
  transform: translateY(0);
}


.swiper-slide.is-animating .slide-content-text-box > *:nth-child(1) {
  transition-delay: 0.5s;
}
.swiper-slide.is-animating .slide-content-text-box > *:nth-child(2) {
  transition-delay: 0.6s;
}
.swiper-slide.is-animating .slide-content-text-box > *:nth-child(3) {
  transition-delay: 0.7s;
}
.swiper-slide.is-animating .slide-content-text-box > *:nth-child(4) {
  transition-delay: 0.8s;
}
.swiper-slide.is-animating .slide-content-text-box > *:nth-child(5) {
  transition-delay: 0.9s;
}

/* 默认：非当前 slide 的进度条（短） */
.swiper-pagination-bullet-item .pagination-bullet-progress {
  width: 20px !important;          /* 非激活时的短长度 */
  transition: width 0.3s ease;
}

/* 当前激活 slide：进度条恢复完整长度 */
.swiper-pagination-bullet-item.swiper-pagination-bullet-active
.pagination-bullet-progress {
  width: 87px !important;          /* 或者你原本设计的宽度 */
}



  @media (min-width: 810px) and (max-width: 1199.9px) {
    height: var(--pad-height);
  }

  @media (max-width: 809.9px) {
    height: var(--mob-height);
  }

  & .swiper {
    width: 100%;
    height: 100%;

    &:hover {
      & .swiper-button-prev,
      & .swiper-button-next {
        opacity: 1;
      }
    }

    & .swiper-wrapper {
      height: 100%;

      & .swiper-slide-link {
        display: block;
        width: 100%;
        height: 100%;
        text-decoration: none;
      }

      & .swiper-slide {
        position: relative;
        width: 100%;
        height: 100%;

        @media (min-width: 1200px) {
          &.pc-top-center {
            & .slide-content {
              & .slide-content-text-box {
                top: var(--spacing-64);
                left: 50%;
                transform: translateX(-50%);
              }
            }
          }

          &.pc-middle-right {
            & .slide-content {
              & .slide-content-text-box {
                top: 50%;
                left: auto;
                right: var(--grid-margin);
                transform: translateY(-50%);
              }
            }
          }

          &.pc-bottom-center {
            & .slide-content {
              & .slide-content-text-box {
                top: auto;
                bottom: var(--spacing-64);
                left: 50%;
                transform: translateX(-50%);
              }
            }
          }

          &.pc-center-center {
            & .slide-content {
              & .slide-content-text-box {
                top: 50%;
                bottom: auto;
                left: 50%;
                transform: translate(-50%, -50%);
              }
            }
          }

          &.pc-align-center {
            & .slide-content {
              & .slide-content-text-box {
                align-items: center;
                text-align: center;
              }
            }
          }

          &.pc-align-right {
            & .slide-content {
              & .slide-content-text-box {
                align-items: flex-end;
                text-align: right;
              }
            }
          }
        }

        @media (min-width: 810px) and (max-width: 1199.9px) {
          &.pad-top-center {
            & .slide-content {
              & .slide-content-text-box {
                top: var(--spacing-40);
                left: 50%;
                transform: translateX(-50%);
              }
            }
          }

          &.pad-middle-right {
            & .slide-content {
              & .slide-content-text-box {
                top: 50%;
                left: auto;
                right: var(--grid-margin);
                transform: translateY(-50%);
              }
            }
          }

          &.pad-bottom-center {
            & .slide-content {
              & .slide-content-text-box {
                top: auto;
                bottom: var(--spacing-64);
                left: 50%;
                transform: translateX(-50%);
              }
            }
          }

          &.pad-center-center {
            & .slide-content {
              & .slide-content-text-box {
                top: 50%;
                bottom: auto;
                left: 50%;
                transform: translate(-50%, -50%);
              }
            }
          }

          &.pad-align-center {
            & .slide-content {
              & .slide-content-text-box {
                align-items: center;
                text-align: center;
              }
            }
          }

          &.pad-align-right {
            & .slide-content {
              & .slide-content-text-box {
                align-items: flex-end;
                text-align: right;
              }
            }
          }
        }

        @media (max-width: 809.9px) {
          & .slide-content {
            & .slide-content-text-box {
              width: 100%;
            }
          }
          
          &.mob-top-center {
            & .slide-content {
              & .slide-content-text-box {
                top: var(--spacing-48);
                left: 50%;
                transform: translateX(-50%);
              }
            }
          }

          &.mob-middle-right {
            & .slide-content {
              & .slide-content-text-box {
                top: 50%;
                left: auto;
                right: 0;
                transform: translateY(-50%);
              }
            }
          }

          &.mob-bottom-center {
            & .slide-content {
              & .slide-content-text-box {
                top: auto;
                bottom: var(--spacing-64);
                left: 50%;
                transform: translateX(-50%);
              }
            }
          }

          &.mob-center-center {
            & .slide-content {
              & .slide-content-text-box {
                top: 50%;
                bottom: auto;
                left: 50%;
                transform: translate(-50%, -50%);
              }
            }
          }

          &.mob-align-center {
            & .slide-content {
              & .slide-content-text-box {
                align-items: center;
                text-align: center;
              }
            }
          }

          &.mob-align-right {
            & .slide-content {
              & .slide-content-text-box {
                align-items: flex-end;
                text-align: right;
              }
            }
          }
        }

        & .slide-video-container {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          overflow: hidden;

          & .slide-video {
            width: 100%;
            height: 100%;
            object-fit: cover;

            &.pad-video {
              display: none;
            }

            &.mob-video {
              display: none;
            }
          }
        }

        @media (min-width: 810px) and (max-width: 1199.9px) {
          & .slide-video-container {
            & .slide-video {
              & .pc-video {
                display: none;
              }
              & .pad-video {
                display: block;
              }
              & .mob-video {
                display: none;
              }
            }
          }

        }

        @media (max-width: 809.9px) {
          & .slide-video-container {
            & .slide-video {
              & .pc-video {
                display: none;
              }
              & .pad-video {
                display: none;
              }
              & .mob-video {
                display: block;
              }
            }
          }
        }
      }

      & .slide-image-tr {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;

        & .slide-image__img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          object-position: center;
        }
      }

      & .slide-content {
        height: 100%;
        position: relative;

        & .slide-content-text-box {
          width: auto;
          min-width: 60%;
          position: absolute;
          top: 50%;
          left: 0;
          padding: 0 var(--grid-margin);
          transform: translateY(-50%);
          z-index: 1;
          display: flex;
          flex-direction: column;
        }

        & .new-text {
          color: var(--red-1-default);
          margin-bottom: var(--spacing-4);

          @media (max-width: 809.9px) {
            margin-top: -20px;
          }
        }

        & .slide-title {
          color: var(--gray-1);
          margin-bottom: var(--spacing-24);
          
          @media (max-width: 1199.9px) {
            margin-bottom: var(--spacing-16);
          }
        }

        & .slide-subtitle {
          color: var(--gray-80);
          margin-bottom: var(--spacing-8);
        }

        & .slide-text {
          color: var(--gray-60);
          margin-bottom: var(--spacing-40);
          
          @media (min-width: 810px) and (max-width: 1199.9px) {
            margin-bottom: var(--spacing-32);
          }

          @media (max-width: 809.9px) {
            margin-bottom: var(--spacing-24);
          }
        }

        & .slide-button-group {
          display: flex;
          gap: var(--spacing-16);
        }
      }
    }
  }

  & .swiper-button-prev,
  & .swiper-button-next {
    opacity: 0;
    transition: opacity 0.3s ease;

    @media (max-width: 1199.9px) {
      display: none;
    }

    &:after {
      display: none;
    }
  }

  & .swiper-button-prev {
    left: var(--spacing-20);
  }

  & .swiper-button-next {
    right: var(--spacing-20);
  }

  & .swiper-pagination {
    position: absolute;
    bottom: var(--spacing-32);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: var(--spacing-8);
    z-index: 2;

    @media (max-width: 1199.9px) {
      bottom: var(--spacing-24);
    }

    & .swiper-pagination-bullet-item {
      height: auto;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: var(--spacing-8);
      cursor: pointer;
      transition: opacity 0.3s ease;
      border-radius: 0;
      background: transparent;
      opacity: 1;
      /* width: 100%; */
      /* max-width: 20px; */
      width: auto;        /* ✅ 由内容决定宽度 */
      flex: 0 0 auto;     /* ✅ 禁止被拉伸 */

      @media (max-width: 1199.9px) {
        width: auto;
      }

      &.swiper-pagination-bullet-active {
        & .pagination-bullet-progress {
          @media (max-width: 1199.9px) {
            width: 87px;
          }
        }
      }

      &.initial-show .pagination-bullet-text {
        opacity: 1 !important;
      }

      &:hover .pagination-bullet-text {
        opacity: 1;
      }

      & .pagination-bullet-text {
        color: var(--gray-0);
        transition: opacity 0.3s ease;
        opacity: 0;

          display: none;
        }
      }

      & .pagination-bullet-progress {
        position: relative;
        height: 4px;
        background: rgba(217, 217, 217, 0.50);
        border-radius: var(--rounded-capsule);
        width: 100%;

        @media (max-width: 1199.9px) {
          width: var(--spacing-24);
        }

        & .pagination-bullet-progress-bar {
          position: absolute;
          top: 0;
          left: 0;
          height: 100%;
          background-color: var(--gray-0);
          width: 0;
          border-radius: var(--rounded-capsule);
          display: block;
        }
      }
    }
  }
}

@keyframes progress {
  0% { width: 0; }
  100% { width: 100%; }
}