main {
  background: black;
}

.sec-top-banner {
  padding: 108px 0 48px;
}
.sec-top-banner .container {
  position: relative;
  z-index: 1;
}
.sec-top-banner .container h1 {
  font-size: 40px;
}
.sec-top-banner .container .rgt {
  max-width: 100%;
}
.sec-top-banner .container .rgt .video-swiper {
  width: 100%;
}
.sec-top-banner .container .rgt .video-swiper img {
  border-radius: 4px;
}
.sec-top-banner .container .rgt .video-nav-swiper .swiper-slide {
  width: 79.5px !important;
  border-radius: 8.34px;
  overflow: hidden;
  cursor: pointer;
}
.sec-top-banner .container .rgt .video-nav-swiper .swiper-slide.swiper-slide-thumb-active {
  border: 2px solid #FFFFFF;
}
.sec-top-banner .container .rgt .video-nav-swiper .swiper-slide img {
  border-radius: 5.34px;
}
@media (min-width: 992px) {
  .sec-top-banner {
    padding: 112px 0 64px;
  }
  .sec-top-banner .container .lft {
    max-width: 585px;
  }
  .sec-top-banner .container .lft h1 {
    font-size: 48px;
  }
  .sec-top-banner .container .rgt {
    max-width: 544px;
  }
  .sec-top-banner .container .rgt .video-swiper {
    width: 544px;
    aspect-ratio: 655/428;
    padding: 10px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(105, 69, 191, 0.7) -39.2%, rgba(23, 1, 69, 0.7) 109.86%);
    border: 1px solid rgba(115, 83, 184, 0.6980392157);
  }
  .sec-top-banner .container .rgt .video-swiper video {
    width: 100%;
    display: block;
    border-radius: 12px;
    -o-object-fit: cover;
       object-fit: cover;
    clip-path: inset(0 0 0 1px);
  }
  .sec-top-banner .container .rgt .video-nav-swiper .swiper-slide {
    width: 106px !important;
    border-radius: 9px;
  }
  .sec-top-banner .container .rgt .video-nav-swiper .swiper-slide img {
    border-radius: 9px;
  }
}
@media (min-width: 1600px) {
  .sec-top-banner {
    padding: 174px 0 96px;
  }
  .sec-top-banner .container {
    max-width: 1400px;
  }
  .sec-top-banner .container .lft h1 {
    font-size: 56px;
  }
  .sec-top-banner .container .rgt {
    max-width: 655px;
  }
  .sec-top-banner .container .rgt .video-swiper {
    width: 655px;
    padding: 12px;
    border-radius: 20px;
  }
  .sec-top-banner .container .rgt .video-nav-swiper .swiper-slide {
    width: 120px !important;
    border-radius: 10px;
  }
  .sec-top-banner .container .rgt .video-nav-swiper .swiper-slide img {
    border-radius: 8px;
  }
}

.sec-compare {
  padding: 64px 0 32px;
  scroll-margin-top: 80px;
}
@media (min-width: 992px) {
  .sec-compare {
    padding: 64px 0 40px;
    scroll-margin-top: 0;
  }
}
@media (min-width: 1600px) {
  .sec-compare {
    padding: 80px 0 55px;
  }
}
.sec-compare .swiper-compare-nav .swiper-wrapper {
  width: -moz-max-content !important;
  width: max-content !important;
}
.sec-compare .swiper-compare-nav .swiper-wrapper .swiper-slide {
  width: -moz-fit-content !important;
  width: fit-content !important;
  padding: 6px 0;
  color: #999;
  cursor: pointer;
}
.sec-compare .swiper-compare-nav .swiper-wrapper .swiper-slide:last-child {
  margin-right: 0 !important;
}
.sec-compare .swiper-compare-nav .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
  font-weight: 700;
  color: white;
  border-bottom: 1px solid #FFFFFF;
}
@media (min-width: 1600px) {
  .sec-compare .swiper-compare-nav .swiper-wrapper .swiper-slide {
    font-size: 16px;
  }
}
@media (min-width: 992px) {
  .sec-compare .swiper-compare-nav {
    width: -moz-fit-content !important;
    width: fit-content !important;
    margin: 0 auto;
  }
  .sec-compare .swiper-compare-nav .swiper-wrapper {
    transform: translate3d(0, 0px, 0px) !important;
  }
}
.sec-compare .swiper-compare-cont {
  aspect-ratio: 342/400;
  border-radius: 20px;
}
.sec-compare .swiper-compare-cont .swiper-slide > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 992px) {
  .sec-compare .swiper-compare-cont {
    max-width: 890px;
    aspect-ratio: 1030/516;
    border-radius: 24px;
  }
  .sec-compare .swiper-compare-cont .swiper-slide > img {
    height: auto;
  }
}
@media (min-width: 1600px) {
  .sec-compare .swiper-compare-cont {
    max-width: 1030px;
  }
}
.sec-compare .compare-pic .compare-line {
  height: 100%;
  width: 2px;
  top: 0;
  left: 50%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, #FFFFFF 100%);
  cursor: e-resize;
  z-index: 7 !important;
}
.sec-compare .compare-pic .compare-line::before {
  position: absolute;
  bottom: 30px;
  left: -65px;
  border-radius: 50%;
  content: "";
  width: 124px;
  height: 27px;
  background: url("https://images.hitpaw.cn/product/ai-video-enhancer/compare-icon.png") no-repeat;
  background-size: 100%;
}
.sec-compare .compare-pic .compare-line.transition {
  transition: left 0.5s ease;
}
.sec-compare .compare-pic .compare-before {
  width: 50%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
  overflow: hidden;
  z-index: 6 !important;
}
.sec-compare .compare-pic .compare-before img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 992px) {
  .sec-compare .compare-pic .compare-before img {
    width: 100%;
    height: auto;
  }
}
.sec-compare .compare-pic .compare-before.transition {
  transition: width 0.5s ease;
}
.sec-compare .compare-pic .compare-after {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.sec-compare .compare-pic .compare-after img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 992px) {
  .sec-compare .compare-pic .compare-after img {
    width: 100%;
    height: auto;
  }
}

