/* Only the badge landing page owns these tokens and legacy-shell overrides. */
body.rcx-badge-program-page {
    --primary-color: #f5f5f5;
    --secondary-color: #b5b5b5;
    --bg-color: #171717;
    --text-color: #e5e5e5;
    --heading-color: #f5f5f5;
    --white: #202020;
    --bp-muted: #b5b5b5;
    --bp-border: #383838;
    background: var(--bg-color);
    color: var(--text-color);
    color-scheme: dark;
}

.rcx-badge-program-page .rcx-bp-page {
    padding: 40px 24px 64px;
}

.rcx-badge-program-page .rcx-badge-program {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    min-width: 0;
}

.rcx-badge-program-page .rcx-badge-program,
.rcx-badge-program-page .rcx-badge-program * {
    box-sizing: border-box;
}

.rcx-badge-program-page .rcx-bp-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    align-items: center;
    gap: 36px;
    padding: 36px;
    margin-bottom: 40px;
    background: #202020;
    border: 1px solid var(--bp-border);
    border-radius: 14px;
}

.rcx-badge-program-page .rcx-bp-hero-copy,
.rcx-badge-program-page .rcx-bp-hero-badge {
    min-width: 0;
}

.rcx-badge-program-page .rcx-bp-hero-kicker {
    display: block;
    margin-bottom: 16px;
    color: var(--bp-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
}

.rcx-badge-program-page .rcx-bp-hero h1 {
    margin: 0 0 18px;
    color: var(--heading-color);
    font-size: clamp(26px, 2.6vw, 34px);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.02em;
    overflow-wrap: anywhere;
}

.rcx-badge-program-page .rcx-bp-hero p,
.rcx-badge-program-page .rcx-bp-lead {
    margin: 0 0 22px;
    max-width: 72ch;
    color: var(--bp-muted);
    font-size: 15px;
    line-height: 1.85;
}

.rcx-badge-program-page .rcx-bp-hero-actions,
.rcx-badge-program-page .rcx-bp-result-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.rcx-badge-program-page :is(.rcx-bp-primary, .rcx-bp-hero-ghost, .rcx-bp-copy, .rcx-bp-result-actions a, .rcx-bp-result-actions button) {
    display: inline-flex;
    min-height: 44px;
    padding: 10px 18px;
    align-items: center;
    justify-content: center;
    border: 1px solid #555;
    border-radius: 8px;
    background: transparent;
    color: #f5f5f5;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

.rcx-badge-program-page :is(.rcx-bp-primary, .rcx-bp-copy, .rcx-bp-result-actions button) {
    border-color: #f5f5f5;
    background: #f5f5f5;
    color: #171717;
}

.rcx-badge-program-page :is(.rcx-bp-primary, .rcx-bp-copy, .rcx-bp-result-actions button):hover {
    border-color: #d4d4d4;
    background: #d4d4d4;
    color: #171717;
}

.rcx-badge-program-page :is(.rcx-bp-hero-ghost, .rcx-bp-result-actions a):hover {
    border-color: #b5b5b5;
    background: #303030;
    color: #fff;
}

.rcx-badge-program-page :is(a, button, input, summary):focus-visible {
    outline: 2px solid #f5f5f5;
    outline-offset: 4px;
}

.rcx-badge-program-page .rcx-bp-hero-badge {
    text-align: center;
}

.rcx-badge-program-page :is(.rcx-bp-hero-badge, .rcx-bp-preview) img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 10px;
}

.rcx-badge-program-page .rcx-bp-hero-badge img {
    margin-inline: auto;
}

.rcx-badge-program-page .rcx-bp-hero-badge span {
    display: block;
    margin-top: 14px;
    color: var(--bp-muted);
    font-size: 12px;
    line-height: 1.7;
}

.rcx-badge-program-page .rcx-bp-section {
    margin-bottom: 36px;
    padding: 28px;
    border: 1px solid var(--bp-border);
    border-radius: 12px;
    background: #1c1c1c;
    scroll-margin-top: 100px;
}

.rcx-badge-program-page .rcx-bp-section-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 14px;
    margin-bottom: 18px;
}

