.page-header {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: start;
    gap: 8px;
}

/* no thumbnail */
.page-header:has(> :only-child) {
    justify-content: center;
}

#post-metadata {
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    justify-content: center;
    gap: 8px;
}

.page-header h1,
.page-header h2,
.page-header h3 {
    margin: 0;
}

.page-header #post-category {
    font-size: 18px;
}

.page-header #post-category>a { color: lightgray; }

.page-header #post-date {
    font-size: 16px;
    color: gray;
}

#post-hero-image {
    display: flex;
    justify-content: center;
}

#post-hero-image img {
    object-fit: contain;
    max-height: 60vh;
    aspect-ratio: 16 / 9;
    width: auto;
}