*{
    box-sizing: border-box;
    outline: none;
    margin: 0;
    padding: 0;
}
body{
    background: #000;
    font-family: "Bai Jamjuree", sans-serif;
}
header{
    display: grid;
    justify-content: center;
    /* background: #fff; */
    position: absolute;
    top: 25px;
    width: 100vw;
    a{
        padding-block: 25px;
        img{
            /* height: 30px; */
            height: clamp(20px,6vw,30px);
            display: block;
            filter: invert(1);
        }
    }
}
main{
    #hero{
        position: relative;
        display: grid;
        height: 100vh;
        &:after{
            content: "";
            display: block;
            width: 100vw;
            position: absolute;
            margin: auto;
            top: 0;
            left: 0;
            right: 0;
            height: 200px;
            background: linear-gradient(#000, transparent);
            z-index: -1;
        }
        video{
            position: absolute;
            inset: 0;
            width: 100vw;
            height: 100svh;
            margin: auto;
            z-index: -1;
            object-fit: cover;
            object-position: center;
            filter: brightness(0.9) blur(5px) contrast(1.1);
        }
        h1{
            color: #fff;
            font-size: clamp(2.8em,7vw,5em);
            text-align: center;
            text-transform: uppercase;
            font-weight: 400;
            /* padding-top: 80px; */
            align-self: center;
        }
    }

}
footer{
    position: fixed;
    bottom: 10px;
    width: 100%;
    color: #fff;
    opacity: 0.7;
    text-align: center;
}