.rcx-badge-program-page .rcx-bp-section-heading h2 {
    margin: 0;
    color: var(--heading-color);
    font-size: 23px;
    font-weight: 650;
    line-height: 1.45;
}

.rcx-badge-program-page .rcx-bp-section-heading span {
    color: var(--bp-muted);
    font-size: 13px;
    line-height: 1.5;
}

.rcx-badge-program-page .rcx-bp-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.rcx-badge-program-page .rcx-bp-card {
    min-width: 0;
    padding: 22px;
    border: 1px solid var(--bp-border);
    border-radius: 9px;
    background: #242424;
}

.rcx-badge-program-page .rcx-bp-card h3 {
    margin: 0 0 12px;
    color: var(--heading-color);
    font-size: 17px;
    font-weight: 600;
    line-height: 1.5;
}

.rcx-badge-program-page .rcx-bp-card p {
    margin: 0;
    color: var(--bp-muted);
    font-size: 14px;
    line-height: 1.85;
}

.rcx-badge-program-page .rcx-bp-note {
    margin: 14px 0 0;
    color: var(--bp-muted);
    font-size: 13px;
    line-height: 1.85;
    overflow-wrap: anywhere;
}

.rcx-badge-program-page :is(.rcx-bp-note, .rcx-bp-lead, .rcx-bp-faq) code {
    padding: 2px 5px;
    border: 1px solid var(--bp-border);
    border-radius: 4px;
    background: #282828;
    color: #e5e5e5;
    font-size: .9em;
    overflow-wrap: anywhere;
}

.rcx-badge-program-page .rcx-bp-code-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--bp-border);
    border-radius: 9px;
    background: #121212;
}

.rcx-badge-program-page .rcx-bp-code {
    flex: 1 1 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #d4d4d4;
    font-family: SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 13px;
    line-height: 1.8;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.rcx-badge-program-page .rcx-bp-copy {
    position: static;
}

.rcx-badge-program-page :is(.rcx-bp-copy, .rcx-bp-result-actions button).rcx-bp-copied {
    border-color: #a3d9b3;
    background: #a3d9b3;
    color: #142218;
}

.rcx-badge-program-page .rcx-bp-search input {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 13px 16px;
    border: 1px solid #555;
    border-radius: 8px;
    background: #242424;
    color: #f5f5f5;
    font: inherit;
    font-size: 15px;
}

.rcx-badge-program-page .rcx-bp-search input::placeholder {
    color: #b5b5b5;
    opacity: 1;
}

.rcx-badge-program-page .rcx-bp-search-status {
    min-height: 1.5em;
    margin-top: 12px;
    color: var(--bp-muted);
    font-size: 13px;
    line-height: 1.7;
}

.rcx-badge-program-page .rcx-bp-search-results {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
}

.rcx-badge-program-page .rcx-bp-result {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--bp-border);
    border-radius: 8px;
    background: #242424;
}

.rcx-badge-program-page .rcx-bp-result-main {
    flex: 1 1 200px;
    min-width: 0;
    overflow-wrap: anywhere;
}

.rcx-badge-program-page .rcx-bp-result-main strong {
    display: block;
    margin-bottom: 4px;
    color: #f5f5f5;
    font-size: 16px;
    line-height: 1.5;
}

.rcx-badge-program-page .rcx-bp-result-main span {
    color: var(--bp-muted);
    font-size: 13px;
    line-height: 1.6;
}

.rcx-badge-program-page .rcx-bp-faq details {
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid var(--bp-border);
    border-radius: 8px;
    background: #242424;
}

.rcx-badge-program-page .rcx-bp-faq summary {
    position: relative;
    min-height: 48px;
    padding: 16px 44px 16px 18px;
    color: #f5f5f5;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.6;
    list-style: none;
    cursor: pointer;
}

.rcx-badge-program-page .rcx-bp-faq summary::-webkit-details-marker {
    display: none;
}

