.page-header h1{
	display: none  !important;
}

.affix{
	background-color: #000;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

.affix .e-con-inner{
	padding: 0 !important;
}

.affix .logo img{
  width: 70% !important;
}

.box:hover h2{
	color: #fff;
}

.box:hover h2:before{
	background-color: #fff;
}

.circle{
  animation: rotate 8s linear infinite; /* Apply the animation */
}

@keyframes rotate {
  0% {
    transform: rotate(0deg); /* Start rotation from 0 degrees */
  }
  100% {
    transform: rotate(360deg); /* Rotate to 360 degrees (full circle) */
  }
}

.custom-content{
	display: none !important;
}

.custom-content.active{
	display: flex !important;
}

#home-hero__items-mobile{
  margin-bottom: 50px;
}

#home-hero__items-mobile ul{
	list-style: none;
	padding-left: 0px;
	color: #fff;
	display: flex;
	width: 100%;
  padding: 0;
  margin: 0;
}

#home-hero__items-mobile li{
	padding: 5px 10px;
	flex: 1;
}

#home-hero__items-mobile #engage {
  flex: 1.2; /* rộng hơn 20% so với các li khác */
}

#home-hero__items-mobile .content{
  display: none;
  font-size: 14px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  margin-top: 45px;
}

#home-hero__items-mobile .active.content{
	display: block;
}

#home-hero__items-mobile ul li{
  background-color: #8A288B; 
  position: relative;
  overflow: visible;
  transition: transform 0.3s ease;
}

#home-hero__items-mobile ul li.active{
  background-color: #BE33C0;
  transform: scale(1.1);
  z-index: 9;
}

#home-hero__items-mobile li div:first-child{
	position: relative;
	font-size: 12px;
  font-weight: bold;
  text-align: center;
}

#home-hero__items-mobile li.active div:first-child{
  font-size: 14px;
}

/* Mũi tên đen bên phải */
#home-hero__items-mobile li div:first-child:after {
  content: "";
  position: absolute;
  top: -5px;
  right: -20px;
  width: 0;
  height: 0;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-left: 10px solid black;
  z-index: 2;
}

/* Phần nền tím đè lên để tạo hiệu ứng “viền đen” */
#home-hero__items-mobile li div:first-child:before {
  content: "";
  position: absolute;
  top: -5px;
  right: -19px;
  width: 0;
  height: 0;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-left: 10px solid #8A288B;
  z-index: 3;
  transition: transform 0.3s ease;
}

#home-hero__items-mobile li.active div:first-child:before{
  border-left: 10px solid #BE33C0;
}



#home-hero__items-mobile li:last-child div:first-child:before{
	display: none;
}

#home-hero__items-mobile li:last-child div:first-child:after{
  display: none;
}