.met-services-directory {
    padding: 0 0 84px;
    background:
        radial-gradient(circle at 92% 4%, rgba(244, 200, 74, 0.16), transparent 24%),
        linear-gradient(180deg, #f7fafc 0%, #ffffff 42%);
}

.rcc-directory-heading {
    max-width: 760px;
    margin-bottom: 28px;
}

.rcc-directory-heading h2 {
    margin: 0 0 10px;
    color: var(--navy-900, #0a192f);
    font: 800 clamp(1.7rem, 4vw, 2.35rem)/1.2 'Manrope', sans-serif;
}

.rcc-directory-heading .format-text {
    color: var(--muted, #66717d);
}

.met-services-tools {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    margin-bottom: 28px;
    padding: 14px 18px;
    border: 1px solid var(--theme-border, #dce4ea);
    border-radius: var(--theme-border-radius, 5px);
    background: rgba(255, 255, 255, 0.92);
}

.met-services-search {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 12px;
}

.met-services-search svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: var(--primary-color, #0c447c);
    stroke-width: 1.8;
}

.met-services-search input {
    width: 100%;
    padding: 8px 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--navy-900, #0a192f);
    font: 600 0.95rem/1.4 'Manrope', sans-serif;
}

.met-services-count {
    flex: 0 0 auto;
    margin: 0;
    color: var(--muted, #66717d);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.met-services-count strong { color: var(--primary-color, #0c447c); }

.met-services-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.met-service-card {
    position: relative;
    display: grid;
    grid-template-rows: 130px 1fr;
    min-height: 275px;
    overflow: hidden;
    border: 1px solid var(--theme-border, #dce4ea);
    border-radius: var(--theme-border-radius, 5px);
    background: #fff;
    color: inherit;
    box-shadow: 0 10px 28px rgba(10, 25, 47, 0.06);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.met-service-card[hidden] {
    display: none !important;
}

.met-service-card:hover,
.met-service-card:focus-visible {
    transform: translateY(-4px);
    border-color: var(--primary-color, #0c447c);
    box-shadow: 0 18px 38px rgba(10, 25, 47, 0.13);
    color: inherit;
}

.met-service-logo {
    display: grid;
    place-items: center;
    padding: 22px 28px;
    border-bottom: 1px solid var(--theme-border, #e3e9ed);
    background: #f8fafb;
}

.met-service-logo img {
    width: 100%;
    height: 88px;
    object-fit: contain;
}

.met-service-logo > span {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: var(--primary-color-lightest, #eaf4f8);
    color: var(--primary-color, #0c447c);
    font-weight: 800;
    letter-spacing: 0.06em;
}

.met-service-content { padding: 22px 52px 24px 22px; }

.met-service-country {
    margin: 0 0 8px;
    color: var(--primary-color, #0c447c);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.met-service-content h3 {
    margin: 0;
    color: var(--navy-900, #0a192f);
    font: 700 1rem/1.4 'Manrope', sans-serif;
}

.met-service-acronym {
    margin: 8px 0 0;
    color: var(--muted, #66717d);
    font-size: 0.78rem;
    font-weight: 700;
}

.rcc-directory-location {
    margin: 8px 0 0;
    color: var(--muted, #66717d);
    font-size: 0.78rem;
}

.rcc-directory-status--demonstration {
    color: #a06400;
}

.rcc-directory-status--initiated { color: #39787b; }

.rcc-directory-layout {
    display: grid;
    grid-template-columns: minmax(310px, 0.82fr) minmax(0, 1.3fr);
    gap: 24px;
    align-items: stretch;
}

.rcc-directory-list-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 500px;
    padding: 16px;
    border: 1px solid var(--theme-border, #dce4ea);
    border-radius: max(8px, var(--border-radius, 8px));
    background: #fff;
    box-shadow: 0 18px 45px rgba(10, 25, 47, 0.08);
}

.rcc-directory-list-panel .met-services-tools {
    gap: 12px;
    margin-bottom: 14px;
    padding: 10px 12px;
}

.rcc-directory-list {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 8px;
    max-height: 428px;
    overflow-y: auto;
    padding-right: 4px;
    scrollbar-color: var(--theme-border, #dce4ea) transparent;
    scrollbar-width: thin;
}

.rcc-directory-list-item {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 28px;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--theme-border, #e3e9ed);
    border-radius: 8px;
    background: #fff;
    color: inherit;
    transition: border-color 180ms ease, background 180ms ease, transform 180ms ease;
}

.rcc-directory-list-item[hidden] { display: none !important; }

.rcc-directory-list-item:hover,
.rcc-directory-list-item:focus-visible {
    transform: translateX(3px);
    border-color: var(--primary-color, #0c447c);
    background: var(--primary-color-lightest, #f1f7fa);
    color: inherit;
}

.rcc-directory-list-logo {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 50%;
    background: #f5f8fa;
}

.rcc-directory-list-logo img {
    width: 38px;
    height: 38px;
    object-fit: contain;
}

.rcc-directory-list-logo > span {
    color: var(--primary-color, #0c447c);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.rcc-directory-list-content {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.rcc-directory-list-content strong {
    color: var(--navy-900, #0a192f);
    font: 700 0.86rem/1.32 'Manrope', sans-serif;
}

.rcc-directory-list-content > span {
    overflow: hidden;
    color: var(--muted, #66717d);
    font-size: 0.72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rcc-directory-list-content small {
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.rcc-directory-list-link {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: var(--primary-color, #0c447c);
    background: var(--primary-color-lightest, #eaf4f8);
}

.rcc-directory-list-link svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
}

.rcc-directory-map {
    position: relative;
    isolation: isolate;
    min-width: 0;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    padding: 22px 24px 17px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: max(8px, var(--border-radius, 8px));
    background:
        radial-gradient(circle at 48% 46%, rgba(18, 112, 97, 0.45), transparent 52%),
        linear-gradient(145deg, #0b3042, #071923);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 28px 70px rgba(0, 0, 0, 0.18);
}

.rcc-directory-map .regional-map-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.rcc-directory-map .regional-map-header > div { display: grid; gap: 3px; }
.rcc-directory-map .regional-map-header span:not(.regional-map-count) { color: rgba(255, 255, 255, 0.52); font-size: 0.64rem; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; }
.rcc-directory-map .regional-map-header strong { color: #fff; font-size: 0.94rem; letter-spacing: -0.01em; }
.rcc-directory-map .regional-map-count { flex: 0 0 auto; padding: 5px 9px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 999px; color: var(--yellow-400, #f4c84a); background: rgba(255, 255, 255, 0.045); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.rcc-directory-map .regional-map-canvas { flex: 1; min-height: 0; display: grid; place-items: center; padding: 8px 0 2px; }
.rcc-directory-map .regional-africa-map { width: auto; max-width: 100%; height: 405px; aspect-ratio: 28 / 27; overflow: visible; }
.rcc-directory-map .regional-africa-land,
.rcc-directory-map .regional-africa-island { fill: rgba(67, 184, 151, 0.18); stroke: rgba(117, 215, 187, 0.76); stroke-width: 0.8; vector-effect: non-scaling-stroke; }
.rcc-directory-map .regional-africa-island { opacity: 0.82; }
.rcc-directory-map .rcc-marker-pulse { fill: rgba(216, 90, 96, 0.12); stroke: rgba(216, 90, 96, 0.68); stroke-width: 0.7; }
.rcc-directory-map .rcc-marker-dot { fill: #d85a60; stroke: #fff; stroke-width: 0.7; transition: transform 0.18s ease; }
.rcc-directory-map .rcc-marker--demonstration .rcc-marker-pulse { fill: rgba(229, 165, 47, 0.12); stroke: rgba(229, 165, 47, 0.68); }
.rcc-directory-map .rcc-marker--demonstration .rcc-marker-dot { fill: #e5a52f; }
.rcc-directory-map .rcc-marker--initiated .rcc-marker-pulse { fill: rgba(95, 150, 152, 0.12); stroke: rgba(95, 150, 152, 0.68); }
.rcc-directory-map .rcc-marker--initiated .rcc-marker-dot { fill: #5f9698; }
.rcc-directory-map .rcc-marker--mixed .rcc-marker-pulse { stroke-dasharray: 2 1.5; }
.rcc-directory-map .rcc-map-link,
.rcc-directory-map .rcc-map-link .rcc-marker,
.rcc-directory-map .rcc-map-link .rcc-marker-pulse,
.rcc-directory-map .rcc-map-link .rcc-marker-dot,
.rcc-directory-map .rcc-map-link .rcc-marker-line,
.rcc-directory-map .rcc-map-link .rcc-marker text { cursor: pointer; }
.rcc-directory-map .rcc-map-link { outline: none; }
.rcc-directory-map .rcc-marker-line,
.rcc-directory-map .rcc-marker text { opacity: 0; transition: opacity 0.18s ease; }
.rcc-directory-map .rcc-map-link:hover .rcc-marker-line,
.rcc-directory-map .rcc-map-link:hover .rcc-marker text,
.rcc-directory-map .rcc-map-link:focus .rcc-marker-line,
.rcc-directory-map .rcc-map-link:focus .rcc-marker text,
.rcc-directory-map .rcc-marker--primary .rcc-marker-line,
.rcc-directory-map .rcc-marker--primary .rcc-marker-name { opacity: 1; }
.rcc-directory-map .rcc-map-link:hover .rcc-marker-dot,
.rcc-directory-map .rcc-map-link:focus .rcc-marker-dot { transform: scale(1.18); transform-box: fill-box; transform-origin: center; }
.rcc-directory-map .rcc-marker-line { fill: none; stroke: rgba(255, 255, 255, 0.42); stroke-width: 0.65; }
.rcc-directory-map .rcc-marker text { pointer-events: none; paint-order: stroke; stroke: #071f2e; stroke-width: 1.8px; stroke-linejoin: round; }
.rcc-directory-map .rcc-marker-name { fill: #fff; font: 800 5.5px/1 'Manrope', sans-serif; }
.rcc-directory-map .rcc-marker-place { fill: rgba(255, 255, 255, 0.7); font: 600 4.6px/1 'DM Sans', sans-serif; }
.rcc-directory-map .regional-map-legend { display: flex; flex-wrap: wrap; gap: 14px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, 0.09); }
.rcc-directory-map .regional-map-legend span { display: inline-flex; align-items: center; gap: 7px; color: rgba(255, 255, 255, 0.58); font-size: 0.64rem; font-weight: 700; }
.rcc-directory-map .regional-map-legend i { width: 8px; height: 8px; background: #d85a60; box-shadow: 0 0 0 3px rgba(216, 90, 96, 0.12); }
.rcc-directory-map .regional-map-legend i.is-network { border-radius: 50%; }
.rcc-directory-map .regional-map-legend i.is-centre { width: 10px; height: 9px; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.rcc-directory-map .regional-map-legend i.is-demonstration { background: #e5a52f; box-shadow: 0 0 0 3px rgba(229, 165, 47, 0.12); }
.rcc-directory-map .regional-map-legend i.is-initiated { background: #5f9698; box-shadow: 0 0 0 3px rgba(95, 150, 152, 0.12); }

.met-service-link-icon {
    position: absolute;
    right: 18px;
    bottom: 20px;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--primary-color-lightest, #eaf4f8);
    color: var(--primary-color, #0c447c);
}

.met-service-link-icon svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
}

.met-services-empty,
.met-services-no-results {
    grid-column: 1 / -1;
    padding: 56px 24px;
    text-align: center;
    border: 1px dashed var(--theme-border, #ccd7df);
    background: #fff;
}

.met-services-empty h3,
.met-services-no-results h3 { margin-bottom: 8px; }

.met-services-empty p,
.met-services-no-results p { margin: 0; color: var(--muted, #66717d); }

@media (max-width: 980px) {
    .met-services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rcc-directory-layout { grid-template-columns: 1fr; }
    .rcc-directory-list-panel { min-height: auto; }
    .rcc-directory-list { max-height: 390px; }
    .rcc-directory-map { min-height: 480px; }
}

@media (max-width: 620px) {
    .met-services-directory { padding: 0 0 58px; }
    .met-services-tools { align-items: stretch; flex-direction: column; gap: 8px; }
    .met-services-grid { grid-template-columns: 1fr; }
    .met-service-card { grid-template-columns: 118px 1fr; grid-template-rows: 1fr; min-height: 150px; }
    .met-service-logo { min-height: 150px; padding: 18px; border-right: 1px solid var(--theme-border, #e3e9ed); border-bottom: 0; }
    .met-service-logo img { height: 76px; }
    .met-service-content { align-self: center; padding: 22px 48px 22px 18px; }
    .rcc-directory-list-panel { padding: 12px; }
    .rcc-directory-list-panel .met-services-tools { flex-direction: row; align-items: center; }
    .rcc-directory-list-item { grid-template-columns: 42px minmax(0, 1fr) 26px; gap: 10px; padding: 10px; }
    .rcc-directory-list-logo { width: 42px; height: 42px; }
    .rcc-directory-list-logo img { width: 34px; height: 34px; }
    .rcc-directory-map { min-height: 430px; padding: 18px 15px 14px; }
    .rcc-directory-map .regional-map-header strong { font-size: 0.84rem; }
    .rcc-directory-map .regional-africa-map { height: 350px; }
}