.rcx-badge-program-page .rcx-bp-faq summary::after {
    content: "+";
    position: absolute;
    top: 16px;
    right: 18px;
    color: #d4d4d4;
    font-size: 18px;
    font-weight: 400;
}

.rcx-badge-program-page .rcx-bp-faq details[open] summary::after {
    content: "−";
}

.rcx-badge-program-page .rcx-bp-faq details p {
    margin: 0;
    padding: 16px 18px;
    border-top: 1px solid var(--bp-border);
    color: var(--bp-muted);
    font-size: 14px;
    line-height: 1.85;
    overflow-wrap: anywhere;
}

.rcx-badge-program-page :is(.rcx-bp-contact, .rcx-bp-faq) a {
    color: #f5f5f5;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.rcx-badge-program-page .rcx-bp-contact {
    padding: 28px;
    border: 1px solid var(--bp-border);
    border-radius: 12px;
    background: #202020;
}

.rcx-badge-program-page .rcx-bp-contact strong {
    color: #f5f5f5;
    font-size: 17px;
}

.rcx-badge-program-page .rcx-bp-contact p {
    margin: 10px 0 0;
    color: var(--bp-muted);
    font-size: 14px;
    line-height: 1.85;
    overflow-wrap: anywhere;
}

/* Scope shell changes to this page. The shared header/footer stay untouched. */
.rcx-badge-program-page :is(.site-header, .site-footer, .mobile-bottom-nav) {
    border-color: var(--bp-border);
    background: #171717;
    color: #e5e5e5;
}

/* The legacy footer declares these colors important, so match it only here. */
.rcx-badge-program-page .site-footer {
    border-color: var(--bp-border) !important;
    background: #171717 !important;
    color: #b5b5b5 !important;
}

.rcx-badge-program-page :is(.footer-tagline, .footer-copyright) {
    color: #b5b5b5 !important;
}

.rcx-badge-program-page :is(.footer-nav-group h4, .footer-nav-group a, .footer-wechat-trigger, .footer-legal a) {
    color: #d4d4d4 !important;
}

.rcx-badge-program-page :is(.footer-nav-group a, .footer-wechat-trigger, .footer-legal a):hover,
.rcx-badge-program-page .footer-wechat-trigger:focus-visible {
    color: #fff !important;
}

.rcx-badge-program-page :is(.site-logo, .footer-logo) img {
    content: url("/brand/recodex-logo-dark.svg");
}

.rcx-badge-program-page :is(.nav-main-link, .nav-dropdown-trigger, .nav-international, .nav-x-btn, .nav-telegram-btn, .nav-search-btn, .footer-nav-group a, .footer-wechat-trigger, .footer-legal a, .mobile-nav-item) {
    color: #d4d4d4;
}

.rcx-badge-program-page :is(.nav-main-link, .nav-dropdown-trigger, .footer-nav-group a, .footer-legal a):hover {
    color: #fff;
}

.rcx-badge-program-page :is(.nav-dropdown-menu, .user-dropdown-content, .search-modal, .live-search-dropdown, .footer-wechat-popup) {
    border-color: var(--bp-border);
    background: #242424;
    color: #f5f5f5;
}

.rcx-badge-program-page :is(.nav-discover-item strong, .user-name-title, .user-dropdown-content a, .search-modal h3) {
    color: #f5f5f5;
}

.rcx-badge-program-page :is(.nav-discover-item small, .footer-tagline, .footer-description, .footer-copyright, .footer-wechat-hint) {
    color: #b5b5b5;
}

.rcx-badge-program-page :is(.nav-discover-icon, .search-field) {
    border-color: #555;
    background: #303030;
    color: #f5f5f5;
}

.rcx-badge-program-page .search-overlay {
    background: rgba(23, 23, 23, .96);
}

.rcx-badge-program-page .close-search {
    color: #f5f5f5;
}

.rcx-badge-program-page .search-form {
    border-color: #555;
}

.rcx-badge-program-page .search-field {
    min-width: 0;
    padding-inline: 10px;
}

