/* VTM 8.8.4 — self-contained topic archive. Homepage/article cards stay unchanged. */
/* 8.8.5: the Ghost announcement must grow with wrapped mobile text. */
@media (max-width: 767px) {
    .tag-template #announcement-bar-root,
    .tag-template #announcement-bar-root .gh-announcement-bar { height: auto !important; min-height: 44px !important; }
    .tag-template #announcement-bar-root .gh-announcement-bar { padding: 10px 48px 10px 16px; }
    .tag-template #announcement-bar-root .gh-announcement-bar-content { max-width: 100%; overflow: visible; padding: 0; font-size: 12px; line-height: 1.45; white-space: normal; }
    .tag-template #announcement-bar-root .gh-announcement-bar-content p { margin: 0; font-size: inherit; line-height: inherit; }
    .tag-template #announcement-bar-root button { width: 44px; height: 44px; top: 50%; right: 0; transform: translateY(-50%); }
}
.vtm-archive {
    width: min(1200px, calc(100% - 48px));
    margin: 0 auto;
    padding: 12px 0 56px;
    color: #0a1638;
    font-family: var(--font-sans);
}
.vtm-archive-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    margin-bottom: 10px;
    color: #52617a;
    font-size: 1.2rem;
    line-height: 1.5;
}
.vtm-archive-breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; color: #264f9f; }
.vtm-archive-breadcrumb [aria-current] { color: #0a1638; font-weight: 600; }
.vtm-archive-banner { margin: 0; overflow: hidden; border-radius: 14px; background: #0a1638; }
.vtm-archive-banner > img { display: block; width: 100%; height: auto; aspect-ratio: 2021 / 778; object-fit: contain; }
.vtm-archive-topic { padding: 8px 0 0; }
.vtm-archive-cover { display: block; width: 100%; max-height: 460px; object-fit: contain; margin: 0 0 24px; border-radius: 14px; background: #f3f6fa; }
.vtm-archive-eyebrow { display: block; margin-bottom: 8px; font-size: 1.1rem; letter-spacing: .1em; text-transform: uppercase; color: #264f9f; }
.vtm-archive-topic h1 { margin: 0; font: 500 clamp(3rem, 3.5vw, 4.8rem)/1.12 var(--vtm-font-display); letter-spacing: -.025em; overflow-wrap: anywhere; }
.vtm-archive-topic > p { max-width: 760px; margin: 12px 0 0; font-size: 1.6rem; line-height: 1.55; color: #52617a; }
/* 8.8.6: subject-specific panoramic artwork with accessible, responsive live text. */
.vtm-topic-visual { margin: 0; }
.vtm-topic-visual-stage { position: relative; display: grid; overflow: hidden; isolation: isolate; border-radius: 14px; background: #0a1638; }
.vtm-topic-visual-image { grid-area: 1 / 1; align-self: center; display: block; width: 100%; height: auto; margin: 0; }
.vtm-topic-visual-stage::after { content: ""; grid-area: 1 / 1; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgb(10 22 56 / 42%), transparent 64%); }
.vtm-topic-visual-copy { grid-area: 1 / 1; z-index: 2; align-self: center; width: 49%; padding: 32px 0 40px 40px; color: #fff; }
.vtm-topic-visual-copy .vtm-archive-eyebrow { margin-bottom: 16px; color: #c3d6f4; letter-spacing: .18em; font-size: 1.15rem; }
.vtm-topic-visual-copy h1 { margin: 0; color: #fff; font: 500 clamp(3.2rem, 3.3vw, 4.4rem)/1.12 var(--vtm-font-display); letter-spacing: -.025em; overflow-wrap: normal; hyphens: auto; }
.vtm-topic-visual-tagline { max-width: 400px; margin: 18px 0 0; color: #e2eafa; font: italic 400 clamp(1.8rem, 1.9vw, 2.4rem)/1.4 var(--font-serif); }
.vtm-topic-visual-credit { position: absolute; bottom: 14px; left: 40px; z-index: 2; color: #c3d1e6; font-size: 1rem; line-height: 1.4; }
.vtm-topic-visual-description { max-width: 880px; margin: 18px 0 0; color: #52617a; font-size: 1.5rem; line-height: 1.55; }
@media (max-width: 999px) {
    .vtm-topic-visual-copy { padding-left: 28px; }
    .vtm-topic-visual-copy h1 { font-size: 3.2rem; }
    .vtm-topic-visual-credit { left: 28px; }
}
@media (max-width: 767px) {
    .vtm-topic-visual-stage { display: flex; flex-direction: column; border-radius: 10px; }
    .vtm-topic-visual-stage::after { display: none; }
    .vtm-topic-visual-copy { width: 100%; padding: 20px; }
    .vtm-topic-visual-copy .vtm-archive-eyebrow { margin-bottom: 10px; font-size: 1rem; }
    .vtm-topic-visual-copy h1 { font-size: clamp(2.4rem, 5.6vw, 3rem); line-height: 1.15; overflow-wrap: anywhere; }
    .vtm-topic-visual-tagline { max-width: none; margin-top: 10px; font-size: 1.65rem; }
    .vtm-topic-visual-credit { position: static; padding: 0 20px 16px; font-size: .9rem; }
    .vtm-topic-visual-description { margin-top: 14px; font-size: 1.35rem; }
}
.vtm-archive-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px 28px; margin: 30px 0 24px; padding-bottom: 20px; border-bottom: 1px solid #d9e0ec; }
.vtm-archive-heading h2 { margin: 0; font: 500 clamp(2.4rem, 2.2vw, 3.2rem)/1.2 var(--vtm-font-display); letter-spacing: -.025em; }
.vtm-archive-heading p { max-width: 700px; margin: 8px 0 0; color: #52617a; font-size: 1.45rem; line-height: 1.5; }
.vtm-archive-count { flex-shrink: 0; color: #52617a; font-size: 1.2rem; line-height: 1.5; }
.vtm-archive-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.vtm-archive-card { min-width: 0; margin: 0; border: 1px solid #d9e0ec; border-radius: 14px; background: #fff; }
.vtm-archive-card-link { display: flex; flex-direction: column; height: 100%; min-width: 0; overflow: hidden; border-radius: inherit; color: #0a1638; text-decoration: none; }
.vtm-archive-card-image { width: 100%; margin: 0; aspect-ratio: 16 / 9; background: #f3f6fa; overflow: hidden; }
.vtm-archive-card-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.vtm-archive-card-body { display: flex; flex: 1; flex-direction: column; min-width: 0; padding: 20px; }
.vtm-archive-card-date { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 10px; font-size: 1.1rem; line-height: 1.5; color: #52617a; }
.vtm-archive-card-body h3 { margin: 0; color: #0a1638; font: 500 2.2rem/1.25 var(--vtm-font-display); letter-spacing: -.025em; overflow-wrap: anywhere; hyphens: manual; }
.vtm-archive-card-excerpt { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 12px 0 0; color: #52617a; font-size: 1.45rem; line-height: 1.5; }
.vtm-archive-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 20px; color: #52617a; font-size: 1.1rem; line-height: 1.45; }
.vtm-archive-card-footer > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.vtm-archive-card-arrow { flex-shrink: 0; color: #264f9f; font-size: 1.8rem; }
.vtm-archive-card:focus-within { border-color: #2451a4; }
.vtm-archive a:focus-visible { outline: 3px solid #2451a4; outline-offset: 4px; }
@media (hover: hover) {
    .vtm-archive-card:hover { border-color: #8fa7cf; box-shadow: 0 5px 20px rgb(10 22 56 / 6%); }
    .vtm-archive-card-link:hover h3 { color: #264f9f; }
    .vtm-archive-breadcrumb a:hover { text-decoration: underline; }
}
.vtm-archive-pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px 28px; margin-top: 32px; font-size: 1.3rem; color: #52617a; }
.vtm-archive-pagination a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 16px; border: 1px solid #d9e0ec; border-radius: 8px; color: #264f9f; }
.vtm-archive-empty { grid-column: 1 / -1; margin: 0; padding: 24px; border-radius: 12px; background: #f3f6fa; font-size: 1.6rem; }
.vtm-archive-empty a { display: inline-block; color: #264f9f; text-decoration: underline; }
/* Indicate the current topic without relying on color alone. */
.tag-template:not(.is-head-dark):not(.is-head-brand) #gh-head .nav-current > a { color: #264f9f; text-decoration: underline; text-underline-offset: 7px; text-decoration-thickness: 2px; }
.tag-template .vtmx-mobile-nav .nav-current > a { color: #fff; text-decoration: underline; text-underline-offset: 6px; }
/* Keep the bottom of the archive useful rather than a large empty block. */
.tag-template .gh-foot { margin-top: 0; padding: 40px 24px 48px; }
.tag-template .gh-foot-inner { gap: 0; }
.tag-template .vtm-foot-partner { min-height: 44px; margin-bottom: 12px; }
.tag-template .gh-foot .gh-subscribe { grid-template-columns: minmax(0, 1fr) auto; gap: 12px 32px; margin: 0 0 32px; }
.tag-template .gh-subscribe-title { grid-column: 1; font-size: clamp(2.4rem, 2.5vw, 3.4rem); }
.tag-template .gh-subscribe-description { grid-column: 1; max-width: 760px; margin: 0; font-size: 1.6rem; }
.tag-template .gh-subscribe-btn { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
.tag-template .vtm-foot-about { margin-bottom: 20px; }
.tag-template .vtm-foot-author, .tag-template .gh-copyright { color: #b8c4dc; }
.tag-template .vtmx-coop-footer { margin: 8px 0 20px; }
.tag-template .gh-copyright { margin-top: 24px; text-align: center; }
@media (max-width: 999px) {
    .vtm-archive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .vtm-archive-heading { align-items: start; flex-direction: column; gap: 12px; }
}
@media (max-width: 599px) {
    .vtm-archive { width: calc(100% - 32px); padding: 4px 0 32px; }
    .vtm-archive-breadcrumb { margin-bottom: 4px; font-size: 1.1rem; }
    .vtm-archive-banner, .vtm-archive-cover { border-radius: 10px; }
    .vtm-archive-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .vtm-archive-heading { margin: 24px 0 18px; padding-bottom: 16px; }
    .vtm-archive-heading p { font-size: 1.35rem; }
    .vtm-archive-card-body { padding: 16px; }
    .vtm-archive-card-body h3 { font-size: 2.1rem; }
    .vtm-archive-card-excerpt { display: none; }
    .vtm-archive-card-footer { padding-top: 16px; }
    .tag-template .gh-foot { padding: 32px 16px 88px; }
    .tag-template .gh-foot .gh-subscribe { grid-template-columns: minmax(0, 1fr); }
    .tag-template .gh-subscribe-btn { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 8px; }
}
