* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: "Times New Roman", serif;
    background: #f2e8e2;
}

.hero {
    min-height: 100vh;
    display: grid;
    place-items: center;
}

.hero__image {
    width: 100%;
    height: 100vh;
    object-fit: cover;
    display: none;
}

.hero__image--desktop {
    display: block;
}

@media (max-width: 768px) {
    .hero__image--desktop {
        display: none;
    }

    .hero__image--mobile {
        display: block;
        height: 100vh;
    }
}