.page-template-tpl-topic-page-2026 .fl-page-content-lh {
    background-image: none;
}

.topic-2026 ul {
    list-style: disc;
    text-indent: 0px;
}


.topic-2026 .hero {
    padding-top: 60px;
    background-color: #F0F5F7;
    color: #000;
    padding: 32px 0;
}

.topic-2026 .hero-grid {
    display: grid;
    grid-template-columns: 1fr 480px;
    gap: 50px;
    align-items: start;
}

.topic-2026 .hero-figure {
    margin: 0;
}

.topic-2026 .body .container {
    max-width: 900px;
    margin-top: 40px;
}

.section-blue .section-head h2 {
    text-align: center;
    width: 100%;
    display: block;
    font-size: 32px;
}
.fl-module-content .fl-rich-text h2 {
    margin-top: 20px;
}

.fl-module.fl-module-rich-text .fl-module-content.fl-node-content {
    margin-bottom: 0px;
}

.takeaways-body.statement {
    padding: 23px;
    background-color: #D9E5EA;
    margin-top: 40px;
}

.topic-2026 .takeaways-body li {
    margin-bottom: 11px;
}

.topic-2026 .hero-figure img {
    width: 100%;
    height: auto;
    display: block;
}

.topic-2026 .hero-caption {
    font-size: 13px;
    color: #555;
    margin-top: 8px;
    line-height: 1.4;
}

.topic-2026 .takeaways {
    background: transparent;
    color: #000;
    padding: 0 30px;
    border-radius: 0;
}

.topic-2026 .takeaways-title {
    color: #000;
    margin: 0 0 10px;
    font-size: 16px;
    text-transform: uppercase;
}

.topic-2026 .takeaways-body {
    font-size: 15px;
    line-height: 1.55;
}

    .topic-2026 .takeaways-body ul {
        padding-left: 1.1em;
        margin: 0;
    }
/* Body: full-width Beaver Builder content (the CTA is an overlay, below) */
.topic-2026 .body {
    position: relative;
    padding: 12px 0 48px;
}

.topic-2026 .body-grid {
    display: block;
}

.topic-2026 .content {
    min-width: 0;
}
/* Floating CTA rail — an invisible, out-of-flow column that spans the body
   section but stops 300px above its bottom. Reserves no space in the content,
   and lets clicks pass through to the content except on the card itself. */
.topic-2026 .cta-rail {
    position: absolute;
    left: 0px;
    top: 0;
    bottom: 300px;
    width: 280px;
    max-width: calc(100vw - 48px);
    z-index: 1000;
    pointer-events: none;
}
/* The card sticks to the vertical middle of the viewport (JS sets its top to the
   centred position), but is bounded by the rail — so it never leaves the body
   section and releases 300px before the section's bottom. Parked off-screen left
   until the reader settles in, then .is-pinned sweeps it in. */
.topic-2026 .cta-box {
    position: sticky;
    top: var(--cta-top,40vh);
    pointer-events: auto;
    background: #032148;
    color: #fff;
    padding: 33px 22px;
    border-radius: 0;
    box-shadow: 0 12px 32px rgba(0,20,40,.28);
    transform: translateX(calc(-100% - 48px));
    opacity: 0;
    visibility: hidden;
    transition: transform .55s cubic-bezier(.22,1,.36,1),opacity .55s ease,visibility .55s;
    text-align: center;
}

.topic-2026 .cta-rail.is-pinned .cta-box {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
}

@media (prefers-reduced-motion: reduce) {
    .topic-2026 .cta-box {
        transition: opacity .3s ease,visibility .3s;
        transform: none;
    }
}

.topic-2026 .cta-text {
    font-size: 22px;
    line-height: 1.35;
    margin: 0 0 8px;
    font-weight: 600;
    text-align: center;
}

.cta-text-subline {
    margin-bottom: 30px;
}

.topic-2026 .cta-btn {
    display: inline-block;
    background: #00A9E0;
    color: #fff;
    font-weight: 500;
    text-transform: uppercase;
    padding: 8px 25px;
    border-radius: 50px;
    cursor: pointer;
    font-size: 14px;
    border: transparent;
    margin: auto;
    text-align: center;
    float: none;
}

    .topic-2026 .cta-btn:hover {
        background: #00A9E0;
    }

.topic-2026 .modal[hidden] {
    display: none;
}

.topic-2026 .modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.topic-2026 .modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,20,40,.7);
}

.topic-2026 .modal-dialog {
    position: relative;
    background: #fff;
    max-width: 520px;
    width: 100%;
    padding: 32px;
    border-radius: 6px;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    max-height: 90vh;
    overflow: auto;
}

.topic-2026 .modal-close {
    position: absolute;
    top: 8px;
    right: 14px;
    background: none;
    border: 0;
    font-size: 1.9rem;
    line-height: 1;
    cursor: pointer;
    color: #556;
}
/* References (Pods 'related_links') */
.topic-2026 .references {
    padding: 8px 0 40px;
    max-width: 900px;
    margin: auto;
}

.topic-2026 .references-box {
    padding: 0;
    border: 2px solid #F2F2F2;
}

