/* BIOFIN: plain CSS, shared by every page. */
.finance-solutions-app {
    box-sizing: border-box;
    width: 100%;
    padding-bottom: 1px;
    background: #fff;
    color: #0f0f0f;
    /* font: 18px/1.5 "ProximaNova", Arial, sans-serif; */
}

.finance-solutions-app *, .finance-solutions-app *::before, .finance-solutions-app *::after {
    box-sizing: border-box;
}

.finance-solutions-app button, .finance-solutions-app input {
    font: inherit;
}

.finance-solutions-app button {
    cursor: pointer;
}

.finance-solutions-app a {
    color: inherit;
    text-decoration: none;
}

.finance-solutions-app a:hover {
    /* color: #c03a1d; */
}

.finance-solutions-app button:focus-visible, .finance-solutions-app a:focus-visible, .finance-solutions-app input:focus-visible, .finance-solutions-app summary:focus-visible {
    outline: 3px solid #c03a1d;
    outline-offset: 5px;
}

.finance-solutions-app img, .finance-solutions-app svg {
    max-width: 100%;
}

.finance-solutions-app h1, .finance-solutions-app h2, .finance-solutions-app h3, .finance-solutions-app p {
    margin: 0;
}

.finance-solutions-app h1 {
    font-size: 55px;
    line-height: 1.09;
    font-weight: 800;
    text-transform: none;
}

.finance-solutions-app h2 {
    font-size: 47px;
    line-height: 1.2;
    font-weight: 700;
}

.finance-solutions-app h3 {
    font-size: 26px;
    line-height: 1.2;
}

.finance-solutions-app ul, .finance-solutions-app ol {
    margin: 0;
    padding: 0;
}

.finance-solutions-app [hidden] {
    display: none !important;
}

/* Height of the sticky site header. Sticky and scrolled-to content has to clear
   it, so the offset is centralised here instead of being hardcoded per rule.
   The values below match the header's own breakpoints as a no-JS fallback;
   JS overrides this variable with the measured height at runtime, which also
   accounts for the admin bar and any later header resize. */
.finance-solutions-app {
    --undp-header-h: 115px;
}

/* The theme's generic .container is capped at 70%. The catalogue mock-up uses
   a wider editorial canvas, so restore that width only inside this feature. */
/* .finance-solutions-app .container {
    width: calc(100% - 160px);
    max-width: 1436px;
    padding-right: 0;
    padding-left: 0;
    margin-right: auto;
    margin-left: auto;
} */

@media (max-width: 1350px) {
    .finance-solutions-app {
        --undp-header-h: 90px;
    }
}

@media (min-width: 1600px) {
    .finance-solutions-app .container {
        width: calc(100% - 272px);
    }
}

@media (max-width: 1023px) {
    .finance-solutions-app {
        --undp-header-h: 75px;
    }
}

/* Anything that can be jumped to must clear the sticky header. Covers the
   tab panels (section[id]), the "At a glance" block, and the section headings
   the in-page navigation links to. */
.finance-solutions-app section[id],
.finance-solutions-app .glance[id],
.finance-solutions-app .detail-content h2[id] {
    scroll-margin-top: calc(var(--undp-header-h, 0px) + 28px);
}

.finance-solutions-app .page-intro {
    padding-top: 46px;
}

.finance-solutions-app .intro-row {
    display: flex;
    align-items: flex-end;
    gap: 60px;
}

.finance-solutions-app .intro-row > div {
    flex: 1;
}

.finance-solutions-app .intro-row h1 {
    max-width: 690px;
}

.finance-solutions-app .search-form {
    display: flex;
    width: 44%;
    min-width: 320px;
}

.finance-solutions-app .search-form input {
    flex: 1;
    min-width: 0;
    width: 100%;
    height: 58px;
    padding: 0 20px;
    border: 1px solid #0f0f0f;
    border-radius: 0;
    background: #fff;
    color: #0f0f0f;
    font-size: 17px;
    margin: 0
}

.finance-solutions-app .button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 0 28px;
    border: 1px solid #c03a1d;
    border-radius: 0;
    background: #c03a1d;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.finance-solutions-app .button:hover {
    background: #0f0f0f;
    border-color: #0f0f0f;
}

.finance-solutions-app .button span {
    font-size: 24px;
}

.finance-solutions-app .tabs {
    display: flex;
    gap: 34px;
    margin-top: 34px;
    border-bottom: 1px solid #d9d9d9;
}

.finance-solutions-app .tabs a {
    position: relative;
    padding-bottom: 20px;
    color: #6b6b6b;
    font-size: 20px;
    line-height: 1.3;
    font-weight: 600;
    background: none;
}

.finance-solutions-app .tabs a[aria-current], .finance-solutions-app .tabs a[aria-selected="true"] {
    color: #0f0f0f;
    font-weight: 700;
}

.finance-solutions-app .tabs a[aria-current]::after, .finance-solutions-app .tabs a[aria-selected="true"]::after {
    position: absolute;
    content: "";
    right: 0;
    bottom: -1px;
    left: 0;
    height: 4px;
    background: #dc4f3a;
}

.finance-solutions-app .tabs a:hover {
    color: #c03a1d;
}

.finance-solutions-app .tab-panel:focus {
    outline: none;
}

