.video-modal-container{
  position: fixed;
  z-index: 20;
  backdrop-filter: blur(30.66px);
  inset: 0;
  padding: clamp(20px, 3.7%, 3.7%) clamp(20px, 4.2%, 4.2%)  clamp(20px, 3.14%, 3.14%) clamp(20px, 4.8%, 4.8%);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(100%);
  transition: transform 0.4s ease-in-out;
  /* background-color: transparent; */
  background-color: rgba(255,255,255,0.4);

}
.video-modal-container .modal{
  display: flex;
  gap: var(--fs38);
  flex-direction: column;
  /* align-items: center; */
  justify-content: center;
  height: 100%;
}
.video-modal-container .modal .header-wrapper{
 display: flex;
 align-items: center;
 justify-content: space-between;
 /* margin-bottom: var(--fs38); */
}

.video-modal-container .modal .header-wrapper h2{
  font-size: var(--fs40);
  font-weight: 500;
}
.video-modal-container .modal .close-modal-btn{
  margin-bottom: 5px;
  /* display: block; */
  /* margin-left: auto; */
} 

.video-modal-container .modal .close-modal-btn img{
  width: var(--fs42);
}
.video-modal-container .modal .video-container{
  /* width: 90%;
  height: 85%; */
  margin-inline: auto;
  border-radius: 20px;
  background: linear-gradient(#00000003 1%, #000000);
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 100%;
  aspect-ratio: 16 / 9; 
}
.video-modal-container .modal .video-container .video-item{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: none;

}
.video-modal-container .modal .video-container .video-item.active{
  display: block;
}
.video-modal-container.show {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

@media screen and (max-width:1366px){
  .video-modal-container{
    padding: clamp(20px, 3.7%, 3.7%)  clamp(20px, 4.8%, 4.8%);
  }
  .video-modal-container .modal {
    gap: 20px;
  }

}

@media screen and (max-width:480px){
  .video-modal-container{
    padding: clamp(20px, 3.7%, 3.7%)  20px;
  }
  .video-modal-container .modal .video-container{
    border-radius: 10px;
  }
}