.bp5703-public-plans {
    padding: 44px 0 54px;
}

.bp5703-public-header {
    max-width: 760px;
    margin: 0 auto 28px;
    text-align: center;
}

.bp5703-public-header h1,
.bp5703-public-header h2 {
    margin: 0 0 10px;
    color: #062b4d;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.12;
}

.bp5703-public-header p {
    margin: 0;
    color: #597086;
    font-size: 16px;
}

.bp5703-plan-hero {
    position: relative;
    overflow: hidden;
    max-width: 760px;
    margin: 0 auto 26px;
    padding: 30px;
    color: #fff;
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(29, 207, 165, .30),
            transparent 36%
        ),
        linear-gradient(
            135deg,
            #245f86,
            #064766
        );
    border: 2px solid #25aee7;
    border-radius: 23px;
    box-shadow:
        0 18px 42px rgba(5, 48, 77, .17);
}

.bp5703-plan-badge {
    display: inline-flex;
    padding: 8px 14px;
    color: #07527a;
    background: #e5f7ff;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 900;
}

.bp5703-plan-hero h3 {
    margin: 20px 0 8px;
    color: #fff;
    font-size: 27px;
}

.bp5703-plan-price {
    margin: 4px 0 18px;
    color: #fff;
    font-size: clamp(42px, 6vw, 58px);
    font-weight: 950;
    line-height: 1;
}

.bp5703-plan-price small {
    margin-left: 6px;
    font-size: 14px;
    font-weight: 800;
}

.bp5703-plan-hero p {
    max-width: 600px;
    margin-bottom: 23px;
    color: #eefaff;
    font-size: 16px;
    line-height: 1.65;
}

.bp5703-public-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr);
    gap: 20px;
}

.bp5703-card {
    padding: 22px;
    background: #fff;
    border: 1px solid #dce7ef;
    border-radius: 18px;
    box-shadow:
        0 10px 30px rgba(4, 43, 70, .08);
}

.bp5703-card h2,
.bp5703-card h3 {
    margin-top: 0;
    color: #073e67;
}

.bp5703-table-wrap {
    overflow-x: auto;
}

.bp5703-table {
    width: 100%;
    border-collapse: collapse;
}

.bp5703-table th {
    padding: 11px 13px;
    color: #fff;
    text-align: left;
    background: #073f68;
}

.bp5703-table td {
    padding: 10px 13px;
    border-bottom: 1px solid #e3ebf1;
}

.bp5703-table tbody tr:nth-child(even) {
    background: #f7fafc;
}

.bp5703-info {
    margin-top: 14px;
    padding: 15px;
    color: #174a68;
    background: #eaf5ff;
    border: 1px solid #badcf4;
    border-radius: 12px;
}

.bp5703-example {
    margin-top: 14px;
    padding: 15px;
    color: #126146;
    background: #e9fbf4;
    border: 1px solid #afe7d2;
    border-radius: 12px;
}

.bp5703-admin {
    width: 100%;
}

.bp5703-admin-title {
    margin-bottom: 8px;
}

.bp5703-admin-subtitle {
    margin-top: 0;
    margin-bottom: 24px;
    color: #62778a;
}

.bp5703-admin input {
    box-sizing: border-box;
    width: 100%;
    min-width: 76px;
    padding: 10px;
    color: #072d4d;
    background: #fff;
    border: 1px solid #cbdbe6;
    border-radius: 9px;
}

.bp5703-admin-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}

.bp5703-button {
    padding: 12px 19px;
    border: 0;
    border-radius: 11px;
    font-weight: 900;
    cursor: pointer;
}

.bp5703-button-primary {
    color: #fff;
    background:
        linear-gradient(
            90deg,
            #087cf0,
            #18c99a
        );
}

.bp5703-button-secondary {
    color: #07527a;
    background: #eef7fc;
    border: 1px solid #c8dfea;
}

.bp5703-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 20px 0;
}

