/* Desktop article layout. Native article markup and styles remain below 1051px. */
#taj-article-page .taj-article-crumb,
#taj-article-page .taj-article-sidebar,
#taj-article-page .gh-article-meta-length {
    display: none;
}

/* Watch TAJ posts use the feature image on cards, but lead with the video on the post page. */
#taj-article-page .gh-article.tag-videos .gh-article-image {
    display: none !important;
}

/* Never advertise the Watch TAJ archive inside a Watch TAJ article. */
.post-template.tag-videos .taj-watch-promo {
    display: none !important;
}

#taj-article-page .gh-article.tag-videos .gh-content > .kg-embed-card:first-child {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 1.5em !important;
    overflow: hidden !important;
    border-radius: 8px;
    background: #0d1b2a;
}

#taj-article-page .gh-article.tag-videos .gh-content > .kg-embed-card:first-child iframe {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9;
    border: 0 !important;
}

@media (max-width: 720px) {
    #taj-article-page .gh-article.tag-videos .gh-content > .kg-embed-card:first-child {
        margin-bottom: 1.15em !important;
        border-radius: 4px;
    }
}

#taj-article-page .taj-article-layout {
    display: contents;
}

/* Give the reusable writer bio its full width on phones and tablets. */
@media (max-width: 1050px) {
    #taj-article-page .gh-content .taj-author-box {
        display: block;
        padding: 20px 0;
    }

    #taj-article-page .gh-content .taj-author-photo {
        display: none !important;
    }

    #taj-article-page .gh-content .taj-author-content {
        width: 100%;
        min-width: 0;
    }
}

