*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Arial,sans-serif;
}

.hero{
    position:relative;
    width:100%;
    height:100vh;
    overflow:hidden;
	padding:0;
}

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

.overlay{
    position:absolute;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.32);
    z-index:2;
}

.hero-content{

    position:relative;
    z-index:5;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    max-width:100%;
	align-items: center; 
    color:#fff;

}

.subtitle{

    letter-spacing:4px;
    text-transform:uppercase;
    margin-bottom:20px;
    color:#00d4ff;
	animation:fadeUp 1s ease;

}

.hero-content h1{
    font-size:70px;
    line-height:1.1;
    margin-bottom:25px;
	text-align: center;
    animation:fadeUp 1.2s ease;

}

.hero-content p{

    font-size:20px;
    line-height:1.8;
    max-width:600px;
    margin-bottom:40px;
	text-align: center;
    animation:fadeUp 1.4s ease;
	color:#fff !important;

}

.buttons{
    display:flex;
    gap:20px;
    animation:fadeUp 1.6s ease;
}

.btn{

    padding:16px 35px;
    border-radius:50px;

    text-decoration:none;

    transition:.4s;

}

.btn-primary{

    background:#ffcf03;
    color:#111;

}

.btn-primary:hover{

    background:#0d466c;

}

.btn-outline{

    border:2px solid #fff;
    color:#fff;

}

.btn-outline:hover{

    background:#fff;
    color:#111;

}

.scroll-down{

    position:absolute;

    bottom:35px;
    left:50%;

    transform:translateX(-50%);

    z-index:5;

}

.scroll-down span{

    display:block;

    width:30px;
    height:50px;

    border:2px solid #fff;

    border-radius:50px;

    position:relative;

}

.scroll-down span:before{

    content:"";

    position:absolute;

    left:50%;

    top:10px;

    width:6px;
    height:6px;

    background:#fff;

    border-radius:50%;

    transform:translateX(-50%);

    animation:scroll 2s infinite;

}

@keyframes scroll{

0%{

    opacity:1;
    top:10px;

}

100%{

    opacity:0;
    top:30px;

}

}

@keyframes fadeUp{

from{

    opacity:0;
    transform:translateY(40px);

}

to{

    opacity:1;
    transform:translateY(0);

}

}

@media(max-width:991px){

.hero-content h1{

    font-size:50px;

}

.hero-content{

    padding:40px;

}

}

@media(max-width:768px){

.hero-content h1{

    font-size:38px;

}

.hero-content p{

    font-size:17px;

}

.buttons{

    flex-direction:column;

}

}