.finance-solutions-app .eyebrow {
    margin-bottom: 16px;
    color: #c03a1d;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
}

/* Category pages. The circles and their contents are regular HTML links. */
.finance-solutions-app .category-overview, .finance-solutions-app .category-page, .finance-solutions-app .countries-page, .finance-solutions-app .all-solutions {
    padding-top: 52px;
    padding-bottom: 96px;
}

.finance-solutions-app .section-intro {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 60px;
    padding-bottom: 34px;
    border-bottom: 1px solid #d9d9d9;
}

.finance-solutions-app .section-intro h2 {
    flex: 0 1 440px;
}

.finance-solutions-app .section-intro p {
    flex: 0 1 761px;
    color: #303030;
    font-size: 29px;
    line-height: 36px;
}

.finance-solutions-app .category-circles {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding: 74px 0 38px;
}

.finance-solutions-app .category-circle {
    /* --circle-size is set inline per category and scales with its solution count. */
    --circle-effective: var(--circle-size, 180px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: var(--circle-effective);
    height: var(--circle-effective);
    border-radius: 50%;
    text-align: center;
    margin-top: 72px;
}
.finance-solutions-app .category-circle:nth-child(even) {
    margin-top: 0;
    margin-bottom: 72px;
}

.finance-solutions-app .category-circle strong {
    font-family: "SohneBreit", Arial, sans-serif;
    font-weight: 800;
    line-height: 1;
    font-size: calc(var(--circle-effective) * 0.278);
}

.finance-solutions-app .category-circle span {
    margin-top: 4px;
    font-size: calc(var(--circle-effective) * 0.117);
    font-weight: 700;
    line-height: 1.1;
}

.finance-solutions-app .category-circle:hover {
    outline: 3px solid #0f0f0f;
    outline-offset: 5px;
    /* color: unset; */
}

.finance-solutions-app .category-protected-areas {
    margin-top: 72px;
    background: #1b4074;
    color: #fff;
}

.finance-solutions-app .category-protected-areas:hover, .finance-solutions-app .category-marine:hover {
    color: #fff;
}

.finance-solutions-app .category-forests {
    margin-bottom: 72px;
    background: #29cd9b;
}

.finance-solutions-app .category-marine {
    width: 147px;
    height: 147px;
    margin-top: 144px;
    background: #dc4f3a;
    color: #fff;
}

.finance-solutions-app .category-marine strong {
    font-size: 41px;
}

.finance-solutions-app .category-public-budgets {
    width: 208px;
    height: 208px;
    margin-bottom: 72px;
    background: #fceb4f;
}

.finance-solutions-app .category-public-budgets strong {
    font-size: 58px;
}

.finance-solutions-app .category-color-0 {
    background: #1b4074;
    color: #fff;
}

.finance-solutions-app .category-color-1 {
    background: #29cd9b;
    color: #0f0f0f;
}

.finance-solutions-app .category-color-2 {
    background: #dc4f3a;
    color: #fff;
}

.finance-solutions-app .category-color-3 {
    background: #fceb4f;
    color: #0f0f0f;
}

.finance-solutions-app .category-forests:hover, .finance-solutions-app .category-public-budgets:hover {
    color: #0f0f0f;
}

.finance-solutions-app .chart-caption {
    margin-top: 20px;
    color: #6b6b6b;
    text-align: center;
    font-size: 15px;
}

.finance-solutions-app .back-link {
    display: inline-block;
    margin-bottom: 30px;
    color: #6b6b6b;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    background: none;
}

.finance-solutions-app .subcategories {
    display: flex;
    align-items: flex-start;
    gap: 44px;
    margin: 44px 0;
    list-style: none;
}

.finance-solutions-app .subcategories li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    width: 170px;
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    line-height: 20px;
}

.finance-solutions-app .subcategory-count {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 86px;
    height: 86px;
    border-radius: 50%;
    background: #f7f7f7;
    font: 800 26px/1 "SohneBreit", Arial, sans-serif;
}

/* Filtering only hides existing list items; nothing is rendered by JavaScript. */
.finance-solutions-app .list-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 28px;
}

.finance-solutions-app .result-count {
    margin-top: 10px;
    font-size: 16px;
}

.finance-solutions-app .filter-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.finance-solutions-app .filter-buttons button, .finance-solutions-app .filter-buttons a {
    padding: 12px 22px;
    border: 1px solid #0f0f0f;
    border-radius: 0;
    background: #fff;
    color: #0f0f0f;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.finance-solutions-app .filter-buttons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.finance-solutions-app .filter-buttons button[aria-pressed="true"], .finance-solutions-app .filter-buttons button:hover, .finance-solutions-app .filter-buttons a[aria-current="true"], .finance-solutions-app .filter-buttons a:hover {
    background: #0f0f0f;
    color: #fff;
}

.finance-solutions-app .solution-list {
    list-style: none;
}

.finance-solutions-app .solution-row {
    border-bottom: 1px solid #d9d9d9;
}

.finance-solutions-app .solution-row a {
    display: flex;
    align-items: center;
    gap: 26px;
    padding: 20px 4px;
    background: none;
}

.finance-solutions-app .solution-row a:hover {
    background: #f7f7f7;
    color: #0f0f0f;
}

