.in {width:100%; margin:0 auto;  max-width:1550px;  }
 

@media all and (max-width:1550px) {
  .in {padding:0 4%; box-sizing:border-box }
 
}


.vi * {transition: all 0.3s ease;}
.vi {position:relative; width:100%; height:100vh}
.vi .in { position:absolute;   left:50%; top:50%; transform: translate(-50%, -50%);  color:#fff;  z-index:9999; }
.vi .in h3 {margin-top:20px; font-weight:800; line-height:1.3; font-size:55px; letter-spacing:-2px; color:#fff}
.vi .in p {font-size:22px; margin:25px 0 50px 0; color:#fff  }
.vi .in .flex {gap:20px;  }


.vi .in  a {color:#fff;    background: rgba(0, 0, 0, .1);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px); padding:15px 60px; display:inline-block; font-size:20px; font-weight:400; overflow:hidden}
.vi .in  a:hover {background-color:#fff; color:#000; border-radius:50px}  

.vi video {position:absolute; left:50%; top:50%;  transform: translate(-50%, -50%);   width: 100%; height: 100%;   object-fit: cover;  }

@media all and (max-width:900px) {

	.vi .in h3 {   font-size:30px; }
	.vi .in p {font-size:16px;  }
	.vi .in p {margin:15px 0 30px 0}
	.vi .in .flex {gap:10px;}
	.vi .in a {font-size:16px; padding:10px 25px}

}