@media (min-width: 1051px) {
    #taj-article-page {
        --article-navy: #0d1b2a;
        --article-gold: #c9902e;
        --article-line: #e6e2dd;
        --line: #ded8cf;
        width: var(--taj-desktop-width);
        max-width: var(--taj-desktop-max-width);
        margin: 22px auto 60px;
        padding: 0;
        color: var(--article-navy);
        font-family: Inter, Arial, sans-serif;
        letter-spacing: 0;
    }

    #taj-article-page * { box-sizing: border-box; }
    #taj-article-page .taj-article-layout {
        display: grid;
        grid-template-columns: var(--taj-desktop-columns);
        gap: var(--taj-desktop-gap);
        align-items: start;
    }
    #taj-article-page .gh-article { min-width: 0; grid-column: 1 / span 2; }
    #taj-article-page .taj-article-crumb {
        display: flex;
        flex-wrap: wrap;
        gap: 9px;
        margin: 0 0 18px;
        color: #56616b;
        font: 12px/1.5 Inter, Arial, sans-serif;
    }
    #taj-article-page .taj-article-crumb a,
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-sidebar a { color: inherit; text-decoration: none; }
    #taj-article-page .taj-article-crumb a:hover,
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-sidebar a:hover { text-decoration: underline; text-underline-offset: 3px; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-editor-note-copy h2 a:hover,
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-editor-note-copy h2 a:focus-visible { text-decoration: none; }

    #taj-article-page .gh-article-header {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        margin: 0;
    }
    #taj-article-page .gh-article-image { order: -1; margin-top: 0; margin-bottom: 22px; }
    #taj-article-page .gh-feature-image { display: block; width: 100%; height: auto; object-fit: contain; }
    #taj-article-page .gh-article-image figcaption { margin-top: 8px; color: #65707a; font: 12px/1.45 Inter, Arial, sans-serif; }
    #taj-article-page .gh-article-tag { align-self: flex-start; margin: 0 0 9px; color: #946317; font: 700 12px/1.4 Inter, Arial, sans-serif; letter-spacing: .08em; }
    #taj-article-page .gh-article-title { margin: 0; color: var(--article-navy); font: 700 clamp(40px, 3.7vw, 54px)/1.06 Georgia, 'Times New Roman', serif; letter-spacing: -.035em; }
    #taj-article-page .gh-article-excerpt { max-width: none; margin: 14px 0 20px; color: #46525e; font: 21px/1.42 Georgia, 'Times New Roman', serif; letter-spacing: 0; }
    #taj-article-page .gh-meta-share { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 20px 0 24px; padding: 0 0 19px; border-bottom: 1px solid var(--article-line); }
    #taj-article-page .gh-article-excerpt + .gh-meta-share { margin-top: 0; }
    #taj-article-page .gh-article-meta { margin: 0; }
    #taj-article-page .gh-article-meta-content { color: #65707a; font: 12px/1.45 Inter, Arial, sans-serif; }
    #taj-article-page .gh-article-author-image,
    #taj-article-page .gh-article-author-name,
    #taj-article-page .gh-article-meta-length { display: none; }
    #taj-article-page .gh-button-share { flex-shrink: 0; }

    /* Named grid lines keep native wide/full cards inside the story column. */
    #taj-article-page .gh-content {
        grid-template-columns: [full-start wide-start main-start] minmax(0, 1fr) [main-end wide-end full-end];
        margin-top: 24px;
        font: 18px/1.6 Inter, Arial, sans-serif;
        color: #26323e;
        letter-spacing: 0;
    }
    #taj-article-page .gh-article-header:has(.gh-meta-share) + .gh-content { margin-top: 0; }
    #taj-article-page .gh-content > * { min-width: 0; }
    #taj-article-page .gh-content > h2 { color: var(--article-navy); font: 700 28px/1.18 Georgia, 'Times New Roman', serif; letter-spacing: -.02em; }
    #taj-article-page .gh-content > h3 { color: var(--article-navy); font: 700 24px/1.2 Georgia, 'Times New Roman', serif; }
    #taj-article-page .gh-content > blockquote { padding: 18px 22px; border-left: 3px solid var(--article-gold); background: #f7f4ef; font: italic 23px/1.4 Georgia, serif; }
    #taj-article-page .gh-content > .kg-width-full { width: 100%; max-width: 100%; }

    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-sidebar { display: grid; grid-column: 3; gap: 22px; min-width: 0; padding-left: 14px; border-left: 1px solid #ded8cf; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-sidebar h2 { margin: 0 0 12px; color: var(--article-navy); font: 700 27px/1.1 Georgia, 'Times New Roman', serif; letter-spacing: -.025em; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-editor-note-copy h2 { margin: 0; font-size: 20px; line-height: 1.08; }
    #taj-article-page .gh-content .gh-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: 0; height: auto; margin: 0; padding: 0; background: transparent; border: 0; border-radius: 0; }
    #taj-article-page .gh-content .gh-form-input { position: static; display: block; width: 100%; min-width: 0; height: 42px; padding: 0 9px; border: 1px solid #d8d0c4; border-radius: 0; background: #fff; color: #26323e; font: 12px Inter, Arial, sans-serif; }
    #taj-article-page .gh-content .gh-form-input:focus-visible { outline: 2px solid var(--article-navy); outline-offset: -2px; }
    #taj-article-page .gh-content .gh-form .gh-button { position: relative; right: auto; width: auto; min-width: 94px; height: 42px; min-height: 42px; padding: 0 12px; border: 0; border-radius: 0; background: #946317; color: #fff; font: 700 12px Inter, Arial, sans-serif; }
    #taj-article-page .gh-content .gh-form [data-members-error] { position: static; grid-column: 1 / -1; margin: 7px 0 0; font: 12px/1.4 Inter, Arial, sans-serif; }
    #taj-article-page .gh-content .gh-form [data-members-error]:empty { margin: 0; }

    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-video { margin: 0; padding: 12px; background: #fff; border: 1px solid #ded8cf; border-top: 3px solid var(--article-navy); }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-video h2 { margin: 0; font-size: 22px; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-video p { margin: 4px 0 8px; color: #56616b; font: 10px/1.3 Inter, Arial, sans-serif; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-video-frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--article-navy); }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-video-frame video { display: block; width: 100%; height: 100%; object-fit: contain; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-comic img { display: block; width: 100%; height: auto; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-comic p { margin: 8px 0 0; color: #56616b; font: 12px/1.4 Georgia, serif; text-align: center; }

    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-ad > small { display: block; margin: 0 0 7px; color: #6a747d; font: 9px/1.2 Inter, Arial, sans-serif; text-align: center; letter-spacing: .12em; text-transform: uppercase; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-ad:has([data-taj-ad][hidden]) { display: none; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-fallback-ad-image { display: none; width: 100%; height: auto; object-fit: contain; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) [data-taj-ad-fallback].has-image { display: block; min-height: 0; height: auto; padding: 0; border: 0; background: #fff; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) [data-taj-ad-fallback].has-image > :not(.taj-fallback-ad-image) { display: none; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) [data-taj-ad-fallback].has-image .taj-fallback-ad-image { display: block; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) [data-taj-ad]:has([data-taj-ad-fallback].has-image) { min-height: 0; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) [data-taj-ad]:has(.adsbygoogle) { min-height: 250px; }

    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-related { border: 1px solid var(--article-line); padding: 18px 16px 4px; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-related h2 { font-size: 24px; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-related-link { display: flex; align-items: flex-start; gap: 12px; padding: 14px 0; border-top: 1px solid var(--article-line); }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-related-link > div { min-width: 0; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-related-link img { width: 78px; height: 72px; flex: 0 0 78px; object-fit: cover; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-related-link small { display: block; margin: 0 0 5px; color: #946317; font: 700 10px/1.3 Inter, Arial, sans-serif; letter-spacing: .05em; text-transform: uppercase; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-related-link h3 { margin: 0; font: 19px/1.18 Georgia, 'Times New Roman', serif; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-view-more { display: block; padding: 12px 0 10px; border-top: 1px solid var(--article-line); font: 13px/1.4 Inter, Arial, sans-serif; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-promise { padding: 30px 25px; background: #f7f4ef; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-promise p { margin: 0; font: italic 25px/1.35 Georgia, 'Times New Roman', serif; }
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-article-promise span { display: block; margin-top: 17px; text-align: right; font: 18px Georgia, serif; }

    /* Reusable writer snippets stay in article content, independent of staff authors. */
    #taj-article-page .taj-author-box { display: flex; gap: 22px; align-items: flex-start; margin: 48px 0 24px; padding: 26px 0; border-top: 1px solid var(--article-line); border-bottom: 1px solid var(--article-line); }
    #taj-article-page .taj-author-photo { flex: 0 0 135px; }
    #taj-article-page .taj-author-photo img { display: block; width: 135px; height: 135px; border-radius: 50%; object-fit: cover; object-position: center 20%; }
    #taj-article-page .taj-author-content { min-width: 0; flex: 1; }
    #taj-article-page .taj-author-content h3 { margin: 0 0 8px; font: 700 25px/1.2 Georgia, serif; }
    #taj-article-page .taj-author-role { margin-bottom: 6px; font-size: 14px; font-weight: 600; }
    #taj-article-page .taj-author-column { margin-bottom: 16px; color: #946317; font: italic 17px Georgia, serif; }
    #taj-article-page .taj-author-content p { margin-bottom: 12px; font-size: 15px; }
    #taj-article-page .taj-author-link { font-size: 13px; font-weight: 700; }
    #taj-article-page .taj-article-signup { margin: 35px 0 0; padding: 32px; background: #f7f4ef; }
    #taj-article-page .taj-article-signup h2 { margin: 0 0 10px; font: 700 30px/1.15 Georgia, serif; }
    #taj-article-page .taj-article-signup p { margin: 0 0 18px; font: 16px/1.5 Inter, Arial, sans-serif; }
    #taj-article-page .taj-article-signup .gh-form { max-width: 450px; margin: 0 auto; }
    #taj-article-page .gh-comments { margin-top: 40px; grid-template-columns: var(--taj-desktop-columns); column-gap: var(--taj-desktop-gap); }
    #taj-article-page .gh-comments > * { grid-column: 1 / span 2; }
    #taj-article-legacy-related { display: none; }
}

@media (min-width: 1051px) {
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-start-here-promo a,
    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-start-here-promo img {
        display: block;
        width: 100%;
    }

    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-start-here-promo img {
        height: auto;
        border: 1px solid var(--article-line);
    }

    :is(#taj-article-page, #taj-page-page, #taj-writer-page, #taj-category-page) .taj-watch-promo img {
        display: block;
        width: 100%;
        height: auto;
        border: 1px solid var(--article-line);
    }
}