.finance-solutions-app .row-number {
    flex: 0 0 38px;
    color: #6b6b6b;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .06em;
}

.finance-solutions-app .solution-name {
    flex: 1;
    font-size: 20px;
    font-weight: 700;
    line-height: 27px;
}

.finance-solutions-app .solution-meta {
    flex: 0 1 290px;
    color: #6b6b6b;
    font-size: 15px;
    line-height: 21px;
}

.finance-solutions-app .finance-type {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 112px;
    color: #303030;
    font-size: 13px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.finance-solutions-app .finance-type::before {
    content: "";
    width: 9px;
    height: 9px;
    background: #1b4074;
}

.finance-solutions-app .finance-type.private::before {
    background: #dc4f3a;
}

.finance-solutions-app .finance-type.blended::before {
    background: #29cd9b;
}

.finance-solutions-app .row-arrow {
    font-size: 24px;
}

.finance-solutions-app .empty-message {
    border-bottom: 1px solid #d9d9d9;
    padding: 32px 0;
    color: #6b6b6b;
}

/* Server-rendered pagination for the All solutions catalogue. */
.finance-solutions-app .solution-pagination {
    margin-top: 36px;
}

.finance-solutions-app .solution-pagination ul.page-numbers {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0;
    list-style: none;
}

.finance-solutions-app .solution-pagination .page-numbers a,
.finance-solutions-app .solution-pagination .page-numbers span.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 16px;
    border: 1px solid #d9d9d9;
    background: #fff;
    color: #0f0f0f;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.finance-solutions-app .solution-pagination .page-numbers a:hover {
    border-color: #0f0f0f;
    background: #0f0f0f;
    color: #fff;
}

.finance-solutions-app .solution-pagination .page-numbers .current {
    border-color: #0f0f0f;
    background: #0f0f0f;
    color: #fff;
}

.finance-solutions-app .solution-pagination .page-numbers .dots {
    border-color: transparent;
    background: none;
    color: #6b6b6b;
}

.finance-solutions-app .solution-pagination .page-numbers .is-disabled {
    border-color: #ececec;
    color: #b8b8b8;
}

/* Static SVG map and static country panels. */
.finance-solutions-app .map-explorer {
    position: relative;
    margin-top: 34px;
    background: #eefbf8;
}

.finance-solutions-app .solution-country-map {
    position: relative;
    margin-top: 34px;
    background: #eefbf8;
}

/* Country view inside the map block's own panel (.undp-map-panel).
   Panel chrome (position, width, close button) belongs to the block; this only
   styles the catalogue's country content. */
.finance-solutions-app .undp-map-panel-country .country-panel {
    padding: 0;
}

.finance-solutions-app .country-panel .eyebrow {
    font-size:11px;letter-spacing:4px;font-weight:300;color:#555;text-transform:uppercase;margin-bottom:6px;
}

.finance-solutions-app .country-panel h2 {
    font-size:26px;font-weight:700;color:#1a1a1a;margin-bottom:18px;
}

.finance-solutions-app .country-panel-name {
    margin-bottom: 26px;
    color: #303030;
    font-size: 18px;
    line-height: 1.4;
}
.finance-solutions-app .undp-map-panel {
    width: 400px!important;
}
.finance-solutions-app .country-panel-back {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 0px;
    padding: 0;
    border: 0;
    background: none;
    color: #0f0f0f;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.finance-solutions-app .country-panel-back span {
    color: #dc4f3a;
    font-size: 22px;
    line-height: .8;
}

.finance-solutions-app .country-panel-back:hover {
    color: #c03a1d;
}

.finance-solutions-app .country-solution-list {
    list-style: none;
}

.finance-solutions-app .country-solution {
    border-bottom: 1px solid #d9d9d9;
    padding: 0;
    margin: 0;
}

.finance-solutions-app .country-solution a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 17px 0;
    background: none;
}

.finance-solutions-app .country-solution a:hover {
    background: #f7f7f7;
}

.finance-solutions-app .country-solution-swatch {
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    background: #1b4074;
}

.finance-solutions-app .country-solution-swatch.private {
    background: #dc4f3a;
}
.finance-solutions-app nav.breadcrumb.inviewport {
    margin-bottom: 20px;
}
.finance-solutions-app .country-solution-swatch.blended {
    background: #29cd9b;
}

.finance-solutions-app .country-solution .solution-name {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 23px;
}

.finance-solutions-app .country-solution-type {
    flex-shrink: 0;
    color: #949494;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.finance-solutions-app .country-solution .row-arrow {
    flex-shrink: 0;
    color: #6b6b6b;
    font-size: 12px;
    line-height: 1;
}

.finance-solutions-app .country-panel-empty,
.finance-solutions-app .country-panel-error p {
    padding: 22px 0;
    color: #6b6b6b;
}

/* Loading state on the shared panel while a country is fetched. */
.finance-solutions-app .undp-map-panel.is-loading::after {
    position: absolute;
    top: 18px;
    right: 52px;
    content: "";
    width: 18px;
    height: 18px;
    border: 2px solid #d9d9d9;
    border-top-color: #dc4f3a;
    border-radius: 50%;
    animation: undp-finance-spin .8s linear infinite;
}

@keyframes undp-finance-spin {
    to {
        transform: rotate(360deg);
    }
}

