section.hero {
    position: relative;
    z-index: 1;
    
    display: flex;
    flex-direction: column;

    justify-content: center;
    align-items: center;

    width: 100%;
    height: 100dvh;

    overflow: hidden;

    background: transparent;
    background-image: url(../assets/coming-soon.jpg);

    background-repeat: no-repeat;
    background-size: cover;
    background-position: top right;

}   section.hero::after {
    position: absolute;
    content: '';

    z-index: -1;
    inset: 0 0 0 0;
    
    background: rgba(0, 0, 0, 0.4);

}   section.hero .container {
    width: min-content;

    display: flex;
    flex-direction: column;

    justify-content: center;
    align-items: center;

}   section.hero .container h1 {
    width: max-content;
    font-size: 35px;
    text-align: center;

}   section.hero .container p {
    font-size: 15px;
    width: auto;

    text-align: center;
}

@media (max-width: 592px) {
    section.hero .container {
        width: 100%;
    }
    section.hero .container h1 {
        width: 100%;
    }
}