.section-video{
  background: black;
  overflow: hidden;
}

.section-video .video-container {
  position: relative;
  overflow:hidden;
  @media (min-width: 768px) {
    max-height: unset;
    height: 100%;
    width:100%;
  }
}

.section-video .video-container.add_bottom_shadow::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 20px;
  z-index: 3;
  background: linear-gradient(180deg, rgba(26, 124, 255, 0) 25%, rgb(0 0 0 / 58%) 100%);
}

.section-video .video-container.inactive {
  height: calc(100dvh - 40px);
  width: 100%;
}

.section-video .video-container.inactive.simple_video {
  width: 100%;
  height: auto;
}

.section-video .video-container.simple_video {
  @media (min-width: 768px) {
      width: 100%;
      height: auto; 
  }
}

.video-thumbnail__img{
   width: auto !important;
   height: 100% !important;
   @media (min-width: 1500px) {
     height: auto !important;
     width: 100% !important;
  }
}

.video-thumbnail__img.simple_video{
  width: 100% !important;
  height: auto !important; 
}

.video-thumbnail__img.full_height_video{
  @media (min-width: 1500px) {
    width: auto!important;
    height: 100%!important; 
  }
}

.video-thumbnail-video{
  object-fit: cover;
  object-position: center;
  position: absolute !important;
  top: 0px;
  left: 0px;
  z-index:1;
  width: auto;
  height: 100dvh;
  display: block;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0%);
  vertical-align: top;
 @media (min-width: 768px) {  
   top: 50%;
   transform: translate(-50%, -50%);
   width: auto;
   max-height: unset;
  }
 @media (min-width: 1600px) { 
   width: 100%; 
   height: 100%; 
   max-height: unset; 
  }
}

.video-thumbnail-video.simple_video {
  width: 100%;
  height: auto;
  max-height: unset;
  @media (min-width: 768px) {  
    width: 100%;  
    height: auto;
  }
}

.video-thumbnail-video.simple_video.full_height_video{
  @media (min-width: 1600px) { 
    width: auto; 
    height: 100%; 
  }
}  

.final-video{
  width:100%;
  height: 100dvh; 
  top: 50%;
  position: relative;
  transform: translate(0%, -50%);
  @media (min-width: 768px) {
     top: 0%;
     height: 100%; 
     object-fit: cover;
     transform: translate(0%, 0%);
  }
}

.final-video.simple_video{
    height: auto;
    transform: unset;
    top:0px;
}

.section-video .hide-video {
  display: none;
}

.section-video .play-button {
  position: absolute;
  aspect-ratio: 1;
  height: auto;
   z-index:3;
  opacity: 0;
  cursor: pointer;
  transition: opacity 0.3s ease;
}

.play-button {
  transition: transform 0.3s ease;
}

.section-video .play-button svg {
  width: 100%;
  height: 100%;
}

.video-wrapper {
  position: relative;
  overflow: hidden;
  @media (min-width: 768px) {
     height: 100dvh;
     max-height: unset;   
  }  
}

.video-wrapper.simple_video {
  @media (min-width: 768px) {
    width: 100%;
    height: auto; 
    max-height: unset;
  }
}

.video-wrapper.inactive {
  height: 100dvh;
  width: 100%;
  @media (min-width: 768px) {
    max-height: unset;
    height: calc(100vh - 40px);      
  }
}

.video-wrapper.inactive.simple_video {
  width: 100%;
  height: auto;
  max-height: unset;
}

.video__simplevideocont{
  width:100%;
  position: absolute;
  top:50%;
  left:50%;
  z-index:2;
  transform: translate(-50%,-50%);
  display: flex;
  justify-content: center;
  align-items: center;
}

.video__middecorator{
  background: #ffffff20;
  width:100%;
  position: absolute;
  top:50%;
  left:50%;
  z-index:2;
  transform: translate(-50%,-50%);
  backdrop-filter: blur(25px);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px 0px;
  opacity: 1;
  pointerEvents: auto;
  transition: 1s ease all;
  @media (min-width: 768px) {padding: 75px 0px; }
  @media (min-width: 1400px) {padding: 45px 0px;}
}

.video__middecorator.active{
  transform: translate(-50%, -300%); 
  opacity:0;
  pointerEvents: none;
  transition: 1s ease all;
}  

.video__simplevideocont.active{
  transform: translate(-50%, -300%); 
  opacity:0;
  pointerEvents: none;
  transition: 0.6s ease all;
}
  
.video__midgif{
  position: absolute;
  top:-25%;
  right: 15%;
  border-radius: 50%;
  overflow: hidden;
  width: 115px;
  height: 115px; 
  display:flex;
  @media (min-width: 1100px) { right: 25%;}
  @media (min-width: 1800px) { right: 35%;}
}

