body{
    background-color: black;
    margin:0;
    width:100vw;
    height:100vh;
    overflow:hidden;
    position:relative;
}

.hero{
 display:flex;
 height:55vh;
 width:100vw;
 justify-content:center;
 flex-direction: column;
 align-items:center;
}

.hero h1{
    display: inline-block;
    font-size: 114px;
    margin-bottom: -204px;
    color: white;
}

.hero p{
    display: inline-block;
    margin-bottom: -82px;
    font-size: 20px;
    letter-spacing: 7px;
    word-spacing: 17px;
    background: -webkit-linear-gradient(#eee, #333);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

img{
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    margin:auto;
    margin-top: -33px;
    width: 100vw;
    height: 174vh;
    box-shadow: -1px -14px 20px 7px #30316a;
}

button{
    cursor: pointer;
    margin:10px;
    color: white;
    background-color: #0b0a0c26;
    border: 1px solid white;
    border-radius: 38px;
    width: 120px;
    height: 40px;
    letter-spacing: 2px;
    word-spacing: 4px;
    font-weight: bold;
    transition:all 0.1s ease-in;
}

.home-btn-cont{
position: fixed;
display: flex;
justify-content: center;
width:100%;
bottom:20%;
}

button:hover{
    color:black;
    background-color: #eee;
    
}