.sec-2 {
  scroll-margin-top: 80px;
  padding: 48px 0;
  background: linear-gradient(226.83deg, rgba(114, 49, 251, 0.2) 6.53%, rgba(0, 0, 0, 0.2) 30.92%);
  background-color: #000;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper {
  width: -moz-max-content;
  width: max-content;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .swiper-slide {
  width: -moz-fit-content !important;
  width: fit-content !important;
  padding: 6px 16px;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(3.5000002384px);
          backdrop-filter: blur(3.5000002384px);
  border: 0.58px solid rgba(255, 255, 255, 0.4);
  border-radius: 4px;
  font-size: 12px;
  color: white;
  cursor: pointer;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .swiper-slide:hover {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), linear-gradient(0deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
  background: linear-gradient(90deg, #E091F2 0%, #7231FB 100%);
  display: flex;
  align-items: center;
  font-weight: 700;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .swiper-slide.swiper-slide-thumb-active::before {
  content: "";
  width: 15px;
  height: 14px;
  display: inline-flex;
  padding-right: 2px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="14" fill="none"><path fill="%23fff" d="m6.5 8.85 5.362-5.363.825.825L6.5 10.5 2.787 6.787l.825-.825L6.5 8.85Z"/></svg>');
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .line {
  display: block;
  width: 1px;
  height: 32px;
  background: rgba(255, 255, 255, 0.5);
  margin-right: 16px;
}
.sec-2 .sec2-swiper-cont {
  height: 535px;
  border-radius: 20px;
}
.sec-2 .sec2-swiper-cont .swiper-slide video {
  width: 100%;
  border-radius: 24px;
}
.sec-2 .sec2-swiper-cont .swiper-slide img {
  width: 100%;
  height: 535px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 992px) {
  .sec-2 {
    scroll-margin-top: 0;
    padding: 64px 0;
  }
  .sec-2 .sec2-swiper-nav {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
  }
  .sec-2 .sec2-swiper-nav .swiper-wrapper {
    transform: translate3d(0, 0, 0) !important;
  }
  .sec-2 .sec2-swiper-nav .swiper-wrapper .line {
    margin-right: 32px;
  }
  .sec-2 .sec2-swiper-cont {
    height: unset;
    border-radius: 24px;
  }
}
@media (min-width: 1600px) {
  .sec-2 {
    padding: 96px 0;
  }
  .sec-2 .container {
    max-width: 1400px;
  }
  .sec-2 .sec2-swiper-nav {
    bottom: 32px;
  }
}

.sec-bottom {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) -10.9%, rgba(0, 0, 0, 0.6) 39.11%, rgba(0, 0, 0, 0.831775) 62.86%, #000000 89.21%), radial-gradient(57.37% 130.42% at 50% 52.77%, #000000 0%, #7231FB 59.62%, #E091F2 77.88%, #FED001 100%);
  padding: 64px 0;
}
.sec-bottom img {
  max-width: 64px;
}
.sec-bottom h2 {
  font-size: 24px;
}
@media (min-width: 992px) {
  .sec-bottom {
    padding: 146px 0;
  }
  .sec-bottom img {
    max-width: 88px;
  }
  .sec-bottom h2 {
    font-size: 36px;
  }
}
@media (min-width: 1600px) {
  .sec-bottom {
    padding: 210px 0;
  }
  .sec-bottom img {
    max-width: 112px;
  }
  .sec-bottom h2 {
    font-size: 48px;
  }
}

.aside-cont {
  position: sticky;
  top: 59px;
  padding: 16px;
  overflow: auto;
  background: #1a1a1a;
  z-index: 50;
}
.aside-cont::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.aside-cont .item-list {
  width: -moz-max-content;
  width: max-content;
}
.aside-cont .item-list a {
  color: #999999;
  text-decoration: none;
}
.aside-cont .item-list a span {
  font-size: 12px;
}
.aside-cont .item-list a:hover {
  color: white;
}
.aside-cont .item-list a:hover span {
  display: inline-block;
}
.aside-cont .item-list a.active {
  color: white;
}
.aside-cont .item-list a.active span {
  display: inline-block;
}
@media (min-width: 992px) {
  .aside-cont {
    background: transparent;
    padding: 0;
    position: fixed;
    top: 50%;
    left: 32px;
    transform: translateY(-50%);
  }
  .aside-cont .item-list a span {
    display: none;
  }
  .aside-cont .item-list a:hover span {
    display: inline-block;
  }
}

.bg-compare-1 {
  background: linear-gradient(180deg, rgba(224, 145, 242, 0.2) 0%, rgba(0, 0, 0, 0.2) 68.45%);
}

.bg-compare-2 {
  position: relative;
}
@media (max-width: 992px) {
  .bg-compare-2 {
    overflow-x: hidden;
  }
}
.bg-compare-2::before {
  content: "";
  width: 100%;
  height: 366px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -36%);
  background: linear-gradient(105.64deg, rgba(114, 49, 251, 0.6) 14.81%, rgba(253, 106, 15, 0.6) 104.05%);
  filter: blur(105.3826675415px);
}
@media (min-width: 992px) {
  .bg-compare-2::before {
    width: 906px;
    height: 380px;
    filter: blur(200px);
  }
}

.bg-compare-3 {
  background: linear-gradient(180deg, rgba(254, 208, 1, 0.1) 0%, rgba(0, 0, 0, 0.1) 58.27%);
}

.bg-compare-4 {
  background: linear-gradient(180deg, rgba(114, 49, 251, 0.2) 0%, rgba(0, 0, 0, 0.2) 58.27%);
}

.bg-compare-5 {
  position: relative;
}
@media (max-width: 992px) {
  .bg-compare-5 {
    overflow-x: hidden;
  }
}
.bg-compare-5::before {
  content: "";
  width: 100%;
  height: 366px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -36%);
  background: linear-gradient(105.64deg, rgba(253, 106, 15, 0.6) 14.81%, rgba(114, 49, 251, 0.6) 104.05%);
  filter: blur(105.3826675415px);
}
@media (min-width: 992px) {
  .bg-compare-5::before {
    width: 906px;
    height: 380px;
    filter: blur(200px);
  }
}

.bg-compare-6 {
  background: linear-gradient(180deg, rgba(114, 49, 251, 0.2) 0%, rgba(0, 0, 0, 0.2) 68.45%);
}

.bg-compare-7 {
  background: linear-gradient(180deg, rgba(253, 106, 15, 0.2) 0%, rgba(0, 0, 0, 0.2) 68.45%);
}

.sec-2 {
  scroll-margin-top: 80px;
  padding: 48px 0;
  background: linear-gradient(226.83deg, rgba(114, 49, 251, 0.2) 6.53%, rgba(0, 0, 0, 0.2) 30.92%);
  background-color: #000;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper {
  width: -moz-max-content;
  width: max-content;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .swiper-slide {
  width: -moz-fit-content !important;
  width: fit-content !important;
  padding: 6px 16px;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(3.5000002384px);
          backdrop-filter: blur(3.5000002384px);
  border: 0.58px solid rgba(255, 255, 255, 0.4);
  border-radius: 4px;
  font-size: 12px;
  color: white;
  cursor: pointer;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
  background: linear-gradient(90deg, #E091F2 0%, #7231FB 100%);
  display: flex;
  align-items: center;
  font-weight: 700;
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .swiper-slide.swiper-slide-thumb-active::before {
  content: "";
  width: 15px;
  height: 14px;
  display: inline-flex;
  padding-right: 2px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="14" fill="none"><path fill="%23fff" d="m6.5 8.85 5.362-5.363.825.825L6.5 10.5 2.787 6.787l.825-.825L6.5 8.85Z"/></svg>');
}
.sec-2 .sec2-swiper-nav .swiper-wrapper .line {
  display: block;
  width: 1px;
  height: 32px;
  background: rgba(255, 255, 255, 0.5);
  margin-right: 16px;
}
.sec-2 .sec2-swiper-cont {
  height: 535px;
  border-radius: 20px;
}
.sec-2 .sec2-swiper-cont .swiper-slide video {
  width: 100%;
  border-radius: 24px;
}
.sec-2 .sec2-swiper-cont .swiper-slide img {
  width: 100%;
  height: 535px;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
@media (min-width: 992px) {
  .sec-2 {
    scroll-margin-top: 0;
    padding: 64px 0;
  }
  .sec-2 .sec2-swiper-nav {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
  }
  .sec-2 .sec2-swiper-nav .swiper-wrapper {
    transform: translate3d(0, 0, 0) !important;
  }
  .sec-2 .sec2-swiper-nav .swiper-wrapper .line {
    margin-right: 32px;
  }
  .sec-2 .sec2-swiper-cont {
    height: unset;
    border-radius: 24px;
  }
}
@media (min-width: 1600px) {
  .sec-2 {
    padding: 96px 0;
  }
  .sec-2 .container {
    max-width: 1400px;
  }
  .sec-2 .sec2-swiper-nav {
    bottom: 32px;
  }
}/*# sourceMappingURL=feature.css.map */