.bp5703-stat {
    padding: 18px;
    background: #fff;
    border: 1px solid #dce7ef;
    border-radius: 15px;
}

.bp5703-stat span {
    display: block;
    margin-bottom: 7px;
    color: #687d8d;
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
}

.bp5703-stat strong {
    color: #073f68;
    font-size: 24px;
}

.bp5703-status {
    display: inline-flex;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 850;
}

.bp5703-status-paid {
    color: #08704e;
    background: #dff8ed;
}

.bp5703-status-open {
    color: #936100;
    background: #fff2d4;
}

@media (max-width: 850px) {
    .bp5703-public-grid,
    .bp5703-stats {
        grid-template-columns: 1fr;
    }

    .bp5703-plan-hero,
    .bp5703-card {
        padding: 18px;
        border-radius: 16px;
    }

    .bp5703-table {
        font-size: 13px;
    }
}

/* BOLEPIX PLANOS V5703C — LEGIBILIDADE */

.bp5703-card {
    color: #17364f !important;
}

.bp5703-card p,
.bp5703-card li,
.bp5703-card div {
    color: #35566e;
}

.bp5703-table td {
    color: #17364f !important;
    opacity: 1 !important;
    font-weight: 500;
}

.bp5703-table td strong,
.bp5703-table td b {
    color: #073f68 !important;
    opacity: 1 !important;
}

.bp5703-table tbody tr {
    opacity: 1 !important;
}

.bp5703-table tbody tr:nth-child(odd) {
    background: #ffffff !important;
}

.bp5703-table tbody tr:nth-child(even) {
    background: #f4f8fb !important;
}

.bp5703-info {
    color: #174a68 !important;
}

.bp5703-example,
.bp5703-example b,
.bp5703-example strong {
    color: #126146 !important;
}

.bp5703-public-plans {
    color: #17364f;
}


/* BOLEPIX MENU PLANOS VISIVEL V5703G2 BEGIN */

@media (min-width: 901px) {
    .landing-top {
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        max-width: none !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
        gap: 8px !important;
        overflow: visible !important;
    }

    .landing-logo {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 195px !important;
        max-width: 225px !important;
        margin-right: auto !important;
    }

    #landingMenu.landing-menu {
        box-sizing: border-box !important;
        display: flex !important;
        flex: 0 1 auto !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 7px !important;
        min-width: 0 !important;
        max-width: calc(100vw - 230px) !important;
        overflow: visible !important;
        white-space: nowrap !important;
    }

    #landingMenu.landing-menu > button {
        box-sizing: border-box !important;
        display: inline-flex !important;
        flex: 0 1 auto !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 0 !important;
        width: auto !important;
        padding: 10px 12px !important;
        font-size: 13px !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /*
     * O quarto botão é Planos:
     * Início, Open Finance, Gestão, Planos.
     */
    #landingMenu.landing-menu > button:nth-child(4),
    #landingMenu.landing-menu >
        button[onclick*="/planos"] {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        flex-shrink: 0 !important;
    }

    .landing-menu-toggle {
        display: none !important;
    }
}

/*
 * Em largura menor, usa o menu hambúrguer para não ocultar itens.
 */
@media (max-width: 1160px) {
    .landing-menu-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .landing-top:not(.nav-open) #landingMenu {
        display: none !important;
    }

    .landing-top.nav-open #landingMenu {
        position: absolute !important;
        top: 100% !important;
        right: 12px !important;
        left: 12px !important;
        z-index: 99999 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        max-width: none !important;
        padding: 14px !important;
        background: #031f35 !important;
        border: 1px solid rgba(255,255,255,.16) !important;
        border-radius: 14px !important;
        box-shadow: 0 18px 42px rgba(0,0,0,.30) !important;
    }

    .landing-top.nav-open #landingMenu > button {
        display: flex !important;
        width: 100% !important;
        padding: 12px 14px !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* BOLEPIX MENU PLANOS VISIVEL V5703G2 END */

