/* @media (max-width: 1920px) {
  html{
      font-size: .5vw !important;
  }
} */
.box-title{
  font-size: 7.2rem;
  font-weight: 600;
  position: relative;
  z-index: 1;
}
.title-box{
  margin: 16rem 0 5.2rem;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out,transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.title-box.active1 {
  opacity: 1;
  transform: translateY(0);
}
.title-box img{
  width: 13rem;
}
.box-title-point{
  width: 3.5rem;
  height: 3.5rem;
  margin-left: 3rem;
  margin-top: -2rem;
  border-radius: 50%;
  background-image: linear-gradient(218deg, #FE5A01 1%, #003FFF 100%);
}
.box-title::after {
  content: "MICRO DRAMA";
  position: absolute;
  top: 6px;
  left: 6px;
  color: #0005FF;
  z-index: -1;
  width: 100%;
}
.box-1 .box-title::after {
  content: "AACA MASTERCLASS";
}
.box-2 .box-title::after {
  content: "DUBAI CABSAT 2025";
}
.box-3 .box-title::after {
  content: "HONG KONG FILMART 2025";
}
.box-4 .box-title::after {
  content: "MEDIA";
}
.box-5 .box-title::after {
  content: "MORE ABOUT US";
}
.box-1-content>div:nth-child(2){
  gap: 2rem;
}
.box-1-content>div:nth-child(2) img:first-child{
  width: 80rem;
  border-radius: 2rem;
}
.box-1-content>div:nth-child(2) img:last-child{
  width: 57rem;
  border-radius: 2rem;
}
.box-2-content-title{
  font-size: 2.8rem;
  font-weight: bold;
  background-image: linear-gradient(to right, #FE5A01 1%, #003FFF 100%);
  padding: 0.4rem;
  border-radius: 4rem;
  width: fit-content;
  margin: 0 auto 6.7rem;
}
.box-2-content-1>div img{
  width: 100%;
  border-radius: 0.8rem;
}
.box-2-content-1>div:nth-child(2) img:first-child,.box-2-content-1>div:nth-child(3) img:first-child{
  height: 30rem;
}
.box-2-content-1>div:nth-child(2) img:last-child,.box-2-content-1>div:nth-child(3) img:last-child{
  height: 27rem;
}
.box-2-content-1>div{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.box-2-content-1>div>div{
  width: 100%;
  height:30rem;
  font-size: 2.2rem;
  font-weight: bold;
  padding: 2.9rem 5.4rem;
  background-color: #FE4401;
  border-radius: 0.8rem;
  line-height: 3.6rem;
}
.box-2-content-1>div:nth-child(2){
  width: 40.2rem;
}
.box-2-content-1>div:last-child{
  width: 53rem;
}
.box-3-content-1>div:first-child{
  width: 37.5rem;
  height: 59rem;
  font-size: 2.2rem;
  font-weight: bold;
  background: #0005FF;
  line-height: 3.6rem;
  padding: 2.9rem 3.8rem;
  border-radius: 0.8rem;
}
.box-3-content-1>div:nth-child(2){
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.box-3-content-1>div:nth-child(2) img:first-child{
  width: 45.2rem;
  height: 30rem;
}
.box-3-content-1>div img{
  border-radius: 0.8rem;
}
.box-3-content-1>div:nth-child(2) img:last-child{
  width: 45.2rem;
  height: 27rem;
}
.box-3-content-1>div:nth-child(3) img{
  width: 59rem;
  height: 59rem;
}

/* 轮播图样式 */
.carousel-container {
  width: 100%;
  margin: 0 auto 12rem;
  position: relative;
}

.carousel-track {
  display: flex;
  transition: transform 0.5s ease;
}

.carousel-slide {
  flex-shrink: 0;
  width: auto;
  height: 85rem;
  padding: 0 10px;
  aspect-ratio: var(--img-aspect-ratio);
}

.carousel-slide img {
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  padding: 15px;
  cursor: pointer;
  z-index: 10;
  border-radius: 50%;
  font-size: 18px;
}

.carousel-btn.prev {
  left: 10px;
}

.carousel-btn.next {
  right: 10px;
}

.carousel-btn:hover {
  background: rgba(0, 0, 0, 0.8);
}

.disabled {
  cursor: not-allowed !important;
}

.carousel-dots {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ccc;
  margin: 0 5px;
  cursor: pointer;
}

.dot.active {
  background: #333;
}

.carousel-div{
  position: absolute;
  bottom: -6rem;
  display: flex;
  gap: 3rem;
  left: 50%;
  transform: translateX(-50%);
}
.carousel-div img{
  width: 3.6rem;
  height: 3.6rem;
  cursor: pointer;
}
.url-style span:hover{
  font-weight: bold;
  color: #0005FF;
}
.url-style span{
  color: #fff;
  font-size: 2rem;
  display: block;
}
.box-5-content-title{
  margin-top: 3rem;
  margin-bottom: 1rem;
  opacity: 0;
  transform: translateY(30px);
}
.box-5-content-body{
  font-size: 2rem;margin-left: 2.4rem;line-height: 3.75rem;
  opacity: 0;
  transform: translateY(30px);
}
.box-5-content-body,
.box-5-content-title {
  /* 确保transition兼容性 */
  transition: all 0.5s ease-out;
}
.box-5-content-body.active1,.box-5-content-title.active1 {
  opacity: 1;
  transform: translateY(0);
}
.ins-content-right-num span{
  font-size: 6rem;
}
.ins-content-right-num div{
  font-size: 3.6rem;
}
.box-5-content-body>span:first-child{
  min-width: 22.5rem;
}
.box-5-content-body>span:nth-child(2){
  min-width: 23.5rem;
}
.box-5-content-title div:last-child{
  color:#FE4401;font-size: 2rem;line-height: 3.75rem;
  font-weight: bold;
}
.bg-shadow-dou {
  position: absolute;
  right: -15rem;
  top: 24rem;
  z-index: -1;
  width: 24rem;
}
.bg-shadow-dou::before {
  content: "";
  position: absolute;
  width: 24rem; /* 圆圈大小 */
  height: 24rem;
  background-color: #FE4401; /* 红色 */
  border-radius: 50%; /* 圆形 */
  z-index: -1; /* 放在图片后面 */
}
/* 右侧蓝色圆圈（带阴影和过渡） */
.bg-shadow-dou::after {
  content: "";
  position: absolute;
  top: 17rem;
  right: -7rem;
  transform: translateY(-50%);
  width: 24rem;
  height: 24rem;
  border-radius: 50%;
  z-index: -1;
  /* 完全渐变的蓝色背景 */
  background: radial-gradient(
      circle at center,
      rgba(0, 5, 255, 1) 0%,       /* 中心较实 */
      rgba(0, 5, 255, 0.9) 30%,      /* 中间过渡 */
      rgba(0, 5, 255, 0.7) 50%,      /* 中间过渡 */
      rgba(0, 5, 255, 0.4) 70%,      /* 中间过渡 */
      rgba(0, 5, 255, 0.3) 90%,      /* 中间过渡 */
      rgba(0, 5, 255, 0) 100%      /* 边缘虚化 */
  );

  /* 平滑阴影（与渐变融合） */
  box-shadow: 
      0 0 30px rgba(0, 5, 255, 0.5), /* 内层柔和光晕 */
      0 0 30px rgba(0, 5, 255, 0.5); /* 外层投影 */

  /* 初始状态（半透明） */
  opacity: 1;
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); /* 平滑缓动 */
}
#animated-image img{
  opacity: 0;
  transition: opacity 1s ease;
}

.box-2 .flesh:nth-child(1),.box-2-1 .flesh:nth-child(2) {
  transform: translateX(-50px);
}
.box-2 .flesh:nth-child(3) {
  transform: translateX(50px);
}
.box-3 .flesh:nth-child(1),.box-2-1 .flesh:nth-child(2) {
  transform: translateX(-50px);
}
.box-3 .flesh:nth-child(3) {
  transform: translateX(50px);
}