main {
  background: #0B0816;
  background-image: url("../../img/common/audio-converter/background-1.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
}
.banner {
  padding: 124px 0 84px 0;
  margin-bottom: 142px;
  background-image: url("../../img/common/audio-converter/banner-background.png");
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.banner-content {
  display: flex;
  justify-content: space-between;
}
.banner-content .banner-left {
  margin-top: 35px;
  flex: 0 0 488px;
}
.banner-content .banner-left h1 {
  color: #FFF;
  font-size: 40px;
  line-height: 1.1;
  margin-bottom: 14px;
}
.banner-content .banner-left .banner-desc {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-left: 18px;
  margin-bottom: 46px;
}
.banner-content .banner-left .banner-desc .banner-list {
  color: #FFF;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  list-style: disc;
}
.banner-content .banner-left .banner-btn-group {
  display: flex;
  align-items: center;
  gap: 16px;
}
.banner-content .banner-left .banner-btn-group .win-btn,
.banner-content .banner-left .banner-btn-group .mac-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 32px;
  border-radius: 43px;
  position: relative;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
  background: linear-gradient(270deg, #765BFF 0%, #AB4FFF 25%, #FF4DD9 50%, #AB4FFF 75%, #765BFF 100%);
  background-size: 200% 100%;
  background-position: 100% 0;
}
.banner-content .banner-left .banner-btn-group .win-btn i,
.banner-content .banner-left .banner-btn-group .mac-btn i {
  color: #FFF;
  font-size: 22px;
}
.banner-content .banner-left .banner-btn-group .win-btn span,
.banner-content .banner-left .banner-btn-group .mac-btn span {
  color: #FFF;
  text-align: center;
  font-size: 20px;
  font-weight: 500;
}
.banner-content .banner-left .banner-btn-group .win-btn:hover,
.banner-content .banner-left .banner-btn-group .mac-btn:hover,
.banner-content .banner-left .banner-btn-group .win-btn:active,
.banner-content .banner-left .banner-btn-group .mac-btn:active {
  transform: translateY(-3px);
  background-position: 0% 0;
}
.banner-content .banner-right {
  flex: 0 1 100%;
}
.banner-content .banner-right img {
  margin-right: 15px;
  width: clamp(300px, 50vw, 678px);
  height: clamp(225px, 37.5vw, 508px);
  object-fit: contain;
}
.scenarios {
  padding-bottom: 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.scenarios-container h2 {
  color: #FFF;
  text-align: center;
  font-size: 40px;
  line-height: 1.2;
  margin-bottom: 24px;
}
.scenarios-container .scenarios-desc {
  color: #FFF;
  text-align: center;
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 62px;
}
.scenarios-circle {
  max-width: 1640px;
  width: 100%;
  border-radius: 1200px;
  background: linear-gradient(0deg, #000 0%, #000 100%), linear-gradient(142deg, #10032A 10.71%, #000 22.1%);
  box-shadow: 0 4px 117.4px 0 rgba(75, 9, 190, 0.34);
  padding: 63px 0 90px 0;
}
.scenarios-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.scenarios-content .scenarios-select {
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(592px, 60vw, 864px);
  border-radius: 80px;
  background: #161616;
  color: #FFF;
  text-align: center;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.33px;
  margin-bottom: 56px;
  position: relative;
}
.scenarios-content .scenarios-select::before {
  content: '';
  position: absolute;
  width: clamp(148px, 25%, 216px);
  height: calc(100% - 8px);
  border-radius: 40px;
  background: linear-gradient(270deg, #AB4FFF 0%, #FF4DD9 100%);
  left: 0px;
  top: 4px;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateX(0);
  z-index: 0;
}
.scenarios-content .scenarios-select[data-active="0"]::before {
  transform: translateX(0);
}
.scenarios-content .scenarios-select[data-active="1"]::before {
  transform: translateX(100%);
}
.scenarios-content .scenarios-select[data-active="2"]::before {
  transform: translateX(200%);
}
.scenarios-content .scenarios-select[data-active="3"]::before {
  transform: translateX(300%);
}
.scenarios-content .scenarios-select .scenarios-option {
  width: clamp(148px, 25%, 216px);
  padding: 22px 0;
  border-radius: 40px;
  background: transparent;
  color: #FFF;
  font-size: 20px;
  font-weight: 500;
  cursor: pointer;
  transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 1;
}
.scenarios-content .scenarios-select .scenarios-option:hover {
  color: #FFF;
}
.scenarios-content .scenarios-select .scenarios-option.active {
  color: #FFF;
}
.scenarios-content .scenarios-card-group {
  position: relative;
}
.scenarios-content .scenarios-card-group .scenarios-cards {
  display: none;
  border-radius: 18px;
  position: absolute;
  top: 0;
  left: 0;
  max-width: 898px;
  width: 100%;
}
.scenarios-content .scenarios-card-group .scenarios-cards img {
  width: 100%;
}
.scenarios-content .scenarios-card-group .scenarios-cards .scenarios-text {
  max-width: 898px;
  color: #323232;
  text-align: center;
  font-size: 16px;
  text-align: left;
  border-radius: 0 0 18px 18px;
  background: #FFF;
  padding: 18px 22px;
  line-height: 1.8;
}
.scenarios-content .scenarios-card-group .scenarios-cards.active {
  display: block;
  position: relative;
}
.scenarios-content .scenarios-card-group-mobile {
  display: none;
}
.convert {
  padding-bottom: 160px;
}
.convert-content {
  display: flex;
  flex-direction: column;
  gap: 100px;
}
.convert-content .convert-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.convert-content .convert-top .convert-top-img {
  max-width: 492px;
  width: 100%;
}
.convert-content .convert-top .convert-top-img img {
  width: 100%;
}
.convert-content .convert-top .convert-top-text {
  max-width: 470px;
  width: 100%;
}
.convert-content .convert-top .convert-top-text h2 {
  color: #FFF;
  font-size: 40px;
  line-height: 1.2;
  margin-bottom: 20px;
}
.convert-content .convert-top .convert-top-text .convert-top-desc {
  color: #FFF;
  font-size: 16px;
  line-height: 1.8;
}
.convert-content .convert-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.convert-content .convert-bottom .convert-bottom-img {
  max-width: 492px;
  width: 100%;
}
.convert-content .convert-bottom .convert-bottom-img img {
  width: 100%;
}
.convert-content .convert-bottom .convert-bottom-text {
  max-width: 470px;
  width: 100%;
}
.convert-content .convert-bottom .convert-bottom-text h2 {
  color: #FFF;
  font-size: 40px;
  line-height: 1.2;
  margin-bottom: 20px;
}
.convert-content .convert-bottom .convert-bottom-text .convert-bottom-desc {
  color: #FFF;
  font-size: 16px;
  line-height: 1.8;
}
.save {
  padding-bottom: 160px;
}
.save-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.save-content h2 {
  color: #FFF;
  text-align: center;
  font-size: 40px;
  line-height: 1.2;
  margin: 0 0 20px 0;
}
.save-content .save-desc {
  max-width: 848px;
  color: #FFF;
  text-align: center;
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 54px;
}
.save-content .save-group {
  display: flex;
  gap: 20px;
}
.save-content .save-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 163px;
  border-radius: 12px;
  border: 1px solid #d07eff3c;
  background: rgba(30, 13, 85, 0.4);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 20px 0 26px 0;
  transition: all 0.3s ease;
  cursor: pointer;
}
.save-content .save-card .save-title {
  color: #FFF;
  text-align: center;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
  margin: 20px 0 6px 0;
}
.save-content .save-card .save-card-desc {
  color: #FFF;
  text-align: center;
  font-size: 12px;
  line-height: 1.6;
}
.save-content .save-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 18px 33px 0 rgba(117, 37, 255, 0.28);
}
.save-content .card-1 {
  background-image: url("../../img/common/audio-converter/save-slide-background-1.png");
}
.save-content .card-2 {
  background-image: url("../../img/common/audio-converter/save-slide-background-2.png");
}
.save-content .card-3 {
  background-image: url("../../img/common/audio-converter/save-slide-background-3.png");
}
.save-content .card-4 {
  background-image: url("../../img/common/audio-converter/save-slide-background-4.png");
}
.save-content .card-5 {
  background-image: url("../../img/common/audio-converter/save-slide-background-5.png");
}
.save-content .card-6 {
  background-image: url("../../img/common/audio-converter/save-slide-background-6.png");
}
.save-content .save-swiper {
  display: none;
}
.feature {
  padding-bottom: 160px;
  position: relative;
}
.feature::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  height: 1925px;
  width: 945px;
  background-image: url("../../img/common/audio-converter/background-2.png");
  background-repeat: no-repeat;
  background-size: contain;
}
.feature-content h2 {
  color: #FFF;
  font-size: 40px;
  text-align: center;
  line-height: 1.2;
  margin-bottom: 36px;
}
.feature-content .feature-group {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 28px;
}
.feature-content .feature-group .feature-card {
  width: 340px;
  height: 248px;
  padding: 26px 33px 0 30px;
  border-radius: 16px;
  border: 1.5px solid rgba(222, 191, 255, 0.42);
  background: linear-gradient(131deg, rgba(135, 72, 184, 0.45) -1.27%, rgba(46, 37, 82, 0.45) 96.48%);
}
.feature-content .feature-group .feature-card-title {
  margin: 16px 0 6px 0;
  color: #FFF;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
}
.feature-content .feature-group .feature-card-desc {
  color: #FFF;
  font-size: 16px;
  line-height: 1.6;
}
.feature-content .feature-swiper {
  display: none;
}
.enhance {
  padding-bottom: 160px;
}
.enhance-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.enhance-content h2 {
  color: #FFF;
  text-align: center;
  font-size: 40px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 38px;
}
.enhance-content .enhance-select {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.enhance-content .enhance-select .enhance-option {
  max-width: 312px;
  width: 100%;
  padding-bottom: 14px;
  margin-bottom: 42px;
  cursor: pointer;
  position: relative;
  transition: all 0.3s ease;
}
.enhance-content .enhance-select .enhance-option::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: #8E8E8E;
  transition: width 0.3s ease;
}
.enhance-content .enhance-select .enhance-option.active::after {
  width: 312px;
}
.enhance-content .enhance-select .enhance-option .step-num {
  color: #FFF;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 10px;
  transition: all 0.3s ease;
}
.enhance-content .enhance-select .enhance-option.active .step-num {
  background: linear-gradient(120deg, #CC3FFF 0%, #AB61FF 25%, #6835FF 35%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.enhance-content .enhance-select .enhance-option .step-desc {
  color: rgba(255, 255, 255, 0.93);
  font-size: 16px;
  line-height: 1.3;
  opacity: 0.5;
}
.enhance-content .enhance-select .enhance-option .desc-short {
  max-width: 214px;
}
.enhance-content .enhance-select .enhance-option.active .step-desc {
  opacity: 1;
}
.enhance-content .enhance-card-group {
  position: relative;
  width: 100%;
}
.enhance-content .enhance-card-group .enhance-card {
  display: none;
  max-width: 774px;
  width: 100%;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.enhance-content .enhance-card-group .enhance-card img {
  width: 100%;
  border-radius: 14px;
}
.enhance-content .enhance-card-group .enhance-card.active {
  display: block;
  position: relative;
  left: auto;
  transform: none;
}
.enhance-content .enhance-mobile {
  display: none;
}
.user {
  padding-bottom: 128px;
  background-image: url("../../img/common/audio-converter/user-background.png");
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
}
.user-content h2 {
  color: #FFF;
  text-align: center;
  font-size: 40px;
  line-height: 1.2;
  margin-bottom: 48px;
}
.user-content .user-card-group {
  display: flex;
  justify-content: space-between;
  gap: 5px;
}
.user-content .user-card-group .user-card {
  padding: 20px 16px 18px 22px;
  border-radius: 13px;
  background: linear-gradient(180deg, #4B2CD4 0%, #7542DB 100%);
  box-shadow: 0 17px 33px -7px rgba(60, 46, 143, 0.03);
  max-width: 330px;
  width: 100%;
}
.user-content .user-card-group .user-card-top {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-bottom: 23px;
  background-image: url("../../img/common/audio-converter/user-dot.png");
  background-repeat: no-repeat;
  background-size: 67px 58px;
  background-position: top right;
  position: relative;
}
.user-content .user-card-group .user-card-top::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  width: auto;
  background: linear-gradient(90deg, rgba(224, 213, 255, 0) 0%, #E0D5FF 48.56%, rgba(224, 213, 255, 0) 100%);
}
.user-content .user-card-group .user-card-top .top-left {
  max-width: 92px;
  width: 100%;
}
.user-content .user-card-group .user-card-top .top-left img {
  width: 100%;
}
.user-content .user-card-group .user-card-top .top-right {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user-content .user-card-group .user-card-top .top-right .user-name {
  color: #FFF;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
}
.user-content .user-card-group .user-card-top .top-right .stars {
  display: flex;
  gap: 8px;
}
.user-content .user-card-group .user-card-bottom {
  color: #FFF;
  font-size: 16px;
  line-height: 1.6;
  padding-top: 23px;
}
.user-content .user-swiper {
  display: none;
}
@media (max-width: 1680px) {
  .scenarios-circle {
    margin: 0 30px;
  }
}
@media (max-width: 1540px) {
  .scenarios-circle {
    border-radius: 400px;
  }
}
@media (max-width: 1400px) {
  .scenarios-circle {
    border-radius: 0;
    background: #0B0816;
    box-shadow: 0 4px 117.4px 0 rgba(75, 9, 190, 0);
    padding: 0;
  }
}
@media (max-width: 1200px) {
  .save-content .save-group {
    display: grid;
    grid-template-columns: repeat(3, 2fr);
    align-items: center;
    justify-items: center;
  }
  .enhance-content .enhance-select .enhance-option .step-desc {
    font-size: 14px;
  }
  .enhance-content .enhance-select .enhance-option .desc-middle {
    max-width: 200px;
  }
  .enhance-content .enhance-select .enhance-option.active::after {
    width: 200px;
  }
}
@media (max-width: 1100px) {
  .banner {
    padding: 124px 0 64px 0;
    margin-bottom: 82px;
  }
  .banner-content {
    flex-direction: column;
    align-items: center;
    gap: 60px;
  }
  .banner-content .banner-left {
    margin-top: 0;
    flex: 1;
    max-width: 488px;
    width: 100%;
  }
  .banner-content .banner-left .banner-btn-group {
    justify-content: center;
  }
  .banner-content .banner-right {
    flex: 0;
    max-width: 516px;
    width: 100%;
  }
  .banner-content .banner-right img {
    margin-right: 0;
    width: 100%;
  }
}
@media (max-width: 768px) {
  main {
    background-image: none;
  }
  .banner {
    padding: 62px 0 68px 0;
    margin-bottom: 49px;
    background-image: url("../../img/common/audio-converter/banner-background-mobile.png");
    background-position: bottom;
  }
  .banner-content {
    gap: 58px;
  }
  .banner-content .banner-left h1 {
    text-align: center;
    font-size: 42px;
  }
  .banner-content .banner-left .banner-desc {
    margin-left: 18px;
    margin-bottom: 36px;
  }
  .banner-content .banner-left .banner-desc .banner-list {
    font-size: 14px;
  }
  .banner-content .banner-left .banner-btn-group {
    display: flex;
    align-items: center;
    gap: 14px;
  }
  .banner-content .banner-left .banner-btn-group .win-btn,
  .banner-content .banner-left .banner-btn-group .mac-btn {
    gap: 8px;
    padding: 13px 27px;
    border-radius: 37px;
  }
  .banner-content .banner-left .banner-btn-group .win-btn i,
  .banner-content .banner-left .banner-btn-group .mac-btn i {
    font-size: 20px;
  }
  .banner-content .banner-left .banner-btn-group .win-btn span,
  .banner-content .banner-left .banner-btn-group .mac-btn span {
    font-size: 18px;
  }
  .scenarios {
    padding-bottom: 144px;
  }
  .scenarios-container {
    max-width: 480px;
  }
  .scenarios-container h2 {
    text-align: left;
    font-size: 32px;
    margin-bottom: 14px;
  }
  .scenarios-container .scenarios-desc {
    text-align: left;
    font-size: 14px;
    margin-bottom: 41px;
  }
  .scenarios-circle {
    border-radius: 0;
    background: #0B0816;
    box-shadow: 0 4px 117.4px 0 rgba(75, 9, 190, 0);
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .scenarios-content {
    max-width: 480px;
  }
  .scenarios-content .scenarios-select {
    display: none;
  }
  .scenarios-content .scenarios-card-group {
    display: none;
  }
  .scenarios-content .scenarios-card-group-mobile {
    display: block;
    width: 100%;
  }
  .scenarios-content .scenarios-swiper {
    padding-bottom: 28px;
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
  }
  .scenarios-content .scenarios-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
    align-items: flex-start;
  }
  .scenarios-content .scenarios-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 480px;
    width: 100%;
    flex-shrink: 0;
    height: auto;
    position: relative;
    transition-property: transform;
  }
  .scenarios-content .scenarios-slide .scenarios-small-title {
    color: #FFF;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.214px;
    padding: 10px 22px;
    margin-bottom: 18px;
    border-radius: 32px;
    background: linear-gradient(90deg, #EE4CDF 0%, #9254EE 100%);
  }
  .scenarios-content .scenarios-slide img {
    width: 100%;
  }
  .scenarios-content .scenarios-slide .scenarios-slide-desc {
    border-radius: 0 0 12px 12px;
    background: #FFF;
    padding: 14px 15px;
    width: 100%;
    min-height: 133px;
    color: #323232;
    text-align: center;
    font-size: 14px;
    line-height: 1.5;
  }
  .scenarios-content .scenarios-pagination {
    position: absolute;
    text-align: center;
    transition: 0.3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .scenarios-content .scenarios-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.18);
    opacity: 1;
    margin: 0 4px;
    transition: all 0.3s ease;
    display: inline-block;
    cursor: pointer;
  }
  .scenarios-content .scenarios-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.74);
    width: 20px;
  }
  .convert {
    padding-bottom: 94px;
  }
  .convert-content {
    gap: 86px;
  }
  .convert-content .convert-top {
    flex-direction: column;
    gap: 22px;
  }
  .convert-content .convert-top .convert-top-img {
    max-width: 480px;
  }
  .convert-content .convert-top .convert-top-text {
    max-width: 480px;
  }
  .convert-content .convert-top .convert-top-text h2 {
    font-size: 32px;
    margin-bottom: 18px;
  }
  .convert-content .convert-top .convert-top-text .convert-top-desc {
    font-size: 14px;
  }
  .convert-content .convert-bottom {
    flex-direction: column;
    gap: 22px;
  }
  .convert-content .convert-bottom .convert-bottom-img {
    max-width: 480px;
    order: 2;
  }
  .convert-content .convert-bottom .convert-bottom-text {
    max-width: 480px;
    order: 1;
  }
  .convert-content .convert-bottom .convert-bottom-text h2 {
    font-size: 32px;
    margin-bottom: 18px;
  }
  .convert-content .convert-bottom .convert-bottom-text .convert-bottom-desc {
    font-size: 14px;
  }
  .save {
    padding-bottom: 94px;
    display: flex;
    justify-content: center;
  }
  .save-content {
    max-width: 480px;
    align-items: flex-start;
  }
  .save-content h2 {
    text-align: center;
    font-size: 32px;
    margin-bottom: 18px;
  }
  .save-content .save-desc {
    text-align: center;
    font-size: 14px;
    margin-bottom: 60px;
  }
  .save-content .save-group {
    width: 100%;
    grid-template-columns: repeat(2, 3fr);
  }
  .feature {
    padding-bottom: 148px;
  }
  .feature::after {
    display: none;
  }
  .feature-content {
    max-width: 340px;
    margin: 0 auto;
  }
  .feature-content h2 {
    font-size: 32px;
    margin-bottom: 20px;
  }
  .feature-content .feature-group {
    display: none;
  }
  .feature-content .feature-swiper {
    display: block;
    position: relative;
    padding-bottom: 50px;
  }
  .feature-content .feature-wrapper {
    width: 100%;
    margin: 0 auto;
  }
  .feature-content .feature-slide {
    max-width: 340px;
    width: 100%;
    height: 248px;
    padding: 26px 33px 0 30px;
    border-radius: 16px;
    border: 1.5px solid rgba(222, 191, 255, 0.42);
    background: linear-gradient(131deg, rgba(135, 72, 184, 0.45) -1.27%, rgba(46, 37, 82, 0.45) 96.48%);
  }
  .feature-content .feature-slide .feature-slide-title {
    margin: 16px 0 6px 0;
    color: #FFF;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.2;
  }
  .feature-content .feature-slide .feature-slide-desc {
    color: #FFF;
    font-size: 16px;
    line-height: 1.6;
  }
  .feature-content .feature-pagination {
    position: absolute;
    text-align: center;
    transition: 0.3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    bottom: 10px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .feature-content .feature-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.18);
    opacity: 1;
    margin: 0 4px;
    transition: all 0.3s ease;
    display: inline-block;
    cursor: pointer;
  }
  .feature-content .feature-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.74);
    width: 20px;
  }
  .enhance {
    padding-bottom: 118px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .enhance-content {
    max-width: 480px;
  }
  .enhance-content h2 {
    font-size: 32px;
    margin-bottom: 14px;
  }
  .enhance-content .enhance-select {
    display: none;
  }
  .enhance-content .enhance-card-group {
    display: none;
  }
  .enhance-content .enhance-mobile {
    display: block;
    width: 100%;
  }
  .enhance-content .enhance-swiper {
    padding-bottom: 24px;
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
  }
  .enhance-content .enhance-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
    align-items: flex-start;
  }
  .enhance-content .enhance-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 480px;
    width: 100%;
    flex-shrink: 0;
    height: auto;
    position: relative;
    transition-property: transform;
  }
  .enhance-content .enhance-slide .enhance-img {
    width: 100%;
    max-width: 480px;
    margin-bottom: 18px;
  }
  .enhance-content .enhance-slide .enhance-img img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 7px;
  }
  .enhance-content .enhance-slide .step-num-mobile {
    background: linear-gradient(120deg, #CC3FFF 40%, #AB61FF 50%, #6835FF 55%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 12px 0;
  }
  .enhance-content .enhance-slide .step-desc-mobile {
    color: rgba(255, 255, 255, 0.93);
    text-align: center;
    font-size: 14px;
    line-height: 1.3;
    padding: 0 20px;
  }
  .enhance-content .enhance-pagination {
    position: absolute;
    text-align: center;
    transition: 0.3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .enhance-content .enhance-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.18);
    opacity: 1;
    margin: 0 4px;
    transition: all 0.3s ease;
    display: inline-block;
    cursor: pointer;
  }
  .enhance-content .enhance-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.74);
    width: 20px;
  }
  .user-content {
    max-width: 330px;
    margin: 0 auto;
  }
  .user-content h2 {
    font-size: 32px;
    margin-bottom: 54px;
  }
  .user-content .user-card-group {
    display: none;
  }
  .user-content .user-swiper {
    display: block;
    position: relative;
    padding-bottom: 60px;
  }
  .user-content .user-wrapper {
    width: 100%;
    margin: 0 auto;
  }
  .user-content .user-slide {
    padding: 20px 16px 18px 22px;
    border-radius: 13px;
    background: linear-gradient(180deg, #4B2CD4 0%, #7542DB 100%);
    box-shadow: 0 17px 33px -7px rgba(60, 46, 143, 0.03);
    max-width: 330px;
    width: 100%;
    min-height: 358px;
  }
  .user-content .user-slide-top {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-bottom: 23px;
    background-image: url("../../img/common/audio-converter/user-dot.png");
    background-repeat: no-repeat;
    background-size: 67px 58px;
    background-position: top right;
    position: relative;
  }
  .user-content .user-slide-top::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, rgba(224, 213, 255, 0) 0%, #E0D5FF 48.56%, rgba(224, 213, 255, 0) 100%);
  }
  .user-content .user-slide-top .top-right {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .user-content .user-slide-top .top-right .user-name {
    color: #FFF;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.2;
  }
  .user-content .user-slide-top .top-right .stars {
    display: flex;
    gap: 8px;
  }
  .user-content .user-slide-bottom {
    color: #FFF;
    font-size: 16px;
    line-height: 1.6;
    padding-top: 23px;
  }
  .user-content .user-pagination {
    position: absolute;
    text-align: center;
    transition: 0.3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    bottom: 10px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .user-content .user-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.18);
    opacity: 1;
    margin: 0 4px;
    transition: all 0.3s ease;
    display: inline-block;
    cursor: pointer;
  }
  .user-content .user-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.74);
    width: 20px;
  }
}
@media (max-width: 600px) {
  .save-content .save-group {
    display: none;
  }
  .save-content .save-swiper {
    display: block;
    position: relative;
    padding-bottom: 50px;
  }
  .save-content .save-wrapper {
    max-width: 230px;
    width: 100%;
    margin: 0 auto;
  }
  .save-content .save-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 164px !important;
    margin: 0 30px;
    flex-shrink: 0;
    border-radius: 12px;
    border: 1px solid #d07eff3c;
    background: rgba(30, 13, 85, 0.4);
    box-shadow: 0 18px 33px 0 rgba(117, 37, 255, 0.28);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 20px 0 26px 0;
    transition: all 0.3s ease;
    cursor: pointer;
  }
  .save-content .save-slide .save-slide-title {
    color: #FFF;
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.2;
    margin: 20px 0 6px 0;
  }
  .save-content .save-slide .save-slide-desc {
    color: #FFF;
    text-align: center;
    font-size: 12px;
    line-height: 1.6;
  }
  .save-content .slide-1 {
    background-image: url("../../img/common/audio-converter/save-slide-background-1.png");
  }
  .save-content .slide-2 {
    background-image: url("../../img/common/audio-converter/save-slide-background-2.png");
  }
  .save-content .slide-3 {
    background-image: url("../../img/common/audio-converter/save-slide-background-3.png");
  }
  .save-content .slide-4 {
    background-image: url("../../img/common/audio-converter/save-slide-background-4.png");
  }
  .save-content .slide-5 {
    background-image: url("../../img/common/audio-converter/save-slide-background-5.png");
  }
  .save-content .slide-6 {
    background-image: url("../../img/common/audio-converter/save-slide-background-6.png");
  }
  .save-content .save-pagination {
    position: absolute;
    text-align: center;
    transition: 0.3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10;
    bottom: 10px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .save-content .save-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.18);
    opacity: 1;
    margin: 0 4px;
    transition: all 0.3s ease;
    display: inline-block;
    cursor: pointer;
  }
  .save-content .save-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.74);
    width: 20px;
  }
}
@media (max-width: 365px) {
  .banner-content .banner-left .banner-btn-group {
    gap: 8px;
  }
  .banner-content .banner-left .banner-btn-group .win-btn,
  .banner-content .banner-left .banner-btn-group .mac-btn {
    gap: 6px;
    padding: 13px 24px;
  }
}