/* ============================================
   ARTICLE / NEWSLETTER DETAIL PAGE
   Server-rendered by functions/articles/[[path]].js, reusing the real
   header/sidebar markup pulled from index.html at request time — this file
   only styles the content itself (everything else comes from header.css/
   sidebar.css/base.css, already loaded by this page). Content is just the
   embedded PDF viewer, filling the main content area rather than sitting in
   the homepage's padded .articles-section/.container.
   ============================================ */

.article-detail-main {
    display: flex;
    padding: 1rem;
    /* --header-height is only accurate at 1300px+ (mobile's header height
       varies with wrapping) — same reasoning sidebar.css uses for when it
       sizes itself off this token vs. plain 100vh. */
    height: 70vh;
}

@media screen and (min-width: 1300px) {
    .article-detail-main {
        height: calc(100vh - var(--header-height));
    }
}

.article-detail-viewer {
    flex: 1;
    border: 3px solid var(--color-red);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-brand);
}

.article-detail-viewer iframe {
    width: 100%;
    height: 100%;
    border: none;
}