.finance-solutions-app .solution-country-map .wp-block-undp-countries-map {
    margin-bottom: 0;
}

.finance-solutions-app .map-explorer {
    min-height: 260px;
    padding: 48px 30px;
}

.finance-solutions-app .map-explorer .region-links {
    margin-top: 0;
}

.finance-solutions-app .country-directory {
    columns: 3;
    column-gap: 36px;
    margin-top: 0;
}

.finance-solutions-app .country-directory li {
    break-inside: avoid;
}

.finance-solutions-app .world-map {
    display: block;
    width: 100%;
    height: auto;
}

.finance-solutions-app .map-region line {
    stroke: #7a9eb2;
    stroke-width: 1.1;
    stroke-dasharray: 5 4;
}

.finance-solutions-app .map-label-dot {
    fill: #7a9eb2;
}

.finance-solutions-app .map-bubble {
    fill: rgba(252, 235, 79, .4);
    stroke: transparent;
    stroke-width: 2;
}

.finance-solutions-app .map-region text {
    fill: #171717;
    font: 700 14px "ProximaNova", Arial, sans-serif;
    letter-spacing: .005em;
}

.finance-solutions-app .map-region:hover .map-bubble, .finance-solutions-app .map-region:focus .map-bubble {
    fill: rgba(252, 235, 79, .66);
}

.finance-solutions-app .map-region.is-selected .map-bubble {
    fill: rgba(252, 235, 79, .66);
    stroke: #0f0f0f;
}

.finance-solutions-app .map-panel {
    position: relative;
    padding: 40px;
    background: #fff;
    border: 1px solid #d9d9d9;
}

.finance-solutions-app .map-panel h2 {
    margin-bottom: 14px;
    padding-right: 16px;
    font: 800 32px/1.15 "SohneBreit", Arial, sans-serif;
}

.finance-solutions-app .map-panel .eyebrow {
    padding-right: 15px;
    color: #6b6b6b;
    font-size: 13px;
    letter-spacing: .15em;
}

.finance-solutions-app .panel-subtitle {
    margin-bottom: 24px;
    font-size: 18px;
}

.finance-solutions-app .panel-close {
    position: absolute;
    top: 20px;
    right: 22px;
    padding: 0 6px;
    font-size: 28px;
    line-height: 32px;
}

.finance-solutions-app .country-list {
    margin-top: 24px;
    list-style: none;
}

.finance-solutions-app .country-list li {
    border-bottom: 1px solid #d9d9d9;
}

.finance-solutions-app .country-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 0;
    font-size: 17px;
    font-weight: 600;
}

.finance-solutions-app .country-list .muted {
    flex-shrink: 0;
    font-size: 13px;
    font-weight: 400;
}

.finance-solutions-app .map-panel .solution-row a {
    flex-wrap: wrap;
    gap: 8px;
}

.finance-solutions-app .map-panel .solution-name {
    flex-basis: calc(100% - 32px);
    font-size: 17px;
    line-height: 23px;
}

.finance-solutions-app .map-panel .row-number {
    display: none;
}

.finance-solutions-app .map-panel .row-arrow {
    margin-left: auto;
}

.finance-solutions-app .map-panel .back-link {
    margin-bottom: 6px;
}

.finance-solutions-app .map-enhanced .map-panel {
    position: absolute;
    top: 30px;
    right: 30px;
    z-index: 2;
    width: 440px;
    max-width: calc(100% - 60px);
    max-height: calc(100% - 60px);
    overflow-y: auto;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .14);
}

.finance-solutions-app .region-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 26px;
    margin-top: 26px;
}

.finance-solutions-app .region-links a {
    padding-bottom: 6px;
    border-bottom: 2px solid transparent;
    font-size: 15px;
    font-weight: 600;
    background: none;
}

.finance-solutions-app .region-links a span {
    display: block;
    color: #6b6b6b;
    font-size: 13px;
    font-weight: 400;
}

.finance-solutions-app .region-links a.is-selected {
    border-bottom-color: #dc4f3a;
}

/* Solution detail pages. Accordions use native details/summary elements. */
.finance-solutions-app .detail-header {
    padding-top: 26px;
}

.finance-solutions-app .breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 30px;
    color: #6b6b6b;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.finance-solutions-app .breadcrumbs [aria-current] {
    color: #0f0f0f;
}

.finance-solutions-app .detail-header h1 {
    max-width: 1100px;
    margin-bottom: 22px;
}

.finance-solutions-app .lede {
    max-width: 1100px;
    color: #303030;
    font-size: 29px;
    line-height: 36px;
}

.finance-solutions-app .glance {
    padding: 48px 50px;
    margin-top: 44px;
    background: #1b4074;
    color: #fff;
}

.finance-solutions-app .glance dl {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 38px;
    margin: 0;
}

.finance-solutions-app .glance dt {
    margin-bottom: 9px;
    color: #c1c1c1;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.finance-solutions-app .glance dd {
    margin: 0;
    font-size: 20px;
    line-height: 26px;
    font-weight: 700;
}

.finance-solutions-app .detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 250px;
    align-items: start;
    gap: 64px;
    padding-bottom: 100px;
}

.finance-solutions-app .detail-content {
    min-width: 0;
}

