/* Reserve the blog banner area even when its media file is unavailable. */
.home-page .blog-wrapper-box {
    min-height: 630px;
}

.home-page .blog-wrapper-box > img {
    display: block;
    aspect-ratio: 1644 / 630;
}

@media only screen and (max-width: 1600px) {
    .home-page .blog-wrapper-box {
        min-height: 560px;
    }
}

@media only screen and (max-width: 768px) {
    .home-page .blog-wrapper-box {
        min-height: 480px;
    }

    .home-page .blog-wrapper-mask {
        position: relative;
        height: auto;
        min-height: 480px;
        z-index: 1;
    }

    .home-page .blog-wrapper .blog-wrapper-mask .blog-wrapper-mask-box {
        height: auto;
    }

    .home-page .blog-wrapper-box > img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
