*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, sans-serif;
}

html, body{
    height:100%;
    overflow:hidden;
    background:black;
}

.media-layer{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:opacity 1s ease-in-out;
}

.hidden{
    opacity:0;
    pointer-events:none;
}

.visible{
    opacity:1;
}

.overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,0.35);
}

.content{
    position:absolute;
    bottom:8%;
    left:5%;
    color:#fff;
    max-width:50%;
}

.content h1{
    font-size:40px;
    margin-bottom:15px;
}

.content p{
    font-size:18px;
    line-height:1.6;
}