.finance-solutions-app .detail-content > .wp-block-group,
.finance-solutions-app .detail-section > * {
    width: 100%;
    max-width: none !important;
}

.finance-solutions-app .detail-section {
    padding-top: 52px;
}

.finance-solutions-app .detail-section h2 {
    margin-bottom: 22px;
    font-size: 36px;
    line-height: 1.15;
}

.finance-solutions-app .detail-section > p {
    margin-top: 24px;
}

.finance-solutions-app .detail-section p {
    line-height: 1.5;
}

.finance-solutions-app .two-column {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.finance-solutions-app .information-card, .finance-solutions-app .evidence-card {
    padding: 30px;
    background: #f7f7f7;
}

.finance-solutions-app .information-card .eyebrow {
    color: #0f0f0f;
    font-size: 14px;
}

.finance-solutions-app .information-card .accent {
    color: #c03a1d;
}

.finance-solutions-app .information-card .muted {
    color: #6b6b6b;
}

.finance-solutions-app .information-card ul {
    padding-left: 20px;
}

.finance-solutions-app .information-card li {
    margin-top: 16px;
    font-size: 16px;
    line-height: 24px;
}

.finance-solutions-app .information-card p, .finance-solutions-app .evidence-card p {
    font-size: 16px;
    line-height: 24px;
}

.finance-solutions-app .flow-chain {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
    margin: 0 0 28px;
    list-style: none;
}

.finance-solutions-app .flow-chain li {
    position: relative;
    padding: 18px;
    background: #1b4074;
    color: #fff;
}

.finance-solutions-app .flow-chain li:nth-child(2) {
    background: #29cd9b;
    color: #0f0f0f;
}

.finance-solutions-app .flow-chain li:nth-child(3) {
    background: #fceb4f;
    color: #0f0f0f;
}

.finance-solutions-app .flow-chain li:nth-child(4) {
    background: #f7f7f7;
    color: #0f0f0f;
}

.finance-solutions-app .flow-chain li:last-child {
    background: #0f0f0f;
}

.finance-solutions-app .flow-chain li + li::before {
    /* Drawn as an inline SVG (data URI) instead of a text glyph so it never
       depends on font/encoding support. Change stroke='%23dc4f3a' to recolour. */
    position: absolute;
    top: calc(50% - 9px);
    left: -14px;
    width: 10px;
    height: 18px;
    content: "";
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='18' viewBox='0 0 10 18'%3E%3Cpath d='M1 1l8 8-8 8' stroke='%23dc4f3a' stroke-width='2.5' fill='none'/%3E%3C/svg%3E") center / contain no-repeat;
}

.finance-solutions-app .flow-chain span {
    display: block;
    margin-bottom: 8px;
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.finance-solutions-app .flow-chain strong {
    display: block;
    font-size: 15px;
    line-height: 20px;
}

.finance-solutions-app .results-list ul {
    list-style: none;
}

.finance-solutions-app .results-list li {
    position: relative;
    padding-left: 34px;
    margin-bottom: 14px;
}

.finance-solutions-app .results-list li::before {
    content: "\2713";
    position: absolute;
    top: 3px;
    left: 0;
    width: 20px;
    height: 20px;
    background: #000;
    color: #fff;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
}

.finance-solutions-app .observed-result {
    padding: 20px 24px;
    background: #fceb4f;
    font-size: 17px;
}

.finance-solutions-app .gbf-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.finance-solutions-app .gbf-card {
    padding: 28px 26px;
    background: #29cd9b;
}

.finance-solutions-app .gbf-card:nth-child(2) {
    background: #fceb4f;
}

.finance-solutions-app .gbf-card:nth-child(3) {
    background: #f7f7f7;
}

.finance-solutions-app .gbf-card strong {
    display: block;
    margin-bottom: 16px;
    font: 800 52px/1 "SohneBreit", Arial, sans-serif;
}

.finance-solutions-app .gbf-card p {
    font-size: 15px;
    line-height: 22px;
}

.finance-solutions-app .marker {
    display: block;
    margin-bottom: 14px;
    font: 800 32px/1.2 "SohneBreit", Arial, sans-serif;
    overflow-wrap: anywhere;
}

.finance-solutions-app .implementation {
    margin-top: 70px;
    padding: 44px 36px;
    background: #000;
    color: #fff;
}

.finance-solutions-app .implementation > p {
    margin: 0 0 32px;
    color: #c1c1c1;
}

.finance-solutions-app .accordion {
    border-top: 1px solid #949494;
}

.finance-solutions-app .accordion:last-child {
    border-bottom: 1px solid #949494;
}

.finance-solutions-app .accordion summary {
    position: relative;
    padding: 20px 32px 20px 0;
    cursor: pointer;
    font-size: 24px;
    line-height: 1.4;
    list-style: none;
}

.finance-solutions-app .accordion summary::-webkit-details-marker {
    display: none;
}

.finance-solutions-app .accordion summary::after {
    position: absolute;
    top: 20px;
    right: 0;
    content: "+";
}

.finance-solutions-app .accordion[open] summary::after {
    content: "\2212";
}

.finance-solutions-app .accordion-number {
    margin-right: 20px;
    color: #c1c1c1;
    font-size: 14px;
}

.finance-solutions-app .accordion p {
    padding: 0 0 26px 40px;
    color: #c1c1c1;
    font-size: 17px;
}

/* Finance Solution implementation accordion.
 * This overrides the shared UNDP accordion only inside this template, so the
 * block keeps its existing appearance everywhere else in the theme. */
.finance-solutions-app .implementation .wp-block-undp-accordion {
    margin: 28px 0 0;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion {
    padding: 0;
    margin: 0;
    border-top: 1px solid #949494;
    border-bottom: 1px solid #949494;
    list-style: none;
    background: none;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion > li {
    padding: 0;
    margin: 0;
    border: 0;
    border-bottom: 1px solid #949494;
    list-style: none;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion > li:last-child {
    border-bottom: 0;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion > li > button {
    position: relative;
    display: block;
    width: 100%;
    min-height: 72px;
    padding: 20px 52px 20px 0;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.35;
    text-align: left;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion > li > button::after {
    position: absolute;
    top: 50%;
    right: 4px;
    content: "+";
    color: #fff;
    font-size: 30px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-50%);
    display: none;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion > li > button.accordion--active::after {
    content: "\2212";
    display: none;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion__panel {
    padding: 0 52px 24px 0;
    background: transparent;
    color: #c1c1c1;
}

.finance-solutions-app .implementation .wp-block-undp-accordion .accordion__panel p {
    padding: 0;
    margin: 0;
    color: inherit;
    font-size: 17px;
    line-height: 1.55;
}

.finance-solutions-app .evidence-card h3 {
    margin-bottom: 14px;
}

.finance-solutions-app .evidence-card .eyebrow {
    font-size: 13px;
}

.finance-solutions-app .related-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.finance-solutions-app .related-links a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    background: #f7f7f7;
    font-size: 16px;
    font-weight: 700;
}

.finance-solutions-app .related-links a:hover {
    background: #fceb4f;
    color: #0f0f0f;
}

.finance-solutions-app .resource-list {
    list-style: none;
}

.finance-solutions-app .resource-list li {
    padding: 16px 0;
    border-bottom: 1px solid #d9d9d9;
}

.finance-solutions-app .page-navigation {
    position: sticky;
    /* Clears the sticky site header, plus a little breathing room. */
    top: calc(var(--undp-header-h, 0px) + 28px);
    padding-top: 52px;
}

.finance-solutions-app .page-navigation h2 {
    padding-bottom: 20px;
    border-bottom: 1px solid #d9d9d9;
    color: #6b6b6b;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.finance-solutions-app .page-navigation ol {
    padding-top: 20px;
    list-style: none;
}
.finance-solutions-app .page-navigation li {
    padding: 0;
}

.finance-solutions-app .page-navigation a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 0 9px 13px;
    border-left: 3px solid transparent;
    color: #6b6b6b;
    font-size: 16px;
    line-height: 22px;
    background: none;
}

.finance-solutions-app .page-navigation a[aria-current] {
    color: #0f0f0f;
    border-left-color: #dc4f3a;
    font-weight: 700;
}

.finance-solutions-app .page-navigation a span {
    width: 16px;
    color: #6b6b6b;
    font-size: 12px;
    font-weight: 600;
}

.finance-solutions-app .print-button {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    margin-top: 22px;
    border: 0;
    background: none;
    color: #0f0f0f;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
}

@media (min-width: 1600px) {
    /* .finance-solutions-app .container {
        width: calc(100% - 272px);
    } */

    .finance-solutions-app .site-nav {
        gap: 40px;
    }
}

@media (max-width: 1200px) {
    /* .finance-solutions-app .container {
        width: calc(100% - 80px);
    } */

    .finance-solutions-app .header-inner {
        padding: 0 28px;
        gap: 20px;
    }

    .finance-solutions-app .site-nav {
        gap: 16px;
        font-size: 13px;
    }

    .finance-solutions-app .language {
        padding-left: 16px;
    }

    .finance-solutions-app .logo {
        flex-basis: 200px;
    }

    .finance-solutions-app .logo img {
        width: 200px;
        height: auto;
    }

    .finance-solutions-app h1 {
        font-size: 44px;
    }

    .finance-solutions-app h2 {
        font-size: 38px;
    }

    .finance-solutions-app .intro-row {
        gap: 36px;
    }

    .finance-solutions-app .section-intro {
        gap: 36px;
    }

    .finance-solutions-app .section-intro p, .finance-solutions-app .lede {
        font-size: 24px;
        line-height: 32px;
    }

    .finance-solutions-app .list-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .finance-solutions-app .solution-meta {
        flex-basis: 230px;
    }

    .finance-solutions-app .detail-layout {
        grid-template-columns: minmax(0, 1fr) 210px;
        gap: 32px;
    }

    .finance-solutions-app .detail-section h2 {
        font-size: 30px;
    }

    .finance-solutions-app .flow-chain {
        grid-template-columns: 1fr;
    }

    .finance-solutions-app .flow-chain li + li::before {
        /* Stacked layout: same chevron, redrawn pointing down. */
        top: -14px;
        left: 50%;
        width: 18px;
        height: 10px;
        transform: translateX(-50%);
        content: "";
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='10' viewBox='0 0 18 10'%3E%3Cpath d='M1 1l8 8 8-8' stroke='%23dc4f3a' stroke-width='2.5' fill='none'/%3E%3C/svg%3E");
    }

    .finance-solutions-app .information-card, .finance-solutions-app .evidence-card {
        padding: 22px;
    }

    .finance-solutions-app .gbf-grid {
        gap: 12px;
    }

    .finance-solutions-app .gbf-card {
        padding: 20px;
    }

    .finance-solutions-app .marker {
        font-size: 25px;
    }
}

@media (max-width: 900px) {
    .finance-solutions-app .header-inner {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0;
        padding-bottom: 18px;
    }

    .finance-solutions-app .site-nav {
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px 20px;
        margin: 0;
    }

    .finance-solutions-app .language {
        padding: 0 0 0 16px;
    }

    .finance-solutions-app .intro-row {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
    }

    .finance-solutions-app .search-form {
        width: 100%;
        min-width: 0;
    }

    .finance-solutions-app .section-intro {
        flex-direction: column;
        gap: 20px;
    }

    .finance-solutions-app .section-intro h2, .finance-solutions-app .section-intro p {
        flex: auto;
    }

    .finance-solutions-app .category-circles {
        display: grid;
        grid-template-columns: repeat(2, 208px);
        justify-items: center;
        align-items: center;
        gap: 28px;
        padding: 44px 0 24px;
    }

    .finance-solutions-app .category-circle {
        margin: 0;
    }

    .finance-solutions-app .map-enhanced .map-panel {
        position: relative;
        top: auto;
        right: auto;
        width: 100%;
        max-width: none;
        max-height: 560px;
        box-shadow: none;
    }

    /* The map block turns its own panel into a full-width block on smaller
       screens (see .map-enhanced .map-panel), so the country content just
       follows that. */
    .finance-solutions-app .undp-map-panel-country {
        max-height: 560px;
        overflow-y: auto;
    }

    .finance-solutions-app .undp-map-panel.is-loading::after {
        top: 14px;
        right: 44px;
    }

    .finance-solutions-app .detail-layout {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .finance-solutions-app .detail-content {
        width: 100%;
    }

    .finance-solutions-app .page-navigation {
        position: static;
        order: -1;
        width: 100%;
        padding-top: 28px;
    }

    .finance-solutions-app .page-navigation ol {
        display: flex;
        flex-wrap: wrap;
        gap: 4px 18px;
    }

    .finance-solutions-app .page-navigation a {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .finance-solutions-app .glance {
        padding: 32px;
    }

    .finance-solutions-app .glance dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px;
    }
}

@media (max-width: 600px) {
    .finance-solutions-app {
        font-size: 17px;
    }

    /* .finance-solutions-app .container {
        width: calc(100% - 36px);
    } */

    .finance-solutions-app .header-inner {
        padding: 0 18px 18px;
    }

    .finance-solutions-app .site-nav {
        font-size: 12px;
        gap: 10px 14px;
    }

    .finance-solutions-app h1 {
        font-size: 36px;
    }

    .finance-solutions-app h2 {
        font-size: 30px;
    }

    .finance-solutions-app .page-intro {
        padding-top: 32px;
    }

    .finance-solutions-app .eyebrow {
        font-size: 14px;
    }

    .finance-solutions-app .button {
        padding: 0 18px;
        font-size: 13px;
    }

    .finance-solutions-app .search-form input {
        padding: 0 12px;
        font-size: 16px;
    }

    .finance-solutions-app .tabs {
        gap: 22px;
    }

    .finance-solutions-app .tabs a {
        font-size: 17px;
        padding-bottom: 16px;
    }

    .finance-solutions-app .category-overview, .finance-solutions-app .category-page, .finance-solutions-app .countries-page, .finance-solutions-app .all-solutions {
        padding-top: 32px;
        padding-bottom: 56px;
    }

    .finance-solutions-app .section-intro p, .finance-solutions-app .lede {
        font-size: 20px;
        line-height: 28px;
    }

    .finance-solutions-app .category-circles {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 22px 14px;
    }

    .finance-solutions-app .category-circle {
        /* Scale down, but never wider than one grid cell (2 columns, 14px gap,
           container = min(90vw, 100vw - 36px) minus 30px side padding each side). */
        --circle-effective: min(
            calc(var(--circle-size, 180px) * 0.78),
            calc((min(90vw, 100vw - 36px) - 74px) / 2)
        );
        max-width: 100%;
    }

    .finance-solutions-app .category-marine {
        width: 114px;
        height: 114px;
    }

    .finance-solutions-app .category-public-budgets {
        width: 156px;
        height: 156px;
    }

    .finance-solutions-app .subcategories {
        flex-wrap: wrap;
        gap: 24px;
    }

    .finance-solutions-app .subcategories li {
        width: calc(50% - 12px);
    }

    .finance-solutions-app .filter-buttons {
        gap: 8px;
    }

    .finance-solutions-app .filter-buttons button, .finance-solutions-app .filter-buttons a {
        padding: 12px 14px;
        font-size: 12px;
    }

    .finance-solutions-app .solution-pagination {
        margin-top: 28px;
    }

    .finance-solutions-app .solution-pagination .page-numbers a,
    .finance-solutions-app .solution-pagination .page-numbers span.page-numbers {
        min-width: 38px;
        height: 38px;
        padding: 0 12px;
        font-size: 12px;
    }

    .finance-solutions-app .solution-row a {
        display: grid;
        grid-template-columns: 26px minmax(0, 1fr) 24px;
        gap: 10px;
        padding: 18px 0;
    }

    .finance-solutions-app .row-number {
        grid-column: 1;
        grid-row: 1;
    }

    .finance-solutions-app .solution-name {
        grid-column: 2;
        grid-row: 1;
        font-size: 18px;
        line-height: 24px;
    }

    .finance-solutions-app .row-arrow {
        grid-column: 3;
        grid-row: 1;
    }

    .finance-solutions-app .finance-type {
        grid-column: 2;
        grid-row: 2;
        font-size: 12px;
    }

    .finance-solutions-app .solution-meta {
        grid-column: 2;
        grid-row: 3;
        font-size: 14px;
    }

    .finance-solutions-app .map-panel {
        padding: 30px 22px;
    }

    .finance-solutions-app .map-panel h2 {
        font-size: 26px;
    }

    .finance-solutions-app .map-panel .solution-row a {
        display: flex;
    }

    .finance-solutions-app .region-links {
        justify-content: flex-start;
    }

    .finance-solutions-app .region-links a {
        flex-basis: calc(50% - 13px);
    }

    .finance-solutions-app .glance {
        padding: 26px 22px;
        margin-top: 28px;
    }

    .finance-solutions-app .glance dl {
        gap: 26px 20px;
    }

    .finance-solutions-app .glance dd {
        font-size: 17px;
        line-height: 23px;
    }

    .finance-solutions-app .glance dt {
        font-size: 12px;
    }

    .finance-solutions-app .detail-section {
        padding-top: 40px;
    }

    .finance-solutions-app .detail-section h2 {
        font-size: 28px;
    }

    .finance-solutions-app .two-column, .finance-solutions-app .gbf-grid {
        grid-template-columns: 1fr;
    }

    .finance-solutions-app .implementation {
        padding: 30px 22px;
        margin-top: 40px;
    }

    .finance-solutions-app .accordion summary {
        font-size: 21px;
    }

    .finance-solutions-app .accordion-number {
        margin-right: 12px;
    }

    .finance-solutions-app .accordion p {
        padding-left: 0;
    }

    .finance-solutions-app .marker {
        font-size: 32px;
    }

    .finance-solutions-app .breadcrumbs {
        font-size: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .finance-solutions-app {
        scroll-behavior: auto;
    }
}

@media print {
    @page {
        margin: 16mm;
    }

    .finance-solutions-app {
        font-size: 11pt;
    }

    .finance-solutions-app .site-header, .finance-solutions-app .page-navigation, .finance-solutions-app .search-form, .finance-solutions-app .tabs, .finance-solutions-app .filter-buttons, .finance-solutions-app .solution-pagination, .finance-solutions-app .panel-close, .finance-solutions-app .skip-link {
        display: none !important;
    }

    /* .finance-solutions-app .container {
        width: 100%;
        max-width: none;
    } */

    .finance-solutions-app .detail-layout {
        display: block;
    }

    .finance-solutions-app .detail-section {
        padding-top: 24px;
    }

    .finance-solutions-app h1 {
        font-size: 28pt;
    }

    .finance-solutions-app h2, .finance-solutions-app .detail-section h2 {
        font-size: 18pt;
    }

    .finance-solutions-app .lede {
        font-size: 14pt;
        line-height: 1.4;
    }

    .finance-solutions-app .glance, .finance-solutions-app .information-card, .finance-solutions-app .evidence-card, .finance-solutions-app .gbf-card, .finance-solutions-app .flow-chain li, .finance-solutions-app .observed-result {
        break-inside: avoid;
    }

    .finance-solutions-app .glance, .finance-solutions-app .implementation {
        border: 1px solid #949494;
        background: #fff;
        color: #000;
        padding: 20px;
    }

    .finance-solutions-app .glance dt, .finance-solutions-app .implementation p, .finance-solutions-app .accordion p, .finance-solutions-app .accordion-number {
        color: #303030;
    }

    .finance-solutions-app .accordion summary::after {
        display: none;
    }

    .finance-solutions-app .map-enhanced .map-panel {
        position: static;
        width: 100%;
        max-width: none;
        max-height: none;
        overflow: visible;
        box-shadow: none;
    }

    .finance-solutions-app .undp-map-panel-country {
        max-height: none;
        overflow: visible;
    }

    .finance-solutions-app .undp-map-panel.is-loading::after {
        top: 12px;
        right: 40px;
    }

    .finance-solutions-app .country-panel h2 {
        font-size: 30px;
    }

    .finance-solutions-app .country-solution .solution-name {
        font-size: 16px;
        line-height: 22px;
    }

    .finance-solutions-app .country-solution-type {
        font-size: 12px;
    }
}

@media (max-width: 600px) {
    .finance-solutions-app .implementation .wp-block-undp-accordion .accordion > li > button {
        min-height: 64px;
        padding: 17px 42px 17px 0;
        font-size: 20px;
    }

    .finance-solutions-app .implementation .wp-block-undp-accordion .accordion__panel {
        padding-right: 0;
    }
}