/* Centered content area */
* {
    white-space: nowrap; /* Prevent line breaks */
    overflow: hidden; /* Hide overflow */
    text-overflow: ellipsis; /* Show "..." when text is cut */
}

button {
    all: unset; /* Resets all properties to their initial or inherited values */
    cursor: pointer; /* Ensures the cursor changes to a hand icon on hover */
    /* Inherit font and color from ancestor */
    color: inherit;
    font: inherit;
    /* Corrects inability to style clickable input types in iOS */
    -webkit-appearance: none;
}

@font-face {
    font-family: "AppleGaramond";
    src: url("/fonts/AppleGaramond.ttf") format("truetype");
}

body {
    font-family: "AppleGaramond", serif;
}

.content-wrapper {
    width: 70%;
    margin: 0 auto;
    transition: width 0.4s ease;
}

/* Mobile */
@media (max-width: 1000px) {
    .content-wrapper {
        width: 90%;
    }
}

/* Flex row: line left, button right */
.header-container {
    display: flex;
    align-items: center;
    width: 100%;
}

.content-container {
    display: flex;
    align-items: center;
    width: 100%;
    height: 111px;
}

/* The line takes all remaining space */
.center-line {
    height: 2px;
    background: #a0a0a0;
    flex: 1; /* Stretch line full width */
}

.filler {
    flex-grow: 1;
}

/* Right-side button */
.header-btn-sub {
    padding: 6px 12px;
    margin: 74px 0px 16px 0px;
    font-size: 14px;
    cursor: pointer;
    border: none;
    border-radius: 5px;
    width: 200px;
    height: 31;
    background-color: #0088ff;
    color: #ffffff;
    display: flex; /* Enables Flexbox */
    justify-content: center; /* Centers text horizontally */
    align-items: center;
    font-family: "AppleGaramond", serif;
    height: 20px;
    width: auto;

    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 28px;
}

.header-btn-ld {
    margin: 74px 10px 16px 0px;
    border: none;
    background-color: #fff;
    width: 20px;
    height: 20px;
}

/* High-Z element that can be positioned anywhere */
.high-z {
    position: absolute;
    top: 140px; /* <-- CHANGE THIS to position it under the line */
    left: 50%;
    transform: translateX(-50%); /* Center it under the line */
    z-index: 9999;
}

h1 {
    margin: 74px 0px 8px 0px;
    font-size: 40;
}

.body-img {
    height: 87px;
    width: 164px;
    border-radius: 5px;
    border: 1px solid #000;
    margin: 0px 10px 0px 0px;
    flex-shrink: 0;
}

.flex-content {
    flex: 1 1 auto;
    min-width: 0;

    flex-direction: column;
    height: 87px;
}
.flex-btn {
    flex-direction: column;
    height: 87px;
    justify-content: flex-start;
}

.read-more-btn {
    margin: 0px 0px 0px 0px;

    color: #0088ff;
    flex-shrink: 0;
}

.tag-holder {
    margin: 12px 0px 0px 0px;
}

h2 {
    margin: 0px 0px 0px 0px;
}

p {
    margin: 0px 0px 0px 0px;
}

.tag-holder {
    display: flex;
}

.content-description {
}

.tag {
    margin: 0px 2px 0px 0px;
}