.rcx-badge-program-page .site-header .nav-discover-menu .nav-discover-item:hover,
.rcx-badge-program-page .site-header .nav-discover-menu .nav-discover-item:focus-visible,
.rcx-badge-program-page .site-header .nav-discover-menu .nav-discover-item.active,
.rcx-badge-program-page .user-dropdown-content a:hover {
    background: #383838;
    color: #fff;
}

.rcx-badge-program-page .site-header .nav-discover-menu,
.rcx-badge-program-page .user-profile-menu .user-dropdown-content {
    border-color: var(--bp-border);
    background: #242424;
    color: #f5f5f5;
}

.rcx-badge-program-page .site-header .nav-discover-menu .nav-discover-item {
    color: #f5f5f5 !important;
}

.rcx-badge-program-page .site-nav a.nav-service-link {
    border-color: #555;
    background: #303030;
    color: #f5f5f5 !important;
    box-shadow: none;
    transform: none;
    filter: none;
}

.rcx-badge-program-page .site-nav a.nav-service-link::before {
    color: #f5f5f5;
}

.rcx-badge-program-page .site-nav .nav-main-link:hover,
.rcx-badge-program-page .site-nav .nav-main-link:focus-visible,
.rcx-badge-program-page .nav-discover:hover .nav-dropdown-trigger,
.rcx-badge-program-page .nav-discover:focus-within .nav-dropdown-trigger,
.rcx-badge-program-page .nav-discover.is-open .nav-dropdown-trigger {
    background: #303030;
    color: #fff;
}

.rcx-badge-program-page .nav-utility :is(.nav-international, .nav-x-btn, .nav-telegram-btn, .nav-search-btn) {
    color: #d4d4d4;
}

.rcx-badge-program-page .nav-utility :is(.nav-international, .nav-x-btn, .nav-telegram-btn, .nav-search-btn):hover {
    background: #303030;
    color: #fff;
}

.rcx-badge-program-page .nav-utility .nav-international {
    color: #d4d4d4 !important;
}

.rcx-badge-program-page .nav-utility .nav-international:hover {
    color: #fff !important;
}

.rcx-badge-program-page .nav-utility .nav-search-btn {
    background: #303030;
}

.rcx-badge-program-page .site-nav .nav-main-link:focus-visible,
.rcx-badge-program-page .nav-utility :is(a, button):focus-visible,
.rcx-badge-program-page .nav-dropdown-trigger:focus-visible {
    outline: 2px solid #f5f5f5;
    outline-offset: 4px;
}

.rcx-badge-program-page :is(.nav-utility-separator, .footer-bottom) {
    border-color: var(--bp-border);
}

.rcx-badge-program-page .nav-utility-separator {
    background: var(--bp-border);
}

@media (max-width: 900px) {
    .rcx-badge-program-page .rcx-bp-hero {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
    }

    .rcx-badge-program-page .rcx-bp-hero-badge {
        text-align: left;
    }

    .rcx-badge-program-page .rcx-bp-hero-badge img {
        margin-inline: 0;
    }

    .rcx-badge-program-page .rcx-bp-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    .rcx-badge-program-page .rcx-bp-page {
        padding: 24px 16px 40px;
    }

    .rcx-badge-program-page .rcx-bp-hero {
        padding: 24px 20px;
        margin-bottom: 24px;
    }

    .rcx-badge-program-page :is(.rcx-bp-section, .rcx-bp-contact) {
        margin-bottom: 24px;
        padding: 22px 18px;
    }

    .rcx-badge-program-page .rcx-bp-hero h1 {
        font-size: 26px;
    }

    .rcx-badge-program-page .rcx-bp-section-heading h2 {
        font-size: 21px;
    }

    .rcx-badge-program-page .rcx-bp-section {
        scroll-margin-top: 150px;
    }

    .rcx-badge-program-page .rcx-bp-hero-actions > a {
        flex: 1 1 140px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rcx-badge-program-page :is(a, button, .nav-dropdown-menu) {
        animation: none;
        transition: none;
    }
}