.topic-2026 .references-title {
    font-size: 16px;
    text-transform: uppercase;
    color: #012a4a;
    background-color: #F2F2F2;
    padding: 10px 10px;
}

.topic-2026 .references-body {
    font-size: 13px;
    line-height: 1.6;
    color: #33424e;
    padding: 10px;
}

    .topic-2026 .references-body a {
        word-break: break-word;
    }

    .topic-2026 .references-body ol, .topic-2026 .references-body ul {
        margin: 0;
        padding-left: 1.2em;
    }
/* Feed sections */
.topic-2026 .section {
    padding: 44px 0;
}

.topic-2026 .section-blue {
    background: #0a5a9c;
    color: #fff;
}

    .topic-2026 .section-blue a, .topic-2026 .section-blue h2, .topic-2026 .section-blue h3 {
        color: #fff;
    }

.topic-2026 .section-head {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    gap: 16px;
    margin-bottom: 10px;
}

    .topic-2026 .section-head h2 {
        margin: 0;
    }

.topic-2026 .feed-subhead {
    margin: 0 0 16px;
}
/* More topics cards */
.topic-2026 .cards {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
}

    .topic-2026 .cards img {
        width: 100%;
        height: auto;
        display: block;
        margin-bottom: 10px;
    }

.topic-2026 .card-title {
    margin: 0 0 8px;
}

.topic-2026 .card-excerpt {
    margin: 0;
}
/* Oceanus + News Room */
.topic-2026 .lower {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    gap: 40px;
    align-items: start;
}

.topic-2026 .research-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 22px;
}

.topic-2026 .feed-item {
    margin-bottom: 18px;
}
.newsroom h3, .newsroom h3 a {
    color: #041E42;
    font-size: 18px;
}
.topic-2026 .research-grid .research-item a {
    position: relative;
    height: 100%;
    display: block;
}
.newsroom .feed-date {
    color: #041E42;
}
.topic-2026 .research-grid .tp2026_oceanus_content {
    position: absolute;
    color: #fff;
    bottom: 0;
    padding: 0px 0px 10px 18px;
    width: calc(100% - 20px);
}

    .topic-2026 .feed-item h3 {
        margin: 2px 0;
    }
.topic-2026 .research-grid .tp2026_oceanus_content h3 {
    color: #fff;
    font-size:21px;
}
.topic-2026 .feed-date {
    font-size: 14px;
    text-transform: uppercase;
}

.topic-2026 .feed-block {
    margin-bottom: 30px;
}

    .topic-2026 .feed-block > .section-head {
        margin-bottom: 10px;
    }
/* Newsletter */
.topic-2026 .newsletter {
    background: #012a4a;
    color: #fff;
    text-align: center;
    padding: 56px 0;
}

    .topic-2026 .newsletter h2 {
        color: #fff;
    }


.newsletter h2 {
    font-size: 50px;
    text-transform: uppercase;
}

.newsletter p {
    font-size: 19px;
    font-weight: 500;
}

.newsletter .container {
    max-width: 1130px !important;
    margin: auto;
}

.hs-form fieldset {
    margin-bottom: 10px;
}

    .hs-form fieldset input {
        padding: 9px 10px;
        border-radius: 0px;
    }

.hs-form .hs-button.primary.large {
    color: #000;
    border: 0px;
    border-radius: 50px;
    padding: 14px 28px;
    margin-top: 20px;
}

.topic-2026 .newsletter .hs-form {
    max-width: 650px;
    margin: 24px auto 0;
}
/* Visible stubs for not-yet-supplied assets */
.topic-2026 .placeholder {
    border: 2px dashed #9bb3c4;
    background: #f3f7fa;
    color: #5a6b7a;
    padding: 22px;
    text-align: center;
    font-size: .9rem;
    border-radius: 4px;
}

.topic-2026 .section-blue .placeholder,
.topic-2026 .newsletter .placeholder {
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.45);
    color: #fff;
}
.section.news {
    background-color: #E7EFF2;
}
.topic-2026 fieldset {
    max-width: initial;
}

#email-316dbb6e-381f-4515-9b4c-1e82a0bf93c0 {
    width: 100%;
}

.no-list.hs-error-msgs.inputs-list {
    float: left;
    list-style: none;
    padding-left: 0;
}

.newsletter .hbspt-form fieldset {
    width: 100%;
    max-width: inherit;
}

    .newsletter .hbspt-form fieldset .no-list.hs-error-msgs.inputs-list {
        list-style: none;
        padding: 6px 0px;
    }

    .newsletter .hbspt-form fieldset #email-316dbb6e-381f-4515-9b4c-1e82a0bf93c0 {
        width: 100%;
    }

/* Responsive */
@media (max-width: 991px) {
    .topic-2026 .hero-grid, .topic-2026 .lower {
        grid-template-columns: 1fr;
    }

    .topic-2026 .cards {
        grid-template-columns: repeat(2,1fr);
    }
}

@media (max-width: 600px) {
    .topic-2026 .cards, .topic-2026 .research-grid {
        grid-template-columns: 1fr;
    }

    .topic-2026 .cta-rail {
        display: none;
    }
    /* hide the floating card on phones — it would cover content */
}