.video__midgif img{
  width:100%;
  height: auto;
}

.video__midtext{
  position: relative;
  font-size: 70px;
  @media (min-width: 400px) {font-size: 85px; }
  @media (min-width: 1200px) {font-size: 130px; }
  @media (min-width: 1400px) {font-size: 172px;}  
}

.video__midtext strong{    
  font-weight:900 !important;
}  

.video__gradient-fill {
  background: linear-gradient(90deg, #00feca, #00a5ff, #003cff);
  background-size: 200% 100%;
  background-position: 0% 50%;
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  width: fit-content;
}

.close-button {
  z-index: 3;
  opacity: 0;
  position: absolute;
  top: 20%;
  right: 0%;
  cursor: pointer;
  @media (min-width: 768px) {
    top: 10%;
    right: 0%;  
  }
  @media (min-width: 992px) {
    opacity: 0;
    top: 0%;
    right: 0%;
  }
}

.close-button.simple_video {
  top: 0%;
  right: 0%;
  @media (min-width: 768px) {
    top: 2%;
    right: 2%;
  }
}

.video__circle{
  display:flex;
  flex-direction: column;
  justify-content: center;
  align-items:center;
  background: #1f29378c;
  backdrop-filter: blur(10px);
  border-radius:50%;
  height: 110px;
  width:110px;
  position: relative;
}

.video__circle.closecircle{
  height: 100px;
  width:100px;
  transform: scale(0.4);
  @media (min-width: 768px) { 
    height: 110px;
    width:110px;
    transform: scale(0.6);
  }
}

.video__circle:before{
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width:110%;
    height:110%;
    border: 2px solid #1f29378c;
    border-radius:50%
}

.video__circle--text{
  font-size: 12px;
  font-weight: 700;
  color: #ffffff;
  text-transform: uppercase;  
}

.video__circle--playicon{
 width:56px;
 height:56px;
 display:block;
 background-image: url("data:image/svg+xml,%3Csvg width='56' height='56' viewBox='0 0 56 56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.125 42.224V13.776L42.4708 28L20.125 42.224ZM23.625 35.8167L35.9199 28L23.625 20.1833V35.8167Z' fill='white'/%3E%3C/svg%3E%0A"); 
}

.video__circle--closeicon{
 width:56px;
 height:56px;
 display:block;
 background-image: url("data:image/svg+xml,%3Csvg width='56' height='56' viewBox='0 0 56 56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_5047_6200)'%3E%3Cpath d='M41.0307 43.5526L28.0002 30.522L14.9696 43.5526L12.4476 41.0306L25.4781 28L12.4476 14.9694L14.9696 12.4474L28.0002 25.478L41.0307 12.4474L43.5528 14.9694L30.5222 28L43.5528 41.0306L41.0307 43.5526Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_5047_6200'%3E%3Crect width='56' height='56' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); 
}

.video__playsimplevideo{
  background: #FFFFFF99;
  width:80px;
  height:80px;
  border-radius: 50%;
  backdrop-filter: blur(10px);
  justify-content: center;
  align-items: center;
  border: none;
}

.btn__miniplay-icon-big{
  width:70px;
  height:70px;
  background-image: url("data:image/svg+xml,%3Csvg width='71' height='70' viewBox='0 0 71 70' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M25.9433 52.78V17.22L53.8755 35L25.9433 52.78ZM30.3183 44.7708L45.6869 35L30.3183 25.2291V44.7708Z' fill='%231F2937'/%3E%3C/svg%3E%0A");
}

.btn__miniplay-icon{
  width:24px;
  height:24px;
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.125 18.096V5.90399L18.7018 12L9.125 18.096ZM10.625 15.35L15.8943 12L10.625 8.64999V15.35Z' fill='white'/%3E%3C/svg%3E%0A");
}

.btn:hover .btn__miniplay-icon{
  background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.125 18.096V5.90399L18.7018 12L9.125 18.096ZM10.625 15.35L15.8943 12L10.625 8.64999V15.35Z' fill='%232C64E7'/%3E%3C/svg%3E%0A");
}

{# ====== infinite marquee ===== #}

.marquee-wrapper {
  overflow: hidden;
  width: 100%;
  background: linear-gradient(to right, #000066, #00ffcc, #ff0000, #ffff00);
  position: relative;
  padding: 8px 0px;
}

.marquee-track {
  display: flex;
  white-space: nowrap;
  will-change: transform;
  gap: 16px;
}

.marquee-text {
  font-size: 16px;
  text-transform: uppercase;
  color: white;
  white-space: nowrap;
  flex-shrink: 0;
}

.dot {
  color: white;
  font-weight: bold;
}